@opencorestack/opengridx 2.1.0 → 3.0.1

package/lib/hooks/core/useGridHeaderHandlers.ts

@@ -0,0 +1,92 @@
+import { useCallback, useLayoutEffect, useRef } from 'react';
+import { upsertSortItem } from '../../utils/sorting';
+import { pinColumnTo } from '../../utils/pinning';
+import type {
+    GridColumnPinning,
+    GridColumnVisibilityModel,
+    GridPinnedPosition,
+    GridSortDirection,
+    GridSortItem,
+} from '../../types';
+
+/**
+ * The sort model after sorting `field` by `direction` (null removes it). `multiSort` adds or updates
+ * the column in the model (shift-click); otherwise the model is replaced by this one column. The
+ * header, the keyboard and `apiRef.sortColumn` all build the next model with this.
+ */
+export function nextSortModelForColumn(
+    current: readonly GridSortItem[],
+    field: string,
+    direction: GridSortDirection,
+    multiSort: boolean
+): GridSortItem[] {
+    if (multiSort) return upsertSortItem(current, field, direction);
+    return direction ? [{ field, sort: direction }] : current.filter(item => item.field !== field);
+}
+
+export interface UseGridSortHandlersParams {
+    sortModel: GridSortItem[];
+    /** Stores the model when uncontrolled and calls onSortModelChange (useGridControlledState). */
+    onSortModelChange: (model: GridSortItem[]) => void;
+}
+
+export interface UseGridSortHandlersResult {
+    /** Header click / Enter: replaces the sort model with this column (or clears it). */
+    handleSort: (field: string, direction: GridSortDirection) => void;
+    /** Shift-click / Shift+Enter: adds, updates or removes this column in the sort model. */
+    handleSortAdd: (field: string, direction: GridSortDirection) => void;
+}
+
+/** Sort changes from the header and the keyboard; the same transition and handler as apiRef.sortColumn. */
+export function useGridSortHandlers(params: UseGridSortHandlersParams): UseGridSortHandlersResult {
+    const { sortModel, onSortModelChange } = params;
+
+    const handleSort = useCallback((field: string, direction: GridSortDirection) => {
+        onSortModelChange(nextSortModelForColumn(sortModel, field, direction, false));
+    }, [sortModel, onSortModelChange]);
+
+    const handleSortAdd = useCallback((field: string, direction: GridSortDirection) => {
+        onSortModelChange(nextSortModelForColumn(sortModel, field, direction, true));
+    }, [sortModel, onSortModelChange]);
+
+    return { handleSort, handleSortAdd };
+}
+
+export interface UseGridColumnMenuHandlersParams {
+    columnVisibilityModel: GridColumnVisibilityModel;
+    onColumnVisibilityModelChange: (model: GridColumnVisibilityModel) => void;
+    pinnedColumns: GridColumnPinning;
+    onPinnedColumnsChange: (model: GridColumnPinning) => void;
+}
+
+export interface UseGridColumnMenuHandlersResult {
+    handleHideColumn: (field: string) => void;
+    handlePinColumn: (field: string, side: GridPinnedPosition | null) => void;
+}
+
+/**
+ * The column menu's Hide and Pin actions. Each builds on the latest model, including a change made
+ * earlier in the same tick, so two hides (or pins) before a re-render both stick.
+ */
+export function useGridColumnMenuHandlers(params: UseGridColumnMenuHandlersParams): UseGridColumnMenuHandlersResult {
+    const { columnVisibilityModel, onColumnVisibilityModelChange, pinnedColumns, onPinnedColumnsChange } = params;
+
+    const latestRef = useRef({ columnVisibilityModel, pinnedColumns });
+    useLayoutEffect(() => {
+        latestRef.current = { columnVisibilityModel, pinnedColumns };
+    });
+
+    const handleHideColumn = useCallback((field: string) => {
+        const next = { ...latestRef.current.columnVisibilityModel, [field]: false };
+        latestRef.current = { ...latestRef.current, columnVisibilityModel: next };
+        onColumnVisibilityModelChange(next);
+    }, [onColumnVisibilityModelChange]);
+
+    const handlePinColumn = useCallback((field: string, side: GridPinnedPosition | null) => {
+        const next = pinColumnTo(latestRef.current.pinnedColumns, field, side);
+        latestRef.current = { ...latestRef.current, pinnedColumns: next };
+        onPinnedColumnsChange(next);
+    }, [onPinnedColumnsChange]);
+
+    return { handleHideColumn, handlePinColumn };
+}

package/lib/hooks/core/useGridHierarchy.ts

@@ -0,0 +1,81 @@
+import { useMemo } from 'react';
+import { useTreeData } from '../useTreeData';
+import { useRowGrouping, type UseRowGroupingParams } from '../useRowGrouping';
+import type { GridRowGroupingModel, GridRowId, GridRowMeta, GridRowModel } from '../../types';
+
+const EMPTY_ROW_META_MAP: Map<GridRowId, GridRowMeta> = new Map();
+
+export interface UseGridHierarchyParams<R extends GridRowModel> extends Pick<
+    UseRowGroupingParams<R>,
+    | 'rows'
+    | 'getRowId'
+    | 'columns'
+    | 'aggregationModel'
+    | 'defaultGroupingExpansionDepth'
+    | 'filterModel'
+    | 'sortModel'
+    | 'getAggregationPosition'
+    | 'columnLookup'
+    | 'filterMode'
+    | 'sortingMode'
+> {
+    getTreeDataPath?: (row: R) => string[];
+    /** `treeData` asked for (see `resolveGridModes`): useTreeData warns when it cannot build the tree. */
+    isTreeDataRequested: boolean;
+    /** Tree data is built. */
+    isTreeData: boolean;
+    /** The grouping model the hierarchy is built from (empty while pivoting). */
+    rowGroupingModel: GridRowGroupingModel;
+    isRowGrouping: boolean;
+}
+
+/**
+ * Tree data and row grouping. Both hooks always run (hook order is fixed); the active one, if
+ * any, drives the rows and supplies the `rowMetaMap` every renderer reads hierarchy info from.
+ */
+export function useGridHierarchy<R extends GridRowModel>(params: UseGridHierarchyParams<R>) {
+    const {
+        rows, getRowId, getTreeDataPath, isTreeDataRequested, isTreeData, columns, rowGroupingModel, isRowGrouping,
+        aggregationModel, defaultGroupingExpansionDepth, filterModel, sortModel, getAggregationPosition,
+        columnLookup, filterMode, sortingMode,
+    } = params;
+
+    const treeDataHandlers = useTreeData({
+        rows,
+        getRowId,
+        getTreeDataPath,
+        treeData: isTreeDataRequested,
+        defaultGroupingExpansionDepth,
+        filterModel,
+
+        sortModel,
+        columnLookup,
+        filterMode,
+        sortingMode,
+    });
+
+    const rowGroupingHandlers = useRowGrouping({
+        rows,
+        getRowId,
+        columns,
+        rowGroupingModel,
+        aggregationModel,
+        defaultGroupingExpansionDepth,
+        filterModel,
+        sortModel,
+        getAggregationPosition,
+        columnLookup,
+        filterMode,
+        sortingMode,
+    });
+
+    const activeHierarchyHandlers = isTreeData ? treeDataHandlers : (isRowGrouping ? rowGroupingHandlers : null);
+
+    const rowMetaMap = useMemo<Map<GridRowId, GridRowMeta>>(() => {
+        if (isTreeData) return treeDataHandlers.rowMetaMap;
+        if (isRowGrouping) return rowGroupingHandlers.rowMetaMap;
+        return EMPTY_ROW_META_MAP;
+    }, [isTreeData, treeDataHandlers.rowMetaMap, isRowGrouping, rowGroupingHandlers.rowMetaMap]);
+
+    return { treeDataHandlers, rowGroupingHandlers, activeHierarchyHandlers, rowMetaMap };
+}