@kahitsan/ksui 0.29.0 → 0.30.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kahitsan/ksui",
-  "version": "0.29.0",
+  "version": "0.30.0",
   "description": "ksui is a standalone set of SolidJS UI components for KahitSan/Hilinga and any SolidJS app. Published to the public npm registry and consumed as a normal dependency. Ships source under a `solid` export condition so the consumer's vite-plugin-solid compiles it with only solid-js externalized; it depends on nothing but solid-js + lucide-solid and injects its own CSS.",
   "type": "module",
   "main": "./src/index.ts",

package/src/index.ts

@@ -197,6 +197,12 @@ export { attachmentUrl, isResolvableAttachment } from "./utils/attachments";
 
 export { createObjectUrlResource } from "./utils/object-url-resource";
 export type { ObjectUrlOptions } from "./utils/object-url-resource";
+export {
+  createPendingFile,
+  revokePendingFile,
+  uploadPendingFiles,
+} from "./utils/pending-file";
+export type { PendingFile, UploadPendingFilesOptions } from "./utils/pending-file";
 
 export { useAccountsIndex, resolveAccount, resolveAccountName } from "./utils/accounts-index";
 

package/src/utils/pending-file.test.ts

@@ -0,0 +1,59 @@
+// uploadPendingFiles: per-file best-effort POST to the transactions plugin's
+// standard attachment route, returning the names that failed.
+import { describe, expect, it, vi, afterEach } from "vitest";
+import { uploadPendingFiles, type PendingFile } from "./pending-file";
+
+function pf(name: string): PendingFile {
+  return { id: name, file: new File(["x"], name), previewUrl: null };
+}
+
+describe("uploadPendingFiles", () => {
+  afterEach(() => {
+    vi.unstubAllGlobals();
+  });
+
+  it("POSTs each file to the transaction's attachments route with credentials included", async () => {
+    const fetchMock = vi.fn().mockResolvedValue({ ok: true });
+    vi.stubGlobal("fetch", fetchMock);
+
+    const failed = await uploadPendingFiles(42, [pf("receipt.jpg")]);
+
+    expect(failed).toEqual([]);
+    expect(fetchMock).toHaveBeenCalledWith(
+      "/api/transactions/42/attachments",
+      expect.objectContaining({ method: "POST", credentials: "include" })
+    );
+  });
+
+  it("layers caller-supplied headers onto the request", async () => {
+    const fetchMock = vi.fn().mockResolvedValue({ ok: true });
+    vi.stubGlobal("fetch", fetchMock);
+
+    await uploadPendingFiles(42, [pf("receipt.jpg")], {
+      headers: { "X-Workspace-Id": "7" },
+    });
+
+    expect(fetchMock).toHaveBeenCalledWith(
+      "/api/transactions/42/attachments",
+      expect.objectContaining({ headers: { "X-Workspace-Id": "7" } })
+    );
+  });
+
+  it("collects failed file names without aborting the remaining uploads", async () => {
+    const fetchMock = vi
+      .fn()
+      .mockResolvedValueOnce({ ok: false })
+      .mockRejectedValueOnce(new Error("network error"))
+      .mockResolvedValueOnce({ ok: true });
+    vi.stubGlobal("fetch", fetchMock);
+
+    const failed = await uploadPendingFiles(42, [
+      pf("a.jpg"),
+      pf("b.jpg"),
+      pf("c.jpg"),
+    ]);
+
+    expect(failed).toEqual(["a.jpg", "b.jpg"]);
+    expect(fetchMock).toHaveBeenCalledTimes(3);
+  });
+});

package/src/utils/pending-file.ts

@@ -0,0 +1,68 @@
+// Pre-upload pending file state — a file the user has picked or pasted but not
+// yet uploaded. The plugins that support attachment upload (transactions,
+// counter, timesheets/payroll) each defined this locally; extracted here so
+// they share one canonical type + helpers and avoid drift.
+
+/** A file the user picked or pasted but hasn't been uploaded yet. */
+export interface PendingFile {
+  id: string;
+  file: File;
+  previewUrl: string | null;
+}
+
+let _counter = 0;
+
+/** Wrap a picked/pasted File into a PendingFile with a stable id and optional
+ *  image preview URL. Must be called from the client (browser) — relies on
+ *  URL.createObjectURL. */
+export function createPendingFile(file: File): PendingFile {
+  const isImage = file.type.startsWith("image/");
+  return {
+    id: `pf-${++_counter}-${Date.now()}`,
+    file,
+    previewUrl: isImage ? URL.createObjectURL(file) : null,
+  };
+}
+
+/** Release the object URL held by a pending file. Call when the file is removed
+ *  from the list or after upload completes. */
+export function revokePendingFile(pf: PendingFile): void {
+  if (pf.previewUrl) URL.revokeObjectURL(pf.previewUrl);
+}
+
+/** Extra fetch() init the caller needs layered onto every upload request —
+ *  e.g. timesheets/payroll's X-Workspace-Id header for the fresh-login case
+ *  where the host's fetch monkey-patch has no localStorage fallback yet. */
+export interface UploadPendingFilesOptions {
+  headers?: Record<string, string>;
+}
+
+/** Upload each pending file to the transactions plugin's standard multipart
+ *  POST /:id/attachments S3 route — the one place attachment bytes are ever
+ *  written, whichever plugin's UI collected them. Best-effort per file: a
+ *  failed upload doesn't stop the rest. Returns the file names that failed,
+ *  in the file's own `name` (not a caller-relabeled `file_name`), for the
+ *  caller to surface as a soft error. */
+export async function uploadPendingFiles(
+  transactionId: number,
+  files: PendingFile[],
+  opts: UploadPendingFilesOptions = {}
+): Promise<string[]> {
+  const failed: string[] = [];
+  for (const pf of files) {
+    try {
+      const fd = new FormData();
+      fd.append("file", pf.file, pf.file.name);
+      const res = await fetch(`/api/transactions/${transactionId}/attachments`, {
+        method: "POST",
+        credentials: "include",
+        headers: opts.headers,
+        body: fd,
+      });
+      if (!res.ok) failed.push(pf.file.name);
+    } catch {
+      failed.push(pf.file.name);
+    }
+  }
+  return failed;
+}