diff options
Diffstat (limited to 'subprojects/frontend/src/UpdateNotification.tsx')
-rw-r--r-- | subprojects/frontend/src/UpdateNotification.tsx | 51 |
1 files changed, 51 insertions, 0 deletions
diff --git a/subprojects/frontend/src/UpdateNotification.tsx b/subprojects/frontend/src/UpdateNotification.tsx new file mode 100644 index 00000000..d260e3b7 --- /dev/null +++ b/subprojects/frontend/src/UpdateNotification.tsx | |||
@@ -0,0 +1,51 @@ | |||
1 | import Button from '@mui/material/Button'; | ||
2 | import { observer } from 'mobx-react-lite'; | ||
3 | import React, { useEffect } from 'react'; | ||
4 | |||
5 | import { useRootStore } from './RootStore'; | ||
6 | import { ContrastThemeProvider } from './theme/ThemeProvider'; | ||
7 | import useDelayedSnackbar from './utils/useDelayedSnackbar'; | ||
8 | |||
9 | export default observer(function UpdateNotification(): null { | ||
10 | const { pwaStore } = useRootStore(); | ||
11 | const { needsUpdate, updateError } = pwaStore; | ||
12 | const enqueueLater = useDelayedSnackbar(); | ||
13 | |||
14 | useEffect(() => { | ||
15 | if (needsUpdate) { | ||
16 | return enqueueLater('An update for Refinery is available', { | ||
17 | persist: true, | ||
18 | action: ( | ||
19 | <ContrastThemeProvider> | ||
20 | <Button color="primary" onClick={() => pwaStore.reloadWithUpdate()}> | ||
21 | Reload | ||
22 | </Button> | ||
23 | <Button color="inherit" onClick={() => pwaStore.dismissUpdate()}> | ||
24 | Dismiss | ||
25 | </Button> | ||
26 | </ContrastThemeProvider> | ||
27 | ), | ||
28 | }); | ||
29 | } | ||
30 | |||
31 | if (updateError) { | ||
32 | return enqueueLater('Failed to download update', { | ||
33 | variant: 'error', | ||
34 | action: ( | ||
35 | <> | ||
36 | <Button color="inherit" onClick={() => pwaStore.checkForUpdates()}> | ||
37 | Try again | ||
38 | </Button> | ||
39 | <Button color="inherit" onClick={() => pwaStore.dismissError()}> | ||
40 | Dismiss | ||
41 | </Button> | ||
42 | </> | ||
43 | ), | ||
44 | }); | ||
45 | } | ||
46 | |||
47 | return () => {}; | ||
48 | }, [pwaStore, needsUpdate, updateError, enqueueLater]); | ||
49 | |||
50 | return null; | ||
51 | }); | ||