DenozordecandCursor
357ed4ce7b
Updated various dashboard components to improve layout and responsiveness. Adjusted class names to include 'min-w-0' for better handling of overflow and added flex properties to ensure proper alignment. Refined grid structures and skeleton loading states for a more cohesive user experience. Co-authored-by: Cursor <[email protected]>
81 lines
2.4 KiB
TypeScript
81 lines
2.4 KiB
TypeScript
import {
|
||
getCoreRowModel,
|
||
getFilteredRowModel,
|
||
getPaginationRowModel,
|
||
getSortedRowModel,
|
||
type FilterFn,
|
||
type TableOptions,
|
||
} from '@tanstack/react-table'
|
||
|
||
import type { DataGridProps } from '@/components/reui/data-grid/data-grid'
|
||
|
||
export const DATA_GRID_TABLE_LAYOUT: NonNullable<DataGridProps<object>['tableLayout']> = {
|
||
dense: false,
|
||
headerSticky: true,
|
||
rowBorder: true,
|
||
}
|
||
|
||
/** REUI c-data-grid-19 edge cell padding. */
|
||
export const DATA_GRID_TABLE_CLASS_NAMES: NonNullable<DataGridProps<object>['tableClassNames']> = {
|
||
edgeCell: 'px-5',
|
||
}
|
||
|
||
export const DATA_GRID_PAGINATION_RU = {
|
||
sizes: [10, 25, 50] as number[],
|
||
sizesLabel: 'Показать',
|
||
sizesDescription: 'на странице',
|
||
info: '{from}–{to} из {count}',
|
||
rowsPerPageLabel: 'Строк на странице',
|
||
previousPageLabel: 'Предыдущая страница',
|
||
nextPageLabel: 'Следующая страница',
|
||
}
|
||
|
||
export const DATA_GRID_MESSAGES_RU = {
|
||
emptyMessage: 'Нет данных',
|
||
loadingMessage: 'Загрузка…',
|
||
fetchingMoreMessage: 'Загрузка…',
|
||
selectAllLabel: 'Выбрать все',
|
||
selectRowLabel: 'Выбрать строку',
|
||
pinRowLabel: 'Закрепить строку',
|
||
unpinRowLabel: 'Открепить строку',
|
||
allRecordsLoadedMessage: 'Все записи загружены',
|
||
}
|
||
|
||
export const DATA_GRID_DENSE_LAYOUT: NonNullable<DataGridProps<object>['tableLayout']> = {
|
||
...DATA_GRID_TABLE_LAYOUT,
|
||
dense: true,
|
||
width: 'auto',
|
||
}
|
||
|
||
export function createTextGlobalFilter<TData extends object>(
|
||
getSearchText: (row: TData) => string,
|
||
): FilterFn<TData> {
|
||
return (row, _columnId, filterValue) => {
|
||
const query = String(filterValue ?? '')
|
||
.toLowerCase()
|
||
.trim()
|
||
if (!query) return true
|
||
return getSearchText(row.original).toLowerCase().includes(query)
|
||
}
|
||
}
|
||
|
||
export function createClientDataGridOptions<TData extends object>(
|
||
overrides?: Partial<TableOptions<TData>>,
|
||
): Pick<
|
||
TableOptions<TData>,
|
||
| 'getCoreRowModel'
|
||
| 'getFilteredRowModel'
|
||
| 'getSortedRowModel'
|
||
| 'getPaginationRowModel'
|
||
| 'initialState'
|
||
> {
|
||
return {
|
||
getCoreRowModel: getCoreRowModel(),
|
||
getFilteredRowModel: getFilteredRowModel(),
|
||
getSortedRowModel: getSortedRowModel(),
|
||
getPaginationRowModel: getPaginationRowModel(),
|
||
initialState: { pagination: { pageSize: 10 } },
|
||
...overrides,
|
||
}
|
||
}
|