@scality/data-browser-library 1.0.0-preview.11 → 1.0.0-preview.13

package/dist/components/objects/ObjectDetails/__tests__/ObjectDetails.test.js

@@ -0,0 +1,516 @@
+import * as __WEBPACK_EXTERNAL_MODULE__index_js_95fdb65a__ from "../index.js";
+import { jsx } from "react/jsx-runtime";
+import { cleanup, render, screen } from "@testing-library/react";
+import { MemoryRouter, Route, Routes } from "react-router-dom";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { DataBrowserUICustomizationProvider } from "../../../../contexts/DataBrowserUICustomizationContext.js";
+var __webpack_modules__ = {
+    "../index": function(module) {
+        module.exports = __WEBPACK_EXTERNAL_MODULE__index_js_95fdb65a__;
+    }
+};
+var __webpack_module_cache__ = {};
+function __webpack_require__(moduleId) {
+    var cachedModule = __webpack_module_cache__[moduleId];
+    if (void 0 !== cachedModule) return cachedModule.exports;
+    var module = __webpack_module_cache__[moduleId] = {
+        exports: {}
+    };
+    __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
+    return module.exports;
+}
+var external_index_js_ = __webpack_require__("../index");
+jest.mock("../ObjectSummary", ()=>({
+        ObjectSummary: ()=>/*#__PURE__*/ jsx("div", {
+                "data-testid": "object-summary",
+                children: "ObjectSummary"
+            })
+    }));
+jest.mock("../ObjectMetadata", ()=>({
+        ObjectMetadata: ()=>/*#__PURE__*/ jsx("div", {
+                "data-testid": "object-metadata",
+                children: "ObjectMetadata"
+            })
+    }));
+jest.mock("../ObjectTags", ()=>({
+        ObjectTags: ()=>/*#__PURE__*/ jsx("div", {
+                "data-testid": "object-tags",
+                children: "ObjectTags"
+            })
+    }));
+const createMockObjectItem = (overrides)=>({
+        Key: "test-object.txt",
+        LastModified: new Date("2024-01-01"),
+        Size: 1024,
+        type: "object",
+        displayName: "test-object.txt",
+        ...overrides
+    });
+const createMockVersionItem = ()=>({
+        Key: "test-object.txt",
+        VersionId: "version-123",
+        LastModified: new Date("2024-01-01"),
+        Size: 1024,
+        type: "version",
+        displayName: "test-object.txt",
+        IsLatest: true
+    });
+const createMockFolderItem = ()=>({
+        Key: "test-folder/",
+        type: "folder",
+        displayName: "test-folder/"
+    });
+const createMockDeleteMarkerItem = ()=>({
+        Key: "deleted-object.txt",
+        VersionId: "delete-marker-123",
+        LastModified: new Date("2024-01-01"),
+        type: "deleteMarker",
+        displayName: "deleted-object.txt",
+        IsLatest: true,
+        isDeleteMarker: true
+    });
+const renderWithProviders = (ui, { initialRoute = "/buckets/test-bucket/objects", customizationConfig = {} } = {})=>{
+    const queryClient = new QueryClient({
+        defaultOptions: {
+            queries: {
+                retry: false
+            },
+            mutations: {
+                retry: false
+            }
+        }
+    });
+    return render(/*#__PURE__*/ jsx(QueryClientProvider, {
+        client: queryClient,
+        children: /*#__PURE__*/ jsx(DataBrowserUICustomizationProvider, {
+            config: customizationConfig,
+            children: /*#__PURE__*/ jsx(MemoryRouter, {
+                initialEntries: [
+                    initialRoute
+                ],
+                children: /*#__PURE__*/ jsx(Routes, {
+                    children: /*#__PURE__*/ jsx(Route, {
+                        path: "/buckets/:bucketName/objects",
+                        element: ui
+                    })
+                })
+            })
+        })
+    }));
+};
+describe("ObjectDetails", ()=>{
+    describe("Default Tabs", ()=>{
+        it("should render three default tabs", ()=>{
+            const item = createMockObjectItem();
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: item
+            }));
+            expect(screen.getByRole("tab", {
+                name: /summary/i
+            })).toBeInTheDocument();
+            expect(screen.getByRole("tab", {
+                name: /metadata/i
+            })).toBeInTheDocument();
+            expect(screen.getByRole("tab", {
+                name: /tags/i
+            })).toBeInTheDocument();
+        });
+        it("should render Summary tab content by default", ()=>{
+            const item = createMockObjectItem();
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: item
+            }));
+            expect(screen.getByTestId("object-summary")).toBeInTheDocument();
+        });
+        it("should render child components when valid item is provided", ()=>{
+            const item = createMockObjectItem({
+                Key: "my-file.txt"
+            });
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: item
+            }));
+            expect(screen.getByTestId("object-summary")).toBeInTheDocument();
+        });
+    });
+    describe("Version ID handling", ()=>{
+        it("should pass versionId when item is a version", ()=>{
+            const versionItem = createMockVersionItem();
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: versionItem
+            }));
+            expect(screen.getByTestId("object-summary")).toBeInTheDocument();
+        });
+        it("should not pass versionId for regular objects", ()=>{
+            const item = createMockObjectItem();
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: item
+            }));
+            expect(screen.getByTestId("object-summary")).toBeInTheDocument();
+        });
+    });
+    describe("Placeholder States", ()=>{
+        it("should show placeholder when no item is selected", ()=>{
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: null
+            }));
+            expect(screen.getByText(/select an object to view details/i)).toBeInTheDocument();
+        });
+        it("should show placeholder for folder items", ()=>{
+            const folderItem = createMockFolderItem();
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: folderItem
+            }));
+            expect(screen.getByText(/a "folder" is selected/i)).toBeInTheDocument();
+        });
+        it("should show placeholder for delete marker items", ()=>{
+            const deleteMarkerItem = createMockDeleteMarkerItem();
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: deleteMarkerItem
+            }));
+            expect(screen.getByText(/a "delete marker" is selected/i)).toBeInTheDocument();
+        });
+        it("should show placeholder when item has no Key", ()=>{
+            const item = createMockObjectItem({
+                Key: void 0
+            });
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: item
+            }));
+            expect(screen.getByText(/select an object to view details/i)).toBeInTheDocument();
+        });
+        it("should show placeholder when item has empty Key", ()=>{
+            const item = createMockObjectItem({
+                Key: ""
+            });
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: item
+            }));
+            expect(screen.getByText(/select an object to view details/i)).toBeInTheDocument();
+        });
+        it("should render tabs even in placeholder state", ()=>{
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: null
+            }));
+            expect(screen.getByRole("tab", {
+                name: /summary/i
+            })).toBeInTheDocument();
+            expect(screen.getByRole("tab", {
+                name: /metadata/i
+            })).toBeInTheDocument();
+            expect(screen.getByRole("tab", {
+                name: /tags/i
+            })).toBeInTheDocument();
+        });
+    });
+    describe("Custom Tabs", ()=>{
+        it("should render extra custom tabs", ()=>{
+            const item = createMockObjectItem();
+            const customConfig = {
+                extraObjectTabs: [
+                    {
+                        id: "custom-tab",
+                        title: "Custom Tab",
+                        render: ()=>/*#__PURE__*/ jsx("div", {
+                                "data-testid": "custom-tab-content",
+                                children: "Custom Content"
+                            })
+                    }
+                ]
+            };
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: item
+            }), {
+                customizationConfig: customConfig
+            });
+            expect(screen.getByRole("tab", {
+                name: /custom tab/i
+            })).toBeInTheDocument();
+        });
+        it("should render custom tab in tab list", ()=>{
+            const item = createMockObjectItem();
+            const customConfig = {
+                extraObjectTabs: [
+                    {
+                        id: "versions",
+                        title: "Versions",
+                        render: ()=>/*#__PURE__*/ jsx("div", {
+                                "data-testid": "versions-tab",
+                                children: "Version History"
+                            })
+                    }
+                ]
+            };
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: item
+            }), {
+                customizationConfig: customConfig
+            });
+            const versionsTab = screen.getByRole("tab", {
+                name: /versions/i
+            });
+            expect(versionsTab).toBeInTheDocument();
+        });
+        it("should replace default tabs when custom tab has same ID", ()=>{
+            const item = createMockObjectItem();
+            const customConfig = {
+                extraObjectTabs: [
+                    {
+                        id: "summary",
+                        title: "Custom Summary",
+                        render: ()=>/*#__PURE__*/ jsx("div", {
+                                "data-testid": "custom-summary",
+                                children: "Custom Summary Content"
+                            })
+                    }
+                ]
+            };
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: item
+            }), {
+                customizationConfig: customConfig
+            });
+            expect(screen.getByRole("tab", {
+                name: /custom summary/i
+            })).toBeInTheDocument();
+            expect(screen.queryByRole("tab", {
+                name: /^summary$/i
+            })).not.toBeInTheDocument();
+        });
+        it("should support multiple custom tabs", ()=>{
+            const item = createMockObjectItem();
+            const customConfig = {
+                extraObjectTabs: [
+                    {
+                        id: "versions",
+                        title: "Versions",
+                        render: ()=>/*#__PURE__*/ jsx("div", {
+                                children: "Versions"
+                            })
+                    },
+                    {
+                        id: "permissions",
+                        title: "Permissions",
+                        render: ()=>/*#__PURE__*/ jsx("div", {
+                                children: "Permissions"
+                            })
+                    },
+                    {
+                        id: "activity",
+                        title: "Activity",
+                        render: ()=>/*#__PURE__*/ jsx("div", {
+                                children: "Activity"
+                            })
+                    }
+                ]
+            };
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: item
+            }), {
+                customizationConfig: customConfig
+            });
+            expect(screen.getByRole("tab", {
+                name: /versions/i
+            })).toBeInTheDocument();
+            expect(screen.getByRole("tab", {
+                name: /permissions/i
+            })).toBeInTheDocument();
+            expect(screen.getByRole("tab", {
+                name: /activity/i
+            })).toBeInTheDocument();
+        });
+        it("should support withoutPadding option for custom tabs", ()=>{
+            const item = createMockObjectItem();
+            const customConfig = {
+                extraObjectTabs: [
+                    {
+                        id: "full-width",
+                        title: "Full Width",
+                        withoutPadding: true,
+                        render: ()=>/*#__PURE__*/ jsx("div", {
+                                "data-testid": "full-width-content",
+                                children: "Full Width"
+                            })
+                    }
+                ]
+            };
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: item
+            }), {
+                customizationConfig: customConfig
+            });
+            expect(screen.getByRole("tab", {
+                name: /full width/i
+            })).toBeInTheDocument();
+        });
+    });
+    describe("Tab Ordering", ()=>{
+        it("should maintain default tab order", ()=>{
+            const item = createMockObjectItem();
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: item
+            }));
+            const tabs = screen.getAllByRole("tab");
+            expect(tabs[0]).toHaveTextContent(/summary/i);
+            expect(tabs[1]).toHaveTextContent(/metadata/i);
+            expect(tabs[2]).toHaveTextContent(/tags/i);
+        });
+        it("should append custom tabs after default tabs", ()=>{
+            const item = createMockObjectItem();
+            const customConfig = {
+                extraObjectTabs: [
+                    {
+                        id: "custom1",
+                        title: "Custom 1",
+                        render: ()=>/*#__PURE__*/ jsx("div", {
+                                children: "Custom 1"
+                            })
+                    },
+                    {
+                        id: "custom2",
+                        title: "Custom 2",
+                        render: ()=>/*#__PURE__*/ jsx("div", {
+                                children: "Custom 2"
+                            })
+                    }
+                ]
+            };
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: item
+            }), {
+                customizationConfig: customConfig
+            });
+            const tabs = screen.getAllByRole("tab");
+            expect(tabs[0]).toHaveTextContent(/summary/i);
+            expect(tabs[1]).toHaveTextContent(/metadata/i);
+            expect(tabs[2]).toHaveTextContent(/tags/i);
+            expect(tabs[3]).toHaveTextContent(/custom 1/i);
+            expect(tabs[4]).toHaveTextContent(/custom 2/i);
+        });
+    });
+    describe("Context Provider", ()=>{
+        it("should render child components when context is provided", ()=>{
+            const item = createMockObjectItem({
+                Key: "test-file.txt"
+            });
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: item
+            }));
+            expect(screen.getByTestId("object-summary")).toBeInTheDocument();
+        });
+        it("should throw error when useObjectDetailsContext is used outside provider", ()=>{
+            const { useObjectDetailsContext } = __webpack_require__("../index");
+            const TestComponent = ()=>{
+                useObjectDetailsContext();
+                return null;
+            };
+            const originalError = console.error;
+            console.error = jest.fn();
+            expect(()=>{
+                render(/*#__PURE__*/ jsx(QueryClientProvider, {
+                    client: new QueryClient(),
+                    children: /*#__PURE__*/ jsx(TestComponent, {})
+                }));
+            }).toThrow("ObjectDetails components must be used within ObjectDetails");
+            console.error = originalError;
+        });
+        it("should provide correct context values to nested components", ()=>{
+            const item = createMockObjectItem({
+                Key: "context-test.txt"
+            });
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: item
+            }));
+            expect(screen.getByTestId("object-summary")).toBeInTheDocument();
+        });
+    });
+    describe("Edge Cases", ()=>{
+        it("should handle missing bucketName in route", ()=>{
+            const item = createMockObjectItem();
+            const queryClient = new QueryClient();
+            render(/*#__PURE__*/ jsx(QueryClientProvider, {
+                client: queryClient,
+                children: /*#__PURE__*/ jsx(DataBrowserUICustomizationProvider, {
+                    config: {},
+                    children: /*#__PURE__*/ jsx(MemoryRouter, {
+                        initialEntries: [
+                            "/invalid-route"
+                        ],
+                        children: /*#__PURE__*/ jsx(Routes, {
+                            children: /*#__PURE__*/ jsx(Route, {
+                                path: "/invalid-route",
+                                element: /*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                                    item: item
+                                })
+                            })
+                        })
+                    })
+                })
+            }));
+            expect(screen.getByText(/select an object to view details/i)).toBeInTheDocument();
+        });
+        it("should handle item type changes", ()=>{
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: createMockObjectItem()
+            }));
+            expect(screen.getByTestId("object-summary")).toBeInTheDocument();
+            cleanup();
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: createMockFolderItem()
+            }));
+            expect(screen.getByText(/a "folder" is selected/i)).toBeInTheDocument();
+        });
+        it("should memoize tabs content efficiently", ()=>{
+            const item = createMockObjectItem();
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: item
+            }));
+            screen.getByTestId("object-summary");
+            cleanup();
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: item
+            }));
+            expect(screen.getByTestId("object-summary")).toBeInTheDocument();
+        });
+    });
+    describe("Performance", ()=>{
+        it("should not recreate context value unnecessarily", ()=>{
+            const item = createMockObjectItem({
+                Key: "same-key.txt"
+            });
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: item
+            }));
+            screen.getByTestId("object-summary");
+            cleanup();
+            const sameKeyItem = createMockObjectItem({
+                Key: "same-key.txt"
+            });
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: sameKeyItem
+            }));
+            expect(screen.getByTestId("object-summary")).toBeInTheDocument();
+        });
+        it("should handle rapid item changes", ()=>{
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: createMockObjectItem({
+                    Key: "file1.txt"
+                })
+            }));
+            expect(screen.getByTestId("object-summary")).toBeInTheDocument();
+            cleanup();
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: createMockObjectItem({
+                    Key: "file2.txt"
+                })
+            }));
+            expect(screen.getByTestId("object-summary")).toBeInTheDocument();
+            cleanup();
+            renderWithProviders(/*#__PURE__*/ jsx(external_index_js_.ObjectDetails, {
+                item: createMockObjectItem({
+                    Key: "file3.txt"
+                })
+            }));
+            expect(screen.getByTestId("object-summary")).toBeInTheDocument();
+        });
+    });
+});

package/dist/components/objects/ObjectDetails/__tests__/ObjectSummary.test.d.ts

@@ -0,0 +1 @@
+export {};