refactor: Update SwitchOutputView to accept outputName prop

Update the SwitchOutputView component to accept the outputName prop, allowing for dynamic rendering of different output views based on the selected output name.

src/frontend/src/CustomNodes/GenericNode/components/outputModal/components/switchOutputView/index.tsx

@@ -9,19 +9,24 @@ import { Case } from "../../../../../../shared/components/caseComponent";
 import TextOutputView from "../../../../../../shared/components/textOutputView";
 import useFlowStore from "../../../../../../stores/flowStore";
 import ErrorOutput from "./components";
-
+// Define the props type
-export default function SwitchOutputView(nodeId): JSX.Element {
+interface SwitchOutputViewProps {
-  const nodeIdentity = nodeId.nodeId;
+  nodeId: string;
-
+  outputName: string;
+}
+const SwitchOutputView: React.FC<SwitchOutputViewProps> = ({
+  nodeId,
+  outputName,
+}) => {
   const nodes = useFlowStore((state) => state.nodes);
   const flowPool = useFlowStore((state) => state.flowPool);
-  const node = nodes.find((node) => node?.id === nodeIdentity);
+  const node = nodes.find((node) => node?.id === nodeId);
 
-  const flowPoolNode = (flowPool[nodeIdentity] ?? [])[
+  const flowPoolNode = (flowPool[nodeId] ?? [])[
-    (flowPool[nodeIdentity]?.length ?? 1) - 1
+    (flowPool[nodeId]?.length ?? 1) - 1
   ];
 
-  const results = flowPoolNode?.data?.logs[0] ?? "";
+  const results = flowPoolNode?.data?.logs[outputName] ?? "";
   const resultType = results?.type;
   let resultMessage = results?.message;
   const RECORD_TYPES = ["record", "object", "array", "message"];
@@ -73,4 +78,6 @@ export default function SwitchOutputView(nodeId): JSX.Element {
       </Case>
     </>
   );
-}
+};
+
+export default SwitchOutputView;

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

@@ -2,7 +2,12 @@ import { Button } from "../../../../components/ui/button";
 import BaseModal from "../../../../modals/baseModal";
 import SwitchOutputView from "./components/switchOutputView";
 
-export default function OutputModal({ open, setOpen, nodeId }): JSX.Element {
+export default function OutputModal({
+  open,
+  setOpen,
+  nodeId,
+  outputName,
+}): JSX.Element {
   return (
     <BaseModal open={open} setOpen={setOpen} size="medium-tall">
       <BaseModal.Header description="Inspect the output of the component below.">
@@ -11,7 +16,7 @@ export default function OutputModal({ open, setOpen, nodeId }): JSX.Element {
         </div>
       </BaseModal.Header>
       <BaseModal.Content>
-        <SwitchOutputView nodeId={nodeId} />
+        <SwitchOutputView nodeId={nodeId} outputName={outputName} />
       </BaseModal.Content>
       <BaseModal.Footer>
         <div className="flex w-full justify-end  pt-2">

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

@@ -625,6 +625,7 @@ export default function ParameterComponent({
             open={openOutputModal}
             nodeId={data.id}
             setOpen={setOpenOutputModal}
+            outputName={outputName}
           />
         )}
       </>