@orchestrator-ui/orchestrator-ui-components 0.2.4 → 0.2.5

package/src/types/types.ts

@@ -1,27 +1,28 @@
 import { _EuiThemeColorsMode } from '@elastic/eui/src/global_styling/variables/colors';
-import { ProcessStatus } from '../hooks';
-import { Subscription } from './subscription';
+
+export type UnionOfInterfaceTypes<T> = T[keyof T];
 
 export type Nullable<T> = T | null;
 
 type GenericField = { [key: string]: number | string | boolean };
 
-export type EngineStatusValue = 'RUNNING' | 'PAUSING' | 'PAUSED';
+export type FieldValue = {
+    field: string;
+    value: string | number | boolean;
+};
 
-export type CustomerBase = {
-    name: string;
-    abbreviation?: string;
-} & GenericField;
+export type KeyValue = {
+    key: string;
+    value: string | number | boolean | undefined;
+};
 
-export type ProductBase = {
-    name: string;
-    description: string;
-    status: string;
-    tag: string;
-    type: string;
-    createdAt: string;
-    endDate?: string | null;
-} & GenericField;
+export type EngineStatusValue = 'RUNNING' | 'PAUSING' | 'PAUSED';
+
+export type Customer = {
+    fullname: string;
+    identifier: string;
+    shortcode: string;
+};
 
 export type ResourceTypeBase = {
     name: string;
@@ -31,17 +32,25 @@ export type ResourceTypeBase = {
     label?: string;
 } & GenericField;
 
-export type ProductBlockBase = {
+export type InUseByRelation = {
+    subscription_instance_id: string;
+    subscription_id: string;
+};
+
+export type ProductBlockInstance = {
     id: number;
     ownerSubscriptionId: string;
+    subscriptionInstanceId: string;
     parent: Nullable<number>;
-    resourceTypes: ResourceTypeBase;
+    productBlockInstanceValues: FieldValue[];
+    inUseByRelations: InUseByRelation[];
 };
 
 export interface ResourceTypeDefinition {
     description: string;
     resourceType: string;
     resourceTypeId: string;
+    productBlocks: ProductBlockDefinition[];
 }
 
 export interface ProductBlockDefinition {
@@ -49,10 +58,27 @@ export interface ProductBlockDefinition {
     name: string;
     tag: string;
     description: string;
-    status: string;
-    createdAt: Date | null;
-    endDate: Date | null;
+    status: ProductLifecycleStatus;
+    createdAt: string;
+    endDate: string | null;
     resourceTypes: ResourceTypeDefinition[];
+    dependsOn: ProductBlockDefinition[];
+}
+
+export enum ProductLifecycleStatus {
+    ACTIVE = 'active',
+    PRE_PRODUCTION = 'pre production',
+    PHASE_OUT = 'phase out',
+    END_OF_LIFE = 'end of life',
+}
+
+export enum BadgeType {
+    WORKFLOW = 'workflow',
+    FIXED_INPUT = 'fixed_input',
+    RESOURCE_TYPE = 'resource_type',
+    PRODUCT_BLOCK = 'product_block',
+    PRODUCT_BLOCK_TAG = 'product_block_tag',
+    PRODUCT_TAG = 'product_tag',
 }
 
 export type FixedInputsBase = GenericField;
@@ -69,36 +95,9 @@ export interface FixedInputDefinition {
     required: boolean;
 }
 
-export type ExternalServiceBase = {
-    externalServiceKey: string;
-    externalServiceId: string;
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    externalServiceData: any;
-} & GenericField;
-
-export type SubscriptionDetailBase = {
-    // Top level subscription fields
-    subscriptionId: string;
-    description: string;
-    customerId?: string | null;
-    insync: boolean;
-    status: string;
-    startDate?: string | null;
-    endDate?: string | null;
-    note?: string;
-
-    // Nested attributes
-    product: ProductBase;
-    fixedInputs: FixedInputsBase;
-    customer?: CustomerBase;
-    productBlocks: ProductBlockBase[];
-
-    externalServices?: ExternalServiceBase[];
-};
-
-export interface TreeBlock extends ProductBlockBase {
+export interface TreeBlock extends ProductBlockInstance {
     icon: string;
-    label: string;
+    label: string | number | boolean;
     callback: () => void;
     children: TreeBlock[];
 }
@@ -140,36 +139,129 @@ export interface ProductDefinition {
     tag: string;
     createdAt: string;
     productType: string;
-    status: string;
+    status: ProductLifecycleStatus;
     productBlocks: Pick<ProductBlockDefinition, 'name'>[];
     fixedInputs: Pick<FixedInputDefinition, 'name' | 'value'>[];
 }
 
-// Todo: Some props are not implemented in backend yet
-// https://github.com/workfloworchestrator/orchestrator-ui/issues/217
+export enum WorkflowTarget {
+    CREATE = 'create',
+    MODIFY = 'modify',
+    TERMINATE = 'terminate',
+    SYSTEM = 'system',
+}
+
 export type Process = {
     workflowName: string;
-    step: string;
-    status: ProcessStatus;
-    workflowTarget: string;
-    product: string;
-    customer: string;
-    // abbrev: string;
-    subscriptions: {
-        page: Pick<Subscription, 'subscriptionId' | 'description'>[];
+    lastStep: string;
+    lastStatus: ProcessStatus;
+    workflowTarget: WorkflowTarget;
+    product?: {
+        name: string;
+        tag: string;
+    };
+    customer: {
+        fullname: string;
+        shortcode: string;
     };
     createdBy: string;
     assignee: string;
     processId: string;
-    started: string;
-    lastModified: string;
+    startedAt: string;
+    lastModifiedAt: string;
+    subscriptions: {
+        page: Pick<Subscription, 'subscriptionId' | 'description'>[];
+    };
 };
 
+// These step statusses match the ones in the backend
+export enum StepStatus {
+    FORM = 'form', // Only this one is frontend only
+    SUCCESS = 'success',
+    FAILED = 'failed',
+    PENDING = 'pending',
+    RUNNING = 'running',
+    SKIPPED = 'skipped',
+    SUSPEND = 'suspend',
+    WAITING = 'waiting',
+    AWAITING_CALLBACK = 'awaiting_callback',
+    ABORT = 'abort',
+    COMPLETE = 'complete',
+}
+
+export interface ProcessDetail {
+    processId: Process['processId'];
+    lastStatus: Process['lastStatus'];
+    createdBy: Process['createdBy'];
+    startedAt: Process['startedAt'];
+    lastStep: string;
+    lastModifiedAt: Process['lastModifiedAt'];
+    workflowName: string;
+    isTask: boolean;
+    steps: Step[];
+    subscriptions: {
+        page: {
+            product: Pick<ProductDefinition, 'name'>;
+            description: Subscription['description'];
+            subscriptionId: Subscription['subscriptionId'];
+        }[];
+    };
+    customer: {
+        fullname: string;
+    };
+}
+
+// From backend
+export enum ProcessStatus {
+    CREATE = 'create', // Frontend only
+    CREATED = 'created',
+    RUNNING = 'running',
+    SUSPENDED = 'suspended',
+    WAITING = 'waiting',
+    AWAITING_CALLBACK = 'awaiting_callback',
+    ABORTED = 'aborted',
+    FAILED = 'failed',
+    RESUMED = 'resumed',
+    API_UNAVAILABLE = 'api_unavailable',
+    INCONSISTENT_DATA = 'inconsistent_data',
+    COMPLETED = 'completed',
+}
+
+export const ProcessDoneStatuses = [
+    ProcessStatus.COMPLETED,
+    ProcessStatus.ABORTED,
+];
+
+export interface StepState {
+    [index: string]: object | boolean | string | number | [];
+}
+
+export interface EmailAddress {
+    name: string;
+    email: string;
+}
+
+export interface EmailState {
+    to: EmailAddress[];
+    cc: EmailAddress[];
+    message: string;
+    subject: string;
+}
+
+export interface Step {
+    name: string;
+    status: StepStatus;
+    stepId: string; // sic backend
+    executed: string;
+    state: StepState;
+    stateDelta: StepState;
+}
+
 export interface WorkflowDefinition {
     name: string;
-    description: string;
-    target: string;
-    productTags: string[];
+    description?: string;
+    target: WorkflowTarget;
+    products: Pick<ProductDefinition, 'tag' | 'productId' | 'name'>[];
     createdAt: string;
 }
 
@@ -193,8 +285,8 @@ export type GraphqlFilter<Type> = {
 };
 
 export type GraphqlQueryVariables<Type> = {
-    first: number;
-    after: number;
+    first?: number;
+    after?: number;
     sortBy?: GraphQLSort<Type>;
     filterBy?: GraphqlFilter<Type>[];
 };
@@ -202,15 +294,25 @@ export type GraphqlQueryVariables<Type> = {
 export type GraphQLPageInfo = {
     hasNextPage: boolean;
     hasPreviousPage: boolean;
-    startCursor?: number;
-    totalItems?: number;
-    endCursor?: number;
+    startCursor: number | null;
+    totalItems: number | null;
+    endCursor: number | null;
+    sortFields: string[];
+    filterFields: string[];
 };
 
 export interface SubscriptionsResult {
     subscriptions: GraphQlResultPage<Subscription>;
 }
 
+export interface SubscriptionDropdownOptionsResult {
+    subscriptions: GraphQlSinglePage<SubscriptionDropdownOption>;
+}
+
+export interface SubscriptionDetailResult {
+    subscriptions: GraphQlResultPage<SubscriptionDetail>;
+}
+
 export interface ProductDefinitionsResult {
     products: GraphQlResultPage<ProductDefinition>;
 }
@@ -227,8 +329,24 @@ export interface ProcessesResult {
     processes: GraphQlResultPage<Process>;
 }
 
-export interface WorkflowDefinitionsResult {
-    workflows: GraphQlResultPage<WorkflowDefinition>;
+export interface ProcessesDetailResult {
+    processes: GraphQlSinglePage<ProcessDetail>;
+}
+
+export interface CustomersResult {
+    customers: GraphQlSinglePage<Customer>;
+}
+
+export interface WorkflowDefinitionsResult<T = WorkflowDefinition> {
+    workflows: GraphQlResultPage<T>;
+}
+
+export interface RelatedSubscriptionsResult {
+    subscriptions: GraphQlSinglePage<
+        Pick<Subscription, 'subscriptionId'> & {
+            inUseBySubscriptions: GraphQlResultPage<RelatedSubscription>;
+        }
+    >;
 }
 
 interface GraphQlResultPage<T> {
@@ -236,6 +354,10 @@ interface GraphQlResultPage<T> {
     pageInfo: GraphQLPageInfo;
 }
 
+interface GraphQlSinglePage<T> {
+    page: T[];
+}
+
 export interface CacheOption {
     value: string;
     label: string;
@@ -245,3 +367,91 @@ export enum Locale {
     enUS = 'en-Us',
     nlNL = 'nl-NL',
 }
+
+export enum SubscriptionStatus {
+    INITIAL = 'initial',
+    ACTIVE = 'active',
+    MIGRATING = 'migrating',
+    DISABLED = 'disabled',
+    TERMINATED = 'terminated',
+    PROVISIONING = 'provisioning',
+}
+
+export type Subscription = {
+    subscriptionId: string;
+    description: string;
+    note: string | null;
+    startDate: string | null;
+    endDate: string | null;
+    insync: boolean;
+    status: SubscriptionStatus;
+    product: Pick<ProductDefinition, 'name' | 'tag' | 'productType'>;
+    productBlockInstances: ProductBlockInstance[];
+};
+
+export type SubscriptionDropdownOption = {
+    description: Subscription['description'];
+    subscriptionId: Subscription['subscriptionId'];
+    product: Pick<ProductDefinition, 'tag' | 'productId'>;
+    customer: Pick<Customer, 'fullname' | 'identifier'>;
+    productBlockInstances: ProductBlockInstance[];
+    fixedInputs: FieldValue[];
+    tag: string;
+    status: SubscriptionStatus;
+};
+
+export type SubscriptionDetail = {
+    subscriptionId: string;
+    description: string;
+    insync: boolean;
+    note: string;
+    fixedInputs: FieldValue[];
+    product: Pick<
+        ProductDefinition,
+        | 'createdAt'
+        | 'name'
+        | 'status'
+        | 'description'
+        | 'tag'
+        | 'productType'
+        | 'productId'
+    > & {
+        endDate: string;
+    };
+    endDate: string;
+    startDate: string;
+    status: SubscriptionStatus;
+    productBlockInstances: ProductBlockInstance[];
+
+    customerId?: string | null;
+    customer?: Customer;
+    externalServices?: ExternalService[];
+
+    processes: GraphQlSinglePage<SubscriptionDetailProcess>;
+};
+
+export type SubscriptionDetailProcess = Pick<
+    Process,
+    | 'processId'
+    | 'lastStatus'
+    | 'startedAt'
+    | 'createdBy'
+    | 'workflowTarget'
+    | 'workflowName'
+>;
+
+export type RelatedSubscription = Pick<
+    Subscription,
+    'subscriptionId' | 'description' | 'status' | 'startDate' | 'insync'
+> & {
+    product: Pick<ProductDefinition, 'tag'>;
+    customer: Pick<Customer, 'fullname'>;
+};
+
+export type ExternalService = {
+    externalServiceKey: string;
+    externalServiceId: string;
+    externalServiceData: object;
+};
+
+export type WfoTreeNodeMap = { [key: number]: TreeBlock };

package/src/utils/date.spec.ts

@@ -1,4 +1,22 @@
-import { parseDate, parseDateToLocaleString } from './date';
+import {
+    calculateTimeDifference,
+    getCurrentBrowserLocale,
+    parseDate,
+    parseDateOrTimeRelativeToToday,
+    parseDateRelativeToToday,
+    parseDateToLocaleDateTimeString,
+    parseIsoString,
+} from './date';
+
+const testDateIsoString = '2023-04-27T10:00:00.000Z';
+const testDate = new Date(testDateIsoString);
+const testDateEpoch = testDate.valueOf();
+const testDateDateString = testDate.toLocaleDateString(
+    getCurrentBrowserLocale(),
+);
+const testDateTimeString = testDate.toLocaleTimeString(
+    getCurrentBrowserLocale(),
+);
 
 describe('date', () => {
     describe('parseDate()', () => {
@@ -22,18 +40,152 @@ describe('date', () => {
             expect(result).toBeInstanceOf(Date);
         });
     });
-    describe('parseDateToLocaleString()', () => {
+    describe('parseDateTimeToLocaleString()', () => {
         it('returns an empty string if the date is null', () => {
-            const result = parseDateToLocaleString(null);
+            const result = parseDateToLocaleDateTimeString(null);
             expect(result).toEqual('');
         });
 
         it('returns a date string if the date is a valid date string', () => {
             const testDate = new Date('2022-01-02');
 
-            const result = parseDateToLocaleString(testDate);
+            const result = parseDateToLocaleDateTimeString(testDate);
+
+            expect(result).toContain('1/2/2022');
+        });
+    });
+
+    describe('parseDateRelativeToToday()', () => {
+        it('returns an empty string if the date is null', () => {
+            const result = parseDateRelativeToToday(null);
+            expect(result).toEqual('');
+        });
+        it('returns only time when date is today', () => {
+            const now = new Date();
+
+            const result = parseDateRelativeToToday(now);
+
+            const expectedResult = now.toLocaleTimeString(
+                getCurrentBrowserLocale(),
+            );
+            expect(result).toEqual(expectedResult);
+        });
+        it('returns date and time when date is not today', () => {
+            const result = parseDateRelativeToToday(testDate);
+
+            const expectedDateTime = `${testDateDateString}, ${testDateTimeString}`;
+            expect(result).toEqual(expectedDateTime);
+        });
+    });
+
+    describe('parseDateOrTimeRelativeToToday()', () => {
+        it('returns time only when date is today', () => {
+            const now = new Date();
+
+            const result = parseDateOrTimeRelativeToToday(now);
+
+            const expectedResult = now.toLocaleTimeString(
+                getCurrentBrowserLocale(),
+            );
+            expect(result).toEqual(expectedResult);
+        });
+        it('returns only the date when that date is not today', () => {
+            const result = parseDateOrTimeRelativeToToday(testDate);
+
+            expect(result).toEqual(testDateDateString);
+        });
+        it('returns date only when date is not today and requesting "short notation"', () => {
+            const result = parseDateOrTimeRelativeToToday(testDate);
+
+            expect(result).toEqual(testDateDateString);
+        });
+    });
+
+    describe('calculateTimeDifference()', () => {
+        it('returns message with one of the dates missing', () => {
+            expect(calculateTimeDifference('', '')).toEqual('');
+        });
+
+        it('returns appropriate string if the times are the same', () => {
+            expect(
+                calculateTimeDifference(testDateIsoString, testDateIsoString),
+            ).toEqual('00:00:00');
+        });
+
+        it('returns appropriate string if the timedifference is 1 second', () => {
+            const laterTestDateIsoString = new Date(
+                testDateEpoch + 1000,
+            ).toISOString();
+
+            const result = calculateTimeDifference(
+                testDateIsoString,
+                laterTestDateIsoString,
+            );
+
+            expect(result).toEqual('00:00:01');
+        });
+        it('returns appropriate string if the timedifference is 1 minute', () => {
+            const laterTestDateIsoString = new Date(
+                testDateEpoch + 60000 + 1000,
+            ).toISOString();
+
+            const result = calculateTimeDifference(
+                testDateIsoString,
+                laterTestDateIsoString,
+            );
+
+            expect(result).toEqual('00:01:01');
+        });
+        it('returns appropriate string if the timedifference is 1 hour', () => {
+            const laterTestDateIsoString = new Date(
+                testDateEpoch + 3600000 + 60000 + 1000,
+            ).toISOString();
+
+            const result = calculateTimeDifference(
+                testDateIsoString,
+                laterTestDateIsoString,
+            );
+
+            expect(result).toEqual('01:01:01');
+        });
+
+        it('returns appropriate string if the timedifference is 10 hour', () => {
+            const laterTestDateIsoString = new Date(
+                testDateEpoch + 36000000 + 60000 + 1000,
+            ).toISOString();
+
+            const result = calculateTimeDifference(
+                testDateIsoString,
+                laterTestDateIsoString,
+            );
+
+            expect(result).toEqual('10:01:01');
+        });
+
+        it('returns empty string when time difference is invalid', () => {
+            const laterDateIsoString = new Date(
+                testDateEpoch + 3600000 + 60000 + 1000,
+            ).toISOString();
+
+            const result = calculateTimeDifference(
+                laterDateIsoString,
+                testDateIsoString,
+            );
+
+            expect(result).toEqual('');
+        });
+    });
+
+    describe('parseIsoString()', () => {
+        it('returns the result of the function passed', () => {
+            const dateToStringTestFunction = (testDate: Date | null) =>
+                testDate?.toISOString().concat('-TEST') ?? 'empty-TEST';
+
+            const result = parseIsoString(dateToStringTestFunction)(
+                testDateIsoString,
+            );
 
-            expect(result).toContain('2-1-2022');
+            expect(result).toEqual(`${testDateIsoString}-TEST`);
         });
     });
 });