Skip to content

Commit 24e713b

Browse files
authored
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.
1 parent 6412c20 commit 24e713b

4 files changed

Lines changed: 46 additions & 42 deletions

File tree

packages/ui/src/views/agentexecutions/index.jsx

Lines changed: 13 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -5,44 +5,44 @@ import 'react-datepicker/dist/react-datepicker.css'
55
// material-ui
66
import {
77
Box,
8-
Stack,
9-
TextField,
10-
MenuItem,
118
Button,
12-
Grid,
13-
FormControl,
14-
InputLabel,
15-
Select,
169
Dialog,
1710
DialogActions,
1811
DialogContent,
1912
DialogContentText,
2013
DialogTitle,
14+
FormControl,
15+
Grid,
2116
IconButton,
17+
InputLabel,
18+
MenuItem,
19+
Select,
20+
Stack,
21+
TextField,
2222
Tooltip,
2323
useTheme
2424
} from '@mui/material'
2525

2626
// project imports
27-
import MainCard from '@/ui-component/cards/MainCard'
2827
import ErrorBoundary from '@/ErrorBoundary'
2928
import ViewHeader from '@/layout/MainLayout/ViewHeader'
29+
import MainCard from '@/ui-component/cards/MainCard'
3030
import { Available } from '@/ui-component/rbac/available'
3131

3232
// API
33-
import useApi from '@/hooks/useApi'
3433
import executionsApi from '@/api/executions'
34+
import useApi from '@/hooks/useApi'
3535
import { useSelector } from 'react-redux'
3636

3737
// icons
3838
import execution_empty from '@/assets/images/executions_empty.svg'
3939
import { IconTrash } from '@tabler/icons-react'
4040

4141
// const
42+
import TablePagination, { DEFAULT_ITEMS_PER_PAGE } from '@/ui-component/pagination/TablePagination'
4243
import { ExecutionsListTable } from '@/ui-component/table/ExecutionsListTable'
43-
import { ExecutionDetails } from './ExecutionDetails'
4444
import { omit } from 'lodash'
45-
import TablePagination, { DEFAULT_ITEMS_PER_PAGE } from '@/ui-component/pagination/TablePagination'
45+
import { ExecutionDetails } from './ExecutionDetails'
4646

4747
// ==============================|| AGENT EXECUTIONS ||============================== //
4848

@@ -91,11 +91,12 @@ const AgentExecutions = () => {
9191

9292
/* Table Pagination */
9393
const [currentPage, setCurrentPage] = useState(1)
94-
const [pageLimit, setPageLimit] = useState(DEFAULT_ITEMS_PER_PAGE)
94+
const [pageLimit, setPageLimit] = useState(() => Number(localStorage.getItem('executionsPageSize') || DEFAULT_ITEMS_PER_PAGE))
9595
const [total, setTotal] = useState(0)
9696
const onChange = (page, pageLimit) => {
9797
setCurrentPage(page)
9898
setPageLimit(pageLimit)
99+
localStorage.setItem('executionsPageSize', pageLimit)
99100
applyFilters(page, pageLimit)
100101
}
101102

packages/ui/src/views/agentflows/index.jsx

Lines changed: 14 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,22 @@
11
import { useEffect, useState } from 'react'
2-
import { useNavigate } from 'react-router-dom'
32
import { useSelector } from 'react-redux'
3+
import { useNavigate } from 'react-router-dom'
44

55
// material-ui
6-
import { Chip, Box, Stack, ToggleButton, ToggleButtonGroup, IconButton } from '@mui/material'
6+
import { Box, Chip, IconButton, Stack, ToggleButton, ToggleButtonGroup } from '@mui/material'
77
import { useTheme } from '@mui/material/styles'
88

99
// project imports
10-
import MainCard from '@/ui-component/cards/MainCard'
11-
import ItemCard from '@/ui-component/cards/ItemCard'
12-
import { gridSpacing } from '@/store/constant'
1310
import AgentsEmptySVG from '@/assets/images/agents_empty.svg'
14-
import ConfirmDialog from '@/ui-component/dialog/ConfirmDialog'
15-
import { FlowListTable } from '@/ui-component/table/FlowListTable'
16-
import ViewHeader from '@/layout/MainLayout/ViewHeader'
1711
import ErrorBoundary from '@/ErrorBoundary'
12+
import ViewHeader from '@/layout/MainLayout/ViewHeader'
13+
import { gridSpacing } from '@/store/constant'
1814
import { StyledPermissionButton } from '@/ui-component/button/RBACButtons'
15+
import ItemCard from '@/ui-component/cards/ItemCard'
16+
import MainCard from '@/ui-component/cards/MainCard'
17+
import ConfirmDialog from '@/ui-component/dialog/ConfirmDialog'
1918
import TablePagination, { DEFAULT_ITEMS_PER_PAGE } from '@/ui-component/pagination/TablePagination'
19+
import { FlowListTable } from '@/ui-component/table/FlowListTable'
2020

2121
// API
2222
import chatflowsApi from '@/api/chatflows'
@@ -25,11 +25,11 @@ import chatflowsApi from '@/api/chatflows'
2525
import useApi from '@/hooks/useApi'
2626

2727
// const
28-
import { baseURL, AGENTFLOW_ICONS } from '@/store/constant'
28+
import { AGENTFLOW_ICONS, baseURL } from '@/store/constant'
2929
import { useError } from '@/store/context/ErrorContext'
3030

3131
// icons
32-
import { IconPlus, IconLayoutGrid, IconList, IconX, IconAlertTriangle } from '@tabler/icons-react'
32+
import { IconAlertTriangle, IconLayoutGrid, IconList, IconPlus, IconX } from '@tabler/icons-react'
3333

3434
// ==============================|| AGENTS ||============================== //
3535

@@ -45,18 +45,19 @@ const Agentflows = () => {
4545
const { error, setError } = useError()
4646

4747
const getAllAgentflows = useApi(chatflowsApi.getAllAgentflows)
48-
const [view, setView] = useState(localStorage.getItem('flowDisplayStyle') || 'card')
48+
const [view, setView] = useState(localStorage.getItem('agentFlowDisplayStyle') || 'card')
4949
const [agentflowVersion, setAgentflowVersion] = useState(localStorage.getItem('agentFlowVersion') || 'v2')
5050
const [showDeprecationNotice, setShowDeprecationNotice] = useState(true)
5151

5252
/* Table Pagination */
5353
const [currentPage, setCurrentPage] = useState(1)
54-
const [pageLimit, setPageLimit] = useState(DEFAULT_ITEMS_PER_PAGE)
54+
const [pageLimit, setPageLimit] = useState(() => Number(localStorage.getItem('agentFlowPageSize') || DEFAULT_ITEMS_PER_PAGE))
5555
const [total, setTotal] = useState(0)
5656

5757
const onChange = (page, pageLimit) => {
5858
setCurrentPage(page)
5959
setPageLimit(pageLimit)
60+
localStorage.setItem('agentFlowPageSize', pageLimit)
6061
refresh(page, pageLimit, agentflowVersion)
6162
}
6263

@@ -70,7 +71,7 @@ const Agentflows = () => {
7071

7172
const handleChange = (event, nextView) => {
7273
if (nextView === null) return
73-
localStorage.setItem('flowDisplayStyle', nextView)
74+
localStorage.setItem('agentFlowDisplayStyle', nextView)
7475
setView(nextView)
7576
}
7677

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

Lines changed: 12 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -6,16 +6,16 @@ import { Box, Skeleton, Stack, ToggleButton, ToggleButtonGroup } from '@mui/mate
66
import { useTheme } from '@mui/material/styles'
77

88
// project imports
9-
import MainCard from '@/ui-component/cards/MainCard'
10-
import ItemCard from '@/ui-component/cards/ItemCard'
11-
import { gridSpacing } from '@/store/constant'
129
import WorkflowEmptySVG from '@/assets/images/workflow_empty.svg'
13-
import ConfirmDialog from '@/ui-component/dialog/ConfirmDialog'
14-
import { FlowListTable } from '@/ui-component/table/FlowListTable'
15-
import { StyledPermissionButton } from '@/ui-component/button/RBACButtons'
16-
import ViewHeader from '@/layout/MainLayout/ViewHeader'
1710
import ErrorBoundary from '@/ErrorBoundary'
11+
import ViewHeader from '@/layout/MainLayout/ViewHeader'
12+
import { gridSpacing } from '@/store/constant'
13+
import { StyledPermissionButton } from '@/ui-component/button/RBACButtons'
14+
import ItemCard from '@/ui-component/cards/ItemCard'
15+
import MainCard from '@/ui-component/cards/MainCard'
16+
import ConfirmDialog from '@/ui-component/dialog/ConfirmDialog'
1817
import TablePagination, { DEFAULT_ITEMS_PER_PAGE } from '@/ui-component/pagination/TablePagination'
18+
import { FlowListTable } from '@/ui-component/table/FlowListTable'
1919

2020
// API
2121
import chatflowsApi from '@/api/chatflows'
@@ -28,7 +28,7 @@ import { baseURL } from '@/store/constant'
2828
import { useError } from '@/store/context/ErrorContext'
2929

3030
// icons
31-
import { IconPlus, IconLayoutGrid, IconList } from '@tabler/icons-react'
31+
import { IconLayoutGrid, IconList, IconPlus } from '@tabler/icons-react'
3232

3333
// ==============================|| CHATFLOWS ||============================== //
3434

@@ -42,16 +42,17 @@ const Chatflows = () => {
4242
const { error, setError } = useError()
4343

4444
const getAllChatflowsApi = useApi(chatflowsApi.getAllChatflows)
45-
const [view, setView] = useState(localStorage.getItem('flowDisplayStyle') || 'card')
45+
const [view, setView] = useState(localStorage.getItem('chatFlowDisplayStyle') || 'card')
4646

4747
/* Table Pagination */
4848
const [currentPage, setCurrentPage] = useState(1)
49-
const [pageLimit, setPageLimit] = useState(DEFAULT_ITEMS_PER_PAGE)
49+
const [pageLimit, setPageLimit] = useState(() => Number(localStorage.getItem('chatFlowPageSize') || DEFAULT_ITEMS_PER_PAGE))
5050
const [total, setTotal] = useState(0)
5151

5252
const onChange = (page, pageLimit) => {
5353
setCurrentPage(page)
5454
setPageLimit(pageLimit)
55+
localStorage.setItem('chatFlowPageSize', pageLimit)
5556
applyFilters(page, pageLimit)
5657
}
5758

@@ -65,7 +66,7 @@ const Chatflows = () => {
6566

6667
const handleChange = (event, nextView) => {
6768
if (nextView === null) return
68-
localStorage.setItem('flowDisplayStyle', nextView)
69+
localStorage.setItem('chatFlowDisplayStyle', nextView)
6970
setView(nextView)
7071
}
7172

packages/ui/src/views/docstore/index.jsx

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,21 +7,21 @@ import { useTheme } from '@mui/material/styles'
77

88
// project imports
99
import ErrorBoundary from '@/ErrorBoundary'
10+
import ViewHeader from '@/layout/MainLayout/ViewHeader'
1011
import { useError } from '@/store/context/ErrorContext'
12+
import { StyledPermissionButton } from '@/ui-component/button/RBACButtons'
13+
import DocumentStoreCard from '@/ui-component/cards/DocumentStoreCard'
1114
import MainCard from '@/ui-component/cards/MainCard'
1215
import TablePagination, { DEFAULT_ITEMS_PER_PAGE } from '@/ui-component/pagination/TablePagination'
13-
import DocumentStoreCard from '@/ui-component/cards/DocumentStoreCard'
1416
import AddDocStoreDialog from '@/views/docstore/AddDocStoreDialog'
15-
import ViewHeader from '@/layout/MainLayout/ViewHeader'
16-
import { StyledPermissionButton } from '@/ui-component/button/RBACButtons'
1717

1818
// API
19-
import useApi from '@/hooks/useApi'
2019
import documentsApi from '@/api/documentstore'
20+
import useApi from '@/hooks/useApi'
2121

2222
// icons
23-
import { IconPlus, IconLayoutGrid, IconList } from '@tabler/icons-react'
2423
import doc_store_empty from '@/assets/images/doc_store_empty.svg'
24+
import { IconLayoutGrid, IconList, IconPlus } from '@tabler/icons-react'
2525

2626
// const
2727
import { baseURL, gridSpacing } from '@/store/constant'
@@ -88,11 +88,12 @@ const Documents = () => {
8888

8989
/* Table Pagination */
9090
const [currentPage, setCurrentPage] = useState(1)
91-
const [pageLimit, setPageLimit] = useState(DEFAULT_ITEMS_PER_PAGE)
91+
const [pageLimit, setPageLimit] = useState(() => Number(localStorage.getItem('docStorePageSize') || DEFAULT_ITEMS_PER_PAGE))
9292
const [total, setTotal] = useState(0)
9393
const onChange = (page, pageLimit) => {
9494
setCurrentPage(page)
9595
setPageLimit(pageLimit)
96+
localStorage.setItem('docStorePageSize', pageLimit)
9697
applyFilters(page, pageLimit)
9798
}
9899

0 commit comments

Comments
 (0)