remove

src/components/Dialog/index.tsx

@@ -176,8 +176,6 @@ export function Outer({
           <View
             // iOS
             accessibilityViewIsModal
-            // Android
-            importantForAccessibility="yes"
             style={[a.absolute, a.inset_0]}
             testID={testID}
             onTouchMove={() => Keyboard.dismiss()}>

src/state/dialogs/index.tsx

@@ -1,5 +1,4 @@
 import React from 'react'
-import {SharedValue, useSharedValue} from 'react-native-reanimated'
 
 import {DialogControlRefProps} from '#/components/Dialog'
 import {Provider as GlobalDialogsProvider} from '#/components/dialogs/Context'
@@ -16,14 +15,6 @@ interface IDialogContext {
    * `useId`.
    */
   openDialogs: React.MutableRefObject<Set<string>>
-  /**
-   * The counterpart to `accessibilityViewIsModal` for Android. This property
-   * applies to the parent of all non-modal views, and prevents TalkBack from
-   * navigating within content beneath an open dialog.
-   *
-   * @see https://reactnative.dev/docs/accessibility#importantforaccessibility-android
-   */
-  importantForAccessibility: SharedValue<'auto' | 'no-hide-descendants'>
 }
 
 const DialogContext = React.createContext<IDialogContext>({} as IDialogContext)
@@ -49,9 +40,6 @@ export function Provider({children}: React.PropsWithChildren<{}>) {
     Map<string, React.MutableRefObject<DialogControlRefProps>>
   >(new Map())
   const openDialogs = React.useRef<Set<string>>(new Set())
-  const importantForAccessibility = useSharedValue<
-    'auto' | 'no-hide-descendants'
-  >('auto')
 
   const closeAllDialogs = React.useCallback(() => {
     openDialogs.current.forEach(id => {
@@ -61,28 +49,20 @@ export function Provider({children}: React.PropsWithChildren<{}>) {
     return openDialogs.current.size > 0
   }, [])
 
-  const setDialogIsOpen = React.useCallback(
+  const setDialogIsOpen = React.useCallback((id: string, isOpen: boolean) => {
-    (id: string, isOpen: boolean) => {
+    if (isOpen) {
-      if (isOpen) {
+      openDialogs.current.add(id)
-        openDialogs.current.add(id)
+    } else {
-        importantForAccessibility.value = 'no-hide-descendants'
+      openDialogs.current.delete(id)
-      } else {
+    }
-        openDialogs.current.delete(id)
+  }, [])
-        if (openDialogs.current.size < 1) {
-          importantForAccessibility.value = 'auto'
-        }
-      }
-    },
-    [importantForAccessibility],
-  )
 
   const context = React.useMemo<IDialogContext>(
     () => ({
       activeDialogs,
       openDialogs,
-      importantForAccessibility,
     }),
-    [importantForAccessibility, activeDialogs, openDialogs],
+    [activeDialogs, openDialogs],
   )
   const controls = React.useMemo(
     () => ({closeAllDialogs, setDialogIsOpen}),

src/view/shell/index.tsx

@@ -13,6 +13,13 @@ import * as NavigationBar from 'expo-navigation-bar'
 import {StatusBar} from 'expo-status-bar'
 import {useNavigation, useNavigationState} from '@react-navigation/native'
 
+import {useDedupe} from '#/lib/hooks/useDedupe'
+import {useNotificationsHandler} from '#/lib/hooks/useNotificationHandler'
+import {usePalette} from '#/lib/hooks/usePalette'
+import {useNotificationsRegistration} from '#/lib/notifications/notifications'
+import {isStateAtTabRoot} from '#/lib/routes/helpers'
+import {useTheme} from '#/lib/ThemeContext'
+import {isAndroid} from '#/platform/detection'
 import {useSession} from '#/state/session'
 import {
   useIsDrawerOpen,
@@ -20,17 +27,9 @@ import {
   useSetDrawerOpen,
 } from '#/state/shell'
 import {useCloseAnyActiveElement} from '#/state/util'
-import {useDedupe} from 'lib/hooks/useDedupe'
+import {Lightbox} from '#/view/com/lightbox/Lightbox'
-import {useNotificationsHandler} from 'lib/hooks/useNotificationHandler'
+import {ModalsContainer} from '#/view/com/modals/Modal'
-import {usePalette} from 'lib/hooks/usePalette'
+import {ErrorBoundary} from '#/view/com/util/ErrorBoundary'
-import {useNotificationsRegistration} from 'lib/notifications/notifications'
-import {isStateAtTabRoot} from 'lib/routes/helpers'
-import {useTheme} from 'lib/ThemeContext'
-import {isAndroid} from 'platform/detection'
-import {useDialogStateContext} from 'state/dialogs'
-import {Lightbox} from 'view/com/lightbox/Lightbox'
-import {ModalsContainer} from 'view/com/modals/Modal'
-import {ErrorBoundary} from 'view/com/util/ErrorBoundary'
 import {MutedWordsDialog} from '#/components/dialogs/MutedWords'
 import {SigninDialog} from '#/components/dialogs/Signin'
 import {Outlet as PortalOutlet} from '#/components/Portal'
@@ -61,7 +60,6 @@ function ShellInner() {
   const canGoBack = useNavigationState(state => !isStateAtTabRoot(state))
   const {hasSession} = useSession()
   const closeAnyActiveElement = useCloseAnyActiveElement()
-  const {importantForAccessibility} = useDialogStateContext()
 
   useNotificationsRegistration()
   useNotificationsHandler()
@@ -101,9 +99,7 @@ function ShellInner() {
 
   return (
     <>
-      <Animated.View
+      <Animated.View style={containerPadding}>
-        style={containerPadding}
-        importantForAccessibility={importantForAccessibility}>
         <ErrorBoundary>
           <Drawer
             renderDrawerContent={renderDrawerContent}