53 lines
1.5 KiB
TypeScript
53 lines
1.5 KiB
TypeScript
import { ChoiceItem, DraggableStep, DraggableStepType } from 'models'
|
|
import {
|
|
createContext,
|
|
Dispatch,
|
|
ReactNode,
|
|
SetStateAction,
|
|
useContext,
|
|
useState,
|
|
} from 'react'
|
|
|
|
const dndContext = createContext<{
|
|
draggedStepType?: DraggableStepType
|
|
setDraggedStepType: Dispatch<SetStateAction<DraggableStepType | undefined>>
|
|
draggedStep?: DraggableStep
|
|
setDraggedStep: Dispatch<SetStateAction<DraggableStep | undefined>>
|
|
draggedChoiceItem?: ChoiceItem
|
|
setDraggedChoiceItem: Dispatch<SetStateAction<ChoiceItem | undefined>>
|
|
mouseOverBlockId?: string
|
|
setMouseOverBlockId: Dispatch<SetStateAction<string | undefined>>
|
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
//@ts-ignore
|
|
}>({})
|
|
|
|
export const DndContext = ({ children }: { children: ReactNode }) => {
|
|
const [draggedStep, setDraggedStep] = useState<DraggableStep>()
|
|
const [draggedStepType, setDraggedStepType] = useState<
|
|
DraggableStepType | undefined
|
|
>()
|
|
const [draggedChoiceItem, setDraggedChoiceItem] = useState<
|
|
ChoiceItem | undefined
|
|
>()
|
|
const [mouseOverBlockId, setMouseOverBlockId] = useState<string>()
|
|
|
|
return (
|
|
<dndContext.Provider
|
|
value={{
|
|
draggedStep,
|
|
setDraggedStep,
|
|
draggedStepType,
|
|
setDraggedStepType,
|
|
draggedChoiceItem,
|
|
setDraggedChoiceItem,
|
|
mouseOverBlockId,
|
|
setMouseOverBlockId,
|
|
}}
|
|
>
|
|
{children}
|
|
</dndContext.Provider>
|
|
)
|
|
}
|
|
|
|
export const useDnd = () => useContext(dndContext)
|