blob: 6665c0c2e8c4ee326b6f3d3f22dfb15bacc6737c (
plain)
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
|
import { createEffect, createMemo, createSignal, onCleanup, Show } from "solid-js"
import { useTheme } from "../context/theme"
import { Spinner } from "./spinner"
export function StartupLoading(props: { ready: () => boolean }) {
const theme = useTheme().theme
const [show, setShow] = createSignal(false)
const text = createMemo(() => (props.ready() ? "Finishing startup..." : "Loading plugins..."))
let wait: NodeJS.Timeout | undefined
let hold: NodeJS.Timeout | undefined
let stamp = 0
createEffect(() => {
if (props.ready()) {
if (wait) {
clearTimeout(wait)
wait = undefined
}
if (!show()) return
if (hold) return
const left = 3000 - (Date.now() - stamp)
if (left <= 0) {
setShow(false)
return
}
hold = setTimeout(() => {
hold = undefined
setShow(false)
}, left).unref()
return
}
if (hold) {
clearTimeout(hold)
hold = undefined
}
if (show()) return
if (wait) return
wait = setTimeout(() => {
wait = undefined
stamp = Date.now()
setShow(true)
}, 500).unref()
})
onCleanup(() => {
if (wait) clearTimeout(wait)
if (hold) clearTimeout(hold)
})
return (
<Show when={show()}>
<box position="absolute" zIndex={5000} left={0} right={0} bottom={1} justifyContent="center" alignItems="center">
<box backgroundColor={theme.backgroundPanel} paddingLeft={1} paddingRight={1}>
<Spinner color={theme.textMuted}>{text()}</Spinner>
</box>
</box>
</Show>
)
}
|
