@isi-ui7/bos7-shared 0.4.2 → 0.4.3

package/dist/form-renderer-utils.d.ts

@@ -42,4 +42,42 @@ export declare function toLocalISODate(date: Date | undefined | null): string;
  * menghasilkan tanggal lain sama sekali (laporan DG-00, agent7 2026-08-31).
  */
 export declare function fromLocalISODate(iso: string | undefined | null): Date | undefined;
+/**
+ * Mem-parse tanggal yang DIKETIK operator dalam format TAMPILAN "d-m-Y"
+ * ("15-06-1990", juga menerima "5-6-1990") jadi `Date` lokal.
+ *
+ * 🔑 Kenapa ini ada, dan kenapa ia TIDAK memakai flatpickr.
+ *
+ * Tanggal yang diketik tangan nol pernah masuk state form. Layar menunjukkan
+ * tanggalnya, tapi validasi berkata "is required" — cacat yang paling
+ * menyesatkan yang bisa dialami operator, karena nol ada yang terlihat salah.
+ *
+ * Diukur di browser sungguhan (DG-00, cif.ibos7.com 2026-08-31), commit-nya
+ * BERBEDA menurut gestur yang mengakhiri ketikan:
+ *
+ *   gestur         flatpickr.selectedDates   state React
+ *   Tab            []                        kosong        RUSAK
+ *   Enter          terisi                    terisi        benar
+ *   klik di luar   terisi                    kosong        RUSAK
+ *
+ * Sesudah Tab, `fp.isOpen` tetap `true` dan fokus lompat ke elemen di dalam
+ * kalender — jadi jalur "parse saat close" milik flatpickr nol pernah
+ * tersentuh. Pada klik-di-luar flatpickr BERHASIL mem-parse tapi onChange-nya
+ * nol sampai ke React: flatpickr dan React memegang dua kebenaran berbeda.
+ *
+ * 🔴 Maka commit-nya nol boleh bergantung pada flatpickr. Kita mem-parse
+ * sendiri saat `blur`, dan itu berlaku untuk KETIGA gestur — termasuk yang
+ * belum kita pahami sepenuhnya. Bergantung pada perilaku yang sudah terbukti
+ * berbeda antar gestur berarti memperbaiki gestur yang kebetulan diuji saja.
+ *
+ * ⚠️ jsdom NOL bisa mereproduksi cacat ini: di sana `fireEvent.blur` memang
+ * meng-commit, pada kode lama maupun baru. Uji fungsi ini apa adanya, dan
+ * jangan menyimpulkan dari tes komponen bahwa cacatnya tuntas.
+ *
+ * Mengembalikan `undefined` untuk teks yang bukan tanggal utuh — termasuk
+ * ketikan separuh jalan ("15-06") dan tanggal yang nol ada ("31-02-1990").
+ * Nol menebak: teks yang nol terbaca dibiarkan apa adanya, dan validasi
+ * "wajib diisi" yang bicara.
+ */
+export declare function parseDisplayDate(teks: string | undefined | null): Date | undefined;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@isi-ui7/bos7-shared",
-  "version": "0.4.2",
+  "version": "0.4.3",
   "description": "Shared auth7 and layout primitives for bos7 applications.",
   "license": "MIT",
   "repository": {
@@ -70,7 +70,7 @@
   "peerDependencies": {
     "@carbon/icons-react": "^11.71.0",
     "@carbon/react": "^1.97.0",
-    "@isi-ui7/corporate-themes": ">=0.2.12",
+    "@isi-ui7/corporate-themes": ">=0.2.13",
     "@isi-ui7/data-table": ">=0.2.5",
     "@isi-ui7/editable-table": ">=0.2.3",
     "@isi-ui7/i18n": ">=0.2.3",
@@ -106,7 +106,7 @@
     "vite": "^5.0.0",
     "vite-plugin-dts": "^3.6.0",
     "vitest": "^1.0.0",
-    "@isi-ui7/corporate-themes": "0.2.12",
+    "@isi-ui7/corporate-themes": "0.2.13",
     "@isi-ui7/data-table": "0.2.5",
     "@isi-ui7/editable-table": "0.2.3",
     "@isi-ui7/i18n": "0.2.3",

package/src/crud-client-error.test.ts

@@ -1,5 +1,5 @@
 import { describe, it, expect, vi, afterEach } from 'vitest';
-import { fetchDetailData } from './workflow/crud-client';
+import { fetchDetailData, submitWorkflowForm, submitWorkflowDelete } from './workflow/crud-client';
 
 // Bentuk error yang BENAR-BENAR dikirim service Go di estate ini. Menyerahkan
 // objek langsung ke `new Error()` menghasilkan pesan literal "[object Object]",
@@ -51,3 +51,47 @@ describe('fetchDetailData — pesan error', () => {
     await expect(fetchDetailData<{ id: number }>('/x')).resolves.toEqual({ id: 7, name: 'ok' });
   });
 });
+
+// submitWorkflowForm/submitWorkflowDelete — sebelum perbaikan ini (2026-08-31,
+// ditemukan claim-verifier + PM saat audit FT-292/293), kedua fungsi ini
+// mengetik `error?: string` dan menyerahkan `body.error` LANGSUNG ke
+// `new Error()`, melewati `errorMessage` sama sekali — beda dari
+// `fetchDetailData` yang sudah benar. Akibatnya saat backend genuinely
+// menolak dengan bentuk objek `{code, message}` (bentuk NYATA service Go di
+// estate ini, lihat komentar `errorMessage`), operator melihat literal
+// "[object Object]", bukan alasannya.
+describe('submitWorkflowForm — pesan error (cermin fetchDetailData)', () => {
+  it('membuka error berbentuk OBJEK {code, message} — bukan "[object Object]"', async () => {
+    mockRes(403, { error: { code: 'FORBIDDEN', message: 'access denied' } });
+    await expect(submitWorkflowForm('/x', 'POST', {})).rejects.toThrow('access denied (FORBIDDEN)');
+  });
+
+  it('tetap menerima error berbentuk string', async () => {
+    mockRes(400, { error: 'validation error: tujuan transaksi belum diputuskan' });
+    await expect(submitWorkflowForm('/x', 'POST', {})).rejects.toThrow(
+      'validation error: tujuan transaksi belum diputuskan',
+    );
+  });
+
+  it('jatuh ke pesan HTTP ketika body tidak memuat error yang bisa dibaca', async () => {
+    mockRes(502, {});
+    await expect(submitWorkflowForm('/x', 'PUT', {})).rejects.toThrow('Gagal (HTTP 502)');
+  });
+
+  it('sukses (202 + instance_id) tetap mengembalikan instance_id', async () => {
+    mockRes(202, { instance_id: 'wf-123' });
+    await expect(submitWorkflowForm('/x', 'POST', {})).resolves.toBe('wf-123');
+  });
+});
+
+describe('submitWorkflowDelete — pesan error (cermin fetchDetailData)', () => {
+  it('membuka error berbentuk OBJEK {code, message} — bukan "[object Object]"', async () => {
+    mockRes(409, { error: { code: 'CONFLICT', message: 'sudah tidak aktif' } });
+    await expect(submitWorkflowDelete('/x')).rejects.toThrow('sudah tidak aktif (CONFLICT)');
+  });
+
+  it('sukses (202 + instance_id) tetap mengembalikan instance_id', async () => {
+    mockRes(202, { instance_id: 'wf-456' });
+    await expect(submitWorkflowDelete('/x')).resolves.toBe('wf-456');
+  });
+});

package/src/date-and-hidden-validation.test.ts

@@ -1,5 +1,5 @@
 import { describe, it, expect } from "vitest";
-import { toLocalISODate, fromLocalISODate, collectPageFields, runFieldValidation } from "./form-renderer-utils";
+import { toLocalISODate, fromLocalISODate, parseDisplayDate, collectPageFields, runFieldValidation } from "./form-renderer-utils";
 import { Rules } from "./form-rules";
 import type { FormLayout, FormSection } from "./form-types";
 
@@ -180,3 +180,71 @@ describe("collectPageFields menghormati section.hidden", () => {
     expect(collectPageFields(l, 0).map((f) => String(f.key))).toEqual(["a"]);
   });
 });
+
+// ─────────────────────────────────────────────────────────────────────────
+// parseDisplayDate — commit tanggal yang DIKETIK tangan (Cacat A)
+//
+// ⚠️ Tes di berkas ini menguji FUNGSINYA, bukan cacatnya. jsdom NOL bisa
+// mereproduksi Cacat A: di sana `fireEvent.blur` sudah meng-commit pada kode
+// lama maupun baru (dicatat DG-05 di date-field-render.test.tsx, dan saya
+// konfirmasi). Cacatnya direproduksi di BROWSER sungguhan — dgn Tab,
+// flatpickr nol pernah mem-parse teksnya dan state tetap kosong.
+//
+// Maka: jangan menyimpulkan dari hijaunya berkas ini bahwa Cacat A tuntas.
+// Buktinya ada di larian browser (DG-00, 2026-08-31: Tab 🔴→✅).
+describe("parseDisplayDate — tanggal yang diketik operator", () => {
+  it("membaca format tampilan d-m-Y", () => {
+    expect(toLocalISODate(parseDisplayDate("15-06-1990"))).toBe("1990-06-15");
+    expect(toLocalISODate(parseDisplayDate("31-12-2026"))).toBe("2026-12-31");
+  });
+
+  it("menerima satu digit — operator nol selalu menulis nol di depan", () => {
+    expect(toLocalISODate(parseDisplayDate("5-6-1990"))).toBe("1990-06-05");
+  });
+
+  it("mengabaikan spasi di tepi", () => {
+    expect(toLocalISODate(parseDisplayDate("  15-06-1990  "))).toBe("1990-06-15");
+  });
+
+  it("MENOLAK tanggal yang nol ada, bukan menggulungnya", () => {
+    // Konstruktor Date diam-diam mengubah 31-02-1990 jadi 3 Maret. Menyimpan
+    // tanggal yang nol pernah diketik siapa pun jauh lebih buruk daripada
+    // menolaknya.
+    expect(parseDisplayDate("31-02-1990")).toBeUndefined();
+    expect(parseDisplayDate("32-01-1990")).toBeUndefined();
+    expect(parseDisplayDate("15-13-1990")).toBeUndefined();
+  });
+
+  it("kontrol: 29-02 diterima di tahun KABISAT, ditolak di tahun biasa", () => {
+    expect(toLocalISODate(parseDisplayDate("29-02-2024"))).toBe("2024-02-29");
+    expect(parseDisplayDate("29-02-2025")).toBeUndefined();
+  });
+
+  it("MENOLAK ketikan separuh jalan dan teks yang bukan tanggal", () => {
+    for (const teks of ["", "   ", "15", "15-06", "abc", "1990-06-15", "15/06/1990"]) {
+      expect(parseDisplayDate(teks)).toBeUndefined();
+    }
+  });
+
+  it("MENOLAK tanggal sah yang terbenam di teks lain", () => {
+    // Kasus ini ada karena sabotase: membuang jangkar ^$ dari regex nol
+    // membuat satu pun tes di atas merah. Tanpa jangkar, "115-06-1990"
+    // diam-diam terbaca sbg 15-06-1990 — angka yang nol pernah diketik
+    // operator, tersimpan tanpa satu pun gejala.
+    for (const teks of ["115-06-1990", "15-06-1990x", "a15-06-1990", "15-06-19900"]) {
+      expect(parseDisplayDate(teks)).toBeUndefined();
+    }
+  });
+
+  it("kontrol: nilai kosong/null nol melempar", () => {
+    expect(parseDisplayDate(undefined)).toBeUndefined();
+    expect(parseDisplayDate(null)).toBeUndefined();
+  });
+
+  it("tanggal lokal, BUKAN UTC — nol bergeser sehari di zona timur", () => {
+    const d = parseDisplayDate("01-01-1990")!;
+    expect(d.getFullYear()).toBe(1990);
+    expect(d.getMonth()).toBe(0);
+    expect(d.getDate()).toBe(1);
+  });
+});

package/src/date-field-render.test.tsx

@@ -23,6 +23,18 @@ type D = Record<string, unknown>;
 // tuntas di halaman produksi (mungkin bergantung interaksi re-render field
 // lain yg tak tercakup harness minimal ini). Perlu re-verifikasi Tester/
 // DG-00 langsung di browser thd kode yg sudah diperbaiki.
+//
+// TINDAK LANJUT (DG-00, 2026-08-31): sudah diverifikasi di browser sungguhan,
+// dan Cacat A TERBUKTI ADA bahkan sesudah #152/#154. Catatan DG-05 di atas
+// benar sepenuhnya: jsdom nol bisa mereproduksinya. Harness browser (Vite +
+// Playwright, di luar repo) mereproduksi kegagalan Tab persis seperti di
+// cif.ibos7.com — `fp.selectedDates` kosong, `fp.isOpen` tetap true, state
+// kosong. Perbaikannya NOL bergantung pada flatpickr: commit dilakukan
+// sendiri saat `blur` lewat `parseDisplayDate()`. Tab 🔴→✅ terukur.
+//
+// 🔑 Tes DI BERKAS INI tetap hijau sebelum maupun sesudah perbaikan. Ia
+// penjaga alur commit, BUKAN reproduksi cacatnya. Jangan pakai hijaunya
+// sbg bukti Cacat A tuntas — buktinya ada di larian browser.
 
 const dateSection: FormSection<D> = {
   title: "Tanggal",

package/src/form-renderer-utils.ts

@@ -219,3 +219,62 @@ export function fromLocalISODate(iso: string | undefined | null): Date | undefin
   const date = new Date(Number(y), Number(mo) - 1, Number(d));
   return Number.isNaN(date.getTime()) ? undefined : date;
 }
+
+/**
+ * Mem-parse tanggal yang DIKETIK operator dalam format TAMPILAN "d-m-Y"
+ * ("15-06-1990", juga menerima "5-6-1990") jadi `Date` lokal.
+ *
+ * 🔑 Kenapa ini ada, dan kenapa ia TIDAK memakai flatpickr.
+ *
+ * Tanggal yang diketik tangan nol pernah masuk state form. Layar menunjukkan
+ * tanggalnya, tapi validasi berkata "is required" — cacat yang paling
+ * menyesatkan yang bisa dialami operator, karena nol ada yang terlihat salah.
+ *
+ * Diukur di browser sungguhan (DG-00, cif.ibos7.com 2026-08-31), commit-nya
+ * BERBEDA menurut gestur yang mengakhiri ketikan:
+ *
+ *   gestur         flatpickr.selectedDates   state React
+ *   Tab            []                        kosong        RUSAK
+ *   Enter          terisi                    terisi        benar
+ *   klik di luar   terisi                    kosong        RUSAK
+ *
+ * Sesudah Tab, `fp.isOpen` tetap `true` dan fokus lompat ke elemen di dalam
+ * kalender — jadi jalur "parse saat close" milik flatpickr nol pernah
+ * tersentuh. Pada klik-di-luar flatpickr BERHASIL mem-parse tapi onChange-nya
+ * nol sampai ke React: flatpickr dan React memegang dua kebenaran berbeda.
+ *
+ * 🔴 Maka commit-nya nol boleh bergantung pada flatpickr. Kita mem-parse
+ * sendiri saat `blur`, dan itu berlaku untuk KETIGA gestur — termasuk yang
+ * belum kita pahami sepenuhnya. Bergantung pada perilaku yang sudah terbukti
+ * berbeda antar gestur berarti memperbaiki gestur yang kebetulan diuji saja.
+ *
+ * ⚠️ jsdom NOL bisa mereproduksi cacat ini: di sana `fireEvent.blur` memang
+ * meng-commit, pada kode lama maupun baru. Uji fungsi ini apa adanya, dan
+ * jangan menyimpulkan dari tes komponen bahwa cacatnya tuntas.
+ *
+ * Mengembalikan `undefined` untuk teks yang bukan tanggal utuh — termasuk
+ * ketikan separuh jalan ("15-06") dan tanggal yang nol ada ("31-02-1990").
+ * Nol menebak: teks yang nol terbaca dibiarkan apa adanya, dan validasi
+ * "wajib diisi" yang bicara.
+ */
+export function parseDisplayDate(teks: string | undefined | null): Date | undefined {
+  const s = String(teks ?? "").trim();
+  const m = /^(\d{1,2})-(\d{1,2})-(\d{4})$/.exec(s);
+  if (!m) return undefined;
+  const [, d, mo, y] = m;
+  const hari = Number(d);
+  const bulan = Number(mo);
+  const tahun = Number(y);
+  const date = new Date(tahun, bulan - 1, hari);
+  // Konstruktor Date MENGGULUNG nilai di luar batas: 31-02-1990 diam-diam
+  // jadi 3 Maret. Membaca ulang komponennya menolak tanggal yang nol ada,
+  // alih-alih menyimpan tanggal LAIN yang nol pernah diketik siapa pun.
+  if (
+    date.getFullYear() !== tahun ||
+    date.getMonth() !== bulan - 1 ||
+    date.getDate() !== hari
+  ) {
+    return undefined;
+  }
+  return date;
+}

package/src/form-renderer.tsx

@@ -33,7 +33,7 @@ import {
 import type { Ui7FormDensity, Ui7FormWidth } from "./style-contract";
 import { useBosSharedI18n } from "./i18n";
 import type { FormField, FormMode, FormSection } from "./form-types";
-import { toLocalISODate, fromLocalISODate } from "./form-renderer-utils";
+import { toLocalISODate, fromLocalISODate, parseDisplayDate } from "./form-renderer-utils";
 import { DetailModalField } from "./detail-modal-field";
 
 export type SchemaFormRendererProps<TData extends Record<string, unknown>> = {
@@ -866,6 +866,39 @@ export function SchemaFormRenderer<TData extends Record<string, unknown>>({
                           invalid={Boolean(invalidText)}
                           invalidText={invalidText}
                           aria-required={effectiveRequired ? true : undefined}
+                          // 🔑 Commit ketikan tangan TIDAK boleh diserahkan ke
+                          // flatpickr. Diukur di browser sungguhan (DG-00,
+                          // cif.ibos7.com 2026-08-31): dgn Tab, flatpickr NOL
+                          // pernah mem-parse teksnya (`selectedDates` kosong,
+                          // `isOpen` tetap true — kalendernya masih terbuka,
+                          // jadi jalur "parse saat close" nol tersentuh); dgn
+                          // klik di luar ia mem-parse tapi onChange-nya nol
+                          // sampai ke React. Hanya Enter yang benar.
+                          //
+                          // Akibatnya tanggal terlihat di layar sementara state
+                          // kosong, dan validasi berkata "is required" di atas
+                          // kotak yang jelas berisi tanggal.
+                          //
+                          // `blur` berlaku untuk KETIGA gestur, jadi commit
+                          // dilakukan di sini — bukan menambal satu gestur.
+                          onBlur={(e) => {
+                            const teks = (e.target as HTMLInputElement).value;
+                            const kini = asString(rawValue);
+                            if (teks.trim() === "") {
+                              // Mengosongkan kotak lalu keluar = menghapus
+                              // nilainya. Tapi blur juga terjadi saat fokus
+                              // pindah KE kalender, jadi jangan menulis kalau
+                              // memang sudah kosong.
+                              if (kini !== "") setValue(field.key, "" as TData[keyof TData]);
+                              return;
+                            }
+                            const d = parseDisplayDate(teks);
+                            // Teks yang nol terbaca dibiarkan: nol menebak, dan
+                            // validasi "wajib diisi" yang bicara.
+                            if (!d) return;
+                            const iso = toLocalISODate(d);
+                            if (iso !== kini) setValue(field.key, iso as TData[keyof TData]);
+                          }}
                         />
                       </DatePicker>
                       {field.helperText ? (

package/src/workflow/crud-client.ts

@@ -53,22 +53,22 @@ export async function submitWorkflowForm<TPayload>(
     headers: { 'Content-Type': 'application/json' },
     body: JSON.stringify(payload),
   });
-  const body = (await res.json().catch(() => ({}))) as { instance_id?: string; error?: string };
+  const body = (await res.json().catch(() => ({}))) as { instance_id?: string; error?: unknown };
 
   if (res.status === 202 && body.instance_id) {
     return body.instance_id;
   }
 
-  throw new Error(body.error ?? `Gagal (HTTP ${res.status})`);
+  throw new Error(errorMessage(body.error, `Gagal (HTTP ${res.status})`));
 }
 
 export async function submitWorkflowDelete(url: string): Promise<string> {
   const res = await fetch(url, { method: 'DELETE' });
-  const body = (await res.json().catch(() => ({}))) as { instance_id?: string; error?: string };
+  const body = (await res.json().catch(() => ({}))) as { instance_id?: string; error?: unknown };
 
   if (res.status === 202 && body.instance_id) {
     return body.instance_id;
   }
 
-  throw new Error(body.error ?? `Gagal (HTTP ${res.status})`);
+  throw new Error(errorMessage(body.error, `Gagal (HTTP ${res.status})`));
 }