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:
Mewyii
2026-03-31 21:33:34 +08:00
committed by GitHub
parent 6412c204c8
commit 24e713b99e
4 changed files with 47 additions and 43 deletions
+14 -13
View File
@@ -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)
}
+14 -13
View File
@@ -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)
}
+12 -11
View File
@@ -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 -6
View File
@@ -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)
}