danielzhe commented on code in PR #3033:
URL:
https://github.com/apache/incubator-kie-tools/pull/3033#discussion_r2017442736
##########
packages/dmn-editor/src/dataTypes/TypeRefSelector.tsx:
##########
@@ -106,6 +106,86 @@ export function TypeRefSelector({
const { maxHeight, direction } = useInViewSelect(heightRef ?? { current:
document.body }, toggleRef, zoom ?? 1);
+ const buildSelectGroups = (
Review Comment:
I think we can change it to useCallback, so this code is not reloaded every
time the component is re-rendered:
```
const buildSelectGroups = useCallback(
(
builtInFeelTypes: DmnDataType[],
customDataTypes: DataType[],
externalDataTypes: DataType[],
searchText = ""
): React.ReactElement[] => {
const filteredBuiltInFeelTypes = builtInFeelTypes.filter(
(dt) => !searchText || (dt.name ||
"").toLowerCase().includes(searchText.toLowerCase())
);
const filteredCustomDataTypes = customDataTypes.filter(
(dt) => !searchText || (dt.feelName ||
"").toLowerCase().includes(searchText.toLowerCase())
);
const filteredExternalDataTypes = externalDataTypes.filter(
(dt) => !searchText || (dt.feelName ||
"").toLowerCase().includes(searchText.toLowerCase())
);
const selectGroups = [];
if (filteredBuiltInFeelTypes.length > 0 || !searchText) {
selectGroups.push(
<SelectGroup label="Built-in" key="builtin" style={{ minWidth:
"300px" }}>
{filteredBuiltInFeelTypes.map((dt) => (
<SelectOption key={dt.name} value={dt.name}>
{dt.name}
</SelectOption>
))}
</SelectGroup>
);
}
if (filteredCustomDataTypes.length > 0 || !searchText) {
selectGroups.push(
<SelectGroup label="Custom" key="custom" style={{ minWidth:
"300px" }}>
{filteredCustomDataTypes.length > 0 ? (
filteredCustomDataTypes.map((dt) => (
<SelectOption key={dt.feelName} value={dt.feelName}>
{dt.feelName}
<TypeRefLabel
typeRef={dt.itemDefinition.typeRef?.__$$text}
relativeToNamespace={dt.namespace}
isCollection={dt.itemDefinition?.["@_isCollection"]}
/>
</SelectOption>
))
) : (
<SelectOption key={"None"} value={"None"} isDisabled={true} />
)}
</SelectGroup>
);
}
if (filteredExternalDataTypes.length > 0 || !searchText) {
selectGroups.push(
<SelectGroup label="External" key="external" style={{ minWidth:
"300px" }}>
{filteredExternalDataTypes.length > 0 ? (
filteredExternalDataTypes.map((dt) => (
<SelectOption key={dt.feelName} value={dt.feelName}>
{dt.feelName}
<TypeRefLabel
typeRef={dt.itemDefinition.typeRef?.__$$text}
relativeToNamespace={dt.namespace}
isCollection={dt.itemDefinition?.["@_isCollection"]}
/>
</SelectOption>
))
) : (
<SelectOption key={"None"} value={"None"} isDisabled={true} />
)}
</SelectGroup>
);
}
return selectGroups;
},
[]
);
```
Also, if you do that change, you will have to update the hooks list in the
line 186, to:
`[buildSelectGroups, customDataTypes, externalDataTypes]`
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
