diff --git a/src/app/deals/components/Boards/Boards.tsx b/src/app/deals/components/Boards/Boards.tsx
index 04626d7..09a3bd3 100644
--- a/src/app/deals/components/Boards/Boards.tsx
+++ b/src/app/deals/components/Boards/Boards.tsx
@@ -7,6 +7,7 @@ import CreateBoardButton from "@/app/deals/components/CreateBoardButton/CreateBo
import { useBoardsContext } from "@/app/deals/contexts/BoardsContext";
import SortableDnd from "@/components/dnd/SortableDnd";
import { BoardSchema } from "@/lib/client";
+import { isMobile } from "react-device-detect";
const Boards = () => {
const { boards, setSelectedBoard, onUpdateBoard } = useBoardsContext();
@@ -36,6 +37,7 @@ const Boards = () => {
onDragEnd={onDragEnd}
onItemClick={selectBoard}
rowStyle={{ flexWrap: "nowrap" }}
+ disabled={isMobile}
/>
diff --git a/src/app/deals/components/DealContainer/DealContainer.tsx b/src/app/deals/components/DealContainer/DealContainer.tsx
index f594c06..07a0262 100644
--- a/src/app/deals/components/DealContainer/DealContainer.tsx
+++ b/src/app/deals/components/DealContainer/DealContainer.tsx
@@ -6,14 +6,16 @@ import { DealSchema } from "@/lib/client";
type Props = {
deal: DealSchema;
+ disabled?: boolean;
};
-const DealContainer: FC = ({ deal }) => {
+const DealContainer: FC = ({ deal, disabled = false }) => {
const dealBody = useMemo(() => , [deal]);
return (
{dealBody}
diff --git a/src/app/deals/components/Funnel/Funnel.tsx b/src/app/deals/components/Funnel/Funnel.tsx
index a52b0ab..6be5dc9 100644
--- a/src/app/deals/components/Funnel/Funnel.tsx
+++ b/src/app/deals/components/Funnel/Funnel.tsx
@@ -1,6 +1,7 @@
"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";
@@ -63,6 +64,7 @@ const Funnel: FC = () => {
)}
activeContainer={activeStatus}
@@ -80,6 +82,7 @@ const Funnel: FC = () => {
{children}
)}
+ disabled={isMobile}
/>
diff --git a/src/components/dnd/FunnelDnd/FunnelColumn.tsx b/src/components/dnd/FunnelDnd/FunnelColumn.tsx
index 53e6052..cc12372 100644
--- a/src/components/dnd/FunnelDnd/FunnelColumn.tsx
+++ b/src/components/dnd/FunnelDnd/FunnelColumn.tsx
@@ -12,6 +12,7 @@ type Props = {
items: TItem[];
renderItem: (item: TItem) => ReactNode;
children?: ReactNode;
+ disabled?: boolean;
};
const FunnelColumn = ({
@@ -19,6 +20,7 @@ const FunnelColumn = ({
items,
renderItem,
children,
+ disabled = false,
}: Props) => {
const { setNodeRef } = useDroppable({ id });
@@ -26,6 +28,7 @@ const FunnelColumn = ({
<>
{children}
diff --git a/src/components/dnd/FunnelDnd/FunnelDnd.tsx b/src/components/dnd/FunnelDnd/FunnelDnd.tsx
index c82f8c1..014f7f8 100644
--- a/src/components/dnd/FunnelDnd/FunnelDnd.tsx
+++ b/src/components/dnd/FunnelDnd/FunnelDnd.tsx
@@ -36,6 +36,7 @@ type Props = {
getItemsByContainer: (container: TContainer, items: TItem[]) => TItem[];
activeContainer: TContainer | null;
activeItem: TItem | null;
+ disabled?: boolean;
};
const FunnelDnd = <
@@ -55,6 +56,7 @@ const FunnelDnd = <
getItemsByContainer,
activeContainer,
activeItem,
+ disabled = false,
}: Props) => {
const sensors = useDndSensors();
@@ -81,7 +83,8 @@ const FunnelDnd = <
return (
+ id={containerId}
+ disabled={disabled}>
{renderContainer(
container,
);
}}
diff --git a/src/components/dnd/SortableDnd/SortableDnd.tsx b/src/components/dnd/SortableDnd/SortableDnd.tsx
index b5016be..116d5a8 100644
--- a/src/components/dnd/SortableDnd/SortableDnd.tsx
+++ b/src/components/dnd/SortableDnd/SortableDnd.tsx
@@ -28,6 +28,7 @@ type Props = {
onItemClick: (item: T) => void;
rowStyle?: CSSProperties;
itemStyle?: CSSProperties;
+ disabled?: boolean;
};
const SortableDnd = ({
@@ -37,6 +38,7 @@ const SortableDnd = ({
onItemClick,
rowStyle,
itemStyle,
+ disabled = false,
}: Props) => {
const [active, setActive] = useState(null);
const [items, setItems] = useState([]);
@@ -95,7 +97,9 @@ const SortableDnd = ({
onDragStart={({ active }) => setActive(active)}
onDragEnd={onDragEndLocal}
onDragCancel={() => setActive(null)}>
-
+
({
+ id={item.id}
+ disabled={disabled}>
{renderItem(item)}
diff --git a/src/components/dnd/SortableItem/SortableItem.tsx b/src/components/dnd/SortableItem/SortableItem.tsx
index aa64746..84d6a3e 100644
--- a/src/components/dnd/SortableItem/SortableItem.tsx
+++ b/src/components/dnd/SortableItem/SortableItem.tsx
@@ -8,6 +8,7 @@ type Props = {
id: number | string;
itemStyle?: CSSProperties;
dragHandleStyle?: CSSProperties;
+ disabled?: boolean;
};
const SortableItem = ({
@@ -15,6 +16,7 @@ const SortableItem = ({
itemStyle,
id,
dragHandleStyle,
+ disabled,
}: PropsWithChildren) => {
const {
attributes,
@@ -24,7 +26,7 @@ const SortableItem = ({
setActivatorNodeRef,
transform,
transition,
- } = useSortable({ id });
+ } = useSortable({ id, disabled });
const context = useMemo(
() => ({