fix: replaced isMobile with mantine hook

src/app/deals/components/Board/BoardMenu.tsx

@@ -1,8 +1,8 @@
 import React, { FC } from "react";
 import { IconDotsVertical, IconEdit, IconTrash } from "@tabler/icons-react";
-import { isMobile } from "react-device-detect";
 import { Box, Group, Menu, Text } from "@mantine/core";
 import { useBoardsContext } from "@/app/deals/contexts/BoardsContext";
+import useIsMobile from "@/hooks/useIsMobile";
 import { BoardSchema } from "@/lib/client";
 
 type Props = {
@@ -12,8 +12,14 @@ type Props = {
     menuIconSize?: number;
 };
 
-const BoardMenu: FC<Props> = ({ board, startEditing, isHovered = true, menuIconSize = 16 }) => {
+const BoardMenu: FC<Props> = ({
+    board,
+    startEditing,
+    isHovered = true,
+    menuIconSize = 16,
+}) => {
     const { selectedBoard, onDeleteBoard } = useBoardsContext();
+    const isMobile = useIsMobile();
 
     return (
         <Menu>

src/app/deals/components/Boards/Boards.tsx

@@ -6,11 +6,12 @@ import Board from "@/app/deals/components/Board/Board";
 import CreateBoardButton from "@/app/deals/components/CreateBoardButton/CreateBoardButton";
 import { useBoardsContext } from "@/app/deals/contexts/BoardsContext";
 import SortableDnd from "@/components/dnd/SortableDnd";
+import useIsMobile from "@/hooks/useIsMobile";
 import { BoardSchema } from "@/lib/client";
-import { isMobile } from "react-device-detect";
 
 const Boards = () => {
     const { boards, setSelectedBoard, onUpdateBoard } = useBoardsContext();
+    const isMobile = useIsMobile();
 
     const renderBoard = (board: BoardSchema) => {
         return <Board board={board} />;

src/app/deals/components/Funnel/Funnel.tsx

@@ -1,7 +1,6 @@
 "use client";
 
 import React, { FC, ReactNode } from "react";
-import { isMobile } from "react-device-detect";
 import { Group, ScrollArea } from "@mantine/core";
 import CreateStatusButton from "@/app/deals/components/CreateStatusButton/CreateStatusButton";
 import DealCard from "@/app/deals/components/DealCard/DealCard";
@@ -10,11 +9,13 @@ import StatusColumnWrapper from "@/app/deals/components/StatusColumnWrapper/Stat
 import { useDealsContext } from "@/app/deals/contexts/DealsContext";
 import useDealsAndStatusesDnd from "@/app/deals/hooks/useDealsAndStatusesDnd";
 import FunnelDnd from "@/components/dnd/FunnelDnd/FunnelDnd";
+import useIsMobile from "@/hooks/useIsMobile";
 import { DealSchema, StatusSchema } from "@/lib/client";
 import { sortByLexorank } from "@/utils/lexorank";
 
 const Funnel: FC = () => {
     const { deals } = useDealsContext();
+    const isMobile = useIsMobile();
 
     const {
         sortedStatuses,

src/app/deals/components/Header/Header.tsx

@@ -1,17 +1,18 @@
 "use client";
 
 import { IconChevronLeft, IconSettings } from "@tabler/icons-react";
-import { isMobile } from "react-device-detect";
 import { Box, Group, Text } from "@mantine/core";
 import { useBoardsContext } from "@/app/deals/contexts/BoardsContext";
 import { useProjectsContext } from "@/app/deals/contexts/ProjectsContext";
 import ProjectSelect from "@/components/selects/ProjectSelect/ProjectSelect";
 import { ColorSchemeToggle } from "@/components/ui/ColorSchemeToggle/ColorSchemeToggle";
+import useIsMobile from "@/hooks/useIsMobile";
 
 const Header = () => {
     const { projects, setSelectedProject, selectedProject } =
         useProjectsContext();
     const { setIsEditorDrawerOpened } = useBoardsContext();
+    const isMobile = useIsMobile();
 
     const getDesktopHeader = () => {
         return (