zio/bsky-app
2
0
Fork 0
Code Pull requests Releases Packages Activity

Add modal state provider, replace usage except methods (#1833)

Browse source 
* Add modal state provider, replace usage except methods

* Replace easy spots

* Fix sticky spots

* Replace final usages

* Memorize context objects

* Add more warnings
This commit is contained in:
Eric Bailey 2023-11-08 12:34:10 -06:00 • committed by GitHub
parent 5eadadffbf
commit f18b15241a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
70 changed files with 634 additions and 498 deletions
Download patch file Download diff file Expand all files Collapse all files

17
src/view/com/modals/Modal.web.tsx
View file

@ -1,11 +1,11 @@
import React from 'react'
import {TouchableWithoutFeedback, StyleSheet, View} from 'react-native'
import {observer} from 'mobx-react-lite'
import {useStores} from 'state/index'
import {usePalette} from 'lib/hooks/usePalette'
import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
import type {Modal as ModalIface} from 'state/models/ui/shell'
import type {Modal as ModalIface} from '#/state/modals'
import {useModals, useModalControls} from '#/state/modals'
import * as ConfirmModal from './Confirm'
import * as EditProfileModal from './EditProfile'
import * as ProfilePreviewModal from './ProfilePreview'
@ -34,15 +34,15 @@ import * as ChangeEmailModal from './ChangeEmail'
import * as LinkWarningModal from './LinkWarning'
export const ModalsContainer = observer(function ModalsContainer() {
const store = useStores()
const {isModalActive, activeModals} = useModals()
if (!store.shell.isModalActive) {
if (!isModalActive) {
return null
}
return (
<>
{store.shell.activeModals.map((modal, i) => (
{activeModals.map((modal, i) => (
<Modal key={`modal-${i}`} modal={modal} />
))}
</>
@ -50,11 +50,12 @@ export const ModalsContainer = observer(function ModalsContainer() {
})
function Modal({modal}: {modal: ModalIface}) {
const store = useStores()
const {isModalActive} = useModals()
const {closeModal} = useModalControls()
const pal = usePalette('default')
const {isMobile} = useWebMediaQueries()
if (!store.shell.isModalActive) {
if (!isModalActive) {
return null
}
@ -62,7 +63,7 @@ function Modal({modal}: {modal: ModalIface}) {
if (modal.name === 'crop-image' || modal.name === 'edit-image') {
return // dont close on mask presses during crop
}
store.shell.closeModal()
closeModal()
}
const onInnerPress = () => {
// TODO: can we use prevent default?