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

package/dist/components/buckets/BucketReplicationFormPage.js

@@ -0,0 +1,835 @@
+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 { useGetBucketReplication, useSetBucketReplication } from "../../hooks/bucketConfiguration.js";
+import { useBuckets } from "../../hooks/bucketOperations.js";
+import { useDataBrowserNavigate } from "../../hooks/useDataBrowserNavigate.js";
+import { AWS_RULE_LIMITS, STATUS_OPTIONS, buildS3Filter } from "../../utils/s3RuleUtils.js";
+import { FilterFormSection, createFilterValidationSchema } from "../ui/FilterFormSection.js";
+const storageClassOptions = [
+    {
+        value: '',
+        label: 'Same as source'
+    },
+    {
+        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 createSchema = (hasExistingRules)=>joi.object({
+        role: hasExistingRules ? joi.string().optional() : joi.string().required().messages({
+            'string.empty': 'Role ARN is required for first replication rule'
+        }),
+        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(),
+        priority: joi.number().integer().min(0).allow(null).optional().messages({
+            'number.base': 'Priority must be a number',
+            'number.min': 'Priority must be at least 0'
+        }),
+        ...createFilterValidationSchema(joi),
+        includeEncryptedObjects: joi.boolean(),
+        replicaModifications: joi.boolean(),
+        sameAccount: joi.boolean(),
+        targetBucket: joi.string().required().messages({
+            'string.empty': 'Target bucket is required'
+        }),
+        targetAccountId: joi.when('sameAccount', {
+            is: false,
+            then: joi.string().required().messages({
+                'string.empty': 'Target account ID is required for cross-account replication'
+            }),
+            otherwise: joi.string().allow('').optional()
+        }),
+        storageClass: joi.string().allow('').optional(),
+        encryptReplicatedObjects: joi.boolean().custom((value, helpers)=>{
+            const { includeEncryptedObjects } = helpers.state.ancestors[0];
+            if (includeEncryptedObjects && !value) return helpers.error('any.invalid', {
+                message: 'Encryption must be enabled when replicating encrypted objects'
+            });
+            return value;
+        }),
+        replicaKmsKeyId: joi.when('encryptReplicatedObjects', {
+            is: true,
+            then: joi.string().required().messages({
+                'string.empty': 'Replica KMS Key ID is required when encrypting replicated objects'
+            }),
+            otherwise: joi.string().allow('').optional()
+        }),
+        enforceRTC: joi.boolean(),
+        enableRTCNotification: joi.when('enforceRTC', {
+            is: true,
+            then: joi.boolean().valid(true).messages({
+                'any.only': 'Metrics must be enabled when RTC is enabled'
+            }),
+            otherwise: joi.boolean()
+        }),
+        deleteMarkerReplication: joi.boolean(),
+        switchObjectOwnership: joi.boolean()
+    });
+const ruleToFormValues = (rule, role)=>{
+    const formValues = {
+        role,
+        ruleId: rule.ID || '',
+        status: rule.Status || 'Enabled',
+        priority: rule.Priority ?? null,
+        filterType: 'none',
+        prefix: '',
+        tags: [],
+        includeEncryptedObjects: false,
+        replicaModifications: false,
+        sameAccount: true,
+        targetBucket: '',
+        targetAccountId: '',
+        storageClass: '',
+        encryptReplicatedObjects: false,
+        replicaKmsKeyId: '',
+        enforceRTC: false,
+        enableRTCNotification: false,
+        deleteMarkerReplication: false,
+        switchObjectOwnership: false
+    };
+    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.SourceSelectionCriteria) {
+        formValues.includeEncryptedObjects = rule.SourceSelectionCriteria.SseKmsEncryptedObjects?.Status === 'Enabled';
+        formValues.replicaModifications = rule.SourceSelectionCriteria.ReplicaModifications?.Status === 'Enabled';
+    }
+    if (rule.Destination) {
+        const bucketArn = rule.Destination.Bucket || '';
+        const parts = bucketArn.split(':::');
+        formValues.targetBucket = parts[parts.length - 1] || bucketArn;
+        if (rule.Destination.Account) {
+            formValues.sameAccount = false;
+            formValues.targetAccountId = rule.Destination.Account;
+        } else formValues.sameAccount = true;
+        formValues.storageClass = rule.Destination.StorageClass || '';
+        formValues.switchObjectOwnership = rule.Destination.AccessControlTranslation?.Owner === 'Destination';
+        if (rule.Destination.ReplicationTime) formValues.enforceRTC = 'Enabled' === rule.Destination.ReplicationTime.Status;
+        if (rule.Destination.Metrics) formValues.enableRTCNotification = 'Enabled' === rule.Destination.Metrics.Status;
+        if (rule.Destination.EncryptionConfiguration) {
+            formValues.encryptReplicatedObjects = true;
+            formValues.replicaKmsKeyId = rule.Destination.EncryptionConfiguration.ReplicaKmsKeyID || '';
+        }
+    }
+    if (rule.DeleteMarkerReplication) formValues.deleteMarkerReplication = 'Enabled' === rule.DeleteMarkerReplication.Status;
+    return formValues;
+};
+const ToggleFormField = ({ name, label, id, control, labelHelpTooltip })=>/*#__PURE__*/ jsx(FormGroup, {
+        label: label,
+        id: id,
+        direction: "horizontal",
+        labelHelpTooltip: labelHelpTooltip,
+        content: /*#__PURE__*/ jsx(Controller, {
+            name: name,
+            control: control,
+            render: ({ field })=>/*#__PURE__*/ jsx(Toggle, {
+                    toggle: field.value,
+                    onChange: field.onChange,
+                    label: field.value ? 'Enabled' : 'Disabled'
+                })
+        })
+    });
+const buildDestination = (data)=>({
+        Bucket: `arn:aws:s3:::${data.targetBucket}`,
+        ...!data.sameAccount && data.targetAccountId && '' !== data.targetAccountId.trim() && {
+            Account: data.targetAccountId
+        },
+        ...data.storageClass && '' !== data.storageClass.trim() && {
+            StorageClass: data.storageClass
+        },
+        ...(data.enforceRTC || data.enableRTCNotification) && {
+            ReplicationTime: {
+                Status: data.enforceRTC ? 'Enabled' : 'Disabled',
+                Time: {
+                    Minutes: 15
+                }
+            },
+            Metrics: {
+                Status: 'Enabled',
+                ...data.enforceRTC && {
+                    EventThreshold: {
+                        Minutes: 15
+                    }
+                }
+            }
+        },
+        ...data.encryptReplicatedObjects && data.replicaKmsKeyId && '' !== data.replicaKmsKeyId.trim() && {
+            EncryptionConfiguration: {
+                ReplicaKmsKeyID: data.replicaKmsKeyId
+            }
+        },
+        ...!data.sameAccount && data.switchObjectOwnership && data.targetAccountId && '' !== data.targetAccountId.trim() && {
+            AccessControlTranslation: {
+                Owner: 'Destination'
+            }
+        }
+    });
+const buildSourceSelectionCriteria = (data)=>{
+    if (data.includeEncryptedObjects || data.replicaModifications) return {
+        ...data.includeEncryptedObjects && {
+            SseKmsEncryptedObjects: {
+                Status: 'Enabled'
+            }
+        },
+        ...data.replicaModifications && {
+            ReplicaModifications: {
+                Status: 'Enabled'
+            }
+        }
+    };
+};
+const buildReplicationRule = (data)=>{
+    const rule = {
+        ID: data.ruleId,
+        Status: data.status,
+        Priority: data.priority ?? 0,
+        Destination: buildDestination(data)
+    };
+    const filter = buildS3Filter(data);
+    if (filter) rule.Filter = filter;
+    const sourceSelectionCriteria = buildSourceSelectionCriteria(data);
+    if (sourceSelectionCriteria) rule.SourceSelectionCriteria = sourceSelectionCriteria;
+    rule.DeleteMarkerReplication = {
+        Status: data.deleteMarkerReplication ? 'Enabled' : 'Disabled'
+    };
+    return rule;
+};
+function BucketReplicationFormPage() {
+    const { bucketName, ruleId } = useParams();
+    const navigate = useDataBrowserNavigate();
+    const { showToast } = useToast();
+    const isEditMode = !!ruleId;
+    const { data: replicationData, status: replicationStatus } = useGetBucketReplication({
+        Bucket: bucketName
+    });
+    const { data: bucketsData } = useBuckets();
+    const availableBuckets = bucketsData?.Buckets || [];
+    const existingRole = replicationData?.ReplicationConfiguration?.Role || '';
+    const hasExistingRules = (replicationData?.ReplicationConfiguration?.Rules || []).length > 0;
+    const existingRule = useMemo(()=>{
+        if (!isEditMode || !replicationData?.ReplicationConfiguration?.Rules || !ruleId) return null;
+        return replicationData.ReplicationConfiguration.Rules.find((rule)=>rule.ID === decodeURIComponent(ruleId)) || null;
+    }, [
+        isEditMode,
+        replicationData,
+        ruleId
+    ]);
+    const existingRuleIds = useMemo(()=>(replicationData?.ReplicationConfiguration?.Rules || []).map((rule)=>rule.ID).filter(Boolean).filter((id)=>!isEditMode || id !== existingRule?.ID), [
+        replicationData,
+        isEditMode,
+        existingRule
+    ]);
+    const nextAvailablePriority = useMemo(()=>{
+        const existingRules = replicationData?.ReplicationConfiguration?.Rules || [];
+        if (0 === existingRules.length) return 0;
+        const priorities = existingRules.map((rule)=>rule.Priority).filter((p)=>null != p);
+        if (0 === priorities.length) return 0;
+        return Math.max(...priorities) + 1;
+    }, [
+        replicationData
+    ]);
+    const dynamicSchema = useMemo(()=>createSchema(hasExistingRules).keys({
+            ruleId: joi.string().required().invalid(...existingRuleIds).messages({
+                'string.empty': 'Rule ID is required',
+                'any.invalid': 'A rule with this ID already exists'
+            })
+        }), [
+        existingRuleIds,
+        hasExistingRules
+    ]);
+    const methods = useForm({
+        resolver: joiResolver(dynamicSchema),
+        mode: 'onChange',
+        defaultValues: {
+            role: '',
+            ruleId: '',
+            status: 'Enabled',
+            priority: null,
+            filterType: 'none',
+            prefix: '',
+            tags: [],
+            includeEncryptedObjects: false,
+            replicaModifications: false,
+            sameAccount: true,
+            targetBucket: '',
+            targetAccountId: '',
+            storageClass: '',
+            encryptReplicatedObjects: false,
+            replicaKmsKeyId: '',
+            enforceRTC: false,
+            enableRTCNotification: false,
+            deleteMarkerReplication: false,
+            switchObjectOwnership: false
+        }
+    });
+    const { handleSubmit, register, control, watch, reset, formState: { isValid, isDirty, errors } } = methods;
+    const { fields: tagFields, append: appendTag, remove: removeTag } = useFieldArray({
+        control,
+        name: 'tags'
+    });
+    const filterType = watch('filterType');
+    const sameAccount = watch('sameAccount');
+    const encryptReplicatedObjects = watch('encryptReplicatedObjects');
+    const includeEncryptedObjects = watch('includeEncryptedObjects');
+    const deleteMarkerReplication = watch('deleteMarkerReplication');
+    const enforceRTC = watch('enforceRTC');
+    const { mutate: setReplication, isPending: isSaving } = useSetBucketReplication();
+    const loadedRuleIdRef = useRef(null);
+    useEffect(()=>{
+        if (isEditMode && existingRule) {
+            if (loadedRuleIdRef.current !== existingRule.ID) {
+                const formValues = ruleToFormValues(existingRule, existingRole);
+                reset(formValues);
+                loadedRuleIdRef.current = existingRule.ID || null;
+            }
+        } else if (!isEditMode && !isDirty) {
+            reset((prev)=>({
+                    ...prev,
+                    role: existingRole,
+                    priority: nextAvailablePriority
+                }));
+            loadedRuleIdRef.current = null;
+        }
+    }, [
+        isEditMode,
+        existingRule,
+        existingRole,
+        nextAvailablePriority,
+        isDirty,
+        reset
+    ]);
+    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
+    ]);
+    useEffect(()=>{
+        if (includeEncryptedObjects && !encryptReplicatedObjects) methods.setValue('encryptReplicatedObjects', true, {
+            shouldValidate: true
+        });
+    }, [
+        includeEncryptedObjects,
+        encryptReplicatedObjects,
+        methods
+    ]);
+    useEffect(()=>{
+        if (('tags' === filterType || 'and' === filterType) && deleteMarkerReplication) methods.setValue('deleteMarkerReplication', false, {
+            shouldValidate: true
+        });
+    }, [
+        filterType,
+        deleteMarkerReplication,
+        methods
+    ]);
+    useEffect(()=>{
+        if (enforceRTC) methods.setValue('enableRTCNotification', true, {
+            shouldValidate: true
+        });
+    }, [
+        enforceRTC,
+        methods
+    ]);
+    const handleCancel = useCallback(()=>{
+        navigate(`/buckets/${bucketName}?tab=replication`);
+    }, [
+        navigate,
+        bucketName
+    ]);
+    const onSubmit = useCallback((data)=>{
+        if (!bucketName) return;
+        const rule = buildReplicationRule(data);
+        const existingRules = replicationData?.ReplicationConfiguration?.Rules || [];
+        const updatedRules = isEditMode ? existingRules.map((r)=>r.ID === existingRule?.ID ? rule : r) : [
+            ...existingRules,
+            rule
+        ];
+        setReplication({
+            Bucket: bucketName,
+            ReplicationConfiguration: {
+                Role: data.role,
+                Rules: updatedRules
+            }
+        }, {
+            onSuccess: ()=>{
+                showToast({
+                    open: true,
+                    message: `Replication rule ${isEditMode ? 'updated' : 'created'} successfully`,
+                    status: 'success'
+                });
+                navigate(`/buckets/${bucketName}?tab=replication`);
+            },
+            onError: (error)=>{
+                const errorMessage = error instanceof Error ? error.message : `Failed to ${isEditMode ? 'update' : 'create'} replication rule`;
+                showToast({
+                    open: true,
+                    message: errorMessage,
+                    status: 'error'
+                });
+            }
+        });
+    }, [
+        bucketName,
+        setReplication,
+        navigate,
+        showToast,
+        replicationData,
+        isEditMode,
+        existingRule
+    ]);
+    if ('pending' === replicationStatus) 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 Replication Rule' : 'Create Replication 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-replication-btn' : 'create-replication-btn',
+                        type: "submit",
+                        variant: "primary",
+                        label: isEditMode ? 'Save' : 'Create',
+                        icon: isEditMode ? /*#__PURE__*/ jsx(Icon, {
+                            name: "Save"
+                        }) : void 0,
+                        disabled: !isDirty || !isValid || isSaving
+                    })
+                ]
+            }),
+            children: [
+                /*#__PURE__*/ jsx(FormSection, {
+                    title: {
+                        name: 'Role'
+                    },
+                    forceLabelWidth: convertRemToPixels(15),
+                    children: /*#__PURE__*/ jsx(FormGroup, {
+                        label: "Role ARN",
+                        id: "role",
+                        direction: "horizontal",
+                        error: errors?.role?.message,
+                        helpErrorPosition: "bottom",
+                        required: !hasExistingRules,
+                        content: hasExistingRules ? /*#__PURE__*/ jsxs(Stack, {
+                            direction: "vertical",
+                            gap: "r8",
+                            children: [
+                                /*#__PURE__*/ jsx(Text, {
+                                    children: existingRole || 'Not set'
+                                }),
+                                /*#__PURE__*/ jsx(Text, {
+                                    color: "textSecondary",
+                                    children: "To change the Role, edit it through bucket configuration or delete all rules first"
+                                })
+                            ]
+                        }) : /*#__PURE__*/ jsx(Input, {
+                            id: "role",
+                            placeholder: "arn:aws:iam::123456789012:role/replication-role",
+                            ...register('role')
+                        })
+                    })
+                }),
+                /*#__PURE__*/ jsxs(FormSection, {
+                    title: {
+                        name: 'Rule Scope'
+                    },
+                    forceLabelWidth: convertRemToPixels(15),
+                    children: [
+                        /*#__PURE__*/ jsx(FormGroup, {
+                            label: "Rule ID / Name",
+                            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(FormGroup, {
+                            label: "Rule priority",
+                            id: "priority",
+                            direction: "horizontal",
+                            error: errors?.priority?.message,
+                            helpErrorPosition: "bottom",
+                            labelHelpTooltip: "Lower numbers have higher priority. Rules are evaluated in priority order when filters overlap.",
+                            content: /*#__PURE__*/ jsx(Box, {
+                                flex: "1",
+                                children: /*#__PURE__*/ jsx(Input, {
+                                    type: "number",
+                                    id: "priority",
+                                    placeholder: isEditMode ? void 0 : `Auto-assigned: ${nextAvailablePriority}`,
+                                    ...register('priority', {
+                                        setValueAs: (v)=>{
+                                            if ('' === v || null == v) return null;
+                                            const parsed = parseInt(v, 10);
+                                            return isNaN(parsed) ? null : parsed;
+                                        }
+                                    })
+                                })
+                            })
+                        })
+                    ]
+                }),
+                /*#__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: 'Destination'
+                    },
+                    forceLabelWidth: convertRemToPixels(15),
+                    children: [
+                        /*#__PURE__*/ jsx(FormGroup, {
+                            label: "Destination",
+                            id: "sameAccount",
+                            direction: "horizontal",
+                            content: /*#__PURE__*/ jsx(Controller, {
+                                name: "sameAccount",
+                                control: control,
+                                render: ({ field })=>/*#__PURE__*/ jsx(Toggle, {
+                                        toggle: field.value,
+                                        onChange: field.onChange,
+                                        label: field.value ? 'Same account destination' : 'Not same account destination'
+                                    })
+                            })
+                        }),
+                        sameAccount ? /*#__PURE__*/ jsx(Fragment, {}) : /*#__PURE__*/ jsx(FormGroup, {
+                            label: "Target account ID",
+                            id: "targetAccountId",
+                            direction: "horizontal",
+                            error: errors?.targetAccountId?.message,
+                            helpErrorPosition: "bottom",
+                            required: true,
+                            content: /*#__PURE__*/ jsx(Input, {
+                                id: "targetAccountId",
+                                placeholder: "Account ID",
+                                ...register('targetAccountId')
+                            })
+                        }),
+                        /*#__PURE__*/ jsx(FormGroup, {
+                            label: "Target Bucket",
+                            id: "targetBucket",
+                            direction: "horizontal",
+                            error: errors?.targetBucket?.message,
+                            helpErrorPosition: "bottom",
+                            required: true,
+                            content: sameAccount ? /*#__PURE__*/ jsx(Controller, {
+                                name: "targetBucket",
+                                control: control,
+                                render: ({ field })=>/*#__PURE__*/ jsx(Select, {
+                                        id: "targetBucket",
+                                        value: field.value,
+                                        onChange: field.onChange,
+                                        placeholder: "Select a bucket",
+                                        children: availableBuckets.filter((bucket)=>bucket.Name !== bucketName).map((bucket)=>/*#__PURE__*/ jsx(Select.Option, {
+                                                value: bucket.Name || '',
+                                                children: bucket.Name
+                                            }, bucket.Name))
+                                    })
+                            }) : /*#__PURE__*/ jsx(Input, {
+                                id: "targetBucket",
+                                placeholder: "Bucket name",
+                                ...register('targetBucket')
+                            })
+                        }),
+                        /*#__PURE__*/ jsx(FormGroup, {
+                            label: "Storage Class",
+                            id: "storageClass",
+                            direction: "horizontal",
+                            error: errors?.storageClass?.message,
+                            helpErrorPosition: "bottom",
+                            labelHelpTooltip: "Storage class for replicated objects in destination bucket",
+                            content: /*#__PURE__*/ jsx(Controller, {
+                                name: "storageClass",
+                                control: control,
+                                render: ({ field })=>/*#__PURE__*/ jsx(Select, {
+                                        id: "storageClass",
+                                        value: field.value,
+                                        onChange: field.onChange,
+                                        children: storageClassOptions.map((option)=>/*#__PURE__*/ jsx(Select.Option, {
+                                                value: option.value,
+                                                children: option.label
+                                            }, option.value))
+                                    })
+                            })
+                        }),
+                        sameAccount ? /*#__PURE__*/ jsx(Fragment, {}) : /*#__PURE__*/ jsx(ToggleFormField, {
+                            name: "switchObjectOwnership",
+                            label: "Switch Object ownership",
+                            id: "switchObjectOwnership",
+                            control: control,
+                            labelHelpTooltip: "Change replica ownership to destination bucket owner (AccessControlTranslation)"
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ jsxs(FormSection, {
+                    title: {
+                        name: 'Encryption'
+                    },
+                    forceLabelWidth: convertRemToPixels(15),
+                    children: [
+                        /*#__PURE__*/ jsx(ToggleFormField, {
+                            name: "includeEncryptedObjects",
+                            label: "Replicate encrypted objects",
+                            id: "includeEncryptedObjects",
+                            control: control,
+                            labelHelpTooltip: "Replicate objects encrypted with KMS from source bucket"
+                        }),
+                        /*#__PURE__*/ jsx(FormGroup, {
+                            label: "Encrypt replicated objects",
+                            id: "encryptReplicatedObjects",
+                            direction: "horizontal",
+                            error: errors?.encryptReplicatedObjects?.message,
+                            helpErrorPosition: "bottom",
+                            labelHelpTooltip: "Encrypt objects in destination bucket using KMS",
+                            required: includeEncryptedObjects,
+                            content: /*#__PURE__*/ jsxs(Stack, {
+                                direction: "vertical",
+                                gap: "r8",
+                                children: [
+                                    /*#__PURE__*/ jsx(Controller, {
+                                        name: "encryptReplicatedObjects",
+                                        control: control,
+                                        render: ({ field })=>/*#__PURE__*/ jsx(Toggle, {
+                                                toggle: field.value,
+                                                onChange: field.onChange,
+                                                label: field.value ? 'Enabled' : 'Disabled',
+                                                disabled: includeEncryptedObjects
+                                            })
+                                    }),
+                                    includeEncryptedObjects && /*#__PURE__*/ jsx(Text, {
+                                        color: "textSecondary",
+                                        children: "Encryption is required when replicating encrypted objects"
+                                    })
+                                ]
+                            })
+                        }),
+                        encryptReplicatedObjects ? /*#__PURE__*/ jsx(FormGroup, {
+                            label: "Replica KMS Key ID",
+                            id: "replicaKmsKeyId",
+                            direction: "horizontal",
+                            error: errors?.replicaKmsKeyId?.message,
+                            helpErrorPosition: "bottom",
+                            labelHelpTooltip: "KMS key ID or ARN to use for encrypting replicated objects",
+                            required: true,
+                            content: /*#__PURE__*/ jsx(Input, {
+                                id: "replicaKmsKeyId",
+                                placeholder: "KMS Key ID or ARN",
+                                ...register('replicaKmsKeyId')
+                            })
+                        }) : /*#__PURE__*/ jsx(Fragment, {})
+                    ]
+                }),
+                /*#__PURE__*/ jsxs(FormSection, {
+                    title: {
+                        name: 'Additional Options'
+                    },
+                    forceLabelWidth: convertRemToPixels(15),
+                    children: [
+                        /*#__PURE__*/ jsx(ToggleFormField, {
+                            name: "enforceRTC",
+                            label: "Replication Time Control (RTC)",
+                            id: "enforceRTC",
+                            control: control,
+                            labelHelpTooltip: "Guarantees replication within 15 minutes with SLA monitoring"
+                        }),
+                        /*#__PURE__*/ jsx(FormGroup, {
+                            label: "RTC metrics and notifications",
+                            id: "enableRTCNotification",
+                            direction: "horizontal",
+                            labelHelpTooltip: "Emit S3 events when replication exceeds 15-minute RTC threshold",
+                            required: enforceRTC,
+                            content: /*#__PURE__*/ jsxs(Stack, {
+                                direction: "vertical",
+                                gap: "r8",
+                                children: [
+                                    /*#__PURE__*/ jsx(Controller, {
+                                        name: "enableRTCNotification",
+                                        control: control,
+                                        render: ({ field })=>/*#__PURE__*/ jsx(Toggle, {
+                                                toggle: field.value,
+                                                onChange: field.onChange,
+                                                label: field.value ? 'Enabled' : 'Disabled',
+                                                disabled: enforceRTC
+                                            })
+                                    }),
+                                    enforceRTC && /*#__PURE__*/ jsx(Text, {
+                                        color: "textSecondary",
+                                        children: "Metrics must be enabled when RTC is enabled"
+                                    })
+                                ]
+                            })
+                        }),
+                        /*#__PURE__*/ jsx(ToggleFormField, {
+                            name: "replicaModifications",
+                            label: "Replica modification sync",
+                            id: "replicaModifications",
+                            control: control,
+                            labelHelpTooltip: "Replicate metadata changes made to replica objects"
+                        }),
+                        /*#__PURE__*/ jsx(FormGroup, {
+                            label: "Delete marker replication",
+                            id: "deleteMarkerReplication",
+                            direction: "horizontal",
+                            error: errors?.deleteMarkerReplication?.message,
+                            helpErrorPosition: "bottom",
+                            labelHelpTooltip: "Replicate delete markers created when objects are deleted in versioned buckets",
+                            content: /*#__PURE__*/ jsxs(Stack, {
+                                direction: "vertical",
+                                gap: "r8",
+                                children: [
+                                    /*#__PURE__*/ jsx(Controller, {
+                                        name: "deleteMarkerReplication",
+                                        control: control,
+                                        render: ({ field })=>/*#__PURE__*/ jsx(Toggle, {
+                                                toggle: field.value,
+                                                onChange: field.onChange,
+                                                label: field.value ? 'Enabled' : 'Disabled',
+                                                disabled: 'tags' === filterType || 'and' === filterType
+                                            })
+                                    }),
+                                    ('tags' === filterType || 'and' === filterType) && /*#__PURE__*/ jsx(Text, {
+                                        color: "textSecondary",
+                                        children: "Delete marker replication is not supported for tag-based filters"
+                                    })
+                                ]
+                            })
+                        })
+                    ]
+                })
+            ]
+        })
+    });
+}
+export { BucketReplicationFormPage };