50 lines
1.4 KiB
TypeScript
50 lines
1.4 KiB
TypeScript
import { proxy, subscribe, useSnapshot } from 'valtio'
|
|
import { activeModalStack, hideCurrentModal } from '../globalState'
|
|
import Screen from './Screen'
|
|
import Button from './Button'
|
|
import { hardcodedKnownModals, watchedModalsFromHooks } from './utilsApp'
|
|
|
|
const componentActive = proxy({
|
|
enabled: false
|
|
})
|
|
|
|
const checkModalAvailability = () => {
|
|
const last = activeModalStack.at(-1)
|
|
let withWildCardModal = false
|
|
for (const modal of watchedModalsFromHooks.value) {
|
|
if (modal.endsWith('*') && last?.reactType.startsWith(modal.slice(0, -1))) {
|
|
withWildCardModal = true
|
|
break
|
|
}
|
|
}
|
|
|
|
componentActive.enabled = !!last && !hardcodedKnownModals.some(x => last.reactType.startsWith(x)) && !watchedModalsFromHooks.value.includes(last.reactType) && !withWildCardModal
|
|
}
|
|
|
|
subscribe(activeModalStack, () => {
|
|
checkModalAvailability()
|
|
})
|
|
subscribe(watchedModalsFromHooks, () => {
|
|
checkModalAvailability()
|
|
})
|
|
|
|
export default () => {
|
|
const { enabled } = useSnapshot(componentActive)
|
|
const lastModal = useSnapshot(activeModalStack).at(-1)?.reactType
|
|
|
|
if (!enabled || watchedModalsFromHooks.value.includes(lastModal!)) return null
|
|
return <Screen
|
|
title={`Error: Modal (route) ${lastModal} is is unavailable or doesn't exist`}
|
|
style={{
|
|
zIndex: -1,
|
|
}}
|
|
backdrop={false}
|
|
>
|
|
<Button
|
|
style={{ marginTop: 30 }} onClick={() => {
|
|
hideCurrentModal()
|
|
}}
|
|
>Back
|
|
</Button>
|
|
</Screen>
|
|
}
|