Merge branch 'main' into FEATURE/Vision

# Conflicts:
#	packages/server/src/index.ts

packages/ui/src/api/database.js

@@ -1,9 +0,0 @@
-import client from './client'
-
-const getExportDatabase = () => client.get('/database/export')
-const createLoadDatabase = (body) => client.post('/database/load', body)
-
-export default {
-    getExportDatabase,
-    createLoadDatabase
-}

packages/ui/src/layout/MainLayout/Header/ProfileSection/index.js

@@ -1,7 +1,6 @@
 import { useState, useRef, useEffect } from 'react'
 import PropTypes from 'prop-types'
-import { useSelector, useDispatch } from 'react-redux'
-import { useNavigate } from 'react-router-dom'
+import { useSelector } from 'react-redux'
 
 // material-ui
 import { useTheme } from '@mui/material/styles'
@@ -26,16 +25,10 @@ import PerfectScrollbar from 'react-perfect-scrollbar'
 // project imports
 import MainCard from 'ui-component/cards/MainCard'
 import Transitions from 'ui-component/extended/Transitions'
-import { BackdropLoader } from 'ui-component/loading/BackdropLoader'
 import AboutDialog from 'ui-component/dialog/AboutDialog'
 
 // assets
-import { IconLogout, IconSettings, IconFileExport, IconFileDownload, IconInfoCircle } from '@tabler/icons'
-
-// API
-import databaseApi from 'api/database'
-
-import { SET_MENU } from 'store/actions'
+import { IconLogout, IconSettings, IconInfoCircle } from '@tabler/icons'
 
 import './index.css'
 
@@ -43,17 +36,13 @@ import './index.css'
 
 const ProfileSection = ({ username, handleLogout }) => {
     const theme = useTheme()
-    const dispatch = useDispatch()
-    const navigate = useNavigate()
 
     const customization = useSelector((state) => state.customization)
 
     const [open, setOpen] = useState(false)
-    const [loading, setLoading] = useState(false)
     const [aboutDialogOpen, setAboutDialogOpen] = useState(false)
 
     const anchorRef = useRef(null)
-    const uploadRef = useRef(null)
 
     const handleClose = (event) => {
         if (anchorRef.current && anchorRef.current.contains(event.target)) {
@@ -66,56 +55,6 @@ const ProfileSection = ({ username, handleLogout }) => {
         setOpen((prevOpen) => !prevOpen)
     }
 
-    const handleExportDB = async () => {
-        setOpen(false)
-        try {
-            const response = await databaseApi.getExportDatabase()
-            const exportItems = response.data
-            let dataStr = JSON.stringify(exportItems, null, 2)
-            let dataUri = 'data:application/json;charset=utf-8,' + encodeURIComponent(dataStr)
-
-            let exportFileDefaultName = `DB.json`
-
-            let linkElement = document.createElement('a')
-            linkElement.setAttribute('href', dataUri)
-            linkElement.setAttribute('download', exportFileDefaultName)
-            linkElement.click()
-        } catch (e) {
-            console.error(e)
-        }
-    }
-
-    const handleFileUpload = (e) => {
-        if (!e.target.files) return
-
-        const file = e.target.files[0]
-        const reader = new FileReader()
-        reader.onload = async (evt) => {
-            if (!evt?.target?.result) {
-                return
-            }
-            const { result } = evt.target
-
-            if (result.includes(`"chatmessages":[`) && result.includes(`"chatflows":[`) && result.includes(`"apikeys":[`)) {
-                dispatch({ type: SET_MENU, opened: false })
-                setLoading(true)
-
-                try {
-                    await databaseApi.createLoadDatabase(JSON.parse(result))
-                    setLoading(false)
-                    navigate('/', { replace: true })
-                    navigate(0)
-                } catch (e) {
-                    console.error(e)
-                    setLoading(false)
-                }
-            } else {
-                alert('Incorrect Flowise Database Format')
-            }
-        }
-        reader.readAsText(file)
-    }
-
     const prevOpen = useRef(open)
     useEffect(() => {
         if (prevOpen.current === true && open === false) {
@@ -196,27 +135,6 @@ const ProfileSection = ({ username, handleLogout }) => {
                                                     }
                                                 }}
                                             >
-                                                <ListItemButton
-                                                    sx={{ borderRadius: `${customization.borderRadius}px` }}
-                                                    onClick={() => {
-                                                        setOpen(false)
-                                                        uploadRef.current.click()
-                                                    }}
-                                                >
-                                                    <ListItemIcon>
-                                                        <IconFileDownload stroke={1.5} size='1.3rem' />
-                                                    </ListItemIcon>
-                                                    <ListItemText primary={<Typography variant='body2'>Load Database</Typography>} />
-                                                </ListItemButton>
-                                                <ListItemButton
-                                                    sx={{ borderRadius: `${customization.borderRadius}px` }}
-                                                    onClick={handleExportDB}
-                                                >
-                                                    <ListItemIcon>
-                                                        <IconFileExport stroke={1.5} size='1.3rem' />
-                                                    </ListItemIcon>
-                                                    <ListItemText primary={<Typography variant='body2'>Export Database</Typography>} />
-                                                </ListItemButton>
                                                 <ListItemButton
                                                     sx={{ borderRadius: `${customization.borderRadius}px` }}
                                                     onClick={() => {
@@ -249,8 +167,6 @@ const ProfileSection = ({ username, handleLogout }) => {
                     </Transitions>
                 )}
             </Popper>
-            <input ref={uploadRef} type='file' hidden accept='.json' onChange={(e) => handleFileUpload(e)} />
-            <BackdropLoader open={loading} />
             <AboutDialog show={aboutDialogOpen} onCancel={() => setAboutDialogOpen(false)} />
         </>
     )

packages/ui/src/ui-component/button/FlowListMenu.js

@@ -22,7 +22,6 @@ import useConfirm from 'hooks/useConfirm'
 import { uiBaseURL } from '../../store/constant'
 import { closeSnackbar as closeSnackbarAction, enqueueSnackbar as enqueueSnackbarAction } from '../../store/actions'
 
-import ConfirmDialog from '../dialog/ConfirmDialog'
 import SaveChatflowDialog from '../dialog/SaveChatflowDialog'
 import TagDialog from '../dialog/TagDialog'
 
@@ -264,7 +263,6 @@ export default function FlowListMenu({ chatflow, updateFlowsApi }) {
                     Delete
                 </MenuItem>
             </StyledMenu>
-            <ConfirmDialog />
             <SaveChatflowDialog
                 show={flowDialogOpen}
                 dialogProps={{

packages/ui/src/ui-component/table/FlowListTable.js

@@ -69,7 +69,9 @@ export const FlowListTable = ({ data, images, filterFunction, updateFlowsApi })
                                     <Typography
                                         sx={{ fontSize: '1.2rem', fontWeight: 500, overflowWrap: 'break-word', whiteSpace: 'pre-line' }}
                                     >
-                                        <Button onClick={() => goToCanvas(row)}>{row.templateName || row.name}</Button>
+                                        <Button onClick={() => goToCanvas(row)} sx={{ textAlign: 'left' }}>
+                                            {row.templateName || row.name}
+                                        </Button>
                                     </Typography>
                                 </TableCell>
                                 <TableCell key='1'>

packages/ui/src/views/canvas/index.js

@@ -170,7 +170,7 @@ const Canvas = () => {
             try {
                 await chatflowsApi.deleteChatflow(chatflow.id)
                 localStorage.removeItem(`${chatflow.id}_INTERNAL`)
-                navigate(-1)
+                navigate('/')
             } catch (error) {
                 const errorData = error.response.data || `${error.response.status}: ${error.response.statusText}`
                 enqueueSnackbar({

packages/ui/src/views/chatflows/index.js

@@ -12,6 +12,7 @@ import ItemCard from 'ui-component/cards/ItemCard'
 import { gridSpacing } from 'store/constant'
 import WorkflowEmptySVG from 'assets/images/workflow_empty.svg'
 import LoginDialog from 'ui-component/dialog/LoginDialog'
+import ConfirmDialog from 'ui-component/dialog/ConfirmDialog'
 
 // API
 import chatflowsApi from 'api/chatflows'
@@ -212,6 +213,7 @@ const Chatflows = () => {
                 </Stack>
             )}
             <LoginDialog show={loginDialogOpen} dialogProps={loginDialogProps} onConfirm={onLoginClick} />
+            <ConfirmDialog />
         </MainCard>
     )
 }