fix: use DialogContent

Altinn · Feb 25, 2025 · f8635f3 · f8635f3
1 parent cf32bd2
commit f8635f3
Show file tree

Hide file tree

Showing 33 changed files with 157 additions and 910 deletions.
diff --git a/packages/frontend/package.json b/packages/frontend/package.json
@@ -21,7 +21,7 @@
     "i18n:sort": "tsx ./src/i18n/check.ts --sort"
   },
   "dependencies": {
-    "@altinn/altinn-components": "^0.18.6",
+    "@altinn/altinn-components": "^0.18.7",
     "@digdir/designsystemet-css": "1.0.0-next.50",
     "@digdir/designsystemet-react": "1.0.0-next.50",
     "@digdir/designsystemet-theme": "1.0.0-next.50",

diff --git a/packages/frontend/src/api/useDialogById.tsx b/packages/frontend/src/api/useDialogById.tsx
@@ -11,9 +11,8 @@ import type {
   TransmissionFieldsFragment,
 } from 'bff-types-generated';
 import { AttachmentUrlConsumer } from 'bff-types-generated';
-import type { GuiActionButtonProps, InboxItemMetaField } from '../components';
+import type { GuiActionButtonProps } from '../components';
 import { QUERY_KEYS } from '../constants/queryKeys.ts';
-import { i18n } from '../i18n/config.ts';
 import { type ValueType, getPreferredPropertyByLocale } from '../i18n/property.ts';
 import { useOrganizations } from '../pages/Inbox/useOrganizations.ts';
 import { getOrganization } from './organizations.ts';
@@ -60,7 +59,6 @@ export interface DialogByIdDetails {
   sender: Participant;
   receiver: Participant;
   title: string;
-  metaFields: InboxItemMetaField[];
   guiActions: GuiActionButtonProps[];
   additionalInfo: { value: string; mediaType: string } | undefined;
   attachments: AttachmentFieldsFragment[];
@@ -77,6 +75,7 @@ export interface DialogByIdDetails {
 
 interface UseDialogByIdOutput {
   isSuccess: boolean;
+  isError: boolean;
   isLoading: boolean;
   dialog?: DialogByIdDetails;
 }
@@ -85,38 +84,6 @@ export const getDialogsById = (id: string): Promise<GetDialogByIdQuery> =>
     id,
   });
 
-export const getMetaFields = (item: DialogByIdFieldsFragment, isSeenByEndUser: boolean) => {
-  const nOtherSeen = item.seenSinceLastUpdate?.filter((seenLogEntry) => !seenLogEntry.isCurrentEndUser).length ?? 0;
-  const metaFields: InboxItemMetaField[] = [];
-
-  if (isSeenByEndUser && nOtherSeen) {
-    metaFields.push({
-      type: 'seenBy',
-      label: `${i18n.t('word.seenBy')} ${i18n.t('word.you')} ${i18n.t('word.and')} ${nOtherSeen} ${i18n.t('word.others')}`,
-      options: {
-        tooltip: item.seenSinceLastUpdate.map((seenLogEntry) => seenLogEntry.seenBy.actorName).join('\n'),
-      },
-    });
-  } else if (nOtherSeen) {
-    metaFields.push({
-      type: 'seenBy',
-      label: `${i18n.t('word.seenBy')} ${nOtherSeen} ${i18n.t('word.others')}`,
-      options: {
-        tooltip: item.seenSinceLastUpdate.map((seenLogEntry) => seenLogEntry.seenBy.actorName).join('\n'),
-      },
-    });
-  } else if (isSeenByEndUser) {
-    metaFields.push({
-      type: 'seenBy',
-      label: `${i18n.t('word.seenBy')} ${i18n.t('word.you')}`,
-      options: {
-        tooltip: item.seenSinceLastUpdate.map((seenLogEntry) => seenLogEntry.seenBy.actorName).join('\n'),
-      },
-    });
-  }
-  return metaFields;
-};
-
 const getMainContentReference = (
   args: { value: ValueType; mediaType: string } | undefined | null,
 ): EmbeddedContent | undefined => {
@@ -151,7 +118,6 @@ export function mapDialogToToInboxItem(
   const dialogReceiverParty = parties?.find((party) => party.party === item.party);
   const actualReceiverParty = dialogReceiverParty ?? endUserParty;
   const serviceOwner = getOrganization(organizations || [], item.org, 'nb');
-  const isSeenByEndUser = item.seenSinceLastUpdate.find((seenLogEntry) => seenLogEntry.isCurrentEndUser) !== undefined;
   const senderName = item.content.senderName?.value;
 
   return {
@@ -167,7 +133,6 @@ export function mapDialogToToInboxItem(
       name: actualReceiverParty?.name ?? '',
       isCompany: actualReceiverParty?.partyType === 'Organization',
     },
-    metaFields: getMetaFields(item, isSeenByEndUser),
     additionalInfo: {
       value: getPreferredPropertyByLocale(additionalInfoObj)?.value ?? '',
       mediaType: item.content?.additionalInfo?.mediaType ?? '',
@@ -222,7 +187,7 @@ export const useDialogById = (parties: PartyFieldsFragment[], id?: string): UseD
   const queryClient = useQueryClient();
   const { organizations, isLoading: isOrganizationsLoading } = useOrganizations();
   const partyURIs = parties.map((party) => party.party);
-  const { data, isSuccess, isLoading } = useQuery<GetDialogByIdQuery>({
+  const { data, isSuccess, isLoading, isError } = useQuery<GetDialogByIdQuery>({
     queryKey: [QUERY_KEYS.DIALOG_BY_ID, id, organizations],
     staleTime: 1000 * 60 * 10,
     retry: 3,
@@ -237,12 +202,13 @@ export const useDialogById = (parties: PartyFieldsFragment[], id?: string): UseD
   });
 
   if (isOrganizationsLoading) {
-    return { isLoading: true, isSuccess: false };
+    return { isLoading: true, isError: false, isSuccess: false };
   }
 
   return {
     isLoading,
     isSuccess,
     dialog: mapDialogToToInboxItem(data?.dialogById.dialog, parties, organizations),
+    isError,
   };
 };
diff --git a/packages/frontend/src/api/useDialogs.tsx b/packages/frontend/src/api/useDialogs.tsx
@@ -11,10 +11,9 @@ import {
   SystemLabel,
 } from 'bff-types-generated';
 import { t } from 'i18next';
-import type { InboxItemInput, InboxItemMetaField, InboxItemMetaFieldType } from '../components';
 import { QUERY_KEYS } from '../constants/queryKeys.ts';
-import { i18n } from '../i18n/config.ts';
 import { getPreferredPropertyByLocale } from '../i18n/property.ts';
+import type { InboxItemInput } from '../pages/Inbox/InboxItemInput.ts';
 import { useOrganizations } from '../pages/Inbox/useOrganizations.ts';
 import { getOrganization } from './organizations.ts';
 import { graphQLSDK } from './queries.ts';
@@ -28,6 +27,7 @@ interface UseDialogsOutput {
   dialogsByView: DialogsByView;
   isSuccess: boolean;
   isLoading: boolean;
+  isError: boolean;
 }
 
 export function mapDialogToToInboxItem(
@@ -190,7 +190,7 @@ export const useDialogs = (parties: PartyFieldsFragment[]): UseDialogsOutput =>
   const partiesToUse = parties ? parties : selectedParties;
   const mergedPartiesWithSubParties = flattenParties(partiesToUse);
 
-  const { data, isSuccess, isLoading } = useQuery<GetAllDialogsForPartiesQuery>({
+  const { data, isSuccess, isLoading, isError } = useQuery<GetAllDialogsForPartiesQuery>({
     queryKey: [QUERY_KEYS.DIALOGS, mergedPartiesWithSubParties, organizations],
     staleTime: 1000 * 60 * 10,
     retry: 3,
@@ -203,6 +203,7 @@ export const useDialogs = (parties: PartyFieldsFragment[]): UseDialogsOutput =>
   return {
     isLoading,
     isSuccess,
+    isError,
     dialogs,
     dialogsByView: {
       inbox: dialogs.filter((dialog) => dialog.viewType === 'inbox'),
@@ -214,49 +215,3 @@ export const useDialogs = (parties: PartyFieldsFragment[]): UseDialogsOutput =>
     dialogCountInconclusive: data?.searchDialogs?.hasNextPage === true || data?.searchDialogs?.items === null,
   };
 };
-
-export const getMetaFields = (item: SearchDialogFieldsFragment, isSeenByEndUser: boolean) => {
-  const nOtherSeen = item.seenSinceLastUpdate?.filter((seenLogEntry) => !seenLogEntry.isCurrentEndUser).length ?? 0;
-  const metaFields: InboxItemMetaField[] = [];
-  metaFields.push({
-    type: `status_${item.status}` as InboxItemMetaFieldType,
-    label: `${i18n.t('word.status')}: ${item.status}`,
-  });
-
-  metaFields.push({ type: 'timestamp', label: item.updatedAt });
-
-  if (typeof item.guiAttachmentCount === 'number' && item.guiAttachmentCount > 0) {
-    metaFields.push({
-      type: 'attachment',
-      label: item.guiAttachmentCount.toString(),
-    });
-  }
-
-  if (isSeenByEndUser && nOtherSeen) {
-    metaFields.push({
-      type: 'seenBy',
-      label: `${i18n.t('word.seenBy')} ${i18n.t('word.you')} ${i18n.t('word.and')} ${nOtherSeen} ${i18n.t('word.others')}`,
-      options: {
-        tooltip: item.seenSinceLastUpdate.map((seenLogEntry) => seenLogEntry.seenBy.actorName).join('\n'),
-      },
-    });
-  } else if (nOtherSeen) {
-    metaFields.push({
-      type: 'seenBy',
-      label: `${i18n.t('word.seenBy')} ${nOtherSeen} ${i18n.t('word.others')}`,
-      options: {
-        tooltip: item.seenSinceLastUpdate.map((seenLogEntry) => seenLogEntry.seenBy.actorName).join('\n'),
-      },
-    });
-  } else if (isSeenByEndUser) {
-    metaFields.push({
-      type: 'seenBy',
-      label: `${i18n.t('word.seenBy')} ${i18n.t('word.you')}`,
-      options: {
-        tooltip: item.seenSinceLastUpdate.map((seenLogEntry) => seenLogEntry.seenBy.actorName).join('\n'),
-      },
-    });
-  }
-
-  return metaFields;
-};
diff --git a/packages/frontend/src/components/Activity/Activity.tsx b/packages/frontend/src/components/Activity/Activity.tsx
@@ -1,9 +1,8 @@
 import { Avatar } from '@altinn/altinn-components';
 import { ActorType } from 'bff-types-generated';
+import { t } from 'i18next';
 import type { DialogActivity, Participant } from '../../api/useDialogById.tsx';
 import { useFormat } from '../../i18n/useDateFnsLocale.tsx';
-
-import { t } from 'i18next';
 import styles from './activity.module.css';
 
 interface ActivityProps {