diff --git a/src/frontend/src/alerts/notice/index.tsx b/src/frontend/src/alerts/notice/index.tsx index 7d2d4d987..49fb52759 100644 --- a/src/frontend/src/alerts/notice/index.tsx +++ b/src/frontend/src/alerts/notice/index.tsx @@ -47,7 +47,7 @@ export default function NoticeAlert({ />
+
{title}
diff --git a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
index c3632cf6d..d5a18f261 100644
--- a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
+++ b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
@@ -34,6 +34,7 @@ import { useTypesStore } from "../../../../stores/typesStore";
import { APIClassType } from "../../../../types/api";
import { FlowType, NodeType } from "../../../../types/flow";
import {
+ checkOldComponents,
generateFlow,
generateNodeFromFlow,
getNodeId,
@@ -97,6 +98,7 @@ export default function Page({
const onConnect = useFlowStore((state) => state.onConnect);
const currentFlowId = useFlowsManagerStore((state) => state.currentFlowId);
const setErrorData = useAlertStore((state) => state.setErrorData);
+ const setNoticeData = useAlertStore((state) => state.setNoticeData);
const [selectionMenuVisible, setSelectionMenuVisible] = useState(false);
const edgeUpdateSuccessful = useRef(true);
@@ -170,6 +172,12 @@ export default function Page({
}
}, [currentFlowId, reactFlowInstance]);
+useEffect(() => {
+ if(checkOldComponents({nodes:flow?.data?.nodes ?? []})){
+ setNoticeData({title:"Components created before Langflow 1.0 may be unstable. Ensure components are up to date."})
+ }
+},[])
+
useEffect(() => {
return () => {
cleanFlow();
diff --git a/src/frontend/src/stores/flowStore.ts b/src/frontend/src/stores/flowStore.ts
index 24e3a83d3..05f5ff948 100644
--- a/src/frontend/src/stores/flowStore.ts
+++ b/src/frontend/src/stores/flowStore.ts
@@ -27,6 +27,7 @@ import { FlowStoreType, VertexLayerElementType } from "../types/zustand/flow";
import { buildVertices } from "../utils/buildUtils";
import {
checkChatInput,
+ checkOldComponents,
cleanEdges,
getHandleId,
getNodeId,
@@ -240,6 +241,11 @@ const useFlowStore = create