Tutoriel frontend — « Memo »

entry.ts & enregistrement

Le host charge /modules/memo/entry.js et appelle votre register() synchronement, avant le premier rendu. Tout s'y déclare : routes, lanceur, barre latérale, barre d'outils, recherche.

// frontend/src/entry.ts
import { lazy } from 'react'
import {
  RouteRegistry, WaffleAppRegistry, FaviconRegistry, SlotRegistry,
  useSidebarStore, useToolbarStore, useSearchStore, SDK_VERSION,
} from '@kubuno/sdk'
import { useMemoStore } from './store'
import './i18n'
import './index.css'

export const sdkVersion = SDK_VERSION   // garde-fou de compatibilité

export function register() {
  FaviconRegistry.register('memo', '/memo-logo.svg')
  WaffleAppRegistry.register('memo', 'Memo', [
    { id: 'memo', label: 'Memo', Icon: MemoLogo, path: '/memo' },
  ])

  // Routes (composants lazy)
  RouteRegistry.register('memo',          lazy(() => import('./MemoApp')))
  RouteRegistry.register('memo/:id',      lazy(() => import('./MemoApp')))

  // Barre latérale, barre d'outils, recherche
  useSidebarStore.getState().register({
    moduleId: 'memo', routePrefix: '/memo',
    newButtonLabelKey: 'memo:create',
    NewActions: MemoCreateMenu, SidebarBody: MemoSidebar,
  })
  useToolbarStore.getState().register({
    moduleId: 'memo', routePrefix: '/memo', ToolbarComponent: MemoToolbar,
  })
  useSearchStore.getState().register({
    moduleId: 'memo', routePrefix: '/memo',
    placeholderKey: 'memo:search_ph',
    onSearch: (q) => useMemoStore.getState().setQuery(q),
  })
}
Compatibilité

export const sdkVersion = SDK_VERSION est obligatoire : le host refuse de charger un module dont le SDK est incompatible.

Les objets passés aux stores ({ moduleId, routePrefix, … }) sont les contrats exacts du SDK. La suite : brancher les données.