PXP-11331: update to mantine7 mantine react table v2

.eslintignore

@@ -1,3 +1,11 @@
 dist
 *.css
 setupTests.ts
+node_modules
+packages/core/node_modules
+packages/core/dist
+packages/frontend/node_modules
+packages/frontend/dist
+packages/sampleCommons/node_modules
+packages/tools/node_modules
+packages/tools/dist

package.json

@@ -11,7 +11,7 @@
     "node": ">=20.11.0"
   },
   "scripts": {
-    "lint": "eslint .",
+    "lint": "lerna run --parallel lint",
     "lint-fix": "eslint . --fix",
     "oxlint": "oxlint .",
     "build": "lerna run build",
@@ -28,22 +28,18 @@
   "author": "",
   "license": "Apache-2.0",
   "dependencies": {
+    "@mantine/core": "^7.12.1",
+    "@mantine/form": "^7.12.1",
+    "@mantine/hooks": "^7.12.1",
+    "@mantine/modals": "^7.12.1",
+    "@mantine/notifications": "^7.12.1",
     "classnames": "^2.3.1",
     "dom-to-svg": "^0.12.2",
     "isomorphic-fetch": "^3.0.0",
-    "oxlint": "^0.7.2",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-responsive-carousel": "^3.2.23",
-    "url-join": "^5.0.0",
-    "@mantine/core": "^6.0.22",
-    "@mantine/form": "^6.0.22",
-    "@mantine/hooks": "^6.0.22",
-    "@mantine/dates": "^6.0.22",
-    "@mantine/modals": "^6.0.22",
-    "@mantine/next": "^6.0.22",
-    "@tabler/icons-react" : "^3.10.0",
-    "@mantine/notifications": "^6.0.22"
+    "url-join": "^5.0.0"
   },
   "devDependencies": {
     "@axe-core/react": "^4.10.0",
@@ -57,17 +53,26 @@
     "@types/react": "^18.2.21",
     "@typescript-eslint/eslint-plugin": "^5.62.0",
     "@typescript-eslint/parser": "^5.62.0",
-    "eslint": "^8.20.0",
+    "autoprefixer": "^10.4.20",
+    "eslint": "8.56.0",
+    "eslint-config-next": "^14.2.6",
     "eslint-config-prettier": "^8.8.0",
     "eslint-plugin-import": "^2.27.5",
     "eslint-plugin-jsx-a11y": "^6.6.1",
+    "eslint-plugin-prettier": "^5.2.1",
     "eslint-plugin-react": "^7.30.1",
     "eslint-plugin-react-hooks": "^4.6.0",
     "jest-canvas-mock": "^2.4.0",
     "jest-environment-jsdom": "^29.7.0",
     "lerna": ">=6.6.2 <7.0.0",
-    "prettier": "^2.7.1",
+    "oxlint": "^0.7.2",
+    "postcss-import": "^16.1.0",
+    "postcss-modules": "^6.0.0",
+    "postcss-preset-mantine": "^1.17.0",
+    "prettier": "^3.3.3",
     "rollup": "^3.29.4",
+    "rimraf": "^6.0.1",
+    "rollup-plugin-postcss": "^4.0.2",
     "rollup-plugin-swc3": "^0.10.2",
     "rollup-swc-preserve-directives": "^0.5.0",
     "terser-webpack-plugin": "^5.3.3",

packages/core/.eslintignore

@@ -0,0 +1,4 @@
+dist
+*.css
+setupTests.ts
+node_modules

packages/core/package.json

@@ -24,6 +24,7 @@
     }
   },
   "scripts": {
+    "lint": "eslint .",
     "compile": "tsc",
     "clean": "rimraf dist",
     "types": "tsc --emitDeclarationOnly",
@@ -41,8 +42,6 @@
     "react-dom": "^18.2.0"
   },
   "devDependencies": {
-    "@rollup/plugin-json": "^6.0.0",
-    "@rollup/plugin-terser": "^0.4.3",
     "@swc/wasm": "^1.3.85",
     "@testing-library/react": "^14.0.0",
     "@types/estree": "^1.0.0",
@@ -53,14 +52,7 @@
     "@types/jsonpath-plus": "5.0.5",
     "@types/lodash": "^4.14.191",
     "@types/papaparse": "^5.3.14",
-    "@types/uuid": "^9.0.0",
-    "eslint": "^8.36.0",
-    "jest": "^29.7.0",
-    "rimraf": "^5.0.5",
-    "rollup": "^3.29.2",
-    "rollup-plugin-dts": "^6.0.2",
-    "rollup-plugin-peer-deps-external": "^2.2.4",
-    "ts-jest": "^29.1.2"
+    "@types/uuid": "^9.0.0"
   },
   "dependencies": {
     "@reduxjs/toolkit": "1.9.5",

packages/core/src/features/guppy/index.ts

@@ -1,23 +1,16 @@
 export * from './guppyApi';
 export * from './guppySlice';
-import { downloadFromGuppyToBlob, downloadJSONDataFromGuppy, useGetIndexFields } from './utils';
-import { useDownloadFromGuppyMutation } from './guppyDownloadSlice';
 import {
-  type GuppyDownloadDataParams,
-  type BaseGuppyDataRequest,
-  type GuppyActionFunction,
-  type GuppyActionFunctionParams,
-  type GuppyDownloadActionFunctionParams,
-} from './types';
+  downloadFromGuppyToBlob,
+  downloadJSONDataFromGuppy,
+  useGetIndexFields,
+} from './utils';
+import { useDownloadFromGuppyMutation } from './guppyDownloadSlice';
+export * from './types';
 
 export {
-  type BaseGuppyDataRequest,
-  type GuppyDownloadDataParams,
-  type GuppyActionFunctionParams,
-  type GuppyActionFunction,
-  type GuppyDownloadActionFunctionParams,
   downloadFromGuppyToBlob,
   downloadJSONDataFromGuppy,
   useDownloadFromGuppyMutation,
-  useGetIndexFields
+  useGetIndexFields,
 };

packages/core/src/features/guppy/types.ts

@@ -1,7 +1,6 @@
 import { FilterSet } from '../filters';
 import { Accessibility } from '../../constants';
 
-
 // Guppy data request parameters
 export interface BaseGuppyDataRequest {
   type: string;
@@ -26,20 +25,23 @@ export interface GuppyActionFunctionParams extends Record<string, any> {
 }
 
 export interface GuppyActionParams<T extends Record<string, any>> {
-  parameters: T;              // query parameters for the Guppy request
-  onStart?: () => void;       // function to call when the download starts
+  parameters: T; // query parameters for the Guppy request
+  onStart?: () => void; // function to call when the download starts
   onDone?: (blob: Blob) => void; // function to call when the download is done
   onError?: (error: Error) => void; // function to call when the download fails
-  onAbort?: () => void;      // function to call when the download is aborted
-  signal?: AbortSignal;      // AbortSignal to use for the request
+  onAbort?: () => void; // function to call when the download is aborted
+  signal?: AbortSignal; // AbortSignal to use for the request
 }
 
-export interface GuppyDownloadActionFunctionParams extends GuppyDownloadDataParams {
+export interface GuppyDownloadActionFunctionParams
+  extends GuppyDownloadDataParams {
   filename: string;
 }
 
 // Function type for Guppy actions
-export type GuppyActionFunction<T extends Record<string, any>> = (args:GuppyActionParams<T>) => void;
-
+export type GuppyActionFunction<T extends Record<string, any>> = (
+  args: GuppyActionParams<T>,
+) => void;
 
-export type DownloadFromGuppyParams = GuppyActionParams<GuppyDownloadDataParams>;
+export type DownloadFromGuppyParams =
+  GuppyActionParams<GuppyDownloadDataParams>;

packages/core/src/types/index.ts

@@ -7,11 +7,6 @@ export type JSONObject = {
 };
 export type JSONArray = Array<JSONValue>;
 
-export interface HistogramData {
-  key: string | [number, number];
-  count: number;
-}
-
 // type guard functions
 export const isHistogramRangeData = (key: any): key is [number, number] => {
   return (
@@ -39,17 +34,58 @@ export const isJSONValueArray = (data: JSONValue): data is JSONArray => {
   return Array.isArray(data) && data.every(isJSONValue);
 };
 
+export interface HistogramData {
+  key: string | [number, number];
+  count: number;
+}
+
+const isValidObject = (input: any): boolean =>
+  typeof input === 'object' && input !== null;
+
 export type HistogramDataArray = Array<HistogramData>;
 
 export const isHistogramData = (data: any): data is HistogramData => {
+  return isValidObject(data) && 'key' in data && 'count' in data;
+};
+
+export const isHistogramDataArray = (input: any): input is HistogramData[] => {
+  if (!isValidObject(input) || !Array.isArray(input.histogram)) {
+    return false;
+  }
+  return input.histogram.every(isHistogramData);
+};
+
+export interface HistogramDataCollection {
+  histogram: HistogramDataArray;
+}
+
+export const isHistogramDataCollection = (
+  obj: any,
+): obj is HistogramDataCollection => {
   return (
-    typeof data === 'object' &&
-    data !== null &&
-    'key' in data &&
-    'count' in data
+    isValidObject(obj) && 'histogram' in obj && isHistogramData(obj.histogram)
   );
 };
 
+export interface GuppyAggregationData {
+  [key: string]: HistogramDataCollection;
+}
+
+// Type guard function for GuppyAggregationData interface
+export const isGuppyAggregationData = (
+  obj: any,
+): obj is GuppyAggregationData => {
+  if (!isValidObject(obj)) return false;
+
+  for (const key in obj) {
+    if (!isHistogramDataCollection(obj[key])) {
+      return false;
+    }
+  }
+
+  return true;
+};
+
 export const isHistogramDataAnEnum = (data: unknown): data is HistogramData => {
   return (
     typeof data === 'object' &&

packages/frontend/.eslintignore

@@ -0,0 +1,4 @@
+dist
+*.css
+setupTests.ts
+node_modules

packages/frontend/package.json

@@ -14,6 +14,7 @@
   "module": "dist/esm/index.js",
   "types": "dist/index.d.ts",
   "scripts": {
+    "lint": "eslint .",
     "compile": "tsc",
     "clean": "rimraf dist",
     "rollup": "rollup --config rollup.config.mjs",
@@ -23,7 +24,7 @@
     "test:all": "jest",
     "types": "tsc --emitDeclarationOnly",
     "copy-tailwind": "cp src/tailwind.cjs dist/tailwind.cjs",
-    "build": "npm run compile && npm run types && npm run copy-tailwind && npm run rollup",
+    "build": "npm run compile && npm run types && npm run rollup",
     "build:clean": "npm run clean && npm run build",
     "build:watch": "npm run compile && npm run rollup -- --watch",
     "dev": "npm run build:watch"
@@ -39,27 +40,22 @@
         "default": "./dist/cjs/index.js"
       }
     },
-    "./tailwind": {
-      "require": "./dist/tailwind.cjs"
-    }
+    "./dist/styles.css": "./dist/styles.css"
   },
+  "style": "dist/styles.css",
   "browser": {
     "fs": false,
     "path": false,
     "os": false
   },
   "dependencies": {
-    "@fontsource/montserrat": "^4.5.12",
-    "@fontsource/source-sans-pro": "^4.5.11",
     "@graphiql/react": "^0.23.1",
     "@iconify/react": "^4.0.1",
-    "@mantine/core": "^6.0.22",
-    "@mantine/form": "^6.0.22",
-    "@mantine/hooks": "^6.0.22",
-    "@mantine/dates": "^6.0.22",
-    "@mantine/modals": "^6.0.22",
-    "@mantine/next": "^6.0.22",
-    "@mantine/notifications": "^6.0.22",
+    "@mantine/core": "^7.12.1",
+    "@mantine/form": "^7.12.1",
+    "@mantine/hooks": "^7.12.1",
+    "@mantine/modals": "^7.12.1",
+    "@mantine/notifications": "^7.12.1",
     "@mdx-js/loader": "^2.1.5",
     "@mdx-js/mdx": "^2.1.5",
     "@next/mdx": "^14.1.1",
@@ -68,7 +64,6 @@
     "@tailwindcss/forms": "^0.5.3",
     "@tailwindcss/line-clamp": "^0.4.2",
     "@tailwindcss/typography": "^0.5.7",
-
     "binguru": "^1.0.0-alpha.18.0",
     "chart.js": "^4.0.1",
     "colorette": "^2.0.20",
@@ -86,7 +81,7 @@
     "jose": "^4.15.9",
     "js-cookie": "^3.0.5",
     "jsonpath-plus": "^8.0.0",
-    "mantine-react-table": "^1.3.4",
+    "mantine-react-table": "^2.0.0-beta.6",
     "minisearch": "^6.3.0",
     "next": "^14.2.5",
     "next-compose-plugins": "^2.2.1",
@@ -141,8 +136,6 @@
     "@types/uuid": "^9.0.4",
     "autoprefixer": "^10.4.15",
     "css-loader": "^6.8.1",
-    "eslint": "^8.49.0",
-    "eslint-config-next": "^13.2.4",
     "html-webpack-plugin": "^5.5.0",
     "jest": "^29.5.0",
     "react-what-changed": "^1.1.2",
@@ -161,7 +154,8 @@
   "peerDependencies": {
     "@gen3/core": "^0.10.33",
     "react": "^18.2.0",
-    "react-dom": "^18.2.0"
+    "react-dom": "^18.2.0",
+    "tailwindcss": "^3.4.10"
   },
   "files": [
     "dist"

packages/frontend/postcss.config.js

@@ -0,0 +1,8 @@
+/** @type {import('postcss').Config} */
+module.exports = {
+  plugins: {
+    'postcss-import': {},
+    'postcss-preset-mantine': {},
+    autoprefixer: {},
+  },
+};