Client: added reorder action, fixed change index

packages/client/src/pages/Home/Section/Header/index.js

@@ -316,6 +316,7 @@ const SectionHeaderContent = (props) => {
     deleteRooms,
     setSelection,
     startUpload,
+    reorder,
   } = props;
 
   const navigate = useNavigate();
@@ -1291,7 +1292,12 @@ const SectionHeaderContent = (props) => {
     isMobileView: currentDeviceType === DeviceType.mobile,
   };
 
-  const tableIndexHeaderProps = { setIsIndexEditingMode, t };
+  const tableIndexHeaderProps = {
+    setIsIndexEditingMode,
+    t,
+    reorder,
+    selectedFolder,
+  };
 
   if (isAccountsPage && !(isGroupsPage && isRoomAdmin)) {
     tableGroupMenuVisible =
@@ -1590,6 +1596,7 @@ export default inject(
       moveToPublicRoom,
       onClickCreateRoom,
       deleteRooms,
+      reorder,
     } = filesActionsStore;
 
     const { oformsFilter } = oformsStore;
@@ -1828,6 +1835,7 @@ export default inject(
       setSelection,
       setShareFolderDialogVisible,
       startUpload,
+      reorder,
     };
   },
 )(

packages/client/src/pages/Home/Section/IndexHeader/index.js

@@ -102,7 +102,12 @@ const StyledTableIndexMenu = styled.div`
   }
 `;
 
-const TableIndexHeader = ({ setIsIndexEditingMode, t }) => {
+const TableIndexHeader = ({
+  setIsIndexEditingMode,
+  t,
+  reorder,
+  selectedFolder,
+}) => {
   return (
     <StyledTableIndexMenu>
       <div className="table-header_index-container">
@@ -111,7 +116,10 @@ const TableIndexHeader = ({ setIsIndexEditingMode, t }) => {
         </Text>
 
         <div className="table-header_index-separator" />
-        <div className="table-header_reorder-container">
+        <div
+          className="table-header_reorder-container"
+          onClick={() => reorder(selectedFolder?.id)}
+        >
           <IconButton
             className="table-header_reorder-icon"
             size="16"

packages/client/src/store/FilesActionsStore.js

@@ -2731,6 +2731,7 @@ class FilesActionStore {
     const operationId = uniqueid("operation_");
     const isUpperIndex = action === VDRIndexingAction.HigherIndex;
     const isLowerIndex = action === VDRIndexingAction.LowerIndex;
+
     let replaceable;
     if (isUpperIndex && index !== 0) {
       replaceable = filesList[index - 1];
@@ -2745,9 +2746,10 @@ class FilesActionStore {
     this.updateCurrentFolder(null, [id], true, operationId);
   };
 
-  reorder = async () => {
-    // console.log("reorder");
-    await reorder(item?.id);
+  reorder = async (id) => {
+    const operationId = uniqueid("operation_");
+    await reorder(id);
+    this.updateCurrentFolder(null, [id], true, operationId);
   };
 }
 

packages/shared/api/files/index.ts

@@ -1403,6 +1403,6 @@ export async function changeIndex(
 export async function reorder(id: number) {
   return request({
     method: "put",
-    url: `api/2.0/files/rooms/${id}/reorder`,
+    url: `/files/rooms/${id}/reorder`,
   });
 }

packages/shared/components/table/TableRow.tsx

@@ -87,6 +87,11 @@ const TableRow = (props: TableRowProps) => {
     return contextOptions;
   };
 
+  const changeIndex = (e, action) => {
+    e.stopPropagation();
+    onChangeIndex(action);
+  };
+
   return (
     <StyledTableRow
       onContextMenu={onContextMenu}
@@ -108,14 +113,14 @@ const TableRow = (props: TableRowProps) => {
                 iconName={ArrowReactSvgUrl}
                 className="index-up-icon"
                 size="small"
-                onClick={() => onChangeIndex(VDRIndexingAction.HigherIndex)}
+                onClick={(e) => changeIndex(e, VDRIndexingAction.HigherIndex)}
               />
               <ColorTheme
                 themeId={ThemeId.IndexIconButton}
                 iconName={ArrowReactSvgUrl}
                 className="index-down-icon"
                 size="small"
-                onClick={() => onChangeIndex(VDRIndexingAction.LowerIndex)}
+                onClick={(e) => changeIndex(e, VDRIndexingAction.LowerIndex)}
               />
             </>
           ) : (