diff --git a/portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ListObjects/ListObjects.tsx b/portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ListObjects/ListObjects.tsx index c454b885bf..2f2be4a687 100644 --- a/portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ListObjects/ListObjects.tsx +++ b/portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ListObjects/ListObjects.tsx @@ -301,6 +301,7 @@ const ListObjects = ({ const [loadingLocking, setLoadingLocking] = useState(true); const [lockingEnabled, setLockingEnabled] = useState(false); const [rewindSelect, setRewindSelect] = useState(false); + const [selectedMainObject, setSelectedMainObject] = useState(null); const [selectedObjects, setSelectedObjects] = useState([]); const [previewOpen, setPreviewOpen] = useState(false); const [selectedPreview, setSelectedPreview] = useState( @@ -714,6 +715,7 @@ const ListObjects = ({ if (refresh) { setSnackBarMessage(`Objects deleted successfully.`); setSelectedObjects([]); + setSelectedMainObject(null); setLoading(true); } }; @@ -1028,26 +1030,6 @@ const ListObjects = ({ setSelectedPreview(null); }; - const selectListObjects = (e: React.ChangeEvent) => { - const targetD = e.target; - const value = targetD.value; - const checked = targetD.checked; - - let elements: string[] = [...selectedObjects]; // We clone the selectedBuckets array - - if (checked) { - // If the user has checked this field we need to push this to selectedBucketsList - elements.push(value); - } else { - // User has unchecked this field, we need to remove it from the list - elements = elements.filter((element) => element !== value); - } - setSelectedObjects(elements); - setSelectedInternalPaths(null); - - return elements; - }; - const sortChange = (sortData: any) => { const newSortDirection = get(sortData, "sortDirection", "DESC"); setCurrentSortField(sortData.sortBy); @@ -1069,6 +1051,49 @@ const ListObjects = ({ payload = sortASC.reverse(); } + const selectListObjects = (e: React.ChangeEvent) => { + const targetD = e.target; + const value = targetD.value; + let checked = targetD.checked; + // @ts-ignore shiftKey is defined for click events + const shift: bool = e.nativeEvent.shiftKey; + // @ts-ignore ctrlKey is defined for click events + const ctrl: bool = e.nativeEvent.ctrlKey; + let elements: string[] = ctrl ? [...selectedObjects] : []; // We clone the selectedBuckets array + + let mainObject = value; + // Use the shift effect if different elements are selected + if (shift && selectedMainObject !== null) { + // Repeat the previous steps for everyone in the range + mainObject = selectedMainObject; + checked = elements.indexOf(mainObject) !== -1 || (shift && !ctrl); + } else { + setSelectedMainObject(value); + } + + const [min, max] = [ + payload.findIndex(object => object.name === value), + payload.findIndex(object => object.name === mainObject), + ].sort((a, b) => a - b); // correctly sort an array of numbers + for (let i = min; i <= max; i++) { + const current = payload[i].name; + if (checked) { + // If the user has checked this field we need to push this to selectedBucketsList + if (elements.indexOf(current) === -1) { + elements.push(current); + } + } else { + // User has unchecked this field, we need to remove it from the list + elements = elements.filter((element) => element !== current); + } + } + + setSelectedObjects(elements); + setSelectedInternalPaths(null); + + return elements; + }; + const selectAllItems = () => { setSelectedInternalPaths(null);