feat(ui): move moderation header to ui layeur (#574)

Author: douglasduteil

bun.lockb

@@ -28,6 +28,7 @@
     "@~/moncomptepro.lib": "workspace:*",
     "@~/organizations.repository": "workspace:*",
     "@~/organizations.ui": "workspace:*",
+    "@~/users.lib": "workspace:*",
     "@~/zammad.lib": "workspace:*",
     "await-to-js": "3.0.0",
     "drizzle-orm": "0.33.0",

packages/~/moderations/api/package.json

@@ -2,11 +2,11 @@
 
 import { button } from "@~/app.ui/button";
 import { hx_urls } from "@~/app.urls";
+import { MessageInfo } from "@~/moderations.ui/MessageInfo";
+import { usePageRequestContext } from "./context";
 import { Desicison } from "./Desicison";
 import { Member_Invalid } from "./Member_Invalid";
 import { Member_Valid } from "./Member_Valid";
-import { MessageInfo } from "./MessageInfo";
-import { usePageRequestContext } from "./context";
 
 //
 
@@ -27,7 +27,7 @@ export async function Moderation_Actions() {
         Actions de modération <small class="fr-badge fr-badge--new">beta</small>{" "}
       </h2>
 
-      <MessageInfo />
+      <MessageInfo moderation={moderation} />
 
       <hr class="bg-none" />
       {moderation.moderated_at ? (

packages/~/moderations/api/src/:id/Actions.tsx

@@ -1,6 +1,6 @@
 //
 
-import Crisp from "@~/moderations.ui/Crisp";
+import { Crisp } from "@~/moderations.ui/Crisp";
 import { FindCorrespondingEmail } from "@~/moderations.ui/FindCorrespondingEmail";
 import { match, P } from "ts-pattern";
 import { usePageRequestContext } from "./context";

packages/~/moderations/api/src/:id/MessageInfo.tsx

@@ -4,13 +4,13 @@ import { hx_trigger_from_body } from "@~/app.core/htmx";
 import { button } from "@~/app.ui/button";
 import { hx_urls, urls } from "@~/app.urls";
 import { MODERATION_EVENTS } from "@~/moderations.lib/event";
+import { Header } from "@~/moderations.ui/Header";
 import { About as About_Organization } from "@~/organizations.ui/info/About";
 import { Investigation as Investigation_Organization } from "@~/organizations.ui/info/Investigation";
 import { getContext } from "hono/context-storage";
 import { About_User, Investigation_User } from "./About_User";
 import { Moderation_Actions } from "./Actions";
 import { Domain_Organization } from "./Domain_Organization";
-import { Header } from "./Header";
 import { Members_Of_Organization_Table } from "./Members_Of_Organization_Table";
 import { Moderation_Exchanges } from "./Moderation_Exchanges";
 import { Organizations_Of_User_Table } from "./Organizations_Of_User_Table";
@@ -52,7 +52,9 @@ export default async function Moderation_Page() {
 
       <hr class="bg-none pt-6" />
 
-      <Header />
+      <Header.Provier value={{ moderation }}>
+        <Header />
+      </Header.Provier>
 
       <hr class="my-12" />
 

packages/~/moderations/api/src/:id/email/page/index.tsx

@@ -22,3 +22,18 @@ export function moderation_type_to_title(type: string) {
     .with("organization_join_block", () => "A traiter")
     .otherwise(() => "⁉️ " + type);
 }
+
+export function moderation_type_to_verb_in_sentence(type: string) {
+  return match(type as Moderation_Type)
+    .with("ask_for_sponsorship", () => "demande un sponsorship")
+    .with(
+      "big_organization_join",
+      () => "a rejoint l'organisation de plus de 50 employés",
+    )
+    .with(
+      "non_verified_domain",
+      () => "a rejoint une organisation avec un domain non vérifié  ",
+    )
+    .with("organization_join_block", () => "veut rejoindre l'organisation")
+    .otherwise((type) => `veut effectuer une action inconnue (type ${type})`);
+}

packages/~/moderations/api/src/:id/page.tsx

@@ -0,0 +1,42 @@
+//
+
+import { NotFoundError } from "@~/app.core/error";
+import type { MonCompteProDatabaseCradle } from "@~/moncomptepro.database";
+
+export function GetModerationHeader({ pg }: MonCompteProDatabaseCradle) {
+  return async function get_moderation_header(id: number) {
+    const moderation = await pg.query.moderations.findFirst({
+      columns: {
+        comment: true,
+        id: true,
+        moderated_at: true,
+        moderated_by: true,
+        type: true,
+      },
+      where: (table, { eq }) => eq(table.id, id),
+      with: {
+        organization: {
+          columns: {
+            cached_libelle: true,
+            id: true,
+          },
+        },
+        user: {
+          columns: {
+            email: true,
+            family_name: true,
+            given_name: true,
+            id: true,
+          },
+        },
+      },
+    });
+    if (!moderation) throw new NotFoundError("Moderaion not found.");
+    return moderation;
+  };
+}
+
+export type GetModerationHeaderHandler = ReturnType<typeof GetModerationHeader>;
+export type GetModerationHeaderOutput = Awaited<
+  ReturnType<GetModerationHeaderHandler>
+>;

packages/~/moderations/lib/src/moderation_type.mapper.ts

@@ -3,15 +3,24 @@
   "version": "1.0.0",
   "private": true,
   "type": "module",
+  "imports": {
+    "#ui/*": {
+      "types": "./src/*/index.ts",
+      "default": "./src/*/index.ts"
+    }
+  },
   "exports": {
     "./*": {
-      "default": "./src/*.tsx"
+      "types": "./src/*/index.ts",
+      "default": "./src/*/index.ts"
     }
   },
   "dependencies": {
     "@~/app.ui": "workspace:*",
     "@~/app.urls": "workspace:*",
     "@~/organizations.lib": "workspace:*",
+    "@~/users.lib": "workspace:*",
+    "@~/moderations.lib": "workspace:*",
     "hono": "4.6.3",
     "tailwind-variants": "0.2.1",
     "ts-pattern": "5.4.0"

packages/~/moderations/lib/src/usecase/GetModerationHeader.ts

@@ -20,7 +20,7 @@ const context = createContext<Values>(null as any);
 
 //
 
-export default async function Crisp() {
+export async function Crisp() {
   const { describedby } = { describedby: "" };
 
   return (