[Bug]: Custom modules did not return description and other custom attr values

[exqmjmz]

Is there an existing issue for this?

• [X] I have searched the existing issues

Current Behavior

I added a new attribute and description in my custom module. I have implemented my custom fields in the custom module editor. Used to define title show labels, custom attr is work on the test page. Added instructions, but the instructions didn't take effect on the test page.

module page

change code file

//inputListItemComp.tsx
function TestView(props: TestViewProps) {
  const { itemComp } = props;
  //Change here
  const { name, nameLabel, type } = itemComp.getView();
  const testType = itemComp.children.test.children.compType.getView();
  const defaultType = itemComp.children.defaultValue.children.compType.getView();

  useEffect(() => {
    if (!type) {
      return;
    }
    if (testType !== type) {
      itemComp.children.test.dispatchChangeValueAction({ compType: type });
    }
    if (defaultType !== type) {
      itemComp.children.defaultValue.dispatchChangeValueAction({ compType: type });
    }
  }, [defaultType, itemComp.children.defaultValue, itemComp.children.test, testType, type]);

  return (
    <Fragment>
      //Change here
      {itemComp.children.test.children.comp.propertyView({ label: nameLabel||name, layout: "vertical" })}
    </Fragment>
  );
}

const childrenMap = {
  name: CompNameControl,
  description: StringControl,
   //Change here
  nameLabel: StringControl,
  type: dropdownControl(typeOptions, InputTypeEnum.Data),
  defaultValue: withType(defaultValueControls, InputTypeEnum.Data),
  test: withType(testControls, InputTypeEnum.Data),
};


//inputListComp.tsx

interface InputItemProps {
  name: InstanceType<typeof CompNameControl>;
  //Change here
  nameLabel: InstanceType<typeof StringControl>;
  defaultValue: any;
  // defaultValue: InstanceType<ReturnType<typeof withType>>;
  type: InstanceType<ReturnType<typeof dropdownControl>>;
  description: InstanceType<typeof StringControl>;
  onDelete: () => void;
  onTypeChange: (value: string) => void;
  defaultShowPopover: boolean;
}

function InputItem(props: InputItemProps) {
  //Change here
  const { name, nameLabel ,type, description, defaultValue, onDelete, onTypeChange } = props;

  const content = (
    <>
      {name.propertyView({ label: trans("module.name") })}
        //Change here
      {nameLabel.propertyView({ label: trans("prop.showLabel") })}
      {type.propertyView({
        label: trans("prop.type"),
        onChange: onTypeChange,
        disableDispatchValueChange: true,
      })}
      {type.getView() !== InputTypeEnum.Query &&
        defaultValue.children.comp.propertyView({ label: trans("prop.defaultValue") })}
      {description.propertyView({ label: trans("labelProp.tooltip") })}
    </>
  );

  const label = getInputOptionLabel(type.getView() as InputTypeEnum);
  const [cnLabel] = label.split(" ");
  return (
    <KeyValueItem
      del={onDelete}
      name={name.getView()}
      value={cnLabel}
      clickPopoverContent={content}
      defaultShowPopover={props.defaultShowPopover}
    />
  );
}

After I change these files,My custom attr is work on the module page enter test module. Description is not working.

application page I used the devtools tool to locate the following files

//moduleInputComp.tsx
  getPropertyView(): ControlNode {
    if (this.inputs.length === 0) {
      return;
    }
    return this.inputs.map(({ name, description }) => {
      const child = this.children[name];
      if (!child) {
        return;
      }
      const label = name;
      return controlItem(
        { filterText: label },
        <Fragment key={name}>
          {(child as any).propertyView({ label, tooltip: description, layout: "vertical" })}
        </Fragment>
      );
    });
  }

I use console.log to output this.inputs

//out obj
[
    {
        "name": "title",
        "description": "",
        "nameLabel": "",
        "type": "string",
        "defaultValue": "",
        "test": ""
    },
    {
        "name": "module123",
        "description": "",
        "nameLabel": "",
        "type": "data",
        "defaultValue": "",
        "test": ""
    }
]

Only the value of name and type is output I continued to look for the source of this.inputs value This.inputs input value was found in the following file

//moduleComp.tsx
      const moduleLayoutComp = moduleRootComp.children.ui.getModuleLayoutComp();
      if (moduleLayoutComp) {
       //problem code occurred
        const inputs = moduleLayoutComp.getInputs().map((i) => i.getView());
        const inputChild = this.children.inputs.setInputs(inputs);
        updateFields = {
          ...updateFields,
          children: {
            ...this.children,
            inputs: inputChild,
          },
        };
      }

Here I found the problem

        const inputs = moduleLayoutComp.getInputs().map((i) => i.getView());

out inputs

moduleLayoutComp.getInputs() is array,out element

element.getView()

I found that getView() only returned the value attribute and not the unevaledValue attribute. Because unvaledValue is not returned,component description and my custom properties not working

Expected Behavior

getView() return value attr and unevaledValue

Steps to reproduce

in Current Behavior

Environment

No response

Additional Information

No response

[FalkWolsky]

Thank you very much for this truly good issue description! We will work on it as soon as possible!