chore: 4.18.0

documentation/package.json

@@ -16,7 +16,7 @@
 		"astro-mermaid": "^1.2.0",
 		"mermaid": "^11.12.2",
 		"typescript": "^5.9.3",
-		"zod": "^4.3.5"
+		"zod": "^3.25.76"
 	},
 	"devDependencies": {
 		"sharp": "^0.34.5"

package.json

@@ -1,6 +1,6 @@
 {
   "name": "bauhaus",
-  "version": "4.17.0",
+  "version": "4.18.0-rc2",
   "type": "module",
   "description": "Web application for the management of concepts, classifications and other statistical objects",
   "repository": {
@@ -91,6 +91,7 @@
     "draftjs-md-converter": "1.5.2",
     "events": "^3.3.0",
     "file-saver": "1.3.3",
+    "highlight.js": "^11.11.1",
     "i18next": "^25.5.3",
     "oidc-spa": "^5.3.0",
     "primeflex": "^4.0.0",
@@ -103,11 +104,8 @@
     "react-dropzone": "11.0.1",
     "react-i18next": "^16.0.0",
     "react-modal": "^3.14.4",
-    "react-redux": "^7.2.6",
     "react-router-dom": "6.27.0",
     "react-sliding-side-panel": "1.1.8",
-    "redux": "^4.2.0",
-    "redux-thunk": "^2.4.2",
     "typescript": "5.7.3",
     "zod": "^4.0.0"
   }

src/index.tsx

@@ -1,6 +1,5 @@
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { createRoot } from "react-dom/client";
-import { Provider } from "react-redux";
 
 import { ApplicationTitle } from "@components/application-title";
 
@@ -11,7 +10,6 @@ import Root from "./packages/application/router";
 import { OidcProvider } from "./packages/auth/create-oidc";
 import BackToTop from "./packages/components/back-to-top";
 import D from "./packages/deprecated-locales";
-import configureStore from "./packages/redux/configure-store";
 import "./packages/styles/main.scss";
 import { getLang } from "./packages/utils/dictionnary";
 
@@ -50,7 +48,6 @@ const renderApp = (
   props?: { home: true },
 ) => {
   const { authType, lg1, lg2, version, ...properties } = initState;
-  const store = configureStore({});
 
   document.querySelector("html")!.setAttribute("lang", getLang());
 
@@ -60,21 +57,19 @@ const renderApp = (
   root.render(
     <OidcProvider fallback={<>Checking authentication ⌛️</>}>
       <QueryClientProvider client={queryClient}>
-        <Provider store={store}>
-          <AppContextProvider
-            lg1={lg1}
-            lg2={lg2}
-            version={version}
-            properties={properties}
-            authType={authType}
-          >
-            <ApplicationTitle />
-            <main>
-              <Component {...props} />
-              <BackToTop />
-            </main>
-          </AppContextProvider>
-        </Provider>
+        <AppContextProvider
+          lg1={lg1}
+          lg2={lg2}
+          version={version}
+          properties={properties}
+          authType={authType}
+        >
+          <ApplicationTitle />
+          <main>
+            <Component {...props} />
+            <BackToTop />
+          </main>
+        </AppContextProvider>
       </QueryClientProvider>
     </OidcProvider>,
   );

src/packages/components/business/creators-view/index.tsx

@@ -14,7 +14,10 @@ interface OrganisationMapperProps {
  * Uses the V2 stamps map to retrieve organisation names.
  * Falls back to displaying the ID if no label is found.
  */
-const InseeOrganisationProvider = ({ organisations, children }: OrganisationMapperProps) => {
+const InseeOrganisationProvider = ({
+  organisations,
+  children,
+}: Readonly<OrganisationMapperProps>) => {
   const stampsMap = useV2StampsMap();
 
   const mappedLabels = useMemo(() => {
@@ -52,7 +55,11 @@ export const InseeOrganisationList = ({
   return (
     <InseeOrganisationProvider organisations={organisations}>
       {(response) => (
-        <List<string> items={response} getContent={(item) => item} getKey={(item) => item} />
+        <List<string>
+          items={response}
+          getContent={(item) => item}
+          getKey={(item, index) => item || `org-${index}`}
+        />
       )}
     </InseeOrganisationProvider>
   );
@@ -90,7 +97,11 @@ export const InseeOrganisationNotes = ({
           organisationsArray.length === 1 ? (
             <p>{response[0]}</p>
           ) : (
-            <List<string> items={response} getContent={(item) => item} getKey={(item) => item} />
+            <List<string>
+              items={response}
+              getContent={(item) => item}
+              getKey={(item, index) => item || `org-${index}`}
+            />
           );
 
         return <Note text={text} title={D1.creatorTitle} alone={true} allowEmpty={true} />;

src/packages/components/ui/list/index.tsx

@@ -3,21 +3,21 @@ import { ReactNode } from "react";
 interface ListTypes<T> {
   items: T[];
   getContent?: (value: T) => string | ReactNode;
-  getKey?: (value: T) => string;
+  getKey?: (value: T, index: number) => string;
 }
 
 export const List = <T,>({
   items,
   getContent = (value: T) => String(value),
-  getKey = (value: T) => String(value),
+  getKey = (value: T, index: number) => String(value) || `item-${index}`,
 }: Readonly<ListTypes<T>>) => {
   if (!items || items.length === 0) {
     return null;
   }
   return (
     <ul>
-      {items.map((item) => (
-        <li key={getKey(item)}>{getContent(item)}</li>
+      {items.map((item, index) => (
+        <li key={getKey(item, index)}>{getContent(item)}</li>
       ))}
     </ul>
   );

src/packages/components/ui/select/index.tsx

@@ -22,7 +22,7 @@ export const Select = ({
   multi = false,
   required = false,
   filter = false,
-}: SelectProps) => {
+}: Readonly<SelectProps>) => {
   return (
     <>
       {required ? <LabelRequired>{label}</LabelRequired> : <label>{label}</label>}

src/packages/modules-classifications/hooks/useClassificationLevel.ts

@@ -0,0 +1,44 @@
+import { useQuery } from "@tanstack/react-query";
+
+import { ClassificationsApi } from "@sdk/classification";
+
+interface LevelGeneral {
+  id: string;
+  classificationId: string;
+  prefLabelLg1: string;
+  prefLabelLg2?: string;
+  [key: string]: unknown;
+}
+
+interface LevelMember {
+  id: string;
+  label: string;
+  [key: string]: unknown;
+}
+
+interface Level {
+  general: LevelGeneral;
+  members: LevelMember[];
+}
+
+export const useClassificationLevel = (
+  classificationId: string,
+  levelId: string,
+): { isLoading: boolean; level?: Level } => {
+  const { isLoading: isLoadingGeneral, data: general } = useQuery<LevelGeneral>({
+    queryKey: ["classification-level-general", classificationId, levelId],
+    queryFn: () => ClassificationsApi.getClassificationLevelGeneral(classificationId, levelId),
+    enabled: !!classificationId && !!levelId,
+  });
+
+  const { isLoading: isLoadingMembers, data: members } = useQuery<LevelMember[]>({
+    queryKey: ["classification-level-members", classificationId, levelId],
+    queryFn: () => ClassificationsApi.getClassificationLevelMembers(classificationId, levelId),
+    enabled: !!classificationId && !!levelId,
+  });
+
+  const isLoading = isLoadingGeneral || isLoadingMembers;
+  const level = general && members ? { general, members } : undefined;
+
+  return { isLoading, level };
+};

src/packages/modules-classifications/level/home-container.jsx

@@ -1,30 +1,16 @@
-import { useEffect } from "react";
-import { connect, useSelector } from "react-redux";
 import { useParams } from "react-router-dom";
 
 import { Loading } from "@components/loading";
 
-import loadLevel from "../../redux/actions/classifications/level";
-import { getLevel } from "../../redux/classifications/level";
+import { useClassificationLevel } from "../hooks/useClassificationLevel";
 import { useSecondLang } from "../../utils/hooks/second-lang";
 import LevelVisualization from "./home";
 
-const LevelVisualizationContainer = ({ loadLevel }) => {
+export const Component = () => {
   const { classificationId, levelId } = useParams();
-  const level = useSelector((state) => getLevel(state, classificationId, levelId));
+  const { isLoading, level } = useClassificationLevel(classificationId, levelId);
   const [secondLang] = useSecondLang();
 
-  const currentLevelId = level?.id;
-  useEffect(() => {
-    if (currentLevelId !== levelId) loadLevel(classificationId, levelId);
-  }, [currentLevelId, classificationId, levelId, loadLevel]);
-
-  if (!level) return <Loading />;
+  if (isLoading || !level) return <Loading />;
   return <LevelVisualization level={level} secondLang={secondLang} />;
 };
-
-const mapDispatchToProps = {
-  loadLevel,
-};
-
-export const Component = connect(undefined, mapDispatchToProps)(LevelVisualizationContainer);