fixed postpage and postslist sharing button click

uofa-cmput404 · Nov 29, 2023 · 1820def · 1820def
1 parent de6ab31
commit 1820def
Show file tree

Hide file tree

Showing 3 changed files with 42 additions and 30 deletions.
diff --git a/client/src/components/post/PostsList.tsx b/client/src/components/post/PostsList.tsx
@@ -51,8 +51,8 @@ const PostsList = ({
   const [postToComment, setPostToComment] = useState<Post>();
   const [isShareModalOpen, setIsShareModalOpen] = useState(false);
   const [sharedPost, setSharedPost] = useState<Post | null>(null);
-  const [isShareButtonDisabled, setIsShareButtonDisabled] = useState(false);
   const navigate = useNavigate();
+  const [isSharingAllowed, setIsSharingAllowed] = useState(true);
 
   const useFollowers = () => {
     // this is only for the logged in user's followers
@@ -95,14 +95,13 @@ const PostsList = ({
     const shouldDisableShareButton =
       post.visibility === 'PRIVATE' ||
       (post.visibility === 'FRIENDS' && post.contentType.includes("base64"));
-  
+
     if (shouldDisableShareButton) {
-      return; // Exit early if sharing is disabled
+      return ;
+    } else {
+      setIsShareModalOpen(true);
+      setSharedPost(post);
     }
-
-    setIsShareButtonDisabled(true);
-    setIsShareModalOpen(true);
-    setSharedPost(post);
   };
 
   const openMakeCommentModal = (post: Post) => {
@@ -278,28 +277,21 @@ const PostsList = ({
                   </Button>
                   </Tooltip>
                 </Grid>
-                  <Grid item xs={4} container justifyContent="flex-end">
+                <Grid item xs={4} container justifyContent="flex-end">
                   <Tooltip title="Share" placement="bottom-end">
-                    <IconButton
-                      size="small"
-                      sx={{ marginRight: 1 }}
-                      onMouseDown={event => event.stopPropagation()}
-                      onClick={event => {
-                        event.stopPropagation();
-                        event.preventDefault();
-                        handleShare(post);
-                      }}
-                      disabled={isShareButtonDisabled}
-                    >
-                      <ShareIcon fontSize="medium" />
-                    </IconButton>
+                  <IconButton
+                    size="small"
+                    sx={{ marginRight: 1 }}
+                    onMouseDown={event => event.stopPropagation()}
+                    onClick={event => {
+                      event.stopPropagation();
+                      event.preventDefault();
+                      handleShare(post);
+                    }}
+                  >
+                    <ShareIcon fontSize="medium" />
+                  </IconButton>
                   </Tooltip>
-                  <SharePostModal
-                    isModalOpen={isShareModalOpen}
-                    setIsModalOpen={setIsShareModalOpen}
-                    followers={followers}
-                    post={sharedPost}
-                  />
                 </Grid>
               </Grid>
             </CardContent>
@@ -344,6 +336,15 @@ const PostsList = ({
           setIsCModalOpen={setIsMakeCommentModalOpen}
         />
       }
+      {isShareModalOpen &&
+        <SharePostModal
+          isModalOpen={isShareModalOpen}
+          setIsModalOpen={setIsShareModalOpen}
+          followers={followers}
+          post={sharedPost!}
+        />
+      }
+
     </Grid>
   );
 };

diff --git a/client/src/components/post/SharePostModal.tsx b/client/src/components/post/SharePostModal.tsx
@@ -15,7 +15,7 @@ interface SharePostModalProps {
   isModalOpen: boolean;
   setIsModalOpen: (isOpen: boolean) => void;
   followers: Author[];
-  post: Post | null;
+  post: Post;
 }
 
 const SharePostModal = ({ isModalOpen, setIsModalOpen, followers, post }: SharePostModalProps) => {
@@ -26,8 +26,8 @@ const SharePostModal = ({ isModalOpen, setIsModalOpen, followers, post }: ShareP
   };
 
   const copyLink = () => {
-    const authorID = post?.author?.id ? getAuthorIdFromResponse(post.author.id) : '';
-    const postID = post?.id ? getAuthorIdFromResponse(post.id) : '';
+    const authorID = getAuthorIdFromResponse(post.author.id);
+    const postID = getAuthorIdFromResponse(post.id);
     const url = window.location.href;
     const path = window.location.pathname;
     const uri = url.replace(path, '');

diff --git a/client/src/components/post/post-item/PostPage.tsx b/client/src/components/post/post-item/PostPage.tsx
@@ -54,6 +54,7 @@ const PostPage = () => {
 
   const [isShareModalOpen, setIsShareModalOpen] = useState(false);
   const [sharedPost, setSharedPost] = useState<Post | null>(null);
+  const [isShareButtonDisabled, setIsShareButtonDisabled] = useState(false);
 
   const fetchPost = async (): Promise<string[]> => {
     const endpoint = `authors/${authorId}/posts/${postId}/`;
@@ -328,6 +329,15 @@ const PostPage = () => {
   const { followers } = useFollowers();
 
   const handleShare = (post: Post) => {
+    const shouldDisableShareButton =
+      post.visibility === 'PRIVATE' ||
+      (post.visibility === 'FRIENDS' && post.contentType.includes("base64"));
+
+    if (shouldDisableShareButton) {
+      return; // Exit early if sharing is disabled
+    }
+
+    setIsShareButtonDisabled(true);
     setIsShareModalOpen(true);
     setSharedPost(post);
   };
@@ -506,6 +516,7 @@ const PostPage = () => {
                   <IconButton
                     size="small"
                     sx={{ marginRight: 1 }}
+                    disabled={isShareButtonDisabled}
                     onClick={() => {
                       handleShare(post);
                     }}