proper asset creation/deletion, also raw file view in admin as well

apps/main/src/lib/core/constants.ts

@@ -1,4 +1,5 @@
 import LayoutDashboard from "@lucide/svelte/icons/layout-dashboard";
+import FileArchive from "@lucide/svelte/icons/file-archive";
 import Smartphone from "@lucide/svelte/icons/smartphone";
 import { BellRingIcon, UsersIcon } from "@lucide/svelte";
 import UserCircle from "~icons/lucide/user-circle";
@@ -31,6 +32,11 @@ export const mainNavTree = [
         url: "/devices",
         icon: Smartphone,
     },
+    {
+        title: "Files",
+        url: "/files",
+        icon: FileArchive,
+    },
 ] as AppSidebarItem[];
 
 export const secondaryNavTree = [

apps/main/src/lib/domains/files/files.remote.ts

@@ -0,0 +1,48 @@
+import { getFileController } from "@pkg/logic/domains/files/controller";
+import {
+    getFlowExecCtxForRemoteFuncs,
+    unauthorized,
+} from "$lib/core/server.utils";
+import { getRequestEvent, query } from "$app/server";
+import * as v from "valibot";
+
+const fc = getFileController();
+
+const filesPaginationSchema = v.object({
+    page: v.pipe(v.number(), v.integer()),
+    pageSize: v.pipe(v.number(), v.integer()),
+    sortBy: v.optional(v.string()),
+    sortOrder: v.optional(v.picklist(["asc", "desc"])),
+});
+
+const getFilesInputSchema = v.object({
+    search: v.optional(v.string()),
+    mimeType: v.optional(v.string()),
+    status: v.optional(v.string()),
+    visibility: v.optional(v.string()),
+    pagination: filesPaginationSchema,
+});
+
+export const getFilesSQ = query(getFilesInputSchema, async (input) => {
+    const event = getRequestEvent();
+    const fctx = await getFlowExecCtxForRemoteFuncs(event.locals);
+    if (!fctx.userId) {
+        return unauthorized(fctx);
+    }
+
+    const res = await fc.getFiles(
+        fctx,
+        {
+            userId: fctx.userId,
+            search: input.search,
+            mimeType: input.mimeType,
+            status: input.status,
+            visibility: input.visibility,
+        },
+        input.pagination,
+    );
+
+    return res.isOk()
+        ? { data: res.value, error: null }
+        : { data: null, error: res.error };
+});

apps/main/src/lib/domains/files/files.vm.svelte.ts

@@ -0,0 +1,60 @@
+import type { File } from "@pkg/logic/domains/files/data";
+import { getFilesSQ } from "./files.remote";
+import { toast } from "svelte-sonner";
+
+class FilesViewModel {
+    files = $state([] as File[]);
+    loading = $state(false);
+
+    search = $state("");
+    page = $state(1);
+    pageSize = $state(25);
+    total = $state(0);
+    totalPages = $state(0);
+    sortBy = $state("createdAt");
+    sortOrder = $state("desc" as "asc" | "desc");
+
+    async fetchFiles() {
+        this.loading = true;
+        try {
+            const result = await getFilesSQ({
+                search: this.search || undefined,
+                pagination: {
+                    page: this.page,
+                    pageSize: this.pageSize,
+                    sortBy: this.sortBy,
+                    sortOrder: this.sortOrder,
+                },
+            });
+
+            if (result?.error || !result?.data) {
+                toast.error(result?.error?.message || "Failed to load files", {
+                    description: result?.error?.description || "Please try again later",
+                });
+                return;
+            }
+
+            this.files = result.data.data as File[];
+            this.total = result.data.total;
+            this.totalPages = result.data.totalPages;
+        } catch (error) {
+            toast.error("Failed to load files", {
+                description:
+                    error instanceof Error ? error.message : "Please try again later",
+            });
+        } finally {
+            this.loading = false;
+        }
+    }
+
+    formatSize(size: number) {
+        if (size < 1024) return `${size} B`;
+        if (size < 1024 * 1024) return `${(size / 1024).toFixed(1)} KB`;
+        if (size < 1024 * 1024 * 1024) {
+            return `${(size / (1024 * 1024)).toFixed(1)} MB`;
+        }
+        return `${(size / (1024 * 1024 * 1024)).toFixed(1)} GB`;
+    }
+}
+
+export const filesVM = new FilesViewModel();

apps/main/src/routes/(main)/files/+page.svelte

@@ -0,0 +1,115 @@
+<script lang="ts">
+    import Icon from "$lib/components/atoms/icon.svelte";
+    import MaxWidthWrapper from "$lib/components/molecules/max-width-wrapper.svelte";
+    import { Button } from "$lib/components/ui/button";
+    import * as Card from "$lib/components/ui/card";
+    import { Input } from "$lib/components/ui/input";
+    import * as Table from "$lib/components/ui/table";
+    import { mainNavTree } from "$lib/core/constants";
+    import { filesVM } from "$lib/domains/files/files.vm.svelte";
+    import { breadcrumbs } from "$lib/global.stores";
+    import FileArchive from "@lucide/svelte/icons/file-archive";
+    import RefreshCw from "@lucide/svelte/icons/refresh-cw";
+    import Search from "@lucide/svelte/icons/search";
+    import { onMount } from "svelte";
+
+    const filesNavItem = mainNavTree.find((item) => item.url === "/files");
+    breadcrumbs.set(filesNavItem ? [filesNavItem] : [{ title: "Files", url: "/files" }]);
+
+    onMount(async () => {
+        await filesVM.fetchFiles();
+    });
+</script>
+
+<MaxWidthWrapper cls="space-y-4">
+    <Card.Root>
+        <Card.Header>
+            <div class="flex items-center justify-between gap-4">
+                <div class="flex items-center gap-2">
+                    <Icon icon={FileArchive} cls="h-5 w-5 text-primary" />
+                    <Card.Title>Files</Card.Title>
+                    <span class="text-muted-foreground text-xs">
+                        {filesVM.total} total
+                    </span>
+                </div>
+                <Button
+                    variant="outline"
+                    size="sm"
+                    onclick={() => void filesVM.fetchFiles()}
+                    disabled={filesVM.loading}
+                >
+                    <Icon
+                        icon={RefreshCw}
+                        cls={`h-4 w-4 mr-2 ${filesVM.loading ? "animate-spin" : ""}`}
+                    />
+                    Refresh
+                </Button>
+            </div>
+
+            <div class="relative mt-3 max-w-sm">
+                <Icon
+                    icon={Search}
+                    cls="absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground"
+                />
+                <Input
+                    class="pl-10"
+                    placeholder="Search by filename..."
+                    bind:value={filesVM.search}
+                    oninput={() => {
+                        filesVM.page = 1;
+                        void filesVM.fetchFiles();
+                    }}
+                />
+            </div>
+        </Card.Header>
+
+        <Card.Content>
+            {#if !filesVM.loading && filesVM.files.length === 0}
+                <div class="py-10 text-center text-sm text-muted-foreground">
+                    No files found.
+                </div>
+            {:else}
+                <Table.Root>
+                    <Table.Header>
+                        <Table.Row>
+                            <Table.Head>File</Table.Head>
+                            <Table.Head>MIME</Table.Head>
+                            <Table.Head>Size</Table.Head>
+                            <Table.Head>Status</Table.Head>
+                            <Table.Head>Uploaded</Table.Head>
+                            <Table.Head>R2 URL</Table.Head>
+                        </Table.Row>
+                    </Table.Header>
+                    <Table.Body>
+                        {#each filesVM.files as item (item.id)}
+                            <Table.Row>
+                                <Table.Cell>
+                                    <div class="font-medium">{item.originalName}</div>
+                                    <div class="font-mono text-xs text-muted-foreground">
+                                        {item.id}
+                                    </div>
+                                </Table.Cell>
+                                <Table.Cell>{item.mimeType}</Table.Cell>
+                                <Table.Cell>{filesVM.formatSize(item.size)}</Table.Cell>
+                                <Table.Cell>{item.status}</Table.Cell>
+                                <Table.Cell>
+                                    {new Date(item.uploadedAt).toLocaleString()}
+                                </Table.Cell>
+                                <Table.Cell>
+                                    <a
+                                        href={item.r2Url}
+                                        target="_blank"
+                                        rel="noreferrer"
+                                        class="text-xs text-primary underline"
+                                    >
+                                        Open
+                                    </a>
+                                </Table.Cell>
+                            </Table.Row>
+                        {/each}
+                    </Table.Body>
+                </Table.Root>
+            {/if}
+        </Card.Content>
+    </Card.Root>
+</MaxWidthWrapper>

apps/processor/src/domains/mobile/router.ts

@@ -1,9 +1,10 @@
 import {
+    mobileMediaAssetInputSchema,
     pingMobileDeviceSchema,
     registerMobileDeviceSchema,
-    syncMobileMediaSchema,
     syncMobileSMSSchema,
 } from "@pkg/logic/domains/mobile/data";
+import { getFileController } from "@pkg/logic/domains/files/controller";
 import { getMobileController } from "@pkg/logic/domains/mobile/controller";
 import type { FlowExecCtx } from "@pkg/logic/core/flow.execution.context";
 import { errorStatusMap, type Err } from "@pkg/result";
@@ -13,8 +14,16 @@ import * as v from "valibot";
 import { Hono } from "hono";
 
 const mobileController = getMobileController();
+const fileController = getFileController();
 const DEVICE_ID_HEADER = "x-device-id";
 const FLOW_ID_HEADER = "x-flow-id";
+const MEDIA_EXTERNAL_ID_HEADER = "x-media-external-id";
+const MEDIA_MIME_TYPE_HEADER = "x-media-mime-type";
+const MEDIA_FILENAME_HEADER = "x-media-filename";
+const MEDIA_CAPTURED_AT_HEADER = "x-media-captured-at";
+const MEDIA_SIZE_BYTES_HEADER = "x-media-size-bytes";
+const MEDIA_HASH_HEADER = "x-media-hash";
+const MEDIA_METADATA_HEADER = "x-media-metadata";
 
 function buildFlowExecCtx(c: Context): FlowExecCtx {
     return {
@@ -44,6 +53,34 @@ async function parseJson(c: Context) {
     }
 }
 
+function toOptionalString(
+    value: FormDataEntryValue | string | null | undefined,
+): string | undefined {
+    if (typeof value !== "string") {
+        return undefined;
+    }
+    const trimmed = value.trim();
+    return trimmed.length > 0 ? trimmed : undefined;
+}
+
+function parseOptionalJsonRecord(value: string | undefined): {
+    value?: Record<string, unknown>;
+    error?: string;
+} {
+    if (!value) {
+        return {};
+    }
+    try {
+        const parsed = JSON.parse(value);
+        if (parsed && typeof parsed === "object" && !Array.isArray(parsed)) {
+            return { value: parsed as Record<string, unknown> };
+        }
+        return { error: "metadata must be a JSON object" };
+    } catch {
+        return { error: "metadata must be valid JSON" };
+    }
+}
+
 export const mobileRouter = new Hono()
     .post("/register", async (c) => {
         const fctx = buildFlowExecCtx(c);
@@ -220,25 +257,150 @@ export const mobileRouter = new Hono()
             return respondError(c, fctx, error);
         }
 
-        const payload = await parseJson(c);
-        const parsed = v.safeParse(syncMobileMediaSchema, payload);
+        const form = await c.req.formData().catch(() => null);
+        if (!form) {
+            const error = {
+                flowId: fctx.flowId,
+                code: "VALIDATION_ERROR",
+                message: "Invalid media upload request",
+                description: "Expected multipart/form-data with a file field",
+                detail: "Unable to parse multipart form data",
+            } as Err;
+            return respondError(c, fctx, error);
+        }
+
+        const fileEntry = form.get("file");
+        if (!(fileEntry instanceof File)) {
+            const error = {
+                flowId: fctx.flowId,
+                code: "VALIDATION_ERROR",
+                message: "Missing media file",
+                description: "Expected a file part named 'file'",
+                detail: "multipart/form-data requires file field",
+            } as Err;
+            return respondError(c, fctx, error);
+        }
+
+        const sizeBytesRaw =
+            toOptionalString(form.get("sizeBytes")) ||
+            toOptionalString(c.req.header(MEDIA_SIZE_BYTES_HEADER));
+        const sizeBytesParsed =
+            sizeBytesRaw !== undefined ? Number(sizeBytesRaw) : undefined;
+
+        const metadataRaw =
+            toOptionalString(form.get("metadata")) ||
+            toOptionalString(c.req.header(MEDIA_METADATA_HEADER));
+        const metadataResult = parseOptionalJsonRecord(metadataRaw);
+        if (metadataResult.error) {
+            const error = {
+                flowId: fctx.flowId,
+                code: "VALIDATION_ERROR",
+                message: "Invalid media metadata",
+                description: "Please provide metadata as a JSON object",
+                detail: metadataResult.error,
+            } as Err;
+            return respondError(c, fctx, error);
+        }
+
+        const mediaPayload = {
+            externalMediaId:
+                toOptionalString(form.get("externalMediaId")) ||
+                toOptionalString(c.req.header(MEDIA_EXTERNAL_ID_HEADER)),
+            fileId: crypto.randomUUID(),
+            mimeType:
+                toOptionalString(form.get("mimeType")) ||
+                toOptionalString(c.req.header(MEDIA_MIME_TYPE_HEADER)) ||
+                fileEntry.type ||
+                "application/octet-stream",
+            filename:
+                toOptionalString(form.get("filename")) ||
+                toOptionalString(c.req.header(MEDIA_FILENAME_HEADER)) ||
+                fileEntry.name,
+            capturedAt:
+                toOptionalString(form.get("capturedAt")) ||
+                toOptionalString(c.req.header(MEDIA_CAPTURED_AT_HEADER)),
+            sizeBytes: Number.isFinite(sizeBytesParsed)
+                ? sizeBytesParsed
+                : fileEntry.size,
+            hash:
+                toOptionalString(form.get("hash")) ||
+                toOptionalString(c.req.header(MEDIA_HASH_HEADER)),
+            metadata: metadataResult.value,
+        };
+
+        const parsed = v.safeParse(mobileMediaAssetInputSchema, mediaPayload);
         if (!parsed.success) {
             const error = {
                 flowId: fctx.flowId,
                 code: "VALIDATION_ERROR",
-                message: "Invalid media sync payload",
-                description: "Please validate the payload and retry",
+                message: "Invalid media upload metadata",
+                description: "Please validate multipart metadata and retry",
                 detail: parsed.issues.map((issue) => issue.message).join(", "),
             } as Err;
             return respondError(c, fctx, error);
         }
 
+        const deviceResult = await mobileController.resolveDeviceByExternalId(
+            fctx,
+            externalDeviceId,
+        );
+        if (deviceResult.isErr()) {
+            return respondError(c, fctx, deviceResult.error);
+        }
+
+        const uploadResult = await fileController.uploadFile(
+            fctx,
+            deviceResult.value.ownerUserId,
+            fileEntry,
+            {
+                visibility: "private",
+                metadata: {
+                    source: "mobile.media.sync",
+                    externalDeviceId,
+                    externalMediaId: parsed.output.externalMediaId || null,
+                    ...(parsed.output.metadata || {}),
+                },
+                tags: ["mobile", "media-sync"],
+                processImage: parsed.output.mimeType.startsWith("image/"),
+                processVideo: parsed.output.mimeType.startsWith("video/"),
+            },
+        );
+        if (uploadResult.isErr()) {
+            logDomainEvent({
+                level: "error",
+                event: "processor.mobile.media_upload.failed",
+                fctx,
+                durationMs: Date.now() - startedAt,
+                error: uploadResult.error,
+                meta: { externalDeviceId, filename: fileEntry.name },
+            });
+            return respondError(c, fctx, uploadResult.error);
+        }
+
+        const uploadedFileId =
+            uploadResult.value.file?.id || uploadResult.value.uploadId || null;
+        if (!uploadedFileId) {
+            const error = {
+                flowId: fctx.flowId,
+                code: "INTERNAL_ERROR",
+                message: "Failed to resolve uploaded file id",
+                description: "Please retry media upload",
+                detail: "File upload succeeded but returned no file id",
+            } as Err;
+            return respondError(c, fctx, error);
+        }
+
         const result = await mobileController.syncMediaByExternalDeviceId(
             fctx,
             externalDeviceId,
-            parsed.output.assets,
+            [{ ...parsed.output, fileId: uploadedFileId }],
         );
         if (result.isErr()) {
+            await fileController.deleteFiles(
+                fctx,
+                [uploadedFileId],
+                deviceResult.value.ownerUserId,
+            );
             logDomainEvent({
                 level: "error",
                 event: "processor.mobile.media_sync.failed",
@@ -247,7 +409,7 @@ export const mobileRouter = new Hono()
                 error: result.error,
                 meta: {
                     externalDeviceId,
-                    received: parsed.output.assets.length,
+                    received: 1,
                 },
             });
             return respondError(c, fctx, result.error);
@@ -259,8 +421,15 @@ export const mobileRouter = new Hono()
             durationMs: Date.now() - startedAt,
             meta: {
                 externalDeviceId,
+                fileId: uploadedFileId,
                 ...result.value,
             },
         });
-        return c.json({ data: result.value, error: null });
+        return c.json({
+            data: {
+                ...result.value,
+                fileId: uploadedFileId,
+            },
+            error: null,
+        });
     });