diff --git a/src/backend/base/langflow/components/experimental/Message.py b/src/backend/base/langflow/components/experimental/Message.py new file mode 100644 index 000000000..9fdd8a0da --- /dev/null +++ b/src/backend/base/langflow/components/experimental/Message.py @@ -0,0 +1,38 @@ +from typing import Optional + +from langflow.custom import CustomComponent +from langflow.schema.message import Message + + +class MessageComponent(CustomComponent): + display_name = "Message" + description = "Creates a Message object given a Session ID." + + def build_config(self): + return { + "sender": { + "options": ["Machine", "User"], + "display_name": "Sender Type", + }, + "sender_name": {"display_name": "Sender Name"}, + "text": {"display_name": "Text"}, + "session_id": { + "display_name": "Session ID", + "info": "Session ID of the chat history.", + "input_types": ["Text"], + }, + } + + def build( + self, + sender: str = "User", + sender_name: Optional[str] = None, + session_id: Optional[str] = None, + text: str = "", + ) -> Message: + message = Message( + text=text, sender=sender, sender_name=sender_name, flow_id=self.graph.flow_id, session_id=session_id + ) + + self.status = message + return message diff --git a/src/backend/base/langflow/components/experimental/StoreMessage.py b/src/backend/base/langflow/components/experimental/StoreMessage.py index 19be36068..5d0abfbb9 100644 --- a/src/backend/base/langflow/components/experimental/StoreMessage.py +++ b/src/backend/base/langflow/components/experimental/StoreMessage.py @@ -1,5 +1,3 @@ -from typing import List, Optional - from langflow.custom import CustomComponent from langflow.memory import get_messages, store_message from langflow.schema.message import Message @@ -7,36 +5,18 @@ from langflow.schema.message import Message class StoreMessageComponent(CustomComponent): display_name = "Store Message" - description = "Stores a chat message given a Session ID." - beta: bool = True + description = "Stores a chat message." def build_config(self): return { - "sender": { - "options": ["Machine", "User"], - "display_name": "Sender Type", - }, - "sender_name": {"display_name": "Sender Name"}, "message": {"display_name": "Message"}, - "session_id": { - "display_name": "Session ID", - "info": "Session ID of the chat history.", - "input_types": ["Text"], - }, } def build( self, - sender: str = "User", - sender_name: Optional[str] = None, - session_id: Optional[str] = None, - message: str = "", - ) -> List[Message]: - store_message( - message=Message( - text=message, sender=sender, sender_name=sender_name, flow_id=self.graph.flow_id, session_id=session_id - ) - ) + message: Message, + ) -> Message: + store_message(message, flow_id=self.graph.flow_id) + self.status = get_messages() - self.status = get_messages(session_id=session_id) - return get_messages(session_id=session_id) + return message diff --git a/src/backend/base/langflow/memory.py b/src/backend/base/langflow/memory.py index 9a07f4bc1..e812f449c 100644 --- a/src/backend/base/langflow/memory.py +++ b/src/backend/base/langflow/memory.py @@ -46,7 +46,13 @@ def get_messages( # so we need to reverse the order messages_df = messages_df[::-1] if order == "DESC" else messages_df for row in messages_df.itertuples(): - msg = Message(text=row.text, sender=row.sender, sender_name=row.sender_name, timestamp=row.timestamp) + msg = Message( + text=row.text, + sender=row.sender, + session_id=row.session_id, + sender_name=row.sender_name, + timestamp=row.timestamp, + ) messages.append(msg) diff --git a/src/frontend/src/App.css b/src/frontend/src/App.css index 5564ca084..125282e2c 100644 --- a/src/frontend/src/App.css +++ b/src/frontend/src/App.css @@ -156,3 +156,8 @@ body { .react-flow__edge .react-flow__edge-path { stroke: var(--connection) !important; } + +.ag-react-container { + width: 100%; + height: 100%; +} diff --git a/src/frontend/src/components/addNewVariableButtonComponent/addNewVariableButton.tsx b/src/frontend/src/components/addNewVariableButtonComponent/addNewVariableButton.tsx index 37d80a241..89535aa68 100644 --- a/src/frontend/src/components/addNewVariableButtonComponent/addNewVariableButton.tsx +++ b/src/frontend/src/components/addNewVariableButtonComponent/addNewVariableButton.tsx @@ -14,7 +14,13 @@ import sortByName from "./utils/sort-by-name"; //TODO IMPLEMENT FORM LOGIC -export default function AddNewVariableButton({ children }): JSX.Element { +export default function AddNewVariableButton({ + children, + asChild, +}: { + children: JSX.Element; + asChild?: boolean; +}): JSX.Element { const [key, setKey] = useState(""); const [value, setValue] = useState(""); const [type, setType] = useState("Generic"); @@ -87,7 +93,7 @@ export default function AddNewVariableButton({ children }): JSX.Element { aria-hidden="true" /> - {children} + {children}
diff --git a/src/frontend/src/components/tableComponent/components/loadingOverlay/index.tsx b/src/frontend/src/components/tableComponent/components/loadingOverlay/index.tsx new file mode 100644 index 000000000..9df9144e0 --- /dev/null +++ b/src/frontend/src/components/tableComponent/components/loadingOverlay/index.tsx @@ -0,0 +1,9 @@ +import Loading from "../../../ui/loading"; + +export default function LoadingOverlay() { + return ( +
+ +
+ ); +} diff --git a/src/frontend/src/components/tableComponent/components/tableNodeCellRender/index.tsx b/src/frontend/src/components/tableComponent/components/tableNodeCellRender/index.tsx index a4cf80ecc..fb24786f7 100644 --- a/src/frontend/src/components/tableComponent/components/tableNodeCellRender/index.tsx +++ b/src/frontend/src/components/tableComponent/components/tableNodeCellRender/index.tsx @@ -28,7 +28,7 @@ export default function TableNodeCellRender({ value, nodeClass, handleOnNewValue: handleOnNewValueNode, - handleOnChangeDb, + handleOnChangeDb: handleOnChangeDbNode, }, }: CustomCellRendererProps) { const handleOnNewValue = (newValue: any, name: string) => { @@ -41,6 +41,15 @@ export default function TableNodeCellRender({ setTemplateValue(newValue); }; + const handleOnChangeDb = (newValue: boolean, name: string) => { + handleOnChangeDbNode(newValue, name); + setTemplateData((old) => { + let newData = cloneDeep(old); + newData.load_from_db = newValue; + return newData; + }); + }; + const [templateValue, setTemplateValue] = useState(value); const [templateData, setTemplateData] = useState(data); diff --git a/src/frontend/src/components/tableComponent/index.tsx b/src/frontend/src/components/tableComponent/index.tsx index 917919f51..fdd4a5f1e 100644 --- a/src/frontend/src/components/tableComponent/index.tsx +++ b/src/frontend/src/components/tableComponent/index.tsx @@ -13,6 +13,7 @@ import ForwardedIconComponent from "../genericIconComponent"; import { Alert, AlertDescription, AlertTitle } from "../ui/alert"; import TableOptions from "./components/TableOptions"; import resetGrid from "./utils/reset-grid-columns"; +import Loading from "../ui/loading"; interface TableComponentProps extends AgGridReactProps { columnDefs: NonNullable; @@ -76,7 +77,7 @@ const TableComponent = forwardRef< const dark = useDarkStore((state) => state.dark); const initialColumnDefs = useRef(colDef); const [columnStateChange, setColumnStateChange] = useState(false); - + const storeReference = props.columnDefs.map((e) => e.headerName).join("_"); const makeLastColumnNonResizable = (columnDefs) => { columnDefs.forEach((colDef, index) => { colDef.resizable = index !== columnDefs.length - 1; @@ -89,13 +90,26 @@ const TableComponent = forwardRef< realRef.current = params; const updatedColumnDefs = makeLastColumnNonResizable([...colDef]); params.api.setGridOption("columnDefs", updatedColumnDefs); + const customInit = localStorage.getItem(storeReference); initialColumnDefs.current = params.api.getColumnDefs(); - if (props.onGridReady) props.onGridReady(params); + if (customInit && realRef.current) { + realRef.current.api.applyColumnState({ + state: JSON.parse(customInit), + applyOrder: true, + }); + } setTimeout(() => { - setColumnStateChange(false); - }, 200); + if (customInit && realRef.current) { + setColumnStateChange(true); + } else { + setColumnStateChange(false); + } + }, 50); + setTimeout(() => { + realRef.current.api.hideOverlay(); + }, 1000); + if (props.onGridReady) props.onGridReady(params); }; - const onColumnMoved = (params) => { const updatedColumnDefs = makeLastColumnNonResizable( params.columnApi.getAllGridColumns().map((col) => col.getColDef()), @@ -103,7 +117,6 @@ const TableComponent = forwardRef< params.api.setGridOption("columnDefs", updatedColumnDefs); if (props.onColumnMoved) props.onColumnMoved(params); }; - if (props.rowData.length === 0) { return (
@@ -138,6 +151,10 @@ const TableComponent = forwardRef< onColumnMoved={onColumnMoved} onStateUpdated={(e) => { if (e.sources.some((source) => source.includes("column"))) { + localStorage.setItem( + storeReference, + JSON.stringify(realRef.current?.api?.getColumnState()), + ); setColumnStateChange(true); } }} @@ -152,6 +169,7 @@ const TableComponent = forwardRef< resetGrid(realRef, initialColumnDefs); setTimeout(() => { setColumnStateChange(false); + localStorage.removeItem(storeReference); }, 100); }} /> diff --git a/src/frontend/src/modals/IOModal/components/chatView/index.tsx b/src/frontend/src/modals/IOModal/components/chatView/index.tsx index 067cf525c..876295d07 100644 --- a/src/frontend/src/modals/IOModal/components/chatView/index.tsx +++ b/src/frontend/src/modals/IOModal/components/chatView/index.tsx @@ -65,10 +65,15 @@ export default function ChatView({ .filter((output) => output.data.message) .map((output, index) => { try { - const { sender, message, sender_name, stream_url, files } = output - .data.message as ChatOutputType; + console.log("output:", output); + const { sender, message, sender_name, stream_url, files } = + output.data.message.message !== "" || + (output.data.message.files ?? []).length > 0 + ? output.data.message + : output.data.artifacts; - const is_ai = sender === "Machine" || sender === null; + const is_ai = + sender === "Machine" || sender === null || sender === undefined; return { isSend: !is_ai, message: message, diff --git a/src/frontend/src/modals/IOModal/index.tsx b/src/frontend/src/modals/IOModal/index.tsx index 9506626a5..2730dceb9 100644 --- a/src/frontend/src/modals/IOModal/index.tsx +++ b/src/frontend/src/modals/IOModal/index.tsx @@ -371,7 +371,9 @@ export default function IOModal({ size="md" className="block truncate" > - {session} + {session === currentFlow?.id + ? "Default Session" + : session}
diff --git a/src/frontend/src/modals/editNodeModal/hooks/use-column-defs.tsx b/src/frontend/src/modals/editNodeModal/hooks/use-column-defs.tsx index daddc5f1c..14263a9c6 100644 --- a/src/frontend/src/modals/editNodeModal/hooks/use-column-defs.tsx +++ b/src/frontend/src/modals/editNodeModal/hooks/use-column-defs.tsx @@ -6,6 +6,7 @@ import TableToggleCellRender from "../../../components/tableComponent/components const useColumnDefs = ( myData: any, handleOnNewValue: (newValue: any, name: string) => void, + handleOnChangeDb: (value: boolean, key: string) => void, changeAdvanced: (n: string) => void, open: boolean, ) => { @@ -47,9 +48,7 @@ const useColumnDefs = ( value: params.data.value, nodeClass: myData.node, handleOnNewValue: handleOnNewValue, - handleOnChangeDb: (value, key) => { - myData.node!.template[key].load_from_db = value; - }, + handleOnChangeDb: handleOnChangeDb, }; }, minWidth: 340, diff --git a/src/frontend/src/modals/editNodeModal/index.tsx b/src/frontend/src/modals/editNodeModal/index.tsx index 6394e85ce..b8e6a11a5 100644 --- a/src/frontend/src/modals/editNodeModal/index.tsx +++ b/src/frontend/src/modals/editNodeModal/index.tsx @@ -39,9 +39,12 @@ const EditNodeModal = forwardRef( !myData.current.node!.template[n]?.advanced; } - const handleOnNewValue = (newValue: any, name) => { - console.log(newValue); - myData.current.node!.template[name].value = newValue; + const handleOnNewValue = (newValue: any, key: string) => { + myData.current.node!.template[key].value = newValue; + }; + + const handleOnChangeDb = (newValue: boolean, key: string) => { + myData.current.node!.template[key].load_from_db = newValue; }; const rowData = useRowData(data, open); @@ -49,6 +52,7 @@ const EditNodeModal = forwardRef( const columnDefs: ColDef[] = useColumnDefs( data, handleOnNewValue, + handleOnChangeDb, changeAdvanced, open, ); diff --git a/src/frontend/src/pages/SettingsPage/index.tsx b/src/frontend/src/pages/SettingsPage/index.tsx index d201d2596..2e8f49cfc 100644 --- a/src/frontend/src/pages/SettingsPage/index.tsx +++ b/src/frontend/src/pages/SettingsPage/index.tsx @@ -36,7 +36,7 @@ export default function SettingsPage(): JSX.Element { ), }, { - title: "API Keys", + title: "Langflow API", href: "/settings/api-keys", icon: (

- API Keys + Langflow API

- +