@scality/data-browser-library 1.1.5 → 1.1.7

package/dist/components/buckets/BucketReplicationFormPage.js

@@ -45,15 +45,46 @@ const storageClassOptions = [
         label: 'Glacier Instant Retrieval'
     }
 ];
-const createSchema = (hasExistingRules, hasCustomDestination)=>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(),
+const createSchema = (hasExistingRules, hasCustomDestination, isV1)=>{
+    const roleSchema = hasExistingRules ? joi.string().optional() : joi.string().required().messages({
+        'string.empty': 'Role ARN is required for first replication rule'
+    });
+    const ruleIdSchema = 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`
+    });
+    const statusSchema = joi.string().valid(...STATUS_OPTIONS.map((o)=>o.value)).required();
+    const targetBucketSchema = hasCustomDestination ? joi.string().allow('').optional() : joi.string().required().messages({
+        'string.empty': 'Target bucket is required'
+    });
+    if (isV1) return joi.object({
+        role: roleSchema,
+        ruleId: ruleIdSchema,
+        status: statusSchema,
+        prefix: joi.string().allow('').optional(),
+        targetBucket: targetBucketSchema,
+        storageClass: joi.string().allow('').optional(),
+        sameAccount: joi.any().optional(),
+        targetAccountId: joi.any().optional(),
+        priority: joi.any().optional(),
+        filterType: joi.any().optional(),
+        tags: joi.any().optional(),
+        includeEncryptedObjects: joi.any().optional(),
+        replicaModifications: joi.any().optional(),
+        encryptReplicatedObjects: joi.any().optional(),
+        replicaKmsKeyId: joi.any().optional(),
+        enforceRTC: joi.any().optional(),
+        enableRTCNotification: joi.any().optional(),
+        deleteMarkerReplication: joi.any().optional(),
+        switchObjectOwnership: joi.any().optional(),
+        understandISVRisk: joi.boolean().invalid(false).messages({
+            'any.invalid': 'You must acknowledge the risk'
+        })
+    });
+    return joi.object({
+        role: roleSchema,
+        ruleId: ruleIdSchema,
+        status: statusSchema,
         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'
@@ -62,9 +93,7 @@ const createSchema = (hasExistingRules, hasCustomDestination)=>joi.object({
         includeEncryptedObjects: joi.boolean(),
         replicaModifications: joi.boolean(),
         sameAccount: joi.boolean(),
-        targetBucket: hasCustomDestination ? joi.string().allow('').optional() : joi.string().required().messages({
-            'string.empty': 'Target bucket is required'
-        }),
+        targetBucket: targetBucketSchema,
         targetAccountId: hasCustomDestination ? joi.string().allow('').optional() : joi.when('sameAccount', {
             is: false,
             then: joi.string().required().messages({
@@ -101,6 +130,7 @@ const createSchema = (hasExistingRules, hasCustomDestination)=>joi.object({
             'any.invalid': 'You must acknowledge the risk'
         })
     });
+};
 const ruleToFormValues = (rule, role)=>{
     const formValues = {
         role,
@@ -238,7 +268,21 @@ const buildSourceSelectionCriteria = (data)=>{
         }
     };
 };
-const buildReplicationRule = (data, sourceBucketName)=>{
+const buildReplicationRule = (data, sourceBucketName, useV1Format)=>{
+    if (useV1Format) {
+        const bucketName = data.targetBucket || sourceBucketName;
+        return {
+            ID: data.ruleId,
+            Status: data.status,
+            Prefix: data.prefix || '',
+            Destination: {
+                Bucket: `arn:aws:s3:::${bucketName}`,
+                ...data.storageClass && '' !== data.storageClass.trim() && {
+                    StorageClass: data.storageClass
+                }
+            }
+        };
+    }
     const rule = {
         ID: data.ruleId,
         Status: data.status,
@@ -339,7 +383,9 @@ function BucketReplicationFormPage() {
     const { showToast } = useToast();
     const isEditMode = !!ruleId;
     const showAdvancedReplication = useFeatures('replicationAdvanced');
+    const useV1Format = useFeatures('replicationV1');
     const { isISVManaged, isvApplication, isLoading: isISVLoading } = useISVBucketStatus(bucketName);
+    const { data: bucketsData } = useBuckets();
     const { data: replicationData, status: replicationStatus } = useGetBucketReplication({
         Bucket: bucketName
     });
@@ -367,7 +413,7 @@ function BucketReplicationFormPage() {
     }, [
         replicationData
     ]);
-    const dynamicSchema = useMemo(()=>createSchema(hasExistingRules, !!CustomDestinationFields).keys({
+    const dynamicSchema = useMemo(()=>createSchema(hasExistingRules, !!CustomDestinationFields, !!useV1Format).keys({
             ruleId: joi.string().required().invalid(...existingRuleIds).messages({
                 'string.empty': 'Rule ID is required',
                 'any.invalid': 'A rule with this ID already exists'
@@ -375,7 +421,8 @@ function BucketReplicationFormPage() {
         }), [
         existingRuleIds,
         hasExistingRules,
-        CustomDestinationFields
+        CustomDestinationFields,
+        useV1Format
     ]);
     const methods = useForm({
         resolver: joiResolver(dynamicSchema),
@@ -532,7 +579,7 @@ function BucketReplicationFormPage() {
     ]);
     const onSubmit = useCallback((data)=>{
         if (!bucketName) return;
-        const rule = buildReplicationRule(data, bucketName);
+        const rule = buildReplicationRule(data, bucketName, !!useV1Format);
         const existingRules = replicationData?.ReplicationConfiguration?.Rules || [];
         const updatedRules = isEditMode ? existingRules.map((r)=>r.ID === existingRule?.ID ? rule : r) : [
             ...existingRules,
@@ -569,7 +616,8 @@ function BucketReplicationFormPage() {
         showToast,
         replicationData,
         isEditMode,
-        existingRule
+        existingRule,
+        useV1Format
     ]);
     if ('pending' === replicationStatus || isISVLoading) return /*#__PURE__*/ jsx(Loader, {
         centered: true,
@@ -718,7 +766,7 @@ function BucketReplicationFormPage() {
                                     })
                             })
                         }),
-                        /*#__PURE__*/ jsx(FormGroup, {
+                        useV1Format ? /*#__PURE__*/ jsx(Fragment, {}) : /*#__PURE__*/ jsx(FormGroup, {
                             label: "Rule priority",
                             id: "priority",
                             direction: "horizontal",
@@ -743,7 +791,25 @@ function BucketReplicationFormPage() {
                         })
                     ]
                 }),
-                /*#__PURE__*/ jsx(FilterFormSection, {
+                useV1Format ? /*#__PURE__*/ jsx(FormSection, {
+                    title: {
+                        name: 'Prefix'
+                    },
+                    forceLabelWidth: convertRemToPixels(15),
+                    children: /*#__PURE__*/ jsx(FormGroup, {
+                        label: "Prefix",
+                        id: "prefix",
+                        direction: "horizontal",
+                        error: errors?.prefix?.message,
+                        helpErrorPosition: "bottom",
+                        labelHelpTooltip: "Object key prefix to filter which objects are replicated",
+                        content: /*#__PURE__*/ jsx(Input, {
+                            id: "prefix",
+                            placeholder: "folder/",
+                            ...register('prefix')
+                        })
+                    })
+                }) : /*#__PURE__*/ jsx(FilterFormSection, {
                     filterType: filterType,
                     onFilterTypeChange: (value)=>methods.setValue('filterType', value),
                     prefixRegister: register('prefix'),
@@ -766,6 +832,32 @@ function BucketReplicationFormPage() {
                             storageClassField,
                             /*#__PURE__*/ jsx(CustomDestinationFields, {})
                         ]
+                    }) : useV1Format ? /*#__PURE__*/ jsxs(Fragment, {
+                        children: [
+                            /*#__PURE__*/ jsx(FormGroup, {
+                                label: "Target Bucket",
+                                id: "targetBucket",
+                                direction: "horizontal",
+                                error: errors?.targetBucket?.message,
+                                helpErrorPosition: "bottom",
+                                required: true,
+                                content: /*#__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: (bucketsData?.Buckets || []).filter((bucket)=>bucket.Name !== bucketName).map((bucket)=>/*#__PURE__*/ jsx(Select.Option, {
+                                                    value: bucket.Name || '',
+                                                    children: bucket.Name
+                                                }, bucket.Name))
+                                        })
+                                })
+                            }),
+                            storageClassField
+                        ]
                     }) : /*#__PURE__*/ jsxs(Fragment, {
                         children: [
                             /*#__PURE__*/ jsx(DefaultReplicationDestinationFields, {}),
@@ -773,7 +865,7 @@ function BucketReplicationFormPage() {
                         ]
                     })
                 }),
-                /*#__PURE__*/ jsxs(FormSection, {
+                useV1Format ? null : /*#__PURE__*/ jsxs(FormSection, {
                     title: {
                         name: 'Encryption'
                     },
@@ -837,7 +929,7 @@ function BucketReplicationFormPage() {
                         }) : /*#__PURE__*/ jsx(Fragment, {})
                     ]
                 }),
-                showAdvancedReplication && /*#__PURE__*/ jsxs(FormSection, {
+                showAdvancedReplication && !useV1Format ? /*#__PURE__*/ jsxs(FormSection, {
                     title: {
                         name: 'Additional Options'
                     },
@@ -915,7 +1007,7 @@ function BucketReplicationFormPage() {
                             })
                         })
                     ]
-                })
+                }) : null
             ]
         })
     });

package/dist/components/objects/CreateFolderButton.js

@@ -21,7 +21,8 @@ const CreateFolderButton = ({ bucket, prefix = '', label = 'Folder', variant = '
     }, []);
     const handleSave = useCallback(()=>{
         if (!folderName.trim()) return;
-        const folderKey = prefix ? `${prefix}/${folderName}/` : `${folderName}/`;
+        const normalizedPrefix = prefix.endsWith('/') ? prefix.slice(0, -1) : prefix;
+        const folderKey = normalizedPrefix ? `${normalizedPrefix}/${folderName}/` : `${folderName}/`;
         createFolderMutation.mutate({
             Bucket: bucket,
             Key: folderKey,

package/dist/components/objects/DeleteObjectButton.js

@@ -1,9 +1,11 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { Banner, Icon, Modal, PrettyBytes, Stack, Text, Wrap, spacing, useToast } from "@scality/core-ui";
+import { Banner, Checkbox, Icon, Modal, PrettyBytes, Stack, Text, Wrap, spacing, useToast } from "@scality/core-ui";
 import { Box, Button } from "@scality/core-ui/dist/next";
 import { useCallback, useEffect, useState } from "react";
 import { useDeleteObjects, useGetBucketVersioning } from "../../hooks/index.js";
+import { useDeleteFolder } from "../../hooks/useDeleteFolder.js";
 import { getDeletionMessages } from "../../utils/deletion/index.js";
+import { useInvalidateQueries } from "../providers/DataBrowserProvider.js";
 import { DeleteObjectModalContent } from "../ui/DeleteObjectModalContent.js";
 const Title = ({ objects, isCurrentSelectionPermanentlyDeleted })=>{
     const foldersSize = objects.filter((object)=>'folder' === object.type).length;
@@ -43,14 +45,18 @@ const Title = ({ objects, isCurrentSelectionPermanentlyDeleted })=>{
 const DeleteObjectButton = ({ objects, bucketName, onDeleteSuccess })=>{
     const [isModalOpen, setIsModalOpen] = useState(false);
     const [selectedObjects, setSelectedObjects] = useState(objects);
+    const [isDeleting, setIsDeleting] = useState(false);
     const { data: versioningData } = useGetBucketVersioning({
         Bucket: bucketName
     });
-    const { mutate: deleteObjects, status: deleteObjectsStatus } = useDeleteObjects();
+    const { mutateAsync: deleteObjects } = useDeleteObjects();
+    const { mutateAsync: deleteFolder } = useDeleteFolder();
+    const invalidateQueries = useInvalidateQueries();
     const { showToast } = useToast();
     const isVersioningEnabled = versioningData?.Status === 'Enabled';
     const isCurrentSelectionPermanentlyDeleted = !isVersioningEnabled || selectedObjects.some((object)=>!!object.VersionId);
-    const { info: notificationText } = getDeletionMessages({
+    const [isCheckboxToggled, setIsCheckboxToggled] = useState(false);
+    const { info: notificationText, checkboxRequired } = getDeletionMessages({
         numberOfObjects: selectedObjects.length,
         selectedObjectsAreSpecificVersions: isCurrentSelectionPermanentlyDeleted,
         isBucketVersioned: isVersioningEnabled
@@ -61,51 +67,82 @@ const DeleteObjectButton = ({ objects, bucketName, onDeleteSuccess })=>{
     const cancel = useCallback(()=>{
         setIsModalOpen(false);
         setSelectedObjects(objects);
+        setIsCheckboxToggled(false);
     }, [
         objects
     ]);
-    const deleteSelectedFiles = useCallback(()=>{
-        const objectsToDelete = selectedObjects.filter((object)=>'folder' !== object.type && object.Key).map((object)=>{
-            const deleteItem = {
-                Key: object.Key
-            };
-            if (object.VersionId && 'string' == typeof object.VersionId) deleteItem.VersionId = object.VersionId;
-            return deleteItem;
-        });
-        const foldersToDelete = selectedObjects.filter((object)=>'folder' === object.type && object.Key).map((object)=>({
-                Key: object.Key
-            }));
-        deleteObjects({
-            Bucket: bucketName,
-            Delete: {
-                Objects: [
-                    ...objectsToDelete,
-                    ...foldersToDelete
-                ]
-            }
-        }, {
-            onSuccess: ()=>{
-                showToast({
-                    open: true,
-                    message: 'Objects deleted successfully',
-                    status: 'success'
-                });
-                setIsModalOpen(false);
-                onDeleteSuccess?.();
-            },
-            onError: (error)=>{
-                showToast({
-                    open: true,
-                    message: error instanceof Error ? error.message : 'Objects deleted failed',
-                    status: 'error'
+    const deleteSelectedFiles = useCallback(async ()=>{
+        setIsDeleting(true);
+        try {
+            const folderItems = selectedObjects.filter((object)=>'folder' === object.type && object.Key);
+            const nonFolderItems = selectedObjects.filter((object)=>'folder' !== object.type && object.Key);
+            if (nonFolderItems.length > 0) {
+                const result = await deleteObjects({
+                    Bucket: bucketName,
+                    Delete: {
+                        Objects: nonFolderItems.map((object)=>{
+                            const deleteItem = {
+                                Key: object.Key
+                            };
+                            if (object.VersionId && 'string' == typeof object.VersionId) deleteItem.VersionId = object.VersionId;
+                            return deleteItem;
+                        })
+                    }
                 });
-                setIsModalOpen(false);
+                if (result.Errors && result.Errors.length > 0) {
+                    const firstError = result.Errors[0];
+                    throw new Error(firstError.Message ?? 'Failed to delete objects');
+                }
             }
-        });
+            for (const folder of folderItems)await deleteFolder({
+                Bucket: bucketName,
+                FolderKey: folder.Key
+            });
+            const hasFolders = folderItems.length > 0;
+            const hasObjects = nonFolderItems.length > 0;
+            const message = hasFolders && hasObjects ? 'Objects and folders deleted successfully' : hasFolders ? 'Folders deleted successfully' : 'Objects deleted successfully';
+            showToast({
+                open: true,
+                message,
+                status: 'success'
+            });
+            onDeleteSuccess?.();
+        } catch (error) {
+            showToast({
+                open: true,
+                message: error instanceof Error ? error.message : 'Failed to delete objects',
+                status: 'error'
+            });
+        } finally{
+            invalidateQueries({
+                queryKey: [
+                    'ListObjects'
+                ]
+            });
+            invalidateQueries({
+                queryKey: [
+                    'ListObjectVersions'
+                ]
+            });
+            invalidateQueries({
+                queryKey: [
+                    'SearchObjects'
+                ]
+            });
+            invalidateQueries({
+                queryKey: [
+                    'SearchObjectsVersions'
+                ]
+            });
+            setIsModalOpen(false);
+            setIsDeleting(false);
+        }
     }, [
         bucketName,
         selectedObjects,
         deleteObjects,
+        deleteFolder,
+        invalidateQueries,
         showToast,
         onDeleteSuccess
     ]);
@@ -142,11 +179,11 @@ const DeleteObjectButton = ({ objects, bucketName, onDeleteSuccess })=>{
                                     label: "Cancel"
                                 }),
                                 /*#__PURE__*/ jsx(Button, {
-                                    isLoading: 'pending' === deleteObjectsStatus,
+                                    isLoading: isDeleting,
                                     id: "object-delete-delete-button",
                                     variant: "danger",
                                     onClick: deleteSelectedFiles,
-                                    disabled: 0 === selectedObjects.length,
+                                    disabled: 0 === selectedObjects.length || checkboxRequired && !isCheckboxToggled,
                                     label: "Delete"
                                 })
                             ]
@@ -164,8 +201,8 @@ const DeleteObjectButton = ({ objects, bucketName, onDeleteSuccess })=>{
                     }),
                     /*#__PURE__*/ jsx(DeleteObjectModalContent, {
                         objects: selectedObjects,
-                        onRemove: (key)=>{
-                            setSelectedObjects(selectedObjects.filter((object)=>object.Key !== key));
+                        onRemove: (item)=>{
+                            setSelectedObjects(selectedObjects.filter((object)=>!(object.Key === item.Key && object.VersionId === item.VersionId)));
                         }
                     }),
                     /*#__PURE__*/ jsxs(Box, {
@@ -185,6 +222,15 @@ const DeleteObjectButton = ({ objects, bucketName, onDeleteSuccess })=>{
                         children: /*#__PURE__*/ jsx("span", {
                             children: notificationText
                         })
+                    }),
+                    checkboxRequired && selectedObjects.length > 0 && /*#__PURE__*/ jsx(Box, {
+                        mt: spacing.r12,
+                        children: /*#__PURE__*/ jsx(Checkbox, {
+                            id: "confirm-deletion-checkbox",
+                            label: "Confirm the deletion",
+                            checked: isCheckboxToggled,
+                            onChange: ()=>setIsCheckboxToggled((prev)=>!prev)
+                        })
                     })
                 ]
             })

package/dist/components/objects/ObjectList.js

@@ -275,7 +275,27 @@ function createOverrideMap(customItems) {
 const ObjectList = ({ bucketName, prefix, onObjectSelect, onPrefixChange, onSelectedObjectsChange })=>{
     const { extraObjectListColumns, extraObjectListActions } = useDataBrowserUICustomization();
     const invalidateQueries = useInvalidateQueries();
+    const versionCheck = useListObjectVersions({
+        Bucket: bucketName,
+        MaxKeys: 10
+    }, {
+        enabled: Boolean(bucketName)
+    });
+    const hasObjectVersions = useMemo(()=>{
+        const firstPage = versionCheck.data?.pages?.[0];
+        if (!firstPage) return false;
+        const versions = firstPage.Versions || [];
+        const deleteMarkers = firstPage.DeleteMarkers || [];
+        return versions.some((v)=>v.VersionId && 'null' !== v.VersionId) || deleteMarkers.length > 0;
+    }, [
+        versionCheck.data
+    ]);
     const [showVersions, setShowVersions] = useState(false);
+    useEffect(()=>{
+        if (!hasObjectVersions) setShowVersions(false);
+    }, [
+        hasObjectVersions
+    ]);
     const isMetadataSearchEnabled = useFeatures('metadatasearch');
     const queryParams = useQueryParams();
     const metadataSearchQuery = queryParams.get('metadatasearch');
@@ -787,6 +807,7 @@ const ObjectList = ({ bucketName, prefix, onObjectSelect, onPrefixChange, onSele
                                             toggle: showVersions,
                                             onChange: (e)=>setShowVersions(e.target.checked),
                                             label: "List Versions",
+                                            disabled: !hasObjectVersions,
                                             "aria-label": showVersions ? 'Hide object versions' : 'Show object versions',
                                             "aria-pressed": showVersions
                                         })

package/dist/components/objects/UploadButton.js

@@ -155,9 +155,10 @@ const UploadButton = ({ bucket, prefix = '', uploadOptions = {}, onUploadSuccess
         const failedFiles = [];
         for (const file of acceptedFiles)try {
             const fileBuffer = await file.arrayBuffer();
+            const normalizedPrefix = prefix.endsWith('/') ? prefix.slice(0, -1) : prefix;
             await uploadMutation.mutateAsync({
                 Bucket: bucket,
-                Key: prefix ? `${prefix}/${file.name}` : file.name,
+                Key: normalizedPrefix ? `${normalizedPrefix}/${file.name}` : file.name,
                 Body: new Uint8Array(fileBuffer),
                 ContentType: file.type,
                 ...uploadOptions

package/dist/components/ui/DeleteObjectModalContent.d.ts

@@ -1,5 +1,8 @@
 import type { Objects } from '../objects/DeleteObjectButton';
 export declare const DeleteObjectModalContent: ({ objects, onRemove, }: {
     objects: Objects;
-    onRemove: (key: string) => void;
+    onRemove: (item: {
+        Key: string;
+        VersionId?: string;
+    }) => void;
 }) => import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/DeleteObjectModalContent.js

@@ -1,46 +1,89 @@
-import { jsx } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { ConstrainedText, Icon, PrettyBytes, spacing } from "@scality/core-ui";
-import { tableRowHeight } from "@scality/core-ui/dist/components/tablev2/TableUtils";
 import { Box, Table } from "@scality/core-ui/dist/next";
 import { useMemo } from "react";
 import styled_components from "styled-components";
+const NAME_COLUMN_FLEX = '3';
+const SIZE_COLUMN_FLEX = '1';
 const Container = styled_components(Box)`
-  height: ${({ height })=>height};
-  min-height: 15.63rem;
+  width: 31.25rem;
+  height: 15.63rem;
+  overflow-y: auto;
+  border: 1px solid ${({ theme })=>theme.border};
   margin: ${spacing.r8} 0rem;
 `;
+const VersionId = styled_components.div`
+  font-size: 0.75rem;
+  color: ${({ theme })=>theme.textSecondary};
+`;
 const DeleteObjectModalContent = ({ objects, onRemove })=>{
     const columns = useMemo(()=>[
             {
                 Header: 'Name',
                 accessor: 'Key',
-                Cell: ({ value })=>/*#__PURE__*/ jsx(ConstrainedText, {
-                        text: value,
-                        lineClamp: 1
-                    }),
+                cellStyle: {
+                    flex: NAME_COLUMN_FLEX,
+                    minWidth: 0
+                },
+                Cell: ({ value, row })=>{
+                    const versionId = 'VersionId' in row.original ? row.original.VersionId : void 0;
+                    return /*#__PURE__*/ jsxs("div", {
+                        style: {
+                            minWidth: 0
+                        },
+                        children: [
+                            /*#__PURE__*/ jsx(ConstrainedText, {
+                                text: value,
+                                lineClamp: 1
+                            }),
+                            versionId && /*#__PURE__*/ jsx(VersionId, {
+                                children: versionId
+                            })
+                        ]
+                    });
+                },
                 id: 'name'
             },
             {
                 Header: 'Size',
                 accessor: 'Size',
                 cellStyle: {
+                    flex: SIZE_COLUMN_FLEX,
                     textAlign: 'right'
                 },
-                Cell: ({ value })=>/*#__PURE__*/ jsx(PrettyBytes, {
-                        bytes: Number(value)
-                    }),
+                Cell: ({ value, row })=>{
+                    const isLegalHoldEnabled = 'isLegalHoldEnabled' in row.original && row.original.isLegalHoldEnabled;
+                    return /*#__PURE__*/ jsxs(Box, {
+                        display: "flex",
+                        alignItems: "center",
+                        gap: spacing.r4,
+                        justifyContent: "flex-end",
+                        children: [
+                            void 0 !== value && /*#__PURE__*/ jsx(PrettyBytes, {
+                                bytes: Number(value)
+                            }),
+                            isLegalHoldEnabled && /*#__PURE__*/ jsx(Icon, {
+                                name: "Rebalance",
+                                size: "sm"
+                            })
+                        ]
+                    });
+                },
                 id: 'size'
             },
             {
                 Header: '',
                 accessor: 'type',
                 cellStyle: {
-                    width: '0.625rem'
+                    flex: '0 0 2rem'
                 },
                 Cell: (row)=>{
-                    const objectKey = row.row.original.Key;
+                    const item = row.row.original;
                     return /*#__PURE__*/ jsx("div", {
-                        onClick: ()=>onRemove(objectKey),
+                        onClick: ()=>onRemove({
+                                Key: item.Key,
+                                VersionId: 'VersionId' in item ? item.VersionId : void 0
+                            }),
                         children: /*#__PURE__*/ jsx(Icon, {
                             name: "Close",
                             color: "buttonSecondary"
@@ -51,11 +94,7 @@ const DeleteObjectModalContent = ({ objects, onRemove })=>{
         ], [
         onRemove
     ]);
-    const HEADER_AND_SPACING_ROWS = 3;
-    const rowHeight = 'h40';
-    const tableRowHeightInRem = tableRowHeight[rowHeight];
     return /*#__PURE__*/ jsx(Container, {
-        height: `calc(${objects.length + HEADER_AND_SPACING_ROWS} * (${tableRowHeightInRem}rem + 1px))`,
         children: /*#__PURE__*/ jsx(Table, {
             columns: columns,
             data: objects,

package/dist/hooks/__tests__/useDeleteFolder.test.d.ts

@@ -0,0 +1 @@
+export {};