Trying to migrate to 2.0.0

OPEN-ENT-NG · Jan 13, 2025 · d034ef4 · d034ef4
1 parent ab3a461
commit d034ef4
Show file tree

Hide file tree

Showing 65 changed files with 277 additions and 178 deletions.
diff --git a/docker-compose.yml b/docker-compose.yml
@@ -11,8 +11,10 @@ services:
       MAVEN_CONFIG: /var/maven/.m2
 
   node:
-    image: opendigitaleducation/node:16-alpine-pnpm
+    image: opendigitaleducation/node:20-alpine-pnpm
     working_dir: /home/node/app
+    environment:
+      - TIPTAP_PRO_TOKEN
     volumes:
-    - ./:/home/node/app
-    - ~/.npm:/.npm
+      - ./:/home/node/app
+      - ~/.pnpm:/.pnpm
diff --git a/frontend/.gitignore b/frontend/.gitignore
@@ -37,4 +37,9 @@ pnpm-lock.yaml
 .env.local
 
 # Turborepo
-.turbo
+.turbo
+
+#2.0.0
+*.tsbuildinfo
+.nx/cache
+.nx/workspace-data
diff --git a/frontend/index.html b/frontend/index.html
@@ -1,18 +1,16 @@
 <!doctype html>
 <html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Magnéto</title>
+    <link rel="icon" id="favicon" href="" />
+    <base href="/" />
+  </head>
 
-<head>
-  <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>Magnéto</title>
-  <link rel="icon" id="favicon" href="" />
-  <link rel="stylesheet" href="/assets/themes/edifice-bootstrap/index.css" />
-</head>
-
-<body>
-  <div id="root"></div>
-  <div id="portal"></div>
-  <script type="module" src="/src/main.tsx"></script>
-</body>
-
-</html>
+  <body>
+    <div id="root"></div>
+    <div id="portal"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>
diff --git a/frontend/nx.json b/frontend/nx.json
@@ -0,0 +1,20 @@
+{
+  "$schema": "./node_modules/nx/schemas/nx-schema.json",
+  "targetDefaults": {
+    "build": {
+      "outputs": ["{projectRoot}/dist"],
+      "cache": true
+    },
+    "coverage": {
+      "outputs": ["{projectRoot}/coverage"],
+      "cache": true
+    },
+    "lint": {
+      "cache": true
+    },
+    "test": {
+      "cache": true
+    }
+  },
+  "defaultBase": "main"
+}
diff --git a/frontend/package.json b/frontend/package.json
@@ -51,89 +51,103 @@
     "@dnd-kit/core": "6.1.0",
     "@dnd-kit/sortable": "8.0.0",
     "@dnd-kit/utilities": "3.2.2",
-    "@edifice-ui/editor": "1.5.23",
-    "@edifice-ui/icons": "1.5.23",
-    "@edifice-ui/react": "1.5.23",
+    "@edifice.io/react": "latest",
+    "@edifice.io/bootstrap": "latest",
+    "@edifice.io/client": "latest",
     "@emotion/react": "11.11.1",
     "@emotion/styled": "11.11.0",
     "@mui/icons-material": "5.15.0",
     "@mui/material": "5.15.0",
     "@mui/x-data-grid": "^7.22.2",
     "@mui/x-data-grid-generator": "^7.22.2",
-    "@react-spring/web": "9.7.3",
+    "@react-spring/web": "^9.7.5",
     "@reduxjs/toolkit": "^2.0.1",
-    "@tanstack/react-query": "4.36.1",
+    "@tanstack/react-query": "5.62.7",
+    "@uidotdev/usehooks": "2.4.1",
     "@types/katex": "^0.16.7",
     "@types/papaparse": "^5.3.15",
     "dayjs": "1.11.10",
     "dompurify": "^3.1.6",
     "filesize": "10.1.6",
     "html-react-parser": "^5.1.18",
-    "i18next": "23.5.1",
-    "i18next-http-backend": "2.2.2",
+    "i18next": "23.8.1",
+    "i18next-http-backend": "2.4.2",
+    "ode-explorer": "develop-pedago",
     "immutability-helper": "^3.1.1",
     "katex": "^0.16.11",
     "material-icons": "^1.13.12",
     "papaparse": "^5.4.1",
     "pdfjs-dist": "4.4.168",
-    "react": "18.2.0",
+    "react": "^18.3.1",
     "react-dnd": "^16.0.1",
     "react-dnd-html5-backend": "^16.0.1",
-    "react-dom": "18.2.0",
-    "react-error-boundary": "4.0.11",
-    "react-hook-form": "7.47.0",
+    "react-dom": "^18.3.1",
+    "react-error-boundary": "4.0.13",
+    "react-hook-form": "^7.53.0",
     "react-hot-toast": "2.4.1",
-    "react-i18next": "13.3.0",
+    "react-i18next": "14.1.0",
     "react-infinite-scroll-component": "6.1.0",
     "react-intersection-observer": "9.5.2",
     "react-pdf": "9.1.1",
     "react-player": "^2.16.0",
     "react-redux": "^9.1.0",
-    "react-router-dom": "6.16.0",
+    "react-router-dom": "^6.27.0",
     "swiper": "10.3.1",
     "xlsx": "^0.18.5",
-    "zustand": "4.4.3"
+    "zustand": "^4.5.5"
   },
   "devDependencies": {
-    "@axe-core/react": "4.8.0",
+    "@axe-core/react": "^4.10.0",
     "@mdi/font": "^7.0.96",
     "@mdi/js": "7.4.47",
     "@mdi/react": "1.6.1",
-    "@tanstack/react-query-devtools": "4.36.1",
-    "@testing-library/react": "^14.0.0",
+    "@tanstack/react-query-devtools": "^5.59.13",
+    "@testing-library/react": "^16.0.1",
+    "@testing-library/jest-dom": "^6.5.0",
+    "@testing-library/user-event": "^14.5.2",
     "@types/dompurify": "^3.0.5",
     "@types/node": "20.8.5",
-    "@types/react": "18.2.28",
-    "@types/react-dom": "18.2.13",
+    "@types/react": "^18.3.11",
+    "@types/react-dom": "^18.3.1",
     "@types/react-html-parser": "^2.0.6",
     "@typescript-eslint/eslint-plugin": "6.7.5",
     "@typescript-eslint/parser": "6.7.5",
-    "@vitejs/plugin-react": "4.1.0",
-    "clsx": "2.0.0",
+    "@vitejs/plugin-react": "^4.3.2",
+    "@vitest/coverage-v8": "^2.1.3",
+    "@vitest/ui": "^2.1.3",
+    "@eslint/js": "^9.12.0",
+    "clsx": "^2.1.1",
     "concurrently": "8.2.1",
     "csstype": "3.1.2",
     "dotenv-cli": "^7.4.2",
-    "edifice-ts-client": "1.7.4",
-    "eslint": "8.51.0",
+    "@edifice.io/client": "2.0.0",
+    "eslint": "^9.16.0",
     "eslint-config-prettier": "9.0.0",
     "eslint-plugin-import": "2.28.1",
     "eslint-plugin-jsx-a11y": "6.7.1",
     "eslint-plugin-react": "7.33.2",
-    "eslint-plugin-react-hooks": "4.6.0",
+    "eslint-plugin-react-hooks": "^5.1.0-rc.0",
+    "eslint-plugin-react-refresh": "^0.4.12",
     "happy-dom": "12.9.1",
-    "husky": "8.0.3",
+    "globals": "^15.11.0",
+    "husky": "^9.1.6",
+    "jsdom": "^25.0.1",
+    "msw": "^2.4.11",
+    "nx": "19.6.0",
+    "typescript-eslint": "^8.8.1",
     "i18next-browser-languagedetector": "7.2.1",
-    "lint-staged": "14.0.1",
-    "prettier": "3.0.3",
+    "lint-staged": "15.2.9",
+    "prettier": "^3.3.3",
     "sass": "1.69.5",
-    "typescript": "5.2.2",
-    "vite": "4.4.11",
-    "vite-tsconfig-paths": "4.2.1",
-    "vitest": "0.34.6",
+    "typescript": "^5.6.3",
+    "vite": "^5.4.6",
+    "vite-tsconfig-paths": "^5.0.1",
+    "vitest": "^2.1.3",
     "vitest-dom": "0.1.1"
   },
-  "packageManager": "pnpm@8.6.6",
+  "packageManager": "pnpm@9.12.2",
   "engines": {
-    "node": "16 || 18"
-  }
+    "node": "20"
+  },
+  "nx": {}
 }
diff --git a/frontend/package.json.template b/frontend/package.json.template
@@ -44,7 +44,7 @@
     ]
   },
   "dependencies": {
-    "@edifice-ui/icons": "%packageVersion%",
+    "@edifice.io/react/icons": "%packageVersion%",
     "@edifice-ui/react": "%packageVersion%",
     "@edifice-wisemapping/editor": "0.7.3",
     "@react-spring/web": "9.7.3",
@@ -79,7 +79,7 @@
     "clsx": "2.0.0",
     "concurrently": "8.2.1",
     "csstype": "3.1.2",
-    "edifice-ts-client": "%packageVersion%",
+    "@edifice.io/client": "%packageVersion%",
     "eslint": "8.51.0",
     "eslint-config-prettier": "9.0.0",
     "eslint-plugin-import": "2.28.1",

diff --git a/frontend/scripts/package.cjs b/frontend/scripts/package.cjs
@@ -5,6 +5,38 @@ const now = new Date();
 
 const BRANCH = executeGitCommand("git rev-parse --abbrev-ref HEAD");
 
+function getCorrectVersion(lib) {
+  let branch;
+  switch (BRANCH) {
+    case "main": {
+      branch = executeGitCommand(`npm view ${lib} version`);
+      break;
+    }
+
+    case "develop": {
+      branch = "develop";
+      break;
+    }
+
+    case "develop-pedago": {
+      branch = "develop-pedago";
+      break;
+    }
+
+    case "develop-b2school": {
+      branch = "develop-b2school";
+      break;
+    }
+
+    default: {
+      branch = "develop";
+      break;
+    }
+  }
+
+  return branch;
+}
+
 function executeGitCommand(command) {
   return execSync(command)
     .toString("utf8")
@@ -42,18 +74,16 @@ function generatePackage(content) {
 }
 
 function generateDeps(content) {
-  return {
-    ...content.dependencies,
-    "@edifice-ui/icons": BRANCH,
-    "@edifice-ui/react": BRANCH,
-  };
-}
+  const deps = { ...content.dependencies };
+
+  // Find all @edifice.io dependencies and update their versions
+  Object.keys(deps).forEach((dep) => {
+    if (dep.startsWith("@edifice.io/")) {
+      deps[dep] = getCorrectVersion(dep);
+    }
+  });
 
-function generateDevDeps(content) {
-  return {
-    ...content.devDependencies,
-    "edifice-ts-client": BRANCH,
-  };
+  return deps;
 }
 
 function createPackage() {
@@ -73,7 +103,6 @@ function createPackage() {
 
       content.version = version;
       content.dependencies = generateDeps(content);
-      content.devDependencies = generateDevDeps(content);
 
       generatePackage(content);
     },

diff --git a/frontend/src/app/root/index.tsx b/frontend/src/app/root/index.tsx
@@ -1,7 +1,7 @@
-import { LoadingScreen, Layout, useOdeClient } from "@edifice-ui/react";
+import { LoadingScreen, Layout, useEdificeClient } from "@edifice-ui/react";
 import { Outlet } from "react-router-dom";
 function Root() {
-  const { init } = useOdeClient();
+  const { init } = useEdificeClient();
 
   if (!init) return <LoadingScreen position={false} />;
 

diff --git a/frontend/src/common/ShareModal/ShareBookmark.tsx b/frontend/src/common/ShareModal/ShareBookmark.tsx
@@ -1,6 +1,6 @@
 import { Ref } from "react";
 
-import { Save } from "@edifice-ui/icons";
+import { IconSave } from "@edifice.io/react/icons";
 import { FormControl, Button } from "@edifice-ui/react";
 import { useTranslation } from "react-i18next";
 
@@ -40,7 +40,7 @@ export const ShareBookmark = ({
           color="primary"
           variant="ghost"
           disabled={bookmark.name.length === 0}
-          leftIcon={<Save />}
+          leftIcon={<IconSave />}
           onClick={onSave}
           className="text-nowrap"
         >

diff --git a/frontend/src/common/ShareModal/ShareBookmarkLine.tsx b/frontend/src/common/ShareModal/ShareBookmarkLine.tsx
@@ -1,11 +1,15 @@
-import { Bookmark, Close, RafterDown } from "@edifice-ui/icons";
+import {
+  IconBookmark,
+  IconClose,
+  IconRafterDown,
+} from "@edifice.io/react/icons";
 import { Avatar, Button, Checkbox, IconButton } from "@edifice-ui/react";
 import {
   ShareRight,
   ShareRightAction,
   ShareRightActionDisplayName,
   ShareRightWithVisibles,
-} from "edifice-ts-client";
+} from "@edifice.io/client";
 import { useTranslation } from "react-i18next";
 
 import { hasRight } from "./utils/hasRight";
@@ -47,15 +51,15 @@ export const ShareBookmarkLine = ({
               />
             )}
 
-            {shareRight.type === "sharebookmark" && <Bookmark />}
+            {shareRight.type === "sharebookmark" && <IconBookmark />}
           </td>
           <td>
             <div className="d-flex">
               {shareRight.type === "sharebookmark" && (
                 <Button
                   color="tertiary"
                   rightIcon={
-                    <RafterDown
+                    <IconRafterDown
                       title={t("show")}
                       className="w-16 min-w-0"
                       style={{
@@ -94,7 +98,7 @@ export const ShareBookmarkLine = ({
               <IconButton
                 aria-label={t("close")}
                 color="tertiary"
-                icon={<Close />}
+                icon={<IconClose />}
                 type="button"
                 variant="ghost"
                 title={t("close")}