@jobber/components-native 0.101.3 → 0.101.4

package/dist/src/FormatFile/FormatFileThumbnail.test.js

@@ -0,0 +1,192 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import React from "react";
+import { render, waitFor } from "@testing-library/react-native";
+import { FormatFileThumbnail } from "./FormatFileThumbnail";
+import { FILE_MOCK_FILE, FILE_MOCK_IMAGE, FILE_MOCK_VIDEO, FILE_UPLOAD_MOCK_FILE, FILE_UPLOAD_MOCK_IMAGE, } from "./components/_mocks/mockFiles";
+import { StatusCode } from "./types";
+import { tokens } from "../utils/design";
+const mockCreateThumbnail = jest.fn(() => __awaiter(void 0, void 0, void 0, function* () {
+    return ({
+        thumbnail: "thumbnail",
+        error: false,
+    });
+}));
+afterEach(() => {
+    jest.clearAllMocks();
+});
+describe("FormatFileThumbnail", () => {
+    describe("rendering media files", () => {
+        it("renders an image file upload", () => {
+            const file = FILE_UPLOAD_MOCK_IMAGE({
+                progress: 1,
+                status: StatusCode.Completed,
+            });
+            const { getByTestId } = renderThumbnail(file);
+            expect(getByTestId("test-image")).toBeDefined();
+        });
+        it("renders an external image file", () => {
+            const { getByTestId } = renderThumbnail(FILE_MOCK_IMAGE);
+            expect(getByTestId("test-image")).toBeDefined();
+        });
+        it("creates a thumbnail for media files", () => {
+            renderThumbnail(FILE_UPLOAD_MOCK_IMAGE({
+                progress: 1,
+                status: StatusCode.Completed,
+            }));
+            expect(mockCreateThumbnail).toHaveBeenCalledTimes(1);
+        });
+        it("does not create a thumbnail for non-media files", () => {
+            renderThumbnail(FILE_UPLOAD_MOCK_FILE({
+                progress: 1,
+                status: StatusCode.Completed,
+            }));
+            expect(mockCreateThumbnail).not.toHaveBeenCalled();
+        });
+    });
+    describe("rendering non-media files", () => {
+        it("renders a file upload", () => {
+            const file = FILE_UPLOAD_MOCK_FILE({
+                progress: 1,
+                status: StatusCode.Completed,
+            });
+            const { getByTestId } = renderThumbnail(file);
+            expect(getByTestId("test-file")).toBeDefined();
+        });
+        it("renders an external file", () => {
+            const { getByTestId } = renderThumbnail(FILE_MOCK_FILE);
+            expect(getByTestId("test-file")).toBeDefined();
+        });
+    });
+    describe("upload progress", () => {
+        it("shows a progress bar when upload is in progress", () => {
+            const file = FILE_UPLOAD_MOCK_IMAGE({ progress: 0.5 });
+            const { getByTestId } = renderThumbnail(file);
+            expect(getByTestId("format-file-progress-bar-container")).toBeDefined();
+        });
+        it("shows a progress overlay with correct styles", () => {
+            const file = FILE_UPLOAD_MOCK_IMAGE({ progress: 0.5 });
+            const { getByTestId } = renderThumbnail(file);
+            const progressBarContainer = getByTestId("format-file-progress-bar-container");
+            const overlayStyles = progressBarContainer.props.style;
+            expect(overlayStyles).toEqual(expect.arrayContaining([expect.objectContaining({ height: "100%" })]));
+            expect(overlayStyles).toEqual(expect.arrayContaining([
+                expect.objectContaining({
+                    backgroundColor: tokens["color-overlay--dimmed"],
+                }),
+            ]));
+        });
+        it("renders a progress bar that advances with upload percentage", () => __awaiter(void 0, void 0, void 0, function* () {
+            jest.useFakeTimers();
+            const file = FILE_UPLOAD_MOCK_IMAGE({ progress: 0.9 });
+            const { getByTestId } = renderThumbnail(file);
+            jest.advanceTimersByTime(500);
+            const innerProgressBar = yield waitFor(() => getByTestId("format-file-inner-progress-bar"));
+            const width = parseInt(innerProgressBar.props.style.width, 10);
+            expect(width).toBeGreaterThan(20);
+            jest.useRealTimers();
+        }));
+    });
+    describe("error state", () => {
+        it("renders an error icon for a failed image upload", () => {
+            const file = Object.assign({}, FILE_UPLOAD_MOCK_IMAGE({
+                progress: 0.9,
+                status: StatusCode.Failed,
+            }));
+            const { getByTestId } = renderThumbnail(file);
+            expect(getByTestId("format-file-error-icon")).toBeDefined();
+        });
+        it("renders a helpful error accessibility label", () => {
+            const file = Object.assign({}, FILE_UPLOAD_MOCK_IMAGE({
+                progress: 0.9,
+                status: StatusCode.Failed,
+            }));
+            const tree = renderThumbnail(file);
+            expect(tree.getByLabelText("Failed to upload.")).toBeDefined();
+        });
+    });
+    describe("accessibility", () => {
+        it("renders with a custom accessibility label", () => {
+            const file = FILE_UPLOAD_MOCK_IMAGE({
+                progress: 1,
+                status: StatusCode.Completed,
+            });
+            const { getByLabelText } = renderThumbnail(file);
+            expect(getByLabelText("Custom Label")).toBeDefined();
+        });
+    });
+    describe("size prop", () => {
+        it("applies size dimensions to the outer container", () => {
+            const file = FILE_UPLOAD_MOCK_IMAGE({
+                progress: 1,
+                status: StatusCode.Completed,
+            });
+            const { getByTestId } = render(React.createElement(FormatFileThumbnail, { file: file, accessibilityLabel: "Custom Label", createThumbnail: mockCreateThumbnail, size: { width: 100, height: 100 }, testID: "thumbnail-container" }));
+            const container = getByTestId("thumbnail-container");
+            const containerStyle = container.props.style;
+            expect(containerStyle).toEqual(expect.arrayContaining([
+                expect.objectContaining({ width: 100, height: 100 }),
+            ]));
+        });
+        it("applies container visual styles (border, radius, overflow)", () => {
+            const file = FILE_UPLOAD_MOCK_IMAGE({
+                progress: 1,
+                status: StatusCode.Completed,
+            });
+            const { getByTestId } = render(React.createElement(FormatFileThumbnail, { file: file, accessibilityLabel: "Custom Label", createThumbnail: mockCreateThumbnail, size: { width: 100, height: 100 }, testID: "thumbnail-container" }));
+            const container = getByTestId("thumbnail-container");
+            const containerStyle = container.props.style;
+            expect(containerStyle).toEqual(expect.arrayContaining([
+                expect.objectContaining({
+                    borderWidth: tokens["border-base"],
+                    borderColor: tokens["color-border"],
+                    borderRadius: tokens["radius-base"],
+                    overflow: "hidden",
+                }),
+            ]));
+        });
+        it("does not apply marginBottom from the base container styles", () => {
+            const file = FILE_UPLOAD_MOCK_IMAGE({
+                progress: 1,
+                status: StatusCode.Completed,
+            });
+            const { getByTestId } = render(React.createElement(FormatFileThumbnail, { file: file, accessibilityLabel: "Custom Label", createThumbnail: mockCreateThumbnail, size: { width: 100, height: 100 }, testID: "thumbnail-container" }));
+            const container = getByTestId("thumbnail-container");
+            const containerStyle = container.props.style;
+            // marginBottom is overridden to 0 since spacing is a layout concern
+            expect(containerStyle).toEqual(expect.arrayContaining([expect.objectContaining({ marginBottom: 0 })]));
+        });
+    });
+    describe("video files", () => {
+        it("shows the play icon for video files by default", () => {
+            const { getByTestId } = renderThumbnail(FILE_MOCK_VIDEO);
+            expect(getByTestId("video")).toBeDefined();
+        });
+        it("hides the play icon when showFileTypeIndicator is false", () => {
+            const { queryByTestId } = render(React.createElement(FormatFileThumbnail, { file: FILE_MOCK_VIDEO, accessibilityLabel: "Custom Label", createThumbnail: mockCreateThumbnail, showFileTypeIndicator: false, size: { width: 100, height: 100 } }));
+            expect(queryByTestId("video")).toBeNull();
+        });
+    });
+    describe("does NOT render BottomSheet or TouchableOpacity", () => {
+        it("does not render a bottom sheet", () => {
+            const file = FILE_UPLOAD_MOCK_IMAGE({
+                progress: 1,
+                status: StatusCode.Completed,
+            });
+            const { queryByLabelText } = renderThumbnail(file);
+            // BottomSheet options should not exist
+            expect(queryByLabelText("Remove image")).toBeNull();
+            expect(queryByLabelText("Preview image")).toBeNull();
+        });
+    });
+});
+function renderThumbnail(file) {
+    return render(React.createElement(FormatFileThumbnail, { file: file, accessibilityLabel: "Custom Label", createThumbnail: mockCreateThumbnail, size: { width: 100, height: 100 } }));
+}

package/dist/src/FormatFile/components/FormatFileBottomSheet/FormatFileBottomSheet.test.js

@@ -0,0 +1,74 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import React, { createRef } from "react";
+import { fireEvent, render } from "@testing-library/react-native";
+import { act } from "react-test-renderer";
+import { FormatFileBottomSheet } from "./FormatFileBottomSheet";
+let Platform;
+const onRemove = jest.fn();
+const onPreview = jest.fn();
+const bottomSheetRef = createRef();
+beforeEach(() => {
+    Platform = require("react-native").Platform;
+});
+const renderBottomSheet = (bottomSheetOptionsSuffix) => {
+    return render(React.createElement(FormatFileBottomSheet, { onPreviewPress: onPreview, onRemovePress: onRemove, bottomSheetRef: bottomSheetRef, bottomSheetOptionsSuffix: bottomSheetOptionsSuffix }));
+};
+const basicRenderTestWithValue = () => {
+    describe.each([["image"], ["receipt"], ["file"], ["video"]])("when FormatFileBottomSheet for %s is opened", bottomSheetOptionsSuffix => {
+        const previewLabel = `Preview ${bottomSheetOptionsSuffix}`;
+        const removeLabel = `Remove ${bottomSheetOptionsSuffix}`;
+        let tree;
+        beforeEach(() => __awaiter(void 0, void 0, void 0, function* () {
+            tree = renderBottomSheet(bottomSheetOptionsSuffix);
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                var _a;
+                (_a = bottomSheetRef.current) === null || _a === void 0 ? void 0 : _a.open();
+            }));
+        }));
+        afterEach(() => {
+            jest.clearAllMocks();
+        });
+        describe("onPreviewPress", () => {
+            it("renders the preview option", () => __awaiter(void 0, void 0, void 0, function* () {
+                const { findByLabelText } = tree;
+                expect(yield findByLabelText(previewLabel)).toBeDefined();
+            }));
+            it("is called when pressed", () => __awaiter(void 0, void 0, void 0, function* () {
+                const { findByLabelText } = tree;
+                fireEvent.press(yield findByLabelText(previewLabel));
+                expect(onPreview).toHaveBeenCalledTimes(1);
+            }));
+        });
+        describe("onRemovePress", () => {
+            it("renders the remove option", () => __awaiter(void 0, void 0, void 0, function* () {
+                const { findByLabelText } = tree;
+                expect(yield findByLabelText(removeLabel)).toBeDefined();
+            }));
+            it("is called when pressed", () => __awaiter(void 0, void 0, void 0, function* () {
+                const { findByLabelText } = tree;
+                fireEvent.press(yield findByLabelText(removeLabel));
+                expect(onRemove).toHaveBeenCalledTimes(1);
+            }));
+        });
+    });
+};
+describe("ios", () => {
+    beforeEach(() => {
+        Platform.OS = "ios";
+    });
+    basicRenderTestWithValue();
+});
+describe("android", () => {
+    beforeEach(() => {
+        Platform.OS = "android";
+    });
+    basicRenderTestWithValue();
+});

package/dist/src/FormatFile/components/MediaView/MediaView.test.js

@@ -0,0 +1,202 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import React from "react";
+import { fireEvent, render, waitFor } from "@testing-library/react-native";
+import { MediaView } from "./MediaView";
+import { StatusCode } from "../../types";
+import { AtlantisFormatFileContext } from "../../context/FormatFileContext";
+jest.mock("../../../hooks/useAtlantisI18n", () => ({
+    useAtlantisI18n: () => ({ t: (key) => key }),
+}));
+describe("MediaView", () => {
+    const mockFile = {
+        showPreview: true,
+        source: "https://example.com/image1.jpg",
+        thumbnailUrl: undefined,
+        name: "test.jpg",
+        size: 1024,
+        external: false,
+        progress: 0,
+        status: StatusCode.Completed,
+        error: false,
+        type: "image/jpeg",
+        isMedia: true,
+        showFileTypeIndicator: false,
+    };
+    const defaultProps = {
+        accessibilityLabel: "Test image",
+        showOverlay: false,
+        showError: false,
+        file: mockFile,
+        styleInGrid: false,
+        onUploadComplete: jest.fn(),
+    };
+    const mockContextValue = {
+        useCreateThumbnail: () => ({ thumbnail: undefined, error: false }),
+    };
+    const renderWithContext = (props = defaultProps) => {
+        return render(React.createElement(AtlantisFormatFileContext.Provider, { value: mockContextValue },
+            React.createElement(MediaView, Object.assign({}, props))));
+    };
+    describe("Normal loading flow", () => {
+        it("shows loading indicator when onLoadStart fires", () => {
+            const { getByTestId, queryByTestId } = renderWithContext();
+            const image = getByTestId("test-image");
+            expect(queryByTestId("ActivityIndicator")).toBeNull();
+            fireEvent(image, "loadStart");
+            expect(queryByTestId("ActivityIndicator")).toBeTruthy();
+        });
+        it("hides loading indicator when onLoadEnd fires", () => {
+            const { getByTestId, queryByTestId } = renderWithContext();
+            const image = getByTestId("test-image");
+            fireEvent(image, "loadStart");
+            expect(queryByTestId("ActivityIndicator")).toBeTruthy();
+            fireEvent(image, "loadEnd");
+            expect(queryByTestId("ActivityIndicator")).toBeNull();
+        });
+    });
+    describe("Race condition handling (cached images)", () => {
+        it("does not get stuck loading when onLoadEnd fires before onLoadStart", () => {
+            const { getByTestId, queryByTestId } = renderWithContext();
+            const image = getByTestId("test-image");
+            // Simulate cached image: LoadEnd fires BEFORE LoadStart
+            fireEvent(image, "loadEnd");
+            expect(queryByTestId("ActivityIndicator")).toBeNull();
+            fireEvent(image, "loadStart");
+            expect(queryByTestId("ActivityIndicator")).toBeNull();
+        });
+        it("does not show infinite spinner when load events fire out of order", () => {
+            const { getByTestId, queryByTestId } = renderWithContext();
+            const image = getByTestId("test-image");
+            // Race condition scenario
+            fireEvent(image, "loadEnd");
+            fireEvent(image, "loadStart");
+            fireEvent(image, "loadEnd");
+            expect(queryByTestId("ActivityIndicator")).toBeNull();
+        });
+    });
+    describe("URI changes", () => {
+        it("shows loading indicator when URI changes to a new image", () => __awaiter(void 0, void 0, void 0, function* () {
+            const { getByTestId, queryByTestId, rerender } = renderWithContext();
+            const image = getByTestId("test-image");
+            // First image: simulate cached load (LoadEnd before LoadStart)
+            fireEvent(image, "loadEnd");
+            fireEvent(image, "loadStart");
+            expect(queryByTestId("ActivityIndicator")).toBeNull();
+            // Change URI to a new image
+            const newFile = Object.assign(Object.assign({}, mockFile), { source: "https://example.com/image2.jpg" });
+            rerender(React.createElement(AtlantisFormatFileContext.Provider, { value: mockContextValue },
+                React.createElement(MediaView, Object.assign({}, defaultProps, { file: newFile }))));
+            yield waitFor(() => {
+                const updatedImage = getByTestId("test-image");
+                // New image starts loading
+                fireEvent(updatedImage, "loadStart");
+                expect(queryByTestId("ActivityIndicator")).toBeTruthy();
+            });
+        }));
+        it("shows loading indicator on second URI change", () => __awaiter(void 0, void 0, void 0, function* () {
+            const { getByTestId, queryByTestId, rerender } = renderWithContext();
+            const image1 = getByTestId("test-image");
+            fireEvent(image1, "loadStart");
+            fireEvent(image1, "loadEnd");
+            expect(queryByTestId("ActivityIndicator")).toBeNull();
+            const file2 = Object.assign(Object.assign({}, mockFile), { source: "https://example.com/image2.jpg" });
+            rerender(React.createElement(AtlantisFormatFileContext.Provider, { value: mockContextValue },
+                React.createElement(MediaView, Object.assign({}, defaultProps, { file: file2 }))));
+            yield waitFor(() => {
+                const image2 = getByTestId("test-image");
+                fireEvent(image2, "loadStart");
+                expect(queryByTestId("ActivityIndicator")).toBeTruthy();
+            });
+        }));
+        it("shows loading indicator on third URI change", () => __awaiter(void 0, void 0, void 0, function* () {
+            const { getByTestId, queryByTestId, rerender } = renderWithContext();
+            const image1 = getByTestId("test-image");
+            fireEvent(image1, "loadStart");
+            fireEvent(image1, "loadEnd");
+            const file2 = Object.assign(Object.assign({}, mockFile), { source: "https://example.com/image2.jpg" });
+            rerender(React.createElement(AtlantisFormatFileContext.Provider, { value: mockContextValue },
+                React.createElement(MediaView, Object.assign({}, defaultProps, { file: file2 }))));
+            const image2 = getByTestId("test-image");
+            fireEvent(image2, "loadEnd");
+            const file3 = Object.assign(Object.assign({}, mockFile), { source: "https://example.com/image3.jpg" });
+            rerender(React.createElement(AtlantisFormatFileContext.Provider, { value: mockContextValue },
+                React.createElement(MediaView, Object.assign({}, defaultProps, { file: file3 }))));
+            yield waitFor(() => {
+                const image3 = getByTestId("test-image");
+                fireEvent(image3, "loadStart");
+                expect(queryByTestId("ActivityIndicator")).toBeTruthy();
+            });
+        }));
+        it("handles URI change from cached to uncached image correctly", () => __awaiter(void 0, void 0, void 0, function* () {
+            const { getByTestId, queryByTestId, rerender } = renderWithContext();
+            // First image: cached (LoadEnd before LoadStart)
+            const image1 = getByTestId("test-image");
+            fireEvent(image1, "loadEnd");
+            fireEvent(image1, "loadStart");
+            expect(queryByTestId("ActivityIndicator")).toBeNull();
+            // Second image: uncached (normal LoadStart then LoadEnd)
+            const file2 = Object.assign(Object.assign({}, mockFile), { source: "https://example.com/image2.jpg" });
+            rerender(React.createElement(AtlantisFormatFileContext.Provider, { value: mockContextValue },
+                React.createElement(MediaView, Object.assign({}, defaultProps, { file: file2 }))));
+            yield waitFor(() => {
+                const image2 = getByTestId("test-image");
+                fireEvent(image2, "loadStart");
+                expect(queryByTestId("ActivityIndicator")).toBeTruthy();
+                fireEvent(image2, "loadEnd");
+                expect(queryByTestId("ActivityIndicator")).toBeNull();
+            });
+        }));
+    });
+    describe("thumbnailUrl changes", () => {
+        it("shows loading indicator when thumbnailUrl changes", () => __awaiter(void 0, void 0, void 0, function* () {
+            const { getByTestId, queryByTestId, rerender } = renderWithContext();
+            // First load completes
+            const image1 = getByTestId("test-image");
+            fireEvent(image1, "loadStart");
+            fireEvent(image1, "loadEnd");
+            expect(queryByTestId("ActivityIndicator")).toBeNull();
+            // Thumbnail URL changes (common when thumbnail generation completes)
+            const fileWithThumbnail = Object.assign(Object.assign({}, mockFile), { thumbnailUrl: "https://example.com/thumbnail.jpg" });
+            rerender(React.createElement(AtlantisFormatFileContext.Provider, { value: mockContextValue },
+                React.createElement(MediaView, Object.assign({}, defaultProps, { file: fileWithThumbnail }))));
+            yield waitFor(() => {
+                const image2 = getByTestId("test-image");
+                fireEvent(image2, "loadStart");
+                expect(queryByTestId("ActivityIndicator")).toBeTruthy();
+            });
+        }));
+    });
+    describe("Context thumbnail changes", () => {
+        it("shows loading indicator when context thumbnail changes", () => __awaiter(void 0, void 0, void 0, function* () {
+            const mockContextWithThumbnail = {
+                useCreateThumbnail: () => ({
+                    thumbnail: "https://example.com/context-thumbnail.jpg",
+                    error: false,
+                }),
+            };
+            const { getByTestId, queryByTestId, rerender } = render(React.createElement(AtlantisFormatFileContext.Provider, { value: mockContextValue },
+                React.createElement(MediaView, Object.assign({}, defaultProps))));
+            // First load completes
+            const image1 = getByTestId("test-image");
+            fireEvent(image1, "loadStart");
+            fireEvent(image1, "loadEnd");
+            expect(queryByTestId("ActivityIndicator")).toBeNull();
+            // Context provides a new thumbnail
+            rerender(React.createElement(AtlantisFormatFileContext.Provider, { value: mockContextWithThumbnail },
+                React.createElement(MediaView, Object.assign({}, defaultProps))));
+            yield waitFor(() => {
+                const image2 = getByTestId("test-image");
+                fireEvent(image2, "loadStart");
+                expect(queryByTestId("ActivityIndicator")).toBeTruthy();
+            });
+        }));
+    });
+});

package/dist/src/FormatFile/utils/parseFile.test.js

@@ -0,0 +1,188 @@
+/* eslint-disable max-statements */
+import { isMediaFile, parseFile } from "./parseFile";
+import { StatusCode } from "../types";
+const makeFileUpload = (overrides = {}) => (Object.assign({ uuid: "uuid-123", key: "path/test.txt", name: "test.txt", type: "application/txt", size: 1024, progress: 0.5, status: StatusCode.InProgress, sourcePath: "path/test.txt", batchContext: { batchId: "batch-1", batchCount: 1 }, cancel: jest.fn() }, overrides));
+const makeFile = (overrides = {}) => (Object.assign({ fileName: "document.txt", fileSize: 2048, contentType: "text/plain", url: "https://example.com/file.txt", thumbnailUrl: "https://example.com/thumb.txt" }, overrides));
+describe("isMediaFile", () => {
+    it.each `
+    fileType             | expected
+    ${"image/png"}       | ${true}
+    ${"image/jpeg"}      | ${true}
+    ${"video/mp4"}       | ${true}
+    ${"video/quicktime"} | ${true}
+    ${"application/pdf"} | ${false}
+    ${"text/plain"}      | ${false}
+    ${""}                | ${false}
+  `("returns $expected for '$fileType'", ({ fileType, expected }) => {
+        expect(isMediaFile(fileType)).toBe(expected);
+    });
+});
+describe("parseFile", () => {
+    describe("with a FileUpload (local upload)", () => {
+        it("maps basic fields", () => {
+            const file = makeFileUpload({
+                sourcePath: "local/image.png",
+                name: "image.png",
+                size: 5000,
+                progress: 0.7,
+                status: StatusCode.InProgress,
+                type: "image/png",
+            });
+            const result = parseFile(file, true);
+            expect(result).toMatchObject({
+                source: "local/image.png",
+                name: "image.png",
+                size: 5000,
+                progress: 0.7,
+                status: StatusCode.InProgress,
+                external: false,
+                showFileTypeIndicator: true,
+            });
+        });
+        it("sets error to true when status is Failed", () => {
+            const file = makeFileUpload({ status: StatusCode.Failed });
+            const result = parseFile(file, true);
+            expect(result.error).toBe(true);
+        });
+        it("sets error to false when status is not Failed", () => {
+            const file = makeFileUpload({ status: StatusCode.Completed });
+            const result = parseFile(file, true);
+            expect(result.error).toBe(false);
+        });
+        it("uses file.key as type fallback when type is empty", () => {
+            const file = makeFileUpload({ type: "", key: "path/fallback.png" });
+            const result = parseFile(file, true);
+            expect(result.type).toBe("path/fallback.png");
+        });
+        it("identifies an image upload as media", () => {
+            const file = makeFileUpload({ type: "image/png" });
+            const result = parseFile(file, true);
+            expect(result.isMedia).toBe(true);
+        });
+        it("identifies a video upload as media", () => {
+            const file = makeFileUpload({ type: "video/mp4" });
+            const result = parseFile(file, true);
+            expect(result.isMedia).toBe(true);
+        });
+        it("identifies a text file upload as non-media", () => {
+            const file = makeFileUpload({ type: "application/txt" });
+            const result = parseFile(file, true);
+            expect(result.isMedia).toBe(false);
+        });
+        it("sets showPreview for media files", () => {
+            const file = makeFileUpload({ type: "image/jpeg" });
+            const result = parseFile(file, true);
+            expect(result.showPreview).toBe(true);
+        });
+        it("sets showPreview for accepted non-media extensions (pdf)", () => {
+            const file = makeFileUpload({ type: "file/pdf" });
+            const result = parseFile(file, true);
+            expect(result.showPreview).toBe(true);
+        });
+        it("sets showPreview for accepted non-media extensions (docx)", () => {
+            const file = makeFileUpload({ type: "application/docx" });
+            const result = parseFile(file, true);
+            expect(result.showPreview).toBe(true);
+        });
+        it("does not set showPreview for unrecognized file types", () => {
+            const file = makeFileUpload({ type: "application/txt" });
+            const result = parseFile(file, true);
+            expect(result.showPreview).toBe(false);
+        });
+        it("passes showFileTypeIndicator through", () => {
+            const file = makeFileUpload();
+            expect(parseFile(file, true).showFileTypeIndicator).toBe(true);
+            expect(parseFile(file, false).showFileTypeIndicator).toBe(false);
+        });
+    });
+    describe("with a File (external/remote file)", () => {
+        it("maps basic fields", () => {
+            const file = makeFile({
+                url: "https://example.com/photo.jpg",
+                thumbnailUrl: "https://example.com/thumb.jpg",
+                fileName: "photo.jpg",
+                fileSize: 3000,
+                contentType: "image/jpeg",
+            });
+            const result = parseFile(file, true);
+            expect(result).toMatchObject({
+                source: "https://example.com/photo.jpg",
+                thumbnailUrl: "https://example.com/thumb.jpg",
+                name: "photo.jpg",
+                size: 3000,
+                external: true,
+                progress: 1,
+                status: StatusCode.Completed,
+                error: false,
+                showFileTypeIndicator: true,
+            });
+        });
+        it("identifies an image file as media", () => {
+            const file = makeFile({ contentType: "image/png" });
+            const result = parseFile(file, true);
+            expect(result.isMedia).toBe(true);
+        });
+        it("identifies a non-media file as non-media", () => {
+            const file = makeFile({ contentType: "text/plain" });
+            const result = parseFile(file, true);
+            expect(result.isMedia).toBe(false);
+        });
+        it("detects video content type from file extension (.mp4)", () => {
+            const file = makeFile({ fileName: "clip.mp4", contentType: undefined });
+            const result = parseFile(file, true);
+            expect(result.type).toBe("video");
+            expect(result.isMedia).toBe(true);
+        });
+        it("detects video content type from file extension (.mov)", () => {
+            const file = makeFile({ fileName: "clip.mov", contentType: undefined });
+            const result = parseFile(file, true);
+            expect(result.type).toBe("video");
+        });
+        it("detects video content type from file extension (.hevc)", () => {
+            const file = makeFile({ fileName: "clip.hevc", contentType: undefined });
+            const result = parseFile(file, true);
+            expect(result.type).toBe("video");
+        });
+        it("detects video content type from file extension (.3gpp)", () => {
+            const file = makeFile({ fileName: "clip.3gpp", contentType: undefined });
+            const result = parseFile(file, true);
+            expect(result.type).toBe("video");
+        });
+        it("falls back to contentType when extension is not a video", () => {
+            const file = makeFile({
+                fileName: "report.pdf",
+                contentType: "application/pdf",
+            });
+            const result = parseFile(file, true);
+            expect(result.type).toBe("application/pdf");
+        });
+        it("falls back to 'unknown' when both fileName and contentType are missing", () => {
+            const file = makeFile({
+                fileName: undefined,
+                contentType: undefined,
+            });
+            const result = parseFile(file, true);
+            expect(result.type).toBe("unknown");
+        });
+        it("sets showPreview for media files", () => {
+            const file = makeFile({ contentType: "image/jpeg" });
+            const result = parseFile(file, true);
+            expect(result.showPreview).toBe(true);
+        });
+        it("sets showPreview for accepted extension types", () => {
+            const file = makeFile({ contentType: "application/pdf" });
+            const result = parseFile(file, true);
+            expect(result.showPreview).toBe(true);
+        });
+        it("does not set showPreview for unrecognized types", () => {
+            const file = makeFile({ contentType: "text/plain" });
+            const result = parseFile(file, true);
+            expect(result.showPreview).toBe(false);
+        });
+        it("handles video extension detection case-insensitively", () => {
+            const file = makeFile({ fileName: "CLIP.MP4", contentType: undefined });
+            const result = parseFile(file, true);
+            expect(result.type).toBe("video");
+        });
+    });
+});