1
1
import React , {
2
2
Dispatch ,
3
3
ErrorInfo ,
4
+ ReactChild ,
4
5
SetStateAction ,
5
6
useEffect ,
6
7
useReducer ,
@@ -116,12 +117,18 @@ enum AppState {
116
117
VOICE ,
117
118
}
118
119
120
+ interface ErrorBoundaryProps {
121
+ children : ReactChild ;
122
+ }
119
123
interface ErrorBoundaryState {
120
124
error ?: Error ;
121
125
}
122
126
123
- class ErrorBoundary extends React . Component < { } , ErrorBoundaryState > {
124
- constructor ( props : { } ) {
127
+ class ErrorBoundary extends React . Component <
128
+ ErrorBoundaryProps ,
129
+ ErrorBoundaryState
130
+ > {
131
+ constructor ( props : ErrorBoundaryProps ) {
125
132
super ( props ) ;
126
133
this . state = { } ;
127
134
}
@@ -135,7 +142,7 @@ class ErrorBoundary extends React.Component<{}, ErrorBoundaryState> {
135
142
console . error ( 'React Error: ' , error , errorInfo ) ;
136
143
}
137
144
138
- render ( ) {
145
+ render ( ) : ReactChild {
139
146
if ( this . state . error ) {
140
147
return (
141
148
< div style = { { paddingTop : 16 } } >
@@ -170,7 +177,7 @@ class ErrorBoundary extends React.Component<{}, ErrorBoundaryState> {
170
177
}
171
178
}
172
179
173
- export default function App ( ) {
180
+ const App : React . FC = function ( ) {
174
181
const [ state , setState ] = useState < AppState > ( AppState . MENU ) ;
175
182
const [ gameState , setGameState ] = useState < AmongUsState > ( { } as AmongUsState ) ;
176
183
const [ settingsOpen , setSettingsOpen ] = useState ( false ) ;
@@ -289,52 +296,54 @@ export default function App() {
289
296
setSettingsOpen = { setSettingsOpen }
290
297
/>
291
298
< ErrorBoundary >
292
- < Settings
293
- open = { settingsOpen }
294
- onClose = { ( ) => setSettingsOpen ( false ) }
295
- />
296
- < Dialog fullWidth open = { updaterState . state !== 'unavailable' } >
297
- < DialogTitle > Updating...</ DialogTitle >
298
- < DialogContent >
299
- { ( updaterState . state === 'downloading' ||
300
- updaterState . state === 'downloaded' ) &&
301
- updaterState . progress && (
302
- < >
303
- < LinearProgress
304
- variant = {
305
- updaterState . state === 'downloaded'
306
- ? 'indeterminate'
307
- : 'determinate'
308
- }
309
- value = { updaterState . progress . percent }
310
- />
311
- < DialogContentText >
312
- { prettyBytes ( updaterState . progress . transferred ) } /{ ' ' }
313
- { prettyBytes ( updaterState . progress . total ) }
314
- </ DialogContentText >
315
- </ >
299
+ < >
300
+ < Settings
301
+ open = { settingsOpen }
302
+ onClose = { ( ) => setSettingsOpen ( false ) }
303
+ />
304
+ < Dialog fullWidth open = { updaterState . state !== 'unavailable' } >
305
+ < DialogTitle > Updating...</ DialogTitle >
306
+ < DialogContent >
307
+ { ( updaterState . state === 'downloading' ||
308
+ updaterState . state === 'downloaded' ) &&
309
+ updaterState . progress && (
310
+ < >
311
+ < LinearProgress
312
+ variant = {
313
+ updaterState . state === 'downloaded'
314
+ ? 'indeterminate'
315
+ : 'determinate'
316
+ }
317
+ value = { updaterState . progress . percent }
318
+ />
319
+ < DialogContentText >
320
+ { prettyBytes ( updaterState . progress . transferred ) } /{ ' ' }
321
+ { prettyBytes ( updaterState . progress . total ) }
322
+ </ DialogContentText >
323
+ </ >
324
+ ) }
325
+ { updaterState . state === 'error' && (
326
+ < DialogContentText color = "error" >
327
+ { updaterState . error }
328
+ </ DialogContentText >
316
329
) }
330
+ </ DialogContent >
317
331
{ updaterState . state === 'error' && (
318
- < DialogContentText color = "error" >
319
- { updaterState . error }
320
- </ DialogContentText >
332
+ < DialogActions >
333
+ < Button href = "https://github.com/ottomated/CrewLink/releases/latest" >
334
+ Download Manually
335
+ </ Button >
336
+ </ DialogActions >
321
337
) }
322
- </ DialogContent >
323
- { updaterState . state === 'error' && (
324
- < DialogActions >
325
- < Button href = "https://github.com/ottomated/CrewLink/releases/latest" >
326
- Download Manually
327
- </ Button >
328
- </ DialogActions >
329
- ) }
330
- </ Dialog >
331
- { page }
338
+ </ Dialog >
339
+ { page }
340
+ </ >
332
341
</ ErrorBoundary >
333
342
</ ThemeProvider >
334
343
</ SettingsContext . Provider >
335
344
</ LobbySettingsContext . Provider >
336
345
</ GameStateContext . Provider >
337
346
) ;
338
- }
347
+ } ;
339
348
340
349
ReactDOM . render ( < App /> , document . getElementById ( 'app' ) ) ;
0 commit comments