about summary refs log tree commit diff
path: root/src/view/com/modals
diff options
context:
space:
mode:
Diffstat (limited to 'src/view/com/modals')
-rw-r--r--src/view/com/modals/AddAppPasswords.tsx24
-rw-r--r--src/view/com/modals/AltImage.tsx34
-rw-r--r--src/view/com/modals/AppealLabel.tsx20
-rw-r--r--src/view/com/modals/BirthDateSettings.tsx26
-rw-r--r--src/view/com/modals/ChangeEmail.tsx26
-rw-r--r--src/view/com/modals/ChangeHandle.tsx42
-rw-r--r--src/view/com/modals/ChangePassword.tsx34
-rw-r--r--src/view/com/modals/Confirm.tsx18
-rw-r--r--src/view/com/modals/ContentFilteringSettings.tsx36
-rw-r--r--src/view/com/modals/CreateOrEditList.tsx48
-rw-r--r--src/view/com/modals/DeleteAccount.tsx32
-rw-r--r--src/view/com/modals/EditImage.tsx34
-rw-r--r--src/view/com/modals/EditProfile.tsx42
-rw-r--r--src/view/com/modals/EmbedConsent.tsx16
-rw-r--r--src/view/com/modals/InAppBrowserConsent.tsx16
-rw-r--r--src/view/com/modals/InviteCodes.tsx42
-rw-r--r--src/view/com/modals/LinkWarning.tsx20
-rw-r--r--src/view/com/modals/ListAddRemoveUsers.tsx40
-rw-r--r--src/view/com/modals/Modal.tsx49
-rw-r--r--src/view/com/modals/Modal.web.tsx47
-rw-r--r--src/view/com/modals/ModerationDetails.tsx20
-rw-r--r--src/view/com/modals/Repost.tsx16
-rw-r--r--src/view/com/modals/SelfLabel.tsx18
-rw-r--r--src/view/com/modals/SwitchAccount.tsx30
-rw-r--r--src/view/com/modals/Threadgate.tsx20
-rw-r--r--src/view/com/modals/UserAddRemoveLists.tsx32
-rw-r--r--src/view/com/modals/VerifyEmail.tsx32
-rw-r--r--src/view/com/modals/crop-image/CropImage.web.tsx21
-rw-r--r--src/view/com/modals/lang-settings/ConfirmLanguagesButton.tsx12
-rw-r--r--src/view/com/modals/lang-settings/ContentLanguagesSettings.tsx18
-rw-r--r--src/view/com/modals/lang-settings/LanguageToggle.tsx5
-rw-r--r--src/view/com/modals/lang-settings/PostLanguagesSettings.tsx18
-rw-r--r--src/view/com/modals/report/InputIssueDetails.tsx15
-rw-r--r--src/view/com/modals/report/Modal.tsx24
-rw-r--r--src/view/com/modals/report/ReasonOptions.tsx8
-rw-r--r--src/view/com/modals/report/SendReportButton.tsx9
36 files changed, 442 insertions, 502 deletions
diff --git a/src/view/com/modals/AddAppPasswords.tsx b/src/view/com/modals/AddAppPasswords.tsx
index 2346f6d4e..a8913dd54 100644
--- a/src/view/com/modals/AddAppPasswords.tsx
+++ b/src/view/com/modals/AddAppPasswords.tsx
@@ -1,27 +1,25 @@
+import React, {useState} from 'react'
+import {StyleSheet, TextInput, View, TouchableOpacity} from 'react-native'
+import {Text} from '../util/text/Text'
+import {Button} from '../util/forms/Button'
+import {s} from 'lib/styles'
+import {usePalette} from 'lib/hooks/usePalette'
+import {isNative} from 'platform/detection'
 import {
   FontAwesomeIcon,
   FontAwesomeIconStyle,
 } from '@fortawesome/react-native-fontawesome'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
 import Clipboard from '@react-native-clipboard/clipboard'
-import {usePalette} from 'lib/hooks/usePalette'
-import {s} from 'lib/styles'
-import {isNative} from 'platform/detection'
-import React, {useState} from 'react'
-import {StyleSheet, TextInput, TouchableOpacity, View} from 'react-native'
-
+import * as Toast from '../util/Toast'
 import {logger} from '#/logger'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 import {useModalControls} from '#/state/modals'
 import {
-  useAppPasswordCreateMutation,
   useAppPasswordsQuery,
+  useAppPasswordCreateMutation,
 } from '#/state/queries/app-passwords'
 
-import {Button} from '../util/forms/Button'
-import {Text} from '../util/text/Text'
-import * as Toast from '../util/Toast'
-
 export const snapPoints = ['70%']
 
 const shadesOfBlue: string[] = [
diff --git a/src/view/com/modals/AltImage.tsx b/src/view/com/modals/AltImage.tsx
index e3e872a17..17ce05cda 100644
--- a/src/view/com/modals/AltImage.tsx
+++ b/src/view/com/modals/AltImage.tsx
@@ -1,31 +1,29 @@
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {Image} from 'expo-image'
-import {MAX_ALT_TEXT} from 'lib/constants'
-import {useIsKeyboardVisible} from 'lib/hooks/useIsKeyboardVisible'
-import {usePalette} from 'lib/hooks/usePalette'
-import {enforceLen} from 'lib/strings/helpers'
-import {gradients, s} from 'lib/styles'
-import {useTheme} from 'lib/ThemeContext'
-import {isWeb} from 'platform/detection'
-import React, {useCallback, useMemo, useState} from 'react'
+import React, {useMemo, useCallback, useState} from 'react'
 import {
   ImageStyle,
-  ScrollView as RNScrollView,
   StyleSheet,
-  TextInput as RNTextInput,
   TouchableOpacity,
-  useWindowDimensions,
   View,
+  TextInput as RNTextInput,
+  useWindowDimensions,
+  ScrollView as RNScrollView,
 } from 'react-native'
+import {ScrollView, TextInput} from './util'
+import {Image} from 'expo-image'
+import {usePalette} from 'lib/hooks/usePalette'
+import {gradients, s} from 'lib/styles'
+import {enforceLen} from 'lib/strings/helpers'
+import {MAX_ALT_TEXT} from 'lib/constants'
+import {useTheme} from 'lib/ThemeContext'
+import {useIsKeyboardVisible} from 'lib/hooks/useIsKeyboardVisible'
+import {Text} from '../util/text/Text'
 import LinearGradient from 'react-native-linear-gradient'
+import {isWeb} from 'platform/detection'
 import {ImageModel} from 'state/models/media/image'
-
+import {useLingui} from '@lingui/react'
+import {Trans, msg} from '@lingui/macro'
 import {useModalControls} from '#/state/modals'
 
-import {Text} from '../util/text/Text'
-import {ScrollView, TextInput} from './util'
-
 export const snapPoints = ['100%']
 
 interface Props {
diff --git a/src/view/com/modals/AppealLabel.tsx b/src/view/com/modals/AppealLabel.tsx
index 5756452a2..b0aaaf625 100644
--- a/src/view/com/modals/AppealLabel.tsx
+++ b/src/view/com/modals/AppealLabel.tsx
@@ -1,19 +1,17 @@
-import {ComAtprotoModerationDefs} from '@atproto/api'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {usePalette} from 'lib/hooks/usePalette'
-import {colors, s} from 'lib/styles'
 import React, {useState} from 'react'
 import {StyleSheet, TouchableOpacity, View} from 'react-native'
-
-import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries'
+import {ComAtprotoModerationDefs} from '@atproto/api'
+import {ScrollView, TextInput} from './util'
+import {Text} from '../util/text/Text'
+import {s, colors} from 'lib/styles'
+import {usePalette} from 'lib/hooks/usePalette'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 import {useModalControls} from '#/state/modals'
-import {getAgent} from '#/state/session'
-
 import {CharProgress} from '../composer/char-progress/CharProgress'
-import {Text} from '../util/text/Text'
+import {getAgent} from '#/state/session'
 import * as Toast from '../util/Toast'
-import {ScrollView, TextInput} from './util'
+import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries'
 
 export const snapPoints = ['40%']
 
diff --git a/src/view/com/modals/BirthDateSettings.tsx b/src/view/com/modals/BirthDateSettings.tsx
index dc8b914a5..1cab95989 100644
--- a/src/view/com/modals/BirthDateSettings.tsx
+++ b/src/view/com/modals/BirthDateSettings.tsx
@@ -1,10 +1,3 @@
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {usePalette} from 'lib/hooks/usePalette'
-import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
-import {cleanError} from 'lib/strings/errors'
-import {colors, s} from 'lib/styles'
-import {isWeb} from 'platform/detection'
 import React, {useState} from 'react'
 import {
   ActivityIndicator,
@@ -12,18 +5,23 @@ import {
   TouchableOpacity,
   View,
 } from 'react-native'
-
-import {logger} from '#/logger'
+import {Text} from '../util/text/Text'
+import {DateInput} from '../util/forms/DateInput'
+import {ErrorMessage} from '../util/error/ErrorMessage'
+import {s, colors} from 'lib/styles'
+import {usePalette} from 'lib/hooks/usePalette'
+import {isWeb} from 'platform/detection'
+import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
+import {cleanError} from 'lib/strings/errors'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 import {useModalControls} from '#/state/modals'
 import {
   usePreferencesQuery,
-  UsePreferencesQueryResponse,
   usePreferencesSetBirthDateMutation,
+  UsePreferencesQueryResponse,
 } from '#/state/queries/preferences'
-
-import {ErrorMessage} from '../util/error/ErrorMessage'
-import {DateInput} from '../util/forms/DateInput'
-import {Text} from '../util/text/Text'
+import {logger} from '#/logger'
 
 export const snapPoints = ['50%', '90%']
 
diff --git a/src/view/com/modals/ChangeEmail.tsx b/src/view/com/modals/ChangeEmail.tsx
index 23d0b6f0d..c5672bc81 100644
--- a/src/view/com/modals/ChangeEmail.tsx
+++ b/src/view/com/modals/ChangeEmail.tsx
@@ -1,21 +1,19 @@
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {usePalette} from 'lib/hooks/usePalette'
-import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
-import {cleanError} from 'lib/strings/errors'
-import {colors, s} from 'lib/styles'
-import {isWeb} from 'platform/detection'
 import React, {useState} from 'react'
 import {ActivityIndicator, SafeAreaView, StyleSheet, View} from 'react-native'
-
-import {useModalControls} from '#/state/modals'
-import {getAgent, useSession, useSessionApi} from '#/state/session'
-
-import {ErrorMessage} from '../util/error/ErrorMessage'
-import {Button} from '../util/forms/Button'
+import {ScrollView, TextInput} from './util'
 import {Text} from '../util/text/Text'
+import {Button} from '../util/forms/Button'
+import {ErrorMessage} from '../util/error/ErrorMessage'
 import * as Toast from '../util/Toast'
-import {ScrollView, TextInput} from './util'
+import {s, colors} from 'lib/styles'
+import {usePalette} from 'lib/hooks/usePalette'
+import {isWeb} from 'platform/detection'
+import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
+import {cleanError} from 'lib/strings/errors'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
+import {useModalControls} from '#/state/modals'
+import {useSession, useSessionApi, getAgent} from '#/state/session'
 
 enum Stages {
   InputEmail,
diff --git a/src/view/com/modals/ChangeHandle.tsx b/src/view/com/modals/ChangeHandle.tsx
index 1521b2d5c..a43c30c29 100644
--- a/src/view/com/modals/ChangeHandle.tsx
+++ b/src/view/com/modals/ChangeHandle.tsx
@@ -1,40 +1,38 @@
-import {ComAtprotoServerDescribeServer} from '@atproto/api'
-import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import Clipboard from '@react-native-clipboard/clipboard'
-import {useAnalytics} from 'lib/analytics/analytics'
-import {usePalette} from 'lib/hooks/usePalette'
-import {cleanError} from 'lib/strings/errors'
-import {createFullHandle, makeValidHandle} from 'lib/strings/handles'
-import {s} from 'lib/styles'
-import {useTheme} from 'lib/ThemeContext'
 import React, {useState} from 'react'
+import Clipboard from '@react-native-clipboard/clipboard'
+import {ComAtprotoServerDescribeServer} from '@atproto/api'
+import * as Toast from '../util/Toast'
 import {
   ActivityIndicator,
   StyleSheet,
   TouchableOpacity,
   View,
 } from 'react-native'
-
+import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
+import {ScrollView, TextInput} from './util'
+import {Text} from '../util/text/Text'
+import {Button} from '../util/forms/Button'
+import {SelectableBtn} from '../util/forms/SelectableBtn'
+import {ErrorMessage} from '../util/error/ErrorMessage'
+import {s} from 'lib/styles'
+import {createFullHandle, makeValidHandle} from 'lib/strings/handles'
+import {usePalette} from 'lib/hooks/usePalette'
+import {useTheme} from 'lib/ThemeContext'
+import {useAnalytics} from 'lib/analytics/analytics'
+import {cleanError} from 'lib/strings/errors'
 import {logger} from '#/logger'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 import {useModalControls} from '#/state/modals'
-import {useFetchDid, useUpdateHandleMutation} from '#/state/queries/handle'
 import {useServiceQuery} from '#/state/queries/service'
+import {useUpdateHandleMutation, useFetchDid} from '#/state/queries/handle'
 import {
-  getAgent,
-  SessionAccount,
   useSession,
   useSessionApi,
+  SessionAccount,
+  getAgent,
 } from '#/state/session'
 
-import {ErrorMessage} from '../util/error/ErrorMessage'
-import {Button} from '../util/forms/Button'
-import {SelectableBtn} from '../util/forms/SelectableBtn'
-import {Text} from '../util/text/Text'
-import * as Toast from '../util/Toast'
-import {ScrollView, TextInput} from './util'
-
 export const snapPoints = ['100%']
 
 export type Props = {onChanged: () => void}
diff --git a/src/view/com/modals/ChangePassword.tsx b/src/view/com/modals/ChangePassword.tsx
index ba60e5d88..d8add9794 100644
--- a/src/view/com/modals/ChangePassword.tsx
+++ b/src/view/com/modals/ChangePassword.tsx
@@ -1,13 +1,3 @@
-import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import * as EmailValidator from 'email-validator'
-import {usePalette} from 'lib/hooks/usePalette'
-import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
-import {cleanError, isNetworkError} from 'lib/strings/errors'
-import {checkAndFormatResetCode} from 'lib/strings/password'
-import {colors, s} from 'lib/styles'
-import {isAndroid, isWeb} from 'platform/detection'
 import React, {useState} from 'react'
 import {
   ActivityIndicator,
@@ -16,16 +6,24 @@ import {
   TouchableOpacity,
   View,
 } from 'react-native'
-
-import {logger} from '#/logger'
-import {useModalControls} from '#/state/modals'
-import {getAgent, useSession} from '#/state/session'
-
-import {ErrorMessage} from '../util/error/ErrorMessage'
-import {Button} from '../util/forms/Button'
-import {Text} from '../util/text/Text'
 import {ScrollView} from './util'
+import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
 import {TextInput} from './util'
+import {Text} from '../util/text/Text'
+import {Button} from '../util/forms/Button'
+import {ErrorMessage} from '../util/error/ErrorMessage'
+import {s, colors} from 'lib/styles'
+import {usePalette} from 'lib/hooks/usePalette'
+import {isAndroid, isWeb} from 'platform/detection'
+import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
+import {cleanError, isNetworkError} from 'lib/strings/errors'
+import {checkAndFormatResetCode} from 'lib/strings/password'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
+import {useModalControls} from '#/state/modals'
+import {useSession, getAgent} from '#/state/session'
+import * as EmailValidator from 'email-validator'
+import {logger} from '#/logger'
 
 enum Stages {
   RequestCode,
diff --git a/src/view/com/modals/Confirm.tsx b/src/view/com/modals/Confirm.tsx
index 470d3cf61..307897fb8 100644
--- a/src/view/com/modals/Confirm.tsx
+++ b/src/view/com/modals/Confirm.tsx
@@ -1,9 +1,3 @@
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {usePalette} from 'lib/hooks/usePalette'
-import {cleanError} from 'lib/strings/errors'
-import {colors, s} from 'lib/styles'
-import {isWeb} from 'platform/detection'
 import React, {useState} from 'react'
 import {
   ActivityIndicator,
@@ -11,13 +5,17 @@ import {
   TouchableOpacity,
   View,
 } from 'react-native'
-
+import {Text} from '../util/text/Text'
+import {s, colors} from 'lib/styles'
+import {ErrorMessage} from '../util/error/ErrorMessage'
+import {cleanError} from 'lib/strings/errors'
+import {usePalette} from 'lib/hooks/usePalette'
+import {isWeb} from 'platform/detection'
+import {useLingui} from '@lingui/react'
+import {Trans, msg} from '@lingui/macro'
 import type {ConfirmModal} from '#/state/modals'
 import {useModalControls} from '#/state/modals'
 
-import {ErrorMessage} from '../util/error/ErrorMessage'
-import {Text} from '../util/text/Text'
-
 export const snapPoints = ['50%']
 
 export function Component({
diff --git a/src/view/com/modals/ContentFilteringSettings.tsx b/src/view/com/modals/ContentFilteringSettings.tsx
index ed0b6dcf8..328d23dc2 100644
--- a/src/view/com/modals/ContentFilteringSettings.tsx
+++ b/src/view/com/modals/ContentFilteringSettings.tsx
@@ -1,32 +1,30 @@
+import React from 'react'
 import {LabelPreference} from '@atproto/api'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
+import {StyleSheet, Pressable, View, Linking} from 'react-native'
+import LinearGradient from 'react-native-linear-gradient'
+import {ScrollView} from './util'
+import {s, colors, gradients} from 'lib/styles'
+import {Text} from '../util/text/Text'
+import {TextLink} from '../util/Link'
+import {ToggleButton} from '../util/forms/ToggleButton'
+import {Button} from '../util/forms/Button'
 import {usePalette} from 'lib/hooks/usePalette'
-import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
-import {colors, gradients, s} from 'lib/styles'
 import {isIOS} from 'platform/detection'
-import React from 'react'
-import {Linking, Pressable, StyleSheet, View} from 'react-native'
-import LinearGradient from 'react-native-linear-gradient'
-
+import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
+import * as Toast from '../util/Toast'
 import {logger} from '#/logger'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 import {useModalControls} from '#/state/modals'
 import {
-  CONFIGURABLE_LABEL_GROUPS,
-  ConfigurableLabelGroup,
   usePreferencesQuery,
-  UsePreferencesQueryResponse,
-  usePreferencesSetAdultContentMutation,
   usePreferencesSetContentLabelMutation,
+  usePreferencesSetAdultContentMutation,
+  ConfigurableLabelGroup,
+  CONFIGURABLE_LABEL_GROUPS,
+  UsePreferencesQueryResponse,
 } from '#/state/queries/preferences'
 
-import {Button} from '../util/forms/Button'
-import {ToggleButton} from '../util/forms/ToggleButton'
-import {TextLink} from '../util/Link'
-import {Text} from '../util/text/Text'
-import * as Toast from '../util/Toast'
-import {ScrollView} from './util'
-
 export const snapPoints = ['90%']
 
 export function Component({}: {}) {
diff --git a/src/view/com/modals/CreateOrEditList.tsx b/src/view/com/modals/CreateOrEditList.tsx
index 3c7618e1e..0e11fcffd 100644
--- a/src/view/com/modals/CreateOrEditList.tsx
+++ b/src/view/com/modals/CreateOrEditList.tsx
@@ -1,19 +1,4 @@
-import {
-  AppBskyGraphDefs,
-  AppBskyRichtextFacet,
-  RichText as RichTextAPI,
-} from '@atproto/api'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {useAnalytics} from 'lib/analytics/analytics'
-import {usePalette} from 'lib/hooks/usePalette'
-import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
-import {compressIfNeeded} from 'lib/media/manip'
-import {cleanError, isNetworkError} from 'lib/strings/errors'
-import {enforceLen} from 'lib/strings/helpers'
-import {colors, gradients, s} from 'lib/styles'
-import {useTheme} from 'lib/ThemeContext'
-import React, {useCallback, useMemo, useState} from 'react'
+import React, {useState, useCallback, useMemo} from 'react'
 import {
   ActivityIndicator,
   KeyboardAvoidingView,
@@ -23,23 +8,36 @@ import {
   TouchableOpacity,
   View,
 } from 'react-native'
-import {Image as RNImage} from 'react-native-image-crop-picker'
+import {
+  AppBskyGraphDefs,
+  AppBskyRichtextFacet,
+  RichText as RichTextAPI,
+} from '@atproto/api'
 import LinearGradient from 'react-native-linear-gradient'
-
-import {richTextToString} from '#/lib/strings/rich-text-helpers'
-import {shortenLinks} from '#/lib/strings/rich-text-manip'
+import {Image as RNImage} from 'react-native-image-crop-picker'
+import {Text} from '../util/text/Text'
+import {ErrorMessage} from '../util/error/ErrorMessage'
+import * as Toast from '../util/Toast'
+import {s, colors, gradients} from 'lib/styles'
+import {enforceLen} from 'lib/strings/helpers'
+import {compressIfNeeded} from 'lib/media/manip'
+import {EditableUserAvatar} from '../util/UserAvatar'
+import {usePalette} from 'lib/hooks/usePalette'
+import {useTheme} from 'lib/ThemeContext'
+import {useAnalytics} from 'lib/analytics/analytics'
+import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
+import {cleanError, isNetworkError} from 'lib/strings/errors'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 import {useModalControls} from '#/state/modals'
 import {
   useListCreateMutation,
   useListMetadataMutation,
 } from '#/state/queries/list'
+import {richTextToString} from '#/lib/strings/rich-text-helpers'
+import {shortenLinks} from '#/lib/strings/rich-text-manip'
 import {getAgent} from '#/state/session'
 
-import {ErrorMessage} from '../util/error/ErrorMessage'
-import {Text} from '../util/text/Text'
-import * as Toast from '../util/Toast'
-import {EditableUserAvatar} from '../util/UserAvatar'
-
 const MAX_NAME = 64 // todo
 const MAX_DESCRIPTION = 300 // todo
 
diff --git a/src/view/com/modals/DeleteAccount.tsx b/src/view/com/modals/DeleteAccount.tsx
index f0d2af8d2..40d78cfe0 100644
--- a/src/view/com/modals/DeleteAccount.tsx
+++ b/src/view/com/modals/DeleteAccount.tsx
@@ -1,29 +1,27 @@
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {usePalette} from 'lib/hooks/usePalette'
-import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
-import {cleanError} from 'lib/strings/errors'
-import {colors, gradients, s} from 'lib/styles'
-import {useTheme} from 'lib/ThemeContext'
-import {isAndroid} from 'platform/detection'
 import React from 'react'
 import {
-  ActivityIndicator,
   SafeAreaView,
+  ActivityIndicator,
   StyleSheet,
   TouchableOpacity,
   View,
 } from 'react-native'
+import {TextInput, ScrollView} from './util'
 import LinearGradient from 'react-native-linear-gradient'
-
-import {useModalControls} from '#/state/modals'
-import {getAgent, useSession, useSessionApi} from '#/state/session'
-
-import {resetToTab} from '../../../Navigation'
-import {ErrorMessage} from '../util/error/ErrorMessage'
-import {Text} from '../util/text/Text'
 import * as Toast from '../util/Toast'
-import {ScrollView, TextInput} from './util'
+import {Text} from '../util/text/Text'
+import {s, colors, gradients} from 'lib/styles'
+import {usePalette} from 'lib/hooks/usePalette'
+import {useTheme} from 'lib/ThemeContext'
+import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
+import {ErrorMessage} from '../util/error/ErrorMessage'
+import {cleanError} from 'lib/strings/errors'
+import {resetToTab} from '../../../Navigation'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
+import {useModalControls} from '#/state/modals'
+import {useSession, useSessionApi, getAgent} from '#/state/session'
+import {isAndroid} from 'platform/detection'
 
 export const snapPoints = isAndroid ? ['90%'] : ['55%']
 
diff --git a/src/view/com/modals/EditImage.tsx b/src/view/com/modals/EditImage.tsx
index 0b77a506a..3b35ffee2 100644
--- a/src/view/com/modals/EditImage.tsx
+++ b/src/view/com/modals/EditImage.tsx
@@ -1,29 +1,27 @@
-import {MaterialIcons} from '@expo/vector-icons'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {Slider} from '@miblanchard/react-native-slider'
-import {MAX_ALT_TEXT} from 'lib/constants'
-import {usePalette} from 'lib/hooks/usePalette'
-import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
-import {RectTallIcon, RectWideIcon, SquareIcon} from 'lib/icons'
-import {enforceLen} from 'lib/strings/helpers'
-import {gradients, s} from 'lib/styles'
-import {useTheme} from 'lib/ThemeContext'
-import {getKeys} from 'lib/type-assertions'
-import {observer} from 'mobx-react-lite'
 import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react'
-import ImageEditor, {Position} from 'react-avatar-editor'
 import {Pressable, StyleSheet, View} from 'react-native'
+import {usePalette} from 'lib/hooks/usePalette'
 import {useWindowDimensions} from 'react-native'
+import {gradients, s} from 'lib/styles'
+import {useTheme} from 'lib/ThemeContext'
+import {Text} from '../util/text/Text'
 import LinearGradient from 'react-native-linear-gradient'
+import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
+import ImageEditor, {Position} from 'react-avatar-editor'
+import {TextInput} from './util'
+import {enforceLen} from 'lib/strings/helpers'
+import {MAX_ALT_TEXT} from 'lib/constants'
 import {GalleryModel} from 'state/models/media/gallery'
 import {ImageModel} from 'state/models/media/image'
-
+import {SquareIcon, RectWideIcon, RectTallIcon} from 'lib/icons'
+import {Slider} from '@miblanchard/react-native-slider'
+import {MaterialIcons} from '@expo/vector-icons'
+import {observer} from 'mobx-react-lite'
+import {getKeys} from 'lib/type-assertions'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 import {useModalControls} from '#/state/modals'
 
-import {Text} from '../util/text/Text'
-import {TextInput} from './util'
-
 export const snapPoints = ['80%']
 
 const RATIOS = {
diff --git a/src/view/com/modals/EditProfile.tsx b/src/view/com/modals/EditProfile.tsx
index 7e11e6bbc..097b7b0d1 100644
--- a/src/view/com/modals/EditProfile.tsx
+++ b/src/view/com/modals/EditProfile.tsx
@@ -1,16 +1,5 @@
-import {AppBskyActorDefs} from '@atproto/api'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {useAnalytics} from 'lib/analytics/analytics'
-import {MAX_DESCRIPTION, MAX_DISPLAY_NAME} from 'lib/constants'
-import {usePalette} from 'lib/hooks/usePalette'
-import {compressIfNeeded} from 'lib/media/manip'
-import {cleanError} from 'lib/strings/errors'
-import {enforceLen} from 'lib/strings/helpers'
-import {colors, gradients, s} from 'lib/styles'
-import {useTheme} from 'lib/ThemeContext'
-import {isWeb} from 'platform/detection'
-import React, {useCallback, useState} from 'react'
+import React, {useState, useCallback} from 'react'
+import * as Toast from '../util/Toast'
 import {
   ActivityIndicator,
   KeyboardAvoidingView,
@@ -20,19 +9,28 @@ import {
   TouchableOpacity,
   View,
 } from 'react-native'
-import {Image as RNImage} from 'react-native-image-crop-picker'
 import LinearGradient from 'react-native-linear-gradient'
+import {Image as RNImage} from 'react-native-image-crop-picker'
+import {AppBskyActorDefs} from '@atproto/api'
+import {Text} from '../util/text/Text'
+import {ErrorMessage} from '../util/error/ErrorMessage'
+import {s, colors, gradients} from 'lib/styles'
+import {enforceLen} from 'lib/strings/helpers'
+import {MAX_DISPLAY_NAME, MAX_DESCRIPTION} from 'lib/constants'
+import {compressIfNeeded} from 'lib/media/manip'
+import {UserBanner} from '../util/UserBanner'
+import {EditableUserAvatar} from '../util/UserAvatar'
+import {usePalette} from 'lib/hooks/usePalette'
+import {useTheme} from 'lib/ThemeContext'
+import {useAnalytics} from 'lib/analytics/analytics'
+import {cleanError} from 'lib/strings/errors'
 import Animated, {FadeOut} from 'react-native-reanimated'
-
-import {logger} from '#/logger'
+import {isWeb} from 'platform/detection'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 import {useModalControls} from '#/state/modals'
 import {useProfileUpdateMutation} from '#/state/queries/profile'
-
-import {ErrorMessage} from '../util/error/ErrorMessage'
-import {Text} from '../util/text/Text'
-import * as Toast from '../util/Toast'
-import {EditableUserAvatar} from '../util/UserAvatar'
-import {UserBanner} from '../util/UserBanner'
+import {logger} from '#/logger'
 
 const AnimatedTouchableOpacity =
   Animated.createAnimatedComponent(TouchableOpacity)
diff --git a/src/view/com/modals/EmbedConsent.tsx b/src/view/com/modals/EmbedConsent.tsx
index 9eaaf082a..04104c52e 100644
--- a/src/view/com/modals/EmbedConsent.tsx
+++ b/src/view/com/modals/EmbedConsent.tsx
@@ -1,22 +1,20 @@
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {usePalette} from 'lib/hooks/usePalette'
-import {colors, gradients, s} from 'lib/styles'
 import React from 'react'
 import {StyleSheet, TouchableOpacity, View} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
-
-import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries'
+import {s, colors, gradients} from 'lib/styles'
+import {Text} from '../util/text/Text'
+import {ScrollView} from './util'
+import {usePalette} from 'lib/hooks/usePalette'
 import {
   EmbedPlayerSource,
   embedPlayerSources,
   externalEmbedLabels,
 } from '#/lib/strings/embed-player'
+import {msg, Trans} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 import {useModalControls} from '#/state/modals'
 import {useSetExternalEmbedPref} from '#/state/preferences/external-embeds-prefs'
-
-import {Text} from '../util/text/Text'
-import {ScrollView} from './util'
+import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries'
 
 export const snapPoints = [450]
 
diff --git a/src/view/com/modals/InAppBrowserConsent.tsx b/src/view/com/modals/InAppBrowserConsent.tsx
index cc1903757..86bb46ca8 100644
--- a/src/view/com/modals/InAppBrowserConsent.tsx
+++ b/src/view/com/modals/InAppBrowserConsent.tsx
@@ -1,20 +1,20 @@
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {usePalette} from 'lib/hooks/usePalette'
-import {s} from 'lib/styles'
 import React from 'react'
 import {StyleSheet, View} from 'react-native'
 
+import {s} from 'lib/styles'
+import {Text} from '../util/text/Text'
+import {Button} from '../util/forms/Button'
+import {ScrollView} from './util'
+import {usePalette} from 'lib/hooks/usePalette'
+
+import {msg, Trans} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 import {useModalControls} from '#/state/modals'
 import {
   useOpenLink,
   useSetInAppBrowser,
 } from '#/state/preferences/in-app-browser'
 
-import {Button} from '../util/forms/Button'
-import {Text} from '../util/text/Text'
-import {ScrollView} from './util'
-
 export const snapPoints = [350]
 
 export function Component({href}: {href: string}) {
diff --git a/src/view/com/modals/InviteCodes.tsx b/src/view/com/modals/InviteCodes.tsx
index 80155e228..c0318df01 100644
--- a/src/view/com/modals/InviteCodes.tsx
+++ b/src/view/com/modals/InviteCodes.tsx
@@ -1,38 +1,36 @@
+import React from 'react'
+import {
+  StyleSheet,
+  TouchableOpacity,
+  View,
+  ActivityIndicator,
+} from 'react-native'
 import {ComAtprotoServerDefs} from '@atproto/api'
 import {
   FontAwesomeIcon,
   FontAwesomeIconStyle,
 } from '@fortawesome/react-native-fontawesome'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
 import Clipboard from '@react-native-clipboard/clipboard'
+import {Text} from '../util/text/Text'
+import {Button} from '../util/forms/Button'
+import * as Toast from '../util/Toast'
+import {ScrollView} from './util'
 import {usePalette} from 'lib/hooks/usePalette'
+import {isWeb} from 'platform/detection'
 import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
+import {Trans, msg} from '@lingui/macro'
 import {cleanError} from 'lib/strings/errors'
-import {isWeb} from 'platform/detection'
-import React from 'react'
-import {
-  ActivityIndicator,
-  StyleSheet,
-  TouchableOpacity,
-  View,
-} from 'react-native'
-
-import {makeProfileLink} from '#/lib/routes/links'
-import {useInvitesAPI, useInvitesState} from '#/state/invites'
 import {useModalControls} from '#/state/modals'
+import {useInvitesState, useInvitesAPI} from '#/state/invites'
+import {UserInfoText} from '../util/UserInfoText'
+import {makeProfileLink} from '#/lib/routes/links'
+import {Link} from '../util/Link'
+import {ErrorMessage} from '../util/error/ErrorMessage'
 import {
-  InviteCodesQueryResponse,
   useInviteCodesQuery,
+  InviteCodesQueryResponse,
 } from '#/state/queries/invites'
-
-import {ErrorMessage} from '../util/error/ErrorMessage'
-import {Button} from '../util/forms/Button'
-import {Link} from '../util/Link'
-import {Text} from '../util/text/Text'
-import * as Toast from '../util/Toast'
-import {UserInfoText} from '../util/UserInfoText'
-import {ScrollView} from './util'
+import {useLingui} from '@lingui/react'
 
 export const snapPoints = ['70%']
 
diff --git a/src/view/com/modals/LinkWarning.tsx b/src/view/com/modals/LinkWarning.tsx
index 1d0f1bda6..81fdc7285 100644
--- a/src/view/com/modals/LinkWarning.tsx
+++ b/src/view/com/modals/LinkWarning.tsx
@@ -1,21 +1,19 @@
+import React from 'react'
+import {SafeAreaView, StyleSheet, View} from 'react-native'
+import {ScrollView} from './util'
 import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
+import {Text} from '../util/text/Text'
+import {Button} from '../util/forms/Button'
+import {s, colors} from 'lib/styles'
 import {usePalette} from 'lib/hooks/usePalette'
+import {isWeb} from 'platform/detection'
 import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
 import {isPossiblyAUrl, splitApexDomain} from 'lib/strings/url-helpers'
-import {colors, s} from 'lib/styles'
-import {isWeb} from 'platform/detection'
-import React from 'react'
-import {SafeAreaView, StyleSheet, View} from 'react-native'
-
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 import {useModalControls} from '#/state/modals'
 import {useOpenLink} from '#/state/preferences/in-app-browser'
 
-import {Button} from '../util/forms/Button'
-import {Text} from '../util/text/Text'
-import {ScrollView} from './util'
-
 export const snapPoints = ['50%']
 
 export function Component({text, href}: {text: string; href: string}) {
diff --git a/src/view/com/modals/ListAddRemoveUsers.tsx b/src/view/com/modals/ListAddRemoveUsers.tsx
index eae746d2b..27c33f806 100644
--- a/src/view/com/modals/ListAddRemoveUsers.tsx
+++ b/src/view/com/modals/ListAddRemoveUsers.tsx
@@ -1,15 +1,3 @@
-import {AppBskyActorDefs, AppBskyGraphDefs} from '@atproto/api'
-import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {useIsKeyboardVisible} from 'lib/hooks/useIsKeyboardVisible'
-import {usePalette} from 'lib/hooks/usePalette'
-import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
-import {sanitizeDisplayName} from 'lib/strings/display-names'
-import {cleanError} from 'lib/strings/errors'
-import {sanitizeHandle} from 'lib/strings/handles'
-import {colors, s} from 'lib/styles'
-import {isWeb} from 'platform/detection'
 import React, {useCallback, useState} from 'react'
 import {
   ActivityIndicator,
@@ -18,23 +6,33 @@ import {
   StyleSheet,
   View,
 } from 'react-native'
-
+import {AppBskyActorDefs, AppBskyGraphDefs} from '@atproto/api'
+import {ScrollView, TextInput} from './util'
+import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
+import {Text} from '../util/text/Text'
+import {Button} from '../util/forms/Button'
+import {UserAvatar} from '../util/UserAvatar'
+import * as Toast from '../util/Toast'
+import {s, colors} from 'lib/styles'
+import {usePalette} from 'lib/hooks/usePalette'
+import {isWeb} from 'platform/detection'
+import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
+import {useIsKeyboardVisible} from 'lib/hooks/useIsKeyboardVisible'
+import {cleanError} from 'lib/strings/errors'
+import {sanitizeDisplayName} from 'lib/strings/display-names'
+import {sanitizeHandle} from 'lib/strings/handles'
 import {HITSLOP_20} from '#/lib/constants'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 import {useModalControls} from '#/state/modals'
-import {useActorAutocompleteQuery} from '#/state/queries/actor-autocomplete'
 import {
+  useDangerousListMembershipsQuery,
   getMembership,
   ListMembersip,
-  useDangerousListMembershipsQuery,
   useListMembershipAddMutation,
   useListMembershipRemoveMutation,
 } from '#/state/queries/list-memberships'
-
-import {Button} from '../util/forms/Button'
-import {Text} from '../util/text/Text'
-import * as Toast from '../util/Toast'
-import {UserAvatar} from '../util/UserAvatar'
-import {ScrollView, TextInput} from './util'
+import {useActorAutocompleteQuery} from '#/state/queries/actor-autocomplete'
 
 export const snapPoints = ['90%']
 
diff --git a/src/view/com/modals/Modal.tsx b/src/view/com/modals/Modal.tsx
index fb0ea471d..100444ff5 100644
--- a/src/view/com/modals/Modal.tsx
+++ b/src/view/com/modals/Modal.tsx
@@ -1,40 +1,39 @@
-import BottomSheet from '@gorhom/bottom-sheet'
-import {usePalette} from 'lib/hooks/usePalette'
-import React, {useEffect, useRef} from 'react'
+import React, {useRef, useEffect} from 'react'
 import {StyleSheet} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
-
-import {useModalControls, useModals} from '#/state/modals'
-
+import BottomSheet from '@gorhom/bottom-sheet'
 import {createCustomBackdrop} from '../util/BottomSheetCustomBackdrop'
-import * as AddAppPassword from './AddAppPasswords'
+import {usePalette} from 'lib/hooks/usePalette'
+
+import {useModals, useModalControls} from '#/state/modals'
+import * as ConfirmModal from './Confirm'
+import * as EditProfileModal from './EditProfile'
+import * as RepostModal from './Repost'
+import * as SelfLabelModal from './SelfLabel'
+import * as ThreadgateModal from './Threadgate'
+import * as CreateOrEditListModal from './CreateOrEditList'
+import * as UserAddRemoveListsModal from './UserAddRemoveLists'
+import * as ListAddUserModal from './ListAddRemoveUsers'
 import * as AltImageModal from './AltImage'
 import * as EditImageModal from './AltImage'
+import * as ReportModal from './report/Modal'
 import * as AppealLabelModal from './AppealLabel'
-import * as BirthDateSettingsModal from './BirthDateSettings'
-import * as ChangeEmailModal from './ChangeEmail'
-import * as ChangeHandleModal from './ChangeHandle'
-import * as ChangePasswordModal from './ChangePassword'
-import * as ConfirmModal from './Confirm'
-import * as ContentFilteringSettingsModal from './ContentFilteringSettings'
-import * as CreateOrEditListModal from './CreateOrEditList'
 import * as DeleteAccountModal from './DeleteAccount'
-import * as EditProfileModal from './EditProfile'
-import * as EmbedConsentModal from './EmbedConsent'
-import * as InAppBrowserConsentModal from './InAppBrowserConsent'
+import * as ChangeHandleModal from './ChangeHandle'
 import * as InviteCodesModal from './InviteCodes'
+import * as AddAppPassword from './AddAppPasswords'
+import * as ContentFilteringSettingsModal from './ContentFilteringSettings'
 import * as ContentLanguagesSettingsModal from './lang-settings/ContentLanguagesSettings'
 import * as PostLanguagesSettingsModal from './lang-settings/PostLanguagesSettings'
-import * as LinkWarningModal from './LinkWarning'
-import * as ListAddUserModal from './ListAddRemoveUsers'
 import * as ModerationDetailsModal from './ModerationDetails'
-import * as ReportModal from './report/Modal'
-import * as RepostModal from './Repost'
-import * as SelfLabelModal from './SelfLabel'
-import * as SwitchAccountModal from './SwitchAccount'
-import * as ThreadgateModal from './Threadgate'
-import * as UserAddRemoveListsModal from './UserAddRemoveLists'
+import * as BirthDateSettingsModal from './BirthDateSettings'
 import * as VerifyEmailModal from './VerifyEmail'
+import * as ChangeEmailModal from './ChangeEmail'
+import * as ChangePasswordModal from './ChangePassword'
+import * as SwitchAccountModal from './SwitchAccount'
+import * as LinkWarningModal from './LinkWarning'
+import * as EmbedConsentModal from './EmbedConsent'
+import * as InAppBrowserConsentModal from './InAppBrowserConsent'
 
 const DEFAULT_SNAPPOINTS = ['90%']
 const HANDLE_HEIGHT = 24
diff --git a/src/view/com/modals/Modal.web.tsx b/src/view/com/modals/Modal.web.tsx
index 295942dd6..0ced894a1 100644
--- a/src/view/com/modals/Modal.web.tsx
+++ b/src/view/com/modals/Modal.web.tsx
@@ -1,40 +1,39 @@
-import {usePalette} from 'lib/hooks/usePalette'
-import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
 import React from 'react'
-import {StyleSheet, TouchableWithoutFeedback, View} from 'react-native'
+import {TouchableWithoutFeedback, StyleSheet, View} from 'react-native'
 import Animated, {FadeIn, FadeOut} from 'react-native-reanimated'
-
+import {usePalette} from 'lib/hooks/usePalette'
+import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
 import {useWebBodyScrollLock} from '#/lib/hooks/useWebBodyScrollLock'
-import type {Modal as ModalIface} from '#/state/modals'
-import {useModalControls, useModals} from '#/state/modals'
 
-import * as AddAppPassword from './AddAppPasswords'
-import * as AltTextImageModal from './AltImage'
-import * as AppealLabelModal from './AppealLabel'
-import * as BirthDateSettingsModal from './BirthDateSettings'
-import * as ChangeEmailModal from './ChangeEmail'
-import * as ChangeHandleModal from './ChangeHandle'
-import * as ChangePasswordModal from './ChangePassword'
+import {useModals, useModalControls} from '#/state/modals'
+import type {Modal as ModalIface} from '#/state/modals'
 import * as ConfirmModal from './Confirm'
-import * as ContentFilteringSettingsModal from './ContentFilteringSettings'
+import * as EditProfileModal from './EditProfile'
+import * as ReportModal from './report/Modal'
+import * as AppealLabelModal from './AppealLabel'
 import * as CreateOrEditListModal from './CreateOrEditList'
-import * as CropImageModal from './crop-image/CropImage.web'
+import * as UserAddRemoveLists from './UserAddRemoveLists'
+import * as ListAddUserModal from './ListAddRemoveUsers'
 import * as DeleteAccountModal from './DeleteAccount'
+import * as RepostModal from './Repost'
+import * as SelfLabelModal from './SelfLabel'
+import * as ThreadgateModal from './Threadgate'
+import * as CropImageModal from './crop-image/CropImage.web'
+import * as AltTextImageModal from './AltImage'
 import * as EditImageModal from './EditImage'
-import * as EditProfileModal from './EditProfile'
-import * as EmbedConsentModal from './EmbedConsent'
+import * as ChangeHandleModal from './ChangeHandle'
 import * as InviteCodesModal from './InviteCodes'
+import * as AddAppPassword from './AddAppPasswords'
+import * as ContentFilteringSettingsModal from './ContentFilteringSettings'
 import * as ContentLanguagesSettingsModal from './lang-settings/ContentLanguagesSettings'
 import * as PostLanguagesSettingsModal from './lang-settings/PostLanguagesSettings'
-import * as LinkWarningModal from './LinkWarning'
-import * as ListAddUserModal from './ListAddRemoveUsers'
 import * as ModerationDetailsModal from './ModerationDetails'
-import * as ReportModal from './report/Modal'
-import * as RepostModal from './Repost'
-import * as SelfLabelModal from './SelfLabel'
-import * as ThreadgateModal from './Threadgate'
-import * as UserAddRemoveLists from './UserAddRemoveLists'
+import * as BirthDateSettingsModal from './BirthDateSettings'
 import * as VerifyEmailModal from './VerifyEmail'
+import * as ChangeEmailModal from './ChangeEmail'
+import * as ChangePasswordModal from './ChangePassword'
+import * as LinkWarningModal from './LinkWarning'
+import * as EmbedConsentModal from './EmbedConsent'
 
 export function ModalsContainer() {
   const {isModalActive, activeModals} = useModals()
diff --git a/src/view/com/modals/ModerationDetails.tsx b/src/view/com/modals/ModerationDetails.tsx
index 77b7628e6..f890d50dc 100644
--- a/src/view/com/modals/ModerationDetails.tsx
+++ b/src/view/com/modals/ModerationDetails.tsx
@@ -1,19 +1,17 @@
+import React from 'react'
+import {StyleSheet, View} from 'react-native'
 import {ModerationUI} from '@atproto/api'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {usePalette} from 'lib/hooks/usePalette'
 import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
-import {listUriToHref} from 'lib/strings/url-helpers'
 import {s} from 'lib/styles'
+import {Text} from '../util/text/Text'
+import {TextLink} from '../util/Link'
+import {usePalette} from 'lib/hooks/usePalette'
 import {isWeb} from 'platform/detection'
-import React from 'react'
-import {StyleSheet, View} from 'react-native'
-
-import {useModalControls} from '#/state/modals'
-
+import {listUriToHref} from 'lib/strings/url-helpers'
 import {Button} from '../util/forms/Button'
-import {TextLink} from '../util/Link'
-import {Text} from '../util/text/Text'
+import {useModalControls} from '#/state/modals'
+import {useLingui} from '@lingui/react'
+import {Trans, msg} from '@lingui/macro'
 
 export const snapPoints = [300]
 
diff --git a/src/view/com/modals/Repost.tsx b/src/view/com/modals/Repost.tsx
index a052979dd..6e4881adc 100644
--- a/src/view/com/modals/Repost.tsx
+++ b/src/view/com/modals/Repost.tsx
@@ -1,16 +1,14 @@
-import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {usePalette} from 'lib/hooks/usePalette'
-import {RepostIcon} from 'lib/icons'
-import {colors, gradients, s} from 'lib/styles'
 import React from 'react'
 import {StyleSheet, TouchableOpacity, View} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
-
-import {useModalControls} from '#/state/modals'
-
+import {s, colors, gradients} from 'lib/styles'
 import {Text} from '../util/text/Text'
+import {usePalette} from 'lib/hooks/usePalette'
+import {RepostIcon} from 'lib/icons'
+import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
+import {useModalControls} from '#/state/modals'
 
 export const snapPoints = [250]
 
diff --git a/src/view/com/modals/SelfLabel.tsx b/src/view/com/modals/SelfLabel.tsx
index a79a90d37..779a9e71b 100644
--- a/src/view/com/modals/SelfLabel.tsx
+++ b/src/view/com/modals/SelfLabel.tsx
@@ -1,18 +1,16 @@
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
+import React, {useState} from 'react'
+import {StyleSheet, TouchableOpacity, View} from 'react-native'
+import {Text} from '../util/text/Text'
+import {s, colors} from 'lib/styles'
 import {usePalette} from 'lib/hooks/usePalette'
 import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
-import {colors, s} from 'lib/styles'
 import {isWeb} from 'platform/detection'
-import React, {useState} from 'react'
-import {StyleSheet, TouchableOpacity, View} from 'react-native'
-import {ScrollView} from 'view/com/modals/util'
-
-import {useModalControls} from '#/state/modals'
-
 import {Button} from '../util/forms/Button'
 import {SelectableBtn} from '../util/forms/SelectableBtn'
-import {Text} from '../util/text/Text'
+import {ScrollView} from 'view/com/modals/util'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
+import {useModalControls} from '#/state/modals'
 
 const ADULT_CONTENT_LABELS = ['sexual', 'nudity', 'porn']
 
diff --git a/src/view/com/modals/SwitchAccount.tsx b/src/view/com/modals/SwitchAccount.tsx
index 220aba43f..c034c4b52 100644
--- a/src/view/com/modals/SwitchAccount.tsx
+++ b/src/view/com/modals/SwitchAccount.tsx
@@ -1,12 +1,3 @@
-import {BottomSheetScrollView} from '@gorhom/bottom-sheet'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {useAnalytics} from 'lib/analytics/analytics'
-import {Haptics} from 'lib/haptics'
-import {useAccountSwitcher} from 'lib/hooks/useAccountSwitcher'
-import {usePalette} from 'lib/hooks/usePalette'
-import {makeProfileLink} from 'lib/routes/links'
-import {s} from 'lib/styles'
 import React from 'react'
 import {
   ActivityIndicator,
@@ -14,15 +5,22 @@ import {
   TouchableOpacity,
   View,
 } from 'react-native'
-
-import {useProfileQuery} from '#/state/queries/profile'
-import {SessionAccount, useSession, useSessionApi} from '#/state/session'
-import {useCloseAllActiveElements} from '#/state/util'
-
-import {AccountDropdownBtn} from '../util/AccountDropdownBtn'
-import {Link} from '../util/Link'
 import {Text} from '../util/text/Text'
+import {s} from 'lib/styles'
+import {usePalette} from 'lib/hooks/usePalette'
+import {useAnalytics} from 'lib/analytics/analytics'
+import {useAccountSwitcher} from 'lib/hooks/useAccountSwitcher'
 import {UserAvatar} from '../util/UserAvatar'
+import {AccountDropdownBtn} from '../util/AccountDropdownBtn'
+import {Link} from '../util/Link'
+import {makeProfileLink} from 'lib/routes/links'
+import {BottomSheetScrollView} from '@gorhom/bottom-sheet'
+import {Haptics} from 'lib/haptics'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
+import {useSession, useSessionApi, SessionAccount} from '#/state/session'
+import {useProfileQuery} from '#/state/queries/profile'
+import {useCloseAllActiveElements} from '#/state/util'
 
 export const snapPoints = ['40%', '90%']
 
diff --git a/src/view/com/modals/Threadgate.tsx b/src/view/com/modals/Threadgate.tsx
index b7661c428..0e49fc2f3 100644
--- a/src/view/com/modals/Threadgate.tsx
+++ b/src/view/com/modals/Threadgate.tsx
@@ -1,10 +1,3 @@
-import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {usePalette} from 'lib/hooks/usePalette'
-import {colors, s} from 'lib/styles'
-import isEqual from 'lodash.isequal'
-import {isWeb} from 'platform/detection'
 import React, {useState} from 'react'
 import {
   Pressable,
@@ -14,13 +7,18 @@ import {
   View,
   ViewStyle,
 } from 'react-native'
+import {Text} from '../util/text/Text'
+import {s, colors} from 'lib/styles'
+import {usePalette} from 'lib/hooks/usePalette'
+import {isWeb} from 'platform/detection'
 import {ScrollView} from 'view/com/modals/util'
-
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 import {useModalControls} from '#/state/modals'
-import {useMyListsQuery} from '#/state/queries/my-lists'
 import {ThreadgateSetting} from '#/state/queries/threadgate'
-
-import {Text} from '../util/text/Text'
+import {useMyListsQuery} from '#/state/queries/my-lists'
+import isEqual from 'lodash.isequal'
+import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
 
 export const snapPoints = ['60%']
 
diff --git a/src/view/com/modals/UserAddRemoveLists.tsx b/src/view/com/modals/UserAddRemoveLists.tsx
index ff5dfea1d..8452f2513 100644
--- a/src/view/com/modals/UserAddRemoveLists.tsx
+++ b/src/view/com/modals/UserAddRemoveLists.tsx
@@ -1,11 +1,3 @@
-import {AppBskyGraphDefs as GraphDefs} from '@atproto/api'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {usePalette} from 'lib/hooks/usePalette'
-import {sanitizeDisplayName} from 'lib/strings/display-names'
-import {sanitizeHandle} from 'lib/strings/handles'
-import {s} from 'lib/styles'
-import {isAndroid, isMobileWeb, isWeb} from 'platform/detection'
 import React, {useCallback} from 'react'
 import {
   ActivityIndicator,
@@ -13,24 +5,30 @@ import {
   useWindowDimensions,
   View,
 } from 'react-native'
-
-import {cleanError} from '#/lib/strings/errors'
+import {AppBskyGraphDefs as GraphDefs} from '@atproto/api'
+import {Text} from '../util/text/Text'
+import {UserAvatar} from '../util/UserAvatar'
+import {MyLists} from '../lists/MyLists'
+import {Button} from '../util/forms/Button'
+import * as Toast from '../util/Toast'
+import {sanitizeDisplayName} from 'lib/strings/display-names'
+import {sanitizeHandle} from 'lib/strings/handles'
+import {s} from 'lib/styles'
+import {usePalette} from 'lib/hooks/usePalette'
+import {isWeb, isAndroid, isMobileWeb} from 'platform/detection'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 import {useModalControls} from '#/state/modals'
 import {
+  useDangerousListMembershipsQuery,
   getMembership,
   ListMembersip,
-  useDangerousListMembershipsQuery,
   useListMembershipAddMutation,
   useListMembershipRemoveMutation,
 } from '#/state/queries/list-memberships'
+import {cleanError} from '#/lib/strings/errors'
 import {useSession} from '#/state/session'
 
-import {MyLists} from '../lists/MyLists'
-import {Button} from '../util/forms/Button'
-import {Text} from '../util/text/Text'
-import * as Toast from '../util/Toast'
-import {UserAvatar} from '../util/UserAvatar'
-
 export const snapPoints = ['fullscreen']
 
 export function Component({
diff --git a/src/view/com/modals/VerifyEmail.tsx b/src/view/com/modals/VerifyEmail.tsx
index 8c8c64ad9..30a57afc5 100644
--- a/src/view/com/modals/VerifyEmail.tsx
+++ b/src/view/com/modals/VerifyEmail.tsx
@@ -1,11 +1,3 @@
-import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {usePalette} from 'lib/hooks/usePalette'
-import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
-import {cleanError} from 'lib/strings/errors'
-import {colors, s} from 'lib/styles'
-import {isWeb} from 'platform/detection'
 import React, {useState} from 'react'
 import {
   ActivityIndicator,
@@ -14,17 +6,23 @@ import {
   StyleSheet,
   View,
 } from 'react-native'
-import {Circle, Path, Svg} from 'react-native-svg'
-
-import {logger} from '#/logger'
-import {useModalControls} from '#/state/modals'
-import {getAgent, useSession, useSessionApi} from '#/state/session'
-
-import {ErrorMessage} from '../util/error/ErrorMessage'
-import {Button} from '../util/forms/Button'
+import {Svg, Circle, Path} from 'react-native-svg'
+import {ScrollView, TextInput} from './util'
+import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
 import {Text} from '../util/text/Text'
+import {Button} from '../util/forms/Button'
+import {ErrorMessage} from '../util/error/ErrorMessage'
 import * as Toast from '../util/Toast'
-import {ScrollView, TextInput} from './util'
+import {s, colors} from 'lib/styles'
+import {usePalette} from 'lib/hooks/usePalette'
+import {isWeb} from 'platform/detection'
+import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
+import {cleanError} from 'lib/strings/errors'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
+import {useModalControls} from '#/state/modals'
+import {useSession, useSessionApi, getAgent} from '#/state/session'
+import {logger} from '#/logger'
 
 export const snapPoints = ['90%']
 
diff --git a/src/view/com/modals/crop-image/CropImage.web.tsx b/src/view/com/modals/crop-image/CropImage.web.tsx
index 9c42d9532..6f094a1fd 100644
--- a/src/view/com/modals/crop-image/CropImage.web.tsx
+++ b/src/view/com/modals/crop-image/CropImage.web.tsx
@@ -1,18 +1,17 @@
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {Slider} from '@miblanchard/react-native-slider'
-import {usePalette} from 'lib/hooks/usePalette'
-import {RectTallIcon, RectWideIcon, SquareIcon} from 'lib/icons'
-import {Dimensions} from 'lib/media/types'
-import {getDataUriSize} from 'lib/media/util'
-import {gradients, s} from 'lib/styles'
 import React from 'react'
-import ImageEditor from 'react-avatar-editor'
 import {StyleSheet, TouchableOpacity, View} from 'react-native'
-import {Image as RNImage} from 'react-native-image-crop-picker'
+import ImageEditor from 'react-avatar-editor'
+import {Slider} from '@miblanchard/react-native-slider'
 import LinearGradient from 'react-native-linear-gradient'
 import {Text} from 'view/com/util/text/Text'
-
+import {Dimensions} from 'lib/media/types'
+import {getDataUriSize} from 'lib/media/util'
+import {s, gradients} from 'lib/styles'
+import {usePalette} from 'lib/hooks/usePalette'
+import {SquareIcon, RectWideIcon, RectTallIcon} from 'lib/icons'
+import {Image as RNImage} from 'react-native-image-crop-picker'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 import {useModalControls} from '#/state/modals'
 
 enum AspectRatio {
diff --git a/src/view/com/modals/lang-settings/ConfirmLanguagesButton.tsx b/src/view/com/modals/lang-settings/ConfirmLanguagesButton.tsx
index ce462d072..91e11a19c 100644
--- a/src/view/com/modals/lang-settings/ConfirmLanguagesButton.tsx
+++ b/src/view/com/modals/lang-settings/ConfirmLanguagesButton.tsx
@@ -1,11 +1,11 @@
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {usePalette} from 'lib/hooks/usePalette'
-import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
-import {colors, gradients, s} from 'lib/styles'
 import React from 'react'
-import {Pressable, StyleSheet, Text, View} from 'react-native'
+import {StyleSheet, Text, View, Pressable} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
+import {s, colors, gradients} from 'lib/styles'
+import {usePalette} from 'lib/hooks/usePalette'
+import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 
 export const ConfirmLanguagesButton = ({
   onPress,
diff --git a/src/view/com/modals/lang-settings/ContentLanguagesSettings.tsx b/src/view/com/modals/lang-settings/ContentLanguagesSettings.tsx
index 52863b2a8..b8c125b65 100644
--- a/src/view/com/modals/lang-settings/ContentLanguagesSettings.tsx
+++ b/src/view/com/modals/lang-settings/ContentLanguagesSettings.tsx
@@ -1,22 +1,20 @@
-import {Trans} from '@lingui/macro'
+import React from 'react'
+import {StyleSheet, View} from 'react-native'
+import {ScrollView} from '../util'
+import {Text} from '../../util/text/Text'
 import {usePalette} from 'lib/hooks/usePalette'
 import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
 import {deviceLocales} from 'platform/detection'
-import React from 'react'
-import {StyleSheet, View} from 'react-native'
-
+import {LANGUAGES, LANGUAGES_MAP_CODE2} from '../../../../locale/languages'
+import {LanguageToggle} from './LanguageToggle'
+import {ConfirmLanguagesButton} from './ConfirmLanguagesButton'
+import {Trans} from '@lingui/macro'
 import {useModalControls} from '#/state/modals'
 import {
   useLanguagePrefs,
   useLanguagePrefsApi,
 } from '#/state/preferences/languages'
 
-import {LANGUAGES, LANGUAGES_MAP_CODE2} from '../../../../locale/languages'
-import {Text} from '../../util/text/Text'
-import {ScrollView} from '../util'
-import {ConfirmLanguagesButton} from './ConfirmLanguagesButton'
-import {LanguageToggle} from './LanguageToggle'
-
 export const snapPoints = ['100%']
 
 export function Component({}: {}) {
diff --git a/src/view/com/modals/lang-settings/LanguageToggle.tsx b/src/view/com/modals/lang-settings/LanguageToggle.tsx
index 3d6513701..45b100f20 100644
--- a/src/view/com/modals/lang-settings/LanguageToggle.tsx
+++ b/src/view/com/modals/lang-settings/LanguageToggle.tsx
@@ -1,9 +1,8 @@
-import {usePalette} from 'lib/hooks/usePalette'
 import React from 'react'
 import {StyleSheet} from 'react-native'
+import {usePalette} from 'lib/hooks/usePalette'
 import {ToggleButton} from 'view/com/util/forms/ToggleButton'
-
-import {toPostLanguages, useLanguagePrefs} from '#/state/preferences/languages'
+import {useLanguagePrefs, toPostLanguages} from '#/state/preferences/languages'
 
 export function LanguageToggle({
   code2,
diff --git a/src/view/com/modals/lang-settings/PostLanguagesSettings.tsx b/src/view/com/modals/lang-settings/PostLanguagesSettings.tsx
index 49a209759..05cfb8115 100644
--- a/src/view/com/modals/lang-settings/PostLanguagesSettings.tsx
+++ b/src/view/com/modals/lang-settings/PostLanguagesSettings.tsx
@@ -1,23 +1,21 @@
-import {Trans} from '@lingui/macro'
+import React from 'react'
+import {StyleSheet, View} from 'react-native'
+import {ScrollView} from '../util'
+import {Text} from '../../util/text/Text'
 import {usePalette} from 'lib/hooks/usePalette'
 import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
 import {deviceLocales} from 'platform/detection'
-import React from 'react'
-import {StyleSheet, View} from 'react-native'
+import {LANGUAGES, LANGUAGES_MAP_CODE2} from '../../../../locale/languages'
+import {ConfirmLanguagesButton} from './ConfirmLanguagesButton'
 import {ToggleButton} from 'view/com/util/forms/ToggleButton'
-
+import {Trans} from '@lingui/macro'
 import {useModalControls} from '#/state/modals'
 import {
-  hasPostLanguage,
   useLanguagePrefs,
   useLanguagePrefsApi,
+  hasPostLanguage,
 } from '#/state/preferences/languages'
 
-import {LANGUAGES, LANGUAGES_MAP_CODE2} from '../../../../locale/languages'
-import {Text} from '../../util/text/Text'
-import {ScrollView} from '../util'
-import {ConfirmLanguagesButton} from './ConfirmLanguagesButton'
-
 export const snapPoints = ['100%']
 
 export function Component() {
diff --git a/src/view/com/modals/report/InputIssueDetails.tsx b/src/view/com/modals/report/InputIssueDetails.tsx
index e353da56f..2bc86f75e 100644
--- a/src/view/com/modals/report/InputIssueDetails.tsx
+++ b/src/view/com/modals/report/InputIssueDetails.tsx
@@ -1,16 +1,15 @@
+import React from 'react'
+import {View, TouchableOpacity, StyleSheet} from 'react-native'
+import {TextInput} from '../util'
 import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
+import {CharProgress} from '../../composer/char-progress/CharProgress'
+import {Text} from '../../util/text/Text'
 import {usePalette} from 'lib/hooks/usePalette'
 import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
 import {s} from 'lib/styles'
-import React from 'react'
-import {StyleSheet, TouchableOpacity, View} from 'react-native'
-
-import {CharProgress} from '../../composer/char-progress/CharProgress'
-import {Text} from '../../util/text/Text'
-import {TextInput} from '../util'
 import {SendReportButton} from './SendReportButton'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 
 export function InputIssueDetails({
   details,
diff --git a/src/view/com/modals/report/Modal.tsx b/src/view/com/modals/report/Modal.tsx
index 3540b8b02..abbad9b40 100644
--- a/src/view/com/modals/report/Modal.tsx
+++ b/src/view/com/modals/report/Modal.tsx
@@ -1,24 +1,22 @@
+import React, {useState, useMemo} from 'react'
+import {Linking, StyleSheet, TouchableOpacity, View} from 'react-native'
+import {ScrollView} from 'react-native-gesture-handler'
 import {AtUri} from '@atproto/api'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {usePalette} from 'lib/hooks/usePalette'
 import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
-import {cleanError} from 'lib/strings/errors'
 import {s} from 'lib/styles'
-import React, {useMemo, useState} from 'react'
-import {Linking, StyleSheet, TouchableOpacity, View} from 'react-native'
-import {ScrollView} from 'react-native-gesture-handler'
-
-import {useModalControls} from '#/state/modals'
-import {getAgent} from '#/state/session'
-
-import {ErrorMessage} from '../../util/error/ErrorMessage'
 import {Text} from '../../util/text/Text'
 import * as Toast from '../../util/Toast'
+import {ErrorMessage} from '../../util/error/ErrorMessage'
+import {cleanError} from 'lib/strings/errors'
+import {usePalette} from 'lib/hooks/usePalette'
+import {SendReportButton} from './SendReportButton'
 import {InputIssueDetails} from './InputIssueDetails'
 import {ReportReasonOptions} from './ReasonOptions'
-import {SendReportButton} from './SendReportButton'
 import {CollectionId} from './types'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
+import {useModalControls} from '#/state/modals'
+import {getAgent} from '#/state/session'
 
 const DMCA_LINK = 'https://bsky.social/about/support/copyright'
 
diff --git a/src/view/com/modals/report/ReasonOptions.tsx b/src/view/com/modals/report/ReasonOptions.tsx
index 3ed7bb79d..23b49b664 100644
--- a/src/view/com/modals/report/ReasonOptions.tsx
+++ b/src/view/com/modals/report/ReasonOptions.tsx
@@ -1,10 +1,10 @@
-import {AtUri, ComAtprotoModerationDefs} from '@atproto/api'
-import {usePalette, UsePaletteValue} from 'lib/hooks/usePalette'
-import React, {useMemo} from 'react'
 import {View} from 'react-native'
-import {RadioGroup, RadioGroupItem} from 'view/com/util/forms/RadioGroup'
+import React, {useMemo} from 'react'
+import {AtUri, ComAtprotoModerationDefs} from '@atproto/api'
 
 import {Text} from '../../util/text/Text'
+import {UsePaletteValue, usePalette} from 'lib/hooks/usePalette'
+import {RadioGroup, RadioGroupItem} from 'view/com/util/forms/RadioGroup'
 import {CollectionId} from './types'
 
 type ReasonMap = Record<string, {title: string; description: string}>
diff --git a/src/view/com/modals/report/SendReportButton.tsx b/src/view/com/modals/report/SendReportButton.tsx
index eeda20b84..40c239bff 100644
--- a/src/view/com/modals/report/SendReportButton.tsx
+++ b/src/view/com/modals/report/SendReportButton.tsx
@@ -1,16 +1,15 @@
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {colors, gradients, s} from 'lib/styles'
 import React from 'react'
+import LinearGradient from 'react-native-linear-gradient'
 import {
   ActivityIndicator,
   StyleSheet,
   TouchableOpacity,
   View,
 } from 'react-native'
-import LinearGradient from 'react-native-linear-gradient'
-
 import {Text} from '../../util/text/Text'
+import {s, gradients, colors} from 'lib/styles'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 
 export function SendReportButton({
   onPress,