Move /platform/detection vars into /env (#9707)

* Add platform vars to env

* Replace /platform/detection with /env

src/view/com/composer/photos/Gallery.tsx

@@ -16,12 +16,12 @@ import {useLingui} from '@lingui/react'
 import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries'
 import {type Dimensions} from '#/lib/media/types'
 import {colors, s} from '#/lib/styles'
-import {isNative} from '#/platform/detection'
 import {type ComposerImage, cropImage} from '#/state/gallery'
 import {Text} from '#/view/com/util/text/Text'
 import {tokens, useTheme} from '#/alf'
 import * as Dialog from '#/components/Dialog'
 import {MediaInsetBorder} from '#/components/MediaInsetBorder'
+import {IS_NATIVE} from '#/env'
 import {type PostAction} from '../state/composer'
 import {EditImageDialog} from './EditImageDialog'
 import {ImageAltTextDialog} from './ImageAltTextDialog'
@@ -145,7 +145,7 @@ const GalleryItem = ({
   const editControl = Dialog.useDialogControl()
 
   const onImageEdit = () => {
-    if (isNative) {
+    if (IS_NATIVE) {
       cropImage(image).then(next => {
         onChange(next)
       })

src/view/com/composer/photos/ImageAltTextDialog.tsx

@@ -6,7 +6,6 @@ import {useLingui} from '@lingui/react'
 
 import {MAX_ALT_TEXT} from '#/lib/constants'
 import {enforceLen} from '#/lib/strings/helpers'
-import {isAndroid, isWeb} from '#/platform/detection'
 import {type ComposerImage} from '#/state/gallery'
 import {AltTextCounterWrapper} from '#/view/com/composer/AltTextCounterWrapper'
 import {atoms as a, useTheme} from '#/alf'
@@ -16,6 +15,7 @@ import {type DialogControlProps} from '#/components/Dialog'
 import * as TextField from '#/components/forms/TextField'
 import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfo} from '#/components/icons/CircleInfo'
 import {Text} from '#/components/Typography'
+import {IS_ANDROID, IS_WEB} from '#/env'
 
 type Props = {
   control: Dialog.DialogOuterProps['control']
@@ -66,7 +66,7 @@ const ImageAltTextInner = ({
   const windim = useWindowDimensions()
 
   const imageStyle = React.useMemo<ImageStyle>(() => {
-    const maxWidth = isWeb ? 450 : windim.width
+    const maxWidth = IS_WEB ? 450 : windim.width
     const source = image.transformed ?? image.source
 
     if (source.height > source.width) {
@@ -165,7 +165,7 @@ const ImageAltTextInner = ({
         </AltTextCounterWrapper>
       </View>
       {/* Maybe fix this later -h */}
-      {isAndroid ? <View style={{height: 300}} /> : null}
+      {IS_ANDROID ? <View style={{height: 300}} /> : null}
     </Dialog.ScrollableInner>
   )
 }

src/view/com/composer/photos/OpenCameraBtn.tsx

@@ -7,11 +7,11 @@ import {POST_IMG_MAX} from '#/lib/constants'
 import {useCameraPermission} from '#/lib/hooks/usePermissions'
 import {openCamera} from '#/lib/media/picker'
 import {logger} from '#/logger'
-import {isMobileWeb, isNative} from '#/platform/detection'
 import {type ComposerImage, createComposerImage} from '#/state/gallery'
 import {atoms as a, useTheme} from '#/alf'
 import {Button} from '#/components/Button'
 import {Camera_Stroke2_Corner0_Rounded as Camera} from '#/components/icons/Camera'
+import {IS_NATIVE, IS_WEB_MOBILE} from '#/env'
 
 type Props = {
   disabled?: boolean
@@ -58,7 +58,7 @@ export function OpenCameraBtn({disabled, onAdd}: Props) {
     requestMediaPermission,
   ])
 
-  const shouldShowCameraButton = isNative || isMobileWeb
+  const shouldShowCameraButton = IS_NATIVE || IS_WEB_MOBILE
   if (!shouldShowCameraButton) {
     return null
   }