fix: fixed drawers sorting

src/app/deals/drawers/ProjectBoardsEditorDrawer/components/BoardMobile.tsx

@@ -2,15 +2,16 @@ import React, { FC } from "react";
 import { Box, Group, Text } from "@mantine/core";
 import { modals } from "@mantine/modals";
 import BoardMenu from "@/app/deals/components/shared/BoardMenu/BoardMenu";
-import { BoardSchema, UpdateBoardSchema } from "@/lib/client";
+import { useProjectBoardsContext } from "@/app/deals/drawers/ProjectBoardsEditorDrawer/contexts/ProjectBoardsContext";
+import { BoardSchema } from "@/lib/client";
 
 type Props = {
     board: BoardSchema;
-    onUpdateBoard: (boardId: number, board: UpdateBoardSchema) => void;
-    onDeleteBoard: (board: BoardSchema) => void;
 };
 
-const BoardMobile: FC<Props> = ({ board, onUpdateBoard, onDeleteBoard }) => {
+const BoardMobile: FC<Props> = ({ board }) => {
+    const { onUpdateBoard, onDeleteBoard } = useProjectBoardsContext();
+
     const startEditing = () => {
         modals.openContextModal({
             modal: "enterNameModal",

src/app/deals/drawers/ProjectBoardsEditorDrawer/components/BoardsDrawerBody.tsx

@@ -12,7 +12,7 @@ type Props = {
 };
 
 const BoardsDrawerBody: FC<Props> = ({ onClose }) => {
-    const { boards, onUpdateBoard, onDeleteBoard, project, onCreateBoard } =
+    const { boards, onUpdateBoard, project, onCreateBoard } =
         useProjectBoardsContext();
 
     const renderDraggable = () => (
@@ -28,11 +28,7 @@ const BoardsDrawerBody: FC<Props> = ({ onClose }) => {
         return (
             <Group wrap={"nowrap"}>
                 {renderDraggable && renderDraggable(board)}
-                <BoardMobile
-                    board={board}
-                    onDeleteBoard={onDeleteBoard}
-                    onUpdateBoard={onUpdateBoard}
-                />
+                <BoardMobile board={board} />
             </Group>
         );
     };

src/components/dnd/SortableDnd/SortableDnd.tsx

@@ -8,7 +8,10 @@ import React, {
     useState,
 } from "react";
 import { Active, DndContext, DragEndEvent } from "@dnd-kit/core";
-import { restrictToHorizontalAxis } from "@dnd-kit/modifiers";
+import {
+    restrictToHorizontalAxis,
+    restrictToVerticalAxis,
+} from "@dnd-kit/modifiers";
 import { SortableContext } from "@dnd-kit/sortable";
 import { LexoRank } from "lexorank";
 import { FreeMode, Mousewheel, Scrollbar } from "swiper/modules";
@@ -179,9 +182,13 @@ const SortableDnd = <T extends BaseItem>({
         </Flex>
     );
 
+    const restrictModifier = vertical
+        ? restrictToVerticalAxis
+        : restrictToHorizontalAxis;
+
     return (
         <DndContext
-            modifiers={[restrictToHorizontalAxis]}
+            modifiers={[restrictModifier]}
             sensors={sensors}
             onDragStart={({ active }) => setActive(active)}
             onDragEnd={onDragEndLocal}

src/hooks/useStatusesOperations.tsx

@@ -15,7 +15,11 @@ import {
     updateStatusMutation,
 } from "@/lib/client/@tanstack/react-query.gen";
 import { notifications } from "@/lib/notifications";
-import { getMaxByLexorank, getNewLexorank } from "@/utils/lexorank";
+import {
+    getMaxByLexorank,
+    getNewLexorank,
+    sortByLexorank,
+} from "@/utils/lexorank";
 
 type Props = {
     statuses: StatusSchema[];
@@ -87,16 +91,18 @@ export const useStatusesOperations = ({
         });
 
         setStatuses(statuses =>
-            statuses.map(oldStatus =>
-                oldStatus.id !== statusId
-                    ? oldStatus
-                    : {
-                          id: oldStatus.id,
-                          name: status.name ? status.name : oldStatus.name,
-                          lexorank: status.lexorank
-                              ? status.lexorank
-                              : oldStatus.lexorank,
-                      }
+            sortByLexorank(
+                statuses.map(oldStatus =>
+                    oldStatus.id !== statusId
+                        ? oldStatus
+                        : {
+                              id: oldStatus.id,
+                              name: status.name ? status.name : oldStatus.name,
+                              lexorank: status.lexorank
+                                  ? status.lexorank
+                                  : oldStatus.lexorank,
+                          }
+                )
             )
         );
     };