fix: Adjust flow cascade deletion and improve flow delete message UI (#6667)

* 🐛 (utils.py): fix cascade delete flow function to correctly delete related entities in the database and handle exceptions properly

* ✨ (grid/index.tsx): Update descriptionModal to differentiate between component and flow types for better user experience
✨ (list/index.tsx): Update descriptionModal to differentiate between component and flow types for better user experience

* [autofix.ci] apply automated fixes

---------

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>

src/backend/base/langflow/api/utils.py

@@ -14,6 +14,7 @@ from langflow.graph.graph.base import Graph
 from langflow.services.auth.utils import get_current_active_user
 from langflow.services.database.models import User
 from langflow.services.database.models.flow import Flow
+from langflow.services.database.models.message import MessageTable
 from langflow.services.database.models.transactions.model import TransactionTable
 from langflow.services.database.models.vertex_builds.model import VertexBuildTable
 from langflow.services.deps import get_session, session_scope
@@ -281,16 +282,16 @@ def parse_value(value: Any, input_type: str) -> Any:
 
 async def cascade_delete_flow(session: AsyncSession, flow_id: uuid.UUID) -> None:
     try:
-        await session.exec(delete(TransactionTable).where(TransactionTable.flow_id == flow_id))
-        await session.exec(delete(VertexBuildTable).where(VertexBuildTable.flow_id == flow_id))
         # TODO: Verify if deleting messages is safe in terms of session id relevance
         # If we delete messages directly, rather than setting flow_id to null,
         # it might cause unexpected behaviors because the session id could still be
         # used elsewhere to search for these messages.
-        # await session.exec(delete(MessageTable).where(MessageTable.flow_id == flow_id))
+        await session.exec(delete(MessageTable).where(MessageTable.flow_id == flow_id))
+        await session.exec(delete(TransactionTable).where(TransactionTable.flow_id == flow_id))
+        await session.exec(delete(VertexBuildTable).where(VertexBuildTable.flow_id == flow_id))
         await session.exec(delete(Flow).where(Flow.id == flow_id))
     except Exception as e:
-        msg = f"Unable to cascade delete flow: ${flow_id}"
+        msg = f"Unable to cascade delete flow: {flow_id}"
         raise RuntimeError(msg, e) from e
 
 

src/frontend/src/pages/MainPage/components/grid/index.tsx

@@ -64,7 +64,10 @@ const GridComponent = ({ flowData }: { flowData: FlowType }) => {
       });
   };
 
-  const descriptionModal = useDescriptionModal([flowData?.id], "flow");
+  const descriptionModal = useDescriptionModal(
+    [flowData?.id],
+    flowData.is_component ? "component" : "flow",
+  );
 
   const { onDragStart } = useDragStart(flowData);
 
@@ -145,6 +148,11 @@ const GridComponent = ({ flowData }: { flowData: FlowType }) => {
           setOpen={setOpenDelete}
           onConfirm={handleDelete}
           description={descriptionModal}
+          note={
+            !flowData.is_component
+              ? "Deleting the selected flow will remove all associated messages."
+              : ""
+          }
         >
           <></>
         </DeleteConfirmationModal>

src/frontend/src/pages/MainPage/components/list/index.tsx

@@ -64,7 +64,10 @@ const ListComponent = ({ flowData }: { flowData: FlowType }) => {
 
   const { onDragStart } = useDragStart(flowData);
 
-  const descriptionModal = useDescriptionModal([flowData?.id], "flow");
+  const descriptionModal = useDescriptionModal(
+    [flowData?.id],
+    flowData.is_component ? "component" : "flow",
+  );
 
   const swatchIndex =
     (flowData.gradient && !isNaN(parseInt(flowData.gradient))
@@ -164,6 +167,11 @@ const ListComponent = ({ flowData }: { flowData: FlowType }) => {
           setOpen={setOpenDelete}
           onConfirm={handleDelete}
           description={descriptionModal}
+          note={
+            !flowData.is_component
+              ? "Deleting the selected flow will remove all associated messages."
+              : ""
+          }
         >
           <></>
         </DeleteConfirmationModal>