@gen-epix/ui 1.14.4 → 1.15.0

package/src/test/integration/lib/render.tsx

@@ -0,0 +1,33 @@
+import { render } from 'vitest-browser-react';
+import { CacheProvider } from '@emotion/react';
+import { QueryClientProvider } from '@tanstack/react-query';
+import type { PropsWithChildren } from 'react';
+import {
+  CssBaseline,
+  ThemeProvider,
+} from '@mui/material';
+
+import { ConfigManager } from '../../../classes/managers/ConfigManager';
+import { EmotionCacheManager } from '../../../classes/managers/EmotionCacheManager';
+import { QueryClientManager } from '../../../classes/managers/QueryClientManager';
+
+const queryQueryManager = QueryClientManager.instance;
+const emotionCacheManager = EmotionCacheManager.instance;
+
+// eslint-disable-next-line react-refresh/only-export-components
+const AllTheProviders = ({ children }: PropsWithChildren<unknown>) => {
+  return (
+    <QueryClientProvider client={queryQueryManager.queryClient}>
+      <CacheProvider value={emotionCacheManager.emotionCache}>
+        <ThemeProvider theme={ConfigManager.instance.config.theme}>
+          <CssBaseline />
+          { children }
+        </ThemeProvider>
+      </CacheProvider>
+    </QueryClientProvider>
+  );
+};
+
+export const customRender = async (...[ui, options]: Parameters<typeof render>) => {
+  return render(ui, { wrapper: AllTheProviders, ...options });
+};

package/src/test/integration/tests/integration-example/HelloWorld.test.tsx

@@ -0,0 +1,14 @@
+import {
+  expect,
+  test,
+} from 'vitest';
+import { render } from 'vitest-browser-react';
+
+import { HelloWorld } from './HelloWorld.tsx';
+
+test('renders name', async () => {
+  const { getByText } = await render(
+    <HelloWorld name={'GenEpix'} />,
+  );
+  await expect.element(getByText('Hello GenEpix!')).toBeInTheDocument();
+});

package/src/test/integration/tests/integration-example/HelloWorld.tsx

@@ -0,0 +1,9 @@
+export const HelloWorld = ({ name }: { readonly name: string }) => {
+  return (
+    <div>
+      <h1>
+        {`Hello ${name}!`}
+      </h1>
+    </div>
+  );
+};

package/src/test/setup-browser.ts

@@ -0,0 +1,3 @@
+import { setupTestEnvironment } from './setup';
+
+setupTestEnvironment();

package/src/test/setup-jsdom.ts

@@ -0,0 +1,6 @@
+import { setupTestEnvironment } from './setup';
+
+global.TextEncoder = TextEncoder;
+global.TextDecoder = TextDecoder;
+
+setupTestEnvironment();

package/src/test/setup.ts

@@ -0,0 +1,9 @@
+import { setup } from '../setup/setup';
+
+export const setupTestEnvironment = () => {
+  setup();
+
+  vi.setConfig({
+    testTimeout: 10000,
+  });
+};

package/src/utils/AbacUtil/AbacUtil.ts

@@ -0,0 +1,21 @@
+import type { CaseTypeAccessAbac } from '../../api';
+
+export class AbacUtil {
+  public static createEffectieveColumnAccessRights(
+    caseTypeAccessAbacs: CaseTypeAccessAbac[],
+  ): Map<string, { read: boolean; write: boolean }> {
+    const effectiveColumnAccessRights = new Map<string, { read: boolean; write: boolean }>();
+    caseTypeAccessAbacs.forEach((caseTypeAccessAbac) => {
+      caseTypeAccessAbac.read_col_ids.forEach(colId => {
+        const currentRights = effectiveColumnAccessRights.get(colId) ?? { read: false, write: false };
+        effectiveColumnAccessRights.set(colId, { ...currentRights, read: true });
+      });
+      caseTypeAccessAbac.write_col_ids.forEach(colId => {
+        const currentRights = effectiveColumnAccessRights.get(colId) ?? { read: false, write: false };
+        effectiveColumnAccessRights.set(colId, { ...currentRights, write: true });
+      });
+    });
+
+    return effectiveColumnAccessRights;
+  }
+}

package/src/utils/AbacUtil/index.ts

@@ -0,0 +1 @@
+export * from './AbacUtil';

package/src/utils/AxiosUtil/AxiosUtil.test.ts

@@ -0,0 +1,66 @@
+import {
+  describe,
+  it,
+  expect,
+} from 'vitest';
+import type { AxiosError } from 'axios';
+import { CanceledError } from 'axios';
+import type { DeepPartial } from 'react-hook-form';
+
+import { AxiosUtil } from './AxiosUtil';
+
+describe('AxiosUtil', () => {
+  const createAxiosError = (status: number): DeepPartial<AxiosError> => ({
+    isAxiosError: true,
+    response: { status },
+    config: {},
+    name: '',
+    message: '',
+    toJSON: () => ({}),
+  });
+
+  it('should identify a canceled error', () => {
+    const error = new CanceledError();
+    expect(AxiosUtil.isAxiosCanceledError(error)).toBe(true);
+  });
+
+  it('should identify an unauthorized error', () => {
+    const error = createAxiosError(401);
+    expect(AxiosUtil.isAxiosUnauthorizedError(error)).toBe(true);
+  });
+
+  it('should identify a forbidden error', () => {
+    const error = createAxiosError(403);
+    expect(AxiosUtil.isAxiosForbiddenError(error)).toBe(true);
+  });
+
+  it('should identify an unprocessable entity error', () => {
+    const error = createAxiosError(422);
+    expect(AxiosUtil.isAxiosUnprocessableEntityError(error)).toBe(true);
+  });
+
+  it('should identify a not found error', () => {
+    const error = createAxiosError(404);
+    expect(AxiosUtil.isAxiosNotFoundError(error)).toBe(true);
+  });
+
+  it('should identify a bad request error', () => {
+    const error = createAxiosError(400);
+    expect(AxiosUtil.isAxiosBadRequestError(error)).toBe(true);
+  });
+
+  it('should identify an internal server error', () => {
+    const error = createAxiosError(500);
+    expect(AxiosUtil.isAxiosInternalServerError(error)).toBe(true);
+  });
+
+  it('should not identify an error with a different status code', () => {
+    const error = createAxiosError(418); // I'm a teapot
+    expect(AxiosUtil.isAxiosUnauthorizedError(error)).toBe(false);
+    expect(AxiosUtil.isAxiosForbiddenError(error)).toBe(false);
+    expect(AxiosUtil.isAxiosUnprocessableEntityError(error)).toBe(false);
+    expect(AxiosUtil.isAxiosNotFoundError(error)).toBe(false);
+    expect(AxiosUtil.isAxiosBadRequestError(error)).toBe(false);
+    expect(AxiosUtil.isAxiosInternalServerError(error)).toBe(false);
+  });
+});

package/src/utils/AxiosUtil/AxiosUtil.ts

@@ -0,0 +1,47 @@
+import type { AxiosError } from 'axios';
+import {
+  CanceledError,
+  isAxiosError,
+} from 'axios';
+
+export class AxiosUtil {
+  public static isAxiosTimeoutError(error: unknown): error is AxiosError<unknown> {
+    return isAxiosError(error) && !AxiosUtil.isAxiosCanceledError(error) && error.code === 'ECONNABORTED';
+  }
+
+  public static isAxiosCanceledError(error: unknown): error is CanceledError<unknown> {
+    return error instanceof CanceledError;
+  }
+
+  public static isAxiosUnauthorizedError(error: unknown): error is AxiosError<unknown> {
+    return AxiosUtil.isAxiosRequestErrorWithCode(error, 401);
+  }
+
+  public static isAxiosForbiddenError(error: unknown): error is AxiosError<unknown> {
+    return AxiosUtil.isAxiosRequestErrorWithCode(error, 403);
+  }
+
+  public static isAxiosUnprocessableEntityError(error: unknown): error is AxiosError<unknown> {
+    return AxiosUtil.isAxiosRequestErrorWithCode(error, 422);
+  }
+
+  public static isAxiosNotFoundError(error: unknown): error is AxiosError<unknown> {
+    return AxiosUtil.isAxiosRequestErrorWithCode(error, 404);
+  }
+
+  public static isAxiosBadRequestError(error: unknown): error is AxiosError<unknown> {
+    return AxiosUtil.isAxiosRequestErrorWithCode(error, 400);
+  }
+
+  public static isAxiosInternalServerError(error: unknown): error is AxiosError<unknown> {
+    return AxiosUtil.isAxiosRequestErrorWithCode(error, 500);
+  }
+
+  public static isAxiosConflictError(error: unknown): error is AxiosError<unknown> {
+    return AxiosUtil.isAxiosRequestErrorWithCode(error, 409);
+  }
+
+  public static isAxiosRequestErrorWithCode(error: unknown, status: number): error is AxiosError<unknown> {
+    return isAxiosError(error) && error.response?.status === status;
+  }
+}

package/src/utils/AxiosUtil/index.ts

@@ -0,0 +1 @@
+export * from './AxiosUtil';

package/src/utils/CaseSelectionUtil/CaseSelectionUtil.ts

@@ -0,0 +1,32 @@
+import intersection from 'lodash/intersection';
+
+export class CaseSelectionUtil {
+  public static addComponentCaseIdsToSelection(componentCaseIds: string[], selectedIds: string[]): string[] {
+    const caseIds = [...selectedIds, ...componentCaseIds];
+    return Array.from(new Set(caseIds));
+  }
+
+  public static removeComponentCaseIdsFromSelection(componentCaseIds: string[], selectedIds: string[]): string[] {
+    return selectedIds.filter(caseId => !componentCaseIds.includes(caseId));
+  }
+
+  public static refineSelectionWithComponentCaseIds(componentCaseIds: string[], selectedIds: string[]): string[] {
+    return componentCaseIds.filter(caseId => selectedIds.includes(caseId));
+  }
+
+  public static canAddToSelection(componentCaseIds: string[], selectedIds: string[]): boolean {
+    const intersectedCaseIds = intersection(componentCaseIds, selectedIds);
+    return intersectedCaseIds.length !== componentCaseIds.length;
+  }
+
+  public static canRemoveFromSelection(componentCaseIds: string[], selectedIds: string[]): boolean {
+    const intersectedCaseIds = intersection(componentCaseIds, selectedIds);
+    return intersectedCaseIds.length > 0;
+  }
+
+  public static canRefineSelection(componentCaseIds: string[], selectedIds: string[]): boolean {
+    const intersectedCaseIds = intersection(componentCaseIds, selectedIds);
+    const negationResult = intersectedCaseIds.length === 0 || (intersectedCaseIds.length === componentCaseIds.length && intersectedCaseIds.length === selectedIds.length);
+    return !negationResult;
+  }
+}

package/src/utils/CaseSelectionUtil/index.ts

@@ -0,0 +1 @@
+export * from './CaseSelectionUtil';

package/src/utils/CaseSetUtil/CaseSetUtil.ts

@@ -0,0 +1,13 @@
+import { StringUtil } from '../StringUtil';
+import type { CaseSet } from '../../api';
+import { WindowManager } from '../../classes/managers/WindowManager';
+
+export class CaseSetUtil {
+  public static createCaseSetLink(caseSet: CaseSet, full?: boolean): string {
+    const path = `/events/${StringUtil.createSlug(caseSet.name)}/${caseSet.id}`;
+    if (full) {
+      return `${WindowManager.instance.window.location.origin}${path}`;
+    }
+    return path;
+  }
+}

package/src/utils/CaseSetUtil/index.ts

@@ -0,0 +1 @@
+export * from './CaseSetUtil';

package/src/utils/CaseTypeUtil/CaseTypeUtil.ts

@@ -0,0 +1,178 @@
+import uniq from 'lodash/uniq';
+
+import { StringUtil } from '../StringUtil';
+import type {
+  CaseType,
+  CompleteCaseType,
+  RefDim,
+  RefCol,
+  Col,
+  Dim,
+} from '../../api';
+import {
+  DimType,
+  ColType,
+} from '../../api';
+import { WindowManager } from '../../classes/managers/WindowManager';
+
+export const SELECTION_FILTER_GROUP = 'selection';
+export const TREE_FILTER_GROUP = 'tree';
+
+export class CaseTypeUtil {
+  public static createCaseTypeLink(caseType: CaseType | CompleteCaseType, full?: boolean): string {
+    const path = `/cases/${StringUtil.createSlug(caseType.name)}/${caseType.id}`;
+    if (full) {
+      return `${WindowManager.instance.window.location.origin}${path}`;
+    }
+    return path;
+  }
+
+  public static getInitialVisibleColIds(completeCaseType: CompleteCaseType): string[] {
+    const visibleColumnIds: string[] = [];
+
+    completeCaseType.ordered_dim_ids.map(x => completeCaseType.dims[x]).forEach((dim) => {
+      const refDims = completeCaseType.ref_dims[dim.ref_dim_id];
+
+      const cols = completeCaseType.ordered_col_ids_by_dim[dim.id].map(id => completeCaseType.cols[id]);
+      const refCols = cols.map(col => completeCaseType.ref_cols[col.ref_col_id]);
+
+      if (refDims.dim_type === DimType.GEO) {
+        visibleColumnIds.push(CaseTypeUtil.getPreferredGEOCol(cols).id);
+      } else if (refDims.dim_type === DimType.TIME || refDims.dim_type === DimType.NUMBER || CaseTypeUtil.isGeneticDistanceDim(refDims, refCols)) {
+        visibleColumnIds.push(CaseTypeUtil.getPreferredColInDimHavingHighestRank(cols, completeCaseType).id);
+      } else {
+        visibleColumnIds.push(...cols.filter(cc => {
+          const refCol = completeCaseType.ref_cols[cc.ref_col_id];
+          const hiddenColTypes: ColType[] = [ColType.GENETIC_READS, ColType.GENETIC_SEQUENCE];
+          return !hiddenColTypes.includes(refCol.col_type);
+        }).map(c => c.id));
+      }
+    });
+
+    return visibleColumnIds;
+  }
+
+  public static getDimLabel(completeCaseType: CompleteCaseType, dimId: string): string {
+    const dim = completeCaseType.dims[dimId];
+    return dim.code;
+  }
+
+  public static isGeneticDistanceDim(refDim: RefDim, refCols: RefCol[]): boolean {
+    return refDim.dim_type === DimType.OTHER && refCols.find(refCol => refCol.col_type === ColType.GENETIC_DISTANCE) !== undefined;
+  }
+
+  public static getPreferredGEOCol(cols: Col[]): Col {
+    return cols[Math.min(cols.length - 1, Math.floor((cols.length - 1) / 2))];
+  }
+
+  public static getPreferredColInDimHavingHighestRank(cols: Col[], completeCaseType: CompleteCaseType): Col {
+    return cols.find(col => completeCaseType.ref_cols[col.ref_col_id].rank === 1) ?? cols?.[0];
+  }
+
+  public static getDims(completeCaseType: CompleteCaseType, dimTypes?: DimType[]): Dim[] {
+    const dims = Object.values(completeCaseType.ordered_dim_ids).map(x => completeCaseType.dims[x]);
+    if (!dimTypes?.length) {
+      return dims;
+    }
+    return dims.filter(dim => {
+      const refDim = completeCaseType.ref_dims[dim.ref_dim_id];
+      return dimTypes.includes(refDim.dim_type);
+    });
+  }
+
+  public static getCols(completeCaseType: CompleteCaseType, dimId?: string): Col[] {
+    if (!dimId) {
+      return Object.values(completeCaseType.cols);
+    }
+    return completeCaseType.ordered_col_ids_by_dim[dimId].map(id => completeCaseType.cols[id]);
+  }
+
+
+  /**
+   * Get columns by their column type.
+   * @param completeCaseType The complete case type object.
+   * @param colType The column type to filter by.
+   * @returns An array of columns matching the specified column type.
+   */
+  public static getColsByType(completeCaseType: CompleteCaseType, colType: ColType[]): Col[] {
+    return Object.values(completeCaseType.cols).filter(col => {
+      const refCol = completeCaseType.ref_cols[col.ref_col_id];
+      return colType.includes(refCol?.col_type);
+    });
+  }
+
+
+  /**
+   * Find a unique column by its column ID or column ID.
+   * @param completeCaseType The complete case type object.
+   * @param id The ID of the column or column.
+   * @returns The unique column if found, otherwise null.
+   */
+  public static findUniqueColByColIdRefOrColId(completeCaseType: CompleteCaseType, id: string): Col {
+    const colId = Object.values(completeCaseType.cols).find(col => col.ref_col_id === id);
+    if (colId) {
+      return colId;
+    }
+    const colIds = Object.values(completeCaseType.ref_cols).filter(ref_col => ref_col.id === id);
+    if (colIds.length !== 1) {
+      return null;
+    }
+    const cols = Object.values(completeCaseType.cols).filter(col => col.ref_col_id === colIds[0].id);
+    if (cols.length !== 1) {
+      return null;
+    }
+    return cols[0];
+  }
+
+
+  /**
+   * Find paired FWD/REV columns in the same dimension.
+   * @param completeCaseType The complete case type object.
+   * @returns An array of paired FWD/REV columns.
+   */
+  public static findPairedReadsCols(completeCaseType: CompleteCaseType): { fwd: Col; rev: Col }[] {
+    const pairs: { fwd: Col; rev: Col }[] = [];
+
+    completeCaseType.ordered_dim_ids.forEach(dimId => {
+      const cols = completeCaseType.ordered_col_ids_by_dim[dimId].map(x => completeCaseType.cols[x]);
+      if (!cols) {
+        return;
+      }
+      const readsColumns = cols.filter(col => {
+        const refCol = completeCaseType.ref_cols[col.ref_col_id];
+        return refCol?.col_type === ColType.GENETIC_READS;
+      });
+
+      if (readsColumns.length === 2) {
+        pairs.push({ fwd: readsColumns[0], rev: readsColumns[1] });
+      }
+
+    });
+
+    return pairs;
+  }
+
+  public static getWritableColIds(completeCaseType: CompleteCaseType): string[] {
+    const writableColIds: string[] = [];
+    Object.values(completeCaseType.case_type_access_abacs).forEach((abac) => {
+      writableColIds.push(...abac.write_col_ids);
+    });
+    return uniq(writableColIds);
+  }
+
+  public static getWritableImportExportColIds(completeCaseType: CompleteCaseType): string[] {
+    const writableColIds = CaseTypeUtil.getWritableColIds(completeCaseType);
+    return Object.keys(completeCaseType.cols).filter(colId => {
+      if (!writableColIds.includes(colId)) {
+        return false;
+      }
+      const col = completeCaseType.cols[colId];
+      const refCol = completeCaseType.ref_cols[col.ref_col_id];
+      if (([ColType.GENETIC_DISTANCE, ColType.GENETIC_PROFILE, ColType.GENETIC_READS, ColType.GENETIC_SEQUENCE] as ColType[]).includes(refCol.col_type)) {
+        return false;
+      }
+      return true;
+    });
+  }
+
+}

package/src/utils/CaseTypeUtil/index.ts

@@ -0,0 +1 @@
+export * from './CaseTypeUtil';