@gen-epix/ui 1.14.4 → 1.15.0

package/src/pages/UserEffectiveRightsTesterAdminPage/UserEffectiveRightsTesterAdminPage.tsx

@@ -0,0 +1,283 @@
+import { useTranslation } from 'react-i18next';
+import {
+  Box,
+  Container,
+  Typography,
+} from '@mui/material';
+import {
+  useId,
+  useMemo,
+} from 'react';
+import { useParams } from 'react-router-dom';
+import { yupResolver } from '@hookform/resolvers/yup';
+import type { Resolver } from 'react-hook-form';
+import {
+  useForm,
+  useWatch,
+} from 'react-hook-form';
+import {
+  object,
+  string,
+} from 'yup';
+import noop from 'lodash/noop';
+
+import { TestIdUtil } from '../../utils/TestIdUtil';
+import { PageContainer } from '../../components/ui/PageContainer';
+import { ResponseHandler } from '../../components/ui/ResponseHandler';
+import { useColSetMembersQuery } from '../../dataHooks/useColSetMembersQuery';
+import { useCaseTypeSetMembersQuery } from '../../dataHooks/useCaseTypeSetMembersQuery';
+import { useDataCollectionOptionsQuery } from '../../dataHooks/useDataCollectionsQuery';
+import { useOrganizationAccessCasePoliciesQuery } from '../../dataHooks/useOrganizationAccessCasePoliciesQuery';
+import { useOrganizationShareCasePoliciesQuery } from '../../dataHooks/useOrganizationShareCasePoliciesQuery';
+import { useUserAccessCasePoliciesQuery } from '../../dataHooks/useUserAccessCasePoliciesQuery';
+import { useUserShareCasePoliciesQuery } from '../../dataHooks/useUserShareCasePoliciesQuery';
+import { useArray } from '../../hooks/useArray';
+import type { User } from '../../api';
+import { OrganizationApi } from '../../api';
+import { useItemQuery } from '../../hooks/useItemQuery';
+import { QUERY_KEY } from '../../models/query';
+import type { UserEffectiveRight } from '../../models/caseAccess';
+import { EffectiveRightsUtil } from '../../utils/EffectiveRightsUtil';
+import { useCaseTypeOptionsQuery } from '../../dataHooks/useCaseTypesQuery';
+import type { FormFieldDefinition } from '../../models/form';
+import { FORM_FIELD_DEFINITION_TYPE } from '../../models/form';
+import { GenericForm } from '../../components/form/helpers/GenericForm';
+import { useOrganizationMapQuery } from '../../dataHooks/useOrganizationsQuery';
+
+type FormFields = {
+  caseTypeId: string;
+  dataCollectionId: string;
+  fromDataCollectionId: string;
+};
+
+type Result = {
+  add_case: boolean;
+  remove_case: boolean;
+  add_case_set: boolean;
+  remove_case_set: boolean;
+  read_col_ids: string[];
+  write_col_ids: string[];
+  read_case_set: boolean;
+  write_case_set: boolean;
+  has_share_case_rights?: boolean;
+};
+
+export const UserEffectiveRightsTesterAdminPage = () => {
+  const { t } = useTranslation();
+  const formId = useId();
+
+  const { userId } = useParams();
+
+  const userQuery = useItemQuery<User>({
+    baseQueryKey: QUERY_KEY.USERS,
+    itemId: userId,
+    useQueryOptions: {
+      queryFn: async ({ signal }) => {
+        const response = await OrganizationApi.instance.usersGetOne(userId, { signal });
+        return response.data;
+      },
+    },
+  });
+
+  const colSetMembersQuery = useColSetMembersQuery();
+  const caseTypeOptionsQuery = useCaseTypeOptionsQuery();
+  const organizationMapQuery = useOrganizationMapQuery();
+  const caseTypeSetMembersQuery = useCaseTypeSetMembersQuery();
+  const dataCollectionOptionsQuery = useDataCollectionOptionsQuery();
+  const organizationAccessCasePoliciesQuery = useOrganizationAccessCasePoliciesQuery(policies => policies.filter(policy => policy.is_active && policy.organization_id === userQuery.data?.organization_id));
+  const organizationShareCasePoliciesQuery = useOrganizationShareCasePoliciesQuery(policies => policies.filter(policy => policy.is_active && policy.organization_id === userQuery.data?.organization_id));
+  const userAccessCasePoliciesQuery = useUserAccessCasePoliciesQuery(policies => policies.filter(policy => policy.is_active && policy.user_id === userQuery.data?.id));
+  const userShareCasePoliciesQuery = useUserShareCasePoliciesQuery(policies => policies.filter(policy => policy.is_active && policy.user_id === userQuery.data?.id));
+
+  const loadables = useArray([
+    userQuery,
+    colSetMembersQuery,
+    caseTypeOptionsQuery,
+    caseTypeSetMembersQuery,
+    dataCollectionOptionsQuery,
+    organizationAccessCasePoliciesQuery,
+    organizationShareCasePoliciesQuery,
+    userAccessCasePoliciesQuery,
+    userShareCasePoliciesQuery,
+    organizationMapQuery,
+  ]);
+
+
+  const effectiveRights = useMemo<UserEffectiveRight[]>(() => {
+    const { data: organizationAccessCasePolicies } = organizationAccessCasePoliciesQuery;
+    const { data: organizationShareCasePolicies } = organizationShareCasePoliciesQuery;
+    const { data: userAccessCasePolicies } = userAccessCasePoliciesQuery;
+    const { data: userShareCasePolicies } = userShareCasePoliciesQuery;
+    const { data: caseTypeSetMembers } = caseTypeSetMembersQuery;
+    const { data: colSetMembers } = colSetMembersQuery;
+
+    return EffectiveRightsUtil.assembleUserEffectiveRights({
+      user: userQuery.data,
+      organizationAccessCasePolicies,
+      organizationShareCasePolicies,
+      userAccessCasePolicies,
+      userShareCasePolicies,
+      caseTypeSetMembers,
+      colSetMembers,
+    });
+
+  }, [colSetMembersQuery, caseTypeSetMembersQuery, organizationAccessCasePoliciesQuery, organizationShareCasePoliciesQuery, userAccessCasePoliciesQuery, userQuery.data, userShareCasePoliciesQuery]);
+
+  const schema = useMemo(() => object<FormFields>().shape({
+    caseTypeId: string().uuid4().required(),
+    dataCollectionId: string().uuid4().required(),
+    fromDataCollectionId: string().uuid4().nullable().notRequired(),
+  }), []);
+
+  const formMethods = useForm<FormFields>({
+    resolver: yupResolver(schema) as unknown as Resolver<FormFields>,
+    values: {
+      caseTypeId: null,
+      dataCollectionId: null,
+      fromDataCollectionId: null,
+    },
+  });
+  const { handleSubmit, control } = formMethods;
+  const formValues = useWatch({ control });
+
+  const result = useMemo<Result>(() => {
+    if (!formValues.caseTypeId || !formValues.dataCollectionId) {
+      return null;
+    }
+    const effectiveRight = effectiveRights.find(right => {
+      return right.data_collection_id === formValues.dataCollectionId && right.categorized_case_type_ids.some(x => x === formValues.caseTypeId);
+    });
+
+    const shareCaseRight = formValues.fromDataCollectionId && effectiveRight?.effective_share_case_rights?.find(shareRight => {
+      return shareRight.categorized_case_type_ids.some(x => x === formValues.caseTypeId) && shareRight.from_data_collection_id === formValues.fromDataCollectionId;
+    });
+
+    return {
+      add_case: effectiveRight?.add_case || shareCaseRight?.add_case,
+      remove_case: effectiveRight?.remove_case || shareCaseRight?.remove_case,
+      add_case_set: effectiveRight?.add_case_set || shareCaseRight?.add_case_set,
+      remove_case_set: effectiveRight?.remove_case_set || shareCaseRight?.remove_case_set,
+      read_case_set: effectiveRight?.read_case_set,
+      write_case_set: effectiveRight?.write_case_set,
+      read_col_ids: effectiveRight?.categorized_read_col_ids,
+      write_col_ids: effectiveRight?.categorized_write_col_ids,
+      has_share_case_rights: effectiveRight?.effective_share_case_rights.length > 0,
+    } satisfies Result;
+  }, [effectiveRights, formValues.caseTypeId, formValues.dataCollectionId, formValues.fromDataCollectionId]);
+
+  const formFieldDefinitions = useMemo<FormFieldDefinition<FormFields>[]>(() => {
+    return [
+      {
+        definition: FORM_FIELD_DEFINITION_TYPE.AUTOCOMPLETE,
+        name: 'caseTypeId',
+        label: t`Case type`,
+        options: caseTypeOptionsQuery.options,
+        loading: caseTypeOptionsQuery.isLoading,
+      } as const satisfies FormFieldDefinition<FormFields>,
+      {
+        definition: FORM_FIELD_DEFINITION_TYPE.AUTOCOMPLETE,
+        name: 'dataCollectionId',
+        label: t`Data collection`,
+        options: dataCollectionOptionsQuery.options,
+        loading: dataCollectionOptionsQuery.isLoading,
+      } as const satisfies FormFieldDefinition<FormFields>,
+      {
+        definition: FORM_FIELD_DEFINITION_TYPE.AUTOCOMPLETE,
+        name: 'fromDataCollectionId',
+        label: t`From data collection`,
+        options: dataCollectionOptionsQuery.options,
+        loading: dataCollectionOptionsQuery.isLoading,
+        disabled: !result?.has_share_case_rights,
+      } as const satisfies FormFieldDefinition<FormFields>,
+    ] as const;
+  }, [caseTypeOptionsQuery.isLoading, caseTypeOptionsQuery.options, dataCollectionOptionsQuery.isLoading, dataCollectionOptionsQuery.options, result?.has_share_case_rights, t]);
+
+
+  return (
+    <PageContainer
+      fullWidth
+      showBreadcrumbs
+      testIdAttributes={TestIdUtil.createAttributes('UserEffectiveRightsTesterAdminPage')}
+      title={t`Users effective rights`}
+    >
+      <Box
+        sx={{
+          position: 'relative',
+          height: '100%',
+        }}
+      >
+        <ResponseHandler
+          inlineSpinner
+          loadables={loadables}
+        >
+          <Container maxWidth={'md'}>
+            <Box marginY={2}>
+              <Typography
+                component={'h2'}
+                variant={'h4'}
+              >
+                {t('Testing effective rights for user: {{userEmail}}', { userEmail: userQuery.data?.email })}
+              </Typography>
+              <Typography>
+                {t('Organization: {{organizationName}}', { organizationName: organizationMapQuery.map.get(userQuery.data?.organization_id)?.name })}
+              </Typography>
+              <Typography>
+                {t('Roles: {{roles}}', { roles: userQuery.data?.roles.join(', ') })}
+              </Typography>
+            </Box>
+            <GenericForm<FormFields>
+              formFieldDefinitions={formFieldDefinitions}
+              formId={formId}
+              formMethods={formMethods}
+              schema={schema}
+              onSubmit={handleSubmit(noop)}
+            />
+            {result !== null && typeof result === 'object' && (
+              <Box marginY={2}>
+                <Typography variant={'h6'}>
+                  {t('Effective rights result:')}
+                </Typography>
+                {!formValues.fromDataCollectionId && result.has_share_case_rights && (
+                  <Box marginY={2}>
+                    <Typography
+                      sx={{
+                        fontStyle: 'italic',
+                      }}
+                    >
+                      {t`Note: The user has share case rights that may affect the result when a 'From data collection' is selected.`}
+                    </Typography>
+                  </Box>
+                )}
+                <Typography>
+                  {t('Add case: {{addCase}}', { addCase: result?.add_case ? t`Yes` : t`No` })}
+                </Typography>
+                <Typography>
+                  {t('Remove case: {{removeCase}}', { removeCase: result?.remove_case ? t`Yes` : t`No` })}
+                </Typography>
+                <Typography>
+                  {t('Add case set: {{addCaseSet}}', { addCaseSet: result?.add_case_set ? t`Yes` : t`No` })}
+                </Typography>
+                <Typography>
+                  {t('Remove case set: {{removeCaseSet}}', { removeCaseSet: result?.remove_case_set ? t`Yes` : t`No` })}
+                </Typography>
+                <Typography>
+                  {t('Read case set: {{readCaseSet}}', { readCaseSet: result?.read_case_set ? t`Yes` : t`No` })}
+                </Typography>
+                <Typography>
+                  {t('Write case set: {{writeCaseSet}}', { writeCaseSet: result?.write_case_set ? t`Yes` : t`No` })}
+                </Typography>
+                <Typography>
+                  {t('Read case properties: {{readSomeProperties}}', { readSomeProperties: result?.read_col_ids?.length > 0 ? t`Yes` : t`No` })}
+                </Typography>
+                <Typography>
+                  {t('Write case properties: {{writeSomeProperties}}', { writeSomeProperties: result?.write_col_ids?.length > 0 ? t`Yes` : t`No` })}
+                </Typography>
+
+              </Box>
+            )}
+          </Container>
+        </ResponseHandler>
+      </Box>
+    </PageContainer>
+  );
+};

package/src/pages/UserEffectiveRightsTesterAdminPage/index.ts

@@ -0,0 +1 @@
+export * from './UserEffectiveRightsTesterAdminPage';

package/src/pages/UserInvitationsAdminPage/UserInvitationConsumeDialog.tsx

@@ -0,0 +1,143 @@
+import { useTranslation } from 'react-i18next';
+import { Box } from '@mui/material';
+import type { ReactElement } from 'react';
+import {
+  useCallback,
+  useEffect,
+  useId,
+  useMemo,
+  useState,
+} from 'react';
+import {
+  object,
+  string,
+} from 'yup';
+import { yupResolver } from '@hookform/resolvers/yup';
+import type { Resolver } from 'react-hook-form';
+import { useForm } from 'react-hook-form';
+
+import {
+  OrganizationApi,
+  type UserInvitation,
+} from '../../api';
+import type {
+  WithDialogRenderProps,
+  WithDialogRefMethods,
+} from '../../hoc/withDialog';
+import { withDialog } from '../../hoc/withDialog';
+import { TestIdUtil } from '../../utils/TestIdUtil';
+import type { FormFieldDefinition } from '../../models/form';
+import { FORM_FIELD_DEFINITION_TYPE } from '../../models/form';
+import { GenericForm } from '../../components/form/helpers/GenericForm';
+import { AuthenticationManager } from '../../classes/managers/AuthenticationManager';
+import { ResponseHandler } from '../../components/ui/ResponseHandler';
+import { QueryUtil } from '../../utils/QueryUtil';
+import { QUERY_KEY } from '../../models/query';
+import { NotificationManager } from '../../classes/managers/NotificationManager';
+
+export interface UserInvitationConsumeDialogOpenProps {
+  item: UserInvitation;
+}
+
+export interface UserInvitationConsumeDialogProps extends WithDialogRenderProps<UserInvitationConsumeDialogOpenProps> {
+}
+
+export type UserInvitationConsumeDialogRefMethods = WithDialogRefMethods<UserInvitationConsumeDialogProps, UserInvitationConsumeDialogOpenProps>;
+
+type FormFields = {
+  bearerToken: string;
+};
+
+export const UserInvitationConsumeDialog = withDialog<UserInvitationConsumeDialogProps, UserInvitationConsumeDialogOpenProps>((
+  {
+    onTitleChange,
+    openProps,
+    onActionsChange,
+    onClose,
+  }: UserInvitationConsumeDialogProps,
+): ReactElement => {
+  const { t } = useTranslation();
+  const formId = useId();
+  const [error, setError] = useState<unknown>(null);
+
+  const schema = useMemo(() => object<FormFields>().shape({
+    bearerToken: string().required(),
+  }), []);
+
+  const formFieldDefinitions = useMemo<FormFieldDefinition<FormFields>[]>(() => [
+      {
+        definition: FORM_FIELD_DEFINITION_TYPE.TEXTFIELD,
+        name: 'bearerToken',
+        label: t`Bearer Token`,
+        rows: 10,
+        multiline: true,
+      } as const satisfies FormFieldDefinition<FormFields>,
+  ] as const, [t]);
+
+  const formMethods = useForm<FormFields>({
+    resolver: yupResolver(schema, undefined,{ raw: true }) as Resolver<FormFields>,
+    values: {
+      bearerToken: '',
+    },
+  });
+  const { handleSubmit } = formMethods;
+
+  const onFormSubmit = useCallback(async (data: FormFields) => {
+    try {
+      AuthenticationManager.instance.temporaryToken = data.bearerToken;
+      await OrganizationApi.instance.userRegistrationsPostOne(openProps.item.token);
+      NotificationManager.instance.showNotification({
+        message: t`Invitation has been consumed by bearer token`,
+        severity: 'success',
+      });
+      onClose();
+    } catch (responseError) {
+      setError(responseError);
+    } finally {
+      delete AuthenticationManager.instance.temporaryToken;
+      const queryKeys = QueryUtil.getQueryKeyDependencies([QUERY_KEY.USER_INVITATIONS], true);
+      await QueryUtil.invalidateQueryKeys(queryKeys);
+    }
+  }, [onClose, openProps.item.token, t]);
+
+  useEffect(() => {
+    onTitleChange(t`Consume invitation with bearer token`);
+  }, [onTitleChange, openProps.item.key, t]);
+
+
+  useEffect(() => {
+    onActionsChange([
+      {
+        ...TestIdUtil.createAttributes('UserInvitationConsumeDialog-agree'),
+        color: 'primary',
+        variant: 'contained',
+        type: 'submit',
+        form: formId,
+        label: t('Submit'),
+        disabled: !!error,
+      },
+    ]);
+  }, [onActionsChange, t, formId, error]);
+
+  return (
+    <Box>
+      <ResponseHandler
+        shouldHideActionButtons
+        error={error}
+      >
+        <GenericForm<FormFields>
+          formFieldDefinitions={formFieldDefinitions}
+          formId={formId}
+          formMethods={formMethods}
+          schema={schema}
+          onSubmit={handleSubmit(onFormSubmit)}
+        />
+      </ResponseHandler>
+    </Box>
+  );
+}, {
+  testId: 'UserInvitationConsumeDialog',
+  maxWidth: 'md',
+  fullWidth: true,
+  defaultTitle: '',
+});

package/src/pages/UserInvitationsAdminPage/UserInvitationShareDialog.tsx

@@ -0,0 +1,100 @@
+import { useTranslation } from 'react-i18next';
+import EmailIcon from '@mui/icons-material/Email';
+import {
+  Box,
+  Typography,
+} from '@mui/material';
+import type { ReactElement } from 'react';
+import {
+  useEffect,
+  useMemo,
+} from 'react';
+import { format } from 'date-fns';
+
+import type { UserInvitation } from '../../api';
+import { ConfigManager } from '../../classes/managers/ConfigManager';
+import { WindowManager } from '../../classes/managers/WindowManager';
+import { CopyToClipboardButton } from '../../components/ui/CopyToClipboardButton';
+import type {
+  WithDialogRenderProps,
+  WithDialogRefMethods,
+} from '../../hoc/withDialog';
+import { withDialog } from '../../hoc/withDialog';
+import { TestIdUtil } from '../../utils/TestIdUtil';
+import { DATE_FORMAT } from '../../data/date';
+
+export interface UserInvitationShareDialogOpenProps {
+  item: UserInvitation;
+}
+
+export interface UserInvitationShareDialogProps extends WithDialogRenderProps<UserInvitationShareDialogOpenProps> {
+}
+
+export type UserInvitationShareDialogRefMethods = WithDialogRefMethods<UserInvitationShareDialogProps, UserInvitationShareDialogOpenProps>;
+
+export const UserInvitationShareDialog = withDialog<UserInvitationShareDialogProps, UserInvitationShareDialogOpenProps>((
+  {
+    onTitleChange,
+    openProps,
+    onActionsChange,
+  }: UserInvitationShareDialogProps,
+): ReactElement => {
+  const { t } = useTranslation();
+
+  useEffect(() => {
+    onTitleChange(t('Invitation details for {{email}}', { email: openProps.item.key }));
+  }, [onTitleChange, openProps.item.key, t]);
+
+  const expiryDate = useMemo(() => {
+    return format(openProps.item.expires_at, DATE_FORMAT.DATE);
+  }, [openProps.item.expires_at]);
+
+  const invitationLink = useMemo(() => {
+    const url = new URL(WindowManager.instance.window.location.href);
+    url.search = '';
+    url.hash = '';
+    url.pathname = `/accept-invitation/${openProps.item.token}`;
+    return url.toString();
+  }, [openProps.item.token]);
+
+  const shareInvitationHref = useMemo(() => {
+    return `mailto:?subject=${t('Invitation to join {{applicationName}}', { applicationName: ConfigManager.instance.config.applicationName })}&body=${t('Use the following link to accept the invitation: {{invitationLink}}. This link will expire: {{expiryDate}}.', { invitationLink, expiryDate })}&to=${openProps.item.key}`;
+  }, [expiryDate, invitationLink, openProps.item.key, t]);
+
+
+  useEffect(() => {
+    onActionsChange([
+      {
+        ...TestIdUtil.createAttributes('UserInvitationShareDialog-agree'),
+        href: shareInvitationHref,
+        color: 'primary',
+        variant: 'contained',
+        startIcon: <EmailIcon />,
+        label: t('Email invitation link'),
+      },
+      <CopyToClipboardButton
+        key={'copyToClipboard'}
+        buttonText={t('Copy invitation link to clipboard')}
+        clipboardValue={invitationLink}
+      />,
+    ]);
+  }, [onActionsChange, shareInvitationHref, t, invitationLink]);
+
+  return (
+    <Box>
+      <Box>
+        <Typography>
+          {t('The invitation for {{email}} will expire on {{expiryDate}}.', { email: openProps.item.key, expiryDate })}
+        </Typography>
+      </Box>
+      <Box marginY={1}>
+        {t('Invitation link: {{invitationLink}}', { email: openProps.item.key, invitationLink })}
+      </Box>
+    </Box>
+  );
+}, {
+  testId: 'UserInvitationShareDialog',
+  maxWidth: 'md',
+  fullWidth: true,
+  defaultTitle: '',
+});