MacroConfig: Failed to load Trace ID: undefined Validation error

Forge
1

I am trying to create a MacroConfig with a dynamic list to Select from. This is my config function:

const DL_DependencyList_Config = () => {
  console.log( `DL_DependencyList_Config`);
  const context = useProductContext();
  console.log(`DL_DependencyList_Config: All info about my context: ${JSON.stringify(context, null, 2)}`);
  const [availableDesigns] = useState(async () => await listOfAvailableDesigns(context.spaceKey, context.contentId));
  console.log(`DL_DependencyList_Config: ${JSON.stringify(availableDesigns, null, 2)}`);
  return (
    <MacroConfig>
      <Select name="selected" label="This page depends on" isMulti="true">
        {availableDesigns.map(availablePage => <Option label={availablePage.dlid}>{availablePage.listValue}</Option>)}
      </Select>
    </MacroConfig>
  );
};

listOfAvailableDesigns(context.spaceKey, context.contentId) produces an array of objects with two elements, built with the statement:

      list.push( {dlid, listValue});

which results in JSON.stringify printing elements like this:

  {
    "dlid": "1679590342-syjkyp1u5ve",
    "listValue": "VMWare"
  },

The last console.log() is printed. Then it fails and the form says: “Failed to load Trace ID: undefined Validation error” which gives me little to move on from.

Anybody have an idea?

2

Found it myself:

    <MacroConfig>
      <Select name="selected" label="This page depends on" isMulti="true">
      {availableDesigns.map(design => {
          return (
            <Option label={`${design.listValue}`} value={design.dlid} />
          )
        })
      }
      </Select>
    </MacroConfig>

Thanks to an answer from someone who was doing Forge with Jira.