@orchestrator-ui/orchestrator-ui-components 7.4.1 → 7.5.1

package/src/components/WfoSubscriptionsList/subscriptionResultMappers.ts

@@ -3,57 +3,45 @@ import { Subscription } from '@/types';
 import { parseDate } from '@/utils';
 
 export type SubscriptionListItem = Pick<
-    Subscription,
-    'subscriptionId' | 'description' | 'status' | 'insync' | 'note'
+  Subscription,
+  'subscriptionId' | 'description' | 'status' | 'insync' | 'note'
 > & {
-    startDate: Date | null;
-    endDate: Date | null;
-    productName: string;
-    tag: string | null;
-    customerFullname: string;
-    customerShortcode: string;
-    metadata: object | null;
+  startDate: Date | null;
+  endDate: Date | null;
+  productName: string;
+  tag: string | null;
+  customerFullname: string;
+  customerShortcode: string;
+  metadata: object | null;
 };
 
-export const mapGraphQlSubscriptionsResultToPageInfo = (
-    graphqlResponse: SubscriptionListResponse,
-) => graphqlResponse.pageInfo;
+export const mapGraphQlSubscriptionsResultToPageInfo = (graphqlResponse: SubscriptionListResponse) =>
+  graphqlResponse.pageInfo;
 
 export const mapGraphQlSubscriptionsResultToSubscriptionListItems = (
-    graphqlResponse: SubscriptionListResponse | undefined,
+  graphqlResponse: SubscriptionListResponse | undefined,
 ): SubscriptionListItem[] => {
-    if (!graphqlResponse) return [];
-    return graphqlResponse.subscriptions.map((subscription) => {
-        const {
-            description,
-            insync,
-            product,
-            startDate,
-            endDate,
-            status,
-            subscriptionId,
-            note,
-            customer,
-            metadata,
-        } = subscription;
+  if (!graphqlResponse) return [];
+  return graphqlResponse.subscriptions.map((subscription) => {
+    const { description, insync, product, startDate, endDate, status, subscriptionId, note, customer, metadata } =
+      subscription;
 
-        const { name: productName, tag } = product;
-        const { fullname: customerFullname, shortcode: customerShortcode } =
-            customer;
+    const { name: productName, tag } = product;
+    const { fullname: customerFullname, shortcode: customerShortcode } = customer;
 
-        return {
-            subscriptionId,
-            description,
-            status,
-            insync,
-            startDate: parseDate(startDate),
-            endDate: parseDate(endDate),
-            note,
-            productName,
-            tag,
-            customerFullname,
-            customerShortcode,
-            metadata: Object.keys(metadata).length > 0 ? metadata : null,
-        };
-    });
+    return {
+      subscriptionId,
+      description,
+      status,
+      insync,
+      startDate: parseDate(startDate),
+      endDate: parseDate(endDate),
+      note,
+      productName,
+      tag,
+      customerFullname,
+      customerShortcode,
+      metadata: Object.keys(metadata).length > 0 ? metadata : null,
+    };
+  });
 };

package/src/components/WfoSummary/WfoActiveWorkflowsSummaryCard.tsx

@@ -2,40 +2,31 @@ import React from 'react';
 
 import { useTranslations } from 'next-intl';
 
-import {
-    PATH_WORKFLOWS,
-    SummaryCardStatus,
-    WfoSummaryCard,
-} from '@/components';
+import { PATH_WORKFLOWS, SummaryCardStatus, WfoSummaryCard } from '@/components';
 import { mapProcessSummaryToSummaryCardListItem } from '@/pages/startPage/mappers';
 import { activeWorkflowsListSummaryQueryVariables } from '@/pages/startPage/queryVariables';
 import { useGetProcessListSummaryQuery } from '@/rtk';
 import { optionalArrayMapper } from '@/utils';
 
 export const WfoActiveWorkflowsSummaryCard = () => {
-    const t = useTranslations('startPage.activeWorkflows');
+  const t = useTranslations('startPage.activeWorkflows');
 
-    const {
-        data: activeWorkflowsSummaryResponse,
-        isFetching,
-        isLoading,
-    } = useGetProcessListSummaryQuery(activeWorkflowsListSummaryQueryVariables);
+  const {
+    data: activeWorkflowsSummaryResponse,
+    isFetching,
+    isLoading,
+  } = useGetProcessListSummaryQuery(activeWorkflowsListSummaryQueryVariables);
 
-    return (
-        <WfoSummaryCard
-            headerTitle={t('headerTitle')}
-            headerValue={
-                activeWorkflowsSummaryResponse?.pageInfo.totalItems ?? '-'
-            }
-            headerStatus={SummaryCardStatus.Success}
-            listTitle={t('listTitle')}
-            listItems={optionalArrayMapper(
-                activeWorkflowsSummaryResponse?.processes,
-                mapProcessSummaryToSummaryCardListItem,
-            )}
-            button={{ name: t('buttonText'), url: PATH_WORKFLOWS }}
-            isLoading={isLoading}
-            isFetching={isFetching}
-        />
-    );
+  return (
+    <WfoSummaryCard
+      headerTitle={t('headerTitle')}
+      headerValue={activeWorkflowsSummaryResponse?.pageInfo.totalItems ?? '-'}
+      headerStatus={SummaryCardStatus.Success}
+      listTitle={t('listTitle')}
+      listItems={optionalArrayMapper(activeWorkflowsSummaryResponse?.processes, mapProcessSummaryToSummaryCardListItem)}
+      button={{ name: t('buttonText'), url: PATH_WORKFLOWS }}
+      isLoading={isLoading}
+      isFetching={isFetching}
+    />
+  );
 };

package/src/components/WfoSummary/WfoFailedTasksSummaryCard.tsx

@@ -9,27 +9,24 @@ import { useGetProcessListSummaryQuery } from '@/rtk';
 import { optionalArrayMapper } from '@/utils';
 
 export const WfoFailedTasksSummaryCard = () => {
-    const t = useTranslations('startPage.failedTasks');
+  const t = useTranslations('startPage.failedTasks');
 
-    const {
-        data: failedTasksSummaryResponse,
-        isFetching,
-        isLoading,
-    } = useGetProcessListSummaryQuery(taskListSummaryQueryVariables);
+  const {
+    data: failedTasksSummaryResponse,
+    isFetching,
+    isLoading,
+  } = useGetProcessListSummaryQuery(taskListSummaryQueryVariables);
 
-    return (
-        <WfoSummaryCard
-            headerTitle={t('headerTitle')}
-            headerValue={failedTasksSummaryResponse?.pageInfo.totalItems ?? '-'}
-            headerStatus={SummaryCardStatus.Error}
-            listTitle={t('listTitle')}
-            listItems={optionalArrayMapper(
-                failedTasksSummaryResponse?.processes,
-                mapProcessSummaryToSummaryCardListItem,
-            )}
-            button={{ name: t('buttonText'), url: PATH_TASKS }}
-            isLoading={isLoading}
-            isFetching={isFetching}
-        />
-    );
+  return (
+    <WfoSummaryCard
+      headerTitle={t('headerTitle')}
+      headerValue={failedTasksSummaryResponse?.pageInfo.totalItems ?? '-'}
+      headerStatus={SummaryCardStatus.Error}
+      listTitle={t('listTitle')}
+      listItems={optionalArrayMapper(failedTasksSummaryResponse?.processes, mapProcessSummaryToSummaryCardListItem)}
+      button={{ name: t('buttonText'), url: PATH_TASKS }}
+      isLoading={isLoading}
+      isFetching={isFetching}
+    />
+  );
 };

package/src/components/WfoSummary/WfoLatestActiveSubscriptionsSummaryCard.tsx

@@ -2,40 +2,34 @@ import React from 'react';
 
 import { useTranslations } from 'next-intl';
 
-import {
-    PATH_SUBSCRIPTIONS,
-    SummaryCardStatus,
-    WfoSummaryCard,
-} from '@/components';
+import { PATH_SUBSCRIPTIONS, SummaryCardStatus, WfoSummaryCard } from '@/components';
 import { mapSubscriptionSummaryToSummaryCardListItem } from '@/pages/startPage/mappers';
 import { subscriptionsListSummaryQueryVariables } from '@/pages/startPage/queryVariables';
 import { useGetSubscriptionSummaryListQuery } from '@/rtk';
 import { optionalArrayMapper } from '@/utils';
 
 export const WfoLatestActiveSubscriptionsSummaryCard = () => {
-    const t = useTranslations('startPage.activeSubscriptions');
+  const t = useTranslations('startPage.activeSubscriptions');
 
-    const {
-        data: subscriptionsSummaryResult,
-        isFetching,
-        isLoading,
-    } = useGetSubscriptionSummaryListQuery(
-        subscriptionsListSummaryQueryVariables,
-    );
+  const {
+    data: subscriptionsSummaryResult,
+    isFetching,
+    isLoading,
+  } = useGetSubscriptionSummaryListQuery(subscriptionsListSummaryQueryVariables);
 
-    return (
-        <WfoSummaryCard
-            headerTitle={t('headerTitle')}
-            headerValue={subscriptionsSummaryResult?.pageInfo.totalItems ?? '-'}
-            headerStatus={SummaryCardStatus.Neutral}
-            listTitle={t('listTitle')}
-            listItems={optionalArrayMapper(
-                subscriptionsSummaryResult?.subscriptions,
-                mapSubscriptionSummaryToSummaryCardListItem,
-            )}
-            button={{ name: t('buttonText'), url: PATH_SUBSCRIPTIONS }}
-            isLoading={isLoading}
-            isFetching={isFetching}
-        />
-    );
+  return (
+    <WfoSummaryCard
+      headerTitle={t('headerTitle')}
+      headerValue={subscriptionsSummaryResult?.pageInfo.totalItems ?? '-'}
+      headerStatus={SummaryCardStatus.Neutral}
+      listTitle={t('listTitle')}
+      listItems={optionalArrayMapper(
+        subscriptionsSummaryResult?.subscriptions,
+        mapSubscriptionSummaryToSummaryCardListItem,
+      )}
+      button={{ name: t('buttonText'), url: PATH_SUBSCRIPTIONS }}
+      isLoading={isLoading}
+      isFetching={isFetching}
+    />
+  );
 };

package/src/components/WfoSummary/WfoLatestOutOfSyncSubscriptionSummaryCard.tsx

@@ -2,12 +2,7 @@ import React from 'react';
 
 import { useTranslations } from 'next-intl';
 
-import {
-    PATH_SUBSCRIPTIONS,
-    SummaryCardStatus,
-    WfoSubscriptionListTab,
-    WfoSummaryCard,
-} from '@/components';
+import { PATH_SUBSCRIPTIONS, SummaryCardStatus, WfoSubscriptionListTab, WfoSummaryCard } from '@/components';
 import { mapSubscriptionSummaryToSummaryCardListItem } from '@/pages/startPage/mappers';
 import { outOfSyncSubscriptionsListSummaryQueryVariables } from '@/pages/startPage/queryVariables';
 import { useGetSubscriptionSummaryListQuery } from '@/rtk';
@@ -15,41 +10,36 @@ import { optionalArrayMapper } from '@/utils';
 import { WfoQueryParams, getUrlWithQueryParams } from '@/utils/getQueryParams';
 
 export const WfoLatestOutOfSyncSubscriptionSummaryCard = () => {
-    const t = useTranslations('startPage.outOfSyncSubscriptions');
+  const t = useTranslations('startPage.outOfSyncSubscriptions');
 
-    const {
-        data: outOfSyncSubscriptionsSummaryResult,
-        isFetching,
-        isLoading,
-    } = useGetSubscriptionSummaryListQuery(
-        outOfSyncSubscriptionsListSummaryQueryVariables,
-    );
+  const {
+    data: outOfSyncSubscriptionsSummaryResult,
+    isFetching,
+    isLoading,
+  } = useGetSubscriptionSummaryListQuery(outOfSyncSubscriptionsListSummaryQueryVariables);
 
-    const queryParams = {
-        [WfoQueryParams.ACTIVE_TAB]: WfoSubscriptionListTab.ALL,
-        [WfoQueryParams.SORT_BY]: 'field-startDate_order-ASC',
-        [WfoQueryParams.QUERY_STRING]:
-            'status:(provisioning|active) insync:false',
-    };
+  const queryParams = {
+    [WfoQueryParams.ACTIVE_TAB]: WfoSubscriptionListTab.ALL,
+    [WfoQueryParams.SORT_BY]: 'field-startDate_order-ASC',
+    [WfoQueryParams.QUERY_STRING]: 'status:(provisioning|active) insync:false',
+  };
 
-    return (
-        <WfoSummaryCard
-            headerTitle={t('headerTitle')}
-            headerValue={
-                outOfSyncSubscriptionsSummaryResult?.pageInfo.totalItems ?? '-'
-            }
-            headerStatus={SummaryCardStatus.Error}
-            listTitle={t('listTitle')}
-            listItems={optionalArrayMapper(
-                outOfSyncSubscriptionsSummaryResult?.subscriptions,
-                mapSubscriptionSummaryToSummaryCardListItem,
-            )}
-            button={{
-                name: t('buttonText'),
-                url: getUrlWithQueryParams(PATH_SUBSCRIPTIONS, queryParams),
-            }}
-            isLoading={isLoading}
-            isFetching={isFetching}
-        />
-    );
+  return (
+    <WfoSummaryCard
+      headerTitle={t('headerTitle')}
+      headerValue={outOfSyncSubscriptionsSummaryResult?.pageInfo.totalItems ?? '-'}
+      headerStatus={SummaryCardStatus.Error}
+      listTitle={t('listTitle')}
+      listItems={optionalArrayMapper(
+        outOfSyncSubscriptionsSummaryResult?.subscriptions,
+        mapSubscriptionSummaryToSummaryCardListItem,
+      )}
+      button={{
+        name: t('buttonText'),
+        url: getUrlWithQueryParams(PATH_SUBSCRIPTIONS, queryParams),
+      }}
+      isLoading={isLoading}
+      isFetching={isFetching}
+    />
+  );
 };

package/src/components/WfoSummary/WfoMyWorkflowsSummaryCard.tsx

@@ -3,59 +3,45 @@ import React, { FC } from 'react';
 import { useTranslations } from 'next-intl';
 
 import { PATH_WORKFLOWS } from '@/components';
-import {
-    SummaryCardStatus,
-    WfoSummaryCard,
-} from '@/components/WfoSummary/WfoSummaryCard';
+import { SummaryCardStatus, WfoSummaryCard } from '@/components/WfoSummary/WfoSummaryCard';
 import { WfoWorkflowsListTabType } from '@/pages';
 import { mapProcessSummaryToSummaryCardListItem } from '@/pages/startPage/mappers';
 import { getMyWorkflowListSummaryQueryVariables } from '@/pages/startPage/queryVariables';
 import { useGetProcessListSummaryQuery } from '@/rtk';
-import {
-    WfoQueryParams,
-    getUrlWithQueryParams,
-    optionalArrayMapper,
-} from '@/utils';
+import { WfoQueryParams, getUrlWithQueryParams, optionalArrayMapper } from '@/utils';
 
 export type WfoMyWorkflowsSummaryCardProps = {
-    username: string;
+  username: string;
 };
 
-export const WfoMyWorkflowsSummaryCard: FC<WfoMyWorkflowsSummaryCardProps> = ({
-    username,
-}) => {
-    const t = useTranslations('startPage.myWorkflows');
+export const WfoMyWorkflowsSummaryCard: FC<WfoMyWorkflowsSummaryCardProps> = ({ username }) => {
+  const t = useTranslations('startPage.myWorkflows');
 
-    const {
-        data: myWorkflowsSummaryResponse,
-        isFetching,
-        isLoading,
-    } = useGetProcessListSummaryQuery(
-        getMyWorkflowListSummaryQueryVariables(username),
-    );
+  const {
+    data: myWorkflowsSummaryResponse,
+    isFetching,
+    isLoading,
+  } = useGetProcessListSummaryQuery(getMyWorkflowListSummaryQueryVariables(username));
 
-    const queryParams = {
-        [WfoQueryParams.ACTIVE_TAB]: WfoWorkflowsListTabType.COMPLETED,
-        [WfoQueryParams.SORT_BY]: 'field-lastModifiedAt_order-DESC',
-        [WfoQueryParams.QUERY_STRING]: `createdBy:"${username}"`,
-    };
+  const queryParams = {
+    [WfoQueryParams.ACTIVE_TAB]: WfoWorkflowsListTabType.COMPLETED,
+    [WfoQueryParams.SORT_BY]: 'field-lastModifiedAt_order-DESC',
+    [WfoQueryParams.QUERY_STRING]: `createdBy:"${username}"`,
+  };
 
-    return (
-        <WfoSummaryCard
-            headerTitle={t('headerTitle')}
-            headerValue={myWorkflowsSummaryResponse?.pageInfo.totalItems ?? '-'}
-            headerStatus={SummaryCardStatus.Success}
-            listTitle={t('listTitle')}
-            listItems={optionalArrayMapper(
-                myWorkflowsSummaryResponse?.processes,
-                mapProcessSummaryToSummaryCardListItem,
-            )}
-            button={{
-                name: t('buttonText'),
-                url: getUrlWithQueryParams(PATH_WORKFLOWS, queryParams),
-            }}
-            isLoading={isLoading}
-            isFetching={isFetching}
-        />
-    );
+  return (
+    <WfoSummaryCard
+      headerTitle={t('headerTitle')}
+      headerValue={myWorkflowsSummaryResponse?.pageInfo.totalItems ?? '-'}
+      headerStatus={SummaryCardStatus.Success}
+      listTitle={t('listTitle')}
+      listItems={optionalArrayMapper(myWorkflowsSummaryResponse?.processes, mapProcessSummaryToSummaryCardListItem)}
+      button={{
+        name: t('buttonText'),
+        url: getUrlWithQueryParams(PATH_WORKFLOWS, queryParams),
+      }}
+      isLoading={isLoading}
+      isFetching={isFetching}
+    />
+  );
 };

package/src/components/WfoSummary/WfoProductsSummaryCard.tsx

@@ -2,56 +2,48 @@ import React from 'react';
 
 import { useTranslations } from 'next-intl';
 
-import {
-    SummaryCardListItem,
-    SummaryCardStatus,
-    WfoSummaryCard,
-} from '@/components';
+import { SummaryCardListItem, SummaryCardStatus, WfoSummaryCard } from '@/components';
 import { productsSummaryQueryVariables } from '@/pages/startPage/queryVariables';
 import { useGetProductsSummaryQuery } from '@/rtk';
 
 export const WfoProductsSummaryCard = () => {
-    const t = useTranslations('startPage.products');
+  const t = useTranslations('startPage.products');
 
-    const {
-        data: productsSummaryResult,
-        isFetching,
-        isLoading,
-    } = useGetProductsSummaryQuery(productsSummaryQueryVariables);
+  const {
+    data: productsSummaryResult,
+    isFetching,
+    isLoading,
+  } = useGetProductsSummaryQuery(productsSummaryQueryVariables);
 
-    const listItems: SummaryCardListItem[] =
-        [...(productsSummaryResult?.products ?? [])]
-            .sort(
-                (left, right) =>
-                    (right.subscriptions.pageInfo.totalItems ?? 0) -
-                    (left.subscriptions.pageInfo.totalItems ?? 0),
-            )
-            .map((product) => ({
-                title: '',
-                value: (
-                    <div
-                        css={{
-                            display: 'flex',
-                            justifyContent: 'space-between',
-                        }}
-                    >
-                        <div>{product.name}</div>
-                        <div>
-                            {product.subscriptions.pageInfo.totalItems || 0}
-                        </div>
-                    </div>
-                ),
-            })) ?? [];
+  const listItems: SummaryCardListItem[] =
+    [...(productsSummaryResult?.products ?? [])]
+      .sort(
+        (left, right) => (right.subscriptions.pageInfo.totalItems ?? 0) - (left.subscriptions.pageInfo.totalItems ?? 0),
+      )
+      .map((product) => ({
+        title: '',
+        value: (
+          <div
+            css={{
+              display: 'flex',
+              justifyContent: 'space-between',
+            }}
+          >
+            <div>{product.name}</div>
+            <div>{product.subscriptions.pageInfo.totalItems || 0}</div>
+          </div>
+        ),
+      })) ?? [];
 
-    return (
-        <WfoSummaryCard
-            headerTitle={t('headerTitle')}
-            headerValue={productsSummaryResult?.pageInfo.totalItems ?? '-'}
-            headerStatus={SummaryCardStatus.Neutral}
-            listTitle={t('listTitle')}
-            listItems={listItems}
-            isLoading={isLoading}
-            isFetching={isFetching}
-        />
-    );
+  return (
+    <WfoSummaryCard
+      headerTitle={t('headerTitle')}
+      headerValue={productsSummaryResult?.pageInfo.totalItems ?? '-'}
+      headerStatus={SummaryCardStatus.Neutral}
+      listTitle={t('listTitle')}
+      listItems={listItems}
+      isLoading={isLoading}
+      isFetching={isFetching}
+    />
+  );
 };