Client: added changeIndex to row view

packages/client/src/pages/Home/Section/Body/RowsView/FilesRowContainer.js

@@ -75,6 +75,7 @@ const FilesRowContainer = ({
   highlightFile,
   currentDeviceType,
   isIndexEditingMode,
+  changeIndex,
 }) => {
   useViewEffect({
     view: viewAs,
@@ -94,6 +95,7 @@ const FilesRowContainer = ({
         sectionWidth={sectionWidth}
         isRooms={isRooms}
         isTrashFolder={isTrashFolder}
+        changeIndex={changeIndex}
         isHighlight={
           highlightFile.id == item.id && highlightFile.isExst === !item.fileExst
         }
@@ -132,6 +134,7 @@ export default inject(
     infoPanelStore,
     treeFoldersStore,
     indexingStore,
+    filesActionsStore,
   }) => {
     const {
       filesList,
@@ -164,6 +167,7 @@ export default inject(
       highlightFile,
       currentDeviceType,
       isIndexEditingMode,
+      changeIndex: filesActionsStore.changeIndex,
     };
   },
 )(observer(FilesRowContainer));

packages/client/src/pages/Home/Section/Body/RowsView/SimpleFilesRow.js

@@ -77,6 +77,16 @@ const StyledWrapper = styled.div`
         `${props.theme.filesSection.tableView.row.borderColor} !important`};
     `};
 
+  ${(props) =>
+    props.isIndexUpdated &&
+    css`
+      background: ${(props) =>
+        props.isIndexEditingMode
+          ? `${props.theme.filesSection.tableView.row.indexActive} !important`
+          : `${props.theme.filesSection.tableView.row.backgroundActive} !important`};
+      ${marginStyles}
+    `}
+
   ${(props) =>
     !isMobile &&
     !props.isDragging &&
@@ -369,6 +379,8 @@ const SimpleFilesRow = (props) => {
     badgeUrl,
     canDrag,
     isIndexEditingMode,
+    changeIndex,
+    isIndexUpdated,
   } = props;
 
   const isMobileDevice = isMobileUtile();
@@ -378,6 +390,10 @@ const SimpleFilesRow = (props) => {
   const withAccess = item.security?.Lock;
   const isSmallContainer = sectionWidth <= 500;
 
+  const onChangeIndex = (action) => {
+    return changeIndex(action, item);
+  };
+
   const element = (
     <ItemIcon
       id={item.id}
@@ -434,6 +450,8 @@ const SimpleFilesRow = (props) => {
       checked={checkedProps}
       isActive={isActive}
       showHotkeyBorder={showHotkeyBorder}
+      isIndexEditingMode={isIndexEditingMode}
+      isIndexUpdated={isIndexUpdated}
       isFirstElem={itemIndex === 0}
       isHighlight={isHighlight}
     >
@@ -470,6 +488,7 @@ const SimpleFilesRow = (props) => {
           dragging={dragging && isDragging}
           isDragging={dragging}
           isIndexEditingMode={isIndexEditingMode}
+          onChangeIndex={onChangeIndex}
           isActive={isActive}
           inProgress={inProgress}
           isThirdPartyFolder={item.isThirdPartyFolder}

packages/shared/components/row/Row.tsx

@@ -26,8 +26,8 @@
 
 import React, { useRef } from "react";
 import ArrowReactSvgUrl from "PUBLIC_DIR/images/arrow2.react.svg?url";
-
 import { isMobile } from "react-device-detect"; // TODO: isDesktop=true for IOS(Firefox & Safari)
+import { VDRIndexingAction } from "../../enums";
 import { isMobile as isMobileUtils } from "../../utils/device";
 
 import { Checkbox } from "../checkbox";
@@ -60,6 +60,7 @@ const Row = (props: RowProps) => {
     onSelect,
     onRowClick,
     onContextClick,
+    onChangeIndex,
 
     getContextModel,
     isRoom,
@@ -146,6 +147,11 @@ const Row = (props: RowProps) => {
     onSelect?.(true, data);
   };
 
+  const changeIndex = (e, action) => {
+    e.stopPropagation();
+    onChangeIndex(action);
+  };
+
   return (
     <StyledRow
       ref={row}
@@ -223,14 +229,14 @@ const Row = (props: RowProps) => {
               iconName={ArrowReactSvgUrl}
               className="index-up-icon"
               size="small"
-              // onClick={onClickShare}
+              onClick={(e) => changeIndex(e, VDRIndexingAction.HigherIndex)}
             />
             <ColorTheme
               themeId={ThemeId.IndexIconButton}
               iconName={ArrowReactSvgUrl}
               className="index-down-icon"
               size="small"
-              // onClick={onClickShare}
+              onClick={(e) => changeIndex(e, VDRIndexingAction.LowerIndex)}
             />
           </>
         ) : (