jira:customField: Error "e.map is not a function"

Hi,

I am creating a new customField called “Released Patch” with type is string and collection is list.

My manifest as follows:

modules:
  jira:customField:
    - key: released-patch
      name: Released Patch
      description: A Released Patch number custom field.
      type: string
      collection: list
      readOnly: false
      function: main
      edit:
        function: edit
  function:
    - key: main
      handler: index.runView
    - key: edit
      handler: index.runEdit

And the index.jsx as follows:

import ForgeUI, 
       {render, CustomField, CustomFieldEdit, Text, Select, Option, Fragment, useProductContext} 
from "@forge/ui";

const View = () => {
   const { extensionContext: { fieldValue } } = useProductContext();
   return (
      <CustomField>
         <Text content={fieldValue || 'None'}/>
      </CustomField>
   );
};

const Edit = () => {
   const { extensionContext: { fieldName } } = useProductContext();
   const onSubmit = (values) => {
      return values.selectedValue;
   };
   return (
      <CustomFieldEdit onSubmit={onSubmit} header={fieldName}>
         <Fragment>
            <Select label="Select Released Patch number" name="selectedValue">
               <Option label="Patch 1" value="one" />
               <Option label="Patch 2" value="two" />
               <Option label="Patch 3" value="three" />
            </Select>
         </Fragment>
      </ CustomFieldEdit>
   );
}

export const runView = render(<View/>);
export const runEdit = render(<Edit/>);

When I created a new issue and select a value (Patch 2) from the custom field’s list, as seen in the following screenshot:

And then moved to the next field (Issue Sub-type), an error (e.map is not a function) appeared in the custom field:

I have tried to find the problem but no luck, I am not sure where did the error come from.

Any help to find out what is the root cause would be very appreciated.

Thanks.

Hi, @BennyChandra,

The problem seems to be that you have a list of strings field (collection: list in your manifest), so your function should return a list, but it returns a string.

See the documentation:

An event handler that can be asynchronous. The argument, formData, is an object of input field keys and their values (see example below). The return value is either the field value or a promise that’s resolved with the returned field value. The value is checked against the validation expression defined in the manifest and must the same type as custom field [emphasis mine].

We will see if we can improve the error message in this case.

2 Likes

Hi @kkercz

I changed the onSubmit to:

const onSubmit = values => { return [values.selectedValue]; };

and it works!

Thanks for pointing out the problem.

1 Like