Fix code review

cofacts · May 27, 2020 · 3a8142f · MrOrz · May 27, 2020 · 3a8142f
1 parent 0d99197
commit 3a8142f
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 10 deletions.
diff --git a/components/NewReplySection/index.js b/components/NewReplySection/index.js
@@ -1,9 +1,9 @@
-import { useState, useCallback, useContext } from 'react';
+import { useCallback, useContext } from 'react';
 import { useMutation } from '@apollo/react-hooks';
 import gql from 'graphql-tag';
 import { t } from 'ttag';
 
-import { Box, Snackbar } from '@material-ui/core';
+import { Box } from '@material-ui/core';
 
 import useCurrentUser from 'lib/useCurrentUser';
 import Desktop from './Desktop';
@@ -63,10 +63,10 @@ const NewReplySection = withContext(
     existingReplyIds,
     relatedArticles,
     onSubmissionComplete,
+    setFlashMessage,
     onClose,
   }) => {
     const { fields, handlers } = useContext(ReplyFormContext);
-    const [flashMessage, setFlashMessage] = useState(0);
     const currentUser = useCurrentUser();
 
     const [createReply, { loading: creatingReply }] = useMutation(
@@ -148,11 +148,6 @@ const NewReplySection = withContext(
         <Box display={{ xs: 'block', md: 'none' }}>
           <Mobile onClose={onClose} article={article} {...sharedProps} />
         </Box>
-        <Snackbar
-          open={!!flashMessage}
-          onClose={() => setFlashMessage('')}
-          message={flashMessage}
-        />
       </form>
     );
   }

diff --git a/pages/article/[id].js b/pages/article/[id].js
@@ -2,7 +2,7 @@ import gql from 'graphql-tag';
 import Link from 'next/link';
 import { useEffect, useRef, useCallback, useState } from 'react';
 import { makeStyles } from '@material-ui/core/styles';
-import { Box, Divider } from '@material-ui/core';
+import { Box, Divider, Snackbar } from '@material-ui/core';
 import { ngettext, msgid, t } from 'ttag';
 
 import { useRouter } from 'next/router';
@@ -67,7 +67,7 @@ const useStyles = makeStyles(theme => ({
   },
   newReplyContainer: {
     position: 'fixed',
-    zIndex: 20,
+    zIndex: theme.zIndex.modal,
     height: '100%',
     width: '100%',
     top: 0,
@@ -173,6 +173,7 @@ const LOAD_ARTICLE_FOR_USER = gql`
 function ArticlePage() {
   const { query } = useRouter();
   const [showForm, setShowForm] = useState(false);
+  const [flashMessage, setFlashMessage] = useState(0);
   const articleVars = { id: query.id };
 
   const { data, loading } = useQuery(LOAD_ARTICLE, {
@@ -317,6 +318,7 @@ function ArticlePage() {
                 relatedArticles={article?.relatedArticles}
                 onSubmissionComplete={handleNewReplySubmit}
                 onClose={() => setShowForm(false)}
+                setFlashMessage={setFlashMessage}
               />
             </div>
           )}
@@ -364,6 +366,11 @@ function ArticlePage() {
           )}
         </div>
       </div>
+      <Snackbar
+        open={!!flashMessage}
+        onClose={() => setFlashMessage('')}
+        message={flashMessage}
+      />
     </AppLayout>
   );
 }