Repository navigation
Expand file tree
/
Copy pathuseSheet.ts
More file actions
68 lines (63 loc) · 2.3 KB
/
Copy pathuseSheet.ts
File metadata and controls
68 lines (63 loc) · 2.3 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
import {useDispatch, useSelector} from 'react-redux'
import {Sheet, SheetSnippet, SheetSnippetComponent} from './index'
import {RootState} from '../store'
import {
addComponent,
addSnippet,
changeSnippetDetails, deleteComponent,
deleteSnippet,
moveSnippet, reorderComponent,
reorderSnippet, updateSheet
} from './state'
export interface UseSheet {
sheet: Sheet
update: (target: Sheet) => void
moveSnippet: (id: string, direction: 'up' | 'down') => void
reorderSnippet: (from: number, to: number) => void
addSnippet: (snippet: Partial<SheetSnippet>) => void
deleteSnippet: (id: string) => void
}
export function useSheet(): UseSheet {
const dispatch = useDispatch()
const sheet = useSelector((state: RootState) => state.sheet)
return {
sheet,
update: sheet => dispatch(updateSheet(sheet)),
moveSnippet: (id, direction) => dispatch(moveSnippet({id, direction})),
reorderSnippet: (from, to) => dispatch(reorderSnippet({from, to})),
addSnippet: (snippet) => dispatch(addSnippet(snippet)),
deleteSnippet: (id: string) => dispatch(deleteSnippet({id}))
}
}
export interface UseSnippet {
snippet: SheetSnippet | undefined
changeDetails: (details: {title: string}) => void
reorderComponent: (from: number, to: number) => void
addComponent: (component: Partial<SheetSnippetComponent>) => void
deleteComponent: (id: string) => void
delete: () => void
}
export function useSnippet(id: string): UseSnippet {
const dispatch = useDispatch()
const snippet = useSelector(
(state: RootState) => state.sheet.snippets.find(snippet => snippet.id === id)
)
return {
snippet,
delete: () => dispatch(deleteSnippet({id})),
changeDetails: details => dispatch(changeSnippetDetails({snippetId: id, ...details})),
reorderComponent: (from, to) => dispatch(reorderComponent({snippetId: id, from, to})),
addComponent: component => dispatch(addComponent({snippetId: id, component})),
deleteComponent: componentId => dispatch(deleteComponent({snippetId: id, componentId}))
}
}
export function useComponent(
snippetId: string,
componentId: string
): SheetSnippetComponent | undefined {
return useSelector(
(state: RootState) =>
state.sheet.snippets.find(snippet => snippet.id === snippetId)
?.components.find(component => component.id === componentId)
)
}