Nav Menu Presentation (#1086)

Adding additional logic to configure what navbar options are available
and under what circumstances they appear

## Changes

- Updated the navbar links logic so that it shows the correct links on
the correct pages
- Added e2e test logic to validate that the navbar is configured
correctly in a few different places

## How to test this PR

1. Verify that the pipeline is passing
2. Pull the branch
3. Launch/releaunch the stack as necessary
4. Access the non authenticated landing page
5. Verify that there are no navbar options
6. Login as an non-associated user
7. Verify that only the the logout nav option appears
8. Login as a full associated user
9. Navigate to the home page
10. Verify that the full nav options appear

e2e/pages/shared-lending-platform/NonAssociatedUserProfile.spec.ts

@@ -9,6 +9,19 @@ const expectedNoAssociationsSummaryUrl =
 
 // Test with isNonAssociatedUser true
 test.use({ isNonAssociatedUser: true });
+test('Complete User Profile -- Validate Nav Menu', async ({ page }) => {
+  await test.step('Verify nav options', async () => {
+    const navContainer = page.locator('nav#nav-links');
+    await expect(navContainer).toBeVisible();
+    await expect(
+      navContainer.getByRole('button', { name: 'LOG OUT' }),
+    ).toBeVisible();
+    await expect(
+      navContainer.getByRole('link', { name: 'Filing', exact: true }),
+    ).not.toBeVisible();
+  });
+});
+
 test('Complete User Profile -- No Associations -- process', async ({
   page,
 }) => {

e2e/pages/shared-lending-platform/UserProfile.spec.ts

@@ -9,6 +9,17 @@ test('User Profile Page', async ({ page, navigateToFilingHome }) => {
     await expect(page.locator('h1')).toContainText('View your user profile');
   });
 
+  await test.step('Verify nav options', async () => {
+    const navContainer = page.locator('nav#nav-links');
+    await expect(navContainer).toBeVisible();
+    await expect(
+      navContainer.getByRole('button', { name: 'LOG OUT' }),
+    ).toBeVisible();
+    await expect(
+      navContainer.getByRole('link', { name: 'Filing', exact: true }),
+    ).toBeVisible();
+  });
+
   // Verify Name + Email
   await test.step('Name & Email', async () => {
     await expect(

e2e/pages/shared-lending-platform/unauthenticated-homepage/NavMenu.spec.ts

@@ -0,0 +1,8 @@
+import { expect, test } from '@playwright/test';
+
+test('Unauthenticated homepage: Validate Nav Menu', async ({ page }) => {
+  await test.step('Verify nav options', async () => {
+    const navContainer = page.locator('nav#nav-links');
+    await expect(navContainer).not.toBeVisible();
+  });
+});

src/utils/useHeaderAuthLinks.tsx

@@ -3,46 +3,59 @@ import { Button } from 'design-system-react';
 import type { ReactElement } from 'react';
 import { NavLink, useLocation } from 'react-router-dom';
 
-const AUTH_LINKS_EXCLUDED = new Set(['/', '/profile/complete', '/summary']);
+const AUTH_LINKS_EXCLUDED = new Set([
+  '/',
+  '/privacy-notice',
+  '/paperwork-reduction-act-notice',
+]);
 
 export const useHeaderAuthLinks = (): ReactElement[] => {
   const { pathname } = useLocation();
   const auth = useSblAuth();
-  const headerLinks = [];
 
   const onLogout = (): void => {
     // Works well without waiting
     // eslint-disable-next-line @typescript-eslint/no-floating-promises
     auth.onLogout();
   };
 
-  if (auth.isLoading || !auth.isAuthenticated) return [];
-
-  if (!AUTH_LINKS_EXCLUDED.has(pathname)) {
-    // Logged in
-    headerLinks.push(
-      <NavLink key='home' className='nav-item a-link' to='/landing'>
-        Home
-      </NavLink>,
-      <NavLink key='filing' className='nav-item a-link' to='/filing'>
-        Filing
-      </NavLink>,
-      <NavLink
-        key='user-name'
-        className='nav-item a-link profile snapshot-ignore'
-        to='/profile/view'
-      >
-        <span>
-          {auth.user?.profile.name ??
-            auth.user?.profile.email ??
-            'User profile'}
-        </span>
-      </NavLink>,
-      <Button key='logout' label='LOG OUT' asLink onClick={onLogout} />,
-    );
+  if (
+    auth.isLoading ||
+    !auth.isAuthenticated ||
+    AUTH_LINKS_EXCLUDED.has(pathname)
+  ) {
+    return [];
   }
 
-  return headerLinks;
+  const headerLinksFull = [
+    <NavLink key='home' className='nav-item a-link' to='/landing'>
+      Home
+    </NavLink>,
+    <NavLink key='filing' className='nav-item a-link' to='/filing'>
+      Filing
+    </NavLink>,
+    <NavLink
+      key='user-name'
+      className='nav-item a-link profile snapshot-ignore'
+      to='/profile/view'
+    >
+      <span>
+        {auth.user?.profile.name ?? auth.user?.profile.email ?? 'User profile'}
+      </span>
+    </NavLink>,
+  ];
+  const headerLinksPartial = [
+    <Button key='logout' label='LOG OUT' asLink onClick={onLogout} />,
+  ];
+
+  if (
+    pathname.startsWith('/profile') &&
+    !pathname.startsWith('/profile/view')
+  ) {
+    return headerLinksPartial;
+  }
+
+  return [...headerLinksFull, ...headerLinksPartial];
 };
 
 export default useHeaderAuthLinks;