Repository navigation
Expand file tree
/
Copy pathApp.tsx
More file actions
72 lines (69 loc) · 2.18 KB
/
Copy pathApp.tsx
File metadata and controls
72 lines (69 loc) · 2.18 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
69
70
71
import React, {useCallback, useState} from 'react'
import {Layout} from 'antd'
import {Content} from 'antd/lib/layout/layout'
import Sheet from './sheet/Sheet'
import useEvaluate from './sheet/useEvaluate'
import Header from './header/Header'
import {
Route,
Switch,
useHistory,
} from 'react-router-dom'
import {useShare} from './sheet/useShare'
import ImportedSheet from './sheet/ImportedSheet'
import ShareModal from './sheet/ShareModal'
import {createBlankSheet, createWelcomeSheet} from './sheet/defaultSheet'
const welcomeSheet = createWelcomeSheet()
const blankSheet = createBlankSheet()
export default function App() {
const [evaluate, evaluating, cooldown] = useEvaluate()
const history = useHistory()
const [sharedId, setSharedId] = useState('')
const [shareVisible, setShareVisible] = useState(false)
const callback = useCallback(created => {
history.push(`/s/${created.id}`)
setShareVisible(true)
setSharedId(created.id)
}, [history])
const [share, captureSnippet] = useShare(callback)
return (
<Layout>
<Header onShare={share}/>
<Content style={{padding: '0 50px 50px 50px'}}>
<ShareModal
visible={shareVisible}
onVisibilityChange={setShareVisible}
sheetId={sharedId}
/>
<Switch>
<Route path="/s/:sheetId">
<ImportedSheet
evaluating={evaluating}
isCooldown={cooldown}
evaluate={evaluate}
captureSnippet={captureSnippet}
/>
</Route>
<Route path={['/new', '/blank']}>
<Sheet
initial={blankSheet}
isCooldown={cooldown}
evaluating={evaluating}
evaluate={evaluate}
captureSnippet={captureSnippet}
/>
</Route>
<Route path="/">
<Sheet
initial={welcomeSheet}
isCooldown={cooldown}
evaluating={evaluating}
evaluate={evaluate}
captureSnippet={captureSnippet}
/>
</Route>
</Switch>
</Content>
</Layout>
)
}