diff --git a/apps/service-portal/src/components/DocumentsEmpty/DocumentsEmpty.css.ts b/apps/service-portal/src/components/DocumentsEmpty/DocumentsEmpty.css.ts new file mode 100644 index 000000000000..3ae765b21300 --- /dev/null +++ b/apps/service-portal/src/components/DocumentsEmpty/DocumentsEmpty.css.ts @@ -0,0 +1,13 @@ +import { theme } from '@island.is/island-ui/theme' +import { style } from '@vanilla-extract/css' + +export const lock = style({ + position: 'absolute', + zIndex: 1, + top: theme.spacing[2], + right: theme.spacing[3], +}) + +export const img = style({ + height: 180, +}) diff --git a/apps/service-portal/src/components/DocumentsEmpty/DocumentsEmpty.tsx b/apps/service-portal/src/components/DocumentsEmpty/DocumentsEmpty.tsx new file mode 100644 index 000000000000..516d77d1db4b --- /dev/null +++ b/apps/service-portal/src/components/DocumentsEmpty/DocumentsEmpty.tsx @@ -0,0 +1,59 @@ +import { Box, Icon, Text } from '@island.is/island-ui/core' +import { useLocale } from '@island.is/localization' +import { m } from '@island.is/service-portal/core' +import * as styles from './DocumentsEmpty.css' + +interface Props { + hasDelegationAccess: boolean +} + +export const DocumentsEmpty = ({ hasDelegationAccess }: Props) => { + const { formatMessage } = useLocale() + + return ( + + + {hasDelegationAccess + ? formatMessage(m.emptyDocumentsList) + : formatMessage(m.accessNeeded)} + + {!hasDelegationAccess && ( + + {formatMessage(m.accessDeniedText)} + + )} + + { + No access + } + + {!hasDelegationAccess && ( + + )} + + ) +} + +export default DocumentsEmpty diff --git a/apps/service-portal/src/components/Header/Header.tsx b/apps/service-portal/src/components/Header/Header.tsx index 5bd6d74d1eab..21c913b99da0 100644 --- a/apps/service-portal/src/components/Header/Header.tsx +++ b/apps/service-portal/src/components/Header/Header.tsx @@ -26,6 +26,7 @@ import { useWindowSize } from 'react-use' import NotificationButton from '../Notifications/NotificationButton' import Sidemenu from '../Sidemenu/Sidemenu' import * as styles from './Header.css' +import { DocumentsScope } from '@island.is/auth/scopes' export type MenuTypes = 'side' | 'user' | 'notifications' | undefined interface Props { @@ -57,6 +58,10 @@ export const Header = ({ position }: Props) => { // eslint-disable-next-line react-hooks/exhaustive-deps }, []) + const hasNotificationsDelegationAccess = user?.scopes?.includes( + DocumentsScope.main, + ) + return (
@@ -96,7 +101,6 @@ export const Header = ({ position }: Props) => { flexWrap="nowrap" marginLeft={[1, 1, 2]} > - {user && } { setMenuOpen(val)} showMenu={menuOpen === 'notifications'} + disabled={!hasNotificationsDelegationAccess} /> )} + {user && } +