mirror of
https://github.com/FlowiseAI/Flowise.git
synced 2026-10-12 02:02:17 +00:00
mini-feat: Store page sizes of views in local storage (#5830)
* page sizes for agent execution view, agentflow view, chatflow view and docstore view are now stored in local storage. * Code improvements.
This commit is contained in:
@@ -5,33 +5,33 @@ import 'react-datepicker/dist/react-datepicker.css'
|
||||
// material-ui
|
||||
import {
|
||||
Box,
|
||||
Stack,
|
||||
TextField,
|
||||
MenuItem,
|
||||
Button,
|
||||
Grid,
|
||||
FormControl,
|
||||
InputLabel,
|
||||
Select,
|
||||
Dialog,
|
||||
DialogActions,
|
||||
DialogContent,
|
||||
DialogContentText,
|
||||
DialogTitle,
|
||||
FormControl,
|
||||
Grid,
|
||||
IconButton,
|
||||
InputLabel,
|
||||
MenuItem,
|
||||
Select,
|
||||
Stack,
|
||||
TextField,
|
||||
Tooltip,
|
||||
useTheme
|
||||
} from '@mui/material'
|
||||
|
||||
// project imports
|
||||
import MainCard from '@/ui-component/cards/MainCard'
|
||||
import ErrorBoundary from '@/ErrorBoundary'
|
||||
import ViewHeader from '@/layout/MainLayout/ViewHeader'
|
||||
import MainCard from '@/ui-component/cards/MainCard'
|
||||
import { Available } from '@/ui-component/rbac/available'
|
||||
|
||||
// API
|
||||
import useApi from '@/hooks/useApi'
|
||||
import executionsApi from '@/api/executions'
|
||||
import useApi from '@/hooks/useApi'
|
||||
import { useSelector } from 'react-redux'
|
||||
|
||||
// icons
|
||||
@@ -39,10 +39,10 @@ import execution_empty from '@/assets/images/executions_empty.svg'
|
||||
import { IconTrash } from '@tabler/icons-react'
|
||||
|
||||
// const
|
||||
import { ExecutionsListTable } from '@/ui-component/table/ExecutionsListTable'
|
||||
import { ExecutionDetails } from './ExecutionDetails'
|
||||
import { omit } from 'lodash'
|
||||
import TablePagination, { DEFAULT_ITEMS_PER_PAGE } from '@/ui-component/pagination/TablePagination'
|
||||
import { ExecutionsListTable } from '@/ui-component/table/ExecutionsListTable'
|
||||
import { omit } from 'lodash'
|
||||
import { ExecutionDetails } from './ExecutionDetails'
|
||||
|
||||
// ==============================|| AGENT EXECUTIONS ||============================== //
|
||||
|
||||
@@ -91,11 +91,12 @@ const AgentExecutions = () => {
|
||||
|
||||
/* Table Pagination */
|
||||
const [currentPage, setCurrentPage] = useState(1)
|
||||
const [pageLimit, setPageLimit] = useState(DEFAULT_ITEMS_PER_PAGE)
|
||||
const [pageLimit, setPageLimit] = useState(() => Number(localStorage.getItem('executionsPageSize') || DEFAULT_ITEMS_PER_PAGE))
|
||||
const [total, setTotal] = useState(0)
|
||||
const onChange = (page, pageLimit) => {
|
||||
setCurrentPage(page)
|
||||
setPageLimit(pageLimit)
|
||||
localStorage.setItem('executionsPageSize', pageLimit)
|
||||
applyFilters(page, pageLimit)
|
||||
}
|
||||
|
||||
|
||||
@@ -1,22 +1,22 @@
|
||||
import { useEffect, useState } from 'react'
|
||||
import { useNavigate } from 'react-router-dom'
|
||||
import { useSelector } from 'react-redux'
|
||||
import { useNavigate } from 'react-router-dom'
|
||||
|
||||
// material-ui
|
||||
import { Chip, Box, Stack, ToggleButton, ToggleButtonGroup, IconButton } from '@mui/material'
|
||||
import { Box, Chip, IconButton, Stack, ToggleButton, ToggleButtonGroup } from '@mui/material'
|
||||
import { useTheme } from '@mui/material/styles'
|
||||
|
||||
// project imports
|
||||
import MainCard from '@/ui-component/cards/MainCard'
|
||||
import ItemCard from '@/ui-component/cards/ItemCard'
|
||||
import { gridSpacing } from '@/store/constant'
|
||||
import AgentsEmptySVG from '@/assets/images/agents_empty.svg'
|
||||
import ConfirmDialog from '@/ui-component/dialog/ConfirmDialog'
|
||||
import { FlowListTable } from '@/ui-component/table/FlowListTable'
|
||||
import ViewHeader from '@/layout/MainLayout/ViewHeader'
|
||||
import ErrorBoundary from '@/ErrorBoundary'
|
||||
import ViewHeader from '@/layout/MainLayout/ViewHeader'
|
||||
import { gridSpacing } from '@/store/constant'
|
||||
import { StyledPermissionButton } from '@/ui-component/button/RBACButtons'
|
||||
import ItemCard from '@/ui-component/cards/ItemCard'
|
||||
import MainCard from '@/ui-component/cards/MainCard'
|
||||
import ConfirmDialog from '@/ui-component/dialog/ConfirmDialog'
|
||||
import TablePagination, { DEFAULT_ITEMS_PER_PAGE } from '@/ui-component/pagination/TablePagination'
|
||||
import { FlowListTable } from '@/ui-component/table/FlowListTable'
|
||||
|
||||
// API
|
||||
import chatflowsApi from '@/api/chatflows'
|
||||
@@ -25,11 +25,11 @@ import chatflowsApi from '@/api/chatflows'
|
||||
import useApi from '@/hooks/useApi'
|
||||
|
||||
// const
|
||||
import { baseURL, AGENTFLOW_ICONS } from '@/store/constant'
|
||||
import { AGENTFLOW_ICONS, baseURL } from '@/store/constant'
|
||||
import { useError } from '@/store/context/ErrorContext'
|
||||
|
||||
// icons
|
||||
import { IconPlus, IconLayoutGrid, IconList, IconX, IconAlertTriangle } from '@tabler/icons-react'
|
||||
import { IconAlertTriangle, IconLayoutGrid, IconList, IconPlus, IconX } from '@tabler/icons-react'
|
||||
|
||||
// ==============================|| AGENTS ||============================== //
|
||||
|
||||
@@ -45,18 +45,19 @@ const Agentflows = () => {
|
||||
const { error, setError } = useError()
|
||||
|
||||
const getAllAgentflows = useApi(chatflowsApi.getAllAgentflows)
|
||||
const [view, setView] = useState(localStorage.getItem('flowDisplayStyle') || 'card')
|
||||
const [view, setView] = useState(localStorage.getItem('agentFlowDisplayStyle') || 'card')
|
||||
const [agentflowVersion, setAgentflowVersion] = useState(localStorage.getItem('agentFlowVersion') || 'v2')
|
||||
const [showDeprecationNotice, setShowDeprecationNotice] = useState(true)
|
||||
|
||||
/* Table Pagination */
|
||||
const [currentPage, setCurrentPage] = useState(1)
|
||||
const [pageLimit, setPageLimit] = useState(DEFAULT_ITEMS_PER_PAGE)
|
||||
const [pageLimit, setPageLimit] = useState(() => Number(localStorage.getItem('agentFlowPageSize') || DEFAULT_ITEMS_PER_PAGE))
|
||||
const [total, setTotal] = useState(0)
|
||||
|
||||
const onChange = (page, pageLimit) => {
|
||||
setCurrentPage(page)
|
||||
setPageLimit(pageLimit)
|
||||
localStorage.setItem('agentFlowPageSize', pageLimit)
|
||||
refresh(page, pageLimit, agentflowVersion)
|
||||
}
|
||||
|
||||
@@ -70,7 +71,7 @@ const Agentflows = () => {
|
||||
|
||||
const handleChange = (event, nextView) => {
|
||||
if (nextView === null) return
|
||||
localStorage.setItem('flowDisplayStyle', nextView)
|
||||
localStorage.setItem('agentFlowDisplayStyle', nextView)
|
||||
setView(nextView)
|
||||
}
|
||||
|
||||
|
||||
@@ -6,16 +6,16 @@ import { Box, Skeleton, Stack, ToggleButton, ToggleButtonGroup } from '@mui/mate
|
||||
import { useTheme } from '@mui/material/styles'
|
||||
|
||||
// project imports
|
||||
import MainCard from '@/ui-component/cards/MainCard'
|
||||
import ItemCard from '@/ui-component/cards/ItemCard'
|
||||
import { gridSpacing } from '@/store/constant'
|
||||
import WorkflowEmptySVG from '@/assets/images/workflow_empty.svg'
|
||||
import ConfirmDialog from '@/ui-component/dialog/ConfirmDialog'
|
||||
import { FlowListTable } from '@/ui-component/table/FlowListTable'
|
||||
import { StyledPermissionButton } from '@/ui-component/button/RBACButtons'
|
||||
import ViewHeader from '@/layout/MainLayout/ViewHeader'
|
||||
import ErrorBoundary from '@/ErrorBoundary'
|
||||
import ViewHeader from '@/layout/MainLayout/ViewHeader'
|
||||
import { gridSpacing } from '@/store/constant'
|
||||
import { StyledPermissionButton } from '@/ui-component/button/RBACButtons'
|
||||
import ItemCard from '@/ui-component/cards/ItemCard'
|
||||
import MainCard from '@/ui-component/cards/MainCard'
|
||||
import ConfirmDialog from '@/ui-component/dialog/ConfirmDialog'
|
||||
import TablePagination, { DEFAULT_ITEMS_PER_PAGE } from '@/ui-component/pagination/TablePagination'
|
||||
import { FlowListTable } from '@/ui-component/table/FlowListTable'
|
||||
|
||||
// API
|
||||
import chatflowsApi from '@/api/chatflows'
|
||||
@@ -28,7 +28,7 @@ import { baseURL } from '@/store/constant'
|
||||
import { useError } from '@/store/context/ErrorContext'
|
||||
|
||||
// icons
|
||||
import { IconPlus, IconLayoutGrid, IconList } from '@tabler/icons-react'
|
||||
import { IconLayoutGrid, IconList, IconPlus } from '@tabler/icons-react'
|
||||
|
||||
// ==============================|| CHATFLOWS ||============================== //
|
||||
|
||||
@@ -42,16 +42,17 @@ const Chatflows = () => {
|
||||
const { error, setError } = useError()
|
||||
|
||||
const getAllChatflowsApi = useApi(chatflowsApi.getAllChatflows)
|
||||
const [view, setView] = useState(localStorage.getItem('flowDisplayStyle') || 'card')
|
||||
const [view, setView] = useState(localStorage.getItem('chatFlowDisplayStyle') || 'card')
|
||||
|
||||
/* Table Pagination */
|
||||
const [currentPage, setCurrentPage] = useState(1)
|
||||
const [pageLimit, setPageLimit] = useState(DEFAULT_ITEMS_PER_PAGE)
|
||||
const [pageLimit, setPageLimit] = useState(() => Number(localStorage.getItem('chatFlowPageSize') || DEFAULT_ITEMS_PER_PAGE))
|
||||
const [total, setTotal] = useState(0)
|
||||
|
||||
const onChange = (page, pageLimit) => {
|
||||
setCurrentPage(page)
|
||||
setPageLimit(pageLimit)
|
||||
localStorage.setItem('chatFlowPageSize', pageLimit)
|
||||
applyFilters(page, pageLimit)
|
||||
}
|
||||
|
||||
@@ -65,7 +66,7 @@ const Chatflows = () => {
|
||||
|
||||
const handleChange = (event, nextView) => {
|
||||
if (nextView === null) return
|
||||
localStorage.setItem('flowDisplayStyle', nextView)
|
||||
localStorage.setItem('chatFlowDisplayStyle', nextView)
|
||||
setView(nextView)
|
||||
}
|
||||
|
||||
|
||||
@@ -7,21 +7,21 @@ import { useTheme } from '@mui/material/styles'
|
||||
|
||||
// project imports
|
||||
import ErrorBoundary from '@/ErrorBoundary'
|
||||
import ViewHeader from '@/layout/MainLayout/ViewHeader'
|
||||
import { useError } from '@/store/context/ErrorContext'
|
||||
import { StyledPermissionButton } from '@/ui-component/button/RBACButtons'
|
||||
import DocumentStoreCard from '@/ui-component/cards/DocumentStoreCard'
|
||||
import MainCard from '@/ui-component/cards/MainCard'
|
||||
import TablePagination, { DEFAULT_ITEMS_PER_PAGE } from '@/ui-component/pagination/TablePagination'
|
||||
import DocumentStoreCard from '@/ui-component/cards/DocumentStoreCard'
|
||||
import AddDocStoreDialog from '@/views/docstore/AddDocStoreDialog'
|
||||
import ViewHeader from '@/layout/MainLayout/ViewHeader'
|
||||
import { StyledPermissionButton } from '@/ui-component/button/RBACButtons'
|
||||
|
||||
// API
|
||||
import useApi from '@/hooks/useApi'
|
||||
import documentsApi from '@/api/documentstore'
|
||||
import useApi from '@/hooks/useApi'
|
||||
|
||||
// icons
|
||||
import { IconPlus, IconLayoutGrid, IconList } from '@tabler/icons-react'
|
||||
import doc_store_empty from '@/assets/images/doc_store_empty.svg'
|
||||
import { IconLayoutGrid, IconList, IconPlus } from '@tabler/icons-react'
|
||||
|
||||
// const
|
||||
import { baseURL, gridSpacing } from '@/store/constant'
|
||||
@@ -88,11 +88,12 @@ const Documents = () => {
|
||||
|
||||
/* Table Pagination */
|
||||
const [currentPage, setCurrentPage] = useState(1)
|
||||
const [pageLimit, setPageLimit] = useState(DEFAULT_ITEMS_PER_PAGE)
|
||||
const [pageLimit, setPageLimit] = useState(() => Number(localStorage.getItem('docStorePageSize') || DEFAULT_ITEMS_PER_PAGE))
|
||||
const [total, setTotal] = useState(0)
|
||||
const onChange = (page, pageLimit) => {
|
||||
setCurrentPage(page)
|
||||
setPageLimit(pageLimit)
|
||||
localStorage.setItem('docStorePageSize', pageLimit)
|
||||
applyFilters(page, pageLimit)
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user