1,576th Commit

ui/src/components/table/Table.vue

@@ -11,6 +11,7 @@ import Select from '../select/Select.vue';
 import Spinner from '../spinner/Spinner.vue';
 
 import type { ColumnItem, Control } from './types';
+import { controlDefaults } from './config';
 import Column from './Column.vue';
 import Row from './Row.vue';
 import Cell from './Cell.vue';
@@ -36,12 +37,9 @@ const props = defineProps<{
 const emit = defineEmits<{
   (evt: 'update:value', val: T[]): void;
   (evt: 'update:selected', val: T[]): void;
-  (evt: 'change', val: { rows?: number; page?: number; field?: string; direction?: string }): void;
+  (evt: 'change', val: Control): void;
   (evt: 'clickRow', val: T): void;
-  (
-    evt: 'update:control',
-    val: { rows?: number; page?: number; field?: string; direction?: string },
-  ): void;
+  (evt: 'update:control', val: Control): void;
   (evt: 'selecteAll', val: boolean, arr: T[]): void;
 }>();
 
@@ -69,7 +67,7 @@ const controlModel = computed({
       !props.control ||
       (typeof props.control === 'object' && Object.keys(props.control).length === 0)
     ) {
-      return { rows: 10, page: 1, field: 'createdAt', direction: 'desc' };
+      return controlDefaults;
     }
 
     return props.control;
@@ -102,8 +100,8 @@ const flux = reactive({
     flux._updateChange();
   },
 
-  sortField: 'createdAt' as string | undefined,
-  sortDirection: 'desc' as string | undefined,
+  sortField: 'createdAt' as Control['field'],
+  sortDirection: 'desc' as Control['direction'],
   onSort(col: any) {
     if (props.loading) return;
 
@@ -161,10 +159,10 @@ watch(
   () => controlModel.value,
   (val) => {
     if (Object.keys(val)?.length) {
-      flux.rowsPerPage = val.rows || 10;
-      flux.currentPage = val.page || 1;
-      flux.sortField = val.field || 'createdAt';
-      flux.sortDirection = val.direction || 'desc';
+      flux.rowsPerPage = val.rows || controlDefaults.rows;
+      flux.currentPage = val.page || controlDefaults.page;
+      flux.sortField = val.field || controlDefaults.field;
+      flux.sortDirection = val.direction || controlDefaults.direction;
 
       if (props.static && props.rows?.length) {
         flux.rows = props.static(props.rows, controlModel.value);

ui/src/components/table/config.ts

@@ -0,0 +1,8 @@
+import type { Control } from './types';
+
+export const controlDefaults: Required<Control> = {
+  rows: 10,
+  page: 1,
+  field: 'createdAt',
+  direction: 'desc',
+};

ui/src/components/table/types.ts

@@ -13,5 +13,5 @@ export type Control = {
   rows?: number;
   page?: number;
   field?: string;
-  direction?: string;
+  direction?: string | 'asc' | 'desc';
 };

ui/src/utilities/request/request.ts

@@ -34,12 +34,14 @@ export default async <T>(request: FetchRequest, options?: FetchOptions) => {
   try {
     const response = await fetcher.raw(request, options);
     return response as FetchResponse<T>;
-  } catch (error: any) {
-    if (error.response?.status === 401 && localStorage.getItem('refreshToken')) {
+  } catch (error) {
+    const fetchError = error as { response: FetchResponse<T> };
+
+    if (fetchError.response?.status === 401 && localStorage.getItem('refreshToken')) {
       const response = await fetcher.raw(request, options);
       return response as FetchResponse<T>;
     }
 
-    return error.response as FetchResponse<T>;
+    return fetchError.response as FetchResponse<T>;
   }
 };

ui/src/utilities/static-table/staticTable.ts

@@ -1,23 +1,20 @@
-import chunk from 'lodash/chunk';
 import orderBy from 'lodash/orderBy';
 
-export default <T extends Record<string, any>>(
-  rows: T[],
-  control = { rows: 10, page: 1, field: 'createdAt', direction: 'desc' } as any,
-) => {
-  if (!rows?.length) return [];
+import type { Control } from '../../components/table/types';
+import { controlDefaults } from '../../components/table/config';
 
-  let arr = [...rows];
+export default <T>(rows: T[], control: Control) => {
+  if (!rows?.length) return [];
 
-  if (control.field && control.direction === 'asc') {
-    arr = orderBy(arr, control.field, 'asc');
-  }
+  const _rows = control.rows || controlDefaults.rows;
+  const _page = control.page || controlDefaults.page;
+  const _field = control.field || controlDefaults.field;
+  const _direction = control.direction || controlDefaults.direction;
 
-  if (control.field && control.direction === 'desc') {
-    arr = orderBy(arr, control.field, 'desc');
-  }
+  const ordered = orderBy(rows, _field, _direction as 'asc' | 'desc');
 
-  const chunked = chunk(arr, control.rows);
+  const start = (_page - 1) * _rows;
+  const pagedRows = ordered.slice(start, start + _rows);
 
-  return chunked[control.page - 1];
+  return pagedRows;
 };