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

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

@@ -0,0 +1,50 @@
+import type { ObjectLockRetentionMode } from '@aws-sdk/client-s3';
+import Joi from 'joi';
+export declare const bucketErrorMessage = "Bucket names can include only lowercase letters, numbers, dots (.), and hyphens (-)";
+export declare const bucketNameValidationSchema: Joi.StringSchema<string>;
+export declare const baseBucketCreateSchema: Joi.ObjectSchema<any>;
+export type BucketCreateFormData = {
+    name: string;
+    isVersioning: boolean;
+    isEncryptionEnabled: boolean;
+    isObjectLockEnabled: boolean;
+    isDefaultRetentionEnabled: boolean;
+    retentionMode: ObjectLockRetentionMode;
+    retentionPeriod: number;
+    retentionPeriodFrequencyChoice: string;
+    [key: string]: unknown;
+};
+type BucketCreateProps = {
+    subTitle?: string;
+    /**
+     * Custom validation schema - if not provided, uses baseBucketCreateSchema
+     *
+     * To enable uniqueness validation, provide context with existing bucket names:
+     * ```ts
+     * const schema = baseBucketCreateSchema.append({...});
+     * <BucketCreate
+     *   validationSchema={schema}
+     *   validationContext={{ existingBuckets: ['bucket1', 'bucket2'] }}
+     * />
+     * ```
+     */
+    validationSchema?: Joi.ObjectSchema;
+    /**
+     * Validation context passed to Joi schema
+     * Use this to provide existing bucket names for uniqueness validation
+     */
+    validationContext?: {
+        existingBuckets?: string[];
+        [key: string]: unknown;
+    };
+    /** Default form values - merged with base defaults */
+    defaultValues?: Partial<BucketCreateFormData>;
+    /** Children rendered between bucket name and versioning sections */
+    children?: React.ReactNode;
+    /** Callback when form is submitted with valid data */
+    onSubmit?: (data: BucketCreateFormData) => void;
+    /** Callback when cancel is clicked */
+    onCancel?: () => void;
+};
+export declare const BucketCreate: ({ subTitle, validationSchema, validationContext, defaultValues: customDefaultValues, children, onSubmit: onSubmitProp, onCancel: onCancelProp, }: BucketCreateProps) => import("react/jsx-runtime").JSX.Element;
+export default BucketCreate;

package/dist/components/buckets/BucketCreate.js

@@ -0,0 +1,279 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { joiResolver } from "@hookform/resolvers/joi";
+import { Checkbox, Form, FormGroup, FormSection, Stack, useToast } from "@scality/core-ui";
+import { Button, Input } from "@scality/core-ui/dist/next";
+import { convertRemToPixels } from "@scality/core-ui/dist/utils";
+import joi from "joi";
+import { FormProvider, useForm } from "react-hook-form";
+import { useCreateBucket, useSetBucketEncryption, useSetBucketObjectLockConfiguration, useSetBucketVersioning } from "../../hooks/index.js";
+import { useDataBrowserNavigate } from "../../hooks/useDataBrowserNavigate.js";
+import ObjectLockRetentionSettings from "../objects/ObjectLock/ObjectLockRetentionSettings.js";
+import { objectLockRetentionSettingsValidationRules } from "../objects/ObjectLock/ObjectLockSettings.js";
+import { useDataBrowserConfig } from "../providers/DataBrowserProvider.js";
+const bucketErrorMessage = 'Bucket names can include only lowercase letters, numbers, dots (.), and hyphens (-)';
+const bucketNameValidationSchema = joi.string().label('Bucket Name').required().min(3).max(63).pattern(/^[a-z0-9]([a-z0-9.-]*[a-z0-9])?$/, {
+    name: 'bucketName',
+    invert: false
+}).messages({
+    'string.pattern.name': bucketErrorMessage
+}).custom((value, helpers)=>{
+    if (value.includes('..')) return helpers.message({
+        custom: 'Bucket names cannot contain two adjacent periods'
+    });
+    if (/^(\d{1,3}\.){3}\d{1,3}$/.test(value)) return helpers.message({
+        custom: 'Bucket names must not be formatted as an IP address'
+    });
+    const forbiddenPrefixes = [
+        'xn--',
+        'sthree-',
+        'amzn-s3-demo-'
+    ];
+    if (forbiddenPrefixes.some((prefix)=>value.startsWith(prefix))) return helpers.message({
+        custom: `Bucket names must not start with ${forbiddenPrefixes.join(', ')}`
+    });
+    const forbiddenSuffixes = [
+        '-s3alias',
+        '--ol-s3',
+        '--x-s3',
+        '.mrap'
+    ];
+    if (forbiddenSuffixes.some((suffix)=>value.endsWith(suffix))) return helpers.message({
+        custom: `Bucket names must not end with ${forbiddenSuffixes.join(', ')}`
+    });
+    const existingBuckets = helpers.prefs.context?.existingBuckets;
+    if (Array.isArray(existingBuckets)) {
+        const isDuplicate = existingBuckets.some((bucketName)=>bucketName.toLowerCase() === value.toLowerCase());
+        if (isDuplicate) return helpers.message({
+            custom: 'A bucket with this name already exists'
+        });
+    }
+    return value;
+}, 'AWS S3 bucket naming rules');
+const baseBucketCreateSchema = joi.object({
+    name: bucketNameValidationSchema,
+    isVersioning: joi.boolean(),
+    isEncryptionEnabled: joi.boolean(),
+    ...objectLockRetentionSettingsValidationRules
+});
+const BucketCreate = ({ subTitle, validationSchema, validationContext, defaultValues: customDefaultValues, children, onSubmit: onSubmitProp, onCancel: onCancelProp })=>{
+    const navigate = useDataBrowserNavigate();
+    const { showToast } = useToast();
+    const baseDefaultValues = {
+        name: '',
+        isVersioning: false,
+        isEncryptionEnabled: false,
+        isObjectLockEnabled: false,
+        isDefaultRetentionEnabled: false,
+        retentionMode: 'GOVERNANCE',
+        retentionPeriod: 1,
+        retentionPeriodFrequencyChoice: 'DAYS',
+        ...customDefaultValues
+    };
+    const useFormMethods = useForm({
+        mode: 'all',
+        resolver: joiResolver(validationSchema || baseBucketCreateSchema, {
+            context: validationContext || {}
+        }),
+        defaultValues: baseDefaultValues,
+        context: validationContext
+    });
+    const { register, handleSubmit, formState, watch } = useFormMethods;
+    const { isValid, errors } = formState;
+    const isObjectLockEnabled = watch('isObjectLockEnabled');
+    const { s3Capabilities } = useDataBrowserConfig();
+    const { mutate: createBucket, isPending: isCreatingBucket } = useCreateBucket();
+    const { mutate: setBucketVersioning } = useSetBucketVersioning();
+    const { mutate: setObjectLockConfig } = useSetBucketObjectLockConfiguration();
+    const { mutate: setBucketEncryption } = useSetBucketEncryption();
+    const handleCancel = ()=>{
+        if (onCancelProp) onCancelProp();
+        else navigate('/buckets');
+    };
+    const handleSuccess = (bucketName)=>{
+        showToast({
+            open: true,
+            message: `Bucket "${bucketName}" created successfully`,
+            status: 'success'
+        });
+        navigate(`/buckets/${bucketName}`);
+    };
+    const handleError = (error, operation)=>{
+        showToast({
+            open: true,
+            message: error instanceof Error ? error.message : `Failed to ${operation}`,
+            status: 'error'
+        });
+    };
+    const onSubmit = (data)=>{
+        if (onSubmitProp) return void onSubmitProp(data);
+        const bucketName = data.name;
+        const needsExplicitVersioning = data.isVersioning && !data.isObjectLockEnabled;
+        const needsRetentionConfig = data.isObjectLockEnabled && data.isDefaultRetentionEnabled;
+        const needsEncryption = data.isEncryptionEnabled;
+        createBucket({
+            Bucket: bucketName,
+            ObjectLockEnabledForBucket: data.isObjectLockEnabled || void 0
+        }, {
+            onSuccess: ()=>{
+                if (needsExplicitVersioning) setBucketVersioning({
+                    Bucket: bucketName,
+                    VersioningConfiguration: {
+                        Status: 'Enabled'
+                    }
+                }, {
+                    onSuccess: ()=>{
+                        if (needsEncryption) applyEncryption(bucketName);
+                        else handleSuccess(bucketName);
+                    },
+                    onError: (error)=>handleError(error, 'enable versioning')
+                });
+                else if (needsRetentionConfig) {
+                    const retentionConfig = {
+                        Bucket: bucketName,
+                        ObjectLockConfiguration: {
+                            ObjectLockEnabled: 'Enabled',
+                            Rule: {
+                                DefaultRetention: {
+                                    Mode: data.retentionMode,
+                                    Days: 'DAYS' === data.retentionPeriodFrequencyChoice ? data.retentionPeriod : void 0,
+                                    Years: 'YEARS' === data.retentionPeriodFrequencyChoice ? data.retentionPeriod : void 0
+                                }
+                            }
+                        }
+                    };
+                    setObjectLockConfig(retentionConfig, {
+                        onSuccess: ()=>{
+                            if (needsEncryption) applyEncryption(bucketName);
+                            else handleSuccess(bucketName);
+                        },
+                        onError: (error)=>handleError(error, 'configure object lock retention')
+                    });
+                } else if (needsEncryption) applyEncryption(bucketName);
+                else handleSuccess(bucketName);
+            },
+            onError: (error)=>handleError(error, 'create bucket')
+        });
+    };
+    const applyEncryption = (bucketName)=>{
+        setBucketEncryption({
+            Bucket: bucketName,
+            ServerSideEncryptionConfiguration: {
+                Rules: [
+                    {
+                        ApplyServerSideEncryptionByDefault: {
+                            SSEAlgorithm: 'AES256'
+                        }
+                    }
+                ]
+            }
+        }, {
+            onSuccess: ()=>handleSuccess(bucketName),
+            onError: (error)=>handleError(error, 'enable bucket encryption')
+        });
+    };
+    return /*#__PURE__*/ jsx(FormProvider, {
+        ...useFormMethods,
+        children: /*#__PURE__*/ jsxs(Form, {
+            layout: {
+                kind: 'page',
+                title: 'Create a New Bucket',
+                subTitle
+            },
+            requireMode: "partial",
+            onSubmit: handleSubmit(onSubmit),
+            rightActions: /*#__PURE__*/ jsxs(Stack, {
+                gap: "r16",
+                children: [
+                    /*#__PURE__*/ jsx(Button, {
+                        id: "cancel-btn",
+                        variant: "outline",
+                        onClick: handleCancel,
+                        type: "button",
+                        label: "Cancel"
+                    }),
+                    /*#__PURE__*/ jsx(Button, {
+                        disabled: !isValid,
+                        isLoading: isCreatingBucket,
+                        id: "create-bucket-btn",
+                        type: "submit",
+                        variant: "primary",
+                        label: "Create"
+                    })
+                ]
+            }),
+            children: [
+                /*#__PURE__*/ jsx(FormSection, {
+                    forceLabelWidth: convertRemToPixels(17.5),
+                    children: /*#__PURE__*/ jsxs(Stack, {
+                        direction: "vertical",
+                        gap: "r16",
+                        children: [
+                            /*#__PURE__*/ jsx(FormGroup, {
+                                id: "name",
+                                label: "Bucket Name",
+                                required: true,
+                                direction: "horizontal",
+                                content: /*#__PURE__*/ jsx(Input, {
+                                    id: "name",
+                                    autoFocus: true,
+                                    ...register('name')
+                                }),
+                                labelHelpTooltip: /*#__PURE__*/ jsxs("ul", {
+                                    children: [
+                                        /*#__PURE__*/ jsx("li", {
+                                            children: "Must be unique"
+                                        }),
+                                        /*#__PURE__*/ jsx("li", {
+                                            children: "Cannot be modified after creation"
+                                        }),
+                                        /*#__PURE__*/ jsx("li", {
+                                            children: bucketErrorMessage
+                                        })
+                                    ]
+                                }),
+                                helpErrorPosition: "bottom",
+                                error: errors.name ? errors.name?.type === 'string.pattern.base' ? bucketErrorMessage : errors.name?.message : void 0
+                            }),
+                            children,
+                            s3Capabilities?.bucketEncryption && /*#__PURE__*/ jsx(FormGroup, {
+                                id: "isEncryptionEnabled",
+                                label: "Encryption",
+                                labelHelpTooltip: "Objects stored in this bucket will be automatically encrypted.",
+                                helpErrorPosition: "bottom",
+                                content: /*#__PURE__*/ jsx(Checkbox, {
+                                    id: "isEncryptionEnabled",
+                                    ...register('isEncryptionEnabled')
+                                })
+                            }),
+                            /*#__PURE__*/ jsx(FormGroup, {
+                                id: "isVersioning",
+                                label: "Versioning",
+                                disabled: isObjectLockEnabled,
+                                labelHelpTooltip: /*#__PURE__*/ jsxs("ul", {
+                                    children: [
+                                        /*#__PURE__*/ jsx("li", {
+                                            children: "Versioning keeps multiple versions of each objects in your bucket. You can restore deleted or overwritten objects as a result of unintended user actions or application failures."
+                                        }),
+                                        /*#__PURE__*/ jsx("li", {
+                                            children: "It's possible to enable and suspend versioning at the bucket level after the bucket creation."
+                                        })
+                                    ]
+                                }),
+                                help: isObjectLockEnabled ? 'Automatically activated when Object-lock is Enabled' : void 0,
+                                helpErrorPosition: "bottom",
+                                content: /*#__PURE__*/ jsx(Checkbox, {
+                                    id: "isVersioning",
+                                    disabled: isObjectLockEnabled,
+                                    ...register('isVersioning')
+                                })
+                            })
+                        ]
+                    })
+                }),
+                /*#__PURE__*/ jsx(ObjectLockRetentionSettings, {})
+            ]
+        })
+    });
+};
+const buckets_BucketCreate = BucketCreate;
+export { BucketCreate, baseBucketCreateSchema, bucketErrorMessage, bucketNameValidationSchema, buckets_BucketCreate as default };

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

@@ -1 +1,43 @@
+import { useDataBrowserNavigate } from '../../hooks/useDataBrowserNavigate';
+interface BucketDetailsContextValue {
+    bucketName: string;
+    navigate: ReturnType<typeof useDataBrowserNavigate>;
+}
+/**
+ * Context for BucketDetails component.
+ *
+ * **Important**: Always use `useBucketDetailsContext()` hook instead of accessing this context directly.
+ * The hook provides proper error handling if the context is not available.
+ *
+ * This context is exported for testing purposes only.
+ */
+export declare const BucketDetailsContext: import("react").Context<BucketDetailsContextValue | null>;
+export declare function useBucketDetailsContext(): BucketDetailsContextValue;
+declare const OverviewTab: React.FC;
+declare const LifecycleTab: React.FC;
+declare const ReplicationTab: React.FC;
+declare const NotificationTab: React.FC;
+interface CustomTabProps {
+    config: {
+        id: string;
+        title: string;
+        path?: string;
+        withoutPadding?: boolean;
+        render: () => React.ReactNode;
+    };
+}
+declare const CustomTab: React.FC<CustomTabProps>;
+interface BucketDetailsProps {
+    children?: React.ReactNode;
+}
+declare const BucketDetailsRoot: React.FC<BucketDetailsProps>;
 export declare function BucketDetails(): import("react/jsx-runtime").JSX.Element;
+type BucketDetailsComponent = typeof BucketDetailsRoot & {
+    OverviewTab: typeof OverviewTab;
+    LifecycleTab: typeof LifecycleTab;
+    ReplicationTab: typeof ReplicationTab;
+    NotificationTab: typeof NotificationTab;
+    CustomTab: typeof CustomTab;
+};
+declare const BucketDetailsCompound: BucketDetailsComponent;
+export { BucketDetailsCompound };