@orchestrator-ui/orchestrator-ui-components 0.8.0 → 0.8.1

package/.turbo/turbo-build.log

@@ -1,5 +1,5 @@
 
-> @orchestrator-ui/orchestrator-ui-components@0.8.0 build
+> @orchestrator-ui/orchestrator-ui-components@0.8.1 build
 > tsup src/index.ts --format esm --dts --tsconfig tsconfig.build.json
 
 CLI Building entry: src/index.ts
@@ -9,6 +9,6 @@
 ESM Build start
 DTS Build start
 ESM dist/index.js 2.13 MB
-ESM ⚡️ Build success in 854ms
-DTS ⚡️ Build success in 13905ms
-DTS dist/index.d.ts 114.15 KB
+ESM ⚡️ Build success in 747ms
+DTS ⚡️ Build success in 11913ms
+DTS dist/index.d.ts 114.18 KB

package/.turbo/turbo-lint.log

@@ -1,4 +1,4 @@
 
-> @orchestrator-ui/orchestrator-ui-components@0.8.0 lint
+> @orchestrator-ui/orchestrator-ui-components@0.8.1 lint
 > eslint "src/**/*.ts*"
 

package/.turbo/turbo-test.log

@@ -1,32 +1,32 @@
 
-> @orchestrator-ui/orchestrator-ui-components@0.8.0 test
+> @orchestrator-ui/orchestrator-ui-components@0.8.1 test
 > jest
 
 PASS Orchestrator UI Components Tests src/pages/processes/timelineUtils.spec.ts
 PASS Orchestrator UI Components Tests src/components/WfoForms/formFields/utils.spec.ts
 PASS Orchestrator UI Components Tests src/utils/date.spec.ts
-PASS Orchestrator UI Components Tests src/utils/getProductNamesFromProcess.spec.ts
 PASS Orchestrator UI Components Tests src/components/WfoSubscription/utils/utils.spec.ts
 PASS Orchestrator UI Components Tests src/components/WfoTable/WfoDataGridTable/WfodataGridColumns.spec.ts
+PASS Orchestrator UI Components Tests src/utils/getProductNamesFromProcess.spec.ts
+PASS Orchestrator UI Components Tests src/components/WfoTable/WfoTableWithFilter/updateQueryString.spec.ts
 PASS Orchestrator UI Components Tests src/components/WfoTree/treeUtils.spec.ts
 PASS Orchestrator UI Components Tests src/components/WfoTable/utils/tableConfigPersistence.spec.ts
-PASS Orchestrator UI Components Tests src/components/WfoTable/WfoTableWithFilter/updateQueryString.spec.ts
 PASS Orchestrator UI Components Tests src/utils/string.spec.ts
 PASS Orchestrator UI Components Tests src/components/WfoTable/utils/tableUtils.spec.ts
 PASS Orchestrator UI Components Tests src/components/WfoTable/utils/mapSortableAndFilterableValuesToTableColumnConfig.spec.ts
 PASS Orchestrator UI Components Tests src/messages/getTranslationMessages.spec.ts
 PASS Orchestrator UI Components Tests src/components/WfoTable/utils/columns.spec.ts
 PASS Orchestrator UI Components Tests src/utils/sortObjectKeys.spec.ts
-PASS Orchestrator UI Components Tests src/utils/getTokenName.spec.ts
 PASS Orchestrator UI Components Tests src/components/WfoWorkflowSteps/stepListUtils.spec.ts
 PASS Orchestrator UI Components Tests src/utils/environmentVariables.spec.ts
-PASS Orchestrator UI Components Tests src/utils/getTypedFieldFromObject.spec.ts
+PASS Orchestrator UI Components Tests src/utils/getTokenName.spec.ts
 PASS Orchestrator UI Components Tests src/utils/uuid.spec.ts
-PASS Orchestrator UI Components Tests src/utils/getQueryVariablesForExport.spec.ts
+PASS Orchestrator UI Components Tests src/utils/getTypedFieldFromObject.spec.ts
 PASS Orchestrator UI Components Tests src/components/WfoPageTemplate/WfoPageHeader/utils/toHexColorWithOpacity.spec.ts
+PASS Orchestrator UI Components Tests src/utils/getQueryVariablesForExport.spec.ts
 
 Test Suites: 22 passed, 22 total
 Tests:       131 passed, 131 total
 Snapshots:   0 total
-Time:        4.819 s
+Time:        4.306 s
 Ran all test suites.

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @orchestrator-ui/orchestrator-ui-components
 
+## 0.8.1
+
+### Patch Changes
+
+- 5224527: 721: Fix customer select not being disabled
+- 16f32ad: 651: Fix incorrect port select options
+- 84a75b7: Change service port select label when root subscription instance has title
+
 ## 0.8.0
 
 ### Minor Changes

package/dist/index.d.ts

@@ -1336,6 +1336,7 @@ interface IProps {
     preselectedInput?: unknown;
     formKey: string;
     handleSubmit: (userInputs: any) => void;
+    handleCancel?: () => void;
 }
 declare function CreateForm(props: IProps): _emotion_react_jsx_runtime.JSX.Element;
 

package/dist/index.js

@@ -34571,7 +34571,7 @@ var getAxiosInstance = (apiPath, accessToken) => {
 };
 
 // src/api/index.ts
-var FORMS_ENDPOINT = "surf/forms/";
+var CIM_FORMS_ENDPOINT = "surf/cim/forms/";
 var PROCESS_ENDPOINT = "processes/";
 var PRODUCTS_ENDPOINT = "products/";
 var BaseApiClient = class {
@@ -34644,7 +34644,7 @@ var ApiClient = class extends ApiClientInterface {
     };
     this.cimStartForm = (formKey, userInputs) => {
       return this.postPutJson(
-        `${FORMS_ENDPOINT}${formKey}`,
+        `${CIM_FORMS_ENDPOINT}${formKey}`,
         userInputs,
         "post",
         false,
@@ -50949,19 +50949,18 @@ var getStyles10 = (theme) => {
 // src/components/WfoForms/formFields/utils.ts
 import { isDate as isDate2 } from "moment";
 var getPortMode = (productBlockInstances) => {
-  const portMode = productBlockInstances == null ? void 0 : productBlockInstances.reduce(
-    (portMode2, productBlockInstance) => {
+  return productBlockInstances == null ? void 0 : productBlockInstances.reduce(
+    (portMode, productBlockInstance) => {
       const portModeField = productBlockInstance.productBlockInstanceValues.find(
         (productBlockInstanceValue) => productBlockInstanceValue.field === "portMode"
       );
-      if (portModeField) {
+      if (!portMode && portModeField) {
         return portModeField.value;
       }
-      return portMode2;
+      return portMode;
     },
     void 0
   );
-  return portMode;
 };
 var isEmpty = (obj) => {
   if (obj === void 0 || obj === null) {
@@ -51864,7 +51863,7 @@ import {
 
 // src/hooks/surf/useGetSubscriptionDropdownOptions.ts
 import { isError as isError2 } from "react-query";
-var useGetSubscriptionDropdownOptions = (tags = [], statuses = []) => {
+var useGetSubscriptionDropdownOptions = (tags = [], statuses = ["active"]) => {
   const tagValue = tags.join("-");
   const statusValue = statuses.join("-");
   const filters = [];
@@ -52027,6 +52026,12 @@ function SubscriptionFieldDefinition(_a) {
       "IRBSP" /* IRBSP */
     ].includes(subscription.product.tag)) {
       const portMode = getPortMode(subscription.productBlockInstances);
+      const subscriptionTitle = subscription.productBlockInstances[0].productBlockInstanceValues.find(
+        (item) => item.field === "title"
+      );
+      if (subscriptionTitle) {
+        return `${subscriptionSubstring} - ${description2.trim()} - ${subscriptionTitle.value}`;
+      }
       return `${subscriptionSubstring} ${portMode == null ? void 0 : portMode.toUpperCase()} ${description2.trim()} ${(_a2 = subscription.customer) == null ? void 0 : _a2.fullname}`;
     } else {
       return description2.trim();
@@ -52999,7 +53004,7 @@ function Customer(_a) {
     __spreadProps(__spreadValues({}, props), {
       allowedValues: Array.from(uuidCustomerNameMap.keys()),
       transform: (uuid) => uuidCustomerNameMap.get(uuid) || uuid,
-      disabled: isLoading,
+      disabled: isLoading || props.disabled,
       placeholder: !isLoading ? t("widgets.customer.placeholder") : t("widgets.customer.loading")
     })
   );
@@ -53554,7 +53559,7 @@ function UserInputForm({
         color: (_f = buttons2.next.color) != null ? _f : "primary",
         isLoading: processing,
         type: "submit",
-        iconType: () => /* @__PURE__ */ jsx130(WfoPlayFill, { color: "#FFF" }),
+        iconType: buttons2.next.text ? void 0 : () => /* @__PURE__ */ jsx130(WfoPlayFill, { color: "#FFF" }),
         iconSide: "right",
         children: (_g = buttons2.next.text) != null ? _g : t(nextButtonTranslationKey)
       }
@@ -53688,7 +53693,7 @@ var UserInputFormWizard_default = UserInputFormWizard;
 // src/components/WfoForms/CreateForm.tsx
 import { jsx as jsx132 } from "@emotion/react/jsx-runtime";
 function CreateForm(props) {
-  const { preselectedInput, formKey, handleSubmit } = props;
+  const { preselectedInput, formKey, handleSubmit, handleCancel } = props;
   const [form, setForm] = useState26({});
   const { stepUserInput, hasNext } = form;
   const apiClient = useAxiosApiClient();
@@ -53720,7 +53725,7 @@ function CreateForm(props) {
     {
       stepUserInput,
       validSubmit: submit,
-      cancel: () => alert("cancelled"),
+      cancel: handleCancel,
       hasNext: hasNext != null ? hasNext : false,
       isTask: false
     }
@@ -55686,7 +55691,14 @@ var WfoProcessDetail = ({
   const router = useRouter9();
   const { isEngineRunningNow } = useCheckEngineStatus();
   const listIncludesStatus = (processStatusesForDisabledState, status) => status ? processStatusesForDisabledState.map((stat) => stat.toUpperCase()).includes(status) : false;
-  const retryButtonIsDisabled = buttonsAreDisabled || !listIncludesStatus(["failed" /* FAILED */], processDetail == null ? void 0 : processDetail.lastStatus);
+  const retryButtonIsDisabled = buttonsAreDisabled || !listIncludesStatus(
+    [
+      "failed" /* FAILED */,
+      "api_unavailable" /* API_UNAVAILABLE */,
+      "inconsistent_data" /* INCONSISTENT_DATA */
+    ],
+    processDetail == null ? void 0 : processDetail.lastStatus
+  );
   const abortButtonIsDisabled = buttonsAreDisabled || listIncludesStatus(
     ["completed" /* COMPLETED */, "aborted" /* ABORTED */],
     processDetail == null ? void 0 : processDetail.lastStatus

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@orchestrator-ui/orchestrator-ui-components",
-    "version": "0.8.0",
+    "version": "0.8.1",
     "license": "MIT",
     "scripts": {
         "test": "jest",

package/src/api/index.ts

@@ -19,11 +19,12 @@ import {
     IpBlock,
     IpPrefix,
     NodeSubscription,
-} from '../components/WfoForms/formFields/surf/types';
-import { ProductDefinition } from '../types';
+} from '@/components/WfoForms/formFields/surf/types';
+import { ProductDefinition } from '@/types';
+
 import { getAxiosInstance } from './axios';
 
-const FORMS_ENDPOINT = 'surf/forms/';
+const CIM_FORMS_ENDPOINT = 'surf/cim/forms/';
 const PROCESS_ENDPOINT = 'processes/';
 const PRODUCTS_ENDPOINT = 'products/';
 
@@ -146,7 +147,7 @@ export class ApiClient extends ApiClientInterface {
         userInputs: object[],
     ): Promise<{ id: string }> => {
         return this.postPutJson(
-            `${FORMS_ENDPOINT}${formKey}`,
+            `${CIM_FORMS_ENDPOINT}${formKey}`,
             userInputs,
             'post',
             false,

package/src/components/WfoForms/CreateForm.tsx

@@ -14,7 +14,8 @@
  */
 import React, { useCallback, useEffect, useState } from 'react';
 
-import { Form, FormNotCompleteResponse } from '../../types/forms';
+import { Form, FormNotCompleteResponse } from '@/types/forms';
+
 import UserInputFormWizard from './UserInputFormWizard';
 import { useAxiosApiClient } from './useAxiosApiClient';
 
@@ -23,10 +24,11 @@ interface IProps {
     preselectedInput?: unknown;
     formKey: string;
     handleSubmit: (userInputs: any) => void;
+    handleCancel?: () => void;
 }
 
 export function CreateForm(props: IProps) {
-    const { preselectedInput, formKey, handleSubmit } = props;
+    const { preselectedInput, formKey, handleSubmit, handleCancel } = props;
     const [form, setForm] = useState<Form>({});
     const { stepUserInput, hasNext } = form;
     const apiClient = useAxiosApiClient();
@@ -61,7 +63,7 @@ export function CreateForm(props: IProps) {
                 <UserInputFormWizard
                     stepUserInput={stepUserInput}
                     validSubmit={submit}
-                    cancel={() => alert('cancelled')}
+                    cancel={handleCancel}
                     hasNext={hasNext ?? false}
                     isTask={false}
                 />

package/src/components/WfoForms/UserInputForm.tsx

@@ -559,7 +559,11 @@ function UserInputForm({
                 color={buttons.next.color ?? 'primary'}
                 isLoading={processing}
                 type="submit"
-                iconType={() => <WfoPlayFill color="#FFF" />}
+                iconType={
+                    buttons.next.text
+                        ? undefined
+                        : () => <WfoPlayFill color="#FFF" />
+                }
                 iconSide="right"
             >
                 {buttons.next.text ?? t(nextButtonTranslationKey)}

package/src/components/WfoForms/formFields/CustomerField.tsx

@@ -44,7 +44,7 @@ function Customer({ ...props }: CustomerFieldProps) {
             {...props}
             allowedValues={Array.from(uuidCustomerNameMap.keys())}
             transform={(uuid: string) => uuidCustomerNameMap.get(uuid) || uuid}
-            disabled={isLoading}
+            disabled={isLoading || props.disabled}
             placeholder={
                 !isLoading
                     ? t('widgets.customer.placeholder')

package/src/components/WfoForms/formFields/SubscriptionField.tsx

@@ -166,6 +166,13 @@ function SubscriptionFieldDefinition({
             ].includes(subscription.product.tag as ProductTag)
         ) {
             const portMode = getPortMode(subscription.productBlockInstances);
+            const subscriptionTitle =
+                subscription.productBlockInstances[0].productBlockInstanceValues.find(
+                    (item) => item.field === 'title',
+                );
+            if (subscriptionTitle) {
+                return `${subscriptionSubstring} - ${description.trim()} - ${subscriptionTitle.value}`;
+            }
             return `${subscriptionSubstring} ${portMode?.toUpperCase()} ${description.trim()} ${
                 subscription.customer?.fullname
             }`;

package/src/components/WfoForms/formFields/utils.spec.ts

@@ -99,7 +99,7 @@ describe('formField utils', () => {
             expect(result).toEqual('NOTTAGGED');
         });
 
-        it('returns undefined if the last portMode if there are more than one productBlockInstanceValue with portmode', () => {
+        it('returns the first portMode if there are more than one productBlockInstanceValue with portmode', () => {
             const result = getPortMode([
                 getProductBlockInstance({
                     productBlockInstanceValues: [
@@ -118,7 +118,7 @@ describe('formField utils', () => {
                     ],
                 }),
             ]);
-            expect(result).toEqual('SECOND');
+            expect(result).toEqual('FIRST');
         });
 
         it('returns undefined if the productBlockInstances dont contain a portMode field', () => {

package/src/components/WfoForms/formFields/utils.ts

@@ -7,22 +7,20 @@ import { PortMode, ProductTag } from './surf/types';
 export const getPortMode = (
     productBlockInstances: ProductBlockInstance[],
 ): PortMode | undefined => {
-    const portMode = productBlockInstances?.reduce(
+    return productBlockInstances?.reduce(
         (portMode: PortMode | undefined, productBlockInstance) => {
             const portModeField =
                 productBlockInstance.productBlockInstanceValues.find(
                     (productBlockInstanceValue) =>
                         productBlockInstanceValue.field === 'portMode',
                 );
-            if (portModeField) {
+            if (!portMode && portModeField) {
                 return portModeField.value as PortMode;
             }
             return portMode;
         },
         undefined,
     );
-
-    return portMode;
 };
 
 export const isEmpty = (obj: unknown) => {

package/src/components/WfoForms/useAxiosApiClient.ts

@@ -1,6 +1,6 @@
 import { useContext } from 'react';
 
-import { ApiClientContext } from '../../contexts';
+import { ApiClientContext } from '@/contexts';
 
 export const useAxiosApiClient = () => {
     const { apiClient } = useContext(ApiClientContext);

package/src/contexts/ApiClientContext.tsx

@@ -1,9 +1,9 @@
 import React, { createContext, useContext } from 'react';
 import type { ReactNode } from 'react';
 
+import { ApiClient, getApiClient } from '@/api';
 import { useSessionWithToken } from '@/hooks';
 
-import { ApiClient, getApiClient } from '../api';
 import { OrchestratorConfigContext } from './OrchestratorConfigContext';
 
 export interface ApiContext {

package/src/hooks/surf/useGetSubscriptionDropdownOptions.ts

@@ -6,7 +6,7 @@ import { useQueryWithGraphql } from '../useQueryWithGraphql';
 
 export const useGetSubscriptionDropdownOptions = (
     tags: string[] = [],
-    statuses: string[] = [],
+    statuses: string[] = ['active'],
 ) => {
     // The way the graphql filterBy clause on the backend handled multiple AND values is by joining them with -
     const tagValue = tags.join('-');

package/src/pages/processes/WfoProcessDetail.tsx

@@ -114,7 +114,14 @@ export const WfoProcessDetail = ({
 
     const retryButtonIsDisabled =
         buttonsAreDisabled ||
-        !listIncludesStatus([ProcessStatus.FAILED], processDetail?.lastStatus);
+        !listIncludesStatus(
+            [
+                ProcessStatus.FAILED,
+                ProcessStatus.API_UNAVAILABLE,
+                ProcessStatus.INCONSISTENT_DATA,
+            ],
+            processDetail?.lastStatus,
+        );
     const abortButtonIsDisabled =
         buttonsAreDisabled ||
         listIncludesStatus(