fix(parameterComponent): import extractIdFromLongId function to fix missing reference error

feat(parameterComponent): add proxy prop to ParameterComponentType to pass proxy information to the component
feat(GenericNode): pass proxy information from node template to ParameterComponent
feat(types): add proxy field to proxy object in ParameterComponentType
fix(reactflowUtils): remove unnecessary code for extracting node id

src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx

@@ -33,7 +33,7 @@ import {
   nodeIconsLucide,
   nodeNames,
 } from "../../../../utils/styleUtils";
-import { classNames, groupByFamily } from "../../../../utils/utils";
+import { classNames, extractIdFromLongId, groupByFamily } from "../../../../utils/utils";
 
 export default function ParameterComponent({
   left,
@@ -48,6 +48,7 @@ export default function ParameterComponent({
   required = false,
   optionalHandle = null,
   info = "",
+  proxy
 }: ParameterComponentType): JSX.Element {
   const ref = useRef<HTMLDivElement>(null);
   const refHtml = useRef<HTMLDivElement & ReactNode>(null);
@@ -98,7 +99,6 @@ export default function ParameterComponent({
   };
 
   useEffect(() => {
-    if (name === "openai_api_base") console.log(info);
     // @ts-ignore
     infoHtml.current = (
       <div className="h-full w-full break-words">
@@ -185,7 +185,9 @@ export default function ParameterComponent({
             (info !== "" ? " flex items-center" : "")
           }
         >
-          {title}
+          {proxy ? (<ShadTooltip content={<span>{proxy.id}</span>}>
+            <span>{title}</span>
+          </ShadTooltip>):title}
           <span className="text-status-red">{required ? " *" : ""}</span>
           <div className="">
             {info !== "" && (

src/frontend/src/CustomNodes/GenericNode/index.tsx

@@ -274,6 +274,7 @@ export default function GenericNode({
                       optionalHandle={
                         data.node?.template[templateField].input_types
                       }
+                      proxy={data.node?.template[templateField].proxy}
                     />
                   ) : (
                     <></>

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

@@ -49,6 +49,7 @@ export type ParameterComponentType = {
   dataContext?: typesContextType;
   optionalHandle?: Array<String> | null;
   info?: string;
+  proxy?: {field: string, id: string};
 };
 export type InputListComponentType = {
   value: string[];

src/frontend/src/utils/reactflowUtils.ts

@@ -584,8 +584,8 @@ export function mergeNodeTemplates({
               ? nodeTemplate[key].display_name
               : nodeTemplate[key].name
               ? toTitleCase(nodeTemplate[key].name)
-              : toTitleCase(key)) + " - "+ truncateDisplayName(node.data.node?.display_name!) +"-" +
-              extractIdFromLongId(node.data.id)
+              : toTitleCase(key)) + " - "+ truncateDisplayName(node.data.node?.display_name!)
+              
           }
         }
       });