@isi-ui7/bos7-shared 0.3.1 → 0.3.3

package/dist/form-types.d.ts

@@ -162,6 +162,29 @@ export type FormLayout<TData extends Record<string, unknown>> = {
     type: "wizard";
     pages: FormPageDef<TData>[];
     validateOnNext?: boolean;
+    /**
+     * Gerbang antar-langkah. Dipanggil SEBELUM pindah dari `fromPage`;
+     * mengembalikan `{ ok: false, message }` membatalkan navigasi dan
+     * menampilkan pesannya.
+     *
+     * Ada karena sebagian wizard punya langkah yang berfungsi sebagai
+     * GERBANG, bukan sekadar formulir — mis. registrasi nasabah: verifikasi
+     * identitas di Langkah 1 harus berhasil sebelum data lengkap boleh
+     * diisi, supaya dua CIF untuk satu orang tidak pernah terbentuk.
+     *
+     * Tanpa ini, satu-satunya cara menegakkannya adalah membangun wizard
+     * bespoke per layar — dan ada EMPAT layar registrasi (perorangan,
+     * badan usaha, WIC perorangan, WIC badan usaha) yang butuh gerbang yang
+     * sama persis.
+     *
+     * ⚠️ Ini penjaga NAVIGASI, bukan penjaga keamanan. Ia mencegah operator
+     * melangkah lebih jauh; ia TIDAK mencegah payload dikirim langsung ke
+     * backend. Aturan yang sama WAJIB ditegakkan lagi di server.
+     */
+    canLeavePage?: (fromPage: number, data: TData) => {
+        ok: boolean;
+        message?: string;
+    };
 };
 export type CrudForm<TData extends Record<string, unknown>> = {
     title: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@isi-ui7/bos7-shared",
-  "version": "0.3.1",
+  "version": "0.3.3",
   "description": "Shared auth7 and layout primitives for bos7 applications.",
   "license": "MIT",
   "repository": {
@@ -9,11 +9,11 @@
     "directory": "packages/bos7-shared"
   },
   "type": "module",
-  "main": "dist/index.js",
-  "module": "dist/index.js",
-  "types": "dist/index.d.ts",
+  "main": "src/index.ts",
+  "module": "src/index.ts",
+  "types": "src/index.ts",
   "exports": {
-    ".": "./dist/index.js",
+    ".": "./src/index.ts",
     "./auth7": "./src/auth7/index.ts",
     "./page-layout": "./src/page-layout.tsx",
     "./modal-layout": "./src/modal-layout.tsx",
@@ -50,23 +50,80 @@
     "./bff/health": "./src/bff/health.ts",
     "./observability/otel-init": "./src/observability/otel-init.ts",
     "./form-types": "./src/form-types.ts",
+    "./form-value-schema": "./src/form-value-schema.ts",
     "./form-numeric": "./src/form-numeric.ts",
     "./form-renderer": "./src/form-renderer.tsx",
     "./form-renderer-utils": "./src/form-renderer-utils.ts",
     "./form-rules": "./src/form-rules.ts",
     "./i18n": "./src/i18n.tsx",
     "./workflow/use-crud-form": "./src/workflow/use-crud-form.ts",
-    "./styles": "./src/form-contract.css",
-    "./form-value-schema": "./src/form-value-schema.ts"
+    "./styles": "./src/form-contract.css"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org",
-    "access": "public"
+    "access": "public",
+    "main": "dist/index.js",
+    "module": "dist/index.js",
+    "types": "dist/index.d.ts",
+    "exports": {
+      ".": "./dist/index.js",
+      "./auth7": "./src/auth7/index.ts",
+      "./page-layout": "./src/page-layout.tsx",
+      "./modal-layout": "./src/modal-layout.tsx",
+      "./form-layout": "./src/form-layout.tsx",
+      "./backend": "./src/backend.ts",
+      "./export": "./src/export.ts",
+      "./types/notification": "./src/types/notification.ts",
+      "./nats/client": "./src/nats/client.ts",
+      "./event-bus": "./src/event-bus/index.ts",
+      "./event-bus/useEventBus": "./src/event-bus/useEventBus.ts",
+      "./api": "./src/api.ts",
+      "./types/core": "./src/types/core.ts",
+      "./style-contract": "./src/style-contract.ts",
+      "./crud-components": "./src/crud-components.tsx",
+      "./workflow/backend": "./src/workflow/backend.ts",
+      "./workflow/notif7": "./src/workflow/notif7.ts",
+      "./workflow/api-client": "./src/workflow/api-client.ts",
+      "./workflow/starter": "./src/workflow/starter.ts",
+      "./workflow/use-workflow-tracker": "./src/workflow/use-workflow-tracker.ts",
+      "./workflow/crud-client": "./src/workflow/crud-client.ts",
+      "./data-table/cursor-adapter": "./src/data-table/cursor-adapter.ts",
+      "./data-table/proxy": "./src/data-table/proxy.ts",
+      "./notification/routing": "./src/notification/routing.ts",
+      "./shell/interaction": "./src/shell/interaction.ts",
+      "./shell/branch": "./src/shell/branch.ts",
+      "./notif7": "./src/notif7.ts",
+      "./shell/provider": "./src/shell/provider.tsx",
+      "./shell/app-shell-layout": "./src/shell/app-shell-layout.tsx",
+      "./notifications-bff": "./src/notifications-bff.ts",
+      "./bff/auth-me": "./src/bff/auth-me.ts",
+      "./bff/auth-refresh": "./src/bff/auth-refresh.ts",
+      "./bff/auth-logout": "./src/bff/auth-logout.ts",
+      "./bff/auth-preferences": "./src/bff/auth-preferences.ts",
+      "./bff/health": "./src/bff/health.ts",
+      "./observability/otel-init": "./src/observability/otel-init.ts",
+      "./form-types": "./src/form-types.ts",
+      "./form-numeric": "./src/form-numeric.ts",
+      "./form-renderer": "./src/form-renderer.tsx",
+      "./form-renderer-utils": "./src/form-renderer-utils.ts",
+      "./form-rules": "./src/form-rules.ts",
+      "./i18n": "./src/i18n.tsx",
+      "./workflow/use-crud-form": "./src/workflow/use-crud-form.ts",
+      "./styles": "./src/form-contract.css",
+      "./form-value-schema": "./src/form-value-schema.ts"
+    }
   },
   "files": [
     "dist",
     "src"
   ],
+  "scripts": {
+    "build": "vite build",
+    "prepublishOnly": "pnpm run build",
+    "lint": "eslint \"src/**/*.{ts,tsx}\"",
+    "test": "vitest run --passWithNoTests",
+    "typecheck": "tsc --noEmit"
+  },
   "peerDependencies": {
     "@carbon/icons-react": "^11.71.0",
     "@carbon/react": "^1.97.0",
@@ -87,6 +144,14 @@
     "@carbon/react": "^1.97.0",
     "@eslint/eslintrc": "^3.3.1",
     "@eslint/js": "^9.39.0",
+    "@isi-ui7/corporate-themes": "workspace:*",
+    "@isi-ui7/data-table": "workspace:*",
+    "@isi-ui7/editable-table": "workspace:*",
+    "@isi-ui7/i18n": "workspace:*",
+    "@isi-ui7/lookup-input": "workspace:*",
+    "@isi-ui7/modal-manager": "workspace:*",
+    "@isi-ui7/realtime": "workspace:*",
+    "@isi-ui7/ui-shell": "workspace:*",
     "@testing-library/dom": "^10.0.0",
     "@testing-library/react": "^16.0.0",
     "@testing-library/user-event": "^14.5.0",
@@ -105,19 +170,14 @@
     "typescript": "^5.3.3",
     "vite": "^5.0.0",
     "vite-plugin-dts": "^3.6.0",
-    "vitest": "^1.0.0",
-    "@isi-ui7/data-table": "0.2.5",
-    "@isi-ui7/corporate-themes": "0.2.6",
-    "@isi-ui7/editable-table": "0.2.3",
-    "@isi-ui7/lookup-input": "0.2.4",
-    "@isi-ui7/i18n": "0.2.3",
-    "@isi-ui7/modal-manager": "0.2.2",
-    "@isi-ui7/ui-shell": "0.2.8",
-    "@isi-ui7/realtime": "0.2.3"
+    "vitest": "^1.0.0"
   },
   "dependencies": {
     "@carbon/icons-react": "^11.71.0",
     "@carbon/react": "^1.97.0",
+    "@isi-ui7/data-table": "workspace:*",
+    "@isi-ui7/editable-table": "workspace:*",
+    "@isi-ui7/lookup-input": "workspace:*",
     "@opentelemetry/auto-instrumentations-node": "^0.57.0",
     "@opentelemetry/exporter-trace-otlp-http": "^0.57.0",
     "@opentelemetry/sdk-node": "^0.57.0",
@@ -125,15 +185,6 @@
     "exceljs": "^4.4.0",
     "jose": "^5.9.6",
     "jspdf": "^4.2.1",
-    "jspdf-autotable": "^5.0.7",
-    "@isi-ui7/editable-table": "0.2.3",
-    "@isi-ui7/data-table": "0.2.5",
-    "@isi-ui7/lookup-input": "0.2.4"
-  },
-  "scripts": {
-    "build": "vite build",
-    "lint": "eslint \"src/**/*.{ts,tsx}\"",
-    "test": "vitest run --passWithNoTests",
-    "typecheck": "tsc --noEmit"
+    "jspdf-autotable": "^5.0.7"
   }
-}
+}

package/src/form-types.ts

@@ -171,7 +171,31 @@ export type FormPageDef<TData extends Record<string, unknown>> = {
 export type FormLayout<TData extends Record<string, unknown>> =
   | { type: "single-page"; sections: FormSection<TData>[] }
   | { type: "tabs"; pages: FormPageDef<TData>[] }
-  | { type: "wizard"; pages: FormPageDef<TData>[]; validateOnNext?: boolean };
+  | {
+      type: "wizard";
+      pages: FormPageDef<TData>[];
+      validateOnNext?: boolean;
+      /**
+       * Gerbang antar-langkah. Dipanggil SEBELUM pindah dari `fromPage`;
+       * mengembalikan `{ ok: false, message }` membatalkan navigasi dan
+       * menampilkan pesannya.
+       *
+       * Ada karena sebagian wizard punya langkah yang berfungsi sebagai
+       * GERBANG, bukan sekadar formulir — mis. registrasi nasabah: verifikasi
+       * identitas di Langkah 1 harus berhasil sebelum data lengkap boleh
+       * diisi, supaya dua CIF untuk satu orang tidak pernah terbentuk.
+       *
+       * Tanpa ini, satu-satunya cara menegakkannya adalah membangun wizard
+       * bespoke per layar — dan ada EMPAT layar registrasi (perorangan,
+       * badan usaha, WIC perorangan, WIC badan usaha) yang butuh gerbang yang
+       * sama persis.
+       *
+       * ⚠️ Ini penjaga NAVIGASI, bukan penjaga keamanan. Ia mencegah operator
+       * melangkah lebih jauh; ia TIDAK mencegah payload dikirim langsung ke
+       * backend. Aturan yang sama WAJIB ditegakkan lagi di server.
+       */
+      canLeavePage?: (fromPage: number, data: TData) => { ok: boolean; message?: string };
+    };
 
 // ── CrudForm (schema-driven) ──────────────────────────────────────────────────
 

package/src/wizard-step-gate.test.ts

@@ -0,0 +1,65 @@
+import { describe, it, expect, vi } from 'vitest';
+import type { CrudForm } from './form-types';
+
+type D = Record<string, unknown>;
+
+// Gerbang antar-langkah wizard. Diuji sebagai KONTRAK, bukan lewat render:
+// yang penting bentuk & urutan pemanggilannya, dan itu bisa dipastikan tanpa
+// memasang seluruh form.
+//
+// Kenapa diuji sama sekali: gerbang yang gagal-terbuka tidak terlihat sebagai
+// galat — operator sekadar melewati langkah yang seharusnya mengunci, dan
+// akibatnya (dua CIF untuk satu orang) baru muncul jauh kemudian.
+
+function makeSchema(gate: NonNullable<Extract<CrudForm<D>['layout'], { type: 'wizard' }>['canLeavePage']>): CrudForm<D> {
+  return {
+    title: { create: 'c', edit: 'e', view: 'v' },
+    emptyData: {},
+    layout: {
+      type: 'wizard',
+      validateOnNext: true,
+      canLeavePage: gate,
+      pages: [
+        { label: 'Verifikasi', sections: [] },
+        { label: 'Data', sections: [] },
+      ],
+    },
+  } as CrudForm<D>;
+}
+
+describe('wizard canLeavePage', () => {
+  it('menolak pindah ketika gerbang mengembalikan ok:false, dan membawa pesannya', () => {
+    const gate = vi.fn().mockReturnValue({ ok: false, message: 'Verifikasi identitas dulu.' });
+    const schema = makeSchema(gate);
+    const layout = schema.layout as Extract<typeof schema.layout, { type: 'wizard' }>;
+
+    const res = layout.canLeavePage!(0, { verified: false });
+    expect(res.ok).toBe(false);
+    expect(res.message).toBe('Verifikasi identitas dulu.');
+  });
+
+  it('mengizinkan pindah ketika gerbang ok', () => {
+    const layout = makeSchema(() => ({ ok: true })).layout as Extract<
+      CrudForm<D>['layout'],
+      { type: 'wizard' }
+    >;
+    expect(layout.canLeavePage!(0, { verified: true }).ok).toBe(true);
+  });
+
+  it('menerima nomor halaman ASAL, bukan tujuan — gerbang milik langkah yang ditinggalkan', () => {
+    const gate = vi.fn().mockReturnValue({ ok: true });
+    const layout = makeSchema(gate).layout as Extract<CrudForm<D>['layout'], { type: 'wizard' }>;
+    layout.canLeavePage!(0, {});
+    expect(gate).toHaveBeenCalledWith(0, {});
+  });
+
+  it('opsional — wizard tanpa gerbang tetap sah secara tipe', () => {
+    const schema: CrudForm<D> = {
+      title: { create: 'c', edit: 'e', view: 'v' },
+      emptyData: {},
+      layout: { type: 'wizard', pages: [{ label: 'A', sections: [] }] },
+    } as CrudForm<D>;
+    const layout = schema.layout as Extract<typeof schema.layout, { type: 'wizard' }>;
+    expect(layout.canLeavePage).toBeUndefined();
+  });
+});

package/src/workflow/starter.ts

@@ -9,10 +9,43 @@
 // workflow7 EventRecorder dispatch SSE event `instance.completed` balik ke
 // initiator. Kalau initiatedBy kosong → no dispatch → notifikasi silent.
 
-const WORKFLOW7_URL =
-  process.env.NEXT_PUBLIC_BOS7_WORKFLOW_URL ??
-  process.env.WORKFLOW7_URL ??
-  'http://localhost:8081';
+// 🔑 WORKFLOW7_URL only. NEXT_PUBLIC_BOS7_WORKFLOW_URL is deliberately NOT
+// consulted here, and that is the fix — it used to be consulted FIRST.
+//
+// That variable names the workflow WEBAPP, in both environments:
+//
+//   local    workflow.bos7.local     → workflow7-web  :3002   (webapp)
+//            api.workflow.bos7.local → workflow7-svc   :8081   (service)
+//   Railway  workflow.ibos7.com      → bos7-workflow          (webapp)
+//            core7-service …          no public domain — internal only
+//
+// This helper POSTs to /wf/instances/start on the SERVICE. Pointing it at the
+// webapp produced a redirect chain that ends in a misleading 405, reproduced
+// end to end on Railway:
+//
+//   POST https://workflow.ibos7.com/wf/instances/start
+//     → 307 Location: /api/auth/login?returnTo=/wf/instances/start
+//     → fetch preserves POST across a 307
+//     → /api/auth/login accepts GET only
+//     → 405 Method Not Allowed
+//
+// Control, same path against the service: 401 — the route exists and only
+// wants auth.
+//
+// ⚠️ The old order only broke where NEXT_PUBLIC_BOS7_WORKFLOW_URL is SET.
+// Locally it is usually unset, so the chain fell through to the service and
+// every flow worked — which is why this survived local testing across four
+// webapps. On Railway it is set on all of them, so it won.
+//
+// The NEXT_PUBLIC fallback is removed rather than demoted: for this endpoint
+// it can only ever produce that 405, and a fallback whose sole outcome is a
+// misleading error is worse than none. With it gone, an unconfigured
+// container fails to connect — which names the real problem.
+//
+// NEXT_PUBLIC_BOS7_WORKFLOW_URL stays correct in notifications-bff.ts, which
+// builds user-facing LINKS to the workflow webapp. Same variable, different
+// job; only this file was using it for the wrong one.
+const WORKFLOW7_URL = process.env.WORKFLOW7_URL ?? 'http://localhost:8081';
 
 type CookieReqLike = Request & {
   cookies?: { get?: (name: string) => { value?: string } | undefined };

package/src/workflow/use-crud-form-gate.test.tsx

@@ -0,0 +1,138 @@
+import { describe, it, expect, vi } from "vitest";
+import { act, renderHook } from "@testing-library/react";
+import { useCrudForm } from "./use-crud-form";
+import type { CrudForm } from "../form-types";
+
+type D = Record<string, unknown>;
+
+// Gerbang antar-langkah wizard, diuji lewat PERILAKU goNext.
+//
+// Kenapa ada tes kedua padahal sudah ada wizard-step-gate.test.ts: tes itu
+// hanya memastikan BENTUK tipenya — ia akan tetap hijau meski goNext tidak
+// pernah memanggil canLeavePage sama sekali. Persis kegagalan yang gerbang ini
+// ada untuk mencegahnya: gagal-terbuka tidak berbunyi sebagai galat, operator
+// sekadar melewati langkah yang seharusnya mengunci, dan akibatnya (dua CIF
+// untuk satu orang) baru muncul jauh kemudian.
+//
+// Tes di bawah memeriksa `page` — halaman yang BENAR-BENAR ditempati — bukan
+// nilai balik gerbangnya. Itu satu-satunya yang membedakan "terpasang" dari
+// "sekadar ada".
+
+function schemaWith(
+  gate?: (from: number, d: D) => { ok: boolean; message?: string },
+  opts: { validateOnNext?: boolean } = {},
+): CrudForm<D> {
+  return {
+    title: { create: "c", edit: "e", view: "v" },
+    emptyData: { verified: false } as D,
+    layout: {
+      type: "wizard",
+      validateOnNext: opts.validateOnNext ?? false,
+      canLeavePage: gate,
+      pages: [
+        {
+          label: "Verifikasi",
+          sections: [
+            {
+              title: "s",
+              fields: [
+                {
+                  key: "nama",
+                  label: "Nama",
+                  type: "text",
+                  span: 4,
+                  validation: { required: true },
+                },
+              ],
+            },
+          ],
+        },
+        { label: "Data", sections: [] },
+      ],
+    },
+  } as unknown as CrudForm<D>;
+}
+
+describe("useCrudForm — gerbang canLeavePage", () => {
+  it("gerbang ok:false MENAHAN halaman di 0 dan menampilkan pesannya", async () => {
+    const { result } = renderHook(() =>
+      useCrudForm<D>({
+        schema: schemaWith(() => ({ ok: false, message: "Cek identitas dulu." })),
+        mode: "create",
+      }),
+    );
+
+    expect(result.current.page).toBe(0);
+    await act(async () => {
+      await result.current.goNext();
+    });
+
+    expect(result.current.page).toBe(0);
+    expect(result.current.error).toBe("Cek identitas dulu.");
+  });
+
+  it("gerbang ok:true MEMBIARKAN pindah ke halaman 1", async () => {
+    const { result } = renderHook(() =>
+      useCrudForm<D>({ schema: schemaWith(() => ({ ok: true })), mode: "create" }),
+    );
+
+    await act(async () => {
+      await result.current.goNext();
+    });
+
+    expect(result.current.page).toBe(1);
+    expect(result.current.error).toBeNull();
+  });
+
+  it("gerbang menerima nomor halaman ASAL beserta isi form saat itu", async () => {
+    const gate = vi.fn().mockReturnValue({ ok: true });
+    const { result } = renderHook(() =>
+      useCrudForm<D>({ schema: schemaWith(gate), mode: "create" }),
+    );
+
+    await act(async () => {
+      result.current.setForm({ verified: true });
+    });
+    await act(async () => {
+      await result.current.goNext();
+    });
+
+    expect(gate).toHaveBeenCalledWith(0, { verified: true });
+  });
+
+  it("gerbang berjalan SEBELUM validasi field — pesan yang muncul alasan sebenarnya, bukan galat field", async () => {
+    // `nama` wajib dan kosong, jadi validasi PASTI gagal juga. Kalau urutannya
+    // terbalik, yang tampil adalah galat validasi generik dan operator tidak
+    // pernah tahu bahwa yang sesungguhnya menahan adalah verifikasi identitas.
+    const { result } = renderHook(() =>
+      useCrudForm<D>({
+        schema: schemaWith(() => ({ ok: false, message: "Cek identitas dulu." }), {
+          validateOnNext: true,
+        }),
+        mode: "create",
+      }),
+    );
+
+    await act(async () => {
+      await result.current.goNext();
+    });
+
+    expect(result.current.page).toBe(0);
+    expect(result.current.error).toBe("Cek identitas dulu.");
+    expect(result.current.fieldErrors).toEqual({});
+  });
+
+  it("KONTROL negatif: wizard tanpa gerbang tetap bisa pindah halaman", async () => {
+    // Kalau tes ini ikut gagal ketika gerbang dicabut, berarti yang diukur
+    // bukan gerbangnya melainkan navigasinya secara umum.
+    const { result } = renderHook(() =>
+      useCrudForm<D>({ schema: schemaWith(undefined), mode: "create" }),
+    );
+
+    await act(async () => {
+      await result.current.goNext();
+    });
+
+    expect(result.current.page).toBe(1);
+  });
+});

package/src/workflow/use-crud-form.ts

@@ -100,6 +100,19 @@ export function useCrudForm<TData extends Record<string, unknown>>({
     setServerError(null);
     setHasValidationError(false);
     const layout = schema.layout;
+
+    // Gerbang antar-langkah — diperiksa SEBELUM validasi field, karena gerbang
+    // yang gagal berarti langkah ini belum boleh ditinggalkan sama sekali;
+    // menjalankan validasi lebih dulu akan menampilkan galat field yang tidak
+    // relevan dan menutupi alasan sebenarnya.
+    if (layout.type === "wizard" && layout.canLeavePage) {
+      const gate = layout.canLeavePage(page, form);
+      if (!gate.ok) {
+        setServerError(gate.message ?? "Langkah ini belum bisa dilanjutkan.");
+        return;
+      }
+    }
+
     if (layout.type === "wizard" && layout.validateOnNext) {
       const errs = validatePage(page);
       setFieldErrors(errs);