SafeAreaView does not detect if a phone have a dynamic island or not

### Description

I want the SafeAreaView to apply dynamic padding depending on the actual device’s top inset. For example:

iPhone 16 Pro Max → larger status bar + Dynamic Island → needs more top/bottom safe area padding

Pixel 4 → no notch → should have smaller insets

Other Android devices → shapes vary (hole-punch, waterfall, etc.)

Right now my implementation is overly simplified:

```
const hasNotch = Platform.OS === 'ios'

return isTransparent ? content : (

{content}

)

```

Expected behavior

SafeAreaView should automatically apply padding based on the real device safe area insets, not a hardcoded boolean. Ideally:

Use the actual safe area bottom inset

Add additional padding only when needed

Work correctly across iOS + Android + future devices



### Steps to reproduce

```
const StatusBar = observer(() => {
const isTransparent = TRANSPARENT_STATUS_BAR_SCENES.includes(rootStore.layoutStore.currentScene)
const currentScene = rootStore.layoutStore.currentScene
const insets = useSafeAreaInsets()

// // Only add padding if device has notch/Dynamic Island (top inset > 20px)
// // This works for both iOS (notch/Dynamic Island) and Android (notch)
// const hasNotch = Platform.OS === 'ios'

const content = (

)

// Don't wrap in SafeAreaView if currentScene is null (navigation not ready yet)
// This prevents double SafeAreaView padding on first render
if (currentScene === null) {
return content
}

return isTransparent ? content : (

{content}

)
})
```

### Snack or a link to a repository

https://github.com/Fundy-asia/user-app

### Safe Area Context version

^5.6.2

### React Native version

0.80.2

### Platforms

Android

### Architecture

None

### Build type

None

### Device

None

### Device model

Pixel 4

### Acknowledgements

Yes