From 0eeb5b07a96aaa914b452b2d2c514833181ffb1a Mon Sep 17 00:00:00 2001 From: ashim-hq Date: Mon, 20 Apr 2026 21:33:24 +0800 Subject: [PATCH 1/6] fix: clear batch zip and processing flag in undoProcessing() --- apps/web/src/stores/file-store.ts | 3 +++ 1 file changed, 3 insertions(+) diff --git a/apps/web/src/stores/file-store.ts b/apps/web/src/stores/file-store.ts index eeed0f25..85fcde00 100644 --- a/apps/web/src/stores/file-store.ts +++ b/apps/web/src/stores/file-store.ts @@ -297,6 +297,9 @@ export const useFileStore = create((set, get) => ({ })); set({ entries: resetEntries, + batchZipBlob: null, + batchZipFilename: null, + processing: false, error: null, files: deriveFiles(resetEntries), ...deriveSelected(resetEntries, selectedIndex), From 335e35c96ac3b682f5c98dc9dac2ce9e9312c517 Mon Sep 17 00:00:00 2001 From: ashim-hq Date: Mon, 20 Apr 2026 21:36:14 +0800 Subject: [PATCH 2/6] fix: reset processed state and tool-specific stores on tool navigation --- apps/web/src/pages/tool-page.tsx | 29 +++++++++++++++++++++++++++-- 1 file changed, 27 insertions(+), 2 deletions(-) diff --git a/apps/web/src/pages/tool-page.tsx b/apps/web/src/pages/tool-page.tsx index 25d47e99..46658560 100644 --- a/apps/web/src/pages/tool-page.tsx +++ b/apps/web/src/pages/tool-page.tsx @@ -27,8 +27,14 @@ import { useMobile } from "@/hooks/use-mobile"; import { formatFileSize } from "@/lib/download"; import { ICON_MAP } from "@/lib/icon-map"; import { getToolRegistryEntry } from "@/lib/tool-registry"; +import { useBase64Store } from "@/stores/base64-store"; +import { useCollageStore } from "@/stores/collage-store"; +import { useDuplicateStore } from "@/stores/duplicate-store"; import { useFeaturesStore } from "@/stores/features-store"; import { useFileStore } from "@/stores/file-store"; +import { usePdfToImageStore } from "@/stores/pdf-to-image-store"; +import { useQrStore } from "@/stores/qr-store"; +import { useSplitStore } from "@/stores/split-store"; /** Formats that browsers can render in tags. */ const BROWSER_PREVIEWABLE_EXTS = new Set([ @@ -202,11 +208,30 @@ export function ToolPage() { // Center of the painted mask as a 0-100 percentage — used to init the slider at the right spot const [eraserSliderInitPos, setEraserSliderInitPos] = useState(null); - // Reset crop state when the image changes + // biome-ignore lint/correctness/useExhaustiveDependencies: toolId triggers intentional reset on tool navigation useEffect(() => { + useFileStore.getState().undoProcessing(); + + useBase64Store.getState().reset(); + useCollageStore.getState().reset(); + useDuplicateStore.getState().reset(); + usePdfToImageStore.getState().reset(); + useQrStore.getState().reset(); + useSplitStore.getState().reset(); + + setPreviewTransform(null); + setPreviewFilter(""); + setImageWrapperStyle(null); + setBgPreview(null); setCropCrop({ unit: "%", x: 0, y: 0, width: 100, height: 100 }); + setCropAspect(undefined); + setCropShowGrid(true); setCropImgDimensions(null); - }, []); + setEraserHasStrokes(false); + setEraserBrushSize(30); + setEraserSliderInitPos(null); + setMobileSettingsOpen(true); + }, [toolId]); const handleFiles = useCallback( (newFiles: File[]) => { From 2ccd01178b32c23aefb6a5505b67fbc473f7ad21 Mon Sep 17 00:00:00 2001 From: ashim-hq Date: Mon, 20 Apr 2026 21:39:56 +0800 Subject: [PATCH 3/6] test: add 8 state-bleed regression tests for tool navigation --- tests/e2e/state-bleed-audit.spec.ts | 243 ++++++++++++++++++++++++++++ 1 file changed, 243 insertions(+) create mode 100644 tests/e2e/state-bleed-audit.spec.ts diff --git a/tests/e2e/state-bleed-audit.spec.ts b/tests/e2e/state-bleed-audit.spec.ts new file mode 100644 index 00000000..147e18b7 --- /dev/null +++ b/tests/e2e/state-bleed-audit.spec.ts @@ -0,0 +1,243 @@ +import { expect, test, uploadTestImage, waitForProcessing } from "./helpers"; + +// --------------------------------------------------------------------------- +// State-bleed audit: verify that processed state from one tool does NOT +// leak into another tool after navigation. +// +// Bug: navigating from a tool with processed results to a different tool +// shows stale processed state (download buttons, blob: URLs, before/after +// comparisons) in the right pane instead of a clean dropzone. +// +// Root cause hypothesis: the global Zustand file-store is not reset when +// the user navigates between tool routes — the previous tool's entries, +// processedUrl, and blob URLs persist into the next tool's view. +// --------------------------------------------------------------------------- + +test.describe("State bleed between tools", () => { + // ── Core scenario: resize -> rotate ────────────────────────────────── + test("processed state from resize does NOT appear in rotate", async ({ loggedInPage: page }) => { + // Step 1: Navigate to resize and process an image + await page.goto("/resize"); + await uploadTestImage(page); + + await page.locator("input[placeholder='Auto']").first().fill("50"); + await page.getByRole("button", { name: "Resize" }).click(); + await waitForProcessing(page); + + // Confirm processed state is present (download link visible) + await expect(page.getByRole("link", { name: /download/i }).first()).toBeVisible({ + timeout: 15_000, + }); + + // Step 2: Navigate to the rotate tool via direct URL + await page.goto("/rotate"); + await page.waitForLoadState("networkidle"); + + // Step 3: The right pane should be in a clean state — dropzone visible + await expect(page.getByText("Upload from computer")).toBeVisible({ timeout: 5_000 }); + + // Step 4: No stale download link from resize should be present + await expect(page.getByRole("link", { name: /download/i })).not.toBeVisible(); + + // Step 5: No blob: URLs in image elements (would indicate stale processed images) + const blobImages = page.locator("img[src^='blob:']"); + await expect(blobImages).toHaveCount(0); + + // Step 6: No before/after comparison slider should be visible + await expect(page.locator("[class*='before-after'], [class*='BeforeAfter']")).not.toBeVisible(); + }); + + // ── Reverse direction: rotate -> resize ────────────────────────────── + test("processed state from rotate does NOT appear in resize", async ({ loggedInPage: page }) => { + // Process an image in rotate + await page.goto("/rotate"); + await uploadTestImage(page); + + await page.getByTestId("rotate-right").click(); + await expect(page.locator("input[inputmode='numeric']")).toHaveValue("90", { timeout: 2000 }); + await page.getByTestId("rotate-submit").click(); + await waitForProcessing(page); + + await expect( + page + .getByRole("button", { name: /^download$/i }) + .or(page.getByRole("link", { name: /download/i })) + .first(), + ).toBeVisible({ timeout: 15_000 }); + + // Navigate to resize + await page.goto("/resize"); + await page.waitForLoadState("networkidle"); + + // Should show clean dropzone + await expect(page.getByText("Upload from computer")).toBeVisible({ timeout: 5_000 }); + await expect(page.getByRole("link", { name: /download/i })).not.toBeVisible(); + }); + + // ── Navigate from dropzone tool to no-dropzone tool (QR Generate) ──── + test("processed state from compress does NOT appear in QR Generate", async ({ + loggedInPage: page, + }) => { + // Process an image in compress + await page.goto("/compress"); + await uploadTestImage(page); + await page.getByRole("button", { name: "Compress" }).click(); + await waitForProcessing(page); + + await expect(page.getByRole("link", { name: /download/i }).first()).toBeVisible({ + timeout: 15_000, + }); + + // Navigate to QR Generate (no-dropzone tool) + await page.goto("/qr-generate"); + await page.waitForLoadState("networkidle"); + + // QR Generate should NOT show any file upload state or stale results + await expect(page.getByText("Upload from computer")).not.toBeVisible(); + await expect(page.getByRole("link", { name: /download/i })).not.toBeVisible(); + + // The QR input should be clean and functional + await expect(page.getByTestId("qr-input-url")).toBeVisible(); + + // No stale processed images from compress should be visible + const blobImages = page.locator("img[src^='blob:']"); + await expect(blobImages).toHaveCount(0); + }); + + // ── Navigate from no-dropzone tool back to dropzone tool ───────────── + test("QR Generate state does NOT bleed into resize", async ({ loggedInPage: page }) => { + // Use QR Generate first + await page.goto("/qr-generate"); + await page.getByTestId("qr-input-url").fill("https://example.com"); + await expect(page.locator("canvas, svg").first()).toBeVisible({ timeout: 5000 }); + + // Navigate to resize + await page.goto("/resize"); + await page.waitForLoadState("networkidle"); + + // Resize should show a clean dropzone + await expect(page.getByText("Upload from computer")).toBeVisible({ timeout: 5_000 }); + await expect(page.getByText("QR")).not.toBeVisible(); + }); + + // ── Multiple images: upload several files, process, navigate ───────── + test("multi-file processed state does NOT bleed across tools", async ({ loggedInPage: page }) => { + // Upload and process in resize + await page.goto("/resize"); + await uploadTestImage(page); + + // Add a second file by uploading again via the "+ Add more" button + const addMoreBtn = page.getByText("+ Add more"); + if (await addMoreBtn.isVisible({ timeout: 2000 }).catch(() => false)) { + const fileChooserPromise = page.waitForEvent("filechooser"); + await addMoreBtn.click(); + const fileChooser = await fileChooserPromise; + await fileChooser.setFiles( + require("node:path").join(process.cwd(), "tests", "fixtures", "test-50x50.webp"), + ); + await page.waitForTimeout(500); + } + + // Process all files + await page.locator("input[placeholder='Auto']").first().fill("25"); + await page.getByRole("button", { name: "Resize" }).click(); + await waitForProcessing(page); + + await expect(page.getByRole("link", { name: /download/i }).first()).toBeVisible({ + timeout: 15_000, + }); + + // Navigate to convert + await page.goto("/convert"); + await page.waitForLoadState("networkidle"); + + // Should show clean state — no leftover files or processed results + await expect(page.getByText("Upload from computer")).toBeVisible({ timeout: 5_000 }); + await expect(page.getByRole("link", { name: /download/i })).not.toBeVisible(); + + // No thumbnail strip from previous multi-file upload + const thumbnails = page.locator("[aria-label='Previous image'], [aria-label='Next image']"); + await expect(thumbnails).toHaveCount(0); + }); + + // ── Sidebar navigation (not just goto) ─────────────────────────────── + test("sidebar navigation clears processed state", async ({ loggedInPage: page }) => { + // Process an image in resize + await page.goto("/resize"); + await uploadTestImage(page); + + await page.locator("input[placeholder='Auto']").first().fill("50"); + await page.getByRole("button", { name: "Resize" }).click(); + await waitForProcessing(page); + + await expect(page.getByRole("link", { name: /download/i }).first()).toBeVisible({ + timeout: 15_000, + }); + + // Navigate home via sidebar + await page.locator("aside").getByText("Tools").click(); + await expect(page).toHaveURL("/"); + + // Home page should show clean dropzone, not stale resize results + await expect(page.getByText("Upload from computer")).toBeVisible({ timeout: 5_000 }); + await expect(page.getByRole("link", { name: /download/i })).not.toBeVisible(); + }); + + // ── Rapid navigation: process -> navigate -> navigate again ────────── + test("rapid sequential navigation does not accumulate stale state", async ({ + loggedInPage: page, + }) => { + // Process in resize + await page.goto("/resize"); + await uploadTestImage(page); + await page.locator("input[placeholder='Auto']").first().fill("50"); + await page.getByRole("button", { name: "Resize" }).click(); + await waitForProcessing(page); + + await expect(page.getByRole("link", { name: /download/i }).first()).toBeVisible({ + timeout: 15_000, + }); + + // Navigate to rotate, then immediately to compress, then to convert + await page.goto("/rotate"); + await page.goto("/compress"); + await page.goto("/convert"); + await page.waitForLoadState("networkidle"); + + // The final destination (convert) should have a completely clean state + await expect(page.getByText("Upload from computer")).toBeVisible({ timeout: 5_000 }); + await expect(page.getByRole("link", { name: /download/i })).not.toBeVisible(); + + const blobImages = page.locator("img[src^='blob:']"); + await expect(blobImages).toHaveCount(0); + }); + + // ── Verify processed status text is not carried over ───────────────── + test("completion indicators from one tool do not appear in another", async ({ + loggedInPage: page, + }) => { + // Process in compress (shows size comparison after processing) + await page.goto("/compress"); + await uploadTestImage(page); + await page.getByRole("button", { name: "Compress" }).click(); + await waitForProcessing(page); + + await expect(page.getByRole("link", { name: /download/i }).first()).toBeVisible({ + timeout: 15_000, + }); + + // Navigate to crop + await page.goto("/crop"); + await page.waitForLoadState("networkidle"); + + // Crop should show clean dropzone, no processed-state UI + await expect(page.getByText("Upload from computer")).toBeVisible({ timeout: 5_000 }); + + // No "Conversion complete" or review-panel artifacts + await expect(page.getByText("Conversion complete")).not.toBeVisible(); + + // No download/undo buttons from compress should remain + await expect(page.getByRole("link", { name: /download/i })).not.toBeVisible(); + await expect(page.getByRole("button", { name: /undo/i })).not.toBeVisible(); + }); +}); From 491e6fb5544fd9c96c88900b7fe2554e08c9c6a6 Mon Sep 17 00:00:00 2001 From: ashim-hq Date: Mon, 20 Apr 2026 22:13:07 +0800 Subject: [PATCH 4/6] fix: prevent PaddleOCR segfault on CPU-only Docker by setting CUDA env vars --- packages/ai/python/ocr.py | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/packages/ai/python/ocr.py b/packages/ai/python/ocr.py index a0f061d3..6ad6390c 100644 --- a/packages/ai/python/ocr.py +++ b/packages/ai/python/ocr.py @@ -3,6 +3,17 @@ import sys import json import os +# Prevent PaddlePaddle C++ runtime from probing for CUDA on CPU-only systems. +# Without these, paddlepaddle-gpu can segfault during import on machines without +# a GPU, because the C++ layer attempts GPU initialization before Python-level +# device routing takes effect. Must run before any PaddleOCR import. +from gpu import gpu_available as _gpu_available +if not _gpu_available(): + if not os.environ.get("FLAGS_use_cuda"): + os.environ["FLAGS_use_cuda"] = "0" + if not os.environ.get("FLAGS_use_cudnn"): + os.environ["FLAGS_use_cudnn"] = "0" + # Lazy-loaded VLM instance (stays resident in dispatcher process) _paddleocr_vl_instance = None From c738f161070491444d9973e8c6589879373d44c9 Mon Sep 17 00:00:00 2001 From: ashim-hq Date: Mon, 20 Apr 2026 22:13:53 +0800 Subject: [PATCH 5/6] fix: support AVIF compress and fix hardcoded content type --- apps/api/src/lib/output-format.ts | 1 + apps/api/src/routes/tools/compress.ts | 4 +++- packages/image-engine/src/engine.ts | 1 + packages/image-engine/src/operations/compress.ts | 1 + 4 files changed, 6 insertions(+), 1 deletion(-) diff --git a/apps/api/src/lib/output-format.ts b/apps/api/src/lib/output-format.ts index 2132cb8f..940b7802 100644 --- a/apps/api/src/lib/output-format.ts +++ b/apps/api/src/lib/output-format.ts @@ -17,6 +17,7 @@ const FORMAT_MAP: Record< gif: { format: "gif", extension: "gif", contentType: "image/gif" }, tiff: { format: "tiff", extension: "tiff", contentType: "image/tiff" }, avif: { format: "avif", extension: "avif", contentType: "image/avif" }, + heif: { format: "avif", extension: "avif", contentType: "image/avif" }, }; const DEFAULT_QUALITY = 95; diff --git a/apps/api/src/routes/tools/compress.ts b/apps/api/src/routes/tools/compress.ts index e31eb961..50046bf7 100644 --- a/apps/api/src/routes/tools/compress.ts +++ b/apps/api/src/routes/tools/compress.ts @@ -2,6 +2,7 @@ import { compress } from "@ashim/image-engine"; import type { FastifyInstance } from "fastify"; import sharp from "sharp"; import { z } from "zod"; +import { resolveOutputFormat } from "../../lib/output-format.js"; import { createToolRoute } from "../tool-factory.js"; const settingsSchema = z.object({ @@ -16,6 +17,7 @@ export function registerCompress(app: FastifyInstance) { settingsSchema, process: async (inputBuffer, settings, filename) => { const image = sharp(inputBuffer); + const outputFormat = await resolveOutputFormat(inputBuffer, filename); const compressOptions: { quality?: number; @@ -31,7 +33,7 @@ export function registerCompress(app: FastifyInstance) { const result = await compress(image, compressOptions); const buffer = await result.toBuffer(); - return { buffer, filename, contentType: "image/jpeg" }; + return { buffer, filename, contentType: outputFormat.contentType }; }, }); } diff --git a/packages/image-engine/src/engine.ts b/packages/image-engine/src/engine.ts index 42f2aac0..77f922d9 100644 --- a/packages/image-engine/src/engine.ts +++ b/packages/image-engine/src/engine.ts @@ -70,6 +70,7 @@ const FORMAT_MAP: Record = { png: "png", webp: "webp", avif: "avif", + heif: "avif", tiff: "tiff", gif: "gif", }; diff --git a/packages/image-engine/src/operations/compress.ts b/packages/image-engine/src/operations/compress.ts index e999fe8f..01d9fa37 100644 --- a/packages/image-engine/src/operations/compress.ts +++ b/packages/image-engine/src/operations/compress.ts @@ -6,6 +6,7 @@ const FORMAT_MAP: Record = { png: "png", webp: "webp", avif: "avif", + heif: "avif", tiff: "tiff", gif: "gif", }; From 795965ed43139eb97b10085206ec6f24e601c92b Mon Sep 17 00:00:00 2001 From: ashim-hq Date: Mon, 20 Apr 2026 22:14:14 +0800 Subject: [PATCH 6/6] fix: truncate long filenames to prevent filesystem ENAMETOOLONG errors --- apps/api/src/lib/filename.ts | 13 ++++++++ tests/unit/api/utilities.test.ts | 53 ++++++++++++++++++++++++++++++-- 2 files changed, 64 insertions(+), 2 deletions(-) diff --git a/apps/api/src/lib/filename.ts b/apps/api/src/lib/filename.ts index c043dd4c..7b640566 100644 --- a/apps/api/src/lib/filename.ts +++ b/apps/api/src/lib/filename.ts @@ -45,5 +45,18 @@ export function sanitizeFilename(raw: string): string { } } + // Truncate to filesystem-safe length (255 byte NAME_MAX minus margin for _toolId suffix) + const MAX_NAME_BYTES = 200; + const enc = new TextEncoder(); + if (enc.encode(name).length > MAX_NAME_BYTES) { + const dotIdx = name.lastIndexOf("."); + const ext = dotIdx > 0 ? name.slice(dotIdx) : ""; + let base = dotIdx > 0 ? name.slice(0, dotIdx) : name; + while (enc.encode(base + ext).length > MAX_NAME_BYTES) { + base = base.slice(0, -1); + } + name = base + ext; + } + return name; } diff --git a/tests/unit/api/utilities.test.ts b/tests/unit/api/utilities.test.ts index d032a7f6..52271fe8 100644 --- a/tests/unit/api/utilities.test.ts +++ b/tests/unit/api/utilities.test.ts @@ -821,6 +821,46 @@ function sanitizeFilename(raw: string): string { if (!name || name === "." || name === "..") { name = "upload"; } + + // Guard against double-extension attacks (e.g. "image.png.php"). + const dotIndex = name.indexOf("."); + if (dotIndex !== -1) { + const parts = name.split("."); + const SAFE_IMAGE_EXTENSIONS = new Set([ + ".jpg", + ".jpeg", + ".png", + ".webp", + ".gif", + ".bmp", + ".tiff", + ".tif", + ".avif", + ".svg", + ".pdf", + ]); + for (let i = 1; i < parts.length; i++) { + const ext = `.${parts[i].toLowerCase()}`; + if (SAFE_IMAGE_EXTENSIONS.has(ext)) { + name = parts.slice(0, i + 1).join("."); + break; + } + } + } + + // Truncate to filesystem-safe length (255 byte NAME_MAX minus margin for _toolId suffix) + const MAX_NAME_BYTES = 200; + const enc = new TextEncoder(); + if (enc.encode(name).length > MAX_NAME_BYTES) { + const dotIdx = name.lastIndexOf("."); + const ext = dotIdx > 0 ? name.slice(dotIdx) : ""; + let base = dotIdx > 0 ? name.slice(0, dotIdx) : name; + while (enc.encode(base + ext).length > MAX_NAME_BYTES) { + base = base.slice(0, -1); + } + name = base + ext; + } + return name; } @@ -961,9 +1001,18 @@ describe("sanitizeFilename", () => { expect(sanitizeFilename("my..file..name.png")).toBe("myfilename.png"); }); - it("handles very long filenames", () => { + it("handles very long filenames by truncating to filesystem-safe length", () => { const longName = "a".repeat(500) + ".png"; - expect(sanitizeFilename(longName)).toBe(longName); + const result = sanitizeFilename(longName); + expect(new TextEncoder().encode(result).length).toBeLessThanOrEqual(200); + expect(result).toMatch(/\.png$/); + }); + + it("truncates very long filenames to filesystem-safe length", () => { + const longName = "a".repeat(300) + ".jpg"; + const result = sanitizeFilename(longName); + expect(new TextEncoder().encode(result).length).toBeLessThanOrEqual(200); + expect(result).toMatch(/\.jpg$/); }); it("handles filename with only extension", () => {