diff --git a/src/components/Dashboard/ReservationPage/ReservationList/ReservationListSwitcher.tsx b/src/components/Dashboard/ReservationPage/ReservationList/ReservationListSwitcher.tsx index 0d2057b3851e5561604ffed90ca08cbb5ccdffe1..8d8d2db9eaa8d685d1c1403ea33adbfed95169d6 100644 --- a/src/components/Dashboard/ReservationPage/ReservationList/ReservationListSwitcher.tsx +++ b/src/components/Dashboard/ReservationPage/ReservationList/ReservationListSwitcher.tsx @@ -3,13 +3,14 @@ import { useRole } from 'hooks/useRole'; import { Roles } from 'roles/userRoles'; import { ReservationsListByWeek } from 'components/Dashboard/ReservationPage/ReservationList/ReservationsListByWeek'; import { ReservationList } from 'components/Dashboard/ReservationPage/ReservationList/ReservationList'; +import { useRoleObject } from 'hooks/useRoleObject'; export const ReservationListSwitcher: FC = () => { - const [role] = useRole(); + const role = useRoleObject(); return ( <> - {role === Roles.operator ? ( + {typeof role !== undefined && role?.isOperator ? ( <ReservationsListByWeek /> ) : ( <ReservationList /> diff --git a/src/hooks/useRoleObject.ts b/src/hooks/useRoleObject.ts new file mode 100644 index 0000000000000000000000000000000000000000..269caa453c29e20f6a6ed713b56c05e0c2af02a8 --- /dev/null +++ b/src/hooks/useRoleObject.ts @@ -0,0 +1,21 @@ +import { getRole } from 'api/getRole'; +import { getRoleObject } from 'api/getRoleObject'; +import { useEffect, useState } from 'react'; +import { RoleObjectType } from 'types/RoleObjectType'; + +export const useRoleObject = (): RoleObjectType | undefined => { + const [role, setRole] = useState<RoleObjectType>(); + + useEffect(() => { + let isMounted = true; + getRoleObject().then((responseRole) => { + if (isMounted) { + setRole(responseRole); + } + }); + return () => { + isMounted = false; + }; + }, []); + return role; +};