@portaki/module-sections 1.3.1 → 1.4.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@portaki/module-sections",
-  "version": "1.3.1",
+  "version": "1.4.0",
   "description": "Portaki module — editorial sections (TipTap)",
   "license": "AGPL-3.0",
   "type": "module",

package/portaki.catalog.json

@@ -9,7 +9,7 @@
     "fr": "Blocs de contenu riches (TipTap) pour le carnet d’accueil invité.",
     "en": "Rich content blocks (TipTap) for the guest welcome book."
   },
-  "version": "1.3.1",
+  "version": "1.4.0",
   "releaseNotesUrl": "https://github.com/PortakiApp/portaki-modules/releases",
   "changelog": [
     {
@@ -122,6 +122,6 @@
   },
   "artifacts": {
     "wasmUrl": "oci://ghcr.io/portakiapp/portaki-module-sections",
-    "guestEsmUrl": "https://esm.sh/@portaki/module-sections@1.3.1"
+    "guestEsmUrl": "https://esm.sh/@portaki/module-sections@1.4.0"
   }
 }

package/portaki.module.json

@@ -9,7 +9,7 @@
     "fr": "Blocs de contenu riches (TipTap) pour le carnet d’accueil invité.",
     "en": "Rich content blocks (TipTap) for the guest welcome book."
   },
-  "version": "1.3.1",
+  "version": "1.4.0",
   "releaseNotesUrl": "https://github.com/PortakiApp/portaki-modules/releases",
   "changelog": [
     {
@@ -122,6 +122,6 @@
   },
   "artifacts": {
     "wasmUrl": "oci://ghcr.io/portakiapp/portaki-module-sections",
-    "guestEsmUrl": "https://esm.sh/@portaki/module-sections@1.3.1"
+    "guestEsmUrl": "https://esm.sh/@portaki/module-sections@1.4.0"
   }
 }

package/src/host/SectionsHostWorkspace.tsx

@@ -22,10 +22,7 @@ import { FileText, GripVertical, Plus, Trash2 } from 'lucide-react'
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 
 import { SectionCreateModal, type SectionCreatePayload } from './SectionCreateModal'
-import { sectionsEditorDesign } from './sections-editor-design'
 import type { SectionsEditorDesign } from './sections-host.types'
-import { buildSectionTipTapPreset } from './section-tiptap-presets'
-import { sectionsToastCopy } from './sections-toast-copy'
 
 type SectionRow = {
   id: string;
@@ -38,9 +35,10 @@ type SectionRow = {
 
 type LangTab = "fr" | "en";
 
-const DEFAULT_DESIGN = sectionsEditorDesign
-
-function unwrapJsonbField(raw: unknown): unknown {
+function unwrapJsonbField(
+  raw: unknown,
+  parseTipTapDoc: HostModuleContext['shell']['parseTipTapDoc'],
+): unknown {
   if (raw == null) {
     return null;
   }
@@ -50,7 +48,7 @@ function unwrapJsonbField(raw: unknown): unknown {
   if (typeof raw === "object" && !Array.isArray(raw)) {
     const record = raw as Record<string, unknown>;
     if (record.type === "jsonb" && record.value != null) {
-      return unwrapJsonbField(record.value);
+      return unwrapJsonbField(record.value, parseTipTapDoc);
     }
     if (record.type === "doc") {
       return record;
@@ -59,23 +57,29 @@ function unwrapJsonbField(raw: unknown): unknown {
   return raw;
 }
 
-function normalizeSectionRow(row: Record<string, unknown>): SectionRow {
+function normalizeSectionRow(
+  row: Record<string, unknown>,
+  parseTipTapDoc: HostModuleContext['shell']['parseTipTapDoc'],
+): SectionRow {
   return {
     id: String(row.id ?? ""),
     sortOrder: Number(row.sortOrder ?? row.sort_order ?? 0),
     titleFr: String(row.titleFr ?? row.title_fr ?? ""),
     titleEn: String(row.titleEn ?? row.title_en ?? ""),
-    contentFr: unwrapJsonbField(row.contentFr ?? row.content_fr),
-    contentEn: unwrapJsonbField(row.contentEn ?? row.content_en),
+    contentFr: unwrapJsonbField(row.contentFr ?? row.content_fr, parseTipTapDoc),
+    contentEn: unwrapJsonbField(row.contentEn ?? row.content_en, parseTipTapDoc),
   };
 }
 
-function tipTapValue(raw: unknown): string {
-  const doc = unwrapJsonbField(raw);
+function tipTapValue(
+  raw: unknown,
+  shell: HostModuleContext['shell'],
+): string {
+  const doc = unwrapJsonbField(raw, shell.parseTipTapDoc);
   if (doc && typeof doc === "object") {
-    return serializeTipTapDoc(doc as Record<string, unknown>);
+    return shell.serializeTipTapDoc(doc as Record<string, unknown>);
   }
-  return serializeTipTapDoc(parseTipTapDoc(null));
+  return shell.serializeTipTapDoc(shell.parseTipTapDoc(null));
 }
 
 function SortableSectionItem({
@@ -129,14 +133,10 @@ function SortableSectionItem({
   );
 }
 
-export function SectionsHostWorkspace({
-  ctx,
-  design = DEFAULT_DESIGN,
-}: {
-  ctx: HostModuleContext
-  design?: SectionsEditorDesign
-}) {
+export function SectionsHostWorkspace({ ctx }: { ctx: HostModuleContext }) {
+  const design = ctx.design as SectionsEditorDesign
   const { propertyId, gateway, shell } = ctx
+  const toasts = design.toasts
   const {
     NotionLikeEditor,
     HostEmptyPlaceholder,
@@ -173,7 +173,7 @@ export function SectionsHostWorkspace({
     setLoading(true);
     try {
       const data = await gateway.query<SectionRow[]>(gatewayOps.listQuery)
-      const list = data.map((row) => normalizeSectionRow(row as Record<string, unknown>));
+      const list = data.map((row) => normalizeSectionRow(row as Record<string, unknown>, parseTipTapDoc));
       setSections(list);
       setSelectedId((prev) => {
         if (prev && list.some((s) => s.id === prev)) {
@@ -182,7 +182,7 @@ export function SectionsHostWorkspace({
         return list[0]?.id ?? null;
       });
     } catch {
-      toast.error(sectionsToastCopy.loadError)
+      toast.error(toasts.loadError)
     } finally {
       setLoading(false);
     }
@@ -207,7 +207,7 @@ export function SectionsHostWorkspace({
         setLastSavedAt(new Date());
         await load();
       } catch {
-        toast.error(sectionsToastCopy.saveError)
+        toast.error(toasts.saveError)
       } finally {
         setSaving(false);
       }
@@ -248,7 +248,7 @@ export function SectionsHostWorkspace({
           orderedIds: ordered.map((s) => s.id),
         });
       } catch {
-        toast.error(sectionsToastCopy.reorderError)
+        toast.error(toasts.reorderError)
         await load();
       }
     },
@@ -280,7 +280,11 @@ export function SectionsHostWorkspace({
       setCreating(true);
       const sortOrder = sections.length;
       const id = crypto.randomUUID();
-      const { contentFr, contentEn } = buildSectionTipTapPreset(payload.contentPreset);
+      const buildPreset = shell.buildSectionTipTapPreset
+      if (buildPreset == null) {
+        throw new Error('host_shell_missing_buildSectionTipTapPreset')
+      }
+      const { contentFr, contentEn } = buildPreset(payload.contentPreset)
       try {
         await gateway.command(gatewayOps.saveCommand, {
           id,
@@ -293,9 +297,9 @@ export function SectionsHostWorkspace({
         setCreateModalOpen(false);
         await load();
         setSelectedId(id);
-        toast.success(sectionsToastCopy.createSuccess)
+        toast.success(toasts.createSuccess)
       } catch {
-        toast.error(sectionsToastCopy.createError)
+        toast.error(toasts.createError)
       } finally {
         setCreating(false);
       }
@@ -311,10 +315,10 @@ export function SectionsHostWorkspace({
       await gateway.command(gatewayOps.deleteCommand, {
         id: selected.id,
       });
-      toast.success(sectionsToastCopy.deleteSuccess)
+      toast.success(toasts.deleteSuccess)
       await load();
     } catch {
-      toast.error(sectionsToastCopy.deleteError)
+      toast.error(toasts.deleteError)
     }
   }, [gateway, gatewayOps.deleteCommand, selected, load, toast])
 
@@ -350,8 +354,8 @@ export function SectionsHostWorkspace({
     selected == null
       ? serializeTipTapDoc(parseTipTapDoc(null))
       : lang === "fr"
-        ? tipTapValue(selected.contentFr)
-        : tipTapValue(selected.contentEn);
+        ? tipTapValue(selected.contentFr, shell)
+        : tipTapValue(selected.contentEn, shell);
 
   return (
     <div className="flex min-h-[min(70vh,720px)] flex-col gap-4 lg:flex-row">

package/src/host/sections-host.types.ts

@@ -50,4 +50,13 @@ export type SectionsEditorDesign = {
   }
   createModal: SectionCreateModalDesign
   emptyState: SectionsEditorEmptyStateDesign
+  toasts: {
+    loadError: string
+    saveError: string
+    reorderError: string
+    createSuccess: string
+    createError: string
+    deleteSuccess: string
+    deleteError: string
+  }
 }

package/src/test/mock-host-module-context.ts

@@ -1,6 +1,8 @@
 import type { HostModuleContext, HostModuleShellComponents } from '@portaki/sdk'
 import { createMockHostModuleContext } from '@portaki/sdk-test-support'
 
+import type { SectionsEditorDesign } from '../host/sections-host.types'
+
 /** Stubs until published `@portaki/sdk-test-support` includes `shell` / `gateway`. */
 export const mockHostShell: HostModuleShellComponents = {
   NotionLikeEditor: () => null,
@@ -18,6 +20,47 @@ export const mockHostShell: HostModuleShellComponents = {
   toast: { success: () => {}, error: () => {} },
   parseTipTapDoc: () => ({ type: 'doc', content: [{ type: 'paragraph' }] }),
   serializeTipTapDoc: (doc) => JSON.stringify(doc),
+  buildSectionTipTapPreset: () => ({
+    contentFr: { type: 'doc', content: [] },
+    contentEn: { type: 'doc', content: [] },
+  }),
+}
+
+const mockSectionsDesign: SectionsEditorDesign = {
+  id: 'sections-editor-v1',
+  moduleId: 'sections',
+  layout: 'sections-split-panel',
+  gateway: {
+    listQuery: 'sections.list',
+    saveCommand: 'sections.section.save',
+    deleteCommand: 'sections.section.delete',
+    reorderCommand: 'sections.reorder',
+  },
+  createModal: {
+    titleFr: 'Nouvelle section',
+    subtitleFr: 'Modèle',
+    titleFieldLabelFr: 'Titre',
+    titleFieldHintFr: 'Hint',
+    footerHintFr: 'Footer',
+    cancelLabelFr: 'Annuler',
+    submitLabelFr: 'Créer',
+    defaultTemplateId: 'welcome',
+    templates: [],
+  },
+  emptyState: {
+    titleFr: 'Vide',
+    descriptionFr: 'Desc',
+    primaryActionLabelFr: 'Créer',
+  },
+  toasts: {
+    loadError: 'load',
+    saveError: 'save',
+    reorderError: 'reorder',
+    createSuccess: 'created',
+    createError: 'create err',
+    deleteSuccess: 'deleted',
+    deleteError: 'delete err',
+  },
 }
 
 export function createSectionsTestHostContext(
@@ -26,6 +69,7 @@ export function createSectionsTestHostContext(
   const base = createMockHostModuleContext(overrides)
   return {
     ...base,
+    design: overrides.design ?? mockSectionsDesign,
     gateway: overrides.gateway ?? base.gateway ?? {
       query: async <T,>() => [] as T,
       command: async () => {},

package/src/host/section-tiptap-presets.ts

@@ -1,156 +0,0 @@
-import type { SectionContentPresetId } from "./sections-host.types";
-
-export type SectionTipTapPreset = {
-  contentFr: Record<string, unknown>;
-  contentEn: Record<string, unknown>;
-};
-
-function textNode(value: string): Record<string, unknown> {
-  return { type: "text", text: value };
-}
-
-function paragraph(...parts: string[]): Record<string, unknown> {
-  const joined = parts.filter(Boolean).join(" ");
-  return {
-    type: "paragraph",
-    content: joined ? [textNode(joined)] : [],
-  };
-}
-
-function heading(level: 2 | 3, text: string): Record<string, unknown> {
-  return {
-    type: "heading",
-    attrs: { level },
-    content: text ? [textNode(text)] : [],
-  };
-}
-
-function bulletItem(text: string): Record<string, unknown> {
-  return {
-    type: "listItem",
-    content: [paragraph(text)],
-  };
-}
-
-function bulletList(items: string[]): Record<string, unknown> {
-  return {
-    type: "bulletList",
-    content: items.map(bulletItem),
-  };
-}
-
-function doc(...blocks: Record<string, unknown>[]): Record<string, unknown> {
-  return { type: "doc", content: blocks };
-}
-
-const PRESETS: Record<SectionContentPresetId, SectionTipTapPreset> = {
-  welcome: {
-    contentFr: doc(
-      paragraph(
-        "Bienvenue ! Nous sommes ravis de vous accueillir. Voici quelques informations utiles pour profiter pleinement du logement.",
-      ),
-      paragraph(
-        "N'hésitez pas à nous écrire ou à nous appeler si vous avez la moindre question pendant votre séjour.",
-      ),
-    ),
-    contentEn: doc(
-      paragraph(
-        "Welcome! We're delighted to host you. Here is some useful information to help you make the most of your stay.",
-      ),
-      paragraph("Feel free to message or call us if you have any questions during your visit."),
-    ),
-  },
-  beaches: {
-    contentFr: doc(
-      heading(2, "Plages & criques"),
-      paragraph("Nos spots préférés aux alentours :"),
-      bulletList([
-        "Plage principale — accès facile, idéale en famille",
-        "Crique sauvage — 10 min à pied, prévoir des chaussures",
-        "Spot snorkeling — eau calme le matin",
-      ]),
-    ),
-    contentEn: doc(
-      heading(2, "Beaches & coves"),
-      paragraph("Our favourite spots nearby:"),
-      bulletList([
-        "Main beach — easy access, great for families",
-        "Hidden cove — 10 min walk, bring suitable shoes",
-        "Snorkelling spot — calm water in the morning",
-      ]),
-    ),
-  },
-  restaurants: {
-    contentFr: doc(
-      heading(2, "Restaurants"),
-      paragraph("Quelques adresses que nous recommandons, par budget :"),
-      bulletList([
-        "Bistrot du port — cuisine locale, réservation conseillée",
-        "Pizzeria du village — décontracté, terrasse ombragée",
-        "Marché du samedi matin — produits frais et spécialités",
-      ]),
-    ),
-    contentEn: doc(
-      heading(2, "Restaurants"),
-      paragraph("A few places we recommend, by budget:"),
-      bulletList([
-        "Harbour bistro — local cuisine, booking recommended",
-        "Village pizzeria — casual, shaded terrace",
-        "Saturday market — fresh produce and regional treats",
-      ]),
-    ),
-  },
-  transport: {
-    contentFr: doc(
-      heading(2, "Venir & repartir"),
-      paragraph("Pour vous déplacer facilement :"),
-      bulletList([
-        "Gare la plus proche — liaisons régulières vers les grandes villes",
-        "Bus — arrêt à quelques minutes à pied",
-        "Parking — place disponible sur la propriété",
-        "Taxi / VTC — nous pouvons partager nos contacts",
-      ]),
-    ),
-    contentEn: doc(
-      heading(2, "Getting here & leaving"),
-      paragraph("Getting around:"),
-      bulletList([
-        "Nearest train station — regular connections to major cities",
-        "Bus — stop a few minutes' walk away",
-        "Parking — space available on the property",
-        "Taxi / ride-hailing — we can share our contacts",
-      ]),
-    ),
-  },
-  emergencies: {
-    contentFr: doc(
-      heading(2, "Urgences"),
-      paragraph("En cas d'urgence :"),
-      bulletList([
-        "112 — numéro d'urgence européen",
-        "Médecin / pharmacie de garde — contactez-nous",
-        "Pompiers / police — composez le 112",
-      ]),
-      paragraph("Adresse du logement et codes d'accès : à compléter selon votre situation."),
-    ),
-    contentEn: doc(
-      heading(2, "Emergencies"),
-      paragraph("In an emergency:"),
-      bulletList([
-        "112 — European emergency number",
-        "Doctor / on-call pharmacy — contact us",
-        "Fire / police — dial 112",
-      ]),
-      paragraph("Property address and access codes: please complete for your guests."),
-    ),
-  },
-  empty: {
-    contentFr: doc(paragraph("")),
-    contentEn: doc(paragraph("")),
-  },
-};
-
-/** TipTap JSON presets keyed by {@link SectionContentPresetId} (sections editor design). */
-export function buildSectionTipTapPreset(preset: SectionContentPresetId): SectionTipTapPreset {
-  return PRESETS[preset] ?? PRESETS.empty;
-}

package/src/host/sections-editor-design.ts

@@ -1,79 +0,0 @@
-import type { SectionsEditorDesign } from './sections-host.types'
-
-export const sectionsEditorDesign = {
-  id: 'sections-editor-v1',
-  moduleId: 'sections',
-  layout: 'sections-split-panel',
-  gateway: {
-    listQuery: 'sections.list',
-    saveCommand: 'sections.section.save',
-    deleteCommand: 'sections.section.delete',
-    reorderCommand: 'sections.reorder',
-  },
-  createModal: {
-    titleFr: 'Nouvelle section',
-    subtitleFr: 'Choisissez un modèle pour partir vite, ou créez une section vide.',
-    titleFieldLabelFr: 'Titre',
-    titleFieldHintFr: 'Visible par le voyageur, en haut de la section.',
-    footerHintFr: 'Vous pourrez renommer et réordonner ensuite.',
-    cancelLabelFr: 'Annuler',
-    submitLabelFr: 'Créer la section',
-    defaultTemplateId: 'welcome',
-    templates: [
-      {
-        id: 'welcome',
-        icon: '👋',
-        titleFr: 'Mot de bienvenue',
-        titleEn: 'Welcome message',
-        descriptionFr: "Un paragraphe d'accueil personnalisé",
-        contentPreset: 'welcome',
-      },
-      {
-        id: 'beaches',
-        icon: '🏖️',
-        titleFr: 'Plages & criques',
-        titleEn: 'Beaches & coves',
-        descriptionFr: 'Liste de plages avec accès & distance',
-        contentPreset: 'beaches',
-      },
-      {
-        id: 'restaurants',
-        icon: '🍝',
-        titleFr: 'Nos restaurants préférés',
-        titleEn: 'Our favourite restaurants',
-        descriptionFr: 'Recommandations par budget',
-        contentPreset: 'restaurants',
-      },
-      {
-        id: 'transport',
-        icon: '🚂',
-        titleFr: 'Comment venir & repartir',
-        titleEn: 'Getting here & leaving',
-        descriptionFr: 'Train, bus, voiture, taxi',
-        contentPreset: 'transport',
-      },
-      {
-        id: 'emergencies',
-        icon: '🆘',
-        titleFr: 'Urgences & numéros utiles',
-        titleEn: 'Emergencies & useful numbers',
-        descriptionFr: '112, médecin, police',
-        contentPreset: 'emergencies',
-      },
-      {
-        id: 'empty',
-        icon: '📋',
-        titleFr: 'Vide · personnalisée',
-        titleEn: 'Empty · custom',
-        descriptionFr: "Démarrer d'une page blanche",
-        contentPreset: 'empty',
-      },
-    ],
-  },
-  emptyState: {
-    titleFr: 'Aucune section pour l’instant',
-    descriptionFr:
-      'Structurez le carnet d’accueil en blocs (plages, restaurants, consignes…) visibles par vos voyageurs dans le livret.',
-    primaryActionLabelFr: 'Créer une section',
-  },
-} satisfies SectionsEditorDesign

package/src/host/sections-toast-copy.ts

@@ -1,9 +0,0 @@
-export const sectionsToastCopy = {
-  loadError: 'Impossible de charger les sections.',
-  saveError: 'Enregistrement impossible.',
-  reorderError: 'Réordonnancement impossible.',
-  createSuccess: 'Section créée.',
-  createError: 'Création impossible.',
-  deleteSuccess: 'Section supprimée.',
-  deleteError: 'Suppression impossible.',
-} as const