From 7be48d4c23f2802a73eb898192c90847713aaef8 Mon Sep 17 00:00:00 2001 From: dbarkowsky Date: Tue, 24 Sep 2024 12:13:03 -0700 Subject: [PATCH] separate sso from auth context, rename context --- react-app/src/App.tsx | 12 ++++++---- react-app/src/components/layout/Header.tsx | 4 ++-- .../components/map/controls/FilterControl.tsx | 4 ++-- .../map/parcelPopup/ParcelPopup.tsx | 4 ++-- .../src/components/projects/ProjectDetail.tsx | 4 ++-- .../src/components/projects/ProjectDialog.tsx | 4 ++-- .../src/components/projects/ProjectForms.tsx | 4 ++-- .../components/property/PropertyDetail.tsx | 4 ++-- react-app/src/components/table/DataTable.tsx | 4 ++-- react-app/src/components/users/UserDetail.tsx | 4 ++-- react-app/src/contexts/authContext.tsx | 22 +++++++---------- react-app/src/contexts/lookupContext.tsx | 8 +++---- react-app/src/guards/AuthRouteGuard.tsx | 18 +++++++------- react-app/src/hooks/api/usePropertiesApi.ts | 4 ++-- react-app/src/hooks/api/useUserAgencies.ts | 12 ++++++---- react-app/src/hooks/useFetch.ts | 15 ++++++------ react-app/src/hooks/usePimsUser.ts | 4 ++-- react-app/src/pages/AccessRequest.tsx | 24 +++++++++---------- react-app/src/pages/Home.tsx | 8 +++---- 19 files changed, 81 insertions(+), 82 deletions(-) diff --git a/react-app/src/App.tsx b/react-app/src/App.tsx index 3299d17e20..d91d1abe30 100644 --- a/react-app/src/App.tsx +++ b/react-app/src/App.tsx @@ -5,7 +5,7 @@ import '@/App.css'; import { ThemeProvider } from '@emotion/react'; import appTheme from './themes/appTheme'; import Dev from './pages/DevZone'; -import AuthContextProvider, { AuthContext } from './contexts/authContext'; +import UserContextProvider, { UserContext } from './contexts/authContext'; import AuthRouteGuard from './guards/AuthRouteGuard'; import BaseLayout from './components/layout/BaseLayout'; import { AccessRequest } from './pages/AccessRequest'; @@ -31,6 +31,7 @@ import ParcelMap from '@/components/map/ParcelMap'; import LookupContextProvider from '@/contexts/lookupContext'; import BulkUpload from './pages/BulkUpload'; import useHistoryAwareNavigate from './hooks/useHistoryAwareNavigate'; +import { useSSO } from '@bcgov/citz-imb-sso-react'; /** * Renders the main router component for the application. @@ -40,7 +41,8 @@ import useHistoryAwareNavigate from './hooks/useHistoryAwareNavigate'; * @returns JSX element representing the main router component */ const Router = () => { - const auth = useContext(AuthContext); + const sso = useSSO(); + const auth = useContext(UserContext); const { goToFromStateOrSetRoute } = useHistoryAwareNavigate(); // Reusable piece to show map on many routes @@ -63,7 +65,7 @@ const Router = () => { { return ( - + - + ); diff --git a/react-app/src/components/layout/Header.tsx b/react-app/src/components/layout/Header.tsx index d597df78bd..dce4fc368d 100644 --- a/react-app/src/components/layout/Header.tsx +++ b/react-app/src/components/layout/Header.tsx @@ -15,7 +15,7 @@ import { import { Link as RouterLink, useNavigate } from 'react-router-dom'; import { useSSO } from '@bcgov/citz-imb-sso-react'; import { Roles } from '@/constants/roles'; -import { AuthContext } from '@/contexts/authContext'; +import { UserContext } from '@/contexts/authContext'; const AppBrand = () => { const theme = useTheme(); @@ -61,7 +61,7 @@ const AppBrand = () => { }; const Header: React.FC = () => { - const auth = useContext(AuthContext); + const auth = useContext(UserContext); const { logout, isAuthenticated, login } = useSSO(); const theme = useTheme(); const navigate = useNavigate(); diff --git a/react-app/src/components/map/controls/FilterControl.tsx b/react-app/src/components/map/controls/FilterControl.tsx index 6b4d2db5ec..ca0b89538c 100644 --- a/react-app/src/components/map/controls/FilterControl.tsx +++ b/react-app/src/components/map/controls/FilterControl.tsx @@ -1,7 +1,7 @@ import MultiselectFormField from '@/components/form/MultiselectFormField'; import TextFormField from '@/components/form/TextFormField'; import { Roles } from '@/constants/roles'; -import { AuthContext } from '@/contexts/authContext'; +import { UserContext } from '@/contexts/authContext'; import { LookupContext } from '@/contexts/lookupContext'; import useGroupedAgenciesApi from '@/hooks/api/useGroupedAgenciesApi'; import { MapFilter } from '@/hooks/api/usePropertiesApi'; @@ -27,7 +27,7 @@ interface FilterControlProps { const FilterControl = (props: FilterControlProps) => { const { setFilter } = props; const api = usePimsApi(); - const user = useContext(AuthContext); + const user = useContext(UserContext); const { data: lookupData } = useContext(LookupContext); // Get lists for dropdowns diff --git a/react-app/src/components/map/parcelPopup/ParcelPopup.tsx b/react-app/src/components/map/parcelPopup/ParcelPopup.tsx index df3dfe4f86..2c5ab344c1 100644 --- a/react-app/src/components/map/parcelPopup/ParcelPopup.tsx +++ b/react-app/src/components/map/parcelPopup/ParcelPopup.tsx @@ -10,7 +10,7 @@ import KeyboardDoubleArrowRightIcon from '@mui/icons-material/KeyboardDoubleArro import './parcelPopup.css'; import { TabContext, TabList, TabPanel } from '@mui/lab'; import useDataLoader from '@/hooks/useDataLoader'; -import { AuthContext } from '@/contexts/authContext'; +import { UserContext } from '@/contexts/authContext'; import { Roles } from '@/constants/roles'; import BCAssessmentDetails from '@/components/map/parcelPopup/BCAssessmentDetails'; import LtsaDetails from '@/components/map/parcelPopup/LtsaDetails'; @@ -38,7 +38,7 @@ export const ParcelPopup = (props: ParcelPopupProps) => { const [tabValue, setTabValue] = useState('0'); const { size = 'large', scrollOnClick } = props; - const { pimsUser } = useContext(AuthContext); + const { pimsUser } = useContext(UserContext); const { data: ltsaData, diff --git a/react-app/src/components/projects/ProjectDetail.tsx b/react-app/src/components/projects/ProjectDetail.tsx index bac5094029..5515e0701a 100644 --- a/react-app/src/components/projects/ProjectDetail.tsx +++ b/react-app/src/components/projects/ProjectDetail.tsx @@ -43,7 +43,7 @@ import { enumReverseLookup } from '@/utilities/helperFunctions'; import { AgencyResponseType } from '@/constants/agencyResponseTypes'; import useDataSubmitter from '@/hooks/useDataSubmitter'; import { Roles } from '@/constants/roles'; -import { AuthContext } from '@/contexts/authContext'; +import { UserContext } from '@/contexts/authContext'; import { ExpandMoreOutlined } from '@mui/icons-material'; import { columnNameFormatter, dateFormatter, formatMoney } from '@/utilities/formatters'; import { LookupContext } from '@/contexts/lookupContext'; @@ -71,7 +71,7 @@ interface ProjectInfo extends Project { const ProjectDetail = (props: IProjectDetail) => { const navigate = useNavigate(); const { id } = useParams(); - const { pimsUser } = useContext(AuthContext); + const { pimsUser } = useContext(UserContext); const lookup = useContext(LookupContext); const api = usePimsApi(); const { data: lookupData, getLookupValueById } = useContext(LookupContext); diff --git a/react-app/src/components/projects/ProjectDialog.tsx b/react-app/src/components/projects/ProjectDialog.tsx index 4ea951be51..7eead9281f 100644 --- a/react-app/src/components/projects/ProjectDialog.tsx +++ b/react-app/src/components/projects/ProjectDialog.tsx @@ -27,7 +27,7 @@ import ProjectNotificationsTable from './ProjectNotificationsTable'; import { getStatusString } from '@/constants/chesNotificationStatus'; import { MonetaryType } from '@/constants/monetaryTypes'; import AutocompleteFormField from '../form/AutocompleteFormField'; -import { AuthContext } from '@/contexts/authContext'; +import { UserContext } from '@/contexts/authContext'; import { Roles } from '@/constants/roles'; import BaseDialog from '../dialog/BaseDialog'; import { NotificationQueue } from '@/hooks/api/useProjectNotificationApi'; @@ -43,7 +43,7 @@ export const ProjectGeneralInfoDialog = (props: IProjectGeneralInfoDialog) => { const { open, postSubmit, onCancel, initialValues } = props; const api = usePimsApi(); const { data: lookupData } = useContext(LookupContext); - const { pimsUser } = useContext(AuthContext); + const { pimsUser } = useContext(UserContext); const { submit, submitting } = useDataSubmitter(api.projects.updateProject); const [approvedStatus, setApprovedStatus] = useState(null); const projectFormMethods = useForm({ diff --git a/react-app/src/components/projects/ProjectForms.tsx b/react-app/src/components/projects/ProjectForms.tsx index 9f385ad9ba..4f85905ad4 100644 --- a/react-app/src/components/projects/ProjectForms.tsx +++ b/react-app/src/components/projects/ProjectForms.tsx @@ -1,7 +1,7 @@ import { Grid, InputAdornment, Typography } from '@mui/material'; import React, { useContext } from 'react'; import AutocompleteFormField from '../form/AutocompleteFormField'; -import { AuthContext } from '@/contexts/authContext'; +import { UserContext } from '@/contexts/authContext'; import TextFormField from '../form/TextFormField'; import { ISelectMenuItem } from '../form/SelectFormField'; import SingleSelectBoxFormField from '../form/SingleSelectBoxFormField'; @@ -14,7 +14,7 @@ interface IProjectGeneralInfoForm { export const ProjectGeneralInfoForm = (props: IProjectGeneralInfoForm) => { const { data: lookupData } = useContext(LookupContext); - const { pimsUser } = useContext(AuthContext); + const { pimsUser } = useContext(UserContext); const canEdit = pimsUser.hasOneOfRoles([Roles.ADMIN]); return ( diff --git a/react-app/src/components/property/PropertyDetail.tsx b/react-app/src/components/property/PropertyDetail.tsx index 3e8877ab9a..7d07d6e71e 100644 --- a/react-app/src/components/property/PropertyDetail.tsx +++ b/react-app/src/components/property/PropertyDetail.tsx @@ -27,7 +27,7 @@ import { Map } from 'leaflet'; import { Room } from '@mui/icons-material'; import TitleOwnership from '../ltsa/TitleOwnership'; import useDataSubmitter from '@/hooks/useDataSubmitter'; -import { AuthContext } from '@/contexts/authContext'; +import { UserContext } from '@/contexts/authContext'; import { Roles } from '@/constants/roles'; import { LookupContext } from '@/contexts/lookupContext'; import AssociatedProjectsTable from './AssociatedProjectsTable'; @@ -40,7 +40,7 @@ interface IPropertyDetail { const PropertyDetail = (props: IPropertyDetail) => { const navigate = useNavigate(); const params = useParams(); - const { pimsUser } = useContext(AuthContext); + const { pimsUser } = useContext(UserContext); const { getLookupValueById } = useContext(LookupContext); const parcelId = isNaN(Number(params.parcelId)) ? null : Number(params.parcelId); const buildingId = isNaN(Number(params.buildingId)) ? null : Number(params.buildingId); diff --git a/react-app/src/components/table/DataTable.tsx b/react-app/src/components/table/DataTable.tsx index 2f73e1dcb8..fb02d0e21c 100644 --- a/react-app/src/components/table/DataTable.tsx +++ b/react-app/src/components/table/DataTable.tsx @@ -47,7 +47,7 @@ import CircularProgress from '@mui/material/CircularProgress'; import { CommonFiltering } from '@/interfaces/ICommonFiltering'; import { useSearchParams } from 'react-router-dom'; import { Roles } from '@/constants/roles'; -import { AuthContext } from '@/contexts/authContext'; +import { UserContext } from '@/contexts/authContext'; import { SnackBarContext } from '@/contexts/snackbarContext'; type RenderCellParams = GridRenderCellParams; @@ -436,7 +436,7 @@ export const FilterSearchDataGrid = (props: FilterSearchDataGridProps) => { : `(${props.rowCountProp ?? 0} rows)`; }, [props.tableOperationMode, rowCount, props.rowCountProp]); - const { pimsUser } = useContext(AuthContext); + const { pimsUser } = useContext(UserContext); const isAuditor = pimsUser.hasOneOfRoles([Roles.AUDITOR]); return ( diff --git a/react-app/src/components/users/UserDetail.tsx b/react-app/src/components/users/UserDetail.tsx index d1bc9be109..458ecea521 100644 --- a/react-app/src/components/users/UserDetail.tsx +++ b/react-app/src/components/users/UserDetail.tsx @@ -8,7 +8,7 @@ import AutocompleteFormField from '@/components/form/AutocompleteFormField'; import usePimsApi from '@/hooks/usePimsApi'; import useDataLoader from '@/hooks/useDataLoader'; import { User } from '@/hooks/api/useUsersApi'; -import { AuthContext } from '@/contexts/authContext'; +import { UserContext } from '@/contexts/authContext'; import { Agency } from '@/hooks/api/useAgencyApi'; import TextFormField from '../form/TextFormField'; import DetailViewNavigation from '../display/DetailViewNavigation'; @@ -29,7 +29,7 @@ interface UserProfile extends User { const UserDetail = ({ onClose }: IUserDetail) => { const { id } = useParams(); - const { pimsUser } = useContext(AuthContext); + const { pimsUser } = useContext(UserContext); const { data: lookupData, getLookupValueById } = useContext(LookupContext); const api = usePimsApi(); diff --git a/react-app/src/contexts/authContext.tsx b/react-app/src/contexts/authContext.tsx index 9f951cd66c..5adb4ed239 100644 --- a/react-app/src/contexts/authContext.tsx +++ b/react-app/src/contexts/authContext.tsx @@ -1,32 +1,28 @@ -import usePimsUser, { IPimsUser } from '@/hooks/usePimsUser'; -import { AuthService, useSSO } from '@bcgov/citz-imb-sso-react'; +import usePimsUser, { IPimsUser as PimsUser } from '@/hooks/usePimsUser'; import React, { createContext } from 'react'; -export interface IAuthState { - keycloak: AuthService; - pimsUser: IPimsUser; +export interface PimsUserState { + pimsUser: PimsUser; } -export const AuthContext = createContext(undefined); +export const UserContext = createContext(undefined); /** - * Provides access to user and authentication (keycloak) data about the logged in user. + * Provides access to user data about the logged in user. * * @param {*} props * @return {*} */ -export const AuthContextProvider: React.FC = (props) => { - const keycloak = useSSO(); +export const UserContextProvider: React.FC = (props) => { const pimsUser = usePimsUser(); return ( - {props.children} - + ); }; -export default AuthContextProvider; +export default UserContextProvider; diff --git a/react-app/src/contexts/lookupContext.tsx b/react-app/src/contexts/lookupContext.tsx index e2d2d86aa9..80b8e1411b 100644 --- a/react-app/src/contexts/lookupContext.tsx +++ b/react-app/src/contexts/lookupContext.tsx @@ -1,8 +1,8 @@ -import { AuthContext } from '@/contexts/authContext'; import { LookupAll } from '@/hooks/api/useLookupApi'; import useDataLoader from '@/hooks/useDataLoader'; import usePimsApi from '@/hooks/usePimsApi'; -import React, { createContext, useCallback, useContext, useMemo } from 'react'; +import { useSSO } from '@bcgov/citz-imb-sso-react'; +import React, { createContext, useCallback, useMemo } from 'react'; type LookupContextValue = { data: LookupAll | undefined; @@ -19,8 +19,8 @@ export const LookupContext = createContext(undefined); export const LookupContextProvider: React.FC = (props) => { const api = usePimsApi(); const { data, loadOnce } = useDataLoader(api.lookup.getAll); - const { keycloak } = useContext(AuthContext); - if (!data && keycloak.isAuthenticated) { + const sso = useSSO(); + if (!data && sso.isAuthenticated) { loadOnce(); } diff --git a/react-app/src/guards/AuthRouteGuard.tsx b/react-app/src/guards/AuthRouteGuard.tsx index 365370ac32..bfcf0fa816 100644 --- a/react-app/src/guards/AuthRouteGuard.tsx +++ b/react-app/src/guards/AuthRouteGuard.tsx @@ -1,5 +1,6 @@ import { Roles } from '@/constants/roles'; -import { AuthContext } from '@/contexts/authContext'; +import { UserContext } from '@/contexts/authContext'; +import { useSSO } from '@bcgov/citz-imb-sso-react'; import { CircularProgress, Paper, Typography } from '@mui/material'; import { PropsWithChildren, useContext, useEffect, useRef } from 'react'; import React from 'react'; @@ -18,11 +19,12 @@ export interface AuthGuardProps extends PropsWithChildren { */ const AuthRouteGuard = (props: AuthGuardProps) => { const { permittedRoles, redirectRoute, ignoreStatus } = props; - const authStateContext = useContext(AuthContext); + const authStateContext = useContext(UserContext); + const sso = useSSO(); const navigate = useNavigate(); useEffect(() => { - if (authStateContext.keycloak.isAuthenticated) { + if (sso.isAuthenticated) { if (timeoutId.current) { clearTimeout(timeoutId.current); timeoutId.current = null; @@ -41,7 +43,7 @@ const AuthRouteGuard = (props: AuthGuardProps) => { } else { timeoutId.current = setTimeout( () => - authStateContext.keycloak.login({ + sso.login({ postLoginRedirectURL: window.location.pathname + window.location.search, }), 5000, @@ -53,13 +55,9 @@ const AuthRouteGuard = (props: AuthGuardProps) => { clearTimeout(timeoutId.current); } }; - }, [ - authStateContext.pimsUser?.isLoading, - authStateContext.keycloak.isLoggingIn, - authStateContext.keycloak.isAuthenticated, - ]); + }, [authStateContext.pimsUser?.isLoading, sso.isLoggingIn, sso.isAuthenticated]); const timeoutId = useRef(null); - if (!authStateContext.keycloak.isAuthenticated) { + if (!sso.isAuthenticated) { return ( { // const config = useContext(ConfigContext); const config = getConfig(); - const keycloak = useSSO(); + const sso = useSSO(); const propertiesFuzzySearch = async (keyword: string) => { const { parsedBody } = await absoluteFetch.get('/properties/search/fuzzy', { @@ -167,7 +167,7 @@ const usePropertiesApi = (absoluteFetch: IFetch) => { const result = await fetch(config.API_HOST + '/properties/import', { method: 'POST', body: form, //Using standard fetch here instead of the wrapper so that we can handle this form-data body without converting to JSON. - headers: { Authorization: keycloak.getAuthorizationHeaderValue() }, + headers: { Authorization: sso.getAuthorizationHeaderValue() }, signal: AbortSignal.timeout(5000), }); const text = await result.text(); diff --git a/react-app/src/hooks/api/useUserAgencies.ts b/react-app/src/hooks/api/useUserAgencies.ts index b6aec79fc2..402b7d3404 100644 --- a/react-app/src/hooks/api/useUserAgencies.ts +++ b/react-app/src/hooks/api/useUserAgencies.ts @@ -2,22 +2,24 @@ import { ISelectMenuItem } from '@/components/form/SelectFormField'; import { Roles } from '@/constants/roles'; import { useContext, useEffect, useMemo } from 'react'; import useDataLoader from '../useDataLoader'; -import { AuthContext } from '@/contexts/authContext'; +import { UserContext } from '@/contexts/authContext'; import usePimsApi from '../usePimsApi'; import useGroupedAgenciesApi from './useGroupedAgenciesApi'; +import { useSSO } from '@bcgov/citz-imb-sso-react'; const useUserAgencies = () => { - const userContext = useContext(AuthContext); + const { pimsUser } = useContext(UserContext); + const sso = useSSO(); const { ungroupedAgencies, agencyOptions } = useGroupedAgenciesApi(); const api = usePimsApi(); - const isAdmin = userContext.pimsUser?.hasOneOfRoles([Roles.ADMIN]); + const isAdmin = pimsUser?.hasOneOfRoles([Roles.ADMIN]); const { data: userAgencies, refreshData: refreshUserAgencies } = useDataLoader(() => - api.users.getUsersAgencyIds(userContext.keycloak.user.preferred_username), + api.users.getUsersAgencyIds(sso.user.preferred_username), ); useEffect(() => { refreshUserAgencies(); - }, [userContext.keycloak]); + }, [sso]); const userAgencyObjects = useMemo(() => { if (ungroupedAgencies && userAgencies) { diff --git a/react-app/src/hooks/useFetch.ts b/react-app/src/hooks/useFetch.ts index bcc91d8fbe..76a1e34f42 100644 --- a/react-app/src/hooks/useFetch.ts +++ b/react-app/src/hooks/useFetch.ts @@ -24,7 +24,7 @@ export interface IFetch { * @returns */ const useFetch = (baseUrl?: string) => { - const keycloak = useSSO(); + const sso = useSSO(); return useMemo(() => { const absoluteFetch = async (url: string, params?: RequestInit): Promise => { @@ -32,7 +32,7 @@ const useFetch = (baseUrl?: string) => { params = { headers: { - Authorization: keycloak.getAuthorizationHeaderValue(), + Authorization: sso.getAuthorizationHeaderValue(), 'Content-Type': 'application/json', }, ...params, @@ -49,10 +49,11 @@ const useFetch = (baseUrl?: string) => { } // If token has expired - if (response.status === 401) { - const currentLocation = window.location.pathname; - keycloak.login({ postLoginRedirectURL: currentLocation + window.location.search }); - } + // TODO: Uncomment when bug is solved + // if (response.status === 401) { + // const currentLocation = window.location.pathname; + // sso.login({ postLoginRedirectURL: currentLocation + window.location.search }); + // } const text = await response.text(); if (text.length) { @@ -105,7 +106,7 @@ const useFetch = (baseUrl?: string) => { post, del, }; - }, [baseUrl, keycloak]); + }, [baseUrl, sso]); }; export default useFetch; diff --git a/react-app/src/hooks/usePimsUser.ts b/react-app/src/hooks/usePimsUser.ts index c83362edd2..ee4b3a462d 100644 --- a/react-app/src/hooks/usePimsUser.ts +++ b/react-app/src/hooks/usePimsUser.ts @@ -18,11 +18,11 @@ export interface IPimsUser { * @returns Object containing the user's database record and functions related to the loading of this data. */ const usePimsUser = () => { - const keycloak = useSSO(); + const sso = useSSO(); const api = usePimsApi(); const { data, refreshData, isLoading, loadOnce } = useDataLoader(api.users.getSelf, () => {}); - if (!data && keycloak.isAuthenticated) { + if (!data && sso.isAuthenticated) { loadOnce(); } diff --git a/react-app/src/pages/AccessRequest.tsx b/react-app/src/pages/AccessRequest.tsx index 81173a33dd..22aa141016 100644 --- a/react-app/src/pages/AccessRequest.tsx +++ b/react-app/src/pages/AccessRequest.tsx @@ -12,7 +12,7 @@ import { } from '@/constants/jsxSnippets'; import usePimsApi from '@/hooks/usePimsApi'; import { AccessRequest as AccessRequestType } from '@/hooks/api/useUsersApi'; -import { AuthContext } from '@/contexts/authContext'; +import { UserContext } from '@/contexts/authContext'; import { Navigate } from 'react-router-dom'; import TextFormField from '@/components/form/TextFormField'; import { useGroupedAgenciesApi } from '@/hooks/api/useGroupedAgenciesApi'; @@ -40,21 +40,21 @@ const StatusPageTemplate = (props: StatusPageTemplateProps) => { }; const RequestForm = ({ submitHandler }: { submitHandler: (d: any) => void }) => { - const keycloak = useSSO(); + const sso = useSSO(); const agencyOptions = useGroupedAgenciesApi().agencyOptions; const lookup = useContext(LookupContext); const provider = useMemo( - () => getProvider(keycloak.user?.preferred_username, lookup?.data?.Config?.bcscIdentifier), - [keycloak.user, lookup], + () => getProvider(sso.user?.preferred_username, lookup?.data?.Config?.bcscIdentifier), + [sso.user, lookup], ); const formMethods = useForm({ defaultValues: { Provider: provider ?? '', - FirstName: keycloak.user?.first_name || '', - LastName: keycloak.user?.last_name || '', - Email: keycloak.user?.email || '', + FirstName: sso.user?.first_name || '', + LastName: sso.user?.last_name || '', + Email: sso.user?.email || '', Notes: '', Agency: '', Position: '', @@ -64,14 +64,14 @@ const RequestForm = ({ submitHandler }: { submitHandler: (d: any) => void }) => useEffect(() => { formMethods.reset({ Provider: provider ?? '', - FirstName: keycloak.user?.first_name || '', - LastName: keycloak.user?.last_name || '', - Email: keycloak.user?.email || '', + FirstName: sso.user?.first_name || '', + LastName: sso.user?.last_name || '', + Email: sso.user?.email || '', Notes: '', Agency: '', Position: '', }); - }, [provider, keycloak.user]); + }, [provider, sso.user]); return ( <> @@ -132,7 +132,7 @@ const RequestForm = ({ submitHandler }: { submitHandler: (d: any) => void }) => export const AccessRequest = () => { const api = usePimsApi(); - const auth = useContext(AuthContext); + const auth = useContext(UserContext); const snackbar = useContext(SnackBarContext); const lookup = useContext(LookupContext); diff --git a/react-app/src/pages/Home.tsx b/react-app/src/pages/Home.tsx index b4eb9b5574..9cce5aa9aa 100644 --- a/react-app/src/pages/Home.tsx +++ b/react-app/src/pages/Home.tsx @@ -1,9 +1,9 @@ -import React, { useContext } from 'react'; +import React from 'react'; import { Box, Typography } from '@mui/material'; import propertyVector from '@/assets/images/PIMS_logo.svg'; import { landingPageBottomText, landingPageTopText } from '@/constants/strings'; -import { AuthContext } from '@/contexts/authContext'; import { Navigate } from 'react-router-dom'; +import { useSSO } from '@bcgov/citz-imb-sso-react'; const Landing = () => { return ( @@ -26,7 +26,7 @@ const Landing = () => { }; export const Home = () => { - const auth = useContext(AuthContext); + const sso = useSSO(); return ( { height={'100%'} bgcolor={'#F8F8F8'} //In the ticket this was #D2D8D8, but I think it was meant to be #F8F8F8 based on the example. > - {!auth.keycloak.isAuthenticated ? : } + {!sso.isAuthenticated ? : } ); };