@scality/data-browser-library 1.0.0-preview.2

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

@@ -0,0 +1,283 @@
+import { jsx } 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 { useListObjectVersions, useListObjects } from "../../hooks/index.js";
+import { ObjectList } from "../objects/ObjectList.js";
+import * as __WEBPACK_EXTERNAL_MODULE__utils_useFeatures_js_1facdd0d__ from "../../utils/useFeatures.js";
+setupMswServer();
+const renderObjectList = (props = {})=>{
+    const Wrapper = createTestWrapper();
+    return render(/*#__PURE__*/ jsx(MemoryRouter, {
+        children: /*#__PURE__*/ jsx(Wrapper, {
+            children: /*#__PURE__*/ jsx(ObjectList, {
+                bucketName: "test-bucket",
+                prefix: "",
+                onObjectSelect: jest.fn(),
+                onPrefixChange: jest.fn(),
+                ...props
+            })
+        })
+    }));
+};
+describe("ObjectList", ()=>{
+    beforeEach(()=>{
+        jest.clearAllMocks();
+        mockOffsetSize(800, 600);
+        jest.spyOn(__WEBPACK_EXTERNAL_MODULE__utils_useFeatures_js_1facdd0d__, "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);
+    });
+    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();
+    });
+    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();
+    });
+    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();
+    });
+    it("supports prefix-based navigation", async ()=>{
+        renderObjectList({
+            prefix: "folder1/"
+        });
+        await waitFor(()=>{
+            expect(screen.getByRole("grid")).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();
+        });
+    });
+    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);
+    });
+    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();
+    });
+    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("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();
+    });
+    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("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();
+        });
+        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();
+        });
+        expect(screen.getByPlaceholderText(/Metadata Search/i)).toBeInTheDocument();
+    });
+});

package/dist/components/__tests__/UploadButton.test.d.ts

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

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

@@ -0,0 +1,144 @@
+import { jsx } from "react/jsx-runtime";
+import { fireEvent, render, screen, waitFor } from "@testing-library/react";
+import user_event from "@testing-library/user-event";
+import { createTestWrapper } from "../../test/testUtils.js";
+import { UploadButton } from "../objects/UploadButton.js";
+describe("UploadButton - Core Functionality", ()=>{
+    const defaultProps = {
+        bucket: "test-bucket",
+        prefix: "test-prefix"
+    };
+    const renderUploadButton = (props = {})=>{
+        const Wrapper = createTestWrapper();
+        return render(/*#__PURE__*/ jsx(Wrapper, {
+            children: /*#__PURE__*/ jsx(UploadButton, {
+                ...defaultProps,
+                ...props
+            })
+        }));
+    };
+    it("renders upload button with default label", ()=>{
+        renderUploadButton();
+        expect(screen.getByRole("button", {
+            name: /upload/i
+        })).toBeInTheDocument();
+    });
+    it("renders upload button", ()=>{
+        renderUploadButton();
+        expect(screen.getByRole("button", {
+            name: /upload/i
+        })).toBeInTheDocument();
+    });
+    it("opens modal when upload button is clicked", async ()=>{
+        renderUploadButton();
+        const uploadButton = screen.getByRole("button", {
+            name: /upload/i
+        });
+        fireEvent.click(uploadButton);
+        await waitFor(()=>{
+            expect(screen.getByText("Upload Files")).toBeInTheDocument();
+        });
+    });
+    it("closes modal when cancel button is clicked", async ()=>{
+        renderUploadButton();
+        const uploadButton = screen.getByRole("button", {
+            name: /upload/i
+        });
+        fireEvent.click(uploadButton);
+        await waitFor(()=>{
+            expect(screen.getByText("Upload Files")).toBeInTheDocument();
+        });
+        const cancelButton = screen.getByRole("button", {
+            name: /cancel/i
+        });
+        fireEvent.click(cancelButton);
+        await waitFor(()=>{
+            expect(screen.queryByText("Upload Files")).not.toBeInTheDocument();
+        });
+    });
+    it("displays empty state initially", async ()=>{
+        renderUploadButton();
+        const uploadButton = screen.getByRole("button", {
+            name: /upload/i
+        });
+        fireEvent.click(uploadButton);
+        await waitFor(()=>{
+            expect(screen.getByText("Drag and drop files and folders here")).toBeInTheDocument();
+            expect(screen.getByRole("button", {
+                name: /add files/i
+            })).toBeInTheDocument();
+        });
+    });
+    it("can add files and shows upload button enabled", async ()=>{
+        const onUploadSuccess = jest.fn();
+        renderUploadButton({
+            onUploadSuccess
+        });
+        const uploadButton = screen.getByRole("button", {
+            name: /upload/i
+        });
+        fireEvent.click(uploadButton);
+        await waitFor(()=>{
+            expect(screen.getByText("Upload Files")).toBeInTheDocument();
+        });
+        const uploadButtons = screen.getAllByRole("button", {
+            name: "Upload"
+        });
+        const modalUploadButton = uploadButtons.find((button)=>!button.querySelector("svg"));
+        expect(modalUploadButton).toBeDisabled();
+        const fileInput = screen.getByRole("presentation").querySelector('input[type="file"]');
+        const testFile = new File([
+            "test content"
+        ], "test.txt", {
+            type: "text/plain"
+        });
+        await user_event.upload(fileInput, testFile);
+        await waitFor(()=>{
+            expect(screen.getByText("test.txt")).toBeInTheDocument();
+            expect(screen.getByText("12 B")).toBeInTheDocument();
+        });
+        expect(modalUploadButton).toBeEnabled();
+    });
+    it("displays correct bucket and prefix information", ()=>{
+        const customBucket = "custom-bucket";
+        const customPrefix = "custom/prefix";
+        renderUploadButton({
+            bucket: customBucket,
+            prefix: customPrefix
+        });
+        expect(screen.getByRole("button", {
+            name: /upload/i
+        })).toBeInTheDocument();
+    });
+    it("handles different button variants", ()=>{
+        renderUploadButton({
+            variant: "primary"
+        });
+        const button = screen.getByRole("button", {
+            name: /upload/i
+        });
+        expect(button).toBeInTheDocument();
+    });
+    it("resets state when modal is closed", async ()=>{
+        renderUploadButton();
+        const uploadButton = screen.getByRole("button", {
+            name: /upload/i
+        });
+        fireEvent.click(uploadButton);
+        await waitFor(()=>{
+            expect(screen.getByText("Upload Files")).toBeInTheDocument();
+        });
+        const cancelButton = screen.getByRole("button", {
+            name: /cancel/i
+        });
+        fireEvent.click(cancelButton);
+        await waitFor(()=>{
+            expect(screen.queryByText("Upload Files")).not.toBeInTheDocument();
+        });
+        fireEvent.click(uploadButton);
+        await waitFor(()=>{
+            expect(screen.getByText("Upload Files")).toBeInTheDocument();
+            expect(screen.getByText("Drag and drop files and folders here")).toBeInTheDocument();
+        });
+    });
+});

package/dist/components/buckets/BucketDetails.d.ts

@@ -0,0 +1 @@
+export declare function BucketDetails(): import("react/jsx-runtime").JSX.Element;

package/dist/components/buckets/BucketDetails.js

@@ -0,0 +1,51 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useQueryParams } from "../../utils/hooks.js";
+import { useNavigate, useParams } from "react-router-dom";
+import { Tabs } from "@scality/core-ui/dist/next";
+import { BucketOverview } from "./BucketOverview.js";
+import { DeleteBucketButton } from "./DeleteBucketButton.js";
+function BucketDetails() {
+    const query = useQueryParams();
+    const queryObject = Object.fromEntries(query.entries());
+    const { bucketName } = useParams();
+    const navigate = useNavigate();
+    if (!bucketName) return /*#__PURE__*/ jsx("div", {
+        children: "No bucket selected"
+    });
+    return /*#__PURE__*/ jsx(Fragment, {
+        children: /*#__PURE__*/ jsxs(Tabs, {
+            children: [
+                /*#__PURE__*/ jsx(Tabs.Tab, {
+                    label: "Overview",
+                    path: "",
+                    query: {
+                        ...queryObject,
+                        tab: ""
+                    },
+                    children: /*#__PURE__*/ jsx(BucketOverview, {
+                        bucketName: bucketName,
+                        renderDeleteButton: ()=>/*#__PURE__*/ jsx(DeleteBucketButton, {
+                                bucketName: bucketName
+                            }),
+                        onEditPolicy: ()=>{
+                            navigate(`/buckets/${bucketName}/policy`);
+                        }
+                    })
+                }),
+                /*#__PURE__*/ jsx(Tabs.Tab, {
+                    label: "Workflow",
+                    path: "",
+                    query: {
+                        ...queryObject,
+                        tab: "workflow"
+                    },
+                    withoutPadding: true,
+                    children: /*#__PURE__*/ jsx(Fragment, {
+                        children: "Workflow"
+                    })
+                })
+            ]
+        })
+    });
+}
+export { BucketDetails };

package/dist/components/buckets/BucketList.d.ts

@@ -0,0 +1,12 @@
+import type { Bucket } from "@aws-sdk/client-s3";
+interface BucketListProps {
+    buckets: Bucket[];
+    bucketStatus?: "idle" | "loading" | "error" | "success";
+    selectedBucketName?: string | null;
+    onBucketSelect?: (bucketName: string) => void;
+    onCreateBucket?: () => void;
+    onNavigateToBucket?: (bucketName: string) => void;
+    renderBucketLocation?: (bucketName: string) => React.ReactNode;
+}
+export declare function BucketList({ buckets, bucketStatus, selectedBucketName, onBucketSelect, onCreateBucket, onNavigateToBucket, renderBucketLocation, }: BucketListProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/buckets/BucketList.js

@@ -0,0 +1,136 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ConstrainedText, FormattedDateTime, Icon, Link, Wrap, spacing } from "@scality/core-ui";
+import { Box, Button, Table } from "@scality/core-ui/dist/next";
+import { useMemo } from "react";
+const SEARCH_QUERY_PARAM = "search";
+function BucketList({ buckets, bucketStatus, selectedBucketName, onBucketSelect, onCreateBucket, onNavigateToBucket, renderBucketLocation }) {
+    const columns = useMemo(()=>[
+            {
+                Header: "Bucket Name",
+                accessor: "Name",
+                id: "name",
+                Cell: ({ value, row })=>{
+                    const name = value || row.original?.Name;
+                    if (!name) return /*#__PURE__*/ jsx("span", {
+                        children: "-"
+                    });
+                    return /*#__PURE__*/ jsx(ConstrainedText, {
+                        text: /*#__PURE__*/ jsx(Link, {
+                            onClick: (e)=>{
+                                e.stopPropagation();
+                                onNavigateToBucket?.(name);
+                            },
+                            children: name
+                        }),
+                        lineClamp: 2
+                    });
+                },
+                cellStyle: {
+                    flex: "1",
+                    width: "unset"
+                }
+            },
+            {
+                Header: "Storage Location",
+                accessor: "Name",
+                id: "location",
+                Cell ({ value }) {
+                    return renderBucketLocation ? renderBucketLocation(value) : /*#__PURE__*/ jsx("span", {
+                        children: "-"
+                    });
+                },
+                cellStyle: {
+                    width: "unset",
+                    flex: "1.2"
+                }
+            },
+            {
+                Header: "Created on",
+                accessor: "CreationDate",
+                id: "date",
+                cellStyle: {
+                    flex: "1",
+                    textAlign: "right",
+                    paddingRight: spacing.r16,
+                    width: "unset"
+                },
+                Cell: ({ value, row })=>{
+                    const date = value || row.original?.CreationDate;
+                    if (!date) return /*#__PURE__*/ jsx("span", {
+                        children: "-"
+                    });
+                    return /*#__PURE__*/ jsx(FormattedDateTime, {
+                        format: "date-time-second",
+                        value: new Date(date)
+                    });
+                }
+            }
+        ], [
+        onNavigateToBucket,
+        renderBucketLocation
+    ]);
+    const tableData = useMemo(()=>buckets.map(({ Name, CreationDate, ...bucket })=>({
+                Name,
+                CreationDate,
+                ...bucket
+            })), [
+        buckets
+    ]);
+    const selectedId = useMemo(()=>{
+        if (buckets && selectedBucketName) return buckets.findIndex((bucket)=>bucket.Name === selectedBucketName);
+        return null;
+    }, [
+        selectedBucketName,
+        buckets
+    ]);
+    return /*#__PURE__*/ jsxs(Table, {
+        columns: columns,
+        data: tableData,
+        status: bucketStatus,
+        defaultSortingKey: "CreationDate",
+        entityName: {
+            en: {
+                singular: "bucket",
+                plural: "buckets"
+            }
+        },
+        children: [
+            /*#__PURE__*/ jsxs(Wrap, {
+                padding: spacing.r16,
+                children: [
+                    /*#__PURE__*/ jsx(Box, {
+                        display: "flex",
+                        justifyContent: "space-between",
+                        alignItems: "center",
+                        gap: spacing.r4,
+                        children: /*#__PURE__*/ jsx(Table.SearchWithQueryParams, {
+                            queryParams: SEARCH_QUERY_PARAM
+                        })
+                    }),
+                    /*#__PURE__*/ jsx(Box, {
+                        gap: "r16",
+                        children: /*#__PURE__*/ jsx(Button, {
+                            icon: /*#__PURE__*/ jsx(Icon, {
+                                name: "Create-add"
+                            }),
+                            label: "Create Bucket",
+                            variant: "primary",
+                            onClick: onCreateBucket,
+                            type: "submit"
+                        })
+                    })
+                ]
+            }),
+            /*#__PURE__*/ jsx(Table.SingleSelectableContent, {
+                rowHeight: "h40",
+                selectedId: selectedId?.toString(),
+                onRowSelected: (row)=>{
+                    const isSelected = selectedBucketName === row.original.Name;
+                    if (!isSelected && row.original.Name) onBucketSelect?.(row.original.Name);
+                },
+                separationLineVariant: "backgroundLevel1"
+            })
+        ]
+    });
+}
+export { BucketList };

package/dist/components/buckets/BucketLocation.d.ts

@@ -0,0 +1,3 @@
+export declare const BucketLocation: ({ bucketName }: {
+    bucketName: string;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/components/buckets/BucketLocation.js

@@ -0,0 +1,16 @@
+import { jsx } from "react/jsx-runtime";
+import { useGetBucketLocation } from "../../hooks/index.js";
+import { Loader } from "@scality/core-ui";
+const BucketLocation = ({ bucketName })=>{
+    const { data: bucketLocation, status } = useGetBucketLocation({
+        Bucket: bucketName
+    });
+    if ("pending" === status) return /*#__PURE__*/ jsx(Loader, {});
+    if ("error" === status) return /*#__PURE__*/ jsx("div", {
+        children: "Error"
+    });
+    return /*#__PURE__*/ jsx("div", {
+        children: bucketLocation?.LocationConstraint || "us-east-1"
+    });
+};
+export { BucketLocation };

package/dist/components/buckets/BucketOverview.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+interface BucketOverviewProps {
+    bucketName: string;
+    onEmptyBucket?: () => void;
+    onDeleteBucket?: () => void;
+    onEditPolicy?: (bucketName: string) => void;
+    renderBucketLocation?: (bucketName: string) => React.ReactNode;
+    renderDeleteButton?: (bucketName: string) => React.ReactNode;
+    renderEmptyButton?: (bucketName: string) => React.ReactNode;
+    isEmptyBucketDisabled?: boolean;
+    isDeleteBucketDisabled?: boolean;
+}
+declare const BucketOverview: React.FC<BucketOverviewProps>;
+export { BucketOverview };