v11.23

klee-contrib · Jan 23, 2025 · 17a1353 · 17a1353
1 parent f5f8ef3
commit 17a1353
Show file tree

Hide file tree

Showing 9 changed files with 387 additions and 870 deletions.
diff --git a/index.html b/index.html
@@ -1,6 +1,6 @@
 <html lang="fr">
     <head>
-        <title>Starter Kit Focus v4 - 11.22.3</title>
+        <title>Starter Kit Focus v4 - 11.23.0</title>
         <link rel="preconnect" href="https://fonts.googleapis.com" />
         <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
         <link

diff --git a/mock/utilisateurs/add-utilisateur.mock.ts b/mock/utilisateurs/add-utilisateur.mock.ts
@@ -0,0 +1,31 @@
+import _ from "lodash";
+import {DateTime} from "luxon";
+import {defineMock} from "vite-plugin-mock-dev-server";
+
+import {UtilisateurRead} from "../../src/model/securite/utilisateur/utilisateur-read";
+
+import utilisateurs from "./utilisateurs";
+
+export default defineMock({
+    url: "/api/utilisateurs",
+    method: "POST",
+    delay: 100,
+    body: ({body}) => {
+        const utilisateur: UtilisateurRead = {
+            actif: true,
+            adresse: body.adresse,
+            dateCreation: DateTime.utc().toISO(),
+            dateNaissance: body.dateNaissance,
+            email: body.email,
+            id: _.max(utilisateurs.value.map(u => u.id))! + 1,
+            nom: body.nom,
+            prenom: body.prenom,
+            profilId: body.profilId,
+            typeUtilisateurCode: body.typeUtilisateurCode
+        };
+
+        utilisateurs.value.push(utilisateur);
+
+        return utilisateur;
+    }
+});
diff --git a/mock/utilisateurs/get-utilisateurs.mock.ts b/mock/utilisateurs/get-utilisateurs.mock.ts
@@ -6,10 +6,11 @@ import type {UtilisateurItem} from "../../src/model/securite/utilisateur/utilisa
 
 export default defineMock({
     url: "/api/utilisateurs",
+    method: "GET",
     delay: 100,
     body: () =>
         utilisateurs.value.map(
             ({id, nom, prenom, email, typeUtilisateurCode}) =>
-                ({id, nom, prenom, email, typeUtilisateurCode}) as UtilisateurItem
+                ({id, nom, prenom, email, typeUtilisateurCode} as UtilisateurItem)
         )
 });
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "focus4-starter-kit",
-    "version": "11.22.3",
+    "version": "11.23.0",
     "description": "Starter kit pour Focus V4",
     "repository": "http://www.github.com/klee-contrib/focus4-starter-kit",
     "main": "src/index.ts",
@@ -13,12 +13,12 @@
         "start": "vite"
     },
     "dependencies": {
-        "@focus4/tooling": "11.22.0",
-        "focus4": "11.22.3",
+        "@focus4/tooling": "11.23.0",
+        "focus4": "11.23.0",
         "vite-plugin-mock-dev-server": "1.8.3"
     },
     "devDependencies": {
-        "@flydotio/dockerfile": "0.6.0"
+        "@flydotio/dockerfile": "0.7.3"
     },
     "peerDependencies": {
         "@focus4/collections": "*",
@@ -28,7 +28,7 @@
         "@focus4/stores": "*",
         "@focus4/styling": "*",
         "@focus4/toolbox": "*",
-        "framer-motion": "*",
+        "framer-motion": "11.0.26",
         "i18next": "23",
         "lodash": "*",
         "luxon": "*",

diff --git a/src/views/header.tsx b/src/views/header.tsx
@@ -1,4 +1,5 @@
 import {useObserver} from "mobx-react";
+import {ReactNode} from "react";
 
 import {messageStore} from "@focus4/core";
 import {FilAriane, HeaderItem, HeaderScrolling, HeaderTopRow} from "@focus4/layout";
@@ -11,7 +12,15 @@ import css from "./__style__/header.css";
 
 const theme = toBem(css);
 
-export function Header({icon, paramResolver}: {icon: string; paramResolver?: () => string}) {
+export function Header({
+    children,
+    icon,
+    paramResolver
+}: {
+    children?: ReactNode;
+    icon: string;
+    paramResolver?: () => string;
+}) {
     return useObserver(() => (
         <HeaderScrolling theme={{scrolling: theme.header()}}>
             <HeaderTopRow>
@@ -42,6 +51,7 @@ export function Header({icon, paramResolver}: {icon: string; paramResolver?: ()
                     />
                 </HeaderItem>
             </HeaderTopRow>
+            {children}
         </HeaderScrolling>
     ));
 }
diff --git a/src/views/profils/detail/informations.tsx b/src/views/profils/detail/informations.tsx
@@ -4,7 +4,7 @@ import {fieldFor, Form, SelectChips, selectFor, useFormActions, useFormNode, use
 import {Panel} from "@focus4/layout";
 import {Slider} from "@focus4/toolbox";
 
-import {addProfil, getProfil, updateProfil} from "../../../services/securite/profil/profil";
+import {getProfil, updateProfil} from "../../../services/securite/profil/profil";
 import {profilStore} from "../../../stores/profil";
 import {referenceStore} from "../../../stores/references";
 
@@ -43,14 +43,7 @@ export function ProfilInfos() {
         a
             .params(() => router.state.profils.proId)
             .load(getProfil)
-            .save(pro => {
-                const {proId} = router.state.profils;
-                if (proId) {
-                    return updateProfil(proId, pro);
-                } else {
-                    return addProfil(pro);
-                }
-            })
+            .update(updateProfil)
             .withConfirmation(router)
     );
 

diff --git a/src/views/utilisateurs/detail.tsx b/src/views/utilisateurs/detail.tsx
@@ -26,9 +26,9 @@ import {router} from "../../router";
 
 import css from "./__style__/detail.css";
 
-export function UtilisateurDetail() {
+export function UtilisateurDetail({closePopin}: {closePopin?: () => void}) {
     const entity = useFormNode(utilisateurStore.utilisateur, e =>
-        e
+        (!router.state.utilisateurs.utiId ? e.edit(() => true) : e)
             .remove("id", "dateCreation", "dateModification")
             .patch("profilId", f =>
                 f.metadata({
@@ -45,25 +45,22 @@ export function UtilisateurDetail() {
 
     const actions = useFormActions(entity, a =>
         a
+            .init()
             .params(() => router.state.utilisateurs.utiId)
             .load(getUtilisateur)
-            .save(uti => {
-                const {utiId} = router.state.utilisateurs;
-                if (utiId) {
-                    return updateUtilisateur(utiId, uti);
-                } else {
-                    return addUtilisateur(uti);
-                }
-            })
+            .create(addUtilisateur)
+            .update(updateUtilisateur)
             .withConfirmation(router)
+            .on(["create", "cancel"], () => closePopin?.())
+            .on("create", (_, uti) => router.to(x => x("utilisateurs")(uti.id!)))
     );
 
     useLoad(profilStore.profils, a => a.params().load(getProfils).trackingId(actions.trackingId));
     useReferenceTracking(actions.trackingId, referenceStore, "typeUtilisateur");
 
     return useObserver(() => (
         <Form {...actions.formProps}>
-            <Panel title="Informations" {...actions.panelProps}>
+            <Panel title={actions.params ? "Informations" : "Création d'un utilisateur"} {...actions.panelProps}>
                 {fieldFor(entity.nom)}
                 {fieldFor(entity.prenom)}
                 {fieldFor(entity.email)}

diff --git a/src/views/utilisateurs/index.tsx b/src/views/utilisateurs/index.tsx
@@ -1,6 +1,7 @@
 import {useObserver} from "mobx-react";
+import {useState} from "react";
 
-import {Content} from "@focus4/layout";
+import {Content, HeaderActions, Popin} from "@focus4/layout";
 
 import {utilisateurStore} from "../../stores/utilisateur";
 
@@ -11,20 +12,44 @@ import {UtilisateurDetail} from "./detail";
 import {UtilisateurList} from "./list";
 
 export function Utilisateurs() {
+    const [utiCreation, setUtiCreation] = useState(false);
     return useObserver(() => (
         <>
             <Header
                 icon="group"
                 paramResolver={() =>
                     `${utilisateurStore.utilisateur.prenom.value ?? ""} ${utilisateurStore.utilisateur.nom.value ?? ""}`
                 }
-            />
+            >
+                {!router.state.utilisateurs.utiId ? (
+                    <HeaderActions
+                        primary={[
+                            {
+                                icon: "add",
+                                tooltip: {tooltip: "Ajouter un utilisateur"},
+                                onClick: () => setUtiCreation(true)
+                            }
+                        ]}
+                    />
+                ) : null}
+            </Header>
             {router.state.utilisateurs.utiId ? (
                 <Content>
                     <UtilisateurDetail />
                 </Content>
             ) : (
-                <UtilisateurList />
+                <>
+                    <UtilisateurList />
+                    <Popin
+                        closePopin={() => setUtiCreation(false)}
+                        opened={utiCreation}
+                        preventOverlayClick={router.confirmation.active}
+                    >
+                        <Content>
+                            <UtilisateurDetail closePopin={() => setUtiCreation(false)} />
+                        </Content>
+                    </Popin>
+                </>
             )}
         </>
     ));