add warning to components with old codes

src/frontend/src/alerts/notice/index.tsx

@@ -47,7 +47,7 @@ export default function NoticeAlert({
             />
           </div>
           <div className="ml-3 flex-1 md:flex md:justify-between">
-            <p className="line-clamp-2 text-sm text-info-foreground word-break-break-word">
+            <p className="text-sm text-info-foreground word-break-break-word">
               {title}
             </p>
             <p className="mt-3 text-sm md:ml-6 md:mt-0">

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();

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<FlowStoreType>((set, get) => ({
       });
       return;
     }
+    if(selection.nodes){
+      if(checkOldComponents({nodes:selection.nodes ?? []})){
+        useAlertStore.getState().setNoticeData({title:"Components created before Langflow 1.0 may be unstable. Ensure components are up to date."})
+      }
+    }
     let minimumX = Infinity;
     let minimumY = Infinity;
     let idsMap = {};

src/frontend/src/utils/reactflowUtils.ts

@@ -1511,3 +1511,8 @@ export function getGroupOutputNodeId(
   }
   return { id: node.id, outputName: p_name };
 }
+
+export function checkOldComponents({nodes}:{nodes:any[]}) {
+  return nodes.some((node) => node.data.node?.template.code && (node.data.node?.template.code.value as string).includes("(CustomComponent):"));
+
+}