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

package/dist/components/buckets/BucketLifecycleFormPage.js

@@ -0,0 +1,1086 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { joiResolver } from "@hookform/resolvers/joi";
+import { Form, FormGroup, FormSection, Icon, Loader, Stack, Text, Toggle, spacing, useToast } from "@scality/core-ui";
+import { convertRemToPixels } from "@scality/core-ui/dist/components/tablev2/TableUtils";
+import { Box, Button, Input, Select } from "@scality/core-ui/dist/next";
+import joi from "joi";
+import { useCallback, useEffect, useMemo, useRef } from "react";
+import { Controller, FormProvider, useFieldArray, useForm } from "react-hook-form";
+import { useParams } from "react-router";
+import { useGetBucketLifecycle, useSetBucketLifecycle } from "../../hooks/bucketConfiguration.js";
+import { useDataBrowserNavigate } from "../../hooks/useDataBrowserNavigate.js";
+import { AWS_RULE_LIMITS, STATUS_OPTIONS, buildS3Filter } from "../../utils/s3RuleUtils.js";
+import { ArrayFieldActions } from "../ui/ArrayFieldActions.js";
+import { FilterFormSection, createFilterValidationSchema } from "../ui/FilterFormSection.js";
+const storageClassOptions = [
+    {
+        value: 'GLACIER',
+        label: 'Glacier'
+    },
+    {
+        value: 'DEEP_ARCHIVE',
+        label: 'Glacier Deep Archive'
+    },
+    {
+        value: 'STANDARD_IA',
+        label: 'Standard-IA'
+    },
+    {
+        value: 'ONEZONE_IA',
+        label: 'One Zone-IA'
+    },
+    {
+        value: 'INTELLIGENT_TIERING',
+        label: 'Intelligent-Tiering'
+    },
+    {
+        value: 'GLACIER_IR',
+        label: 'Glacier Instant Retrieval'
+    }
+];
+const STORAGE_CLASS_MIN_DAYS = {
+    GLACIER_IR: 0,
+    STANDARD_IA: 30,
+    ONEZONE_IA: 30,
+    INTELLIGENT_TIERING: 30,
+    GLACIER: 90,
+    DEEP_ARCHIVE: 180
+};
+const LIFECYCLE_LIMITS = {
+    NONCURRENT_TRANSITION_MIN_DAYS: 30,
+    ABORT_MPU_MIN_DAYS: 1
+};
+const schema = joi.object({
+    ruleId: joi.string().required().max(AWS_RULE_LIMITS.RULE_ID_MAX_LENGTH).messages({
+        'string.empty': 'Rule ID is required',
+        'string.max': `Rule ID must not exceed ${AWS_RULE_LIMITS.RULE_ID_MAX_LENGTH} characters`
+    }),
+    status: joi.string().valid(...STATUS_OPTIONS.map((o)=>o.value)).required(),
+    ...createFilterValidationSchema(joi),
+    transitionsEnabled: joi.boolean(),
+    transitions: joi.when('transitionsEnabled', {
+        is: true,
+        then: joi.array().items(joi.object({
+            timeType: joi.string().valid('days', 'date').required(),
+            days: joi.when('timeType', {
+                is: 'days',
+                then: joi.number().integer().min(0).required().messages({
+                    'number.base': 'Days must be a number',
+                    'number.min': 'Days must be at least 0'
+                }),
+                otherwise: joi.any()
+            }),
+            date: joi.when('timeType', {
+                is: 'date',
+                then: joi.string().required().messages({
+                    'string.empty': 'Date is required'
+                }),
+                otherwise: joi.any()
+            }),
+            storageClass: joi.string().valid(...storageClassOptions.map((o)=>o.value)).required().messages({
+                'string.empty': 'Storage class is required'
+            })
+        }).custom((value, helpers)=>{
+            if ('days' === value.timeType && value.storageClass && value.days < STORAGE_CLASS_MIN_DAYS[value.storageClass]) return helpers.error('any.custom', {
+                message: `${value.storageClass} requires at least ${STORAGE_CLASS_MIN_DAYS[value.storageClass]} days`
+            });
+            return value;
+        })).min(1).messages({
+            'array.min': 'At least one transition is required when enabled'
+        }),
+        otherwise: joi.any()
+    }),
+    expirationEnabled: joi.boolean(),
+    expirationType: joi.when('expirationEnabled', {
+        is: true,
+        then: joi.string().valid('days', 'date').required(),
+        otherwise: joi.any()
+    }),
+    expirationDays: joi.when('expirationType', {
+        is: 'days',
+        then: joi.number().integer().min(1).required().messages({
+            'number.base': 'Days must be a number',
+            'number.min': 'Days must be at least 1'
+        }),
+        otherwise: joi.any()
+    }),
+    expirationDate: joi.when('expirationType', {
+        is: 'date',
+        then: joi.string().required().messages({
+            'string.empty': 'Date is required'
+        }),
+        otherwise: joi.any()
+    }),
+    expiredObjectDeleteMarker: joi.boolean(),
+    noncurrentTransitionsEnabled: joi.boolean(),
+    noncurrentTransitions: joi.when('noncurrentTransitionsEnabled', {
+        is: true,
+        then: joi.array().items(joi.object({
+            noncurrentDays: joi.number().integer().min(LIFECYCLE_LIMITS.NONCURRENT_TRANSITION_MIN_DAYS).required().messages({
+                'number.base': 'Noncurrent days must be a number',
+                'number.min': `Noncurrent days must be at least ${LIFECYCLE_LIMITS.NONCURRENT_TRANSITION_MIN_DAYS}`
+            }),
+            storageClass: joi.string().valid(...storageClassOptions.map((o)=>o.value)).required().messages({
+                'string.empty': 'Storage class is required'
+            }),
+            newerNoncurrentVersions: joi.number().integer().min(0).optional().allow(null, '')
+        })).min(1).messages({
+            'array.min': 'At least one noncurrent transition is required when enabled'
+        }),
+        otherwise: joi.any()
+    }),
+    noncurrentExpirationEnabled: joi.boolean(),
+    noncurrentExpirationDays: joi.when('noncurrentExpirationEnabled', {
+        is: true,
+        then: joi.number().integer().min(1).required().messages({
+            'number.base': 'Noncurrent days must be a number',
+            'number.min': 'Noncurrent days must be at least 1'
+        }),
+        otherwise: joi.any()
+    }),
+    noncurrentNewerVersions: joi.number().integer().min(0).optional().allow(null, ''),
+    abortMpuEnabled: joi.boolean(),
+    abortMpuDays: joi.when('abortMpuEnabled', {
+        is: true,
+        then: joi.number().integer().min(LIFECYCLE_LIMITS.ABORT_MPU_MIN_DAYS).required().messages({
+            'number.base': 'Days must be a number',
+            'number.min': `Days must be at least ${LIFECYCLE_LIMITS.ABORT_MPU_MIN_DAYS}`
+        }),
+        otherwise: joi.any()
+    })
+}).custom((value, helpers)=>{
+    const hasAtLeastOneAction = value.transitionsEnabled || value.expirationEnabled || value.expiredObjectDeleteMarker || value.noncurrentTransitionsEnabled || value.noncurrentExpirationEnabled || value.abortMpuEnabled;
+    if (!hasAtLeastOneAction) return helpers.error('any.custom', {
+        message: 'At least one lifecycle action must be enabled (transition, expiration, or abort multipart upload)'
+    });
+    if (value.expirationEnabled && value.expiredObjectDeleteMarker) return helpers.error('any.custom', {
+        message: 'Expired delete markers removal cannot be combined with Days/Date expiration on the same rule'
+    });
+    if (('tags' === value.filterType || 'and' === value.filterType) && value.abortMpuEnabled) return helpers.error('any.custom', {
+        message: 'Tag-based filter cannot be used with Abort Incomplete Multipart Upload'
+    });
+    return value;
+});
+const getArrayFieldError = (errors, fieldName, index, propertyName)=>{
+    const fieldErrors = errors?.[fieldName];
+    if (!fieldErrors?.[index]) return;
+    if (propertyName) return fieldErrors[index]?.[propertyName]?.message;
+    return fieldErrors[index]?.message;
+};
+const ruleToFormValues = (rule)=>{
+    const formValues = {
+        ruleId: rule.ID || '',
+        status: rule.Status || 'Enabled',
+        filterType: 'none',
+        prefix: '',
+        tags: [],
+        transitionsEnabled: false,
+        transitions: [],
+        expirationEnabled: false,
+        expirationType: 'days',
+        expirationDays: 30,
+        expirationDate: '',
+        expiredObjectDeleteMarker: false,
+        noncurrentTransitionsEnabled: false,
+        noncurrentTransitions: [],
+        noncurrentExpirationEnabled: false,
+        noncurrentExpirationDays: 30,
+        noncurrentNewerVersions: 0,
+        abortMpuEnabled: false,
+        abortMpuDays: 7
+    };
+    if (void 0 !== rule.Prefix && '' !== rule.Prefix) {
+        formValues.filterType = 'prefix';
+        formValues.prefix = rule.Prefix;
+    } else if (rule.Filter) {
+        if (rule.Filter.And) {
+            formValues.filterType = 'and';
+            formValues.prefix = rule.Filter.And.Prefix || '';
+            formValues.tags = rule.Filter.And.Tags?.map((tag)=>({
+                    key: tag.Key || '',
+                    value: tag.Value || ''
+                })) || [];
+        } else if (void 0 !== rule.Filter.Prefix) {
+            formValues.filterType = 'prefix';
+            formValues.prefix = rule.Filter.Prefix;
+        } else if (rule.Filter.Tag) {
+            formValues.filterType = 'tags';
+            formValues.tags = [
+                {
+                    key: rule.Filter.Tag.Key || '',
+                    value: rule.Filter.Tag.Value || ''
+                }
+            ];
+        }
+    }
+    if (rule.Transitions && rule.Transitions.length > 0) {
+        formValues.transitionsEnabled = true;
+        formValues.transitions = rule.Transitions.map((t)=>({
+                timeType: void 0 !== t.Days ? 'days' : 'date',
+                days: t.Days || 30,
+                date: t.Date ? new Date(t.Date).toISOString().split('T')[0] : '',
+                storageClass: t.StorageClass || 'GLACIER'
+            }));
+    }
+    if (rule.Expiration) {
+        if (rule.Expiration.Days) {
+            formValues.expirationEnabled = true;
+            formValues.expirationType = 'days';
+            formValues.expirationDays = rule.Expiration.Days;
+        } else if (rule.Expiration.Date) {
+            formValues.expirationEnabled = true;
+            formValues.expirationType = 'date';
+            formValues.expirationDate = new Date(rule.Expiration.Date).toISOString().split('T')[0];
+        }
+        if (rule.Expiration.ExpiredObjectDeleteMarker) formValues.expiredObjectDeleteMarker = true;
+    }
+    if (rule.NoncurrentVersionTransitions && rule.NoncurrentVersionTransitions.length > 0) {
+        formValues.noncurrentTransitionsEnabled = true;
+        formValues.noncurrentTransitions = rule.NoncurrentVersionTransitions.map((t)=>({
+                noncurrentDays: t.NoncurrentDays || 30,
+                storageClass: t.StorageClass || 'GLACIER',
+                newerNoncurrentVersions: t.NewerNoncurrentVersions || 0
+            }));
+    }
+    if (rule.NoncurrentVersionExpiration) {
+        formValues.noncurrentExpirationEnabled = true;
+        formValues.noncurrentExpirationDays = rule.NoncurrentVersionExpiration.NoncurrentDays || 30;
+        formValues.noncurrentNewerVersions = rule.NoncurrentVersionExpiration.NewerNoncurrentVersions || 0;
+    }
+    if (rule.AbortIncompleteMultipartUpload) {
+        formValues.abortMpuEnabled = true;
+        formValues.abortMpuDays = rule.AbortIncompleteMultipartUpload.DaysAfterInitiation || 7;
+    }
+    return formValues;
+};
+const generateStorageClassHelpText = ()=>{
+    const hints = [];
+    storageClassOptions.forEach((option)=>{
+        const minDays = STORAGE_CLASS_MIN_DAYS[option.value];
+        if (minDays > 0) hints.push(`<li>${option.label}: min ${minDays} days</li>`);
+    });
+    return hints.length > 0 ? `Storage class requirements:<ul>${hints.join('')}</ul>` : void 0;
+};
+function BucketLifecycleFormPage() {
+    const { bucketName, ruleId } = useParams();
+    const navigate = useDataBrowserNavigate();
+    const { showToast } = useToast();
+    const isEditMode = !!ruleId;
+    const { data: lifecycleData, status: lifecycleStatus } = useGetBucketLifecycle({
+        Bucket: bucketName
+    });
+    const existingRule = useMemo(()=>{
+        if (!isEditMode || !lifecycleData?.Rules || !ruleId) return null;
+        return lifecycleData.Rules.find((rule)=>rule.ID === decodeURIComponent(ruleId)) || null;
+    }, [
+        isEditMode,
+        lifecycleData,
+        ruleId
+    ]);
+    const existingRuleIds = useMemo(()=>(lifecycleData?.Rules || []).map((rule)=>rule.ID).filter(Boolean).filter((id)=>!isEditMode || id !== existingRule?.ID), [
+        lifecycleData,
+        isEditMode,
+        existingRule
+    ]);
+    const dynamicSchema = useMemo(()=>schema.keys({
+            ruleId: joi.string().required().invalid(...existingRuleIds).messages({
+                'string.empty': 'Rule ID is required',
+                'any.invalid': 'A rule with this ID already exists'
+            })
+        }), [
+        existingRuleIds
+    ]);
+    const methods = useForm({
+        resolver: joiResolver(dynamicSchema),
+        mode: 'onChange',
+        defaultValues: {
+            ruleId: '',
+            status: 'Enabled',
+            filterType: 'none',
+            prefix: '',
+            tags: [],
+            transitionsEnabled: false,
+            transitions: [],
+            expirationEnabled: false,
+            expirationType: 'days',
+            expirationDays: 30,
+            expirationDate: '',
+            expiredObjectDeleteMarker: false,
+            noncurrentTransitionsEnabled: false,
+            noncurrentTransitions: [],
+            noncurrentExpirationEnabled: false,
+            noncurrentExpirationDays: 30,
+            noncurrentNewerVersions: 0,
+            abortMpuEnabled: false,
+            abortMpuDays: 7
+        }
+    });
+    const { handleSubmit, register, control, watch, reset, formState: { isValid, isDirty, errors } } = methods;
+    const { fields: transitionFields, append: appendTransition, remove: removeTransition } = useFieldArray({
+        control,
+        name: 'transitions'
+    });
+    const { fields: noncurrentTransitionFields, append: appendNoncurrentTransition, remove: removeNoncurrentTransition } = useFieldArray({
+        control,
+        name: 'noncurrentTransitions'
+    });
+    const { fields: tagFields, append: appendTag, remove: removeTag } = useFieldArray({
+        control,
+        name: 'tags'
+    });
+    const filterType = watch('filterType');
+    const transitionsEnabled = watch('transitionsEnabled');
+    const expirationEnabled = watch('expirationEnabled');
+    const expirationType = watch('expirationType');
+    const expiredObjectDeleteMarker = watch('expiredObjectDeleteMarker');
+    const noncurrentTransitionsEnabled = watch('noncurrentTransitionsEnabled');
+    const noncurrentExpirationEnabled = watch('noncurrentExpirationEnabled');
+    const abortMpuEnabled = watch('abortMpuEnabled');
+    const { mutate: setLifecycle, isPending: isSaving } = useSetBucketLifecycle();
+    const transitionsHelpText = useMemo(()=>{
+        if (!transitionsEnabled || 0 === transitionFields.length) return;
+        return generateStorageClassHelpText();
+    }, [
+        transitionsEnabled,
+        transitionFields.length
+    ]);
+    const noncurrentTransitionsHelpText = useMemo(()=>{
+        if (!noncurrentTransitionsEnabled || 0 === noncurrentTransitionFields.length) return;
+        return generateStorageClassHelpText();
+    }, [
+        noncurrentTransitionsEnabled,
+        noncurrentTransitionFields.length
+    ]);
+    useEffect(()=>{
+        if (isEditMode && existingRule) {
+            const formValues = ruleToFormValues(existingRule);
+            reset(formValues);
+        }
+    }, [
+        isEditMode,
+        existingRule,
+        reset
+    ]);
+    const prevTransitionsEnabledRef = useRef(null);
+    const prevNoncurrentTransitionsEnabledRef = useRef(null);
+    useEffect(()=>{
+        const prevValue = prevTransitionsEnabledRef.current;
+        prevTransitionsEnabledRef.current = transitionsEnabled;
+        if (!isEditMode && null !== prevValue && !prevValue && transitionsEnabled && 0 === transitionFields.length) appendTransition({
+            timeType: 'days',
+            days: 30,
+            date: '',
+            storageClass: 'STANDARD_IA'
+        });
+    }, [
+        isEditMode,
+        transitionsEnabled,
+        transitionFields.length,
+        appendTransition
+    ]);
+    useEffect(()=>{
+        const prevValue = prevNoncurrentTransitionsEnabledRef.current;
+        prevNoncurrentTransitionsEnabledRef.current = noncurrentTransitionsEnabled;
+        if (!isEditMode && null !== prevValue && !prevValue && noncurrentTransitionsEnabled && 0 === noncurrentTransitionFields.length) appendNoncurrentTransition({
+            noncurrentDays: 30,
+            storageClass: 'GLACIER',
+            newerNoncurrentVersions: 0
+        });
+    }, [
+        isEditMode,
+        noncurrentTransitionsEnabled,
+        noncurrentTransitionFields.length,
+        appendNoncurrentTransition
+    ]);
+    const prevFilterTypeRef = useRef();
+    useEffect(()=>{
+        const prevFilterType = prevFilterTypeRef.current;
+        prevFilterTypeRef.current = filterType;
+        if (('tags' === filterType || 'and' === filterType) && 0 === tagFields.length) {
+            if (!isEditMode || void 0 !== prevFilterType && prevFilterType !== filterType) appendTag({
+                key: '',
+                value: ''
+            });
+        }
+        if (void 0 !== prevFilterType && prevFilterType !== filterType) {
+            if (('none' === filterType || 'prefix' === filterType) && tagFields.length > 0) tagFields.forEach((_, index)=>{
+                removeTag(tagFields.length - 1 - index);
+            });
+            if ('none' === filterType) methods.setValue('prefix', '', {
+                shouldDirty: true
+            });
+        }
+    }, [
+        isEditMode,
+        filterType,
+        tagFields,
+        appendTag,
+        removeTag,
+        methods
+    ]);
+    const handleCancel = useCallback(()=>{
+        navigate(`/buckets/${bucketName}?tab=lifecycle`);
+    }, [
+        navigate,
+        bucketName
+    ]);
+    const onSubmit = useCallback((data)=>{
+        if (!bucketName) return;
+        const rule = {
+            ID: data.ruleId,
+            Status: data.status
+        };
+        rule.Filter = buildS3Filter(data);
+        if (data.transitionsEnabled && data.transitions.length > 0) rule.Transitions = data.transitions.map((transition)=>{
+            const t = {
+                StorageClass: transition.storageClass
+            };
+            if ('days' === transition.timeType) t.Days = transition.days;
+            else t.Date = new Date(transition.date);
+            return t;
+        });
+        if (data.expirationEnabled || data.expiredObjectDeleteMarker) {
+            rule.Expiration = {};
+            if (data.expirationEnabled) {
+                if ('days' === data.expirationType) rule.Expiration.Days = data.expirationDays;
+                else if ('date' === data.expirationType) rule.Expiration.Date = new Date(data.expirationDate);
+            }
+            if (data.expiredObjectDeleteMarker) rule.Expiration.ExpiredObjectDeleteMarker = true;
+        }
+        if (data.noncurrentTransitionsEnabled && data.noncurrentTransitions.length > 0) rule.NoncurrentVersionTransitions = data.noncurrentTransitions.map((transition)=>({
+                NoncurrentDays: transition.noncurrentDays,
+                StorageClass: transition.storageClass,
+                ...transition.newerNoncurrentVersions && transition.newerNoncurrentVersions > 0 && {
+                    NewerNoncurrentVersions: transition.newerNoncurrentVersions
+                }
+            }));
+        if (data.noncurrentExpirationEnabled) rule.NoncurrentVersionExpiration = {
+            NoncurrentDays: data.noncurrentExpirationDays,
+            ...data.noncurrentNewerVersions && data.noncurrentNewerVersions > 0 && {
+                NewerNoncurrentVersions: data.noncurrentNewerVersions
+            }
+        };
+        if (data.abortMpuEnabled) rule.AbortIncompleteMultipartUpload = {
+            DaysAfterInitiation: data.abortMpuDays
+        };
+        const existingRules = lifecycleData?.Rules || [];
+        const updatedRules = isEditMode ? existingRules.map((r)=>r.ID === existingRule?.ID ? rule : r) : [
+            ...existingRules,
+            rule
+        ];
+        setLifecycle({
+            Bucket: bucketName,
+            LifecycleConfiguration: {
+                Rules: updatedRules
+            }
+        }, {
+            onSuccess: ()=>{
+                showToast({
+                    open: true,
+                    message: `Lifecycle rule ${isEditMode ? 'updated' : 'created'} successfully`,
+                    status: 'success'
+                });
+                navigate(`/buckets/${bucketName}?tab=lifecycle`);
+            },
+            onError: (error)=>{
+                const errorMessage = error instanceof Error ? error.message : `Failed to ${isEditMode ? 'update' : 'create'} lifecycle rule`;
+                showToast({
+                    open: true,
+                    message: errorMessage,
+                    status: 'error'
+                });
+            }
+        });
+    }, [
+        bucketName,
+        setLifecycle,
+        navigate,
+        showToast,
+        lifecycleData,
+        isEditMode,
+        existingRule
+    ]);
+    if ('pending' === lifecycleStatus) return /*#__PURE__*/ jsx(Loader, {
+        centered: true,
+        children: /*#__PURE__*/ jsx(Text, {
+            children: "Loading..."
+        })
+    });
+    if (isEditMode && !existingRule) return /*#__PURE__*/ jsx(Box, {
+        padding: spacing.r16,
+        children: /*#__PURE__*/ jsx(Text, {
+            color: "statusCritical",
+            children: "Rule not found"
+        })
+    });
+    return /*#__PURE__*/ jsx(FormProvider, {
+        ...methods,
+        children: /*#__PURE__*/ jsxs(Form, {
+            layout: {
+                kind: 'page',
+                title: isEditMode ? 'Edit Lifecycle Rule' : 'Create Lifecycle Rule'
+            },
+            requireMode: "partial",
+            onSubmit: handleSubmit(onSubmit),
+            rightActions: /*#__PURE__*/ jsxs(Stack, {
+                gap: "r16",
+                children: [
+                    /*#__PURE__*/ jsx(Button, {
+                        id: "cancel-btn",
+                        variant: "outline",
+                        type: "button",
+                        label: "Cancel",
+                        onClick: handleCancel,
+                        disabled: isSaving
+                    }),
+                    /*#__PURE__*/ jsx(Button, {
+                        id: isEditMode ? 'save-lifecycle-btn' : 'create-lifecycle-btn',
+                        type: "submit",
+                        variant: "primary",
+                        label: isEditMode ? 'Save' : 'Create',
+                        icon: isEditMode ? /*#__PURE__*/ jsx(Icon, {
+                            name: "Save"
+                        }) : void 0,
+                        disabled: isEditMode ? !isDirty || !isValid || isSaving : !isValid || isSaving
+                    })
+                ]
+            }),
+            children: [
+                /*#__PURE__*/ jsxs(FormSection, {
+                    title: {
+                        name: 'Rule Scope'
+                    },
+                    forceLabelWidth: convertRemToPixels(15),
+                    children: [
+                        /*#__PURE__*/ jsx(FormGroup, {
+                            label: "Rule ID",
+                            id: "ruleId",
+                            direction: "horizontal",
+                            error: errors?.ruleId?.message,
+                            helpErrorPosition: "bottom",
+                            required: true,
+                            content: isEditMode ? /*#__PURE__*/ jsx(Text, {
+                                children: watch('ruleId')
+                            }) : /*#__PURE__*/ jsx(Input, {
+                                id: "ruleId",
+                                ...register('ruleId')
+                            })
+                        }),
+                        /*#__PURE__*/ jsx(FormGroup, {
+                            label: "Status",
+                            id: "status",
+                            direction: "horizontal",
+                            error: errors?.status?.message,
+                            helpErrorPosition: "bottom",
+                            required: true,
+                            content: /*#__PURE__*/ jsx(Controller, {
+                                name: "status",
+                                control: control,
+                                render: ({ field })=>/*#__PURE__*/ jsx(Select, {
+                                        id: "status",
+                                        value: field.value,
+                                        onChange: field.onChange,
+                                        children: STATUS_OPTIONS.map((option)=>/*#__PURE__*/ jsx(Select.Option, {
+                                                value: option.value,
+                                                children: option.label
+                                            }, option.value))
+                                    })
+                            })
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ jsx(FilterFormSection, {
+                    filterType: filterType,
+                    onFilterTypeChange: (value)=>methods.setValue('filterType', value),
+                    prefixRegister: register('prefix'),
+                    tagFields: tagFields,
+                    tagKeyRegister: (index)=>register(`tags.${index}.key`),
+                    tagValueRegister: (index)=>register(`tags.${index}.value`),
+                    getTagKeyValue: (index)=>watch(`tags.${index}.key`),
+                    getTagValueValue: (index)=>watch(`tags.${index}.value`),
+                    appendTag: appendTag,
+                    removeTag: removeTag,
+                    errors: errors
+                }),
+                /*#__PURE__*/ jsxs(FormSection, {
+                    title: {
+                        name: transitionsEnabled || expirationEnabled || noncurrentTransitionsEnabled || noncurrentExpirationEnabled || abortMpuEnabled ? 'Lifecycle Rule' : 'Lifecycle Rule (At least one action must be enabled)'
+                    },
+                    forceLabelWidth: convertRemToPixels(18),
+                    children: [
+                        /*#__PURE__*/ jsx(FormGroup, {
+                            label: "Transition current version",
+                            id: "transitionsEnabled",
+                            direction: "horizontal",
+                            labelHelpTooltip: transitionsHelpText,
+                            content: /*#__PURE__*/ jsx(Controller, {
+                                name: "transitionsEnabled",
+                                control: control,
+                                render: ({ field })=>/*#__PURE__*/ jsx(Toggle, {
+                                        toggle: field.value,
+                                        onChange: field.onChange,
+                                        label: field.value ? 'Enabled' : 'Disabled'
+                                    })
+                            })
+                        }),
+                        transitionsEnabled ? /*#__PURE__*/ jsx(FormGroup, {
+                            label: "",
+                            id: "transitions",
+                            direction: "vertical",
+                            error: errors?.transitions?.message,
+                            helpErrorPosition: "bottom",
+                            content: /*#__PURE__*/ jsxs(Stack, {
+                                direction: "vertical",
+                                gap: "r16",
+                                children: [
+                                    /*#__PURE__*/ jsxs(Stack, {
+                                        gap: "r40",
+                                        direction: "horizontal",
+                                        children: [
+                                            /*#__PURE__*/ jsx(Box, {
+                                                flex: "1/2",
+                                                children: /*#__PURE__*/ jsx(Text, {
+                                                    color: "textSecondary",
+                                                    children: "Time Type"
+                                                })
+                                            }),
+                                            /*#__PURE__*/ jsx(Box, {
+                                                flex: "1/2",
+                                                children: /*#__PURE__*/ jsx(Text, {
+                                                    color: "textSecondary",
+                                                    children: "Value"
+                                                })
+                                            }),
+                                            /*#__PURE__*/ jsx(Box, {
+                                                width: convertRemToPixels(4)
+                                            }),
+                                            /*#__PURE__*/ jsx(Box, {
+                                                flex: "1",
+                                                children: /*#__PURE__*/ jsx(Text, {
+                                                    color: "textSecondary",
+                                                    children: "Storage Class"
+                                                })
+                                            })
+                                        ]
+                                    }),
+                                    transitionFields.map((field, index)=>/*#__PURE__*/ jsxs(Stack, {
+                                            gap: "r20",
+                                            direction: "vertical",
+                                            children: [
+                                                /*#__PURE__*/ jsxs(Stack, {
+                                                    gap: "r20",
+                                                    children: [
+                                                        /*#__PURE__*/ jsx(Box, {
+                                                            flex: "1",
+                                                            children: /*#__PURE__*/ jsx(Controller, {
+                                                                name: `transitions.${index}.timeType`,
+                                                                control: control,
+                                                                render: ({ field })=>/*#__PURE__*/ jsxs(Select, {
+                                                                        id: `transition-time-type-${index}`,
+                                                                        value: field.value,
+                                                                        onChange: field.onChange,
+                                                                        size: "1/3",
+                                                                        children: [
+                                                                            /*#__PURE__*/ jsx(Select.Option, {
+                                                                                value: "days",
+                                                                                children: "Days"
+                                                                            }),
+                                                                            /*#__PURE__*/ jsx(Select.Option, {
+                                                                                value: "date",
+                                                                                children: "Date"
+                                                                            })
+                                                                        ]
+                                                                    })
+                                                            })
+                                                        }),
+                                                        /*#__PURE__*/ jsx(Box, {
+                                                            flex: "1",
+                                                            children: 'days' === watch(`transitions.${index}.timeType`) ? /*#__PURE__*/ jsx(Input, {
+                                                                id: `transition-days-${index}`,
+                                                                type: "number",
+                                                                placeholder: "Days",
+                                                                size: "1/2",
+                                                                ...register(`transitions.${index}.days`, {
+                                                                    valueAsNumber: true
+                                                                })
+                                                            }) : /*#__PURE__*/ jsx(Input, {
+                                                                id: `transition-date-${index}`,
+                                                                type: "date",
+                                                                size: "1/2",
+                                                                ...register(`transitions.${index}.date`)
+                                                            })
+                                                        }),
+                                                        /*#__PURE__*/ jsx(Box, {
+                                                            flex: "1",
+                                                            children: /*#__PURE__*/ jsx(Controller, {
+                                                                name: `transitions.${index}.storageClass`,
+                                                                control: control,
+                                                                render: ({ field })=>/*#__PURE__*/ jsx(Select, {
+                                                                        id: `transition-storage-class-${index}`,
+                                                                        value: field.value,
+                                                                        onChange: field.onChange,
+                                                                        placeholder: "Storage Class",
+                                                                        size: "2/3",
+                                                                        children: storageClassOptions.map((option)=>/*#__PURE__*/ jsx(Select.Option, {
+                                                                                value: option.value,
+                                                                                children: option.label
+                                                                            }, option.value))
+                                                                    })
+                                                            })
+                                                        }),
+                                                        /*#__PURE__*/ jsx(ArrayFieldActions, {
+                                                            showAdd: index === transitionFields.length - 1,
+                                                            onRemove: ()=>removeTransition(index),
+                                                            onAdd: ()=>appendTransition({
+                                                                    timeType: 'days',
+                                                                    days: 30,
+                                                                    date: '',
+                                                                    storageClass: 'STANDARD_IA'
+                                                                }),
+                                                            canRemove: transitionFields.length > 1
+                                                        })
+                                                    ]
+                                                }),
+                                                getArrayFieldError(errors, 'transitions', index) && /*#__PURE__*/ jsx(Text, {
+                                                    color: "statusCritical",
+                                                    children: getArrayFieldError(errors, 'transitions', index)
+                                                }),
+                                                getArrayFieldError(errors, 'transitions', index, 'days') && /*#__PURE__*/ jsx(Text, {
+                                                    color: "statusCritical",
+                                                    children: getArrayFieldError(errors, 'transitions', index, 'days')
+                                                }),
+                                                getArrayFieldError(errors, 'transitions', index, 'storageClass') && /*#__PURE__*/ jsx(Text, {
+                                                    color: "statusCritical",
+                                                    children: getArrayFieldError(errors, 'transitions', index, 'storageClass')
+                                                }),
+                                                getArrayFieldError(errors, 'transitions', index, 'date') && /*#__PURE__*/ jsx(Text, {
+                                                    color: "statusCritical",
+                                                    children: getArrayFieldError(errors, 'transitions', index, 'date')
+                                                })
+                                            ]
+                                        }, field.id))
+                                ]
+                            })
+                        }) : /*#__PURE__*/ jsx(Fragment, {}),
+                        /*#__PURE__*/ jsx(FormGroup, {
+                            label: "Expiration current version",
+                            id: "expirationEnabled",
+                            direction: "horizontal",
+                            labelHelpTooltip: "Expire objects after a specified time. Cannot be combined with expired delete markers removal.",
+                            content: /*#__PURE__*/ jsx(Controller, {
+                                name: "expirationEnabled",
+                                control: control,
+                                render: ({ field })=>/*#__PURE__*/ jsx(Toggle, {
+                                        toggle: field.value,
+                                        onChange: (value)=>{
+                                            field.onChange(value);
+                                            if (value && expiredObjectDeleteMarker) methods.setValue('expiredObjectDeleteMarker', false, {
+                                                shouldDirty: true
+                                            });
+                                        },
+                                        label: field.value ? 'Enabled' : 'Disabled',
+                                        disabled: expiredObjectDeleteMarker
+                                    })
+                            })
+                        }),
+                        expirationEnabled ? /*#__PURE__*/ jsxs(Fragment, {
+                            children: [
+                                /*#__PURE__*/ jsx(FormGroup, {
+                                    label: "Expiration type",
+                                    id: "expirationType",
+                                    direction: "horizontal",
+                                    content: /*#__PURE__*/ jsx(Controller, {
+                                        name: "expirationType",
+                                        control: control,
+                                        render: ({ field })=>/*#__PURE__*/ jsxs(Select, {
+                                                id: "expirationType",
+                                                value: field.value,
+                                                onChange: field.onChange,
+                                                children: [
+                                                    /*#__PURE__*/ jsx(Select.Option, {
+                                                        value: "days",
+                                                        children: "Days"
+                                                    }),
+                                                    /*#__PURE__*/ jsx(Select.Option, {
+                                                        value: "date",
+                                                        children: "Date"
+                                                    })
+                                                ]
+                                            })
+                                    })
+                                }),
+                                'days' === expirationType && /*#__PURE__*/ jsx(FormGroup, {
+                                    label: "Days",
+                                    id: "expirationDays",
+                                    direction: "horizontal",
+                                    error: errors?.expirationDays?.message,
+                                    helpErrorPosition: "bottom",
+                                    content: /*#__PURE__*/ jsx(Box, {
+                                        flex: "1",
+                                        children: /*#__PURE__*/ jsx(Input, {
+                                            type: "number",
+                                            id: "expirationDays",
+                                            ...register('expirationDays', {
+                                                valueAsNumber: true
+                                            })
+                                        })
+                                    })
+                                }),
+                                'date' === expirationType && /*#__PURE__*/ jsx(FormGroup, {
+                                    label: "Date",
+                                    id: "expirationDate",
+                                    direction: "horizontal",
+                                    error: errors?.expirationDate?.message,
+                                    helpErrorPosition: "bottom",
+                                    content: /*#__PURE__*/ jsx(Input, {
+                                        type: "date",
+                                        id: "expirationDate",
+                                        ...register('expirationDate')
+                                    })
+                                })
+                            ]
+                        }) : /*#__PURE__*/ jsx(Fragment, {}),
+                        /*#__PURE__*/ jsx(FormGroup, {
+                            label: "Remove expired delete markers",
+                            id: "expiredObjectDeleteMarker",
+                            direction: "horizontal",
+                            labelHelpTooltip: "Automatically remove expired object delete markers in versioned buckets. Cannot be combined with Days/Date expiration.",
+                            content: /*#__PURE__*/ jsx(Controller, {
+                                name: "expiredObjectDeleteMarker",
+                                control: control,
+                                render: ({ field })=>/*#__PURE__*/ jsx(Toggle, {
+                                        toggle: field.value,
+                                        onChange: (value)=>{
+                                            field.onChange(value);
+                                            if (value && expirationEnabled) methods.setValue('expirationEnabled', false, {
+                                                shouldDirty: true
+                                            });
+                                        },
+                                        label: field.value ? 'Enabled' : 'Disabled',
+                                        disabled: expirationEnabled
+                                    })
+                            })
+                        }),
+                        /*#__PURE__*/ jsx(FormGroup, {
+                            label: "Transition noncurrent version",
+                            id: "noncurrentTransitionsEnabled",
+                            direction: "horizontal",
+                            content: /*#__PURE__*/ jsx(Controller, {
+                                name: "noncurrentTransitionsEnabled",
+                                control: control,
+                                render: ({ field })=>/*#__PURE__*/ jsx(Toggle, {
+                                        toggle: field.value,
+                                        onChange: field.onChange,
+                                        label: field.value ? 'Enabled' : 'Disabled'
+                                    })
+                            })
+                        }),
+                        noncurrentTransitionsEnabled ? /*#__PURE__*/ jsx(FormGroup, {
+                            label: "",
+                            id: "noncurrentTransitions",
+                            direction: "vertical",
+                            error: errors?.noncurrentTransitions?.message,
+                            helpErrorPosition: "bottom",
+                            labelHelpTooltip: noncurrentTransitionsHelpText,
+                            content: /*#__PURE__*/ jsxs(Stack, {
+                                direction: "vertical",
+                                gap: "r16",
+                                children: [
+                                    /*#__PURE__*/ jsxs(Stack, {
+                                        gap: "r40",
+                                        direction: "horizontal",
+                                        children: [
+                                            /*#__PURE__*/ jsx(Box, {
+                                                flex: "1/2",
+                                                children: /*#__PURE__*/ jsx(Text, {
+                                                    color: "textSecondary",
+                                                    children: "Noncurrent Days"
+                                                })
+                                            }),
+                                            /*#__PURE__*/ jsx(Box, {
+                                                flex: "1/2",
+                                                children: /*#__PURE__*/ jsx(Text, {
+                                                    color: "textSecondary",
+                                                    children: "Keep Versions"
+                                                })
+                                            }),
+                                            /*#__PURE__*/ jsx(Box, {
+                                                flex: "1",
+                                                children: /*#__PURE__*/ jsx(Text, {
+                                                    color: "textSecondary",
+                                                    children: "Storage Class"
+                                                })
+                                            })
+                                        ]
+                                    }),
+                                    noncurrentTransitionFields.map((field, index)=>/*#__PURE__*/ jsxs(Stack, {
+                                            gap: "r16",
+                                            direction: "vertical",
+                                            children: [
+                                                /*#__PURE__*/ jsxs(Stack, {
+                                                    gap: "r16",
+                                                    children: [
+                                                        /*#__PURE__*/ jsx(Box, {
+                                                            flex: "1",
+                                                            children: /*#__PURE__*/ jsx(Input, {
+                                                                id: `noncurrent-transition-days-${index}`,
+                                                                type: "number",
+                                                                placeholder: "Noncurrent days",
+                                                                size: "1/3",
+                                                                ...register(`noncurrentTransitions.${index}.noncurrentDays`, {
+                                                                    valueAsNumber: true
+                                                                })
+                                                            })
+                                                        }),
+                                                        /*#__PURE__*/ jsx(Box, {
+                                                            width: convertRemToPixels(2)
+                                                        }),
+                                                        /*#__PURE__*/ jsx(Box, {
+                                                            flex: "1",
+                                                            children: /*#__PURE__*/ jsx(Input, {
+                                                                id: `noncurrent-transition-keep-versions-${index}`,
+                                                                type: "number",
+                                                                placeholder: "Keep versions",
+                                                                size: "1/3",
+                                                                ...register(`noncurrentTransitions.${index}.newerNoncurrentVersions`, {
+                                                                    valueAsNumber: true
+                                                                })
+                                                            })
+                                                        }),
+                                                        /*#__PURE__*/ jsx(Box, {
+                                                            width: convertRemToPixels(0.5)
+                                                        }),
+                                                        /*#__PURE__*/ jsx(Box, {
+                                                            flex: "1",
+                                                            children: /*#__PURE__*/ jsx(Controller, {
+                                                                name: `noncurrentTransitions.${index}.storageClass`,
+                                                                control: control,
+                                                                render: ({ field })=>/*#__PURE__*/ jsx(Select, {
+                                                                        id: `noncurrent-transition-storage-class-${index}`,
+                                                                        value: field.value,
+                                                                        onChange: field.onChange,
+                                                                        placeholder: "Storage Class",
+                                                                        size: "2/3",
+                                                                        children: storageClassOptions.map((option)=>/*#__PURE__*/ jsx(Select.Option, {
+                                                                                value: option.value,
+                                                                                children: option.label
+                                                                            }, option.value))
+                                                                    })
+                                                            })
+                                                        }),
+                                                        /*#__PURE__*/ jsx(ArrayFieldActions, {
+                                                            showAdd: index === noncurrentTransitionFields.length - 1,
+                                                            onRemove: ()=>removeNoncurrentTransition(index),
+                                                            onAdd: ()=>appendNoncurrentTransition({
+                                                                    noncurrentDays: 30,
+                                                                    storageClass: 'GLACIER',
+                                                                    newerNoncurrentVersions: 0
+                                                                }),
+                                                            canRemove: noncurrentTransitionFields.length > 1
+                                                        })
+                                                    ]
+                                                }),
+                                                getArrayFieldError(errors, 'noncurrentTransitions', index, 'noncurrentDays') && /*#__PURE__*/ jsx(Text, {
+                                                    color: "statusCritical",
+                                                    children: getArrayFieldError(errors, 'noncurrentTransitions', index, 'noncurrentDays')
+                                                }),
+                                                getArrayFieldError(errors, 'noncurrentTransitions', index, 'storageClass') && /*#__PURE__*/ jsx(Text, {
+                                                    color: "statusCritical",
+                                                    children: getArrayFieldError(errors, 'noncurrentTransitions', index, 'storageClass')
+                                                })
+                                            ]
+                                        }, field.id))
+                                ]
+                            })
+                        }) : /*#__PURE__*/ jsx(Fragment, {}),
+                        /*#__PURE__*/ jsx(FormGroup, {
+                            label: "Expiration noncurrent version",
+                            id: "noncurrentExpirationEnabled",
+                            direction: "horizontal",
+                            content: /*#__PURE__*/ jsx(Controller, {
+                                name: "noncurrentExpirationEnabled",
+                                control: control,
+                                render: ({ field })=>/*#__PURE__*/ jsx(Toggle, {
+                                        toggle: field.value,
+                                        onChange: field.onChange,
+                                        label: field.value ? 'Enabled' : 'Disabled'
+                                    })
+                            })
+                        }),
+                        noncurrentExpirationEnabled ? /*#__PURE__*/ jsxs(Fragment, {
+                            children: [
+                                /*#__PURE__*/ jsx(FormGroup, {
+                                    label: "Noncurrent days",
+                                    id: "noncurrentExpirationDays",
+                                    direction: "horizontal",
+                                    error: errors?.noncurrentExpirationDays?.message,
+                                    helpErrorPosition: "bottom",
+                                    content: /*#__PURE__*/ jsx(Box, {
+                                        flex: "1",
+                                        children: /*#__PURE__*/ jsx(Input, {
+                                            type: "number",
+                                            id: "noncurrentExpirationDays",
+                                            ...register('noncurrentExpirationDays', {
+                                                valueAsNumber: true
+                                            })
+                                        })
+                                    })
+                                }),
+                                /*#__PURE__*/ jsx(FormGroup, {
+                                    label: "Keep newer versions",
+                                    id: "noncurrentNewerVersions",
+                                    direction: "horizontal",
+                                    content: /*#__PURE__*/ jsx(Box, {
+                                        flex: "1",
+                                        children: /*#__PURE__*/ jsx(Input, {
+                                            type: "number",
+                                            id: "noncurrentNewerVersions",
+                                            placeholder: "0",
+                                            ...register('noncurrentNewerVersions', {
+                                                valueAsNumber: true
+                                            })
+                                        })
+                                    })
+                                })
+                            ]
+                        }) : /*#__PURE__*/ jsx(Fragment, {}),
+                        /*#__PURE__*/ jsx(FormGroup, {
+                            label: "Expire incomplete multipart upload",
+                            id: "abortMpuEnabled",
+                            direction: "horizontal",
+                            error: ('tags' === filterType || 'and' === filterType) && abortMpuEnabled ? 'Tag-based filter cannot be used with Abort Incomplete Multipart Upload' : void 0,
+                            helpErrorPosition: "bottom",
+                            content: /*#__PURE__*/ jsx(Controller, {
+                                name: "abortMpuEnabled",
+                                control: control,
+                                render: ({ field })=>/*#__PURE__*/ jsx(Toggle, {
+                                        toggle: field.value,
+                                        onChange: field.onChange,
+                                        label: field.value ? 'Enabled' : 'Disabled'
+                                    })
+                            })
+                        }),
+                        abortMpuEnabled ? /*#__PURE__*/ jsx(FormGroup, {
+                            label: "Days after initiation",
+                            id: "abortMpuDays",
+                            direction: "horizontal",
+                            error: errors?.abortMpuDays?.message,
+                            helpErrorPosition: "bottom",
+                            content: /*#__PURE__*/ jsx(Box, {
+                                flex: "1",
+                                children: /*#__PURE__*/ jsx(Input, {
+                                    type: "number",
+                                    id: "abortMpuDays",
+                                    ...register('abortMpuDays', {
+                                        valueAsNumber: true
+                                    })
+                                })
+                            })
+                        }) : /*#__PURE__*/ jsx(Fragment, {})
+                    ]
+                })
+            ]
+        })
+    });
+}
+export { BucketLifecycleFormPage };