HaztrakProfile for managing Remote signer access

.pre-commit-config.yaml

@@ -24,15 +24,10 @@ repos:
             \.vscode\/.*|
           )$
   - repo: https://github.com/charliermarsh/ruff-pre-commit
-    rev: 'v0.0.251'
+    rev: 'v0.1.3'
     hooks:
       - id: ruff
         args: [--fix, --exit-non-zero-on-fix]
-  - repo: https://github.com/ambv/black
-    rev: '23.1.0'
-    hooks:
-      - id: black
-        language_version: python3.11
   - repo: local
     hooks:
       - id: pre-commit-django-migrations

client/src/App.tsx

@@ -3,7 +3,8 @@ import React, { ReactElement, useEffect } from 'react';
 import { RouterProvider, useNavigate } from 'react-router-dom';
 import { router } from 'routes';
 import { useAppDispatch, useAppSelector } from 'store';
-import { getProfile, selectRcraProfile } from 'store/rcraProfileSlice';
+import { getRcraProfile, selectRcraProfile } from 'store/profileSlice';
+import { getHaztrakProfile } from 'store/profileSlice/profile.slice';
 import { selectUserName } from 'store/userSlice';
 import { getHaztrakUser } from 'store/userSlice/user.slice';
 import './App.scss';
@@ -15,8 +16,9 @@ function App(): ReactElement {
 
   useEffect(() => {
     if (userName) {
-      dispatch(getProfile());
+      dispatch(getRcraProfile());
       dispatch(getHaztrakUser());
+      dispatch(getHaztrakProfile());
     }
   }, [profile.user]);
 

client/src/components/Manifest/QuickerSign/QuickerSignModalBtn.spec.tsx

@@ -50,10 +50,13 @@ describe('QuickerSignModalBtn', () => {
       {
         // Redux store state with an API user is required for this button to be active
         preloadedState: {
-          rcraProfile: {
+          profile: {
             user: 'username',
-            phoneNumber: '1231231234',
-            apiUser: true,
+            rcrainfoProfile: {
+              user: 'username',
+              phoneNumber: '1231231234',
+              apiUser: true,
+            },
           },
         },
       }
@@ -74,10 +77,13 @@ describe('QuickerSignModalBtn', () => {
       {
         // Redux store state with an API user is required for this button to be active
         preloadedState: {
-          rcraProfile: {
+          profile: {
             user: 'username',
-            phoneNumber: '1231231234',
-            apiUser: false,
+            rcrainfoProfile: {
+              user: 'username',
+              phoneNumber: '1231231234',
+              apiUser: false,
+            },
           },
         },
       }

client/src/components/Manifest/SiteSelect/SiteSelect.spec.tsx

@@ -3,8 +3,8 @@ import { SiteSelect } from 'components/Manifest/SiteSelect/SiteSelect';
 import React, { useState } from 'react';
 import { useForm } from 'react-hook-form';
 import { renderWithProviders } from 'test-utils';
-import { createMockSite } from 'test-utils/fixtures';
-import { createMockPermission } from 'test-utils/fixtures/mockHandler';
+import { createMockRcrainfoSite } from 'test-utils/fixtures';
+import { createMockRcrainfoPermissions } from 'test-utils/fixtures/mockHandler';
 import { describe, expect, test } from 'vitest';
 
 function TestComponent() {
@@ -16,21 +16,24 @@ function TestComponent() {
 
 describe('SiteSelect', () => {
   test('renders', () => {
-    const mySite = createMockSite();
+    const mySite = createMockRcrainfoSite();
     renderWithProviders(<TestComponent />, {
       preloadedState: {
-        rcraProfile: {
+        profile: {
           user: 'username',
-          phoneNumber: '1231231234',
-          apiUser: false,
-          rcraSites: {
-            VATESTGEN001: {
-              site: mySite,
-              permissions: createMockPermission(),
-            },
-            VATEST00001: {
-              site: mySite,
-              permissions: createMockPermission(),
+          rcrainfoProfile: {
+            user: 'username',
+            phoneNumber: '1231231234',
+            apiUser: false,
+            rcraSites: {
+              VATESTGEN001: {
+                epaSiteId: 'VATESTGEN001',
+                permissions: createMockRcrainfoPermissions(),
+              },
+              VATEST00001: {
+                epaSiteId: 'VATEST00001',
+                permissions: createMockRcrainfoPermissions(),
+              },
             },
           },
         },

client/src/components/Manifest/SiteSelect/SiteSelect.tsx

@@ -4,7 +4,7 @@ import React from 'react';
 import { Control, Controller } from 'react-hook-form';
 import Select from 'react-select';
 import { useAppSelector } from 'store';
-import { userRcraSitesSelector } from 'store/rcraProfileSlice/rcraProfile.slice';
+import { selectHaztrakSites, selectRcrainfoSites } from 'store/profileSlice/profile.slice';
 
 interface SiteSelectProps<T> {
   control: Control;
@@ -17,8 +17,8 @@ export function SiteSelect({
   value,
   handleChange,
 }: SiteSelectProps<RcraSite | undefined | null>) {
-  const userRcraSites = useAppSelector(userRcraSitesSelector);
-  const siteOptions = userRcraSites?.map((site) => site.site.handler);
+  const userSites = useAppSelector(selectHaztrakSites);
+  const siteOptions = userSites?.map((site) => site.handler);
   return (
     <>
       <HtForm.Label htmlFor="site">Site</HtForm.Label>

client/src/components/buttons/RcraApiUserBtn/RcraApiUserBtn.spec.tsx

@@ -25,10 +25,13 @@ describe('RcraApiUserBtn', () => {
   test('is disabled when apiUser=false', () => {
     renderWithProviders(<RcraApiUserBtn>Click Me</RcraApiUserBtn>, {
       preloadedState: {
-        rcraProfile: {
+        profile: {
           user: 'username',
-          phoneNumber: '1231231234',
-          apiUser: false,
+          rcrainfoProfile: {
+            user: 'username',
+            phoneNumber: '1231231234',
+            apiUser: false,
+          },
         },
       },
     });

client/src/components/buttons/RcraApiUserBtn/RcraApiUserBtn.tsx

@@ -1,6 +1,6 @@
 import { Button, ButtonProps } from 'react-bootstrap';
 import { useAppSelector } from 'store';
-import { selectRcraProfile } from 'store/rcraProfileSlice';
+import { selectRcraProfile } from 'store/profileSlice';
 
 interface HtApiUserBtnProps extends ButtonProps {}
 
@@ -14,9 +14,7 @@ interface HtApiUserBtnProps extends ButtonProps {}
 export function RcraApiUserBtn(props: HtApiUserBtnProps) {
   const profile = useAppSelector(selectRcraProfile);
   let { children, ...btnProps } = props;
-  // In order for the button to be active,
-  // the disabled prop needs to be falsy AND the user needs to be an API user
-  const active = !btnProps.disabled && profile.apiUser;
+  const active = !btnProps.disabled && profile.rcrainfoProfile?.apiUser;
 
   return (
     <Button {...btnProps} disabled={!active}>

client/src/features/SiteList/SiteList.spec.tsx

@@ -3,11 +3,11 @@ import { rest } from 'msw';
 import { setupServer } from 'msw/node';
 import React from 'react';
 import { cleanup, renderWithProviders, screen } from 'test-utils';
-import { createMockHandler, createMockSite } from 'test-utils/fixtures/mockHandler';
+import { createMockHandler, createMockRcrainfoSite } from 'test-utils/fixtures/mockHandler';
 import { API_BASE_URL } from 'test-utils/mock/handlers';
 import { afterAll, afterEach, beforeAll, describe, expect, test, vi } from 'vitest';
 
-const mockSites = [createMockSite(), createMockSite()];
+const mockSites = [createMockRcrainfoSite(), createMockRcrainfoSite()];
 const server = setupServer(
   rest.get(`${API_BASE_URL}/api/site`, (req, res, ctx) => {
     return res(ctx.status(200), ctx.json(mockSites));

client/src/features/home/Home.tsx

@@ -8,7 +8,7 @@ import { Accordion, Button, Col, Container, Row } from 'react-bootstrap';
 import { Link } from 'react-router-dom';
 import { useAppDispatch, useAppSelector } from 'store';
 import { launchExampleTask } from 'store/notificationSlice/notification.slice';
-import { getProfile } from 'store/rcraProfileSlice';
+import { getRcraProfile } from 'store/profileSlice';
 import { selectUserName } from 'store/userSlice/user.slice';
 
 /**
@@ -22,7 +22,7 @@ export function Home(): ReactElement {
 
   useEffect(() => {
     // get user profile information when the user changes
-    dispatch(getProfile());
+    dispatch(getRcraProfile());
   }, [userName]);
 
   return (

client/src/features/newManifest/NewManifest.spec.tsx

@@ -0,0 +1,94 @@
+import '@testing-library/jest-dom';
+import userEvent from '@testing-library/user-event';
+import { NewManifest } from 'features/newManifest/NewManifest';
+import React from 'react';
+import { renderWithProviders, screen } from 'test-utils';
+import {
+  createMockRcrainfoPermissions,
+  createMockRcrainfoSite,
+} from 'test-utils/fixtures/mockHandler';
+import { describe, expect, test } from 'vitest';
+
+describe('NewManifest', () => {
+  test('renders', () => {
+    const mySiteId = 'VATESTGEN001';
+    const mySiteName = 'My Site';
+    const mySite = createMockRcrainfoSite({
+      name: mySiteName,
+      // @ts-ignore
+      handler: { epaSiteId: mySiteId, siteType: 'Tsdf' },
+    });
+    renderWithProviders(<NewManifest />, {
+      preloadedState: {
+        profile: {
+          user: 'testuser1',
+          sites: { VATESTGEN001: { ...mySite, permissions: { eManifest: 'viewer' } } },
+          rcrainfoProfile: {
+            user: 'username',
+            phoneNumber: '1231231234',
+            apiUser: false,
+            rcraSites: {
+              VATESTGEN001: {
+                epaSiteId: mySiteId,
+                permissions: createMockRcrainfoPermissions(),
+              },
+            },
+          },
+        },
+      },
+    });
+    expect(screen.getByRole('combobox', { name: /site Role/i })).toBeInTheDocument();
+  });
+  test('site type is initially disabled', () => {
+    const mySiteId = 'VATESTGEN001';
+    const mySiteName = 'My Site';
+    const mySite = createMockRcrainfoSite({
+      name: mySiteName,
+      // @ts-ignore
+      handler: { epaSiteId: mySiteId, siteType: 'Tsdf' },
+    });
+    renderWithProviders(<NewManifest />, {
+      preloadedState: {
+        profile: {
+          user: 'testuser1',
+          rcrainfoProfile: {
+            user: 'username',
+            phoneNumber: '1231231234',
+            apiUser: false,
+            rcraSites: {
+              VATESTGEN001: {
+                epaSiteId: mySiteId,
+                permissions: createMockRcrainfoPermissions(),
+              },
+            },
+          },
+        },
+      },
+    });
+    const siteRole = screen.getByRole('combobox', { name: /site Role/i });
+    expect(siteRole).toBeDisabled();
+  });
+  test('site type is not disabled after selecting a site', async () => {
+    const mySiteId = 'VATESTGEN001';
+    const mySiteName = 'My Site';
+    const mySite = createMockRcrainfoSite({
+      name: mySiteName,
+      // @ts-ignore
+      handler: { epaSiteId: mySiteId, siteType: 'Tsdf' },
+    });
+    renderWithProviders(<NewManifest />, {
+      preloadedState: {
+        profile: {
+          user: 'testuser1',
+          sites: { VATESTGEN001: { ...mySite, permissions: { eManifest: 'viewer' } } },
+        },
+      },
+    });
+    const siteSelection = screen.getByRole('combobox', { name: /site select/i });
+    await userEvent.click(siteSelection);
+    await userEvent.keyboard('{enter}');
+    expect(screen.getByText(new RegExp(`${mySiteId} --`, 'i'))).toBeInTheDocument();
+    const siteRole = screen.getByRole('combobox', { name: /site Role/i });
+    expect(siteRole).not.toBeDisabled();
+  });
+});

client/src/features/newManifest/NewManifest.tsx

@@ -9,7 +9,7 @@ import { Form } from 'react-bootstrap';
 import { useForm } from 'react-hook-form';
 import { useParams } from 'react-router-dom';
 import { useAppSelector } from 'store';
-import { siteByEpaIdSelector } from 'store/rcraProfileSlice/rcraProfile.slice';
+import { siteByEpaIdSelector } from 'store/profileSlice/profile.slice';
 
 /**
  * NewManifest component allows a user to create a new electronic manifest.
@@ -40,8 +40,7 @@ export function NewManifest() {
   };
 
   if (!selectedSiteType || !manifestingSite) {
-    // If the site that needs to start a manifest, or its role on the manifest
-    // can't be determined, ask the user.
+    // If the manifesting site's role on the manifest can't be automatically determined, ask the user.
     return (
       <HtCard>
         <HtCard.Body>

client/src/features/profile/Profile.tsx

@@ -6,7 +6,7 @@ import { useTitle } from 'hooks';
 import React, { ReactElement, useEffect } from 'react';
 import { Col, Container, Row } from 'react-bootstrap';
 import { useAppDispatch, useAppSelector } from 'store';
-import { getProfile, selectRcraProfile } from 'store/rcraProfileSlice';
+import { getRcraProfile, selectRcraProfile } from 'store/profileSlice';
 
 /**
  * Display user profile
@@ -23,7 +23,7 @@ export function Profile(): ReactElement {
   }
 
   useEffect(() => {
-    dispatch(getProfile());
+    dispatch(getRcraProfile());
   }, [profile.user]);
 
   return (
@@ -43,7 +43,8 @@ export function Profile(): ReactElement {
             <HtCard>
               <HtCard.Header title="RCRAInfo Profile" />
               <HtCard.Body>
-                <RcraProfile profile={profile} />
+                {/*ToDo extend RcraProfile component accept undefined*/}
+                {profile.rcrainfoProfile && <RcraProfile profile={profile.rcrainfoProfile} />}
               </HtCard.Body>
             </HtCard>
           </Col>