@scality/data-browser-library 1.0.8 → 1.1.0

package/dist/components/buckets/BucketOverview.js

@@ -3,14 +3,13 @@ import { ConstrainedText, Icon, Loader, Stack, spacing } from "@scality/core-ui"
 import { Box, Button } from "@scality/core-ui/dist/next";
 import { createContext, memo, useContext, useMemo } from "react";
 import { useDataBrowserUICustomization } from "../../contexts/DataBrowserUICustomizationContext.js";
-import { useGetBucketAcl, useGetBucketCors, useGetBucketObjectLockConfiguration, useGetBucketPolicy, useGetBucketVersioning } from "../../hooks/index.js";
+import { useGetBucketAcl, useGetBucketCors, useGetBucketObjectLockConfiguration, useGetBucketPolicy, useGetBucketVersioning, useISVBucketStatus } from "../../hooks/index.js";
 import { isNotFoundError } from "../../utils/errorHandling.js";
 import { EditRetentionButton } from "../objects/ObjectLock/EditRetentionButton.js";
 import { useDataBrowserConfig } from "../providers/DataBrowserProvider.js";
 import { Body, Group, GroupContent, GroupName, GroupValues, Key, Row, Table, TableContainer, Value } from "../ui/Table.elements.js";
 import { BucketConfigEditButton } from "./BucketConfigEditButton.js";
 import { BucketLocation } from "./BucketLocation.js";
-const ERROR_NO_SUCH_BUCKET_POLICY = 'NoSuchBucketPolicy';
 const DEFAULT_PUBLIC_ACL_URI = 'http://acs.amazonaws.com/groups/global/AllUsers';
 const STATUS_PENDING = 'pending';
 const STATUS_ERROR = 'error';
@@ -155,12 +154,10 @@ const createAclField = (bucketName, aclData, aclStatus, aclField, renderAcl)=>{
         })
     };
 };
-const createCorsField = (bucketName, corsData, corsStatus, corsError, onEditCors, corsField, renderCors)=>{
+const createCorsField = (bucketName, corsData, corsStatus, corsError, onEditCors, corsField, renderCors, isISVManaged, isvApplication)=>{
     let defaultValue;
-    const ERROR_NO_SUCH_CORS = 'NoSuchCORSConfiguration';
-    if (corsStatus === STATUS_ERROR && corsError?.name !== ERROR_NO_SUCH_CORS) defaultValue = /*#__PURE__*/ jsx(ErrorField, {});
-    else {
-        const hasCors = !!(corsData?.CORSRules && corsData.CORSRules.length > 0);
+    if (corsStatus !== STATUS_ERROR || isNotFoundError(corsError)) {
+        const hasCors = !isNotFoundError(corsError) && !!(corsData?.CORSRules && corsData.CORSRules.length > 0);
         const handleEditCors = ()=>onEditCors?.(bucketName);
         defaultValue = /*#__PURE__*/ jsxs(Box, {
             display: "flex",
@@ -175,11 +172,13 @@ const createCorsField = (bucketName, corsData, corsStatus, corsError, onEditCors
                     hasConfig: hasCors,
                     isLoading: corsStatus === STATUS_PENDING,
                     onEdit: handleEditCors,
-                    configName: "bucket CORS"
+                    configName: "bucket CORS",
+                    disabled: isISVManaged,
+                    tooltipOverlay: isISVManaged ? `Edition is disabled as it is managed by ${isvApplication}.` : void 0
                 })
             ]
         });
-    }
+    } else defaultValue = /*#__PURE__*/ jsx(ErrorField, {});
     return {
         id: 'cors',
         label: 'CORS',
@@ -202,11 +201,10 @@ const createPublicField = (bucketName, aclStatus, isPublic, publicField, renderP
         })
     };
 };
-const createBucketPolicyField = (bucketName, policyData, policyStatus, policyError, onEditPolicy, bucketPolicyField, renderBucketPolicy)=>{
+const createBucketPolicyField = (bucketName, policyData, policyStatus, policyError, onEditPolicy, bucketPolicyField, renderBucketPolicy, isISVManaged, isvApplication)=>{
     let defaultValue;
-    if (policyStatus === STATUS_ERROR && policyError?.name !== ERROR_NO_SUCH_BUCKET_POLICY) defaultValue = /*#__PURE__*/ jsx(ErrorField, {});
-    else {
-        const hasPolicy = !!policyData?.Policy;
+    if (policyStatus !== STATUS_ERROR || isNotFoundError(policyError)) {
+        const hasPolicy = !isNotFoundError(policyError) && !!policyData?.Policy;
         const handleEditPolicy = ()=>onEditPolicy?.(bucketName);
         defaultValue = /*#__PURE__*/ jsxs(Box, {
             display: "flex",
@@ -221,11 +219,13 @@ const createBucketPolicyField = (bucketName, policyData, policyStatus, policyErr
                     hasConfig: hasPolicy,
                     isLoading: policyStatus === STATUS_PENDING,
                     onEdit: handleEditPolicy,
-                    configName: "bucket policy"
+                    configName: "bucket policy",
+                    disabled: isISVManaged,
+                    tooltipOverlay: isISVManaged ? `Edition is disabled as it is managed by ${isvApplication}.` : void 0
                 })
             ]
         });
-    }
+    } else defaultValue = /*#__PURE__*/ jsx(ErrorField, {});
     return {
         id: 'bucketPolicy',
         label: 'Bucket Policy',
@@ -424,6 +424,7 @@ const PermissionsSection = /*#__PURE__*/ memo(({ onEditPolicy, onEditCors, owner
     const { bucketName } = useBucketOverviewContext();
     const { extraBucketOverviewPermissions } = useDataBrowserUICustomization();
     const config = useDataBrowserConfig();
+    const { isISVManaged, isvApplication } = useISVBucketStatus(bucketName);
     const { data: aclData, status: aclStatus } = useGetBucketAcl({
         Bucket: bucketName
     });
@@ -441,9 +442,9 @@ const PermissionsSection = /*#__PURE__*/ memo(({ onEditPolicy, onEditCors, owner
         const defaultFields = {
             owner: createOwnerField(bucketName, aclData, aclStatus, ownerField, renderOwner),
             acl: createAclField(bucketName, aclData, aclStatus, aclField, renderAcl),
-            cors: createCorsField(bucketName, corsData, corsStatus, corsError, onEditCors, corsField, renderCors),
+            cors: createCorsField(bucketName, corsData, corsStatus, corsError, onEditCors, corsField, renderCors, isISVManaged, isvApplication),
             public: createPublicField(bucketName, aclStatus, isPublic, publicField, renderPublic),
-            bucketPolicy: createBucketPolicyField(bucketName, policyData, policyStatus, policyError, onEditPolicy, bucketPolicyField, renderBucketPolicy)
+            bucketPolicy: createBucketPolicyField(bucketName, policyData, policyStatus, policyError, onEditPolicy, bucketPolicyField, renderBucketPolicy, isISVManaged, isvApplication)
         };
         return mergeFieldsWithExtras(defaultFields, extraBucketOverviewPermissions, bucketName, [
             'owner',
@@ -475,7 +476,9 @@ const PermissionsSection = /*#__PURE__*/ memo(({ onEditPolicy, onEditCors, owner
         policyData,
         policyError,
         policyStatus,
-        isPublic
+        isPublic,
+        isISVManaged,
+        isvApplication
     ]);
     return /*#__PURE__*/ jsx(Section, {
         title: "Permissions",

package/dist/components/buckets/BucketPolicyPage.js

@@ -1,12 +1,13 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { Banner, Form, FormGroup, FormSection, Icon, Loader, Stack, Text, useToast } from "@scality/core-ui";
-import { Box, Button, CopyButton } from "@scality/core-ui/dist/next";
-import { useCallback, useMemo } from "react";
+import { Form, FormGroup, FormSection, Icon, Loader, Stack, Text, useToast } from "@scality/core-ui";
+import { Box, Button, CopyButton, Editor } from "@scality/core-ui/dist/next";
+import { useCallback, useEffect, useMemo } from "react";
 import { Controller } from "react-hook-form";
 import { useParams } from "react-router";
-import { useBucketConfigEditor, useGetBucketPolicy, useISVBucketStatus, useSetBucketPolicy } from "../../hooks/index.js";
+import { useBucketConfigEditor, useDeleteBucketPolicy, useGetBucketPolicy, useISVBucketStatus, useSetBucketPolicy } from "../../hooks/index.js";
+import { useDataBrowserNavigate } from "../../hooks/useDataBrowserNavigate.js";
 import bucketPolicySchema from "../../schemas/bucketPolicySchema.json";
-import { Editor } from "../Editor.js";
+import { isNotFoundError } from "../../utils/errorHandling.js";
 const getDefaultPolicyTemplate = (bucketName)=>`{
   "Version": "2012-10-17",
   "Statement": [
@@ -20,8 +21,12 @@ const getDefaultPolicyTemplate = (bucketName)=>`{
   ]
 }`;
 const validatePolicyConfig = (content)=>{
+    const trimmed = content.trim();
+    if ('' === trimmed) return {
+        isValid: true
+    };
     try {
-        JSON.parse(content);
+        JSON.parse(trimmed);
         return {
             isValid: true
         };
@@ -35,33 +40,65 @@ const validatePolicyConfig = (content)=>{
 const BucketPolicyPage = ()=>{
     const { bucketName } = useParams();
     const { showToast } = useToast();
-    const { isISVManaged, isvApplication, isLoading: isISVLoading } = useISVBucketStatus(bucketName);
+    const { isISVManaged, isLoading: isISVLoading } = useISVBucketStatus(bucketName);
+    const navigate = useDataBrowserNavigate();
+    useEffect(()=>{
+        if (isISVManaged) navigate(`/buckets/${bucketName}`, {
+            replace: true
+        });
+    }, [
+        isISVManaged,
+        bucketName,
+        navigate
+    ]);
+    const shouldFetchData = !isISVManaged && !isISVLoading;
     const { data: policyData, status: policyStatus, error: policyError } = useGetBucketPolicy({
         Bucket: bucketName
+    }, {
+        enabled: shouldFetchData
     });
     const initialContent = useMemo(()=>{
+        if (isNotFoundError(policyError)) return;
         if (policyData?.Policy) return policyData.Policy;
     }, [
-        policyData
+        policyData,
+        policyError
     ]);
-    const { form, content, isCreateMode, isValidFormat, handleBeforeMount, navigateToBucket } = useBucketConfigEditor({
+    const { form, content, isCreateMode, isValidFormat, jsonSchema, navigateToBucket, loadTemplate } = useBucketConfigEditor({
         bucketName: bucketName,
         initialContent,
         defaultTemplate: getDefaultPolicyTemplate(bucketName),
         isLoading: 'pending' === policyStatus,
-        notFoundErrorNames: [
-            'NoSuchBucketPolicy'
-        ],
         errorInstance: policyError,
         validate: validatePolicyConfig,
-        monacoSchema: bucketPolicySchema
+        jsonSchema: bucketPolicySchema
     });
     const { control, handleSubmit, setError, clearErrors, formState: { isDirty, errors } } = form;
     const { mutate: savePolicy, isPending: isSaving } = useSetBucketPolicy();
+    const { mutate: deletePolicy, isPending: isDeleting } = useDeleteBucketPolicy();
     const onSubmit = useCallback((data)=>{
         const result = validatePolicyConfig(data.content);
         if (!result.isValid) return;
-        const minifiedPolicy = JSON.stringify(JSON.parse(data.content));
+        const trimmed = data.content.trim();
+        if ('' === trimmed) return void deletePolicy({
+            Bucket: bucketName
+        }, {
+            onSuccess: ()=>{
+                showToast({
+                    open: true,
+                    message: 'Bucket policy deleted',
+                    status: 'success'
+                });
+                navigateToBucket();
+            },
+            onError: (error)=>{
+                setError('content', {
+                    type: 'server',
+                    message: error instanceof Error ? error.message : 'Failed to delete'
+                });
+            }
+        });
+        const minifiedPolicy = JSON.stringify(JSON.parse(trimmed));
         savePolicy({
             Bucket: bucketName,
             Policy: minifiedPolicy
@@ -84,12 +121,14 @@ const BucketPolicyPage = ()=>{
     }, [
         bucketName,
         savePolicy,
+        deletePolicy,
         navigateToBucket,
         showToast,
         setError
     ]);
-    const hasUnexpectedError = policyError && 'NoSuchBucketPolicy' !== policyError.name;
-    if ('pending' === policyStatus || isISVLoading) return /*#__PURE__*/ jsx(Loader, {
+    if (isISVManaged || isISVLoading) return null;
+    const hasUnexpectedError = policyError && !isNotFoundError(policyError);
+    if ('pending' === policyStatus) return /*#__PURE__*/ jsx(Loader, {
         centered: true,
         size: "massive",
         children: /*#__PURE__*/ jsx(Fragment, {
@@ -139,7 +178,7 @@ const BucketPolicyPage = ()=>{
                     label: "Cancel",
                     onClick: navigateToBucket,
                     type: "button",
-                    disabled: isSaving
+                    disabled: isSaving || isDeleting
                 }),
                 /*#__PURE__*/ jsx(Button, {
                     variant: "primary",
@@ -148,83 +187,80 @@ const BucketPolicyPage = ()=>{
                         name: "Save"
                     }),
                     type: "submit",
-                    disabled: !isDirty && !isCreateMode || isSaving || !isValidFormat
+                    disabled: !isDirty && !isCreateMode || isSaving || isDeleting || !isValidFormat
                 })
             ]
         }),
-        children: /*#__PURE__*/ jsxs(Fragment, {
+        children: /*#__PURE__*/ jsxs(FormSection, {
             children: [
-                isISVManaged && /*#__PURE__*/ jsx(Banner, {
-                    variant: "warning",
-                    icon: /*#__PURE__*/ jsx(Icon, {
-                        color: "statusWarning",
-                        name: "Exclamation-circle"
-                    }),
-                    children: /*#__PURE__*/ jsxs(Text, {
-                        children: [
-                            /*#__PURE__*/ jsx("strong", {
-                                children: "Warning:"
-                            }),
-                            " This bucket is managed by ",
-                            isvApplication,
-                            ". Adding a Bucket Policy may conflict with IAM policies created by ",
-                            isvApplication,
-                            ", potentially disrupting ",
-                            isvApplication,
-                            " operations (e.g., backup cleanup). Ensure your Bucket Policy does not deny actions that ",
-                            isvApplication,
-                            " requires."
-                        ]
+                /*#__PURE__*/ jsx(FormGroup, {
+                    id: "bucketName",
+                    label: "Bucket Name",
+                    required: true,
+                    direction: "horizontal",
+                    content: /*#__PURE__*/ jsx(Text, {
+                        children: bucketName
                     })
                 }),
-                /*#__PURE__*/ jsxs(FormSection, {
-                    children: [
-                        /*#__PURE__*/ jsx(FormGroup, {
-                            id: "bucketName",
-                            label: "Bucket Name",
-                            required: true,
-                            direction: "horizontal",
-                            content: /*#__PURE__*/ jsx(Text, {
-                                children: bucketName
-                            })
-                        }),
-                        /*#__PURE__*/ jsx(FormGroup, {
-                            id: "policyDocument",
-                            label: "Policy Document",
-                            required: true,
-                            direction: "vertical",
-                            help: "AWS Bucket policy standards are supported.",
-                            helpErrorPosition: "bottom",
-                            error: errors.content?.message,
-                            content: /*#__PURE__*/ jsxs(Stack, {
+                /*#__PURE__*/ jsx(FormGroup, {
+                    id: "policyDocument",
+                    label: "Policy Document",
+                    required: true,
+                    direction: "vertical",
+                    help: "AWS Bucket policy standards are supported.",
+                    helpErrorPosition: "bottom",
+                    error: errors.content?.message,
+                    content: /*#__PURE__*/ jsxs(Stack, {
+                        direction: "horizontal",
+                        gap: "r16",
+                        style: {
+                            alignItems: 'flex-start'
+                        },
+                        children: [
+                            /*#__PURE__*/ jsx(Controller, {
+                                control: control,
+                                name: "content",
+                                render: ({ field: { onChange, value } })=>/*#__PURE__*/ jsx(Editor, {
+                                        value: value,
+                                        onChange: (newValue)=>{
+                                            onChange(newValue);
+                                            if (errors.content) clearErrors('content');
+                                        },
+                                        language: jsonSchema ? {
+                                            name: 'json',
+                                            schema: jsonSchema
+                                        } : 'json',
+                                        height: "60vh",
+                                        width: "32rem"
+                                    })
+                            }),
+                            /*#__PURE__*/ jsxs(Stack, {
+                                direction: "vertical",
+                                gap: "r8",
                                 children: [
-                                    /*#__PURE__*/ jsx(Controller, {
-                                        control: control,
-                                        name: "content",
-                                        render: ({ field: { onChange, value } })=>/*#__PURE__*/ jsx(Editor, {
-                                                value: value,
-                                                onChange: (newValue)=>{
-                                                    onChange(newValue);
-                                                    if (errors.content) clearErrors('content');
-                                                },
-                                                language: "json",
-                                                height: "60vh",
-                                                width: "33rem",
-                                                beforeMount: handleBeforeMount
-                                            })
+                                    /*#__PURE__*/ jsx(CopyButton, {
+                                        textToCopy: content,
+                                        label: "Policy",
+                                        variant: "outline"
                                     }),
-                                    /*#__PURE__*/ jsx(Box, {
-                                        alignSelf: "baseline",
-                                        children: /*#__PURE__*/ jsx(CopyButton, {
-                                            textToCopy: content,
-                                            label: "Policy",
-                                            variant: "outline"
-                                        })
+                                    isCreateMode && !content && /*#__PURE__*/ jsx(Text, {
+                                        variant: "Smaller",
+                                        color: "textSecondary",
+                                        children: "Empty bucket policy"
+                                    }),
+                                    isCreateMode && !content && /*#__PURE__*/ jsx(Button, {
+                                        variant: "outline",
+                                        label: "Load a template",
+                                        onClick: loadTemplate,
+                                        type: "button",
+                                        style: {
+                                            minWidth: '10rem'
+                                        }
                                     })
                                 ]
                             })
-                        })
-                    ]
+                        ]
+                    })
                 })
             ]
         })

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

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