fix: don't show edit link for pending maps (will result in 404) (#1753)

* fix: don't show edit link for pending maps (will result in 404) * fix: better handle unpublished drafts that are pending (no link should be shown) * test: update story maps links to match new behaviour
techmatters · Apr 10, 2024 · ecd9635 · ecd9635
1 parent 2fc3514
commit ecd9635
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 15 deletions.
diff --git a/src/home/components/Home.test.js b/src/home/components/Home.test.js
@@ -228,7 +228,7 @@ test('Home: Display Story Maps', async () => {
   expect(items.length).toBe(2);
 
   const link1 = within(items[0]).getByRole('link', { name: 'Story 2' });
-  expect(link1).toHaveAttribute('href', '/tools/story-maps/lftawa9/id-2');
+  expect(link1).toHaveAttribute('href', '/tools/story-maps/lftawa9/id-2/edit');
   const link2 = within(items[1]).getByRole('link', { name: 'Story 1' });
   expect(link2).toHaveAttribute('href', '/tools/story-maps/46h36we/id-1/edit');
 });

diff --git a/src/storyMap/components/StoryMapsCard.js b/src/storyMap/components/StoryMapsCard.js
@@ -91,7 +91,7 @@ const StoryMapListItem = props => {
     [storyMap.membershipInfo.accountMembership]
   );
 
-  const isPending = useMemo(
+  const isStoryMapMembershipPending = useMemo(
     () => accountMembership?.membershipStatus === MEMBERSHIP_STATUS_PENDING,
     [accountMembership]
   );
@@ -165,16 +165,25 @@ const StoryMapListItem = props => {
           )}
           <CollaborationIndicator storyMap={storyMap} />
         </Stack>
-        <RouterLink
-          id={`story-map-${storyMap.slug}-link`}
-          to={
-            storyMap.isPublished
-              ? generateStoryMapUrl(storyMap)
-              : generateStoryMapEditUrl(storyMap)
-          }
-        >
-          {storyMap.title}
-        </RouterLink>
+        {/*
+          Unpublished drafts you have not accepted get no link, as it would 404.
+          Published and not accepted get a view link.
+          Published and accepted get an edit link.
+        */}
+        {!storyMap.isPublished && isStoryMapMembershipPending ? (
+          storyMap.title
+        ) : (
+          <RouterLink
+            id={`story-map-${storyMap.slug}-link`}
+            to={
+              isStoryMapMembershipPending
+                ? generateStoryMapUrl(storyMap)
+                : generateStoryMapEditUrl(storyMap)
+            }
+          >
+            {storyMap.title}
+          </RouterLink>
+        )}
         <Typography
           variant="caption"
           sx={{
@@ -199,7 +208,7 @@ const StoryMapListItem = props => {
         spacing={2}
       >
         <Grid item xs={6}>
-          {isPending ? (
+          {isStoryMapMembershipPending ? (
             <LoadingButton
               size="small"
               variant="outlined"

diff --git a/src/storyMap/components/StoryMapsToolHome.test.js b/src/storyMap/components/StoryMapsToolHome.test.js
@@ -168,7 +168,7 @@ test('StoryMapsToolHome: user story maps render correctly', async () => {
   expect(items.length).toBe(2);
 
   const link2 = within(items[0]).getByRole('link', { name: 'Story 2' });
-  expect(link2).toHaveAttribute('href', '/tools/story-maps/lftawa9/id-2');
+  expect(link2).toHaveAttribute('href', '/tools/story-maps/lftawa9/id-2/edit');
   const link1 = within(items[1]).getByRole('link', { name: 'Story 1' });
   expect(link1).toHaveAttribute('href', '/tools/story-maps/46h36we/id-1/edit');
 });
@@ -234,7 +234,7 @@ test('StoryMapsToolHome: accept story map invite', async () => {
     },
   });
 
-  const storyMapItem = screen.getByRole('listitem', { name: 'Story 1' });
+  const storyMapItem = screen.getByRole('listitem', { name: '' });
 
   const acceptButton = within(storyMapItem).getByRole('button', {
     name: 'Accept',