fix: fixes dropdown refreshList not working properly (#7395)

* feat: add nodeId, nodeClass, and handleNodeClass props to dropdown and string render components

* fix: remove extraneous flag from package-lock.json and add nodeId, nodeClass, handleNodeClass props to ParameterRenderComponent

---------

Co-authored-by: Mike Fortman <michael.fortman@datastax.com>

src/frontend/package-lock.json

@@ -709,7 +709,6 @@
     },
     "node_modules/@clack/prompts/node_modules/is-unicode-supported": {
       "version": "1.3.0",
-      "extraneous": true,
       "inBundle": true,
       "license": "MIT",
       "engines": {

src/frontend/src/components/core/dropdownComponent/index.tsx

@@ -47,6 +47,9 @@ export default function Dropdown({
   editNode = false,
   id = "",
   children,
+  nodeId,
+  nodeClass,
+  handleNodeClass,
   name,
   dialogInputs,
   ...baseInputProps
@@ -76,14 +79,13 @@ export default function Dropdown({
   const fuse = new Fuse(validOptions, { keys: ["name", "value"] });
   const PopoverContentDropdown =
     children || editNode ? PopoverContent : PopoverContentWithoutPortal;
-  const { nodeClass, nodeId, handleNodeClass, tooltip, helperText } =
+  const { helperText } = baseInputProps;
-    baseInputProps;
 
   // API and store hooks
   const postTemplateValue = usePostTemplateValue({
-    parameterId: name || "",
+    parameterId: name,
-    nodeId: nodeId || "",
+    nodeId: nodeId,
-    node: nodeClass!,
+    node: nodeClass,
   });
   const setErrorData = useAlertStore((state) => state.setErrorData);
 

src/frontend/src/components/core/parameterRenderComponent/components/dropdownComponent/index.tsx

@@ -14,6 +14,7 @@ export default function DropdownComponent({
   optionsMetaData,
   nodeClass,
   nodeId,
+  handleNodeClass,
   ...baseInputProps
 }: InputProps<string, DropDownComponentType>) {
   const onChange = (value: any, dbValue?: boolean, skipSnapshot?: boolean) => {
@@ -25,6 +26,9 @@ export default function DropdownComponent({
       disabled={disabled}
       editNode={editNode}
       options={options}
+      nodeId={nodeId}
+      nodeClass={nodeClass}
+      handleNodeClass={handleNodeClass}
       optionsMetaData={optionsMetaData}
       onSelect={onChange}
       combobox={combobox}

src/frontend/src/components/core/parameterRenderComponent/components/strRenderComponent/index.tsx

@@ -10,6 +10,9 @@ export function StrRenderComponent({
   name,
   display_name,
   placeholder,
+  nodeId,
+  nodeClass,
+  handleNodeClass,
   ...baseInputProps
 }: InputProps<string, StrRenderComponentType>) {
   const { handleOnNewValue, id, isToolMode, nodeInformationMetadata } =
@@ -67,6 +70,9 @@ export function StrRenderComponent({
         {...baseInputProps}
         dialogInputs={templateData.dialog_inputs}
         options={templateData.options ?? []}
+        nodeId={nodeId}
+        nodeClass={nodeClass}
+        handleNodeClass={handleNodeClass}
         optionsMetaData={templateData.options_metadata}
         combobox={templateData.combobox}
         name={templateData?.name!}

src/frontend/src/components/core/parameterRenderComponent/index.tsx

@@ -68,11 +68,11 @@ export function ParameterRenderComponent({
       disabled,
       nodeClass,
       handleNodeClass,
+      nodeId,
       helperText: templateData?.helper_text,
       readonly: templateData.readonly,
       placeholder,
       isToolMode,
-      nodeId,
       nodeInformationMetadata,
       hasRefreshButton: templateData.refresh_button,
     };
@@ -107,6 +107,9 @@ export function ParameterRenderComponent({
       return (
         <StrRenderComponent
           {...baseInputProps}
+          nodeId={nodeId}
+          nodeClass={nodeClass}
+          handleNodeClass={handleNodeClass}
           templateData={templateData}
           name={name}
           display_name={templateData.display_name ?? ""}

src/frontend/src/components/core/parameterRenderComponent/types.ts

@@ -77,6 +77,9 @@ export type StrRenderComponentType = {
   templateData: Partial<InputFieldType>;
   name: string;
   display_name: string;
+  nodeId: string;
+  nodeClass: APIClassType;
+  handleNodeClass: (value: any, code?: string, type?: string) => void;
 };
 
 export type InputListComponentType = {
@@ -91,6 +94,9 @@ export type DropDownComponentType = {
   name: string;
   dialogInputs?: any;
   optionsMetaData?: any[];
+  nodeId: string;
+  nodeClass: APIClassType;
+  handleNodeClass: (value: any, code?: string, type?: string) => void;
 };
 
 export type TextAreaComponentType = {

src/frontend/src/types/components/index.ts

@@ -56,13 +56,16 @@ export type DropDownComponent = {
   isLoading?: boolean;
   value: string;
   combobox?: boolean;
+  nodeId: string;
+  nodeClass: APIClassType;
+  handleNodeClass: (value: any, code?: string, type?: string) => void;
   options: string[];
   optionsMetaData?: any[];
   onSelect: (value: string, dbValue?: boolean, snapshot?: boolean) => void;
   editNode?: boolean;
   id?: string;
   children?: ReactNode;
-  name?: string;
+  name: string;
   dialogInputs?: any;
 };
 export type ParameterComponentType = {