12009185407

Committed 25 Nov 2024 11:35AM CUT coverage: 87.142% (-0.02%) from 87.16%

Build # 12009185407

Build Type

push

github

Committed by

web-flow

Commit Message

fix(NavigationLayout): add root export (#6657)

Run Details

2901 of 3864 branches covered (75.08%)

5056 of 5802 relevant lines covered (87.14%)

50139.75 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

4.0

/packages/main/src/components/AnalyticalTable/pluginHooks/useOnColumnResize.ts

'use client';

import { debounce } from '@ui5/webcomponents-react-base';
import { useEffect, useRef } from 'react';
import type { ReactTableHooks, TableInstance } from '../types/index.js';

interface useOnColumnResizeOptions {
  /**
   * If `liveUpdate` is `true`, the resize function will fire every time the width has changed depending on the `options.wait` delay.
   */
  liveUpdate?: boolean;
  /**
   * The number of milliseconds for which the calls are to be delayed. __Defaults to `100`__.
   *
   * __Note:__ If `liveUpdate` is `true`, this option has no effect.
   */
  wait?: number;
}

type useOnColumnResizeFunc = (e: { columnWidth: number; header: Record<string, any> }) => void;

/**
 * Plugin Hook that adds a callback which is fired on column resize.
 *
 * @param {event} callback Fired when the column is resized by dragging the "Resizer".
 * @param {Object=} options Additional options.
 * @param {number=} options.wait If `liveUpdate` is `true`, the resize function will fire every time the width has changed depending on the `options.wait` delay.
 * @param {boolean=} options.liveUpdate The number of milliseconds for which the calls are to be delayed. Defaults to `100`.
 */
export const useOnColumnResize = (callback: useOnColumnResizeFunc, options?: useOnColumnResizeOptions) => {
  const debouncedEvent = debounce(callback, options?.wait ?? 100);

  const useInstance = (instance: TableInstance) => {
    const { state, columns } = instance;
    const { columnResizing } = state;
    const { isResizingColumn, columnWidths } = columnResizing;
    const prevHeaderIsResizing = useRef(undefined);

    useEffect(() => {
      if (isResizingColumn && options?.liveUpdate) {
        const currentHeader = columns.find((item) => item.id === isResizingColumn);
        debouncedEvent({
          columnWidth: columnWidths[isResizingColumn],
          header: currentHeader
        });
      }
    }, [columnResizing, options?.liveUpdate, columns]);

    useEffect(() => {
      if (options?.liveUpdate) {
        return () => debouncedEvent.cancel();
      }
    }, [options?.liveUpdate]);

    useEffect(() => {
      if (!options?.liveUpdate) {
        const currentHeader = columns.find((item) => item.id === prevHeaderIsResizing.current);
        if (isResizingColumn) {
          prevHeaderIsResizing.current = isResizingColumn;
        }
        if (!isResizingColumn && prevHeaderIsResizing.current) {
          callback({
            columnWidth: columnWidths[prevHeaderIsResizing.current],
            header: currentHeader
          });
        }
      }
    }, [columnResizing, options?.liveUpdate, columns]);
  };

  const useOnColumnResizeHooks = (hooks: ReactTableHooks) => {
    hooks.useFinalInstance.push(useInstance);
  };

  useOnColumnResizeHooks.pluginName = 'useOnColumnResize';

  return useOnColumnResizeHooks;
};

1	'use client';
2
3	import { debounce } from '@ui5/webcomponents-react-base';
4	import { useEffect, useRef } from 'react';
5	import type { ReactTableHooks, TableInstance } from '../types/index.js';
6
7	interface useOnColumnResizeOptions {
8	/**
9	* If `liveUpdate` is `true`, the resize function will fire every time the width has changed depending on the `options.wait` delay.
10	*/
11	liveUpdate?: boolean;
12	/**
13	* The number of milliseconds for which the calls are to be delayed. __Defaults to `100`__.
14	*
15	* __Note:__ If `liveUpdate` is `true`, this option has no effect.
16	*/
17	wait?: number;
18	}
19
20	type useOnColumnResizeFunc = (e: { columnWidth: number; header: Record<string, any> }) => void;
21
22	/**
23	* Plugin Hook that adds a callback which is fired on column resize.
24	*
25	* @param {event} callback Fired when the column is resized by dragging the "Resizer".
26	* @param {Object=} options Additional options.
27	* @param {number=} options.wait If `liveUpdate` is `true`, the resize function will fire every time the width has changed depending on the `options.wait` delay.
28	* @param {boolean=} options.liveUpdate The number of milliseconds for which the calls are to be delayed. Defaults to `100`.
29	*/
30	export const useOnColumnResize = (callback: useOnColumnResizeFunc, options?: useOnColumnResizeOptions) => {	418✔
31	const debouncedEvent = debounce(callback, options?.wait ?? 100);	×
32
33	const useInstance = (instance: TableInstance) => {	×
34	const { state, columns } = instance;	×
35	const { columnResizing } = state;	×
36	const { isResizingColumn, columnWidths } = columnResizing;	×
37	const prevHeaderIsResizing = useRef(undefined);	×
38
39	useEffect(() => {	×
40	if (isResizingColumn && options?.liveUpdate) {	×
41	const currentHeader = columns.find((item) => item.id === isResizingColumn);	×
42	debouncedEvent({	×
43	columnWidth: columnWidths[isResizingColumn],
44	header: currentHeader
45	});
46	}
47	}, [columnResizing, options?.liveUpdate, columns]);
48
49	useEffect(() => {	×
50	if (options?.liveUpdate) {	×
51	return () => debouncedEvent.cancel();	×
52	}
53	}, [options?.liveUpdate]);
54
55	useEffect(() => {	×
56	if (!options?.liveUpdate) {	×
57	const currentHeader = columns.find((item) => item.id === prevHeaderIsResizing.current);	×
58	if (isResizingColumn) {	×
59	prevHeaderIsResizing.current = isResizingColumn;	×
60	}
61	if (!isResizingColumn && prevHeaderIsResizing.current) {	×
62	callback({	×
63	columnWidth: columnWidths[prevHeaderIsResizing.current],
64	header: currentHeader
65	});
66	}
67	}
68	}, [columnResizing, options?.liveUpdate, columns]);
69	};
70
71	const useOnColumnResizeHooks = (hooks: ReactTableHooks) => {	×
72	hooks.useFinalInstance.push(useInstance);	×
73	};
74
75	useOnColumnResizeHooks.pluginName = 'useOnColumnResize';	×
76
77	return useOnColumnResizeHooks;	×
78	};

SAP / ui5-webcomponents-react / 12009185407

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous