fix: (regression beta) admin/logs: missing first/last buttons
Massimo Melina committed
Feb 10, 2024 at 10:37 UTC
02ab8e871860d6dc6bb29bc840441b235d1f85ec
4 files changed
+11
-12
admin/src/ArrayField.ts
+1
-1
@@ -30,7 +30,7 @@ export function ArrayField<T extends object>({ label, helperText, fields, value,
30
sx: { '.MuiDataGrid-virtualScroller': { minHeight: '3em' } },
31
hideFooterSelectedRowCount: true,
32
hideFooter: true,
33
- componentsProps: {
33
+ slotProps: {
34
pagination: {
35
showFirstButton: true,
36
showLastButton: true,
admin/src/DataTable.ts
+8
-3
@@ -5,7 +5,7 @@ import { useWindowSize } from 'usehooks-ts'
5
import { createElement as h, Fragment, ReactNode, useEffect, useMemo, useRef, useState } from 'react'
6
import { newDialog, onlyTruthy } from '@hfs/shared'
7
import _ from 'lodash'
8
-import { Center, Flex } from './mui'
8
+import { Center, Flex, useBreakpoint } from './mui'
9
10
const ACTIONS = 'Actions'
11
@@ -99,6 +99,7 @@ export function DataTable({ columns, initialState={}, actions, actionsProps, ini
99
const { current: { id, setCurRow } } = displayingDetails
100
setCurRow?.(_.find(rest.rows, { id }))
101
})
102
+ const sm = useBreakpoint('sm')
103
104
if (!hideCols) // only first time we render, initialState is considered, so wait
105
return null
@@ -120,7 +121,11 @@ export function DataTable({ columns, initialState={}, actions, actionsProps, ini
121
footer: CustomFooter,
122
},
123
slotProps: {
123
- footer: { add: addToFooter } as any
124
+ footer: { add: addToFooter } as any,
125
+ pagination: !sm && addToFooter ? undefined : {
126
+ showFirstButton: true,
127
+ showLastButton: true,
128
+ },
129
},
130
onCellClick({ field, row }) {
131
if (field === ACTIONS) return
@@ -177,5 +182,5 @@ export function DataTable({ columns, initialState={}, actions, actionsProps, ini
182
}
183
184
function CustomFooter({ add, ...props }: { add: ReactNode }) {
180
- return h(GridFooterContainer, props, h(Box, { ml: 1 }, add), h(GridFooter, { sx: { border: 'none' } }))
185
+ return h(GridFooterContainer, props, h(Box, { ml: { sm: 1 } }, add), h(GridFooter, { sx: { border: 'none' } }))
186
}
admin/src/LogsPage.ts
+1
-7
@@ -145,19 +145,13 @@ function LogFile({ file, addToFooter, hidden }: { hidden?: boolean, file: string
145
loading: connecting,
146
rows,
147
compact: true,
148
- componentsProps: {
149
- pagination: {
150
- showFirstButton: true,
151
- showLastButton: true,
152
- }
153
- },
148
addToFooter: h(Box, {}, // 4 icons don't fit the tabs row on mobile
149
pauseButton,
150
showApiButton,
151
!connecting && skipped > 0 && h(Btn, {
152
icon: ClearAll,
153
variant: 'outlined',
160
- sx: { ml: 1 },
154
+ sx: { ml: { sm: 1 } },
155
labelFrom: 'md',
156
title: `Only ${formatBytes(MAX)} was loaded, for speed. Total size is ${formatBytes(totalSize)}`,
157
loading: !limited,
admin/src/mui.ts
+1
-1
@@ -200,7 +200,7 @@ export const Btn = forwardRef(({ icon, title, onClick, disabled, progress, link,
200
...rest.sx,
201
...!showLabel && {
202
minWidth: 'auto',
203
- px: 2,
203
+ px: 1,
204
py: '7px',
205
'& span': { mx:0 },
206
}