diff --git a/src/frontend/src/CustomNodes/GenericNode/index.tsx b/src/frontend/src/CustomNodes/GenericNode/index.tsx
index 653ced0af..244b29f68 100644
--- a/src/frontend/src/CustomNodes/GenericNode/index.tsx
+++ b/src/frontend/src/CustomNodes/GenericNode/index.tsx
@@ -1,5 +1,6 @@
import emojiRegex from "emoji-regex";
import { useEffect, useMemo, useState } from "react";
+import Markdown from "react-markdown";
import { NodeToolbar, useUpdateNodeInternals } from "reactflow";
import IconComponent from "../../components/genericIconComponent";
import InputComponent from "../../components/inputComponent";
@@ -19,6 +20,7 @@ import useAlertStore from "../../stores/alertStore";
import { useDarkStore } from "../../stores/darkStore";
import useFlowStore from "../../stores/flowStore";
import useFlowsManagerStore from "../../stores/flowsManagerStore";
+import { useShortcutsStore } from "../../stores/shortcuts";
import { useTypesStore } from "../../stores/typesStore";
import { VertexBuildTypeAPI } from "../../types/api";
import { NodeDataType } from "../../types/flow";
@@ -36,8 +38,6 @@ import useValidationStatusString from "../hooks/use-validation-status-string";
import getFieldTitle from "../utils/get-field-title";
import sortFields from "../utils/sort-fields";
import ParameterComponent from "./components/parameterComponent";
-import { useShortcutsStore } from "../../stores/shortcuts";
-import Markdown from "react-markdown";
export default function GenericNode({
data,
@@ -108,11 +108,7 @@ export default function GenericNode({
};
const renderIconStatus = () => {
- return (
-
- {iconStatus}
-
- );
+ return iconStatus;
};
const getNodeBorderClassName = (
@@ -349,7 +345,7 @@ export default function GenericNode({
/>
) : (
-
+
{
@@ -366,6 +362,22 @@ export default function GenericNode({
{data.node?.display_name}
+ {isOutdated && (
+
+
+
+ )}
)}
@@ -482,22 +494,31 @@ export default function GenericNode({
{showNode && (
<>
-
- {isOutdated && (
-
-
-
- )}
+
+
-
+ {renderIconStatus()}
>
diff --git a/src/frontend/src/CustomNodes/hooks/use-icons-status.tsx b/src/frontend/src/CustomNodes/hooks/use-icons-status.tsx
index 55936c6c9..e433a634d 100644
--- a/src/frontend/src/CustomNodes/hooks/use-icons-status.tsx
+++ b/src/frontend/src/CustomNodes/hooks/use-icons-status.tsx
@@ -1,7 +1,4 @@
-import IconComponent from "../../components/genericIconComponent";
-import Checkmark from "../../components/ui/checkmark";
import Loading from "../../components/ui/loading";
-import Xmark from "../../components/ui/xmark";
import { BuildStatus } from "../../constants/enums";
import { VertexBuildTypeAPI } from "../../types/api";
import { cn } from "../../utils/utils";
@@ -24,35 +21,18 @@ const useIconStatus = (
return
;
} else {
return (
- <>
-
- {conditionSuccess ? (
-
- ) : conditionInactive ? (
-
- ) : conditionError ? (
-
- ) : (
- <>>
+
+ />
);
}
};
diff --git a/src/frontend/src/style/applies.css b/src/frontend/src/style/applies.css
index 550c86d60..fe51b6af4 100644
--- a/src/frontend/src/style/applies.css
+++ b/src/frontend/src/style/applies.css
@@ -333,13 +333,13 @@
@apply relative flex flex-col justify-center bg-background transition-all;
}
.generic-node-div-title {
- @apply flex w-full items-center gap-2 border-b bg-muted p-4;
+ @apply flex w-full items-center gap-2 border-b bg-muted p-5;
}
.generic-node-title-arrangement {
@apply flex-max-width items-center truncate;
}
.generic-node-icon {
- @apply h-10 w-10 rounded p-1;
+ @apply h-8 w-8 rounded;
}
.generic-node-tooltip-div {
@apply ml-2 max-w-[220px] truncate;