@addev-be/ui 0.3.2 → 0.3.3

package/src/components/data/AdvancedRequestDataGrid/index.tsx

@@ -1,267 +1,267 @@
-import {
-  ConditionDTO,
-  FieldDTO,
-  OrderByDTO,
-  useAdvancedRequestHandler,
-} from '../../../services/advancedRequests';
-import {
-  DataGridColumns,
-  DataGridFilters,
-  DataGridSort,
-} from '../DataGrid/types';
-import _, { debounce } from 'lodash';
-import {
-  convertFiltersToConditions,
-  getAdvancedRequestDto,
-  getColumnSortField,
-  parseJsonObjectFields,
-} from './helpers';
-import { useCallback, useEffect, useRef, useState } from 'react';
-
-import { AdvancedRequestDataGridProps } from './types';
-import { DataGrid } from '../DataGrid';
-
-export const AdvancedRequestDataGrid = <R,>({
-  onSelectionChange: onSelectionChangeFromProps,
-  idField,
-  ...props
-}: AdvancedRequestDataGridProps<R>) => {
-  const currentRows = useRef<R[]>([]);
-  const [rows, setRows] = useState<R[]>([]);
-  const [start, setStart] = useState(0);
-  const [length, setLength] = useState(50);
-  const [total, setTotal] = useState(-1);
-  const advancedRequest = useAdvancedRequestHandler<R>();
-  const idAdvancedRequest = useAdvancedRequestHandler<{ Id: string }>();
-
-  const [conditions, setConditions] = useState<Record<string, ConditionDTO>>(
-    {}
-  );
-  const [orderBy, setOrderBy] = useState<OrderByDTO[]>([]);
-
-  const refresh = useCallback(() => {
-    setRows([]);
-    setStart(0);
-    setLength(50);
-    setTotal(-1);
-  }, []);
-
-  const onFiltersChanged = useCallback(
-    (filters: DataGridFilters) => {
-      const newConditions = convertFiltersToConditions(filters, props.columns);
-      setTotal(-1);
-      setConditions(newConditions);
-    },
-    [props.columns]
-  );
-
-  const onSortsChanged = useCallback(
-    (sorts: Record<string, DataGridSort>) => {
-      refresh();
-      setOrderBy(
-        Object.entries(sorts).map(
-          ([columnKey, direction]) =>
-            ({
-              field: getColumnSortField(props.columns, columnKey),
-              direction: direction.toUpperCase(),
-            } as OrderByDTO)
-        )
-      );
-    },
-    [props.columns, refresh]
-  );
-
-  const loadRows = useRef(
-    debounce(
-      (
-        columns: DataGridColumns<R>,
-        conditions: ConditionDTO[],
-        orderBy: OrderByDTO[],
-        start: number,
-        length: number,
-        idField: FieldDTO | null | undefined,
-        getTotal = false
-      ) => {
-        advancedRequest(
-          getAdvancedRequestDto({
-            type: props.type,
-            columns,
-            conditions,
-            orderBy,
-            start,
-            length,
-            getTotal,
-            idField,
-          })
-        ).then((response) => {
-          if (getTotal) {
-            currentRows.current = Array(response.count).fill(null);
-            if (getTotal) setTotal(response.count ?? 0);
-          }
-          const parsedRows = parseJsonObjectFields(
-            response.data,
-            columns,
-            props.parser
-          );
-          currentRows.current.splice(start, length, ...parsedRows);
-          setRows([...currentRows.current]);
-        });
-      },
-      100
-    )
-  );
-
-  const loadFilterValues = useCallback(
-    (columnKey: string) => {
-      return advancedRequest({
-        fields: [
-          props.columns[columnKey].field ?? {
-            fieldName: columnKey,
-          },
-        ],
-        conditions: [
-          ...(props.conditions ?? []),
-          ...Object.values(_.pickBy(conditions, (_, key) => key !== columnKey)),
-        ].filter((condition) => condition.field !== columnKey),
-        orderBy: [
-          {
-            field:
-              props.columns[columnKey].filterField ??
-              props.columns[columnKey].field?.fieldAlias ??
-              props.columns[columnKey].field?.fieldName ??
-              columnKey,
-            direction: 'ASC',
-          },
-        ],
-        type: props.type,
-        getTotal: false,
-        unique: true,
-      }).then((response) =>
-        response.data.map(
-          (row) => props.columns[columnKey].filter?.getter?.(row) ?? null
-        )
-      );
-    },
-    [advancedRequest, conditions, props.columns, props.conditions, props.type]
-  );
-
-  useEffect(
-    () =>
-      loadRows.current(
-        props.columns,
-        [...(props.conditions ?? []), ...(Object.values(conditions) ?? [])],
-        orderBy,
-        start,
-        length,
-        idField,
-        total < 0
-      ),
-    [
-      props.columns,
-      conditions,
-      orderBy,
-      start,
-      length,
-      total,
-      props.conditions,
-      idField,
-    ]
-  );
-
-  const loadCopyRows = useCallback(
-    () =>
-      advancedRequest(
-        getAdvancedRequestDto({
-          type: props.type,
-          columns: props.columns,
-          conditions: [
-            ...(props.conditions ?? []),
-            ...(Object.values(conditions) ?? []),
-          ],
-          orderBy,
-          start: 0,
-          length: total,
-          idField,
-        })
-      ).then((response) =>
-        parseJsonObjectFields(response.data, props.columns, props.parser)
-      ),
-    [
-      advancedRequest,
-      conditions,
-      idField,
-      orderBy,
-      props.columns,
-      props.conditions,
-      props.parser,
-      props.type,
-      total,
-    ]
-  );
-
-  const loadAllIds = useCallback(
-    () =>
-      idAdvancedRequest(
-        getAdvancedRequestDto({
-          type: props.type,
-          columns: {
-            Id: {
-              name: 'Id',
-              field: idField ?? { fieldName: 'Id' },
-            },
-          },
-          conditions: [
-            ...(props.conditions ?? []),
-            ...(Object.values(conditions) ?? []),
-          ],
-          orderBy,
-          start: 0,
-          length: total,
-          idField: null,
-        })
-      ).then((response) => response.data.map((row) => row['Id'])),
-    [
-      conditions,
-      idAdvancedRequest,
-      idField,
-      orderBy,
-      props.conditions,
-      props.type,
-      total,
-    ]
-  );
-
-  const onVisibleRowsChanged = useCallback(
-    (newStart: number, newLength: number) => {
-      if (newStart !== start || newLength !== length) {
-        setStart(newStart);
-        setLength(newLength);
-      }
-    },
-    [length, start]
-  );
-
-  const onSelectionChange = useCallback(
-    (selectedKeys: string[]) => {
-      onSelectionChangeFromProps?.(selectedKeys);
-    },
-    [onSelectionChangeFromProps]
-  );
-
-  return (
-    <DataGrid
-      onVisibleRowsChange={onVisibleRowsChanged}
-      filter={false}
-      sort={false}
-      onFiltersChanged={onFiltersChanged}
-      onSortsChanged={onSortsChanged}
-      filterValuesLoader={loadFilterValues}
-      rows={rows}
-      loadCopyRows={loadCopyRows}
-      refresh={refresh}
-      onSelectionChange={onSelectionChange}
-      getAllIds={loadAllIds}
-      {...props}
-    />
-  );
-};
+import {
+  ConditionDTO,
+  FieldDTO,
+  OrderByDTO,
+  useAdvancedRequestHandler,
+} from '../../../services/advancedRequests';
+import {
+  DataGridColumns,
+  DataGridFilters,
+  DataGridSort,
+} from '../DataGrid/types';
+import _, { debounce } from 'lodash';
+import {
+  convertFiltersToConditions,
+  getAdvancedRequestDto,
+  getColumnSortField,
+  parseJsonObjectFields,
+} from './helpers';
+import { useCallback, useEffect, useRef, useState } from 'react';
+
+import { AdvancedRequestDataGridProps } from './types';
+import { DataGrid } from '../DataGrid';
+
+export const AdvancedRequestDataGrid = <R,>({
+  onSelectionChange: onSelectionChangeFromProps,
+  idField,
+  ...props
+}: AdvancedRequestDataGridProps<R>) => {
+  const currentRows = useRef<R[]>([]);
+  const [rows, setRows] = useState<R[]>([]);
+  const [start, setStart] = useState(0);
+  const [length, setLength] = useState(50);
+  const [total, setTotal] = useState(-1);
+  const advancedRequest = useAdvancedRequestHandler<R>();
+  const idAdvancedRequest = useAdvancedRequestHandler<{ Id: string }>();
+
+  const [conditions, setConditions] = useState<Record<string, ConditionDTO>>(
+    {}
+  );
+  const [orderBy, setOrderBy] = useState<OrderByDTO[]>([]);
+
+  const refresh = useCallback(() => {
+    setRows([]);
+    setStart(0);
+    setLength(50);
+    setTotal(-1);
+  }, []);
+
+  const onFiltersChanged = useCallback(
+    (filters: DataGridFilters) => {
+      const newConditions = convertFiltersToConditions(filters, props.columns);
+      setTotal(-1);
+      setConditions(newConditions);
+    },
+    [props.columns]
+  );
+
+  const onSortsChanged = useCallback(
+    (sorts: Record<string, DataGridSort>) => {
+      refresh();
+      setOrderBy(
+        Object.entries(sorts).map(
+          ([columnKey, direction]) =>
+            ({
+              field: getColumnSortField(props.columns, columnKey),
+              direction: direction.toUpperCase(),
+            } as OrderByDTO)
+        )
+      );
+    },
+    [props.columns, refresh]
+  );
+
+  const loadRows = useRef(
+    debounce(
+      (
+        columns: DataGridColumns<R>,
+        conditions: ConditionDTO[],
+        orderBy: OrderByDTO[],
+        start: number,
+        length: number,
+        idField: FieldDTO | null | undefined,
+        getTotal = false
+      ) => {
+        advancedRequest(
+          getAdvancedRequestDto({
+            type: props.type,
+            columns,
+            conditions,
+            orderBy,
+            start,
+            length,
+            getTotal,
+            idField,
+          })
+        ).then((response) => {
+          if (getTotal) {
+            currentRows.current = Array(response.count).fill(null);
+            if (getTotal) setTotal(response.count ?? 0);
+          }
+          const parsedRows = parseJsonObjectFields(
+            response.data,
+            columns,
+            props.parser
+          );
+          currentRows.current.splice(start, length, ...parsedRows);
+          setRows([...currentRows.current]);
+        });
+      },
+      100
+    )
+  );
+
+  const loadFilterValues = useCallback(
+    (columnKey: string) => {
+      return advancedRequest({
+        fields: [
+          props.columns[columnKey].field ?? {
+            fieldName: columnKey,
+          },
+        ],
+        conditions: [
+          ...(props.conditions ?? []),
+          ...Object.values(_.pickBy(conditions, (_, key) => key !== columnKey)),
+        ].filter((condition) => condition.field !== columnKey),
+        orderBy: [
+          {
+            field:
+              props.columns[columnKey].filterField ??
+              props.columns[columnKey].field?.fieldAlias ??
+              props.columns[columnKey].field?.fieldName ??
+              columnKey,
+            direction: 'ASC',
+          },
+        ],
+        type: props.type,
+        getTotal: false,
+        unique: true,
+      }).then((response) =>
+        response.data.map(
+          (row) => props.columns[columnKey].filter?.getter?.(row) ?? null
+        )
+      );
+    },
+    [advancedRequest, conditions, props.columns, props.conditions, props.type]
+  );
+
+  useEffect(
+    () =>
+      loadRows.current(
+        props.columns,
+        [...(props.conditions ?? []), ...(Object.values(conditions) ?? [])],
+        orderBy,
+        start,
+        length,
+        idField,
+        total < 0
+      ),
+    [
+      props.columns,
+      conditions,
+      orderBy,
+      start,
+      length,
+      total,
+      props.conditions,
+      idField,
+    ]
+  );
+
+  const loadCopyRows = useCallback(
+    () =>
+      advancedRequest(
+        getAdvancedRequestDto({
+          type: props.type,
+          columns: props.columns,
+          conditions: [
+            ...(props.conditions ?? []),
+            ...(Object.values(conditions) ?? []),
+          ],
+          orderBy,
+          start: 0,
+          length: total,
+          idField,
+        })
+      ).then((response) =>
+        parseJsonObjectFields(response.data, props.columns, props.parser)
+      ),
+    [
+      advancedRequest,
+      conditions,
+      idField,
+      orderBy,
+      props.columns,
+      props.conditions,
+      props.parser,
+      props.type,
+      total,
+    ]
+  );
+
+  const loadAllIds = useCallback(
+    () =>
+      idAdvancedRequest(
+        getAdvancedRequestDto({
+          type: props.type,
+          columns: {
+            Id: {
+              name: 'Id',
+              field: idField ?? { fieldName: 'Id' },
+            },
+          },
+          conditions: [
+            ...(props.conditions ?? []),
+            ...(Object.values(conditions) ?? []),
+          ],
+          orderBy,
+          start: 0,
+          length: total,
+          idField: null,
+        })
+      ).then((response) => response.data.map((row) => row['Id'])),
+    [
+      conditions,
+      idAdvancedRequest,
+      idField,
+      orderBy,
+      props.conditions,
+      props.type,
+      total,
+    ]
+  );
+
+  const onVisibleRowsChanged = useCallback(
+    (newStart: number, newLength: number) => {
+      if (newStart !== start || newLength !== length) {
+        setStart(newStart);
+        setLength(newLength);
+      }
+    },
+    [length, start]
+  );
+
+  const onSelectionChange = useCallback(
+    (selectedKeys: string[]) => {
+      onSelectionChangeFromProps?.(selectedKeys);
+    },
+    [onSelectionChangeFromProps]
+  );
+
+  return (
+    <DataGrid
+      onVisibleRowsChange={onVisibleRowsChanged}
+      filter={false}
+      sort={false}
+      onFiltersChanged={onFiltersChanged}
+      onSortsChanged={onSortsChanged}
+      filterValuesLoader={loadFilterValues}
+      rows={rows}
+      loadCopyRows={loadCopyRows}
+      refresh={refresh}
+      onSelectionChange={onSelectionChange}
+      getAllIds={loadAllIds}
+      {...props}
+    />
+  );
+};

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

@@ -1,47 +1,47 @@
-import {
-  AdvancedRequestRow,
-  ConditionDTO,
-  FieldDTO,
-  OrderByDTO,
-} from '../../../services/advancedRequests';
-import {
-  DataGridColumn,
-  DataGridFilter,
-  DataGridFilterType,
-  DataGridProps,
-} from '../DataGrid/types';
-
-export type AdvancedRequestDataGridFilter<
-  T extends DataGridFilterType = DataGridFilterType
-> = DataGridFilter<T> & {
-  field?: FieldDTO;
-};
-
-export type AdvancedRequestDataGridFilters = Record<
-  string,
-  AdvancedRequestDataGridFilter
->;
-
-export type AdvancedRequestDataGridColumn<R> = DataGridColumn<R> & {
-  filter?: AdvancedRequestDataGridFilter;
-  field?: FieldDTO;
-  filterField?: string;
-  sortField?: string;
-};
-
-export type AdvancedRequestDataGridColumns<R> = Record<
-  string,
-  AdvancedRequestDataGridColumn<R>
->;
-
-export type AdvancedRequestDataGridProps<R> = Omit<
-  DataGridProps<R>,
-  'rows' | 'columns'
-> & {
-  columns: AdvancedRequestDataGridColumns<R>;
-  type: string;
-  orderBy?: OrderByDTO[];
-  conditions?: ConditionDTO[];
-  idField?: FieldDTO | null;
-  parser?: (row: AdvancedRequestRow<R>) => R;
-};
+import {
+  AdvancedRequestRow,
+  ConditionDTO,
+  FieldDTO,
+  OrderByDTO,
+} from '../../../services/advancedRequests';
+import {
+  DataGridColumn,
+  DataGridFilter,
+  DataGridFilterType,
+  DataGridProps,
+} from '../DataGrid/types';
+
+export type AdvancedRequestDataGridFilter<
+  T extends DataGridFilterType = DataGridFilterType
+> = DataGridFilter<T> & {
+  field?: FieldDTO;
+};
+
+export type AdvancedRequestDataGridFilters = Record<
+  string,
+  AdvancedRequestDataGridFilter
+>;
+
+export type AdvancedRequestDataGridColumn<R> = DataGridColumn<R> & {
+  filter?: AdvancedRequestDataGridFilter;
+  field?: FieldDTO;
+  filterField?: string;
+  sortField?: string;
+};
+
+export type AdvancedRequestDataGridColumns<R> = Record<
+  string,
+  AdvancedRequestDataGridColumn<R>
+>;
+
+export type AdvancedRequestDataGridProps<R> = Omit<
+  DataGridProps<R>,
+  'rows' | 'columns'
+> & {
+  columns: AdvancedRequestDataGridColumns<R>;
+  type: string;
+  orderBy?: OrderByDTO[];
+  conditions?: ConditionDTO[];
+  idField?: FieldDTO | null;
+  parser?: (row: AdvancedRequestRow<R>) => R;
+};