luisgulo/focalboard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Typing adjustment - 1353 (#1415)

Browse source 
* refactor: adjusting typing

* fix: improving typing

* refactor: simplifying typing using Generics
This commit is contained in:
Tiago Santos Da Silva 2021-10-05 19:55:55 -03:00 committed by GitHub
parent b2f42e9d4c
commit e0935eb15c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 12 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
webapp/src/hooks/sortable.tsx
View file

@ -3,7 +3,14 @@
import React, {useRef} from 'react' import React, {useRef} from 'react'
import {useDrag, useDrop, DragElementWrapper, DragSourceOptions, DragPreviewOptions} from 'react-dnd' import {useDrag, useDrop, DragElementWrapper, DragSourceOptions, DragPreviewOptions} from 'react-dnd'
function useSortableBase(itemType: string, item: any, enabled: boolean, handler: (src: any, st: any) => void): [boolean, boolean, DragElementWrapper<DragSourceOptions>, DragElementWrapper<any>, DragElementWrapper<DragPreviewOptions>] { import {IContentBlockWithCords} from '../blocks/contentBlock'
import {Block} from '../blocks/block'
interface ISortableWithGripItem {
block: Block | Block[],
cords: {x: number, y?: number, z?: number}
}
function useSortableBase<T>(itemType: string, item: T, enabled: boolean, handler: (src: T, st: T) => void): [boolean, boolean, DragElementWrapper<DragSourceOptions>, DragElementWrapper<DragSourceOptions>, DragElementWrapper<DragPreviewOptions>] {
const [{isDragging}, drag, preview] = useDrag(() => ({ const [{isDragging}, drag, preview] = useDrag(() => ({
type: itemType, type: itemType,
item, item,
@ -17,7 +24,7 @@ function useSortableBase(itemType: string, item: any, enabled: boolean, handler:
collect: (monitor) => ({ collect: (monitor) => ({
isOver: monitor.isOver(), isOver: monitor.isOver(),
}), }),
drop: (dragItem: any) => { drop: (dragItem: T) => {
handler(dragItem, item) handler(dragItem, item)
}, },
canDrop: () => enabled, canDrop: () => enabled,
@ -26,17 +33,17 @@ function useSortableBase(itemType: string, item: any, enabled: boolean, handler:
return [isDragging, isOver, drag, drop, preview] return [isDragging, isOver, drag, drop, preview]
} }
export function useSortable(itemType: string, item: any, enabled: boolean, handler: (src: any, st: any) => void): [boolean, boolean, React.RefObject<HTMLDivElement>] { export function useSortable<T>(itemType: string, item: T, enabled: boolean, handler: (src: T, st: T) => void): [boolean, boolean, React.RefObject<HTMLDivElement>] {
const ref = useRef<HTMLDivElement>(null) const ref = useRef<HTMLDivElement>(null)
const [isDragging, isOver, drag, drop] = useSortableBase(itemType, item, enabled, handler) const [isDragging, isOver, drag, drop] = useSortableBase(itemType, item, enabled, handler)
drop(drag(ref)) drop(drag(ref))
return [isDragging, isOver, ref] return [isDragging, isOver, ref]
} }
export function useSortableWithGrip(itemType: string, item: any, enabled: boolean, handler: (src: any, st: any) => void): [boolean, boolean, React.RefObject<HTMLDivElement>, React.RefObject<HTMLDivElement>] { export function useSortableWithGrip(itemType: string, item: ISortableWithGripItem, enabled: boolean, handler: (src: IContentBlockWithCords, st: IContentBlockWithCords) => void): [boolean, boolean, React.RefObject<HTMLDivElement>, React.RefObject<HTMLDivElement>] {
const ref = useRef<HTMLDivElement>(null) const ref = useRef<HTMLDivElement>(null)
const previewRef = useRef<HTMLDivElement>(null) const previewRef = useRef<HTMLDivElement>(null)
const [isDragging, isOver, drag, drop, preview] = useSortableBase(itemType, item, enabled, handler) const [isDragging, isOver, drag, drop, preview] = useSortableBase(itemType, item as IContentBlockWithCords, enabled, handler)
drag(ref) drag(ref)
drop(preview(previewRef)) drop(preview(previewRef))
return [isDragging, isOver, ref, previewRef] return [isDragging, isOver, ref, previewRef]