@scality/data-browser-library 1.0.0-preview.7 → 1.0.0-preview.9

package/dist/components/buckets/BucketOverview.js

@@ -1,204 +1,278 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { ConstrainedText, Icon, Loader, spacing } from "@scality/core-ui";
 import { Box, Button } from "@scality/core-ui/dist/next";
-import "react";
+import { createContext, useContext } from "react";
 import { useGetBucketAcl, useGetBucketCors, useGetBucketObjectLockConfiguration, useGetBucketPolicy, useGetBucketVersioning } from "../../hooks/index.js";
 import { useDataBrowserContext } from "../providers/DataBrowserProvider.js";
-import { Body, Group, GroupContent, GroupName, Key, Row, Table, TableContainer, Value } from "../ui/Table.elements.js";
+import { isNotFoundError } from "../../utils/errorHandling.js";
+import { Body, Group, GroupContent, GroupName, GroupValues, Key, Row, Table, TableContainer, Value } from "../ui/Table.elements.js";
 import { BucketLocation } from "./BucketLocation.js";
 import { BucketPolicyButton } from "./BucketPolicyButton.js";
-const BucketOverview = ({ bucketName, onEmptyBucket, onDeleteBucket, onEditPolicy, renderDeleteButton, renderEmptyButton, isEmptyBucketDisabled = true, isDeleteBucketDisabled = false })=>{
-    const { getS3Config } = useDataBrowserContext();
-    const config = getS3Config();
+import { EditRetentionButton } from "../objects/ObjectLock/EditRetentionButton.js";
+const BucketOverviewContext = /*#__PURE__*/ createContext(null);
+function useBucketOverviewContext() {
+    const context = useContext(BucketOverviewContext);
+    if (!context) throw new Error("BucketOverview components must be used within BucketOverview");
+    return context;
+}
+function getDefaultBucketRetention(objectLockData) {
+    if (!objectLockData?.ObjectLockConfiguration?.Rule?.DefaultRetention || !objectLockData.ObjectLockConfiguration.Rule.DefaultRetention.Days && !objectLockData.ObjectLockConfiguration.Rule.DefaultRetention.Years) return "Inactive";
+    const defaultRetention = objectLockData.ObjectLockConfiguration.Rule.DefaultRetention;
+    const retentionPeriod = defaultRetention.Days ? `${defaultRetention.Days} ${1 === defaultRetention.Days ? "day" : "days"}` : defaultRetention.Years ? `${defaultRetention.Years} ${1 === defaultRetention.Years ? "year" : "years"}` : "";
+    const mode = defaultRetention.Mode || "GOVERNANCE";
+    const capitalizedMode = mode.charAt(0).toUpperCase() + mode.slice(1).toLowerCase();
+    return `${capitalizedMode} - ${retentionPeriod}`;
+}
+const BucketOverviewRoot = ({ bucketName, children })=>/*#__PURE__*/ jsx(BucketOverviewContext.Provider, {
+        value: {
+            bucketName
+        },
+        children: /*#__PURE__*/ jsx(TableContainer, {
+            children: children
+        })
+    });
+const Actions = ({ onEmptyBucket, onDeleteBucket, renderEmptyButton, renderDeleteButton, isEmptyBucketDisabled = true, isDeleteBucketDisabled = false })=>{
+    const { bucketName } = useBucketOverviewContext();
+    return /*#__PURE__*/ jsxs(Box, {
+        display: "flex",
+        justifyContent: "flex-end",
+        paddingBottom: spacing.r16,
+        children: [
+            renderEmptyButton ? renderEmptyButton(bucketName) : /*#__PURE__*/ jsx(Button, {
+                icon: /*#__PURE__*/ jsx(Icon, {
+                    name: "Eraser"
+                }),
+                disabled: isEmptyBucketDisabled,
+                variant: "danger",
+                label: "Empty Bucket",
+                onClick: onEmptyBucket,
+                style: {
+                    marginRight: "1rem"
+                }
+            }),
+            renderDeleteButton ? renderDeleteButton(bucketName) : /*#__PURE__*/ jsx(Button, {
+                icon: /*#__PURE__*/ jsx(Icon, {
+                    name: "Delete"
+                }),
+                disabled: isDeleteBucketDisabled,
+                variant: "danger",
+                label: "Delete Bucket",
+                onClick: onDeleteBucket
+            })
+        ]
+    });
+};
+const Section = ({ title, children })=>/*#__PURE__*/ jsxs(Group, {
+        children: [
+            /*#__PURE__*/ jsx(GroupName, {
+                children: title
+            }),
+            /*#__PURE__*/ jsx(GroupContent, {
+                children: children
+            })
+        ]
+    });
+const Field = ({ label, value, loading, error, errorMessage = "Error", children, actions })=>{
+    const renderValue = ()=>{
+        if (loading) return /*#__PURE__*/ jsx(Loader, {});
+        if (error) return errorMessage;
+        return children || value || "N/A";
+    };
+    return /*#__PURE__*/ jsxs(Row, {
+        children: [
+            /*#__PURE__*/ jsx(Key, {
+                children: label
+            }),
+            actions ? /*#__PURE__*/ jsxs(GroupValues, {
+                children: [
+                    renderValue(),
+                    actions
+                ]
+            }) : /*#__PURE__*/ jsx(Value, {
+                children: renderValue()
+            })
+        ]
+    });
+};
+const Sections = ({ children })=>/*#__PURE__*/ jsx(Table, {
+        children: /*#__PURE__*/ jsx(Body, {
+            children: children
+        })
+    });
+const GeneralSection = ({ nameField, versioningField, locationField, renderName, renderVersioning, renderLocation })=>{
+    const { bucketName } = useBucketOverviewContext();
     const { data: versioningData, status: versioningStatus } = useGetBucketVersioning({
         Bucket: bucketName
     });
-    const { data: aclData, status: aclStatus } = useGetBucketAcl({
+    return /*#__PURE__*/ jsxs(Section, {
+        title: "General",
+        children: [
+            nameField ? /*#__PURE__*/ jsx(Field, {
+                label: "Name",
+                children: nameField
+            }) : renderName ? /*#__PURE__*/ jsx(Field, {
+                label: "Name",
+                children: renderName(bucketName)
+            }) : /*#__PURE__*/ jsx(Field, {
+                label: "Name",
+                value: /*#__PURE__*/ jsx(ConstrainedText, {
+                    text: bucketName,
+                    lineClamp: 2
+                })
+            }),
+            versioningField ? /*#__PURE__*/ jsx(Field, {
+                label: "Versioning",
+                children: versioningField
+            }) : renderVersioning ? /*#__PURE__*/ jsx(Field, {
+                label: "Versioning",
+                children: renderVersioning(bucketName)
+            }) : /*#__PURE__*/ jsx(Field, {
+                label: "Versioning",
+                loading: "pending" === versioningStatus,
+                error: "error" === versioningStatus,
+                value: versioningData?.Status === "Enabled" ? "Active" : "Inactive"
+            }),
+            locationField ? /*#__PURE__*/ jsx(Field, {
+                label: "Location",
+                children: locationField
+            }) : renderLocation ? /*#__PURE__*/ jsx(Field, {
+                label: "Location",
+                children: renderLocation(bucketName)
+            }) : /*#__PURE__*/ jsx(Field, {
+                label: "Location",
+                value: /*#__PURE__*/ jsx(BucketLocation, {
+                    bucketName: bucketName
+                })
+            })
+        ]
+    });
+};
+const DataProtectionSection = ({ objectLockField, defaultRetentionField, renderObjectLock, renderDefaultRetention })=>{
+    const { bucketName } = useBucketOverviewContext();
+    const { data: objectLockData, status: objectLockStatus, error: objectLockError } = useGetBucketObjectLockConfiguration({
         Bucket: bucketName
     });
-    const { data: corsData, status: corsStatus } = useGetBucketCors({
+    const isObjectLockNotConfigured = "error" === objectLockStatus && isNotFoundError(objectLockError);
+    const isObjectLockEnabled = objectLockData?.ObjectLockConfiguration?.ObjectLockEnabled === "Enabled";
+    return /*#__PURE__*/ jsxs(Section, {
+        title: "Data protection",
+        children: [
+            objectLockField ? /*#__PURE__*/ jsx(Field, {
+                label: "Object-lock",
+                children: objectLockField
+            }) : renderObjectLock ? /*#__PURE__*/ jsx(Field, {
+                label: "Object-lock",
+                children: renderObjectLock(bucketName)
+            }) : /*#__PURE__*/ jsx(Field, {
+                label: "Object-lock",
+                loading: "pending" === objectLockStatus,
+                error: "error" === objectLockStatus && !isObjectLockNotConfigured,
+                value: isObjectLockEnabled ? "Enabled" : "Disabled"
+            }),
+            !defaultRetentionField && !renderDefaultRetention && isObjectLockEnabled && /*#__PURE__*/ jsx(Field, {
+                label: "Default Retention",
+                loading: "pending" === objectLockStatus,
+                value: getDefaultBucketRetention(objectLockData),
+                actions: /*#__PURE__*/ jsx(EditRetentionButton, {
+                    bucketName: bucketName
+                })
+            }),
+            defaultRetentionField && /*#__PURE__*/ jsx(Field, {
+                label: "Default Retention",
+                children: defaultRetentionField
+            }),
+            renderDefaultRetention && /*#__PURE__*/ jsx(Field, {
+                label: "Default Retention",
+                children: renderDefaultRetention(bucketName)
+            })
+        ]
+    });
+};
+const PermissionsSection = ({ onEditPolicy, ownerField, aclField, corsField, publicField, bucketPolicyField, renderOwner, renderAcl, renderCors, renderPublic, renderBucketPolicy })=>{
+    const { bucketName } = useBucketOverviewContext();
+    const { getS3Config } = useDataBrowserContext();
+    const config = getS3Config();
+    const { data: aclData, status: aclStatus } = useGetBucketAcl({
         Bucket: bucketName
     });
-    const { data: objectLockData, status: objectLockStatus } = useGetBucketObjectLockConfiguration({
+    const { data: corsData, status: corsStatus } = useGetBucketCors({
         Bucket: bucketName
     });
     const { data: policyData, error: policyError, status: policyStatus } = useGetBucketPolicy({
         Bucket: bucketName
     });
-    return /*#__PURE__*/ jsxs(TableContainer, {
+    const isPublic = aclData?.Grants?.find((grant)=>grant.Grantee?.URI === (config.publicAclIndicator || "http://acs.amazonaws.com/groups/global/AllUsers"));
+    return /*#__PURE__*/ jsxs(Section, {
+        title: "Permissions",
         children: [
-            /*#__PURE__*/ jsxs(Box, {
-                display: "flex",
-                justifyContent: "flex-end",
-                paddingBottom: spacing.r16,
-                children: [
-                    renderEmptyButton ? renderEmptyButton(bucketName) : /*#__PURE__*/ jsx(Button, {
-                        icon: /*#__PURE__*/ jsx(Icon, {
-                            name: "Eraser"
-                        }),
-                        disabled: isEmptyBucketDisabled,
-                        variant: "danger",
-                        label: "Empty Bucket",
-                        onClick: onEmptyBucket,
-                        style: {
-                            marginRight: "1rem"
-                        }
-                    }),
-                    renderDeleteButton ? renderDeleteButton(bucketName) : /*#__PURE__*/ jsx(Button, {
-                        icon: /*#__PURE__*/ jsx(Icon, {
-                            name: "Delete"
-                        }),
-                        disabled: isDeleteBucketDisabled,
-                        variant: "danger",
-                        label: "Delete Bucket",
-                        onClick: onDeleteBucket
-                    })
-                ]
+            ownerField ? /*#__PURE__*/ jsx(Field, {
+                label: "Owner",
+                children: ownerField
+            }) : renderOwner ? /*#__PURE__*/ jsx(Field, {
+                label: "Owner",
+                children: renderOwner(bucketName)
+            }) : /*#__PURE__*/ jsx(Field, {
+                label: "Owner",
+                loading: "pending" === aclStatus,
+                error: "error" === aclStatus,
+                value: aclData?.Owner?.DisplayName || "N/A"
+            }),
+            aclField ? /*#__PURE__*/ jsx(Field, {
+                label: "ACL",
+                children: aclField
+            }) : renderAcl ? /*#__PURE__*/ jsx(Field, {
+                label: "ACL",
+                children: renderAcl(bucketName)
+            }) : /*#__PURE__*/ jsx(Field, {
+                label: "ACL",
+                loading: "pending" === aclStatus,
+                error: "error" === aclStatus,
+                value: aclData?.Grants?.length ? `${aclData.Grants.length} Grantee${1 !== aclData.Grants.length ? "s" : ""}` : "N/A"
             }),
-            /*#__PURE__*/ jsx(Table, {
-                children: /*#__PURE__*/ jsxs(Body, {
+            corsField ? /*#__PURE__*/ jsx(Field, {
+                label: "CORS",
+                children: corsField
+            }) : renderCors ? /*#__PURE__*/ jsx(Field, {
+                label: "CORS",
+                children: renderCors(bucketName)
+            }) : /*#__PURE__*/ jsx(Field, {
+                label: "CORS",
+                loading: "pending" === corsStatus,
+                value: corsData?.CORSRules && corsData.CORSRules.length > 0 ? "Yes" : "No"
+            }),
+            publicField ? /*#__PURE__*/ jsx(Field, {
+                label: "Public",
+                children: publicField
+            }) : renderPublic ? /*#__PURE__*/ jsx(Field, {
+                label: "Public",
+                children: renderPublic(bucketName)
+            }) : /*#__PURE__*/ jsx(Field, {
+                label: "Public",
+                loading: "pending" === aclStatus,
+                value: isPublic ? "Yes" : "No"
+            }),
+            bucketPolicyField ? /*#__PURE__*/ jsx(Field, {
+                label: "Bucket Policy",
+                children: bucketPolicyField
+            }) : renderBucketPolicy ? /*#__PURE__*/ jsx(Field, {
+                label: "Bucket Policy",
+                children: renderBucketPolicy(bucketName, onEditPolicy)
+            }) : /*#__PURE__*/ jsx(Field, {
+                label: "Bucket Policy",
+                error: "error" === policyStatus && policyError?.name !== "NoSuchBucketPolicy",
+                children: /*#__PURE__*/ jsxs(Box, {
+                    display: "flex",
+                    justifyContent: "space-between",
+                    alignItems: "center",
+                    gap: spacing.r8,
                     children: [
-                        /*#__PURE__*/ jsxs(Group, {
-                            children: [
-                                /*#__PURE__*/ jsx(GroupName, {
-                                    children: "General"
-                                }),
-                                /*#__PURE__*/ jsxs(GroupContent, {
-                                    children: [
-                                        /*#__PURE__*/ jsxs(Row, {
-                                            children: [
-                                                /*#__PURE__*/ jsx(Key, {
-                                                    children: "Name"
-                                                }),
-                                                /*#__PURE__*/ jsx(Value, {
-                                                    width: "15rem",
-                                                    children: /*#__PURE__*/ jsx(ConstrainedText, {
-                                                        text: bucketName,
-                                                        lineClamp: 2
-                                                    })
-                                                })
-                                            ]
-                                        }),
-                                        /*#__PURE__*/ jsxs(Row, {
-                                            children: [
-                                                /*#__PURE__*/ jsx(Key, {
-                                                    children: "Versioning"
-                                                }),
-                                                /*#__PURE__*/ jsx(Value, {
-                                                    children: "pending" === versioningStatus ? /*#__PURE__*/ jsx(Loader, {}) : "error" === versioningStatus ? "Error" : versioningData?.Status === "Enabled" ? "Active" : "Inactive"
-                                                })
-                                            ]
-                                        }),
-                                        /*#__PURE__*/ jsxs(Row, {
-                                            children: [
-                                                /*#__PURE__*/ jsx(Key, {
-                                                    children: "Location"
-                                                }),
-                                                /*#__PURE__*/ jsx(Value, {
-                                                    children: /*#__PURE__*/ jsx(BucketLocation, {
-                                                        bucketName: bucketName
-                                                    })
-                                                })
-                                            ]
-                                        })
-                                    ]
-                                })
-                            ]
-                        }),
-                        /*#__PURE__*/ jsxs(Group, {
-                            children: [
-                                /*#__PURE__*/ jsx(GroupName, {
-                                    children: "Data protection"
-                                }),
-                                /*#__PURE__*/ jsx(GroupContent, {
-                                    children: /*#__PURE__*/ jsxs(Row, {
-                                        children: [
-                                            /*#__PURE__*/ jsx(Key, {
-                                                children: "Object-lock"
-                                            }),
-                                            /*#__PURE__*/ jsx(Value, {
-                                                children: "pending" === objectLockStatus ? /*#__PURE__*/ jsx(Loader, {}) : "error" === objectLockStatus ? "Disabled" : objectLockData?.ObjectLockConfiguration?.ObjectLockEnabled === "Enabled" ? "Enabled" : "Disabled"
-                                            })
-                                        ]
-                                    })
-                                })
-                            ]
+                        /*#__PURE__*/ jsx("span", {
+                            children: policyData?.Policy ? "Configured" : "Not configured"
                         }),
-                        /*#__PURE__*/ jsxs(Group, {
-                            children: [
-                                /*#__PURE__*/ jsx(GroupName, {
-                                    children: "Permissions"
-                                }),
-                                /*#__PURE__*/ jsxs(GroupContent, {
-                                    children: [
-                                        /*#__PURE__*/ jsxs(Row, {
-                                            children: [
-                                                /*#__PURE__*/ jsx(Key, {
-                                                    children: "Owner"
-                                                }),
-                                                /*#__PURE__*/ jsx(Value, {
-                                                    children: "pending" === aclStatus ? /*#__PURE__*/ jsx(Loader, {}) : "error" === aclStatus ? "Error" : aclData?.Owner?.DisplayName || "N/A"
-                                                })
-                                            ]
-                                        }),
-                                        /*#__PURE__*/ jsxs(Row, {
-                                            children: [
-                                                /*#__PURE__*/ jsx(Key, {
-                                                    children: "ACL"
-                                                }),
-                                                /*#__PURE__*/ jsx(Value, {
-                                                    children: "pending" === aclStatus ? /*#__PURE__*/ jsx(Loader, {}) : "error" === aclStatus ? "Error" : aclData?.Grants?.length ? `${aclData.Grants.length} Grantee${1 !== aclData.Grants.length ? "s" : ""}` : "N/A"
-                                                })
-                                            ]
-                                        }),
-                                        /*#__PURE__*/ jsxs(Row, {
-                                            children: [
-                                                /*#__PURE__*/ jsx(Key, {
-                                                    children: "CORS"
-                                                }),
-                                                /*#__PURE__*/ jsx(Value, {
-                                                    children: "pending" === corsStatus ? /*#__PURE__*/ jsx(Loader, {}) : "error" === corsStatus ? "No" : corsData?.CORSRules && corsData.CORSRules.length > 0 ? "Yes" : "No"
-                                                })
-                                            ]
-                                        }),
-                                        /*#__PURE__*/ jsxs(Row, {
-                                            children: [
-                                                /*#__PURE__*/ jsx(Key, {
-                                                    children: "Public"
-                                                }),
-                                                /*#__PURE__*/ jsx(Value, {
-                                                    children: "pending" === aclStatus ? /*#__PURE__*/ jsx(Loader, {}) : "error" === aclStatus ? "No" : aclData?.Grants ? aclData.Grants.find((grant)=>grant.Grantee?.URI === (config.publicAclIndicator || "http://acs.amazonaws.com/groups/global/AllUsers")) ? "Yes" : "No" : "No"
-                                                })
-                                            ]
-                                        }),
-                                        /*#__PURE__*/ jsxs(Row, {
-                                            children: [
-                                                /*#__PURE__*/ jsx(Key, {
-                                                    children: "Bucket Policy"
-                                                }),
-                                                /*#__PURE__*/ jsx(Value, {
-                                                    children: "error" === policyStatus && policyError?.name !== "NoSuchBucketPolicy" ? "Error" : /*#__PURE__*/ jsxs(Box, {
-                                                        display: "flex",
-                                                        justifyContent: "space-between",
-                                                        alignItems: "center",
-                                                        gap: spacing.r8,
-                                                        children: [
-                                                            /*#__PURE__*/ jsx("span", {
-                                                                children: policyData?.Policy ? "Configured" : "Not configured"
-                                                            }),
-                                                            /*#__PURE__*/ jsx(BucketPolicyButton, {
-                                                                hasPolicy: !!policyData?.Policy,
-                                                                isLoading: "pending" === policyStatus,
-                                                                onEdit: ()=>onEditPolicy?.(bucketName)
-                                                            })
-                                                        ]
-                                                    })
-                                                })
-                                            ]
-                                        })
-                                    ]
-                                })
-                            ]
+                        /*#__PURE__*/ jsx(BucketPolicyButton, {
+                            hasPolicy: !!policyData?.Policy,
+                            isLoading: "pending" === policyStatus,
+                            onEdit: ()=>onEditPolicy?.(bucketName)
                         })
                     ]
                 })
@@ -206,4 +280,12 @@ const BucketOverview = ({ bucketName, onEmptyBucket, onDeleteBucket, onEditPolic
         ]
     });
 };
-export { BucketOverview };
+const BucketOverview = BucketOverviewRoot;
+BucketOverview.Actions = Actions;
+BucketOverview.Sections = Sections;
+BucketOverview.Section = Section;
+BucketOverview.Field = Field;
+BucketOverview.GeneralSection = GeneralSection;
+BucketOverview.DataProtectionSection = DataProtectionSection;
+BucketOverview.PermissionsSection = PermissionsSection;
+export { BucketOverview, Field as BucketOverviewField, Section as BucketOverviewSection };

package/dist/components/buckets/BucketPage.js

@@ -34,7 +34,7 @@ const BucketPage_BucketPage = ()=>{
             bucketStatus: "pending" === status ? "loading" : "error" === status ? "error" : "success",
             selectedBucketName: bucketName,
             onBucketSelect: (bucketName)=>navigate(`/buckets/${bucketName}`),
-            onCreateBucket: ()=>navigate("/create-bucket"),
+            onCreateBucket: ()=>navigate("/buckets/-/create"),
             onNavigateToBucket: (bucketName)=>navigate(`/buckets/${bucketName}/objects`),
             renderBucketLocation: (bucketName)=>/*#__PURE__*/ jsx(BucketLocation, {
                     bucketName: bucketName

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

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