refactor: Refactor error messages helpers for start form (#1053)

* Search attribute component

Signed-off-by: Assem Hafez <assem.hafez@uber.com>

* Fix type check

Signed-off-by: Assem Hafez <assem.hafez@uber.com>

* revert errors to have key and value

Signed-off-by: Assem Hafez <assem.hafez@uber.com>

* Address the nits

* change button label

* Create hook for fetching search attributes

Signed-off-by: Assem Hafez <assem.hafez@uber.com>

* Refactor error message helpers

* feat: Create hook for fetching search attributes (#1046)

* Create hook for fetching search attributes

Signed-off-by: Assem Hafez <assem.hafez@uber.com>

* use stringifyUrl

Signed-off-by: Assem Hafez <assem.hafez@uber.com>

---------

Signed-off-by: Assem Hafez <assem.hafez@uber.com>

* fix: propagate user headers between internal api requests (#1049)

* propagate user headers from server renders

* fix tests

* dynamically import headers

* log propagated header keys

* add test cases

* import headers inline

* Add import/named to lint rules (#1050)

*Add import/named rule to .eslintrc to enable detecting import issues
* Use deep imports for Lodash
* Fix other misc lint issues (unused imports/variables)

Signed-off-by: Adhitya Mamallan <adhitya.mamallan@uber.com>

* remove type

Signed-off-by: Assem Hafez <assem.hafez@uber.com>

* lint fixes

Signed-off-by: Assem Hafez <assem.hafez@uber.com>

---------

Signed-off-by: Assem Hafez <assem.hafez@uber.com>
Signed-off-by: Adhitya Mamallan <adhitya.mamallan@uber.com>
Co-authored-by: Adhitya Mamallan <adhitya.mamallan@uber.com>

Author: Assem-Uber

src/components/multi-json-input/multi-json-input.types.tsx

@@ -3,6 +3,6 @@ export type Props = {
   placeholder?: string;
   value?: string[];
   onChange: (value: string[]) => void;
-  error?: string | string[];
+  error?: string | Array<string | undefined>;
   addButtonText?: string;
 };

src/views/workflow-actions/workflow-action-start-form/helpers/__tests__/get-field-error-message.test.ts

@@ -0,0 +1,57 @@
+import getFieldErrorMessage from '../get-field-error-message';
+
+describe('getFieldErrorMessage', () => {
+  it('should return undefined when field has no error', () => {
+    const fieldErrors = {};
+
+    const result = getFieldErrorMessage(fieldErrors, 'name');
+
+    expect(result).toBeUndefined();
+  });
+
+  it('should return string message for simple field error', () => {
+    const fieldErrors = {
+      name: {
+        message: 'Task list name is required',
+        type: 'required',
+      },
+    };
+
+    const result = getFieldErrorMessage(fieldErrors, 'name');
+
+    expect(result).toBe('Task list name is required');
+  });
+
+  it('should handle nested field paths with dot notation', () => {
+    const fieldErrors = {
+      retryPolicy: {
+        initialIntervalSeconds: {
+          message: 'Invalid initial interval',
+          type: 'invalid',
+        },
+      },
+    };
+
+    const result = getFieldErrorMessage(
+      fieldErrors,
+      'retryPolicy.initialIntervalSeconds'
+    );
+
+    expect(result).toBe('Invalid initial interval');
+  });
+
+  it('should return undefined for non-existent nested field', () => {
+    const fieldErrors = {
+      retryPolicy: {
+        initialIntervalSeconds: {
+          message: 'Invalid initial interval',
+          type: 'invalid',
+        },
+      },
+    };
+
+    const result = getFieldErrorMessage(fieldErrors, 'retryPolicy.nonExistent');
+
+    expect(result).toBeUndefined();
+  });
+});

src/views/workflow-actions/workflow-action-start-form/helpers/__tests__/get-field-object-error-messages.test.ts

@@ -0,0 +1,82 @@
+import getFieldObjectErrorMessages from '../get-field-object-error-messages';
+
+describe('getFieldObjectErrorMessages', () => {
+  it('should return undefined when field has no error', () => {
+    const fieldErrors = {};
+
+    const result = getFieldObjectErrorMessages(fieldErrors, 'cronSchedule');
+
+    expect(result).toBeUndefined();
+  });
+
+  it('should return string message when field has a simple message error', () => {
+    const fieldErrors = {
+      cronSchedule: {
+        message: 'Invalid cron schedule',
+        type: 'invalid',
+      },
+    };
+
+    const result = getFieldObjectErrorMessages(fieldErrors, 'cronSchedule');
+
+    expect(result).toBe('Invalid cron schedule');
+  });
+
+  it('should return Record<string, string> for object field errors without message', () => {
+    const fieldErrors = {
+      cronSchedule: {
+        minute: {
+          message: 'Must be a positive number',
+          type: 'min',
+        },
+        hour: {
+          message: 'Must be at least 0',
+          type: 'min',
+        },
+      },
+    };
+
+    const result = getFieldObjectErrorMessages(fieldErrors, 'cronSchedule');
+
+    expect(result).toEqual({
+      minute: 'Must be a positive number',
+      hour: 'Must be at least 0',
+    });
+  });
+
+  it('should handle object errors with some fields having no message', () => {
+    const fieldErrors = {
+      cronSchedule: {
+        minute: {
+          message: 'Invalid minute',
+          type: 'invalid',
+        },
+        hour: undefined,
+        day: {
+          message: 'Invalid day',
+          type: 'invalid',
+        },
+      },
+    };
+
+    const result = getFieldObjectErrorMessages(fieldErrors, 'cronSchedule');
+
+    expect(result).toEqual({
+      minute: 'Invalid minute',
+      day: 'Invalid day',
+    });
+  });
+
+  it('should return undefined when object has no error messages', () => {
+    const fieldErrors = {
+      cronSchedule: {
+        minute: undefined,
+        hour: undefined,
+      },
+    };
+
+    const result = getFieldObjectErrorMessages(fieldErrors, 'cronSchedule');
+
+    expect(result).toBeUndefined();
+  });
+});

src/views/workflow-actions/workflow-action-start-form/helpers/__tests__/get-multi-json-error-message.test.ts

@@ -0,0 +1,81 @@
+import getMultiJsonErrorMessage from '../get-multi-json-error-message';
+
+describe('getMultiJsonErrorMessage', () => {
+  it('should return undefined when field has no error', () => {
+    const fieldErrors = {};
+
+    const result = getMultiJsonErrorMessage(fieldErrors, 'input');
+
+    expect(result).toBeUndefined();
+  });
+
+  it('should return string message when field is not an array', () => {
+    const fieldErrors = {
+      input: {
+        message: 'Single error',
+        type: 'invalid',
+      },
+    };
+
+    const result = getMultiJsonErrorMessage(fieldErrors, 'input');
+
+    expect(result).toBe('Single error');
+  });
+
+  it('should return array of messages for array field errors including undefined', () => {
+    const fieldErrors = {
+      input: [
+        { message: 'Invalid JSON at index 0', type: 'invalid' },
+        { message: 'Invalid JSON at index 1', type: 'invalid' },
+        undefined,
+        { message: 'Invalid JSON at index 3', type: 'invalid' },
+      ],
+    };
+
+    const result = getMultiJsonErrorMessage(fieldErrors, 'input');
+
+    expect(result).toEqual([
+      'Invalid JSON at index 0',
+      'Invalid JSON at index 1',
+      undefined,
+      'Invalid JSON at index 3',
+    ]);
+  });
+
+  it('should return empty array for empty array of errors', () => {
+    const fieldErrors = {
+      input: [],
+    };
+
+    const result = getMultiJsonErrorMessage(fieldErrors, 'input');
+
+    expect(result).toEqual([]);
+  });
+
+  it('should return array including undefined for null/undefined entries', () => {
+    const fieldErrors = {
+      input: [
+        { message: 'Error 1', type: 'invalid' },
+        undefined,
+        { message: 'Error 2', type: 'invalid' },
+        null,
+      ],
+    };
+
+    const result = getMultiJsonErrorMessage(fieldErrors, 'input');
+
+    expect(result).toEqual(['Error 1', undefined, 'Error 2', undefined]);
+  });
+
+  it('should handle arrays with empty entries', () => {
+    // array with [Empty] entries
+    const fieldErrors = {
+      input: new Array(3),
+    };
+    fieldErrors.input[1] = { message: 'Error 1', type: 'invalid' };
+
+    const result = getMultiJsonErrorMessage(fieldErrors, 'input');
+
+    expect(result).toEqual([undefined, 'Error 1', undefined]);
+  });
+});

src/views/workflow-actions/workflow-action-start-form/helpers/get-field-error-message.ts

@@ -0,0 +1,14 @@
+import get from 'lodash/get';
+
+/**
+ * Extracts a simple error message from react-hook-form field errors.
+ * This is the default behavior for most form fields.
+ */
+export default function getFieldErrorMessage(
+  fieldErrors: Record<string, any>,
+  field: string
+): string | undefined {
+  const error = get(fieldErrors, field);
+
+  return error?.message;
+}

src/views/workflow-actions/workflow-action-start-form/helpers/get-field-object-error-messages.ts

@@ -0,0 +1,34 @@
+import get from 'lodash/get';
+import isObjectLike from 'lodash/isObjectLike';
+
+/**
+ * Extracts error messages from object fields errors (a field with subfields).
+ * Returns a map of field names to error messages.
+ */
+export default function getFieldObjectErrorMessages(
+  fieldErrors: Record<string, any>,
+  field: string
+): string | Record<string, string> | undefined {
+  const error = get(fieldErrors, field);
+
+  if (error?.message) {
+    return error.message;
+  }
+
+  if (isObjectLike(error)) {
+    const entries = Object.entries(error);
+    const result = entries.reduce(
+      (acc, [key, err]: [string, any]) => {
+        if (err?.message && typeof err.message === 'string') {
+          acc[key] = err.message;
+        }
+        return acc;
+      },
+      {} as Record<string, string>
+    );
+
+    return Object.keys(result).length > 0 ? result : undefined;
+  }
+
+  return undefined;
+}

src/views/workflow-actions/workflow-action-start-form/helpers/get-multi-json-error-message.ts

@@ -0,0 +1,23 @@
+import get from 'lodash/get';
+
+/**
+ * Extracts error messages from array field errors for multi-json-input components.
+ * Returns only string error messages, filtering out any complex nested errors.
+ */
+export default function getMultiJsonErrorMessage(
+  fieldErrors: Record<string, any>,
+  field: string
+): string | Array<string | undefined> | undefined {
+  const error = get(fieldErrors, field);
+
+  if (!error || !Array.isArray(error)) {
+    return error?.message;
+  }
+
+  const messages = error.map((err) => {
+    if (!err) return undefined;
+    return err.message;
+  });
+
+  return messages;
+}