David/MEGAINFRA-WEBAPP
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(slip-preview): build PB URL from recordId (was parsing filename)

Browse source
This commit is contained in:
DEls 2026-08-26 23:22:33 +02:00
parent aded006b9f
commit ce3de2f9fb
1 changed files with 20 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

36
src/components/slip-preview.tsx
View file

@ -4,20 +4,28 @@ import { Download, FileImage } from "lucide-react";
import { PB_BASE_URL } from "@/lib/pb";
/**
* Renders a delivery-note slip image or PDF download link.
* Renders a delivery-note slip image or inline PDF.
*
* `filename` is the bare filename PocketBase stores on the
* `delivery_notes.slip_image` field (e.g.
* "cam_scanner_2026_08_26_09_sbh10tzijy.16.pdf").
* `recordId` is the parent `delivery_notes` record id.
*
* `filename` is the PB file-store path PocketBase stores on the
* `delivery_notes.slip_image` field — shaped `recordId/collectionId/stored`.
* PB exposes the bytes at
* {PB_BASE_URL}/api/files/<collectionId>/<recordId>/<encoded stored path>
* so we split + reassemble + URL-encode to fetch from the browser.
* {PB_BASE_URL}/api/files/delivery_notes/<recordId>/<encoded filename>
* — same pattern as the server-side route
* src/app/api/delivery-notes/[id]/slip/route.ts.
*
* Shared between the PO detail view (existing) and the "Awaiting PO
* assignment" modal (new). Keep the URL builder consistent with
* api/delivery-notes/[id]/slip/route.ts which uses the same pattern
* server-side.
* Shared between the PO detail view and the "Awaiting PO
* assignment" modal.
*/
export function SlipPreview({ filename }: { filename: string }) {
export function SlipPreview({
filename,
recordId,
}: {
filename: string;
recordId: string;
}) {
if (!filename) {
return (
<div className="flex items-center justify-center gap-2 rounded-md border border-dashed border-border bg-muted/30 p-6 text-sm text-muted-foreground">
@ -26,11 +34,7 @@ export function SlipPreview({ filename }: { filename: string }) {
</div>
);
}
const parts = filename.split("/");
const recordId = parts[0];
const collectionId = parts[1];
const stored = parts.slice(2).join("/");
const url = `${PB_BASE_URL}/api/files/${collectionId}/${recordId}/${encodeURIComponent(stored)}`;
const url = `${PB_BASE_URL}/api/files/delivery_notes/${recordId}/${encodeURIComponent(filename)}`;
const isPdf = filename.toLowerCase().endsWith(".pdf");
return (
<div className="space-y-3">
@ -39,7 +43,7 @@ export function SlipPreview({ filename }: { filename: string }) {
<iframe
src={url}
title="Delivery slip"
className="h-[70vh] w-full rounded-md border border-border bg-white"
className="h-[400px] w-full rounded-md border border-border bg-white"
/>
<p className="text-xs text-muted-foreground">
<a