From abf9433c1076e2c92997f256f52ab4f650517539 Mon Sep 17 00:00:00 2001 From: Hein Date: Thu, 30 Oct 2025 13:04:13 +0200 Subject: [PATCH] A few fixes --- src/Gridler/GridlerDataGrid.tsx | 12 +++++++++ src/Gridler/components/GridlerStore.tsx | 16 ++++++++++-- src/Gridler/components/RefHandler.tsx | 10 ++++--- .../adaptors/GlidlerAPIAdaptorForGoLangv2.tsx | 5 ++-- .../adaptors/GlidlerFormAdaptor.tsx | 26 ++++++++++++++++++- src/Gridler/stories/Examples.goapi.tsx | 1 + src/MantineBetterMenu/MenuRenderer.tsx | 2 +- src/MantineBetterMenu/Store.tsx | 2 +- 8 files changed, 63 insertions(+), 11 deletions(-) diff --git a/src/Gridler/GridlerDataGrid.tsx b/src/Gridler/GridlerDataGrid.tsx index 50ba325..de3b537 100644 --- a/src/Gridler/GridlerDataGrid.tsx +++ b/src/Gridler/GridlerDataGrid.tsx @@ -50,6 +50,7 @@ export const GridlerDataGrid = () => { headerHeight, heightProp, mounted, + onCellActivated, onCellClicked, onCellEdited, onColumnMoved, @@ -80,6 +81,7 @@ export const GridlerDataGrid = () => { headerHeight: s.headerHeight, heightProp: s.height, mounted: s.mounted, + onCellActivated: s.onCellActivated, onCellClicked: s.onCellClicked, onCellEdited: s.onCellEdited, onColumnMoved: s.onColumnMoved, @@ -178,6 +180,7 @@ export const GridlerDataGrid = () => { gridSelection={_gridSelection} headerHeight={headerHeight ?? 32} headerIcons={{ sort: SortSprite, sortdown: SortDownSprite, sortup: SortUpSprite }} + onCellActivated={onCellActivated} onCellClicked={onCellClicked} onCellContextMenu={(cell, event) => { event.preventDefault(); @@ -219,6 +222,15 @@ export const GridlerDataGrid = () => { rows = rows.hasIndex(y) ? rows : rows.add(y); } } + if (rows.length === 0) { + for (const r of currentSelection?.rows ?? []) { + const validRowID = getRowBuffer ? getRowBuffer(r)?.[keyField] : null; + if (!validRowID) { + continue; + } + rows = rows.hasIndex(r) ? rows : rows.add(r); + } + } if ( JSON.stringify(currentSelection?.columns) !== JSON.stringify(selection.columns) || diff --git a/src/Gridler/components/GridlerStore.tsx b/src/Gridler/components/GridlerStore.tsx index 9f8d50d..fb46e1e 100644 --- a/src/Gridler/components/GridlerStore.tsx +++ b/src/Gridler/components/GridlerStore.tsx @@ -160,10 +160,11 @@ export interface GridlerState { getState: (key: K) => GridlerStoreState[K]; hasLocalData: boolean; isEmpty: boolean; - loadingData?: boolean; + loadPage: (page: number, clearMode?: 'all' | 'page') => Promise; mounted: boolean; + onCellActivated: (cell: Item) => void; onCellClicked: (cell: Item, event: CellClickedEventArgs) => void; onCellEdited: (cell: Item, newVal: EditableGridCell) => void; onColumnMoved: (from: number, to: number) => void; @@ -400,7 +401,7 @@ const { Provider, useStore: useGridlerStore } = createSyncStore { - console.warn('loadPage Error: ', page, e); + console.error('loadPage Error: ', page, e); state._events.dispatchEvent( new CustomEvent('loadPage_error', { detail: { clearMode, error: e, page: pPage, state }, @@ -411,6 +412,17 @@ const { Provider, useStore: useGridlerStore } = createSyncStore { + const state = get(); + const [col, row] = cell; + + state._events.dispatchEvent( + new CustomEvent('onCellActivated', { + detail: { cell, col, row, state }, + }) + ); + state.glideProps?.onCellActivated?.(cell); + }, onCellClicked: (cell: Item, event: CellClickedEventArgs) => { const state = get(); const [col, row] = cell; diff --git a/src/Gridler/components/RefHandler.tsx b/src/Gridler/components/RefHandler.tsx index 3270c8d..ef8be31 100644 --- a/src/Gridler/components/RefHandler.tsx +++ b/src/Gridler/components/RefHandler.tsx @@ -15,14 +15,16 @@ function _GridlerRefHandler(props: PropsWithChildren, ref: Ref | und refresh: async (parms?: any) => { const refreshCells = getstate('refreshCells'); const loadPage = getstate('loadPage'); - loadPage?.(parms?.pageIndex ?? 0, 'all'); - refreshCells?.(); + loadPage?.(parms?.pageIndex ?? 0, 'all').then(() => { + refreshCells?.(); + }); }, reload: async (parms?: any) => { const refreshCells = getstate('refreshCells'); const loadPage = getstate('loadPage'); - loadPage?.(parms?.pageIndex ?? 0, 'all'); - refreshCells?.(); + loadPage?.(parms?.pageIndex ?? 0, 'all').then(() => { + refreshCells?.(); + }); }, reloadRow: async (key: number | string) => { const refreshCells = getstate('refreshCells'); diff --git a/src/Gridler/components/adaptors/GlidlerAPIAdaptorForGoLangv2.tsx b/src/Gridler/components/adaptors/GlidlerAPIAdaptorForGoLangv2.tsx index b434096..4fffb59 100644 --- a/src/Gridler/components/adaptors/GlidlerAPIAdaptorForGoLangv2.tsx +++ b/src/Gridler/components/adaptors/GlidlerAPIAdaptorForGoLangv2.tsx @@ -174,9 +174,10 @@ function _GlidlerAPIAdaptorForGoLangv2(props: GlidlerAPIAdaptorForG ...(cv ?? []).filter((f) => f.page !== index), ]); } - } catch (e) { + // eslint-disable-next-line @typescript-eslint/no-unused-vars + } catch (_e) { //console.log('APIAdaptorGoLangv2 error', e); - addError(`Error: ${e}`, 'api', props.url); + //addError(`Error: ${e}`, 'api', props.url); } setState('loadingData', false); return []; diff --git a/src/Gridler/components/adaptors/GlidlerFormAdaptor.tsx b/src/Gridler/components/adaptors/GlidlerFormAdaptor.tsx index 764fb9f..0797dd9 100644 --- a/src/Gridler/components/adaptors/GlidlerFormAdaptor.tsx +++ b/src/Gridler/components/adaptors/GlidlerFormAdaptor.tsx @@ -14,6 +14,7 @@ import type { GridlerColumn } from '../Column'; import { type GridlerProps, type GridlerState, useGridlerStore } from '../GridlerStore'; export function GlidlerFormAdaptor(props: { + changeOnActiveClick?: boolean; descriptionField?: ((data: Record) => string) | string; getMenuItems?: GridlerProps['getMenuItems']; onReload?: () => void; @@ -23,13 +24,36 @@ export function GlidlerFormAdaptor(props: { ) => void; showDescriptionInMenu?: boolean; }) { - const [getState, mounted, setState, reload] = useGridlerStore((s) => [ + const [getState, mounted, setState, reload, _events] = useGridlerStore((s) => [ s.getState, s.mounted, s.setState, s.reload, + s._events, ]); + useEffect(() => { + if (mounted && props.changeOnActiveClick) { + const evf = (event: CustomEvent) => { + const { row, state } = event.detail; + const getRowBuffer = state.getRowBuffer as (row: number) => Record; + if (getRowBuffer) { + const rowData = getRowBuffer(row); + if (!rowData) { + return; + } + props.onRequestForm('change', rowData); + } + }; + _events?.addEventListener('onCellActivated', evf as any); + return () => { + if (evf) { + _events?.removeEventListener('onCellActivated', evf as any); + } + }; + } + }, [props.changeOnActiveClick, mounted, _events]); + const getMenuItems = useCallback( ( id: string, diff --git a/src/Gridler/stories/Examples.goapi.tsx b/src/Gridler/stories/Examples.goapi.tsx index 6f44901..65dc1d3 100644 --- a/src/Gridler/stories/Examples.goapi.tsx +++ b/src/Gridler/stories/Examples.goapi.tsx @@ -126,6 +126,7 @@ export const GridlerGoAPIExampleEventlog = () => { url={`${apiUrl}/public/process`} /> { console.log('Form requested', request, data); diff --git a/src/MantineBetterMenu/MenuRenderer.tsx b/src/MantineBetterMenu/MenuRenderer.tsx index 2115e6d..fd1aec6 100644 --- a/src/MantineBetterMenu/MenuRenderer.tsx +++ b/src/MantineBetterMenu/MenuRenderer.tsx @@ -120,7 +120,7 @@ const MenuItemRenderer = ({ children, label, ...props }: MantineBetterMenuInstan props.onClick?.(e); if (props.onClickAsync) { setLoading(true); - props.onClickAsync().finally(() => setLoading(false)); + props.onClickAsync(e).finally(() => setLoading(false)); } }} styles={{ diff --git a/src/MantineBetterMenu/Store.tsx b/src/MantineBetterMenu/Store.tsx index 72d33a4..f9e963a 100644 --- a/src/MantineBetterMenu/Store.tsx +++ b/src/MantineBetterMenu/Store.tsx @@ -22,7 +22,7 @@ export interface MantineBetterMenuInstanceItem extends Partial { items?: Array; label?: string; onClick?: (e?: React.MouseEvent) => void; - onClickAsync?: () => Promise; + onClickAsync?: (e?: React.MouseEvent) => Promise; renderer?: | ((props: MantineBetterMenuInstanceItem & Record) => ReactNode) | ReactNode;