feat(frontend): add ErrorOutput component to display error messages in output modal

feat(frontend): update SwitchOutputView to render ErrorOutput component for 'ValueError'
fix(frontend): update BaseModal header text in OutputModal component
fix(frontend): update displayOutputPreview logic in ParameterComponent to check for specific log type

src/frontend/src/customNodes/genericNode/components/outputModal/components/switchOutputView/components/index.tsx

@@ -0,0 +1,13 @@
+import { Textarea } from "../../../../../../../components/ui/textarea";
+
+export default function ErrorOutput({ value }: { value: string }) {
+  console.log(value);
+  return (
+    <Textarea
+      className={`h-full w-full text-destructive custom-scroll`}
+      placeholder={"Empty"}
+      value={value}
+      readOnly
+    />
+  );
+}

src/frontend/src/customNodes/genericNode/components/outputModal/components/switchOutputView/index.tsx

@@ -2,6 +2,7 @@ import RecordsOutputComponent from "../../../../../../components/recordsOutputCo
 import { Case } from "../../../../../../shared/components/caseComponent";
 import TextOutputView from "../../../../../../shared/components/textOutputView";
 import useFlowStore from "../../../../../../stores/flowStore";
+import ErrorOutput from "./components";
 import { convertToTableRows } from "./helpers/convert-to-table-rows";
 
 export default function SwitchOutputView(nodeId): JSX.Element {
@@ -21,13 +22,12 @@ export default function SwitchOutputView(nodeId): JSX.Element {
 
   return (
     <>
-      <Case
+      <Case condition={!resultType || resultType === "unknown"}>
-        condition={
-          !resultType || resultType === "unknown" || resultType === "valueError"
-        }
-      >
         <div>NO OUTPUT</div>
       </Case>
+      <Case condition={resultType === "ValueError"}>
+        <ErrorOutput value={resultMessage}></ErrorOutput>
+      </Case>
 
       <Case condition={node && resultType === "text"}>
         <TextOutputView left={false} value={resultMessage} />

src/frontend/src/customNodes/genericNode/components/outputModal/index.tsx

@@ -4,10 +4,10 @@ import SwitchOutputView from "./components/switchOutputView";
 
 export default function OutputModal({ open, setOpen, nodeId }): JSX.Element {
   return (
-    <BaseModal open={open} setOpen={setOpen} size="medium-log">
+    <BaseModal open={open} setOpen={setOpen} size="medium">
-      <BaseModal.Header description="Output Visualization">
+      <BaseModal.Header description="DESCRICAO RODRIGO">
         <div className="flex items-center">
-          <span className="pr-2">Output View</span>
+          <span className="pr-2">TITULO RODRIGO</span>
         </div>
       </BaseModal.Header>
       <BaseModal.Content>

src/frontend/src/customNodes/genericNode/components/parameterComponent/index.tsx

@@ -81,7 +81,11 @@ export default function ParameterComponent({
   const [openOutputModal, setOpenOutputModal] = useState(false);
   const flowPool = useFlowStore((state) => state.flowPool);
 
-  const displayOutputPreview = !!flowPool[data.id];
+  const displayOutputPreview = !!(
+    flowPool[data.id] &&
+    flowPool[data.id][flowPool[data.id].length - 1]?.data?.logs[0]?.type !==
+      "unknown"
+  );
 
   const { handleOnNewValue: handleOnNewValueHook } = useHandleOnNewValue(
     data,
@@ -272,9 +276,9 @@ export default function ParameterComponent({
                   >
                     <IconComponent
                       className={classNames(
-                        "h-5 w-5",
+                        "h-5 w-5 rounded-md",
                         displayOutputPreview
-                          ? ""
+                          ? " hover:bg-secondary-foreground/5 hover:text-medium-indigo"
                           : " cursor-not-allowed text-muted-foreground",
                       )}
                       name={"ScanEye"}