feat(ui): go back to the listing after article status update

ncarlier · May 8, 2019 · a1f3509 · a1f3509
1 parent cccd240
commit a1f3509
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 3 deletions.
diff --git a/ui/src/articles/ArticlePage.tsx b/ui/src/articles/ArticlePage.tsx
@@ -23,7 +23,7 @@ interface Props {
 
 type AllProps = Props & RouteComponentProps<{ id: string }>
 
-export default ({ category, match }: AllProps) => {
+export default ({ category, match, history }: AllProps) => {
   const { id } = match.params
 
   let title = 'Articles to read'
@@ -56,7 +56,7 @@ export default ({ category, match }: AllProps) => {
               <ArticleMenu article={article} />
             </ArticleHeader>
             <ArticleContent article={article} />
-            <MarkAsButton article={article} floating />
+            <MarkAsButton article={article} floating onSuccess={() => history.push(redirect)} />
           </>
         ) : (
           <ErrorPanel title="Not found">Article #{id} not found.</ErrorPanel>

diff --git a/ui/src/articles/components/MarkAsButton.tsx b/ui/src/articles/components/MarkAsButton.tsx
@@ -11,12 +11,13 @@ import { UpdateArticleStatus } from '../queries'
 interface Props {
   article: Article
   floating?: boolean
+  onSuccess?: (article: Article) => void
 }
 
 type AllProps = Props & IMessageDispatchProps
 
 export const MarkAsButton = (props: AllProps) => {
-  const { article, floating = false, showMessage } = props
+  const { article, floating = false, showMessage, onSuccess } = props
 
   const [loading, setLoading] = useState(false)
   const updateArticleStatusMutation = useMutation<UpdateArticleStatusRequest>(UpdateArticleStatus)
@@ -29,6 +30,7 @@ export const MarkAsButton = (props: AllProps) => {
         // update: updateCacheAfterUpdateStatus
       })
       if (floating) setLoading(false)
+      if (onSuccess) onSuccess(article)
     } catch (err) {
       setLoading(false)
       showMessage(getGQLError(err), true)