@scality/data-browser-library 1.0.0-preview.8 → 1.0.1

package/dist/components/__tests__/ObjectList.test.js

@@ -1,283 +1,784 @@
-import { jsx } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { fireEvent, render, renderHook, screen, waitFor } from "@testing-library/react";
 import { MemoryRouter } from "react-router";
-import { createTestWrapper, mockOffsetSize, setupMswServer } from "../../test/testUtils.js";
+import { DataBrowserUICustomizationProvider } from "../../contexts/DataBrowserUICustomizationContext.js";
 import { useListObjectVersions, useListObjects } from "../../hooks/index.js";
+import { createTestWrapper, mockOffsetSize, setupMswServer } from "../../test/testUtils.js";
 import { ObjectList } from "../objects/ObjectList.js";
-import * as __WEBPACK_EXTERNAL_MODULE__utils_useFeatures_js_1facdd0d__ from "../../utils/useFeatures.js";
+import * as __rspack_external__hooks_useFeatures_js_a6a84786 from "../../hooks/useFeatures.js";
 setupMswServer();
-const renderObjectList = (props = {})=>{
+const renderObjectList = (props = {}, customization)=>{
     const Wrapper = createTestWrapper();
+    const defaultCustomization = {
+        extraObjectListColumns: customization?.extraObjectListColumns || [],
+        extraObjectListActions: customization?.extraObjectListActions || []
+    };
     return render(/*#__PURE__*/ jsx(MemoryRouter, {
         children: /*#__PURE__*/ jsx(Wrapper, {
-            children: /*#__PURE__*/ jsx(ObjectList, {
-                bucketName: "test-bucket",
-                prefix: "",
-                onObjectSelect: jest.fn(),
-                onPrefixChange: jest.fn(),
-                ...props
+            children: /*#__PURE__*/ jsx(DataBrowserUICustomizationProvider, {
+                config: defaultCustomization,
+                children: /*#__PURE__*/ jsx(ObjectList, {
+                    bucketName: "test-bucket",
+                    prefix: "",
+                    onObjectSelect: jest.fn(),
+                    onPrefixChange: jest.fn(),
+                    ...props
+                })
             })
         })
     }));
 };
-describe("ObjectList", ()=>{
+describe('ObjectList', ()=>{
     beforeEach(()=>{
         jest.clearAllMocks();
         mockOffsetSize(800, 600);
-        jest.spyOn(__WEBPACK_EXTERNAL_MODULE__utils_useFeatures_js_1facdd0d__, "useFeatures").mockReturnValue(false);
+        jest.spyOn(__rspack_external__hooks_useFeatures_js_a6a84786, 'useFeatures').mockReturnValue(false);
     });
     afterEach(()=>{
         jest.restoreAllMocks();
     });
-    it("shows a table with proper headers", async ()=>{
-        renderObjectList();
-        await waitFor(()=>{
-            expect(screen.getByRole("grid")).toBeInTheDocument();
-        });
-        expect(screen.getByText("Name")).toBeInTheDocument();
-        expect(screen.getByText("Modified on")).toBeInTheDocument();
-        expect(screen.getByText("Size")).toBeInTheDocument();
-        expect(screen.getByText("Storage Location")).toBeInTheDocument();
-    });
-    it("renders content and handles interactions", async ()=>{
-        const onObjectSelect = jest.fn();
-        const onPrefixChange = jest.fn();
-        renderObjectList({
-            onObjectSelect,
-            onPrefixChange
-        });
-        await waitFor(()=>{
-            expect(screen.getByText("file1.txt")).toBeInTheDocument();
-        });
-        expect(screen.getByText("file1.txt")).toBeInTheDocument();
-        expect(screen.getByText("file2.txt")).toBeInTheDocument();
-        expect(screen.getByText("folder1/")).toBeInTheDocument();
-        fireEvent.click(screen.getByText("file1.txt"));
-        expect(onObjectSelect).toHaveBeenCalledWith(expect.objectContaining({
-            Key: "file1.txt",
-            type: "object"
-        }));
-        fireEvent.click(screen.getByText("folder1/"));
-        expect(onPrefixChange).toHaveBeenCalledWith("folder1/");
-        const rows = screen.getAllByRole("row");
-        expect(rows.length).toBe(4);
-    });
-    it("displays data formatting correctly", async ()=>{
-        renderObjectList();
-        await waitFor(()=>{
-            expect(screen.getByText("file1.txt")).toBeInTheDocument();
-        });
-        const gridElement = screen.getByRole("grid");
-        expect(gridElement).toHaveTextContent("2023");
-        const dateElements = screen.getAllByText(/2023/);
-        expect(dateElements.length).toBeGreaterThanOrEqual(2);
-        expect(screen.getByText("1 KB")).toBeInTheDocument();
-        expect(screen.getByText("512 B")).toBeInTheDocument();
-        const defaultElements = screen.getAllByText("default");
-        expect(defaultElements.length).toBeGreaterThan(0);
-        const dashes = screen.getAllByText("-");
-        expect(dashes.length).toBeGreaterThanOrEqual(2);
+    describe('Basic Rendering', ()=>{
+        it('shows a table with proper headers', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByRole('grid')).toBeInTheDocument();
+            });
+            expect(screen.getByText('Name')).toBeInTheDocument();
+            expect(screen.getByText('Modified on')).toBeInTheDocument();
+            expect(screen.getByText('Size')).toBeInTheDocument();
+            expect(screen.getByText('Storage Location')).toBeInTheDocument();
+        });
+        it('renders empty state for empty bucket', async ()=>{
+            renderObjectList({
+                bucketName: 'empty-bucket'
+            });
+            await waitFor(()=>{
+                expect(screen.getByRole('grid')).toBeInTheDocument();
+            });
+            expect(screen.getByText('Name')).toBeInTheDocument();
+            const rows = screen.getAllByRole('row');
+            expect(rows.length).toBe(1);
+            expect(screen.queryByText('file1.txt')).not.toBeInTheDocument();
+            expect(screen.queryByText('folder1/')).not.toBeInTheDocument();
+        });
+        it('handles loading states correctly', async ()=>{
+            renderObjectList();
+            expect(screen.getByRole('grid')).toBeInTheDocument();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            expect(screen.getByText('file2.txt')).toBeInTheDocument();
+            expect(screen.getByText('folder1/')).toBeInTheDocument();
+        });
     });
-    it("handles edge cases gracefully", async ()=>{
-        renderObjectList({
-            bucketName: "empty-bucket"
-        });
-        await waitFor(()=>{
-            expect(screen.getByRole("grid")).toBeInTheDocument();
-        });
-        expect(screen.getByText("Name")).toBeInTheDocument();
-        const mockOnObjectSelect = jest.fn();
-        const mockOnPrefixChange = jest.fn();
-        renderObjectList({
-            onObjectSelect: mockOnObjectSelect,
-            onPrefixChange: mockOnPrefixChange
-        });
-        await waitFor(()=>{
-            expect(screen.getByText("file1.txt")).toBeInTheDocument();
-        });
-        expect(()=>{
-            fireEvent.click(screen.getByText("file1.txt"));
-            fireEvent.click(screen.getByText("folder1/"));
-        }).not.toThrow();
-        expect(mockOnObjectSelect).toHaveBeenCalled();
-        expect(mockOnPrefixChange).toHaveBeenCalled();
+    describe('Content Display', ()=>{
+        it('renders content and handles interactions', async ()=>{
+            const onObjectSelect = jest.fn();
+            const onPrefixChange = jest.fn();
+            renderObjectList({
+                onObjectSelect,
+                onPrefixChange
+            });
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            expect(screen.getByText('file2.txt')).toBeInTheDocument();
+            expect(screen.getByText('folder1/')).toBeInTheDocument();
+            fireEvent.click(screen.getByText('folder1/'));
+            expect(onPrefixChange).toHaveBeenCalledWith('folder1/');
+            const rows = screen.getAllByRole('row');
+            expect(rows.length).toBe(4);
+        });
+        it('displays data formatting correctly', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            const gridElement = screen.getByRole('grid');
+            expect(gridElement).toHaveTextContent('2023');
+            const dateElements = screen.getAllByText(/2023/);
+            expect(dateElements.length).toBeGreaterThanOrEqual(2);
+            expect(screen.getByText('1 KB')).toBeInTheDocument();
+            expect(screen.getByText('512 B')).toBeInTheDocument();
+            const defaultElements = screen.getAllByText('default');
+            expect(defaultElements.length).toBeGreaterThan(0);
+            const dashes = screen.getAllByText('-');
+            expect(dashes.length).toBeGreaterThanOrEqual(2);
+        });
+        it('displays correct icons for folders and files', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            expect(screen.getByText('file2.txt')).toBeInTheDocument();
+            expect(screen.getByText('folder1/')).toBeInTheDocument();
+            const nameCells = screen.getAllByRole('gridcell').filter((cell)=>cell.textContent?.includes('folder1/') || cell.textContent?.includes('file1.txt') || cell.textContent?.includes('file2.txt'));
+            expect(nameCells.length).toBe(3);
+            nameCells.forEach((cell)=>{
+                const iconElement = cell.querySelector('svg, img, i');
+                const linkElement = cell.querySelector('a');
+                expect(iconElement).toBeInTheDocument();
+                expect(linkElement).toBeInTheDocument();
+            });
+        });
+        it('removes prefix from displayed names correctly', async ()=>{
+            renderObjectList({
+                prefix: 'my-prefix/subfolder/',
+                bucketName: 'test-bucket'
+            });
+            await waitFor(()=>{
+                expect(screen.getByRole('grid')).toBeInTheDocument();
+            });
+            expect(screen.getByText('Name')).toBeInTheDocument();
+        });
     });
-    it("handles loading states", async ()=>{
-        renderObjectList();
-        expect(screen.getByRole("grid")).toBeInTheDocument();
-        await waitFor(()=>{
-            expect(screen.getByText("file1.txt")).toBeInTheDocument();
-        });
-        expect(screen.getByText("file1.txt")).toBeInTheDocument();
-        expect(screen.getByText("file2.txt")).toBeInTheDocument();
-        expect(screen.getByText("folder1/")).toBeInTheDocument();
+    describe('Interaction Behaviors', ()=>{
+        it('prevents event propagation when clicking links', async ()=>{
+            const onPrefixChange = jest.fn();
+            renderObjectList({
+                onPrefixChange
+            });
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+                expect(screen.getByText('folder1/')).toBeInTheDocument();
+            });
+            fireEvent.click(screen.getByText('folder1/'));
+            expect(onPrefixChange).toHaveBeenCalledWith('folder1/');
+            expect(onPrefixChange).toHaveBeenCalledTimes(1);
+        });
+        it('supports prefix-based navigation', async ()=>{
+            const onPrefixChange = jest.fn();
+            renderObjectList({
+                onPrefixChange
+            });
+            await waitFor(()=>{
+                expect(screen.getByText('folder1/')).toBeInTheDocument();
+            });
+            fireEvent.click(screen.getByText('folder1/'));
+            expect(onPrefixChange).toHaveBeenCalledWith('folder1/');
+            expect(onPrefixChange).toHaveBeenCalledTimes(1);
+        });
+        it('handles folder navigation correctly', async ()=>{
+            const onPrefixChange = jest.fn();
+            renderObjectList({
+                onPrefixChange
+            });
+            await waitFor(()=>{
+                expect(screen.getByText('folder1/')).toBeInTheDocument();
+            });
+            fireEvent.click(screen.getByText('folder1/'));
+            expect(onPrefixChange).toHaveBeenCalledWith('folder1/');
+        });
     });
-    it("prevents event propagation when clicking links", async ()=>{
-        const onObjectSelect = jest.fn();
-        const onPrefixChange = jest.fn();
-        renderObjectList({
-            onObjectSelect,
-            onPrefixChange
-        });
-        await waitFor(()=>{
-            expect(screen.getByText("file1.txt")).toBeInTheDocument();
-        });
-        fireEvent.click(screen.getByText("file1.txt"));
-        expect(onObjectSelect).toHaveBeenCalledWith(expect.objectContaining({
-            Key: "file1.txt",
-            type: "object"
-        }));
-        expect(onPrefixChange).not.toHaveBeenCalled();
+    describe('Pagination and Infinite Scroll', ()=>{
+        it('handles infinite scroll pagination correctly', async ()=>{
+            renderObjectList({
+                bucketName: 'paginated-bucket'
+            });
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+                expect(screen.getByText('file2.txt')).toBeInTheDocument();
+                expect(screen.getByText('folder1/')).toBeInTheDocument();
+            });
+            expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            expect(screen.getByText('file2.txt')).toBeInTheDocument();
+            expect(screen.getByText('folder1/')).toBeInTheDocument();
+            const table = screen.getByRole('grid');
+            expect(table).toBeInTheDocument();
+            const rows = screen.getAllByRole('row');
+            expect(rows.length).toBeGreaterThanOrEqual(4);
+            expect(screen.getByText('1 KB')).toBeInTheDocument();
+            expect(screen.getByText('512 B')).toBeInTheDocument();
+        });
+        it('integrates with infinite query hook for data loading', async ()=>{
+            const { result } = renderHook(()=>useListObjects({
+                    Bucket: 'paginated-bucket',
+                    MaxKeys: 20,
+                    Delimiter: '/'
+                }), {
+                wrapper: createTestWrapper()
+            });
+            await waitFor(()=>{
+                expect(result.current.isSuccess).toBe(true);
+            });
+            expect(result.current.data).toBeDefined();
+            expect(result.current.hasNextPage).toBe(true);
+            expect(typeof result.current.fetchNextPage).toBe('function');
+            expect(result.current.isFetchingNextPage).toBe(false);
+            const firstPage = result.current.data?.pages[0];
+            expect(firstPage).toBeDefined();
+            expect(firstPage?.Contents).toHaveLength(2);
+            expect(firstPage?.CommonPrefixes).toHaveLength(1);
+            result.current.fetchNextPage();
+            await waitFor(()=>{
+                const updatedData = result.current.data;
+                expect(updatedData?.pages).toHaveLength(2);
+            });
+            const secondPage = result.current.data?.pages[1];
+            expect(secondPage).toBeDefined();
+            expect(secondPage?.Contents).toHaveLength(1);
+            expect(result.current.hasNextPage).toBe(false);
+        });
     });
-    it("supports prefix-based navigation", async ()=>{
-        renderObjectList({
-            prefix: "folder1/"
+    describe('Version Management', ()=>{
+        it('renders List Versions toggle', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('List Versions')).toBeInTheDocument();
+            });
+            const toggleLabel = screen.getByText(/list versions/i);
+            const toggle = toggleLabel.closest('label')?.querySelector('input[type="checkbox"]');
+            expect(toggle).toBeInTheDocument();
+            expect(toggle).not.toBeChecked();
+        });
+        it('shows Version ID column when toggle is enabled', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('List Versions')).toBeInTheDocument();
+            });
+            const toggleLabel = screen.getByText(/list versions/i);
+            const toggle = toggleLabel.closest('label')?.querySelector('input[type="checkbox"]');
+            fireEvent.click(toggle);
+            await waitFor(()=>{
+                expect(screen.getByText('Version ID')).toBeInTheDocument();
+            });
+        });
+        it('does not show Version ID column by default', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('Name')).toBeInTheDocument();
+            });
+            expect(screen.queryByText('Version ID')).not.toBeInTheDocument();
         });
-        await waitFor(()=>{
-            expect(screen.getByRole("grid")).toBeInTheDocument();
+        it('integrates with version listing hook', async ()=>{
+            const { result } = renderHook(()=>useListObjectVersions({
+                    Bucket: 'test-bucket',
+                    MaxKeys: 20,
+                    Delimiter: '/'
+                }), {
+                wrapper: createTestWrapper()
+            });
+            await waitFor(()=>{
+                expect(result.current.isSuccess).toBe(true);
+            });
+            expect(result.current.data).toBeDefined();
+            expect(typeof result.current.fetchNextPage).toBe('function');
+            const firstPage = result.current.data?.pages[0];
+            expect(firstPage).toBeDefined();
+        });
+        it('clears selections when toggling versions', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            const toggleLabel = screen.getByText(/list versions/i);
+            const toggle = toggleLabel.closest('label')?.querySelector('input[type="checkbox"]');
+            fireEvent.click(toggle);
+            await waitFor(()=>{
+                expect(screen.getByText('Version ID')).toBeInTheDocument();
+            });
         });
-        expect(screen.getByText("Name")).toBeInTheDocument();
     });
-    it("displays correct icons for folders and files", async ()=>{
-        renderObjectList();
-        await waitFor(()=>{
-            expect(screen.getByText("file1.txt")).toBeInTheDocument();
-        });
-        expect(screen.getByText("file1.txt")).toBeInTheDocument();
-        expect(screen.getByText("file2.txt")).toBeInTheDocument();
-        expect(screen.getByText("folder1/")).toBeInTheDocument();
-        const nameCells = screen.getAllByRole("gridcell").filter((cell)=>cell.textContent?.includes("folder1/") || cell.textContent?.includes("file1.txt") || cell.textContent?.includes("file2.txt"));
-        expect(nameCells.length).toBe(3);
-        nameCells.forEach((cell)=>{
-            const iconElement = cell.querySelector("svg, img, i");
-            const linkElement = cell.querySelector("a");
-            expect(iconElement).toBeInTheDocument();
-            expect(linkElement).toBeInTheDocument();
+    describe('Search Features', ()=>{
+        it('renders table search when metadata-search feature is disabled', async ()=>{
+            jest.spyOn(__rspack_external__hooks_useFeatures_js_a6a84786, 'useFeatures').mockReturnValue(false);
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByRole('grid')).toBeInTheDocument();
+            });
+            expect(screen.queryByPlaceholderText(/Metadata Search/i)).not.toBeInTheDocument();
+        });
+        it('renders MetadataSearch component when metadata-search feature is enabled', async ()=>{
+            jest.spyOn(__rspack_external__hooks_useFeatures_js_a6a84786, 'useFeatures').mockReturnValue(true);
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByRole('grid')).toBeInTheDocument();
+            });
+            expect(screen.getByPlaceholderText(/Metadata Search/i)).toBeInTheDocument();
         });
     });
-    it("integrates with MultiSelectableContent", async ()=>{
-        renderObjectList();
-        await waitFor(()=>{
-            expect(screen.getByText("file1.txt")).toBeInTheDocument();
-        });
-        expect(screen.getByRole("grid")).toBeInTheDocument();
-        const rows = screen.getAllByRole("row");
-        expect(rows.length).toBe(4);
+    describe('Multi-Selection', ()=>{
+        it('integrates with MultiSelectableContent', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            expect(screen.getByRole('grid')).toBeInTheDocument();
+            const rows = screen.getAllByRole('row');
+            expect(rows.length).toBe(4);
+            const checkboxes = screen.getAllByRole('checkbox');
+            expect(checkboxes.length).toBeGreaterThan(0);
+        });
+        it('handles multi-selection state changes', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            const checkboxes = screen.getAllByRole('checkbox');
+            expect(checkboxes.length).toBeGreaterThan(0);
+            const firstCheckbox = checkboxes[0];
+            expect(firstCheckbox).not.toBeChecked();
+            fireEvent.click(firstCheckbox);
+            expect(firstCheckbox).toBeChecked();
+        });
+        it('clears selections when prefix changes', async ()=>{
+            const { rerender } = render(/*#__PURE__*/ jsx(MemoryRouter, {
+                children: (()=>{
+                    const Wrapper = createTestWrapper();
+                    const customization = {
+                        extraObjectListColumns: [],
+                        extraObjectListActions: []
+                    };
+                    return /*#__PURE__*/ jsx(Wrapper, {
+                        children: /*#__PURE__*/ jsx(DataBrowserUICustomizationProvider, {
+                            config: customization,
+                            children: /*#__PURE__*/ jsx(ObjectList, {
+                                bucketName: "test-bucket",
+                                prefix: "",
+                                onObjectSelect: jest.fn(),
+                                onPrefixChange: jest.fn()
+                            })
+                        })
+                    });
+                })()
+            }));
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            const checkboxesBefore = screen.getAllByRole('checkbox');
+            expect(checkboxesBefore.length).toBeGreaterThan(0);
+            const firstCheckbox = checkboxesBefore[1];
+            fireEvent.click(firstCheckbox);
+            expect(firstCheckbox).toBeChecked();
+            rerender(/*#__PURE__*/ jsx(MemoryRouter, {
+                children: (()=>{
+                    const Wrapper = createTestWrapper();
+                    const customization = {
+                        extraObjectListColumns: [],
+                        extraObjectListActions: []
+                    };
+                    return /*#__PURE__*/ jsx(Wrapper, {
+                        children: /*#__PURE__*/ jsx(DataBrowserUICustomizationProvider, {
+                            config: customization,
+                            children: /*#__PURE__*/ jsx(ObjectList, {
+                                bucketName: "test-bucket",
+                                prefix: "folder1/",
+                                onObjectSelect: jest.fn(),
+                                onPrefixChange: jest.fn()
+                            })
+                        })
+                    });
+                })()
+            }));
+            await waitFor(()=>{
+                expect(screen.getByRole('grid')).toBeInTheDocument();
+            });
+            const checkboxesAfter = screen.getAllByRole('checkbox');
+            checkboxesAfter.forEach((checkbox)=>{
+                expect(checkbox).not.toBeChecked();
+            });
+        });
     });
-    it("handles infinite scroll pagination correctly", async ()=>{
-        renderObjectList({
-            bucketName: "paginated-bucket"
-        });
-        await waitFor(()=>{
-            expect(screen.getByText("file1.txt")).toBeInTheDocument();
-        });
-        expect(screen.getByText("file1.txt")).toBeInTheDocument();
-        expect(screen.getByText("file2.txt")).toBeInTheDocument();
-        expect(screen.getByText("folder1/")).toBeInTheDocument();
-        expect(screen.queryByText("file3.txt")).not.toBeInTheDocument();
-        const table = screen.getByRole("grid");
-        expect(table).toBeInTheDocument();
-        const tableContent = table.querySelector('[role="rowgroup"]') || table.querySelector('[data-testid*="multi-selectable"]');
-        expect(tableContent).toBeInTheDocument();
-        const rows = screen.getAllByRole("row");
-        expect(rows.length).toBe(4);
-        expect(()=>{
-            screen.getByText("Name");
-            screen.getByText("Modified on");
-            screen.getByText("Size");
-            screen.getByText("Storage Location");
-        }).not.toThrow();
-        expect(screen.getByText("1 KB")).toBeInTheDocument();
-        expect(screen.getByText("512 B")).toBeInTheDocument();
+    describe('Action Buttons', ()=>{
+        it('renders upload and create folder buttons', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            expect(screen.getByText('Upload')).toBeInTheDocument();
+            expect(screen.getByRole('button', {
+                name: /folder/i
+            })).toBeInTheDocument();
+        });
+        it('renders delete button', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            expect(screen.getByText('Delete')).toBeInTheDocument();
+        });
     });
-    it("integrates with infinite query hook for data loading", async ()=>{
-        const { result } = renderHook(()=>useListObjects({
-                Bucket: "paginated-bucket",
-                MaxKeys: 20,
-                Delimiter: "/"
-            }), {
-            wrapper: createTestWrapper()
-        });
-        await waitFor(()=>{
-            expect(result.current.isSuccess).toBe(true);
-        });
-        expect(result.current.data).toBeDefined();
-        expect(result.current.hasNextPage).toBe(true);
-        expect(typeof result.current.fetchNextPage).toBe("function");
-        expect(result.current.isFetchingNextPage).toBe(false);
-        const firstPage = result.current.data?.pages[0];
-        expect(firstPage).toBeDefined();
-        expect(firstPage?.Contents).toHaveLength(2);
-        expect(firstPage?.CommonPrefixes).toHaveLength(1);
-        result.current.fetchNextPage();
-        await waitFor(()=>{
-            const updatedData = result.current.data;
-            expect(updatedData?.pages).toHaveLength(2);
-        });
-        const secondPage = result.current.data?.pages[1];
-        expect(secondPage).toBeDefined();
-        expect(secondPage?.Contents).toHaveLength(1);
-        expect(result.current.hasNextPage).toBe(false);
+    describe('Error Handling', ()=>{
+        it('handles errors gracefully', async ()=>{
+            const consoleErrorSpy = jest.spyOn(console, 'error').mockImplementation();
+            expect(()=>{
+                renderObjectList();
+            }).not.toThrow();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            consoleErrorSpy.mockRestore();
+        });
     });
-    it("renders List Versions toggle", async ()=>{
-        renderObjectList();
-        await waitFor(()=>{
-            expect(screen.getByText("List Versions")).toBeInTheDocument();
-        });
-        const toggleLabel = screen.getByText(/list versions/i);
-        const toggle = toggleLabel.closest("label")?.querySelector('input[type="checkbox"]');
-        expect(toggle).toBeInTheDocument();
-        expect(toggle).not.toBeChecked();
+    describe('Column Sorting', ()=>{
+        it('sorts folders before files', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            const rows = screen.getAllByRole('row');
+            const dataRows = rows.slice(1);
+            const firstRowText = dataRows[0]?.textContent || '';
+            expect(firstRowText).toContain('folder1/');
+        });
+        it('sorts items alphabetically within their type', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            const rows = screen.getAllByRole('row');
+            const dataRows = rows.slice(1);
+            const fileRows = dataRows.filter((row)=>row.textContent?.includes('file') && !row.textContent?.includes('folder'));
+            expect(fileRows.length).toBeGreaterThanOrEqual(2);
+            const firstFileName = fileRows[0]?.textContent || '';
+            const secondFileName = fileRows[1]?.textContent || '';
+            expect(firstFileName.includes('file1')).toBe(true);
+            expect(secondFileName.includes('file2')).toBe(true);
+        });
     });
-    it("shows Version ID column when toggle is enabled", async ()=>{
-        renderObjectList();
-        await waitFor(()=>{
-            expect(screen.getByText("List Versions")).toBeInTheDocument();
+    describe('Customization', ()=>{
+        it('supports custom columns', async ()=>{
+            const CustomCell = ({ data })=>/*#__PURE__*/ jsxs("div", {
+                    children: [
+                        "Custom: ",
+                        data.Key
+                    ]
+                });
+            const customization = {
+                extraObjectListColumns: [
+                    {
+                        id: 'custom',
+                        header: 'Custom Column',
+                        render: CustomCell,
+                        width: '200px'
+                    }
+                ],
+                extraObjectListActions: []
+            };
+            renderObjectList({}, customization);
+            await waitFor(()=>{
+                expect(screen.getByText('Custom Column')).toBeInTheDocument();
+            });
+        });
+        it('supports custom actions', async ()=>{
+            const CustomAction = ()=>/*#__PURE__*/ jsx("button", {
+                    children: "Custom Action"
+                });
+            const customization = {
+                extraObjectListColumns: [],
+                extraObjectListActions: [
+                    {
+                        id: 'customAction',
+                        render: CustomAction
+                    }
+                ]
+            };
+            renderObjectList({}, customization);
+            await waitFor(()=>{
+                expect(screen.getByText('Custom Action')).toBeInTheDocument();
+            });
         });
-        const toggleLabel = screen.getByText(/list versions/i);
-        const toggle = toggleLabel.closest("label")?.querySelector('input[type="checkbox"]');
-        fireEvent.click(toggle);
-        await waitFor(()=>{
-            expect(screen.getByText("Version ID")).toBeInTheDocument();
+        it('allows overriding default columns', async ()=>{
+            const CustomNameCell = ({ data })=>/*#__PURE__*/ jsxs("div", {
+                    children: [
+                        "Override: ",
+                        data.displayName
+                    ]
+                });
+            const customization = {
+                extraObjectListColumns: [
+                    {
+                        id: 'name',
+                        header: 'Custom Name',
+                        render: CustomNameCell
+                    }
+                ],
+                extraObjectListActions: []
+            };
+            renderObjectList({}, customization);
+            await waitFor(()=>{
+                expect(screen.getByText('Custom Name')).toBeInTheDocument();
+            });
         });
     });
-    it("does not show Version ID column by default", async ()=>{
-        renderObjectList();
-        await waitFor(()=>{
-            expect(screen.getByText("Name")).toBeInTheDocument();
+    describe('Edge Cases', ()=>{
+        it('handles edge cases gracefully', async ()=>{
+            const mockOnPrefixChange = jest.fn();
+            renderObjectList({
+                onPrefixChange: mockOnPrefixChange
+            });
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            expect(()=>{
+                fireEvent.click(screen.getByText('folder1/'));
+            }).not.toThrow();
+            expect(mockOnPrefixChange).toHaveBeenCalled();
         });
-        expect(screen.queryByText("Version ID")).not.toBeInTheDocument();
     });
-    it("integrates with version listing hook", async ()=>{
-        const { result } = renderHook(()=>useListObjectVersions({
-                Bucket: "test-bucket",
-                MaxKeys: 20,
-                Delimiter: "/"
-            }), {
-            wrapper: createTestWrapper()
-        });
-        await waitFor(()=>{
-            expect(result.current.isSuccess).toBe(true);
-        });
-        expect(result.current.data).toBeDefined();
-        expect(typeof result.current.fetchNextPage).toBe("function");
-        const firstPage = result.current.data?.pages[0];
-        expect(firstPage).toBeDefined();
+    describe('Callback Stability', ()=>{
+        it('maintains stable callback references', async ()=>{
+            const onPrefixChange = jest.fn();
+            const { rerender } = render(/*#__PURE__*/ jsx(MemoryRouter, {
+                children: (()=>{
+                    const Wrapper = createTestWrapper();
+                    const customization = {
+                        extraObjectListColumns: [],
+                        extraObjectListActions: []
+                    };
+                    return /*#__PURE__*/ jsx(Wrapper, {
+                        children: /*#__PURE__*/ jsx(DataBrowserUICustomizationProvider, {
+                            config: customization,
+                            children: /*#__PURE__*/ jsx(ObjectList, {
+                                bucketName: "test-bucket",
+                                prefix: "",
+                                onObjectSelect: jest.fn(),
+                                onPrefixChange: onPrefixChange
+                            })
+                        })
+                    });
+                })()
+            }));
+            await waitFor(()=>{
+                expect(screen.getByText('folder1/')).toBeInTheDocument();
+            });
+            fireEvent.click(screen.getByText('folder1/'));
+            expect(onPrefixChange).toHaveBeenCalledTimes(1);
+            const firstCallArgs = onPrefixChange.mock.calls[0];
+            rerender(/*#__PURE__*/ jsx(MemoryRouter, {
+                children: (()=>{
+                    const Wrapper = createTestWrapper();
+                    const customization = {
+                        extraObjectListColumns: [],
+                        extraObjectListActions: []
+                    };
+                    return /*#__PURE__*/ jsx(Wrapper, {
+                        children: /*#__PURE__*/ jsx(DataBrowserUICustomizationProvider, {
+                            config: customization,
+                            children: /*#__PURE__*/ jsx(ObjectList, {
+                                bucketName: "test-bucket",
+                                prefix: "",
+                                onObjectSelect: jest.fn(),
+                                onPrefixChange: onPrefixChange
+                            })
+                        })
+                    });
+                })()
+            }));
+            await waitFor(()=>{
+                expect(screen.getByText('folder1/')).toBeInTheDocument();
+            });
+            fireEvent.click(screen.getByText('folder1/'));
+            expect(onPrefixChange).toHaveBeenCalledTimes(2);
+            const secondCallArgs = onPrefixChange.mock.calls[1];
+            expect(secondCallArgs[0]).toEqual(firstCallArgs[0]);
+        });
     });
-    it("renders table search when metadata-search feature is disabled", async ()=>{
-        jest.spyOn(__WEBPACK_EXTERNAL_MODULE__utils_useFeatures_js_1facdd0d__, "useFeatures").mockReturnValue(false);
-        renderObjectList();
-        await waitFor(()=>{
-            expect(screen.getByRole("grid")).toBeInTheDocument();
+    describe('File Download', ()=>{
+        beforeEach(()=>{
+            mockOffsetSize(800, 600);
+        });
+        it('triggers download when clicking on file name without errors', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            const fileLink = screen.getByText('file1.txt');
+            expect(()=>{
+                fireEvent.click(fileLink);
+            }).not.toThrow();
+        });
+        it('does not download folders - navigates to prefix instead', async ()=>{
+            const onPrefixChange = jest.fn();
+            renderObjectList({
+                onPrefixChange
+            });
+            await waitFor(()=>{
+                expect(screen.getByText('folder1/')).toBeInTheDocument();
+            });
+            const folderLink = screen.getByText('folder1/');
+            fireEvent.click(folderLink);
+            expect(onPrefixChange).toHaveBeenCalledWith('folder1/');
+        });
+        it('supports clicking on different files independently', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+                expect(screen.getByText('file2.txt')).toBeInTheDocument();
+            });
+            const file1Link = screen.getByText('file1.txt');
+            const file2Link = screen.getByText('file2.txt');
+            expect(()=>{
+                fireEvent.click(file1Link);
+                fireEvent.click(file2Link);
+            }).not.toThrow();
+        });
+        it('renders file and folder names as clickable links', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+                expect(screen.getByText('folder1/')).toBeInTheDocument();
+            });
+            const fileLink = screen.getByText('file1.txt');
+            const folderLink = screen.getByText('folder1/');
+            expect(fileLink.closest('a')).toBeInTheDocument();
+            expect(folderLink.closest('a')).toBeInTheDocument();
+        });
+        it('handles download errors gracefully', async ()=>{
+            const consoleErrorSpy = jest.spyOn(console, 'error').mockImplementation();
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            expect(()=>{
+                fireEvent.click(screen.getByText('file1.txt'));
+            }).not.toThrow();
+            consoleErrorSpy.mockRestore();
         });
-        expect(screen.queryByPlaceholderText(/Metadata Search/i)).not.toBeInTheDocument();
     });
-    it("renders MetadataSearch component when metadata-search feature is enabled", async ()=>{
-        jest.spyOn(__WEBPACK_EXTERNAL_MODULE__utils_useFeatures_js_1facdd0d__, "useFeatures").mockReturnValue(true);
-        renderObjectList();
-        await waitFor(()=>{
-            expect(screen.getByRole("grid")).toBeInTheDocument();
+    describe('Accessibility', ()=>{
+        it('renders file and folder names as clickable links', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+                expect(screen.getByText('folder1/')).toBeInTheDocument();
+            });
+            const fileLink = screen.getByText('file1.txt').closest('a');
+            const folderLink = screen.getByText('folder1/').closest('a');
+            expect(fileLink).toBeInTheDocument();
+            expect(folderLink).toBeInTheDocument();
+        });
+        it('provides focusable links for keyboard navigation', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            const fileLink = screen.getByText('file1.txt').closest('a');
+            expect(fileLink).toBeInTheDocument();
+            expect(fileLink?.tagName.toLowerCase()).toBe('a');
+        });
+        it('ensures interactive elements are keyboard accessible', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            const fileLink = screen.getByText('file1.txt').closest('a');
+            const folderLink = screen.getByText('folder1/').closest('a');
+            expect(fileLink).toBeInTheDocument();
+            expect(folderLink).toBeInTheDocument();
+            if (fileLink) {
+                const tabIndex = fileLink.getAttribute('tabindex');
+                if (null !== tabIndex) expect(parseInt(tabIndex, 10)).toBeGreaterThanOrEqual(-1);
+            }
+            if (folderLink) {
+                const tabIndex = folderLink.getAttribute('tabindex');
+                if (null !== tabIndex) expect(parseInt(tabIndex, 10)).toBeGreaterThanOrEqual(-1);
+            }
+        });
+        it('provides keyboard interaction for Enter key on file links', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            const fileLink = screen.getByText('file1.txt').closest('a');
+            if (!fileLink) throw new Error('File link not found');
+            expect(()=>{
+                fireEvent.keyDown(fileLink, {
+                    key: 'Enter',
+                    code: 'Enter'
+                });
+            }).not.toThrow();
+        });
+        it('provides keyboard interaction for Space key on folder links', async ()=>{
+            const onPrefixChange = jest.fn();
+            renderObjectList({
+                onPrefixChange
+            });
+            await waitFor(()=>{
+                expect(screen.getByText('folder1/')).toBeInTheDocument();
+            });
+            const folderLink = screen.getByText('folder1/').closest('a');
+            if (!folderLink) throw new Error('Folder link not found');
+            fireEvent.keyDown(folderLink, {
+                key: ' ',
+                code: 'Space'
+            });
+            fireEvent.click(folderLink);
+            expect(onPrefixChange).toHaveBeenCalledWith('folder1/');
+        });
+        it('has proper ARIA roles for the table structure', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByRole('grid')).toBeInTheDocument();
+            });
+            const gridElement = screen.getByRole('grid');
+            expect(gridElement).toBeInTheDocument();
+            const rows = screen.getAllByRole('row');
+            expect(rows.length).toBeGreaterThan(0);
+        });
+    });
+    describe('Error Scenarios', ()=>{
+        let consoleErrorSpy;
+        beforeEach(()=>{
+            consoleErrorSpy = jest.spyOn(console, 'error').mockImplementation();
+        });
+        afterEach(()=>{
+            consoleErrorSpy.mockRestore();
+        });
+        it('continues to function when download initiation fails', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            const fileLink = screen.getByText('file1.txt');
+            fireEvent.click(fileLink);
+            fireEvent.click(fileLink);
+            expect(()=>{
+                fireEvent.click(fileLink);
+            }).not.toThrow();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+        });
+        it('handles rapid clicking without breaking the UI', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            const fileLink = screen.getByText('file1.txt');
+            for(let i = 0; i < 10; i++)fireEvent.click(fileLink);
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            expect(screen.getByText('file1.txt')).toBeInTheDocument();
+        });
+        it('properly invokes navigation callbacks', async ()=>{
+            const onPrefixChange = jest.fn();
+            renderObjectList({
+                onPrefixChange
+            });
+            await waitFor(()=>{
+                expect(screen.getByText('folder1/')).toBeInTheDocument();
+            });
+            const folderLink = screen.getByText('folder1/');
+            fireEvent.click(folderLink);
+            expect(onPrefixChange).toHaveBeenCalledWith('folder1/');
+            expect(onPrefixChange).toHaveBeenCalledTimes(1);
+        });
+        it('recovers gracefully from failed async operations', async ()=>{
+            renderObjectList();
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            fireEvent.click(screen.getByText('file1.txt'));
+            await waitFor(()=>{
+                expect(screen.getByText('file1.txt')).toBeInTheDocument();
+            });
+            expect(screen.getByText('file2.txt')).toBeInTheDocument();
         });
-        expect(screen.getByPlaceholderText(/Metadata Search/i)).toBeInTheDocument();
     });
 });