diff --git a/frontend/src/app/_components/add/course/without-new/AddCourseOrder.tsx b/frontend/src/app/_components/add/course/without-new/AddCourseOrder.tsx index 936890bff..19ce3efb4 100644 --- a/frontend/src/app/_components/add/course/without-new/AddCourseOrder.tsx +++ b/frontend/src/app/_components/add/course/without-new/AddCourseOrder.tsx @@ -6,6 +6,7 @@ import { DragOverlay, KeyboardSensor, PointerSensor, + TouchSensor, closestCenter, useSensor, useSensors, @@ -29,8 +30,14 @@ import type { TSpotState } from '@/context/travel/schema'; import SortableSpot from './SortableSpot'; export default function AddCourseOrder() { + const sensor = + /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test( + navigator.userAgent, + ) + ? TouchSensor + : PointerSensor; const sensors = useSensors( - useSensor(PointerSensor, { activationConstraint: { distance: 5 } }), + useSensor(sensor, { activationConstraint: { distance: 5 } }), useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates, }), diff --git a/frontend/src/app/_components/images/ImagesContainer.tsx b/frontend/src/app/_components/images/ImagesContainer.tsx index 273de6fa6..908c83141 100644 --- a/frontend/src/app/_components/images/ImagesContainer.tsx +++ b/frontend/src/app/_components/images/ImagesContainer.tsx @@ -7,6 +7,7 @@ import { DragOverlay, KeyboardSensor, PointerSensor, + TouchSensor, useSensor, useSensors, } from '@dnd-kit/core'; @@ -37,8 +38,15 @@ export default function ImagesContainer({ setImages: (newImages: { type: 'new'; data: TImageData[] }) => void; }) { const [activeId, setActiveId] = useState(null); + + const sensor = + /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test( + navigator.userAgent, + ) + ? TouchSensor + : PointerSensor; const sensors = useSensors( - useSensor(PointerSensor, { activationConstraint: { distance: 1 } }), + useSensor(sensor, { activationConstraint: { distance: 5 } }), useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates, }), diff --git a/frontend/src/app/_components/mypage/course/CourseSpotContainer.tsx b/frontend/src/app/_components/mypage/course/CourseSpotContainer.tsx index 179489349..bb5428260 100644 --- a/frontend/src/app/_components/mypage/course/CourseSpotContainer.tsx +++ b/frontend/src/app/_components/mypage/course/CourseSpotContainer.tsx @@ -10,6 +10,7 @@ import { DragStartEvent, KeyboardSensor, PointerSensor, + TouchSensor, UniqueIdentifier, useSensor, useSensors, @@ -42,8 +43,15 @@ export default function CourseSpotContainer({ onClickDeleteSpot: (e: EventFor<'span', 'onClick'>, id: number) => void; }) { const [activeId, setActiveId] = useState(null); + + const sensor = + /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test( + navigator.userAgent, + ) + ? TouchSensor + : PointerSensor; const sensors = useSensors( - useSensor(PointerSensor, { activationConstraint: { distance: 5 } }), + useSensor(sensor, { activationConstraint: { distance: 5 } }), useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates, }),