@addev-be/ui 0.2.2 → 0.2.6

package/src/components/data/DataGrid/types.ts

@@ -1,233 +1,241 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-
-import * as t from 'io-ts';
-
-import {
-  CSSProperties,
-  Context,
-  Dispatch,
-  MouseEvent,
-  ReactNode,
-  SetStateAction,
-} from 'react';
-
-import { SettingsContextProps } from '../../../providers/SettingsProvider';
-import { ThemeColor } from '../../../providers/ThemeProvider/types';
-
-export type MysqlJsonObject = Record<string, string | number | null>;
-
-export type DataGridColumn<R> = {
-  bodyClassName?: string;
-  className?: string;
-  editable?: boolean;
-  excelFormatter?: (value: any) => string;
-  excelValue?: (value: any) => string;
-  filter?: DataGridFilter;
-  footer?: (allRows: R[], filteredRows: R[], selectedRows: R[]) => ReactNode;
-  footerClassName?: string;
-  getter?: (row: R) => string | number | MysqlJsonObject;
-  headerClassName?: string;
-  name: string;
-  order?: number;
-  propertyName?: keyof R;
-  render?: (row: R, column: DataGridColumn<R>) => ReactNode | string;
-  resizable?: boolean;
-  sortGetter?: (row: R) => string | number;
-  type?: 'text' | 'number' | 'date';
-  width?: number;
-  settingsContext?: Context<SettingsContextProps>;
-};
-
-export type DataGridColumns<R> = Record<string, DataGridColumn<R>>;
-
-export type DataGridFilters = Record<
-  string,
-  DataGridFilter<DataGridFilterType>
->;
-
-export type DataGridProps<R> = {
-  name?: string;
-  className?: string;
-  rows: R[];
-  columns: DataGridColumns<R>;
-  rowKey: keyof R | ((row: R) => string);
-  selectable?: boolean;
-  editable?: boolean;
-  onRowDoubleClick?: (row: R, e: MouseEvent) => void;
-  onSelectionChange?: (keys: string[]) => void;
-  getAllIds?: () => Promise<string[]>;
-  onFiltersChanged?: (filters: DataGridFilters) => void;
-  onSortsChanged?: (sorts: Record<string, DataGridSort>) => void;
-  onVisibleRowsChange?: (startIndex: number, length: number) => void;
-  onCellEdited?: (row: R, columnKey: string, value: any) => void;
-  rowClassNameGetter?: (row: R | null) => {
-    className?: string;
-    style?: CSSProperties;
-  };
-  headerRowHeight?: number;
-  rowHeight?: number;
-  filter?: boolean;
-  sort?: boolean;
-  filterValuesLoader?: (
-    columnKey: string
-  ) => Promise<(string | number | null | MysqlJsonObject)[]>;
-  // copyTableHandler?: (
-  //   includeHeaders?: boolean,
-  //   includeFooters?: boolean
-  // ) => Promise<void>;
-  loadCopyRows?: () => Promise<R[]>;
-  refresh?: () => void;
-  headerColor?: ThemeColor;
-};
-
-export type DataGridContextProps<R> = DataGridProps<R> & {
-  editingCell?: [number, number];
-  setEditingCell: Dispatch<SetStateAction<[number, number]>>;
-  sortedRows: R[];
-  selectedRows: R[];
-  selectedKeys: string[];
-  setSelectedKeys: (selection: string[]) => void;
-  sorts?: Record<string, DataGridSort>;
-  setSorts: (sorts: Record<string, DataGridSort>) => void;
-  filters?: DataGridFilters;
-  setFilters: Dispatch<SetStateAction<DataGridFilters>>;
-  visibleColumns: DataGridColumnKeyValuePair<R>[];
-  copyTable: (
-    includeHeaders?: boolean,
-    includeFooters?: boolean
-  ) => Promise<void>;
-  setColumnWidth: (key: string, width: number) => void;
-  saveSettings: (newSettings?: DataGridSettings) => void;
-  settings: DataGridSettings;
-  setSettings: Dispatch<SetStateAction<DataGridSettings>>;
-  visibleRows: R[];
-  scrollableRef: React.RefObject<HTMLDivElement>;
-  onScroll: (e: React.UIEvent<HTMLDivElement>) => void;
-  index: number;
-  length: number;
-  rowKeyGetter: (row: R) => string;
-  gridTemplateColumns: string;
-};
-
-export type DataGridContext<R> = Context<DataGridContextProps<R>>;
-
-export const dataGridSettingCodec = t.partial(
-  {
-    width: t.number,
-    order: t.number,
-  },
-  'DataGridSetting'
-);
-export const dataGridSettingsCodec = t.record(
-  t.string,
-  dataGridSettingCodec,
-  'DataGridSettings'
-);
-export const dataGridSettingsByNameCodec = t.record(
-  t.string,
-  dataGridSettingsCodec,
-  'DataGridSettingsByName'
-);
-
-export type DataGridSetting = t.TypeOf<typeof dataGridSettingCodec>;
-export type DataGridSettings = t.TypeOf<typeof dataGridSettingsCodec>;
-export type DataGridSettingsByName = t.TypeOf<
-  typeof dataGridSettingsByNameCodec
->;
-export type DataGridSettingsTuple = [string, DataGridSetting];
-export type DataGridSettingsArray = DataGridSettingsTuple[];
-export type DataGridColumnKeyValuePair<R> = [string, DataGridColumn<R>];
-
-export type DataGridCellProps<R> = {
-  row: R;
-  rowIndex: number;
-  columnKey: string;
-  columnIndex: number;
-  column: DataGridColumn<R>;
-  context: DataGridContext<R>;
-  className?: string;
-  style?: CSSProperties;
-};
-
-export type DataGridHeaderCellProps<R> = {
-  columnKey: string;
-  columnIndex: number;
-  column: DataGridColumn<R>;
-  context: DataGridContext<R>;
-  onFilterButtonClicked?: (columnKey: string) => void;
-  isFilterOpen?: boolean;
-};
-
-export type DataGridSort = 'asc' | 'desc';
-
-export type DataGridFilterPredicate<T> = (valueToVerify: T) => boolean;
-export type DataGridFilterPredicateBuilder<T> = (
-  ...filterValues: T[]
-) => DataGridFilterPredicate<T>;
-
-export type DataGridFilterOperators<K extends string, T> = {
-  [key in K]: DataGridFilterPredicateBuilder<T>;
-};
-
-export type DataGridFilterPredicates = {
-  text: DataGridFilterOperators<
-    | 'contains'
-    | 'notContains'
-    | 'equals'
-    | 'notEquals'
-    | 'startsWith'
-    | 'endsWith'
-    | 'inArray',
-    string
-  >;
-  number: DataGridFilterOperators<
-    | 'equals'
-    | 'notEquals'
-    | 'lessThan'
-    | 'lessThanOrEqual'
-    | 'greaterThan'
-    | 'greaterThanOrEqual'
-    | 'inRange'
-    | 'inArray',
-    number
-  >;
-};
-
-export type DataGridFilterType = keyof DataGridFilterPredicates;
-export type DataGridFilterDataType<T extends DataGridFilterType> =
-  DataGridFilterPredicates[T] extends DataGridFilterOperators<string, infer U>
-    ? U
-    : never;
-
-export type DataGridFilterGetter<T extends DataGridFilterType> = (
-  value: any
-) => DataGridFilterDataType<T> | null;
-export type DataGridFilterFormatter = (value: any) => string | null;
-
-export type DataGridFilterOperator<T extends DataGridFilterType> =
-  DataGridFilterPredicates[T] extends DataGridFilterOperators<infer K, any>
-    ? K
-    : never;
-
-export type DataGridFilter<T extends string = DataGridFilterType> =
-  T extends DataGridFilterType
-    ? {
-        type: T;
-        operator: DataGridFilterOperator<T>;
-        getter: DataGridFilterGetter<T>;
-        formatter?: DataGridFilterFormatter;
-        values: (DataGridFilterDataType<T> | null)[];
-      }
-    : never;
-
-export type DataGridFilterGroup<R> = {
-  name: string;
-  values?: R[];
-  groups?: DataGridFilterGroup<R>[];
-};
-
-export type DataGridFilterCheckbox<R extends string | number | null> = {
-  displayValue: string | null;
-  values: R[];
-  level: number;
-};
+/* eslint-disable @typescript-eslint/no-explicit-any */
+
+import * as t from 'io-ts';
+
+import {
+  CSSProperties,
+  Context,
+  Dispatch,
+  FC,
+  MouseEvent,
+  MouseEventHandler,
+  ReactNode,
+  SetStateAction,
+} from 'react';
+
+import { SettingsContextProps } from '../../../providers/SettingsProvider';
+import { ThemeColor } from '../../../providers/ThemeProvider/types';
+
+export type DataGridCellFC = FC<{
+  onDoubleClick?: MouseEventHandler;
+  style?: CSSProperties;
+}>;
+
+export type DataGridColumn<R> = {
+  component?: DataGridCellFC;
+  editable?: boolean;
+  excelFormatter?: (value: any) => string;
+  excelValue?: (value: any) => string;
+  filter?: DataGridFilter;
+  footer?: (allRows: R[], filteredRows: R[], selectedRows: R[]) => ReactNode;
+  getter?: (row: R) => string | number;
+  name: string;
+  order?: number;
+  propertyName?: keyof R;
+  render?: (row: R, column: DataGridColumn<R>) => ReactNode | string;
+  resizable?: boolean;
+  sortGetter?: (row: R) => string | number;
+  type?: 'text' | 'number' | 'date';
+  width?: number;
+  settingsContext?: Context<SettingsContextProps>;
+};
+
+export type DataGridColumns<R> = Record<string, DataGridColumn<R>>;
+
+export type DataGridFilters = Record<
+  string,
+  DataGridFilter<DataGridFilterType>
+>;
+
+export type DataGridProps<R> = {
+  name?: string;
+  className?: string;
+  rows: R[];
+  columns: DataGridColumns<R>;
+  rowKey: keyof R | ((row: R) => string);
+  selectable?: boolean;
+  editable?: boolean;
+  onRowDoubleClick?: (row: R, e: MouseEvent) => void;
+  onSelectionChange?: (keys: string[]) => void;
+  getAllIds?: () => Promise<string[]>;
+  onFiltersChanged?: (filters: DataGridFilters) => void;
+  onSortsChanged?: (sorts: Record<string, DataGridSort>) => void;
+  onVisibleRowsChange?: (startIndex: number, length: number) => void;
+  onCellEdited?: (row: R, columnKey: string, value: any) => void;
+  rowClassNameGetter?: (row: R | null) => {
+    className?: string;
+    style?: CSSProperties;
+  };
+  headerRowHeight?: number;
+  rowHeight?: number;
+  filter?: boolean;
+  sort?: boolean;
+  initialSorts?: Record<string, DataGridSort>;
+  filterValuesLoader?: (
+    columnKey: string
+  ) => Promise<(string | number | null)[]>;
+  // copyTableHandler?: (
+  //   includeHeaders?: boolean,
+  //   includeFooters?: boolean
+  // ) => Promise<void>;
+  loadCopyRows?: () => Promise<R[]>;
+  refresh?: () => void;
+  headerColor?: ThemeColor;
+};
+
+export type DataGridContextProps<R> = DataGridProps<R> & {
+  editingCell?: [number, number];
+  setEditingCell: Dispatch<SetStateAction<[number, number]>>;
+  sortedRows: R[];
+  selectedRows: R[];
+  selectedKeys: string[];
+  setSelectedKeys: (selection: string[]) => void;
+  sorts?: Record<string, DataGridSort>;
+  setSorts: (sorts: Record<string, DataGridSort>) => void;
+  filters?: DataGridFilters;
+  setFilters: Dispatch<SetStateAction<DataGridFilters>>;
+  visibleColumns: DataGridColumnKeyValuePair<R>[];
+  copyTable: (
+    includeHeaders?: boolean,
+    includeFooters?: boolean
+  ) => Promise<void>;
+  setColumnWidth: (key: string, width: number) => void;
+  saveSettings: (newSettings?: DataGridSettings) => void;
+  settings: DataGridSettings;
+  setSettings: Dispatch<SetStateAction<DataGridSettings>>;
+  visibleRows: R[];
+  scrollableRef: React.RefObject<HTMLDivElement>;
+  onScroll: (e: React.UIEvent<HTMLDivElement>) => void;
+  index: number;
+  length: number;
+  rowKeyGetter: (row: R) => string;
+  gridTemplateColumns: string;
+};
+
+export type DataGridContext<R> = Context<DataGridContextProps<R>>;
+
+export const dataGridSettingCodec = t.partial(
+  {
+    width: t.number,
+    order: t.number,
+  },
+  'DataGridSetting'
+);
+export const dataGridSettingsCodec = t.record(
+  t.string,
+  dataGridSettingCodec,
+  'DataGridSettings'
+);
+export const dataGridSettingsByNameCodec = t.record(
+  t.string,
+  dataGridSettingsCodec,
+  'DataGridSettingsByName'
+);
+
+export type DataGridSetting = t.TypeOf<typeof dataGridSettingCodec>;
+export type DataGridSettings = t.TypeOf<typeof dataGridSettingsCodec>;
+export type DataGridSettingsByName = t.TypeOf<
+  typeof dataGridSettingsByNameCodec
+>;
+export type DataGridSettingsTuple = [string, DataGridSetting];
+export type DataGridSettingsArray = DataGridSettingsTuple[];
+export type DataGridColumnKeyValuePair<R> = [string, DataGridColumn<R>];
+
+export type DataGridCellProps<R> = {
+  row: R;
+  rowIndex: number;
+  columnKey: string;
+  columnIndex: number;
+  column: DataGridColumn<R>;
+  context: DataGridContext<R>;
+  className?: string;
+  style?: CSSProperties;
+};
+
+export type DataGridHeaderCellProps<R> = {
+  columnKey: string;
+  columnIndex: number;
+  column: DataGridColumn<R>;
+  context: DataGridContext<R>;
+  onFilterButtonClicked?: (columnKey: string) => void;
+  isFilterOpen?: boolean;
+};
+
+export type DataGridSort = 'asc' | 'desc';
+
+export type DataGridFilterPredicate<T> = (valueToVerify: T) => boolean;
+export type DataGridFilterPredicateBuilder<T> = (
+  ...filterValues: T[]
+) => DataGridFilterPredicate<T>;
+
+export type DataGridFilterOperators<K extends string, T> = {
+  [key in K]: DataGridFilterPredicateBuilder<T>;
+};
+
+export type DataGridFilterPredicates = {
+  text: DataGridFilterOperators<
+    | 'contains'
+    | 'notContains'
+    | 'equals'
+    | 'notEquals'
+    | 'startsWith'
+    | 'endsWith'
+    | 'inArray',
+    string
+  >;
+  number: DataGridFilterOperators<
+    | 'equals'
+    | 'notEquals'
+    | 'lessThan'
+    | 'lessThanOrEqual'
+    | 'greaterThan'
+    | 'greaterThanOrEqual'
+    | 'inRange'
+    | 'inArray',
+    number
+  >;
+};
+
+export type DataGridFilterType = keyof DataGridFilterPredicates;
+export type DataGridFilterDataType<T extends DataGridFilterType> =
+  DataGridFilterPredicates[T] extends DataGridFilterOperators<string, infer U>
+    ? U
+    : never;
+
+export type DataGridFilterGetter<T extends DataGridFilterType> = (
+  value: any
+) => DataGridFilterDataType<T> | null;
+export type DataGridFilterRenderer = (value: any) => ReactNode;
+export type DataGridFilterFormatter = (value: any) => string;
+
+export type DataGridFilterOperator<T extends DataGridFilterType> =
+  DataGridFilterPredicates[T] extends DataGridFilterOperators<infer K, any>
+    ? K
+    : never;
+
+export type DataGridFilter<T extends string = DataGridFilterType> =
+  T extends DataGridFilterType
+    ? {
+        type: T;
+        operator: DataGridFilterOperator<T>;
+        getter: DataGridFilterGetter<T>;
+        renderer?: DataGridFilterRenderer;
+        formatter?: DataGridFilterFormatter;
+        values: (DataGridFilterDataType<T> | null)[];
+      }
+    : never;
+
+export type DataGridFilterGroup = {
+  name: string;
+  values?: (string | number | null)[];
+  groups?: DataGridFilterGroup[];
+};
+
+export type DataGridFilterValue = string | number | null;
+
+export type DataGridFilterCheckbox = {
+  displayValue: ReactNode;
+  title: string;
+  value: DataGridFilterValue;
+  level: number;
+};