✨ Handover notifications in Sidesheet

libs/handoversidesheet/src/lib/types.ts

@@ -115,3 +115,12 @@ export type HandoverWorkOrder = {
   commissioningPackageUrlId: string | null;
   commpkgNumber: string | null;
 } & HandoverChild;
+
+export type HandoverNotification = {
+  notificationNo: string;
+  type: string;
+  title: string;
+  status: string;
+  nextToSign: string;
+  notificationUrl: string;
+}

libs/handoversidesheet/src/lib/ui-sidesheet/HandoverSidesheet.tsx

@@ -21,6 +21,7 @@ import {
   PunchTab,
   QueryTab,
   SwcrTab,
+  NotificationTab,
   UnsignedActionTab,
   UnsignedTaskTab,
   UnsignedChecklistTab,
@@ -145,6 +146,12 @@ const HandoverSidesheetComponent = (props: Required<HandoverProps>) => {
     error: queryError,
   } = useHandoverResource(props.id, 'query');
 
+  const {
+    data: notifications,
+    dataIsFetching: isDataFetchingNotifications,
+    error: notificationsError,
+  } = useHandoverResource(props.item.commissioningPackageId, 'notifications');
+
   const {
     data: ncrPackages,
     dataIsFetching: isDataFetchingNcr,
@@ -233,7 +240,6 @@ const HandoverSidesheetComponent = (props: Required<HandoverProps>) => {
             </Tabs.Tab>
             <Tabs.Tab>
               Unsigned Checklists
-
               <TabTitle
                 data={unsignedChecklists}
                 isLoading={isDataFetchingUnsignedChecklists}
@@ -250,6 +256,14 @@ const HandoverSidesheetComponent = (props: Required<HandoverProps>) => {
               Query <TabTitle data={queryPackages} isLoading={isDataFetchingQuery} />{' '}
             </Tabs.Tab>
 
+            <Tabs.Tab>
+              Notifications
+              <TabTitle
+                data={notifications}
+                isLoading={isDataFetchingNotifications}
+              />{' '}
+            </Tabs.Tab>
+
             <Tabs.Tab>
               NCR <TabTitle data={ncrPackages} isLoading={isDataFetchingNcr} />{' '}
             </Tabs.Tab>
@@ -321,6 +335,13 @@ const HandoverSidesheetComponent = (props: Required<HandoverProps>) => {
               error={queryError}
             />
           </StyledPanel>
+          <StyledPanel>
+            <NotificationTab
+              notifications={notifications}
+              isFetching={isDataFetchingNotifications}
+              error={notificationsError}
+            />
+          </StyledPanel>
           <StyledPanel>
             <NcrTab
               ncrs={ncrPackages}

libs/handoversidesheet/src/lib/utils-sidesheet/useHandoverResource.ts

@@ -13,6 +13,7 @@ import {
   HandoverUnsignedChecklist,
   HandoverUnsignedTask,
   HandoverWorkOrder,
+  HandoverNotification
 } from '../types';
 
 export type HandoverResourceTypeMap = {
@@ -26,6 +27,7 @@ export type HandoverResourceTypeMap = {
   details: HandoverDetails;
   ncr: HandoverNCR;
   query: HandoverQuery;
+  notifications: HandoverNotification;
 };
 
 type UseHandoverResource<T extends keyof HandoverResourceTypeMap> = {

libs/shared/src/packages/sidesheet/src/lib/sidesheet/tabs/index.ts

@@ -10,3 +10,4 @@ export * from './unsignedChecklist';
 export * from './details';
 export * from './material';
 export * from './mccr';
+export * from './notification';

libs/shared/src/packages/sidesheet/src/lib/sidesheet/tabs/notification/NotificationTab.tsx

@@ -0,0 +1,27 @@
+import { TabTable } from '../../../../../../table-helpers/src/lib/table/TabTable/TabTable';
+import { StyledContentWrapper } from '@cc-components/sharedcomponents';
+import { columns } from './columns';
+import { NotificationBase } from './types';
+
+type NotificationTabProps<T> = {
+  notifications: T[] | undefined;
+  isFetching: boolean;
+  error: Error | null;
+};
+export const NotificationTab = <T extends NotificationBase>({
+  error,
+  isFetching,
+  notifications,
+}: NotificationTabProps<T>): JSX.Element => {
+  return (
+    <StyledContentWrapper>
+      <TabTable
+        columns={columns}
+        error={error}
+        isFetching={isFetching}
+        packages={notifications}
+        resourceName="Notification"
+      />
+    </StyledContentWrapper>
+  );
+};

libs/shared/src/packages/sidesheet/src/lib/sidesheet/tabs/notification/columns.tsx

@@ -0,0 +1,38 @@
+import { ColDef, ICellRendererProps } from '@equinor/workspace-ag-grid';
+
+import { DescriptionCell } from '../../../../../../table-helpers/src/lib/table/cells/DescriptionCell';
+import { LinkCell } from '../../../../../../table-helpers/src/lib/table/cells/LinkCell';
+import { NotificationBase } from './types';
+
+export const columns: ColDef<NotificationBase>[] = [
+  {
+    headerName: 'Document No.',
+    valueGetter: (pkg) => pkg.data?.notificationNo,
+    cellRenderer: (props: ICellRendererProps<NotificationBase, string | null>) => {
+      return (
+        <LinkCell
+          url={props.data?.notificationUrl}
+          urlText={props.data?.notificationNo}
+        />
+      );
+    },
+  },
+  {
+    colId: 'title',
+    headerName: 'Title',
+    valueGetter: (pkg) => pkg.data?.title,
+    cellRenderer: (props: ICellRendererProps<NotificationBase, string | null>) => {
+      return <DescriptionCell description={props.value} />;
+    },
+    width: 200,
+  },
+  {
+    headerName: 'Status',
+    valueGetter: (pkg) => pkg.data?.status,
+  },
+
+  {
+    headerName: 'Next to sign',
+    valueGetter: (pkg) => pkg.data?.nextToSign,
+  },
+];

libs/shared/src/packages/sidesheet/src/lib/sidesheet/tabs/notification/index.ts

@@ -0,0 +1 @@
+export { NotificationTab } from './NotificationTab';

libs/shared/src/packages/sidesheet/src/lib/sidesheet/tabs/notification/types.ts

@@ -0,0 +1,8 @@
+export type NotificationBase = {
+  notificationNo: string;
+  type: string;
+  title: string;
+  status: string;
+  nextToSign: string;
+  notificationUrl: string;
+};

libs/shared/src/packages/sidesheet/src/lib/sidesheet/tabs/query/QueryTab.tsx

@@ -20,7 +20,7 @@ export const QueryTab = <T extends QueryBase>({
         error={error}
         isFetching={isFetching}
         packages={queries}
-        resourceName="Query / Notification"
+        resourceName="Query"
       />
     </StyledContentWrapper>
   );