Table: Improve code readability (#94690)

feat(table): improve code radability
This commit is contained in:
Ihor Yeromin 2024-10-14 18:57:19 +02:00 committed by GitHub
parent e48351fbd3
commit bcf62612f3
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 11 additions and 3 deletions

View File

@ -44,6 +44,7 @@ export const Table = memo((props: Props) => {
data, data,
height, height,
onCellFilterAdded, onCellFilterAdded,
onColumnResize,
width, width,
columnMinWidth = COLUMN_MIN_WIDTH, columnMinWidth = COLUMN_MIN_WIDTH,
noHeader, noHeader,
@ -128,7 +129,7 @@ export const Table = memo((props: Props) => {
// Internal react table state reducer // Internal react table state reducer
const stateReducer = useTableStateReducer({ const stateReducer = useTableStateReducer({
...props, onColumnResize,
onSortByChange: (state) => { onSortByChange: (state) => {
// Collapse all rows. This prevents a known bug that causes the size of the rows to be incorrect due to // Collapse all rows. This prevents a known bug that causes the size of the rows to be incorrect due to
// using `VariableSizeList` and `useExpanded` together. // using `VariableSizeList` and `useExpanded` together.
@ -138,6 +139,7 @@ export const Table = memo((props: Props) => {
props.onSortByChange(state); props.onSortByChange(state);
} }
}, },
data,
}); });
const hasUniqueId = !!data.meta?.uniqueRowIdFields?.length; const hasUniqueId = !!data.meta?.uniqueRowIdFields?.length;

View File

@ -2,14 +2,14 @@ import { useCallback } from 'react';
import { getFieldDisplayName } from '@grafana/data'; import { getFieldDisplayName } from '@grafana/data';
import { TableSortByFieldState, GrafanaTableColumn, GrafanaTableState, Props } from './types'; import { TableSortByFieldState, GrafanaTableColumn, GrafanaTableState, TableStateReducerProps, Props } from './types';
export interface ActionType { export interface ActionType {
type: string; type: string;
id: string | undefined; id: string | undefined;
} }
export function useTableStateReducer({ onColumnResize, onSortByChange, data }: Props) { export function useTableStateReducer({ onColumnResize, onSortByChange, data }: TableStateReducerProps) {
return useCallback( return useCallback(
(newState: GrafanaTableState, action: ActionType) => { (newState: GrafanaTableState, action: ActionType) => {
switch (action.type) { switch (action.type) {

View File

@ -75,6 +75,12 @@ export interface GrafanaTableState extends TableState {
export interface GrafanaTableRow extends Row, UseExpandedRowProps<{}> {} export interface GrafanaTableRow extends Row, UseExpandedRowProps<{}> {}
export interface TableStateReducerProps {
onColumnResize?: TableColumnResizeActionCallback;
onSortByChange?: TableSortByActionCallback;
data: DataFrame;
}
export interface Props { export interface Props {
ariaLabel?: string; ariaLabel?: string;
data: DataFrame; data: DataFrame;