diff options
Diffstat (limited to 'src/view')
273 files changed, 3032 insertions, 2697 deletions
diff --git a/src/view/com/auth/HomeLoggedOutCTA.tsx b/src/view/com/auth/HomeLoggedOutCTA.tsx index f796d8bae..f2a3c5170 100644 --- a/src/view/com/auth/HomeLoggedOutCTA.tsx +++ b/src/view/com/auth/HomeLoggedOutCTA.tsx @@ -1,15 +1,17 @@ +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import React from 'react' import {StyleSheet, TouchableOpacity, View} from 'react-native' -import {useLingui} from '@lingui/react' -import {Trans, msg} from '@lingui/macro' -import {ScrollView} from '../util/Views' -import {Text} from '../util/text/Text' + import {usePalette} from '#/lib/hooks/usePalette' -import {colors, s} from '#/lib/styles' -import {TextLink} from '../util/Link' import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries' +import {colors, s} from '#/lib/styles' import {useLoggedOutViewControls} from '#/state/shell/logged-out' +import {TextLink} from '../util/Link' +import {Text} from '../util/text/Text' +import {ScrollView} from '../util/Views' + export function HomeLoggedOutCTA() { const pal = usePalette('default') const {_} = useLingui() diff --git a/src/view/com/auth/LoggedOut.tsx b/src/view/com/auth/LoggedOut.tsx index 603abbab2..b2df062dd 100644 --- a/src/view/com/auth/LoggedOut.tsx +++ b/src/view/com/auth/LoggedOut.tsx @@ -1,27 +1,28 @@ -import React from 'react' -import {View, Pressable} from 'react-native' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {msg, Trans} from '@lingui/macro' import {useLingui} from '@lingui/react' -import {Trans, msg} from '@lingui/macro' import {useNavigation} from '@react-navigation/native' - +import {useAnalytics} from 'lib/analytics/analytics' +import {usePalette} from 'lib/hooks/usePalette' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {NavigationProp} from 'lib/routes/types' +import {s} from 'lib/styles' import {isIOS, isNative} from 'platform/detection' -import {Login} from 'view/com/auth/login/Login' +import React from 'react' +import {Pressable, View} from 'react-native' import {CreateAccount} from 'view/com/auth/create/CreateAccount' +import {Login} from 'view/com/auth/login/Login' import {ErrorBoundary} from 'view/com/util/ErrorBoundary' -import {s} from 'lib/styles' -import {usePalette} from 'lib/hooks/usePalette' -import {useAnalytics} from 'lib/analytics/analytics' -import {SplashScreen} from './SplashScreen' -import {useSetMinimalShellMode} from '#/state/shell/minimal-mode' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' + +import {useSession} from '#/state/session' import { useLoggedOutView, useLoggedOutViewControls, } from '#/state/shell/logged-out' -import {useSession} from '#/state/session' +import {useSetMinimalShellMode} from '#/state/shell/minimal-mode' import {Text} from '#/view/com/util/text/Text' -import {NavigationProp} from 'lib/routes/types' + +import {SplashScreen} from './SplashScreen' enum ScreenState { S_LoginOrCreateAccount, diff --git a/src/view/com/auth/Onboarding.tsx b/src/view/com/auth/Onboarding.tsx index bdb7f27c8..e102b1ccf 100644 --- a/src/view/com/auth/Onboarding.tsx +++ b/src/view/com/auth/Onboarding.tsx @@ -1,13 +1,15 @@ +import {usePalette} from 'lib/hooks/usePalette' +import {s} from 'lib/styles' import React from 'react' -import {SafeAreaView, Platform} from 'react-native' +import {Platform, SafeAreaView} from 'react-native' import {ErrorBoundary} from 'view/com/util/ErrorBoundary' -import {s} from 'lib/styles' -import {usePalette} from 'lib/hooks/usePalette' -import {Welcome} from './onboarding/Welcome' + +import {useOnboardingDispatch, useOnboardingState} from '#/state/shell' +import {useSetMinimalShellMode} from '#/state/shell/minimal-mode' + import {RecommendedFeeds} from './onboarding/RecommendedFeeds' import {RecommendedFollows} from './onboarding/RecommendedFollows' -import {useSetMinimalShellMode} from '#/state/shell/minimal-mode' -import {useOnboardingState, useOnboardingDispatch} from '#/state/shell' +import {Welcome} from './onboarding/Welcome' export function Onboarding() { const pal = usePalette('default') diff --git a/src/view/com/auth/SplashScreen.tsx b/src/view/com/auth/SplashScreen.tsx index 134ae11f1..2b54cb1b6 100644 --- a/src/view/com/auth/SplashScreen.tsx +++ b/src/view/com/auth/SplashScreen.tsx @@ -1,23 +1,25 @@ -import React from 'react' -import {StyleSheet, TouchableOpacity, View} from 'react-native' -import {useSafeAreaInsets} from 'react-native-safe-area-context' -import {Text} from 'view/com/util/text/Text' -import {ErrorBoundary} from 'view/com/util/ErrorBoundary' -import {s, colors} from 'lib/styles' -import {usePalette} from 'lib/hooks/usePalette' -import {CenteredView} from '../util/Views' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {Logo} from '#/view/icons/Logo' -import {Logotype} from '#/view/icons/Logotype' import { FontAwesomeIcon, FontAwesomeIconStyle, } 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 React from 'react' +import {StyleSheet, TouchableOpacity, View} from 'react-native' import RNPickerSelect, {PickerSelectProps} from 'react-native-picker-select' +import {useSafeAreaInsets} from 'react-native-safe-area-context' +import {ErrorBoundary} from 'view/com/util/ErrorBoundary' +import {Text} from 'view/com/util/text/Text' + import {sanitizeAppLanguageSetting} from '#/locale/helpers' -import {useLanguagePrefs, useLanguagePrefsApi} from '#/state/preferences' import {APP_LANGUAGES} from '#/locale/languages' +import {useLanguagePrefs, useLanguagePrefsApi} from '#/state/preferences' +import {Logo} from '#/view/icons/Logo' +import {Logotype} from '#/view/icons/Logotype' + +import {CenteredView} from '../util/Views' export const SplashScreen = ({ onPressSignin, diff --git a/src/view/com/auth/SplashScreen.web.tsx b/src/view/com/auth/SplashScreen.web.tsx index f1921c7ff..2bf4a1295 100644 --- a/src/view/com/auth/SplashScreen.web.tsx +++ b/src/view/com/auth/SplashScreen.web.tsx @@ -1,21 +1,23 @@ -import React from 'react' -import {StyleSheet, TouchableOpacity, View, Pressable} from 'react-native' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import {Text} from 'view/com/util/text/Text' -import {TextLink} from '../util/Link' -import {ErrorBoundary} from 'view/com/util/ErrorBoundary' -import {s, colors} from 'lib/styles' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {usePalette} from 'lib/hooks/usePalette' -import {CenteredView} from '../util/Views' -import {isWeb} from 'platform/detection' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {Trans, msg} from '@lingui/macro' -import {Logo} from '#/view/icons/Logo' -import {Logotype} from '#/view/icons/Logotype' -import {useLingui} from '@lingui/react' +import {colors, s} from 'lib/styles' +import {isWeb} from 'platform/detection' +import React from 'react' +import {Pressable, StyleSheet, TouchableOpacity, View} from 'react-native' +import {ErrorBoundary} from 'view/com/util/ErrorBoundary' +import {Text} from 'view/com/util/text/Text' + import {sanitizeAppLanguageSetting} from '#/locale/helpers' -import {useLanguagePrefs, useLanguagePrefsApi} from '#/state/preferences' import {APP_LANGUAGES} from '#/locale/languages' +import {useLanguagePrefs, useLanguagePrefsApi} from '#/state/preferences' +import {Logo} from '#/view/icons/Logo' +import {Logotype} from '#/view/icons/Logotype' + +import {TextLink} from '../util/Link' +import {CenteredView} from '../util/Views' export const SplashScreen = ({ onDismiss, diff --git a/src/view/com/auth/create/CaptchaWebView.tsx b/src/view/com/auth/create/CaptchaWebView.tsx index b0de8b4a4..9bfc9218e 100644 --- a/src/view/com/auth/create/CaptchaWebView.tsx +++ b/src/view/com/auth/create/CaptchaWebView.tsx @@ -1,7 +1,7 @@ import React from 'react' +import {StyleSheet} from 'react-native' import {WebView, WebViewNavigation} from 'react-native-webview' import {ShouldStartLoadRequest} from 'react-native-webview/lib/WebViewTypes' -import {StyleSheet} from 'react-native' import {CreateAccountState} from 'view/com/auth/create/state' const ALLOWED_HOSTS = [ diff --git a/src/view/com/auth/create/CreateAccount.tsx b/src/view/com/auth/create/CreateAccount.tsx index d193802fe..be7e4c432 100644 --- a/src/view/com/auth/create/CreateAccount.tsx +++ b/src/view/com/auth/create/CreateAccount.tsx @@ -1,3 +1,9 @@ +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useAnalytics} from 'lib/analytics/analytics' +import {usePalette} from 'lib/hooks/usePalette' +import {createFullHandle, validateHandle} from 'lib/strings/handles' +import {s} from 'lib/styles' import React from 'react' import { ActivityIndicator, @@ -6,24 +12,19 @@ import { TouchableOpacity, View, } from 'react-native' -import {useAnalytics} from 'lib/analytics/analytics' -import {Text} from '../../util/text/Text' +import {getAgent} from 'state/session' import {LoggedOutLayout} from 'view/com/util/layouts/LoggedOutLayout' -import {s} from 'lib/styles' -import {usePalette} from 'lib/hooks/usePalette' -import {msg, Trans} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {useCreateAccount, useSubmitCreateAccount} from './state' -import {useServiceQuery} from '#/state/queries/service' + import {FEEDBACK_FORM_URL, HITSLOP_10} from '#/lib/constants' +import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries' +import {useServiceQuery} from '#/state/queries/service' +import {TextLink} from '../../util/Link' +import {Text} from '../../util/text/Text' +import {useCreateAccount, useSubmitCreateAccount} from './state' import {Step1} from './Step1' import {Step2} from './Step2' import {Step3} from './Step3' -import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries' -import {TextLink} from '../../util/Link' -import {getAgent} from 'state/session' -import {createFullHandle, validateHandle} from 'lib/strings/handles' export function CreateAccount({onPressBack}: {onPressBack: () => void}) { const {screen} = useAnalytics() diff --git a/src/view/com/auth/create/Policies.tsx b/src/view/com/auth/create/Policies.tsx index 2c7d60818..fea4566b8 100644 --- a/src/view/com/auth/create/Policies.tsx +++ b/src/view/com/auth/create/Policies.tsx @@ -1,14 +1,15 @@ -import React from 'react' -import {StyleSheet, View} from 'react-native' +import {ComAtprotoServerDescribeServer} from '@atproto/api' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' -import {ComAtprotoServerDescribeServer} from '@atproto/api' +import {usePalette} from 'lib/hooks/usePalette' +import {colors, s} from 'lib/styles' +import React from 'react' +import {StyleSheet, View} from 'react-native' + import {TextLink} from '../../util/Link' import {Text} from '../../util/text/Text' -import {s, colors} from 'lib/styles' -import {usePalette} from 'lib/hooks/usePalette' type ServiceDescription = ComAtprotoServerDescribeServer.OutputSchema diff --git a/src/view/com/auth/create/Step1.tsx b/src/view/com/auth/create/Step1.tsx index 1f6852f8c..9dcc74f7d 100644 --- a/src/view/com/auth/create/Step1.tsx +++ b/src/view/com/auth/create/Step1.tsx @@ -1,3 +1,12 @@ +import { + FontAwesomeIcon, + FontAwesomeIconStyle, +} from '@fortawesome/react-native-fontawesome' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {usePalette} from 'lib/hooks/usePalette' +import {s} from 'lib/styles' +import {isWeb} from 'platform/detection' import React from 'react' import { ActivityIndicator, @@ -6,27 +15,19 @@ import { TouchableOpacity, View, } from 'react-native' -import {CreateAccountState, CreateAccountDispatch, is18} from './state' -import {Text} from 'view/com/util/text/Text' -import {DateInput} from 'view/com/util/forms/DateInput' -import {StepHeader} from './StepHeader' -import {s} from 'lib/styles' -import {usePalette} from 'lib/hooks/usePalette' -import {TextInput} from '../util/TextInput' -import {Policies} from './Policies' import {ErrorMessage} from 'view/com/util/error/ErrorMessage' -import {isWeb} from 'platform/detection' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {logger} from '#/logger' -import { - FontAwesomeIcon, - FontAwesomeIconStyle, -} from '@fortawesome/react-native-fontawesome' +import {DateInput} from 'view/com/util/forms/DateInput' +import {Text} from 'view/com/util/text/Text' + import {useDialogControl} from '#/components/Dialog' +import {toNiceDomain} from '#/lib/strings/url-helpers' +import {logger} from '#/logger' import {ServerInputDialog} from '../server-input' -import {toNiceDomain} from '#/lib/strings/url-helpers' +import {TextInput} from '../util/TextInput' +import {Policies} from './Policies' +import {CreateAccountDispatch, CreateAccountState, is18} from './state' +import {StepHeader} from './StepHeader' function sanitizeDate(date: Date): Date { if (!date || date.toString() === 'Invalid Date') { diff --git a/src/view/com/auth/create/Step2.tsx b/src/view/com/auth/create/Step2.tsx index 5c262977f..08eb34fb3 100644 --- a/src/view/com/auth/create/Step2.tsx +++ b/src/view/com/auth/create/Step2.tsx @@ -1,22 +1,24 @@ -import React from 'react' -import {View} from 'react-native' -import {CreateAccountState, CreateAccountDispatch} from './state' -import {Text} from 'view/com/util/text/Text' -import {StepHeader} from './StepHeader' -import {s} from 'lib/styles' -import {TextInput} from '../util/TextInput' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useFocusEffect} from '@react-navigation/native' +import {usePalette} from 'lib/hooks/usePalette' import { createFullHandle, IsValidHandle, validateHandle, } from 'lib/strings/handles' -import {usePalette} from 'lib/hooks/usePalette' -import {msg, Trans} from '@lingui/macro' -import {useLingui} from '@lingui/react' +import {s} from 'lib/styles' +import React from 'react' +import {View} from 'react-native' +import {Text} from 'view/com/util/text/Text' + import {atoms as a, useTheme} from '#/alf' import {Check_Stroke2_Corner0_Rounded as Check} from '#/components/icons/Check' import {TimesLarge_Stroke2_Corner0_Rounded as Times} from '#/components/icons/Times' -import {useFocusEffect} from '@react-navigation/native' + +import {TextInput} from '../util/TextInput' +import {CreateAccountDispatch, CreateAccountState} from './state' +import {StepHeader} from './StepHeader' /** STEP 3: Your user handle * @field User handle diff --git a/src/view/com/auth/create/Step3.tsx b/src/view/com/auth/create/Step3.tsx index 53fdfdde8..b57287171 100644 --- a/src/view/com/auth/create/Step3.tsx +++ b/src/view/com/auth/create/Step3.tsx @@ -1,20 +1,20 @@ +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {createFullHandle} from 'lib/strings/handles' +import {useTheme} from 'lib/ThemeContext' +import {nanoid} from 'nanoid/non-secure' +import {isWeb} from 'platform/detection' import React from 'react' import {ActivityIndicator, StyleSheet, View} from 'react-native' +import {CaptchaWebView} from 'view/com/auth/create/CaptchaWebView' +import {ErrorMessage} from 'view/com/util/error/ErrorMessage' + import { - CreateAccountState, CreateAccountDispatch, + CreateAccountState, useSubmitCreateAccount, } from './state' import {StepHeader} from './StepHeader' -import {ErrorMessage} from 'view/com/util/error/ErrorMessage' -import {isWeb} from 'platform/detection' -import {msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' - -import {nanoid} from 'nanoid/non-secure' -import {CaptchaWebView} from 'view/com/auth/create/CaptchaWebView' -import {useTheme} from 'lib/ThemeContext' -import {createFullHandle} from 'lib/strings/handles' const CAPTCHA_PATH = '/gate/signup' diff --git a/src/view/com/auth/create/StepHeader.tsx b/src/view/com/auth/create/StepHeader.tsx index a98b392d8..90946e37b 100644 --- a/src/view/com/auth/create/StepHeader.tsx +++ b/src/view/com/auth/create/StepHeader.tsx @@ -1,8 +1,9 @@ +import {Trans} from '@lingui/macro' +import {usePalette} from 'lib/hooks/usePalette' import React from 'react' import {StyleSheet, View} from 'react-native' import {Text} from 'view/com/util/text/Text' -import {usePalette} from 'lib/hooks/usePalette' -import {Trans} from '@lingui/macro' + import {CreateAccountState} from './state' export function StepHeader({ diff --git a/src/view/com/auth/create/state.ts b/src/view/com/auth/create/state.ts index 7a727ec0b..7ff5fceb6 100644 --- a/src/view/com/auth/create/state.ts +++ b/src/view/com/auth/create/state.ts @@ -1,24 +1,25 @@ -import {useCallback, useReducer} from 'react' import { - ComAtprotoServerDescribeServer, ComAtprotoServerCreateAccount, + ComAtprotoServerDescribeServer, } from '@atproto/api' -import {I18nContext, useLingui} from '@lingui/react' import {msg} from '@lingui/macro' +import {I18nContext, useLingui} from '@lingui/react' import * as EmailValidator from 'email-validator' import {getAge} from 'lib/strings/time' -import {logger} from '#/logger' -import {createFullHandle, validateHandle} from '#/lib/strings/handles' -import {cleanError} from '#/lib/strings/errors' -import {useOnboardingDispatch} from '#/state/shell/onboarding' -import {useSessionApi} from '#/state/session' -import {DEFAULT_SERVICE, IS_PROD_SERVICE} from '#/lib/constants' +import {useCallback, useReducer} from 'react' import { DEFAULT_PROD_FEEDS, usePreferencesSetBirthDateMutation, useSetSaveFeedsMutation, } from 'state/queries/preferences' +import {DEFAULT_SERVICE, IS_PROD_SERVICE} from '#/lib/constants' +import {cleanError} from '#/lib/strings/errors' +import {createFullHandle, validateHandle} from '#/lib/strings/handles' +import {logger} from '#/logger' +import {useSessionApi} from '#/state/session' +import {useOnboardingDispatch} from '#/state/shell/onboarding' + export type ServiceDescription = ComAtprotoServerDescribeServer.OutputSchema const DEFAULT_DATE = new Date(Date.now() - 60e3 * 60 * 24 * 365 * 20) // default to 20 years ago diff --git a/src/view/com/auth/login/ChooseAccountForm.tsx b/src/view/com/auth/login/ChooseAccountForm.tsx index 32cd8315d..440b066ee 100644 --- a/src/view/com/auth/login/ChooseAccountForm.tsx +++ b/src/view/com/auth/login/ChooseAccountForm.tsx @@ -1,22 +1,24 @@ -import React from 'react' -import {ScrollView, TouchableOpacity, View} from 'react-native' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {useAnalytics} from 'lib/analytics/analytics' -import {Text} from '../../util/text/Text' -import {UserAvatar} from '../../util/UserAvatar' -import {s, colors} from 'lib/styles' import {usePalette} from 'lib/hooks/usePalette' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {styles} from './styles' -import {useSession, useSessionApi, SessionAccount} from '#/state/session' +import {colors, s} from 'lib/styles' +import React from 'react' +import {ScrollView, TouchableOpacity, View} from 'react-native' + import {useProfileQuery} from '#/state/queries/profile' +import {SessionAccount, useSession, useSessionApi} from '#/state/session' import {useLoggedOutViewControls} from '#/state/shell/logged-out' import * as Toast from '#/view/com/util/Toast' +import {Text} from '../../util/text/Text' +import {UserAvatar} from '../../util/UserAvatar' +import {styles} from './styles' + function AccountItem({ account, onSelect, diff --git a/src/view/com/auth/login/ForgotPasswordForm.tsx b/src/view/com/auth/login/ForgotPasswordForm.tsx index 322da2b8f..74dd1d85a 100644 --- a/src/view/com/auth/login/ForgotPasswordForm.tsx +++ b/src/view/com/auth/login/ForgotPasswordForm.tsx @@ -1,33 +1,34 @@ -import React, {useState, useEffect} from 'react' -import { - ActivityIndicator, - Keyboard, - TextInput, - TouchableOpacity, - View, -} from 'react-native' +import {ComAtprotoServerDescribeServer} from '@atproto/api' +import {BskyAgent} from '@atproto/api' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' -import {ComAtprotoServerDescribeServer} from '@atproto/api' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import * as EmailValidator from 'email-validator' -import {BskyAgent} from '@atproto/api' import {useAnalytics} from 'lib/analytics/analytics' -import {Text} from '../../util/text/Text' -import {s} from 'lib/styles' -import {toNiceDomain} from 'lib/strings/url-helpers' -import {isNetworkError} from 'lib/strings/errors' import {usePalette} from 'lib/hooks/usePalette' -import {useTheme} from 'lib/ThemeContext' +import {isNetworkError} from 'lib/strings/errors' import {cleanError} from 'lib/strings/errors' -import {logger} from '#/logger' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {styles} from './styles' +import {toNiceDomain} from 'lib/strings/url-helpers' +import {s} from 'lib/styles' +import {useTheme} from 'lib/ThemeContext' +import React, {useEffect, useState} from 'react' +import { + ActivityIndicator, + Keyboard, + TextInput, + TouchableOpacity, + View, +} from 'react-native' + import {useDialogControl} from '#/components/Dialog' +import {logger} from '#/logger' +import {Text} from '../../util/text/Text' import {ServerInputDialog} from '../server-input' +import {styles} from './styles' type ServiceDescription = ComAtprotoServerDescribeServer.OutputSchema diff --git a/src/view/com/auth/login/Login.tsx b/src/view/com/auth/login/Login.tsx index bc931ac04..f634342a2 100644 --- a/src/view/com/auth/login/Login.tsx +++ b/src/view/com/auth/login/Login.tsx @@ -1,20 +1,22 @@ -import React, {useState, useEffect} from 'react' -import {KeyboardAvoidingView} from 'react-native' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {useAnalytics} from 'lib/analytics/analytics' +import {usePalette} from 'lib/hooks/usePalette' +import React, {useEffect, useState} from 'react' +import {KeyboardAvoidingView} from 'react-native' import {LoggedOutLayout} from 'view/com/util/layouts/LoggedOutLayout' + import {DEFAULT_SERVICE} from '#/lib/constants' -import {usePalette} from 'lib/hooks/usePalette' import {logger} from '#/logger' +import {useServiceQuery} from '#/state/queries/service' +import {SessionAccount, useSession} from '#/state/session' +import {useLoggedOutView} from '#/state/shell/logged-out' + import {ChooseAccountForm} from './ChooseAccountForm' -import {LoginForm} from './LoginForm' import {ForgotPasswordForm} from './ForgotPasswordForm' -import {SetNewPasswordForm} from './SetNewPasswordForm' +import {LoginForm} from './LoginForm' import {PasswordUpdatedForm} from './PasswordUpdatedForm' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' -import {useSession, SessionAccount} from '#/state/session' -import {useServiceQuery} from '#/state/queries/service' -import {useLoggedOutView} from '#/state/shell/logged-out' +import {SetNewPasswordForm} from './SetNewPasswordForm' enum Forms { Login, diff --git a/src/view/com/auth/login/LoginForm.tsx b/src/view/com/auth/login/LoginForm.tsx index fdba9f203..acff2fc8b 100644 --- a/src/view/com/auth/login/LoginForm.tsx +++ b/src/view/com/auth/login/LoginForm.tsx @@ -1,33 +1,34 @@ -import React, {useState, useRef} from 'react' -import { - ActivityIndicator, - Keyboard, - TextInput, - TouchableOpacity, - View, -} from 'react-native' +import {ComAtprotoServerDescribeServer} from '@atproto/api' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' -import {ComAtprotoServerDescribeServer} from '@atproto/api' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {useAnalytics} from 'lib/analytics/analytics' -import {Text} from '../../util/text/Text' -import {s} from 'lib/styles' +import {usePalette} from 'lib/hooks/usePalette' +import {isNetworkError} from 'lib/strings/errors' +import {cleanError} from 'lib/strings/errors' import {createFullHandle} from 'lib/strings/handles' import {toNiceDomain} from 'lib/strings/url-helpers' -import {isNetworkError} from 'lib/strings/errors' -import {usePalette} from 'lib/hooks/usePalette' +import {s} from 'lib/styles' import {useTheme} from 'lib/ThemeContext' -import {useSessionApi} from '#/state/session' -import {cleanError} from 'lib/strings/errors' -import {logger} from '#/logger' -import {Trans, msg} from '@lingui/macro' -import {styles} from './styles' -import {useLingui} from '@lingui/react' +import React, {useRef, useState} from 'react' +import { + ActivityIndicator, + Keyboard, + TextInput, + TouchableOpacity, + View, +} from 'react-native' + import {useDialogControl} from '#/components/Dialog' +import {logger} from '#/logger' +import {useSessionApi} from '#/state/session' +import {Text} from '../../util/text/Text' import {ServerInputDialog} from '../server-input' +import {styles} from './styles' type ServiceDescription = ComAtprotoServerDescribeServer.OutputSchema diff --git a/src/view/com/auth/login/PasswordUpdatedForm.tsx b/src/view/com/auth/login/PasswordUpdatedForm.tsx index 71f750b14..a88a1dc99 100644 --- a/src/view/com/auth/login/PasswordUpdatedForm.tsx +++ b/src/view/com/auth/login/PasswordUpdatedForm.tsx @@ -1,12 +1,13 @@ +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useAnalytics} from 'lib/analytics/analytics' +import {usePalette} from 'lib/hooks/usePalette' +import {s} from 'lib/styles' import React, {useEffect} from 'react' import {TouchableOpacity, View} from 'react-native' -import {useAnalytics} from 'lib/analytics/analytics' + import {Text} from '../../util/text/Text' -import {s} from 'lib/styles' -import {usePalette} from 'lib/hooks/usePalette' import {styles} from './styles' -import {msg, Trans} from '@lingui/macro' -import {useLingui} from '@lingui/react' export const PasswordUpdatedForm = ({ onPressNext, diff --git a/src/view/com/auth/login/SetNewPasswordForm.tsx b/src/view/com/auth/login/SetNewPasswordForm.tsx index 6d1584c86..18a95d629 100644 --- a/src/view/com/auth/login/SetNewPasswordForm.tsx +++ b/src/view/com/auth/login/SetNewPasswordForm.tsx @@ -1,24 +1,26 @@ -import React, {useState, useEffect} from 'react' +import {BskyAgent} from '@atproto/api' +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useAnalytics} from 'lib/analytics/analytics' +import {usePalette} from 'lib/hooks/usePalette' +import {isNetworkError} from 'lib/strings/errors' +import {cleanError} from 'lib/strings/errors' +import {checkAndFormatResetCode} from 'lib/strings/password' +import {s} from 'lib/styles' +import {useTheme} from 'lib/ThemeContext' +import React, {useEffect, useState} from 'react' import { ActivityIndicator, TextInput, TouchableOpacity, View, } from 'react-native' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import {BskyAgent} from '@atproto/api' -import {useAnalytics} from 'lib/analytics/analytics' -import {Text} from '../../util/text/Text' -import {s} from 'lib/styles' -import {isNetworkError} from 'lib/strings/errors' -import {usePalette} from 'lib/hooks/usePalette' -import {useTheme} from 'lib/ThemeContext' -import {cleanError} from 'lib/strings/errors' -import {checkAndFormatResetCode} from 'lib/strings/password' + import {logger} from '#/logger' + +import {Text} from '../../util/text/Text' import {styles} from './styles' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' export const SetNewPasswordForm = ({ error, diff --git a/src/view/com/auth/login/styles.ts b/src/view/com/auth/login/styles.ts index 9dccc2803..5adea4c87 100644 --- a/src/view/com/auth/login/styles.ts +++ b/src/view/com/auth/login/styles.ts @@ -1,5 +1,6 @@ -import {StyleSheet} from 'react-native' import {colors} from 'lib/styles' +import {StyleSheet} from 'react-native' + import {isWeb} from '#/platform/detection' export const styles = StyleSheet.create({ diff --git a/src/view/com/auth/onboarding/RecommendedFeeds.tsx b/src/view/com/auth/onboarding/RecommendedFeeds.tsx index d3318bffd..6b78c1415 100644 --- a/src/view/com/auth/onboarding/RecommendedFeeds.tsx +++ b/src/view/com/auth/onboarding/RecommendedFeeds.tsx @@ -1,19 +1,21 @@ +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 React from 'react' import {ActivityIndicator, FlatList, StyleSheet, View} from 'react-native' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import {TabletOrDesktop, Mobile} from 'view/com/util/layouts/Breakpoints' +import {ErrorMessage} from 'view/com/util/error/ErrorMessage' +import {Button} from 'view/com/util/forms/Button' +import {Mobile, TabletOrDesktop} from 'view/com/util/layouts/Breakpoints' +import {TitleColumnLayout} from 'view/com/util/layouts/TitleColumnLayout' import {Text} from 'view/com/util/text/Text' import {ViewHeader} from 'view/com/util/ViewHeader' -import {TitleColumnLayout} from 'view/com/util/layouts/TitleColumnLayout' -import {Button} from 'view/com/util/forms/Button' -import {RecommendedFeedsItem} from './RecommendedFeedsItem' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {usePalette} from 'lib/hooks/usePalette' -import {ErrorMessage} from 'view/com/util/error/ErrorMessage' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' + import {useSuggestedFeedsQuery} from '#/state/queries/suggested-feeds' +import {RecommendedFeedsItem} from './RecommendedFeedsItem' + type Props = { next: () => void } diff --git a/src/view/com/auth/onboarding/RecommendedFeedsItem.tsx b/src/view/com/auth/onboarding/RecommendedFeedsItem.tsx index ea3e1f725..92035a492 100644 --- a/src/view/com/auth/onboarding/RecommendedFeedsItem.tsx +++ b/src/view/com/auth/onboarding/RecommendedFeedsItem.tsx @@ -1,25 +1,26 @@ -import React from 'react' -import {View} from 'react-native' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' import {AppBskyFeedDefs, RichText as BskRichText} from '@atproto/api' -import {Text} from 'view/com/util/text/Text' -import {RichText} from 'view/com/util/text/RichText' -import {Button} from 'view/com/util/forms/Button' -import {UserAvatar} from 'view/com/util/UserAvatar' -import * as Toast from 'view/com/util/Toast' -import {HeartIcon} from 'lib/icons' +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 {HeartIcon} from 'lib/icons' import {sanitizeHandle} from 'lib/strings/handles' +import React from 'react' +import {View} from 'react-native' +import {Button} from 'view/com/util/forms/Button' +import {RichText} from 'view/com/util/text/RichText' +import {Text} from 'view/com/util/text/Text' +import * as Toast from 'view/com/util/Toast' +import {UserAvatar} from 'view/com/util/UserAvatar' + +import {useAnalytics} from '#/lib/analytics/analytics' +import {logger} from '#/logger' import { - usePreferencesQuery, usePinFeedMutation, + usePreferencesQuery, useRemoveFeedMutation, } from '#/state/queries/preferences' -import {logger} from '#/logger' -import {useAnalytics} from '#/lib/analytics/analytics' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' export function RecommendedFeedsItem({ item, diff --git a/src/view/com/auth/onboarding/RecommendedFollows.tsx b/src/view/com/auth/onboarding/RecommendedFollows.tsx index d275f6c90..a7a1eebed 100644 --- a/src/view/com/auth/onboarding/RecommendedFollows.tsx +++ b/src/view/com/auth/onboarding/RecommendedFollows.tsx @@ -1,21 +1,23 @@ +import {AppBskyActorDefs, moderateProfile} from '@atproto/api' +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 React from 'react' import {ActivityIndicator, FlatList, StyleSheet, View} from 'react-native' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import {AppBskyActorDefs, moderateProfile} from '@atproto/api' -import {TabletOrDesktop, Mobile} from 'view/com/util/layouts/Breakpoints' +import {Button} from 'view/com/util/forms/Button' +import {Mobile, TabletOrDesktop} from 'view/com/util/layouts/Breakpoints' +import {TitleColumnLayout} from 'view/com/util/layouts/TitleColumnLayout' import {Text} from 'view/com/util/text/Text' import {ViewHeader} from 'view/com/util/ViewHeader' -import {TitleColumnLayout} from 'view/com/util/layouts/TitleColumnLayout' -import {Button} from 'view/com/util/forms/Button' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {usePalette} from 'lib/hooks/usePalette' -import {RecommendedFollowsItem} from './RecommendedFollowsItem' + +import {logger} from '#/logger' +import {useModerationOpts} from '#/state/queries/preferences' import {useSuggestedFollowsQuery} from '#/state/queries/suggested-follows' import {useGetSuggestedFollowersByActor} from '#/state/queries/suggested-follows' -import {useModerationOpts} from '#/state/queries/preferences' -import {logger} from '#/logger' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' + +import {RecommendedFollowsItem} from './RecommendedFollowsItem' type Props = { next: () => void diff --git a/src/view/com/auth/onboarding/RecommendedFollowsItem.tsx b/src/view/com/auth/onboarding/RecommendedFollowsItem.tsx index 07001068c..e530dbd35 100644 --- a/src/view/com/auth/onboarding/RecommendedFollowsItem.tsx +++ b/src/view/com/auth/onboarding/RecommendedFollowsItem.tsx @@ -1,20 +1,21 @@ -import React from 'react' -import {View, StyleSheet, ActivityIndicator} from 'react-native' -import {ProfileModeration, AppBskyActorDefs} from '@atproto/api' -import {Button} from '#/view/com/util/forms/Button' +import {AppBskyActorDefs, ProfileModeration} from '@atproto/api' +import {Trans} from '@lingui/macro' +import {useAnalytics} from 'lib/analytics/analytics' import {usePalette} from 'lib/hooks/usePalette' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' import {sanitizeDisplayName} from 'lib/strings/display-names' import {sanitizeHandle} from 'lib/strings/handles' import {s} from 'lib/styles' -import {UserAvatar} from 'view/com/util/UserAvatar' -import {Text} from 'view/com/util/text/Text' +import React from 'react' +import {ActivityIndicator, StyleSheet, View} from 'react-native' import Animated, {FadeInRight} from 'react-native-reanimated' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {useAnalytics} from 'lib/analytics/analytics' -import {Trans} from '@lingui/macro' +import {Text} from 'view/com/util/text/Text' +import {UserAvatar} from 'view/com/util/UserAvatar' + +import {logger} from '#/logger' import {Shadow, useProfileShadow} from '#/state/cache/profile-shadow' import {useProfileFollowMutationQueue} from '#/state/queries/profile' -import {logger} from '#/logger' +import {Button} from '#/view/com/util/forms/Button' type Props = { profile: AppBskyActorDefs.ProfileViewBasic diff --git a/src/view/com/auth/onboarding/Welcome.tsx b/src/view/com/auth/onboarding/Welcome.tsx index b44b58f84..64de7fee0 100644 --- a/src/view/com/auth/onboarding/Welcome.tsx +++ b/src/view/com/auth/onboarding/Welcome.tsx @@ -1,5 +1,7 @@ import 'react' + import {withBreakpoints} from 'view/com/util/layouts/withBreakpoints' + import {WelcomeDesktop} from './WelcomeDesktop' import {WelcomeMobile} from './WelcomeMobile' diff --git a/src/view/com/auth/onboarding/WelcomeDesktop.tsx b/src/view/com/auth/onboarding/WelcomeDesktop.tsx index fdb31197c..926c4fcda 100644 --- a/src/view/com/auth/onboarding/WelcomeDesktop.tsx +++ b/src/view/com/auth/onboarding/WelcomeDesktop.tsx @@ -1,13 +1,13 @@ +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {Trans} from '@lingui/macro' +import {usePalette} from 'lib/hooks/usePalette' +import {s} from 'lib/styles' import React from 'react' import {StyleSheet, View} from 'react-native' import {useMediaQuery} from 'react-responsive' -import {Text} from 'view/com/util/text/Text' -import {s} from 'lib/styles' -import {usePalette} from 'lib/hooks/usePalette' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import {TitleColumnLayout} from 'view/com/util/layouts/TitleColumnLayout' import {Button} from 'view/com/util/forms/Button' -import {Trans} from '@lingui/macro' +import {TitleColumnLayout} from 'view/com/util/layouts/TitleColumnLayout' +import {Text} from 'view/com/util/text/Text' type Props = { next: () => void diff --git a/src/view/com/auth/onboarding/WelcomeMobile.tsx b/src/view/com/auth/onboarding/WelcomeMobile.tsx index 5de1a7817..030eddee1 100644 --- a/src/view/com/auth/onboarding/WelcomeMobile.tsx +++ b/src/view/com/auth/onboarding/WelcomeMobile.tsx @@ -1,12 +1,12 @@ +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {Trans} from '@lingui/macro' +import {usePalette} from 'lib/hooks/usePalette' +import {s} from 'lib/styles' import React from 'react' import {Pressable, StyleSheet, View} from 'react-native' -import {Text} from 'view/com/util/text/Text' -import {s} from 'lib/styles' -import {usePalette} from 'lib/hooks/usePalette' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' import {Button} from 'view/com/util/forms/Button' +import {Text} from 'view/com/util/text/Text' import {ViewHeader} from 'view/com/util/ViewHeader' -import {Trans} from '@lingui/macro' type Props = { next: () => void diff --git a/src/view/com/auth/server-input/index.tsx b/src/view/com/auth/server-input/index.tsx index 32b5a3141..39a395402 100644 --- a/src/view/com/auth/server-input/index.tsx +++ b/src/view/com/auth/server-input/index.tsx @@ -1,17 +1,17 @@ -import React from 'react' -import {View} from 'react-native' +import {msg, Trans} from '@lingui/macro' import {useLingui} from '@lingui/react' -import {Trans, msg} from '@lingui/macro' import {BSKY_SERVICE} from 'lib/constants' -import * as persisted from '#/state/persisted' +import React from 'react' +import {View} from 'react-native' import {atoms as a, useBreakpoints, useTheme} from '#/alf' -import * as Dialog from '#/components/Dialog' -import {Text, P} from '#/components/Typography' import {Button, ButtonText} from '#/components/Button' -import * as ToggleButton from '#/components/forms/ToggleButton' +import * as Dialog from '#/components/Dialog' import * as TextField from '#/components/forms/TextField' +import * as ToggleButton from '#/components/forms/ToggleButton' import {Globe_Stroke2_Corner0_Rounded as Globe} from '#/components/icons/Globe' +import {P, Text} from '#/components/Typography' +import * as persisted from '#/state/persisted' export function ServerInputDialog({ control, diff --git a/src/view/com/auth/util/HelpTip.tsx b/src/view/com/auth/util/HelpTip.tsx index 65f7278d6..349eb2f3a 100644 --- a/src/view/com/auth/util/HelpTip.tsx +++ b/src/view/com/auth/util/HelpTip.tsx @@ -1,9 +1,9 @@ +import {useColorSchemeStyle} from 'lib/hooks/useColorSchemeStyle' +import {InfoCircleIcon} from 'lib/icons' +import {colors, s} from 'lib/styles' import React from 'react' import {StyleSheet, View} from 'react-native' import {Text} from 'view/com/util/text/Text' -import {InfoCircleIcon} from 'lib/icons' -import {s, colors} from 'lib/styles' -import {useColorSchemeStyle} from 'lib/hooks/useColorSchemeStyle' export function HelpTip({text}: {text: string}) { const bg = useColorSchemeStyle( diff --git a/src/view/com/auth/util/TextInput.tsx b/src/view/com/auth/util/TextInput.tsx index 38aff0384..33ebfd802 100644 --- a/src/view/com/auth/util/TextInput.tsx +++ b/src/view/com/auth/util/TextInput.tsx @@ -1,9 +1,9 @@ -import React, {ComponentProps} from 'react' -import {StyleSheet, TextInput as RNTextInput, View} from 'react-native' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' import {IconProp} from '@fortawesome/fontawesome-svg-core' +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' import {usePalette} from 'lib/hooks/usePalette' import {useTheme} from 'lib/ThemeContext' +import React, {ComponentProps} from 'react' +import {StyleSheet, TextInput as RNTextInput, View} from 'react-native' interface Props extends Omit<ComponentProps<typeof RNTextInput>, 'onChange'> { testID?: string diff --git a/src/view/com/composer/Composer.tsx b/src/view/com/composer/Composer.tsx index 2855d4232..57be93ca7 100644 --- a/src/view/com/composer/Composer.tsx +++ b/src/view/com/composer/Composer.tsx @@ -1,5 +1,21 @@ -import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react' +import {RichText} from '@atproto/api' +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useAnalytics} from 'lib/analytics/analytics' +import * as apilib from 'lib/api/index' +import {MAX_GRAPHEME_LENGTH} from 'lib/constants' +import {useIsKeyboardVisible} from 'lib/hooks/useIsKeyboardVisible' +import {usePalette} from 'lib/hooks/usePalette' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {cleanError} from 'lib/strings/errors' +import {insertMentionAt} from 'lib/strings/mention-manip' +import {shortenLinks} from 'lib/strings/rich-text-manip' +import {toShortUrl} from 'lib/strings/url-helpers' +import {colors, gradients, s} from 'lib/styles' import {observer} from 'mobx-react-lite' +import {isAndroid, isIOS, isNative, isWeb} from 'platform/detection' +import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react' import { ActivityIndicator, BackHandler, @@ -12,57 +28,43 @@ import { TouchableOpacity, View, } from 'react-native' -import {useSafeAreaInsets} from 'react-native-safe-area-context' import LinearGradient from 'react-native-linear-gradient' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import {RichText} from '@atproto/api' -import {useAnalytics} from 'lib/analytics/analytics' -import {useIsKeyboardVisible} from 'lib/hooks/useIsKeyboardVisible' -import {ExternalEmbed} from './ExternalEmbed' -import {Text} from '../util/text/Text' -import * as Toast from '../util/Toast' -// TODO: Prevent naming components that coincide with RN primitives -// due to linting false positives -import {TextInput, TextInputRef} from './text-input/TextInput' -import {CharProgress} from './char-progress/CharProgress' -import {UserAvatar} from '../util/UserAvatar' -import * as apilib from 'lib/api/index' -import {ComposerOpts} from 'state/shell/composer' -import {s, colors, gradients} from 'lib/styles' -import {cleanError} from 'lib/strings/errors' -import {shortenLinks} from 'lib/strings/rich-text-manip' -import {toShortUrl} from 'lib/strings/url-helpers' -import {SelectPhotoBtn} from './photos/SelectPhotoBtn' -import {OpenCameraBtn} from './photos/OpenCameraBtn' -import {ThreadgateBtn} from './threadgate/ThreadgateBtn' -import {usePalette} from 'lib/hooks/usePalette' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {useExternalLinkFetch} from './useExternalLinkFetch' -import {isWeb, isNative, isAndroid, isIOS} from 'platform/detection' -import QuoteEmbed from '../util/post-embeds/QuoteEmbed' +import {useSafeAreaInsets} from 'react-native-safe-area-context' import {GalleryModel} from 'state/models/media/gallery' -import {Gallery} from './photos/Gallery' -import {MAX_GRAPHEME_LENGTH} from 'lib/constants' -import {LabelsBtn} from './labels/LabelsBtn' -import {SelectLangBtn} from './select-language/SelectLangBtn' -import {SuggestedLanguage} from './select-language/SuggestedLanguage' -import {insertMentionAt} from 'lib/strings/mention-manip' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {useModals, useModalControls} from '#/state/modals' +import {ComposerOpts} from 'state/shell/composer' +import {ComposerReplyTo} from 'view/com/composer/ComposerReplyTo' + +import {logger} from '#/logger' +import {emitPostCreated} from '#/state/events' +import {useModalControls, useModals} from '#/state/modals' import {useRequireAltTextEnabled} from '#/state/preferences' import { + toPostLanguages, useLanguagePrefs, useLanguagePrefsApi, - toPostLanguages, } from '#/state/preferences/languages' -import {useSession, getAgent} from '#/state/session' import {useProfileQuery} from '#/state/queries/profile' -import {useComposerControls} from '#/state/shell/composer' -import {emitPostCreated} from '#/state/events' import {ThreadgateSetting} from '#/state/queries/threadgate' -import {logger} from '#/logger' -import {ComposerReplyTo} from 'view/com/composer/ComposerReplyTo' +import {getAgent, useSession} from '#/state/session' +import {useComposerControls} from '#/state/shell/composer' + +import QuoteEmbed from '../util/post-embeds/QuoteEmbed' +import {Text} from '../util/text/Text' +import * as Toast from '../util/Toast' +import {UserAvatar} from '../util/UserAvatar' +import {CharProgress} from './char-progress/CharProgress' +import {ExternalEmbed} from './ExternalEmbed' +import {LabelsBtn} from './labels/LabelsBtn' +import {Gallery} from './photos/Gallery' +import {OpenCameraBtn} from './photos/OpenCameraBtn' +import {SelectPhotoBtn} from './photos/SelectPhotoBtn' +import {SelectLangBtn} from './select-language/SelectLangBtn' +import {SuggestedLanguage} from './select-language/SuggestedLanguage' +// TODO: Prevent naming components that coincide with RN primitives +// due to linting false positives +import {TextInput, TextInputRef} from './text-input/TextInput' +import {ThreadgateBtn} from './threadgate/ThreadgateBtn' +import {useExternalLinkFetch} from './useExternalLinkFetch' type Props = ComposerOpts export const ComposePost = observer(function ComposePost({ diff --git a/src/view/com/composer/ComposerReplyTo.tsx b/src/view/com/composer/ComposerReplyTo.tsx index 39a1473a3..e6fe11565 100644 --- a/src/view/com/composer/ComposerReplyTo.tsx +++ b/src/view/com/composer/ComposerReplyTo.tsx @@ -1,21 +1,21 @@ -import React from 'react' -import {LayoutAnimation, Pressable, StyleSheet, View} from 'react-native' -import {Image} from 'expo-image' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' import { AppBskyEmbedImages, AppBskyEmbedRecord, AppBskyEmbedRecordWithMedia, AppBskyFeedPost, } from '@atproto/api' -import {ComposerOptsPostRef} from 'state/shell/composer' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {Image} from 'expo-image' import {usePalette} from 'lib/hooks/usePalette' import {sanitizeDisplayName} from 'lib/strings/display-names' import {sanitizeHandle} from 'lib/strings/handles' -import {UserAvatar} from 'view/com/util/UserAvatar' -import {Text} from 'view/com/util/text/Text' +import React from 'react' +import {LayoutAnimation, Pressable, StyleSheet, View} from 'react-native' +import {ComposerOptsPostRef} from 'state/shell/composer' import QuoteEmbed from 'view/com/util/post-embeds/QuoteEmbed' +import {Text} from 'view/com/util/text/Text' +import {UserAvatar} from 'view/com/util/UserAvatar' export function ComposerReplyTo({replyTo}: {replyTo: ComposerOptsPostRef}) { const pal = usePalette('default') diff --git a/src/view/com/composer/ExternalEmbed.tsx b/src/view/com/composer/ExternalEmbed.tsx index 02dd1bbd7..c2aebccd6 100644 --- a/src/view/com/composer/ExternalEmbed.tsx +++ b/src/view/com/composer/ExternalEmbed.tsx @@ -1,3 +1,9 @@ +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {ExternalEmbedDraft} from 'lib/api/index' +import {usePalette} from 'lib/hooks/usePalette' +import {s} from 'lib/styles' import React from 'react' import { ActivityIndicator, @@ -5,14 +11,9 @@ import { TouchableOpacity, View, } from 'react-native' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' + import {AutoSizedImage} from '../util/images/AutoSizedImage' import {Text} from '../util/text/Text' -import {s} from 'lib/styles' -import {usePalette} from 'lib/hooks/usePalette' -import {ExternalEmbedDraft} from 'lib/api/index' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' export const ExternalEmbed = ({ link, diff --git a/src/view/com/composer/Prompt.tsx b/src/view/com/composer/Prompt.tsx index 632bb2634..5f19a64bd 100644 --- a/src/view/com/composer/Prompt.tsx +++ b/src/view/com/composer/Prompt.tsx @@ -1,13 +1,15 @@ -import React from 'react' -import {StyleSheet, TouchableOpacity} from 'react-native' -import {UserAvatar} from '../util/UserAvatar' -import {Text} from '../util/text/Text' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {usePalette} from 'lib/hooks/usePalette' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {useSession} from '#/state/session' +import React from 'react' +import {StyleSheet, TouchableOpacity} from 'react-native' + import {useProfileQuery} from '#/state/queries/profile' +import {useSession} from '#/state/session' + +import {Text} from '../util/text/Text' +import {UserAvatar} from '../util/UserAvatar' export function ComposePrompt({onPressCompose}: {onPressCompose: () => void}) { const {currentAccount} = useSession() diff --git a/src/view/com/composer/char-progress/CharProgress.tsx b/src/view/com/composer/char-progress/CharProgress.tsx index a3fa78a59..3c5cee492 100644 --- a/src/view/com/composer/char-progress/CharProgress.tsx +++ b/src/view/com/composer/char-progress/CharProgress.tsx @@ -1,13 +1,14 @@ +import {MAX_GRAPHEME_LENGTH} from 'lib/constants' +import {usePalette} from 'lib/hooks/usePalette' +import {s} from 'lib/styles' import React from 'react' import {View} from 'react-native' -import {Text} from '../../util/text/Text' // @ts-ignore no type definition -prf import ProgressCircle from 'react-native-progress/Circle' // @ts-ignore no type definition -prf import ProgressPie from 'react-native-progress/Pie' -import {s} from 'lib/styles' -import {usePalette} from 'lib/hooks/usePalette' -import {MAX_GRAPHEME_LENGTH} from 'lib/constants' + +import {Text} from '../../util/text/Text' const DANGER_LENGTH = MAX_GRAPHEME_LENGTH diff --git a/src/view/com/composer/labels/LabelsBtn.tsx b/src/view/com/composer/labels/LabelsBtn.tsx index b880dd330..11f3d03d3 100644 --- a/src/view/com/composer/labels/LabelsBtn.tsx +++ b/src/view/com/composer/labels/LabelsBtn.tsx @@ -1,13 +1,14 @@ -import React from 'react' -import {Keyboard, StyleSheet} from 'react-native' -import {Button} from 'view/com/util/forms/Button' -import {usePalette} from 'lib/hooks/usePalette' -import {ShieldExclamation} from 'lib/icons' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' import {FontAwesomeIconStyle} from '@fortawesome/react-native-fontawesome' -import {isNative} from 'platform/detection' -import {useLingui} from '@lingui/react' import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {usePalette} from 'lib/hooks/usePalette' +import {ShieldExclamation} from 'lib/icons' +import {isNative} from 'platform/detection' +import React from 'react' +import {Keyboard, StyleSheet} from 'react-native' +import {Button} from 'view/com/util/forms/Button' + import {useModalControls} from '#/state/modals' export function LabelsBtn({ diff --git a/src/view/com/composer/photos/Gallery.tsx b/src/view/com/composer/photos/Gallery.tsx index 69c8debb0..380b70c9c 100644 --- a/src/view/com/composer/photos/Gallery.tsx +++ b/src/view/com/composer/photos/Gallery.tsx @@ -1,19 +1,20 @@ -import React, {useState} from 'react' -import {ImageStyle, Keyboard, LayoutChangeEvent} from 'react-native' -import {GalleryModel} from 'state/models/media/gallery' -import {observer} from 'mobx-react-lite' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import {s, colors} from 'lib/styles' -import {StyleSheet, TouchableOpacity, View} from 'react-native' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {Image} from 'expo-image' -import {Text} from 'view/com/util/text/Text' -import {Dimensions} from 'lib/media/types' import {usePalette} from 'lib/hooks/usePalette' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {useModalControls} from '#/state/modals' +import {Dimensions} from 'lib/media/types' +import {colors, s} from 'lib/styles' +import {observer} from 'mobx-react-lite' import {isNative} from 'platform/detection' +import React, {useState} from 'react' +import {ImageStyle, Keyboard, LayoutChangeEvent} from 'react-native' +import {StyleSheet, TouchableOpacity, View} from 'react-native' +import {GalleryModel} from 'state/models/media/gallery' +import {Text} from 'view/com/util/text/Text' + +import {useModalControls} from '#/state/modals' const IMAGE_GAP = 8 diff --git a/src/view/com/composer/photos/OpenCameraBtn.tsx b/src/view/com/composer/photos/OpenCameraBtn.tsx index 4353704d5..ce5318a2f 100644 --- a/src/view/com/composer/photos/OpenCameraBtn.tsx +++ b/src/view/com/composer/photos/OpenCameraBtn.tsx @@ -1,20 +1,21 @@ -import React, {useCallback} from 'react' -import {TouchableOpacity, StyleSheet} from 'react-native' -import * as MediaLibrary from 'expo-media-library' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' -import {usePalette} from 'lib/hooks/usePalette' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import * as MediaLibrary from 'expo-media-library' import {useAnalytics} from 'lib/analytics/analytics' -import {openCamera} from 'lib/media/picker' -import {useCameraPermission} from 'lib/hooks/usePermissions' import {HITSLOP_10, POST_IMG_MAX} from 'lib/constants' -import {GalleryModel} from 'state/models/media/gallery' +import {usePalette} from 'lib/hooks/usePalette' +import {useCameraPermission} from 'lib/hooks/usePermissions' +import {openCamera} from 'lib/media/picker' import {isMobileWeb, isNative} from 'platform/detection' +import React, {useCallback} from 'react' +import {StyleSheet, TouchableOpacity} from 'react-native' +import {GalleryModel} from 'state/models/media/gallery' + import {logger} from '#/logger' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' type Props = { gallery: GalleryModel diff --git a/src/view/com/composer/photos/SelectPhotoBtn.tsx b/src/view/com/composer/photos/SelectPhotoBtn.tsx index f7fa9502d..1e0e64090 100644 --- a/src/view/com/composer/photos/SelectPhotoBtn.tsx +++ b/src/view/com/composer/photos/SelectPhotoBtn.tsx @@ -1,17 +1,17 @@ -import React, {useCallback} from 'react' -import {TouchableOpacity, StyleSheet} from 'react-native' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' -import {usePalette} from 'lib/hooks/usePalette' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {useAnalytics} from 'lib/analytics/analytics' -import {usePhotoLibraryPermission} from 'lib/hooks/usePermissions' -import {GalleryModel} from 'state/models/media/gallery' import {HITSLOP_10} from 'lib/constants' +import {usePalette} from 'lib/hooks/usePalette' +import {usePhotoLibraryPermission} from 'lib/hooks/usePermissions' import {isNative} from 'platform/detection' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' +import React, {useCallback} from 'react' +import {StyleSheet, TouchableOpacity} from 'react-native' +import {GalleryModel} from 'state/models/media/gallery' type Props = { gallery: GalleryModel diff --git a/src/view/com/composer/select-language/SelectLangBtn.tsx b/src/view/com/composer/select-language/SelectLangBtn.tsx index 78b1e9ba2..bfcf248ee 100644 --- a/src/view/com/composer/select-language/SelectLangBtn.tsx +++ b/src/view/com/composer/select-language/SelectLangBtn.tsx @@ -1,27 +1,29 @@ -import React, {useCallback, useMemo} from 'react' -import {StyleSheet, Keyboard} from 'react-native' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' -import {Text} from 'view/com/util/text/Text' +import {msg, t} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {usePalette} from 'lib/hooks/usePalette' +import {isNative} from 'platform/detection' +import React, {useCallback, useMemo} from 'react' +import {Keyboard, StyleSheet} from 'react-native' import { DropdownButton, DropdownItem, DropdownItemButton, } from 'view/com/util/forms/DropdownButton' -import {usePalette} from 'lib/hooks/usePalette' -import {isNative} from 'platform/detection' -import {codeToLanguageName} from '../../../../locale/helpers' +import {Text} from 'view/com/util/text/Text' + import {useModalControls} from '#/state/modals' import { + hasPostLanguage, + toPostLanguages, useLanguagePrefs, useLanguagePrefsApi, - toPostLanguages, - hasPostLanguage, } from '#/state/preferences/languages' -import {t, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' + +import {codeToLanguageName} from '../../../../locale/helpers' export function SelectLangBtn() { const pal = usePalette('default') diff --git a/src/view/com/composer/select-language/SuggestedLanguage.tsx b/src/view/com/composer/select-language/SuggestedLanguage.tsx index 0bf62ae0d..97a2a9830 100644 --- a/src/view/com/composer/select-language/SuggestedLanguage.tsx +++ b/src/view/com/composer/select-language/SuggestedLanguage.tsx @@ -1,22 +1,24 @@ +import { + FontAwesomeIcon, + FontAwesomeIconStyle, +} from '@fortawesome/react-native-fontawesome' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import lande from 'lande' import React, {useEffect, useState} from 'react' import {StyleSheet, View} from 'react-native' -import lande from 'lande' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {Text} from '../../util/text/Text' -import {Button} from '../../util/forms/Button' + +import {usePalette} from '#/lib/hooks/usePalette' +import {s} from '#/lib/styles' import {code3ToCode2Strict, codeToLanguageName} from '#/locale/helpers' import { toPostLanguages, useLanguagePrefs, useLanguagePrefsApi, } from '#/state/preferences/languages' -import {usePalette} from '#/lib/hooks/usePalette' -import {s} from '#/lib/styles' -import { - FontAwesomeIcon, - FontAwesomeIconStyle, -} from '@fortawesome/react-native-fontawesome' + +import {Button} from '../../util/forms/Button' +import {Text} from '../../util/text/Text' // fallbacks for safari const onIdle = globalThis.requestIdleCallback || (cb => setTimeout(cb, 1)) diff --git a/src/view/com/composer/text-input/TextInput.tsx b/src/view/com/composer/text-input/TextInput.tsx index 20be585c2..435adfa33 100644 --- a/src/view/com/composer/text-input/TextInput.tsx +++ b/src/view/com/composer/text-input/TextInput.tsx @@ -1,10 +1,24 @@ +import {AppBskyRichtextFacet, RichText} from '@atproto/api' +import PasteInput, { + PastedFile, + PasteInputRef, +} from '@mattermost/react-native-paste-input' +import {POST_IMG_MAX} from 'lib/constants' +import {usePalette} from 'lib/hooks/usePalette' +import {downloadAndResize} from 'lib/media/manip' +import {isUriImage} from 'lib/media/util' +import {cleanError} from 'lib/strings/errors' +import {getMentionAt, insertMentionAt} from 'lib/strings/mention-manip' +import {useTheme} from 'lib/ThemeContext' +import isEqual from 'lodash.isequal' +import {isIOS} from 'platform/detection' import React, { + ComponentProps, forwardRef, useCallback, - useRef, useMemo, + useRef, useState, - ComponentProps, } from 'react' import { NativeSyntheticEvent, @@ -13,22 +27,9 @@ import { TextInputSelectionChangeEventData, View, } from 'react-native' -import PasteInput, { - PastedFile, - PasteInputRef, -} from '@mattermost/react-native-paste-input' -import {AppBskyRichtextFacet, RichText} from '@atproto/api' -import isEqual from 'lodash.isequal' -import {Autocomplete} from './mobile/Autocomplete' import {Text} from 'view/com/util/text/Text' -import {cleanError} from 'lib/strings/errors' -import {getMentionAt, insertMentionAt} from 'lib/strings/mention-manip' -import {usePalette} from 'lib/hooks/usePalette' -import {useTheme} from 'lib/ThemeContext' -import {isUriImage} from 'lib/media/util' -import {downloadAndResize} from 'lib/media/manip' -import {POST_IMG_MAX} from 'lib/constants' -import {isIOS} from 'platform/detection' + +import {Autocomplete} from './mobile/Autocomplete' export interface TextInputRef { focus: () => void diff --git a/src/view/com/composer/text-input/TextInput.web.tsx b/src/view/com/composer/text-input/TextInput.web.tsx index c62d11201..6b363558a 100644 --- a/src/view/com/composer/text-input/TextInput.web.tsx +++ b/src/view/com/composer/text-input/TextInput.web.tsx @@ -1,28 +1,30 @@ -import React from 'react' -import {StyleSheet, View} from 'react-native' -import {RichText, AppBskyRichtextFacet} from '@atproto/api' -import EventEmitter from 'eventemitter3' -import {useEditor, EditorContent, JSONContent} from '@tiptap/react' +import {AppBskyRichtextFacet, RichText} from '@atproto/api' +import {Trans} from '@lingui/macro' import {Document} from '@tiptap/extension-document' -import History from '@tiptap/extension-history' import Hardbreak from '@tiptap/extension-hard-break' +import History from '@tiptap/extension-history' import {Mention} from '@tiptap/extension-mention' import {Paragraph} from '@tiptap/extension-paragraph' import {Placeholder} from '@tiptap/extension-placeholder' import {Text as TiptapText} from '@tiptap/extension-text' +import {generateJSON} from '@tiptap/html' +import {EditorContent, JSONContent, useEditor} from '@tiptap/react' +import EventEmitter from 'eventemitter3' +import {useColorSchemeStyle} from 'lib/hooks/useColorSchemeStyle' +import {blobToDataUri, isUriImage} from 'lib/media/util' import isEqual from 'lodash.isequal' +import React from 'react' +import {StyleSheet, View} from 'react-native' +import Animated, {FadeIn, FadeOut} from 'react-native-reanimated' + +import {Portal} from '#/components/Portal' +import {usePalette} from '#/lib/hooks/usePalette' +import {useActorAutocompleteFn} from '#/state/queries/actor-autocomplete' + +import {Text} from '../../util/text/Text' import {createSuggestion} from './web/Autocomplete' -import {useColorSchemeStyle} from 'lib/hooks/useColorSchemeStyle' -import {isUriImage, blobToDataUri} from 'lib/media/util' import {Emoji} from './web/EmojiPicker.web' import {LinkDecorator} from './web/LinkDecorator' -import {generateJSON} from '@tiptap/html' -import {useActorAutocompleteFn} from '#/state/queries/actor-autocomplete' -import {usePalette} from '#/lib/hooks/usePalette' -import {Portal} from '#/components/Portal' -import {Text} from '../../util/text/Text' -import {Trans} from '@lingui/macro' -import Animated, {FadeIn, FadeOut} from 'react-native-reanimated' import {TagDecorator} from './web/TagDecorator' export interface TextInputRef { diff --git a/src/view/com/composer/text-input/mobile/Autocomplete.tsx b/src/view/com/composer/text-input/mobile/Autocomplete.tsx index c400aa48d..1e8b7900b 100644 --- a/src/view/com/composer/text-input/mobile/Autocomplete.tsx +++ b/src/view/com/composer/text-input/mobile/Autocomplete.tsx @@ -1,13 +1,15 @@ -import React, {useEffect, useRef} from 'react' -import {Animated, TouchableOpacity, StyleSheet, View} from 'react-native' +import {AppBskyActorDefs} from '@atproto/api' +import {Trans} from '@lingui/macro' import {useAnimatedValue} from 'lib/hooks/useAnimatedValue' import {usePalette} from 'lib/hooks/usePalette' +import React, {useEffect, useRef} from 'react' +import {Animated, StyleSheet, TouchableOpacity, View} from 'react-native' import {Text} from 'view/com/util/text/Text' import {UserAvatar} from 'view/com/util/UserAvatar' -import {useGrapheme} from '../hooks/useGrapheme' + import {useActorAutocompleteQuery} from '#/state/queries/actor-autocomplete' -import {Trans} from '@lingui/macro' -import {AppBskyActorDefs} from '@atproto/api' + +import {useGrapheme} from '../hooks/useGrapheme' export function Autocomplete({ prefix, diff --git a/src/view/com/composer/text-input/web/Autocomplete.tsx b/src/view/com/composer/text-input/web/Autocomplete.tsx index 76058fed3..21fae297c 100644 --- a/src/view/com/composer/text-input/web/Autocomplete.tsx +++ b/src/view/com/composer/text-input/web/Autocomplete.tsx @@ -1,3 +1,11 @@ +import {Trans} from '@lingui/macro' +import {ReactRenderer} from '@tiptap/react' +import { + SuggestionKeyDownProps, + SuggestionOptions, + SuggestionProps, +} from '@tiptap/suggestion' +import {usePalette} from 'lib/hooks/usePalette' import React, { forwardRef, useEffect, @@ -5,19 +13,13 @@ import React, { useState, } from 'react' import {Pressable, StyleSheet, View} from 'react-native' -import {ReactRenderer} from '@tiptap/react' import tippy, {Instance as TippyInstance} from 'tippy.js' -import { - SuggestionOptions, - SuggestionProps, - SuggestionKeyDownProps, -} from '@tiptap/suggestion' -import {ActorAutocompleteFn} from '#/state/queries/actor-autocomplete' -import {usePalette} from 'lib/hooks/usePalette' import {Text} from 'view/com/util/text/Text' import {UserAvatar} from 'view/com/util/UserAvatar' + +import {ActorAutocompleteFn} from '#/state/queries/actor-autocomplete' + import {useGrapheme} from '../hooks/useGrapheme' -import {Trans} from '@lingui/macro' interface MentionListRef { onKeyDown: (props: SuggestionKeyDownProps) => boolean diff --git a/src/view/com/composer/text-input/web/EmojiPicker.web.tsx b/src/view/com/composer/text-input/web/EmojiPicker.web.tsx index 149362116..d918953de 100644 --- a/src/view/com/composer/text-input/web/EmojiPicker.web.tsx +++ b/src/view/com/composer/text-input/web/EmojiPicker.web.tsx @@ -1,11 +1,12 @@ -import React from 'react' import Picker from '@emoji-mart/react' +import React from 'react' import { StyleSheet, TouchableWithoutFeedback, useWindowDimensions, View, } from 'react-native' + import {textInputWebEmitter} from '../TextInput.web' const HEIGHT_OFFSET = 40 diff --git a/src/view/com/composer/text-input/web/LinkDecorator.ts b/src/view/com/composer/text-input/web/LinkDecorator.ts index e36ac80e4..207dbe7e4 100644 --- a/src/view/com/composer/text-input/web/LinkDecorator.ts +++ b/src/view/com/composer/text-input/web/LinkDecorator.ts @@ -14,12 +14,11 @@ * the facet-set. */ +import {URL_REGEX} from '@atproto/api' import {Mark} from '@tiptap/core' -import {Plugin, PluginKey} from '@tiptap/pm/state' import {Node as ProsemirrorNode} from '@tiptap/pm/model' +import {Plugin, PluginKey} from '@tiptap/pm/state' import {Decoration, DecorationSet} from '@tiptap/pm/view' -import {URL_REGEX} from '@atproto/api' - import {isValidDomain} from 'lib/strings/url-helpers' export const LinkDecorator = Mark.create({ diff --git a/src/view/com/composer/text-input/web/TagDecorator.ts b/src/view/com/composer/text-input/web/TagDecorator.ts index 2bf3184a8..9225fd6bf 100644 --- a/src/view/com/composer/text-input/web/TagDecorator.ts +++ b/src/view/com/composer/text-input/web/TagDecorator.ts @@ -14,11 +14,11 @@ * the facet-set. */ +import {TAG_REGEX, TRAILING_PUNCTUATION_REGEX} from '@atproto/api' import {Mark} from '@tiptap/core' -import {Plugin, PluginKey} from '@tiptap/pm/state' import {Node as ProsemirrorNode} from '@tiptap/pm/model' +import {Plugin, PluginKey} from '@tiptap/pm/state' import {Decoration, DecorationSet} from '@tiptap/pm/view' -import {TAG_REGEX, TRAILING_PUNCTUATION_REGEX} from '@atproto/api' function getDecorations(doc: ProsemirrorNode) { const decorations: Decoration[] = [] diff --git a/src/view/com/composer/threadgate/ThreadgateBtn.tsx b/src/view/com/composer/threadgate/ThreadgateBtn.tsx index ebbc613ff..0647d4215 100644 --- a/src/view/com/composer/threadgate/ThreadgateBtn.tsx +++ b/src/view/com/composer/threadgate/ThreadgateBtn.tsx @@ -1,17 +1,18 @@ -import React from 'react' -import {TouchableOpacity, StyleSheet, Keyboard} from 'react-native' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' -import {usePalette} from 'lib/hooks/usePalette' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {useAnalytics} from 'lib/analytics/analytics' import {HITSLOP_10} from 'lib/constants' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' +import {usePalette} from 'lib/hooks/usePalette' +import React from 'react' +import {Keyboard, StyleSheet, TouchableOpacity} from 'react-native' + +import {isNative} from '#/platform/detection' import {useModalControls} from '#/state/modals' import {ThreadgateSetting} from '#/state/queries/threadgate' -import {isNative} from '#/platform/detection' export function ThreadgateBtn({ threadgate, diff --git a/src/view/com/composer/useExternalLinkFetch.ts b/src/view/com/composer/useExternalLinkFetch.ts index 54773d565..5daff41ea 100644 --- a/src/view/com/composer/useExternalLinkFetch.ts +++ b/src/view/com/composer/useExternalLinkFetch.ts @@ -1,24 +1,25 @@ -import {useState, useEffect} from 'react' -import {ImageModel} from 'state/models/media/image' import * as apilib from 'lib/api/index' -import {getLinkMeta} from 'lib/link-meta/link-meta' +import {POST_IMG_MAX} from 'lib/constants' import { - getPostAsQuote, getFeedAsEmbed, getListAsEmbed, + getPostAsQuote, } from 'lib/link-meta/bsky' +import {getLinkMeta} from 'lib/link-meta/link-meta' import {downloadAndResize} from 'lib/media/manip' import { - isBskyPostUrl, isBskyCustomFeedUrl, isBskyListUrl, + isBskyPostUrl, } from 'lib/strings/url-helpers' +import {useEffect, useState} from 'react' +import {ImageModel} from 'state/models/media/image' import {ComposerOpts} from 'state/shell/composer' -import {POST_IMG_MAX} from 'lib/constants' + import {logger} from '#/logger' -import {getAgent} from '#/state/session' -import {useGetPost} from '#/state/queries/post' import {useFetchDid} from '#/state/queries/handle' +import {useGetPost} from '#/state/queries/post' +import {getAgent} from '#/state/session' export function useExternalLinkFetch({ setQuote, diff --git a/src/view/com/feeds/FeedPage.tsx b/src/view/com/feeds/FeedPage.tsx index e6b5d1fb6..169487753 100644 --- a/src/view/com/feeds/FeedPage.tsx +++ b/src/view/com/feeds/FeedPage.tsx @@ -1,27 +1,29 @@ -import React from 'react' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {useNavigation} from '@react-navigation/native' -import {useAnalytics} from 'lib/analytics/analytics' import {useQueryClient} from '@tanstack/react-query' -import {RQKEY as FEED_RQKEY} from '#/state/queries/post-feed' -import {MainScrollProvider} from '../util/MainScrollProvider' +import {useAnalytics} from 'lib/analytics/analytics' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {useSetMinimalShellMode} from '#/state/shell' -import {FeedDescriptor, FeedParams} from '#/state/queries/post-feed' import {ComposeIcon2} from 'lib/icons' import {s} from 'lib/styles' -import {View, useWindowDimensions} from 'react-native' -import {ListMethods} from '../util/List' +import React from 'react' +import {useWindowDimensions, View} from 'react-native' + +import {getRootNavigation, getTabState, TabState} from '#/lib/routes/helpers' +import {isNative} from '#/platform/detection' +import {listenSoftReset} from '#/state/events' +import {RQKEY as FEED_RQKEY} from '#/state/queries/post-feed' +import {FeedDescriptor, FeedParams} from '#/state/queries/post-feed' +import {truncateAndInvalidate} from '#/state/queries/util' +import {useSession} from '#/state/session' +import {useSetMinimalShellMode} from '#/state/shell' +import {useComposerControls} from '#/state/shell/composer' + import {Feed} from '../posts/Feed' import {FAB} from '../util/fab/FAB' +import {ListMethods} from '../util/List' import {LoadLatestBtn} from '../util/load-latest/LoadLatestBtn' -import {msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {useSession} from '#/state/session' -import {useComposerControls} from '#/state/shell/composer' -import {listenSoftReset} from '#/state/events' -import {truncateAndInvalidate} from '#/state/queries/util' -import {TabState, getTabState, getRootNavigation} from '#/lib/routes/helpers' -import {isNative} from '#/platform/detection' +import {MainScrollProvider} from '../util/MainScrollProvider' const POLL_FREQ = 60e3 // 60sec diff --git a/src/view/com/feeds/FeedSourceCard.tsx b/src/view/com/feeds/FeedSourceCard.tsx index 4af62f6f6..4e0865af5 100644 --- a/src/view/com/feeds/FeedSourceCard.tsx +++ b/src/view/com/feeds/FeedSourceCard.tsx @@ -1,30 +1,32 @@ -import React from 'react' -import {Pressable, StyleProp, StyleSheet, View, ViewStyle} from 'react-native' +import {AtUri} from '@atproto/api' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import {Text} from '../util/text/Text' -import {RichText} from '#/components/RichText' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useNavigationDeduped} from 'lib/hooks/useNavigationDeduped' import {usePalette} from 'lib/hooks/usePalette' -import {s} from 'lib/styles' -import {UserAvatar} from '../util/UserAvatar' +import {sanitizeHandle} from 'lib/strings/handles' import {pluralize} from 'lib/strings/helpers' -import {AtUri} from '@atproto/api' +import {s} from 'lib/styles' +import React from 'react' +import {Pressable, StyleProp, StyleSheet, View, ViewStyle} from 'react-native' import * as Toast from 'view/com/util/Toast' -import {sanitizeHandle} from 'lib/strings/handles' + +import {useTheme} from '#/alf' +import {RichText} from '#/components/RichText' import {logger} from '#/logger' import {useModalControls} from '#/state/modals' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' +import {FeedSourceInfo, useFeedSourceInfoQuery} from '#/state/queries/feed' import { usePinFeedMutation, - UsePreferencesQueryResponse, usePreferencesQuery, - useSaveFeedMutation, + UsePreferencesQueryResponse, useRemoveFeedMutation, + useSaveFeedMutation, } from '#/state/queries/preferences' -import {useFeedSourceInfoQuery, FeedSourceInfo} from '#/state/queries/feed' import {FeedLoadingPlaceholder} from '#/view/com/util/LoadingPlaceholder' -import {useTheme} from '#/alf' -import {useNavigationDeduped} from 'lib/hooks/useNavigationDeduped' + +import {Text} from '../util/text/Text' +import {UserAvatar} from '../util/UserAvatar' export function FeedSourceCard({ feedUri, diff --git a/src/view/com/feeds/ProfileFeedgens.tsx b/src/view/com/feeds/ProfileFeedgens.tsx index e9cf9e535..702fe0d4e 100644 --- a/src/view/com/feeds/ProfileFeedgens.tsx +++ b/src/view/com/feeds/ProfileFeedgens.tsx @@ -1,22 +1,24 @@ -import React from 'react' -import {StyleProp, StyleSheet, View, ViewStyle} from 'react-native' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {useQueryClient} from '@tanstack/react-query' -import {List, ListRef} from '../util/List' -import {FeedSourceCardLoaded} from './FeedSourceCard' -import {ErrorMessage} from '../util/error/ErrorMessage' -import {LoadMoreRetryBtn} from '../util/LoadMoreRetryBtn' -import {Text} from '../util/text/Text' import {usePalette} from 'lib/hooks/usePalette' -import {useProfileFeedgensQuery, RQKEY} from '#/state/queries/profile-feedgens' -import {logger} from '#/logger' -import {Trans, msg} from '@lingui/macro' +import React from 'react' +import {StyleProp, StyleSheet, View, ViewStyle} from 'react-native' + import {cleanError} from '#/lib/strings/errors' import {useTheme} from '#/lib/ThemeContext' -import {usePreferencesQuery} from '#/state/queries/preferences' +import {logger} from '#/logger' +import {isNative} from '#/platform/detection' import {hydrateFeedGenerator} from '#/state/queries/feed' +import {usePreferencesQuery} from '#/state/queries/preferences' +import {RQKEY, useProfileFeedgensQuery} from '#/state/queries/profile-feedgens' import {FeedLoadingPlaceholder} from '#/view/com/util/LoadingPlaceholder' -import {isNative} from '#/platform/detection' -import {useLingui} from '@lingui/react' + +import {ErrorMessage} from '../util/error/ErrorMessage' +import {List, ListRef} from '../util/List' +import {LoadMoreRetryBtn} from '../util/LoadMoreRetryBtn' +import {Text} from '../util/text/Text' +import {FeedSourceCardLoaded} from './FeedSourceCard' const LOADING = {_reactKey: '__loading__'} const EMPTY = {_reactKey: '__empty__'} diff --git a/src/view/com/home/HomeHeader.tsx b/src/view/com/home/HomeHeader.tsx index aa3ecb7fc..13819142a 100644 --- a/src/view/com/home/HomeHeader.tsx +++ b/src/view/com/home/HomeHeader.tsx @@ -1,12 +1,14 @@ -import React from 'react' -import {RenderTabBarFnProps} from 'view/com/pager/Pager' -import {HomeHeaderLayout} from './HomeHeaderLayout' -import {FeedSourceInfo} from '#/state/queries/feed' import {useNavigation} from '@react-navigation/native' import {NavigationProp} from 'lib/routes/types' import {isWeb} from 'platform/detection' -import {TabBar} from '../pager/TabBar' +import React from 'react' +import {RenderTabBarFnProps} from 'view/com/pager/Pager' + import {usePalette} from '#/lib/hooks/usePalette' +import {FeedSourceInfo} from '#/state/queries/feed' + +import {TabBar} from '../pager/TabBar' +import {HomeHeaderLayout} from './HomeHeaderLayout' export function HomeHeader( props: RenderTabBarFnProps & { diff --git a/src/view/com/home/HomeHeaderLayout.web.tsx b/src/view/com/home/HomeHeaderLayout.web.tsx index 9818b56f6..25d90e4e4 100644 --- a/src/view/com/home/HomeHeaderLayout.web.tsx +++ b/src/view/com/home/HomeHeaderLayout.web.tsx @@ -1,20 +1,22 @@ -import React from 'react' -import {StyleSheet, View} from 'react-native' -import Animated from 'react-native-reanimated' -import {usePalette} from 'lib/hooks/usePalette' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {HomeHeaderLayoutMobile} from './HomeHeaderLayoutMobile' -import {Logo} from '#/view/icons/Logo' -import {Link} from '../util/Link' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' -import {useLingui} from '@lingui/react' import {msg} from '@lingui/macro' -import {CogIcon} from '#/lib/icons' +import {useLingui} from '@lingui/react' import {useMinimalShellMode} from 'lib/hooks/useMinimalShellMode' +import {usePalette} from 'lib/hooks/usePalette' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import React from 'react' +import {StyleSheet, View} from 'react-native' +import Animated from 'react-native-reanimated' + +import {CogIcon} from '#/lib/icons' import {useShellLayout} from '#/state/shell/shell-layout' +import {Logo} from '#/view/icons/Logo' + +import {Link} from '../util/Link' +import {HomeHeaderLayoutMobile} from './HomeHeaderLayoutMobile' export function HomeHeaderLayout(props: { children: React.ReactNode diff --git a/src/view/com/home/HomeHeaderLayoutMobile.tsx b/src/view/com/home/HomeHeaderLayoutMobile.tsx index d7b7231c6..c621c80d2 100644 --- a/src/view/com/home/HomeHeaderLayoutMobile.tsx +++ b/src/view/com/home/HomeHeaderLayoutMobile.tsx @@ -1,23 +1,24 @@ -import React from 'react' -import {StyleSheet, TouchableOpacity, View} from 'react-native' -import {usePalette} from 'lib/hooks/usePalette' -import {Link} from '../util/Link' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' import {FontAwesomeIconStyle} from '@fortawesome/react-native-fontawesome' -import {HITSLOP_10} from 'lib/constants' -import Animated from 'react-native-reanimated' import {msg} from '@lingui/macro' import {useLingui} from '@lingui/react' +import {HITSLOP_10} from 'lib/constants' import {useMinimalShellMode} from 'lib/hooks/useMinimalShellMode' -import {useSetDrawerOpen} from '#/state/shell/drawer-open' -import {useShellLayout} from '#/state/shell/shell-layout' +import {usePalette} from 'lib/hooks/usePalette' import {isWeb} from 'platform/detection' -import {Logo} from '#/view/icons/Logo' +import React from 'react' +import {StyleSheet, TouchableOpacity, View} from 'react-native' +import Animated from 'react-native-reanimated' -import {IS_DEV} from '#/env' import {atoms} from '#/alf' -import {Link as Link2} from '#/components/Link' import {ColorPalette_Stroke2_Corner0_Rounded as ColorPalette} from '#/components/icons/ColorPalette' +import {Link as Link2} from '#/components/Link' +import {IS_DEV} from '#/env' +import {useSetDrawerOpen} from '#/state/shell/drawer-open' +import {useShellLayout} from '#/state/shell/shell-layout' +import {Logo} from '#/view/icons/Logo' + +import {Link} from '../util/Link' export function HomeHeaderLayoutMobile({ children, diff --git a/src/view/com/lightbox/ImageViewing/components/ImageDefaultHeader.tsx b/src/view/com/lightbox/ImageViewing/components/ImageDefaultHeader.tsx index 3401adaff..eecc3f6f3 100644 --- a/src/view/com/lightbox/ImageViewing/components/ImageDefaultHeader.tsx +++ b/src/view/com/lightbox/ImageViewing/components/ImageDefaultHeader.tsx @@ -5,10 +5,10 @@ * LICENSE file in the root directory of this source tree. * */ -import React from 'react' -import {createHitslop} from 'lib/constants' -import {SafeAreaView, Text, TouchableOpacity, StyleSheet} from 'react-native' import {t} from '@lingui/macro' +import {createHitslop} from 'lib/constants' +import React from 'react' +import {SafeAreaView, StyleSheet, Text, TouchableOpacity} from 'react-native' type Props = { onRequestClose: () => void diff --git a/src/view/com/lightbox/ImageViewing/components/ImageItem/ImageItem.android.tsx b/src/view/com/lightbox/ImageViewing/components/ImageItem/ImageItem.android.tsx index 414f98a61..85963067c 100644 --- a/src/view/com/lightbox/ImageViewing/components/ImageItem/ImageItem.android.tsx +++ b/src/view/com/lightbox/ImageViewing/components/ImageItem/ImageItem.android.tsx @@ -1,28 +1,28 @@ +import {Image} from 'expo-image' import React, {useState} from 'react' - import {ActivityIndicator, Dimensions, StyleSheet} from 'react-native' -import {Image} from 'expo-image' +import {Gesture, GestureDetector} from 'react-native-gesture-handler' import Animated, { runOnJS, + useAnimatedReaction, useAnimatedRef, useAnimatedStyle, - useAnimatedReaction, useSharedValue, withDecay, withSpring, } from 'react-native-reanimated' -import {GestureDetector, Gesture} from 'react-native-gesture-handler' + +import type {Dimensions as ImageDimensions, ImageSource} from '../../@types' import useImageDimensions from '../../hooks/useImageDimensions' import { - createTransform, - readTransform, applyRounding, + createTransform, prependPan, prependPinch, prependTransform, + readTransform, TransformMatrix, } from '../../transforms' -import type {ImageSource, Dimensions as ImageDimensions} from '../../@types' const SCREEN = Dimensions.get('window') const MIN_DOUBLE_TAP_SCALE = 2 diff --git a/src/view/com/lightbox/ImageViewing/components/ImageItem/ImageItem.ios.tsx b/src/view/com/lightbox/ImageViewing/components/ImageItem/ImageItem.ios.tsx index 383490f4f..5fabeb170 100644 --- a/src/view/com/lightbox/ImageViewing/components/ImageItem/ImageItem.ios.tsx +++ b/src/view/com/lightbox/ImageViewing/components/ImageItem/ImageItem.ios.tsx @@ -6,10 +6,10 @@ * */ +import {Image} from 'expo-image' import React, {useState} from 'react' - import {Dimensions, StyleSheet} from 'react-native' -import {Image} from 'expo-image' +import {Gesture, GestureDetector} from 'react-native-gesture-handler' import Animated, { interpolate, runOnJS, @@ -17,12 +17,11 @@ import Animated, { useAnimatedStyle, useSharedValue, } from 'react-native-reanimated' + import {useAnimatedScrollHandler} from '#/lib/hooks/useAnimatedScrollHandler_FIXED' -import {Gesture, GestureDetector} from 'react-native-gesture-handler' +import {Dimensions as ImageDimensions, ImageSource} from '../../@types' import useImageDimensions from '../../hooks/useImageDimensions' - -import {ImageSource, Dimensions as ImageDimensions} from '../../@types' import {ImageLoading} from './ImageLoading' const SWIPE_CLOSE_OFFSET = 75 diff --git a/src/view/com/lightbox/ImageViewing/components/ImageItem/ImageItem.tsx b/src/view/com/lightbox/ImageViewing/components/ImageItem/ImageItem.tsx index 08b99bf9e..4cb7903ef 100644 --- a/src/view/com/lightbox/ImageViewing/components/ImageItem/ImageItem.tsx +++ b/src/view/com/lightbox/ImageViewing/components/ImageItem/ImageItem.tsx @@ -2,6 +2,7 @@ import React from 'react' import {View} from 'react-native' + import {ImageSource} from '../../@types' type Props = { diff --git a/src/view/com/lightbox/ImageViewing/components/ImageItem/ImageLoading.tsx b/src/view/com/lightbox/ImageViewing/components/ImageItem/ImageLoading.tsx index 9667fcaa7..318e7d8da 100644 --- a/src/view/com/lightbox/ImageViewing/components/ImageItem/ImageLoading.tsx +++ b/src/view/com/lightbox/ImageViewing/components/ImageItem/ImageLoading.tsx @@ -7,7 +7,6 @@ */ import React from 'react' - import {ActivityIndicator, Dimensions, StyleSheet, View} from 'react-native' const SCREEN = Dimensions.get('screen') diff --git a/src/view/com/lightbox/ImageViewing/hooks/useImageDimensions.ts b/src/view/com/lightbox/ImageViewing/hooks/useImageDimensions.ts index cb46fd0d9..46f9f2295 100644 --- a/src/view/com/lightbox/ImageViewing/hooks/useImageDimensions.ts +++ b/src/view/com/lightbox/ImageViewing/hooks/useImageDimensions.ts @@ -8,6 +8,7 @@ import {useEffect, useState} from 'react' import {Image, ImageURISource} from 'react-native' + import {Dimensions, ImageSource} from '../@types' const CACHE_SIZE = 50 diff --git a/src/view/com/lightbox/ImageViewing/index.tsx b/src/view/com/lightbox/ImageViewing/index.tsx index ff8fdb86d..1432b34ff 100644 --- a/src/view/com/lightbox/ImageViewing/index.tsx +++ b/src/view/com/lightbox/ImageViewing/index.tsx @@ -9,15 +9,14 @@ // https://github.com/jobtoday/react-native-image-viewing import React, {ComponentType, useCallback, useMemo, useState} from 'react' -import {StyleSheet, View, Platform} from 'react-native' - -import ImageItem from './components/ImageItem/ImageItem' -import ImageDefaultHeader from './components/ImageDefaultHeader' - -import {ImageSource} from './@types' +import {Platform, StyleSheet, View} from 'react-native' +import PagerView from 'react-native-pager-view' import Animated, {useAnimatedStyle, withSpring} from 'react-native-reanimated' import {Edge, SafeAreaView} from 'react-native-safe-area-context' -import PagerView from 'react-native-pager-view' + +import {ImageSource} from './@types' +import ImageDefaultHeader from './components/ImageDefaultHeader' +import ImageItem from './components/ImageItem/ImageItem' type Props = { images: ImageSource[] diff --git a/src/view/com/lightbox/Lightbox.tsx b/src/view/com/lightbox/Lightbox.tsx index 2ee5b8d59..b3e5dfb9b 100644 --- a/src/view/com/lightbox/Lightbox.tsx +++ b/src/view/com/lightbox/Lightbox.tsx @@ -1,22 +1,24 @@ -import React from 'react' -import {LayoutAnimation, StyleSheet, View} from 'react-native' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import ImageView from './ImageViewing' -import {shareImageModal, saveImageToMediaLibrary} from 'lib/media/manip' -import * as Toast from '../util/Toast' -import {Text} from '../util/text/Text' -import {s, colors} from 'lib/styles' -import {Button} from '../util/forms/Button' -import {isIOS} from 'platform/detection' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import * as MediaLibrary from 'expo-media-library' +import {saveImageToMediaLibrary, shareImageModal} from 'lib/media/manip' +import {colors, s} from 'lib/styles' +import {isIOS} from 'platform/detection' +import React from 'react' +import {LayoutAnimation, StyleSheet, View} from 'react-native' + import { + ImagesLightbox, + ProfileImageLightbox, useLightbox, useLightboxControls, - ProfileImageLightbox, - ImagesLightbox, } from '#/state/lightbox' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' + +import {Button} from '../util/forms/Button' +import {Text} from '../util/text/Text' +import * as Toast from '../util/Toast' +import ImageView from './ImageViewing' export function Lightbox() { const {activeLightbox} = useLightbox() diff --git a/src/view/com/lightbox/Lightbox.web.tsx b/src/view/com/lightbox/Lightbox.web.tsx index fb97c30a4..e3c3d5acd 100644 --- a/src/view/com/lightbox/Lightbox.web.tsx +++ b/src/view/com/lightbox/Lightbox.web.tsx @@ -1,29 +1,31 @@ +import { + FontAwesomeIcon, + FontAwesomeIconStyle, +} from '@fortawesome/react-native-fontawesome' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {colors, s} from 'lib/styles' import React, {useCallback, useEffect, useState} from 'react' import { Image, ImageStyle, + Pressable, + StyleSheet, TouchableOpacity, TouchableWithoutFeedback, - StyleSheet, View, - Pressable, } from 'react-native' + +import {useWebBodyScrollLock} from '#/lib/hooks/useWebBodyScrollLock' import { - FontAwesomeIcon, - FontAwesomeIconStyle, -} from '@fortawesome/react-native-fontawesome' -import {colors, s} from 'lib/styles' -import ImageDefaultHeader from './ImageViewing/components/ImageDefaultHeader' -import {Text} from '../util/text/Text' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' -import { - useLightbox, - useLightboxControls, ImagesLightbox, ProfileImageLightbox, + useLightbox, + useLightboxControls, } from '#/state/lightbox' -import {useWebBodyScrollLock} from '#/lib/hooks/useWebBodyScrollLock' + +import {Text} from '../util/text/Text' +import ImageDefaultHeader from './ImageViewing/components/ImageDefaultHeader' interface Img { uri: string diff --git a/src/view/com/lists/ListCard.tsx b/src/view/com/lists/ListCard.tsx index 19842eb54..0a36902a4 100644 --- a/src/view/com/lists/ListCard.tsx +++ b/src/view/com/lists/ListCard.tsx @@ -1,18 +1,20 @@ +import {AppBskyGraphDefs, AtUri, RichText} from '@atproto/api' +import {Trans} from '@lingui/macro' +import {usePalette} from 'lib/hooks/usePalette' +import {makeProfileLink} from 'lib/routes/links' +import {sanitizeDisplayName} from 'lib/strings/display-names' +import {sanitizeHandle} from 'lib/strings/handles' +import {s} from 'lib/styles' import React from 'react' import {StyleProp, StyleSheet, View, ViewStyle} from 'react-native' -import {AtUri, AppBskyGraphDefs, RichText} from '@atproto/api' + +import {atoms as a} from '#/alf' +import {RichText as RichTextCom} from '#/components/RichText' +import {useSession} from '#/state/session' + import {Link} from '../util/Link' import {Text} from '../util/text/Text' -import {RichText as RichTextCom} from '#/components/RichText' import {UserAvatar} from '../util/UserAvatar' -import {s} from 'lib/styles' -import {usePalette} from 'lib/hooks/usePalette' -import {useSession} from '#/state/session' -import {sanitizeDisplayName} from 'lib/strings/display-names' -import {sanitizeHandle} from 'lib/strings/handles' -import {makeProfileLink} from 'lib/routes/links' -import {Trans} from '@lingui/macro' -import {atoms as a} from '#/alf' export const ListCard = ({ testID, diff --git a/src/view/com/lists/ListMembers.tsx b/src/view/com/lists/ListMembers.tsx index 4f2b56426..796db8967 100644 --- a/src/view/com/lists/ListMembers.tsx +++ b/src/view/com/lists/ListMembers.tsx @@ -1,3 +1,8 @@ +import {AppBskyActorDefs, AppBskyGraphDefs} from '@atproto/api' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useAnalytics} from 'lib/analytics/analytics' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' import React from 'react' import { ActivityIndicator, @@ -6,22 +11,19 @@ import { View, ViewStyle, } from 'react-native' -import {AppBskyActorDefs, AppBskyGraphDefs} from '@atproto/api' -import {List, ListRef} from '../util/List' -import {ProfileCardFeedLoadingPlaceholder} from '../util/LoadingPlaceholder' -import {ErrorMessage} from '../util/error/ErrorMessage' -import {LoadMoreRetryBtn} from '../util/LoadMoreRetryBtn' -import {ProfileCard} from '../profile/ProfileCard' -import {Button} from '../util/forms/Button' -import {useAnalytics} from 'lib/analytics/analytics' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {useListMembersQuery} from '#/state/queries/list-members' + +import {cleanError} from '#/lib/strings/errors' import {logger} from '#/logger' import {useModalControls} from '#/state/modals' +import {useListMembersQuery} from '#/state/queries/list-members' import {useSession} from '#/state/session' -import {cleanError} from '#/lib/strings/errors' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' + +import {ProfileCard} from '../profile/ProfileCard' +import {ErrorMessage} from '../util/error/ErrorMessage' +import {Button} from '../util/forms/Button' +import {List, ListRef} from '../util/List' +import {ProfileCardFeedLoadingPlaceholder} from '../util/LoadingPlaceholder' +import {LoadMoreRetryBtn} from '../util/LoadMoreRetryBtn' const LOADING_ITEM = {_reactKey: '__loading__'} const EMPTY_ITEM = {_reactKey: '__empty__'} diff --git a/src/view/com/lists/MyLists.tsx b/src/view/com/lists/MyLists.tsx index e9d2e4f0f..8d746ca34 100644 --- a/src/view/com/lists/MyLists.tsx +++ b/src/view/com/lists/MyLists.tsx @@ -1,3 +1,8 @@ +import {AppBskyGraphDefs as GraphDefs} from '@atproto/api' +import {Trans} from '@lingui/macro' +import {useAnalytics} from 'lib/analytics/analytics' +import {usePalette} from 'lib/hooks/usePalette' +import {s} from 'lib/styles' import React from 'react' import { ActivityIndicator, @@ -8,18 +13,15 @@ import { View, ViewStyle, } from 'react-native' -import {AppBskyGraphDefs as GraphDefs} from '@atproto/api' -import {ListCard} from './ListCard' + +import {cleanError} from '#/lib/strings/errors' +import {logger} from '#/logger' import {MyListsFilter, useMyListsQuery} from '#/state/queries/my-lists' + import {ErrorMessage} from '../util/error/ErrorMessage' -import {Text} from '../util/text/Text' -import {useAnalytics} from 'lib/analytics/analytics' -import {usePalette} from 'lib/hooks/usePalette' import {List} from '../util/List' -import {s} from 'lib/styles' -import {logger} from '#/logger' -import {Trans} from '@lingui/macro' -import {cleanError} from '#/lib/strings/errors' +import {Text} from '../util/text/Text' +import {ListCard} from './ListCard' const LOADING = {_reactKey: '__loading__'} const EMPTY = {_reactKey: '__empty__'} diff --git a/src/view/com/lists/ProfileLists.tsx b/src/view/com/lists/ProfileLists.tsx index a47b25bed..d2344914a 100644 --- a/src/view/com/lists/ProfileLists.tsx +++ b/src/view/com/lists/ProfileLists.tsx @@ -1,21 +1,23 @@ -import React from 'react' -import {StyleProp, StyleSheet, View, ViewStyle} from 'react-native' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {useQueryClient} from '@tanstack/react-query' -import {List, ListRef} from '../util/List' -import {ListCard} from './ListCard' -import {ErrorMessage} from '../util/error/ErrorMessage' -import {LoadMoreRetryBtn} from '../util/LoadMoreRetryBtn' -import {Text} from '../util/text/Text' import {useAnalytics} from 'lib/analytics/analytics' import {usePalette} from 'lib/hooks/usePalette' -import {useProfileListsQuery, RQKEY} from '#/state/queries/profile-lists' -import {logger} from '#/logger' -import {Trans, msg} from '@lingui/macro' +import React from 'react' +import {StyleProp, StyleSheet, View, ViewStyle} from 'react-native' + import {cleanError} from '#/lib/strings/errors' import {useTheme} from '#/lib/ThemeContext' -import {FeedLoadingPlaceholder} from '#/view/com/util/LoadingPlaceholder' +import {logger} from '#/logger' import {isNative} from '#/platform/detection' -import {useLingui} from '@lingui/react' +import {RQKEY, useProfileListsQuery} from '#/state/queries/profile-lists' +import {FeedLoadingPlaceholder} from '#/view/com/util/LoadingPlaceholder' + +import {ErrorMessage} from '../util/error/ErrorMessage' +import {List, ListRef} from '../util/List' +import {LoadMoreRetryBtn} from '../util/LoadMoreRetryBtn' +import {Text} from '../util/text/Text' +import {ListCard} from './ListCard' const LOADING = {_reactKey: '__loading__'} const EMPTY = {_reactKey: '__empty__'} diff --git a/src/view/com/modals/AddAppPasswords.tsx b/src/view/com/modals/AddAppPasswords.tsx index a8913dd54..2346f6d4e 100644 --- a/src/view/com/modals/AddAppPasswords.tsx +++ b/src/view/com/modals/AddAppPasswords.tsx @@ -1,25 +1,27 @@ -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 * as Toast from '../util/Toast' +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 {logger} from '#/logger' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' import {useModalControls} from '#/state/modals' import { - useAppPasswordsQuery, useAppPasswordCreateMutation, + useAppPasswordsQuery, } 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 17ce05cda..e3e872a17 100644 --- a/src/view/com/modals/AltImage.tsx +++ b/src/view/com/modals/AltImage.tsx @@ -1,29 +1,31 @@ -import React, {useMemo, useCallback, useState} from 'react' +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 { ImageStyle, + ScrollView as RNScrollView, StyleSheet, - TouchableOpacity, - View, TextInput as RNTextInput, + TouchableOpacity, useWindowDimensions, - ScrollView as RNScrollView, + View, } 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 b0aaaf625..5756452a2 100644 --- a/src/view/com/modals/AppealLabel.tsx +++ b/src/view/com/modals/AppealLabel.tsx @@ -1,17 +1,19 @@ -import React, {useState} from 'react' -import {StyleSheet, TouchableOpacity, View} from 'react-native' 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 {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 {useModalControls} from '#/state/modals' -import {CharProgress} from '../composer/char-progress/CharProgress' import {getAgent} from '#/state/session' + +import {CharProgress} from '../composer/char-progress/CharProgress' +import {Text} from '../util/text/Text' import * as Toast from '../util/Toast' -import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries' +import {ScrollView, TextInput} from './util' export const snapPoints = ['40%'] diff --git a/src/view/com/modals/BirthDateSettings.tsx b/src/view/com/modals/BirthDateSettings.tsx index 1cab95989..dc8b914a5 100644 --- a/src/view/com/modals/BirthDateSettings.tsx +++ b/src/view/com/modals/BirthDateSettings.tsx @@ -1,3 +1,10 @@ +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, @@ -5,23 +12,18 @@ import { TouchableOpacity, View, } from 'react-native' -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 {logger} from '#/logger' import {useModalControls} from '#/state/modals' import { usePreferencesQuery, - usePreferencesSetBirthDateMutation, UsePreferencesQueryResponse, + usePreferencesSetBirthDateMutation, } from '#/state/queries/preferences' -import {logger} from '#/logger' + +import {ErrorMessage} from '../util/error/ErrorMessage' +import {DateInput} from '../util/forms/DateInput' +import {Text} from '../util/text/Text' export const snapPoints = ['50%', '90%'] diff --git a/src/view/com/modals/ChangeEmail.tsx b/src/view/com/modals/ChangeEmail.tsx index c5672bc81..23d0b6f0d 100644 --- a/src/view/com/modals/ChangeEmail.tsx +++ b/src/view/com/modals/ChangeEmail.tsx @@ -1,19 +1,21 @@ -import React, {useState} from 'react' -import {ActivityIndicator, SafeAreaView, StyleSheet, View} from 'react-native' -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 {s, colors} from 'lib/styles' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' 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 {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 {useSession, useSessionApi, getAgent} from '#/state/session' +import {getAgent, useSession, useSessionApi} from '#/state/session' + +import {ErrorMessage} from '../util/error/ErrorMessage' +import {Button} from '../util/forms/Button' +import {Text} from '../util/text/Text' +import * as Toast from '../util/Toast' +import {ScrollView, TextInput} from './util' enum Stages { InputEmail, diff --git a/src/view/com/modals/ChangeHandle.tsx b/src/view/com/modals/ChangeHandle.tsx index a43c30c29..1521b2d5c 100644 --- a/src/view/com/modals/ChangeHandle.tsx +++ b/src/view/com/modals/ChangeHandle.tsx @@ -1,38 +1,40 @@ -import React, {useState} from 'react' -import Clipboard from '@react-native-clipboard/clipboard' import {ComAtprotoServerDescribeServer} from '@atproto/api' -import * as Toast from '../util/Toast' +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 { 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 d8add9794..ba60e5d88 100644 --- a/src/view/com/modals/ChangePassword.tsx +++ b/src/view/com/modals/ChangePassword.tsx @@ -1,3 +1,13 @@ +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, @@ -6,24 +16,16 @@ 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 307897fb8..470d3cf61 100644 --- a/src/view/com/modals/Confirm.tsx +++ b/src/view/com/modals/Confirm.tsx @@ -1,3 +1,9 @@ +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, @@ -5,17 +11,13 @@ 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 328d23dc2..ed0b6dcf8 100644 --- a/src/view/com/modals/ContentFilteringSettings.tsx +++ b/src/view/com/modals/ContentFilteringSettings.tsx @@ -1,30 +1,32 @@ -import React from 'react' import {LabelPreference} from '@atproto/api' -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 {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {usePalette} from 'lib/hooks/usePalette' -import {isIOS} from 'platform/detection' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import * as Toast from '../util/Toast' +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 {logger} from '#/logger' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' import {useModalControls} from '#/state/modals' import { - usePreferencesQuery, - usePreferencesSetContentLabelMutation, - usePreferencesSetAdultContentMutation, - ConfigurableLabelGroup, CONFIGURABLE_LABEL_GROUPS, + ConfigurableLabelGroup, + usePreferencesQuery, UsePreferencesQueryResponse, + usePreferencesSetAdultContentMutation, + usePreferencesSetContentLabelMutation, } 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 0e11fcffd..3c7618e1e 100644 --- a/src/view/com/modals/CreateOrEditList.tsx +++ b/src/view/com/modals/CreateOrEditList.tsx @@ -1,4 +1,19 @@ -import React, {useState, useCallback, useMemo} from 'react' +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 { ActivityIndicator, KeyboardAvoidingView, @@ -8,36 +23,23 @@ import { TouchableOpacity, View, } from 'react-native' -import { - AppBskyGraphDefs, - AppBskyRichtextFacet, - RichText as RichTextAPI, -} from '@atproto/api' -import LinearGradient from 'react-native-linear-gradient' 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 LinearGradient from 'react-native-linear-gradient' + +import {richTextToString} from '#/lib/strings/rich-text-helpers' +import {shortenLinks} from '#/lib/strings/rich-text-manip' 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 40d78cfe0..f0d2af8d2 100644 --- a/src/view/com/modals/DeleteAccount.tsx +++ b/src/view/com/modals/DeleteAccount.tsx @@ -1,27 +1,29 @@ +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 { - SafeAreaView, ActivityIndicator, + SafeAreaView, StyleSheet, TouchableOpacity, View, } from 'react-native' -import {TextInput, ScrollView} from './util' import LinearGradient from 'react-native-linear-gradient' -import * as Toast from '../util/Toast' -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' +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' export const snapPoints = isAndroid ? ['90%'] : ['55%'] diff --git a/src/view/com/modals/EditImage.tsx b/src/view/com/modals/EditImage.tsx index 3b35ffee2..0b77a506a 100644 --- a/src/view/com/modals/EditImage.tsx +++ b/src/view/com/modals/EditImage.tsx @@ -1,27 +1,29 @@ -import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react' -import {Pressable, StyleSheet, View} from 'react-native' +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 {useWindowDimensions} from 'react-native' +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 {Text} from '../util/text/Text' -import LinearGradient from 'react-native-linear-gradient' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +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 {TextInput} from './util' -import {enforceLen} from 'lib/strings/helpers' -import {MAX_ALT_TEXT} from 'lib/constants' +import {Pressable, StyleSheet, View} from 'react-native' +import {useWindowDimensions} from 'react-native' +import LinearGradient from 'react-native-linear-gradient' 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 097b7b0d1..7e11e6bbc 100644 --- a/src/view/com/modals/EditProfile.tsx +++ b/src/view/com/modals/EditProfile.tsx @@ -1,5 +1,16 @@ -import React, {useState, useCallback} from 'react' -import * as Toast from '../util/Toast' +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 { ActivityIndicator, KeyboardAvoidingView, @@ -9,28 +20,19 @@ import { TouchableOpacity, View, } from 'react-native' -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 LinearGradient from 'react-native-linear-gradient' import Animated, {FadeOut} from 'react-native-reanimated' -import {isWeb} from 'platform/detection' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' + +import {logger} from '#/logger' import {useModalControls} from '#/state/modals' import {useProfileUpdateMutation} from '#/state/queries/profile' -import {logger} from '#/logger' + +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' const AnimatedTouchableOpacity = Animated.createAnimatedComponent(TouchableOpacity) diff --git a/src/view/com/modals/EmbedConsent.tsx b/src/view/com/modals/EmbedConsent.tsx index 04104c52e..9eaaf082a 100644 --- a/src/view/com/modals/EmbedConsent.tsx +++ b/src/view/com/modals/EmbedConsent.tsx @@ -1,20 +1,22 @@ +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 {s, colors, gradients} from 'lib/styles' -import {Text} from '../util/text/Text' -import {ScrollView} from './util' -import {usePalette} from 'lib/hooks/usePalette' + +import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries' 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 {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries' + +import {Text} from '../util/text/Text' +import {ScrollView} from './util' export const snapPoints = [450] diff --git a/src/view/com/modals/InAppBrowserConsent.tsx b/src/view/com/modals/InAppBrowserConsent.tsx index 86bb46ca8..cc1903757 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 c0318df01..80155e228 100644 --- a/src/view/com/modals/InviteCodes.tsx +++ b/src/view/com/modals/InviteCodes.tsx @@ -1,36 +1,38 @@ -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 {useModalControls} from '#/state/modals' -import {useInvitesState, useInvitesAPI} from '#/state/invites' -import {UserInfoText} from '../util/UserInfoText' +import {isWeb} from 'platform/detection' +import React from 'react' +import { + ActivityIndicator, + StyleSheet, + TouchableOpacity, + View, +} from 'react-native' + import {makeProfileLink} from '#/lib/routes/links' -import {Link} from '../util/Link' -import {ErrorMessage} from '../util/error/ErrorMessage' +import {useInvitesAPI, useInvitesState} from '#/state/invites' +import {useModalControls} from '#/state/modals' import { - useInviteCodesQuery, InviteCodesQueryResponse, + useInviteCodesQuery, } from '#/state/queries/invites' -import {useLingui} from '@lingui/react' + +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' export const snapPoints = ['70%'] diff --git a/src/view/com/modals/LinkWarning.tsx b/src/view/com/modals/LinkWarning.tsx index 81fdc7285..1d0f1bda6 100644 --- a/src/view/com/modals/LinkWarning.tsx +++ b/src/view/com/modals/LinkWarning.tsx @@ -1,19 +1,21 @@ -import React from 'react' -import {SafeAreaView, StyleSheet, View} from 'react-native' -import {ScrollView} from './util' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import {Text} from '../util/text/Text' -import {Button} from '../util/forms/Button' -import {s, colors} from 'lib/styles' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' 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 {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' +import {colors, s} from 'lib/styles' +import {isWeb} from 'platform/detection' +import React from 'react' +import {SafeAreaView, StyleSheet, View} from 'react-native' + 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 27c33f806..eae746d2b 100644 --- a/src/view/com/modals/ListAddRemoveUsers.tsx +++ b/src/view/com/modals/ListAddRemoveUsers.tsx @@ -1,3 +1,15 @@ +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, @@ -6,33 +18,23 @@ 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 {useActorAutocompleteQuery} from '#/state/queries/actor-autocomplete' + +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' export const snapPoints = ['90%'] diff --git a/src/view/com/modals/Modal.tsx b/src/view/com/modals/Modal.tsx index 100444ff5..fb0ea471d 100644 --- a/src/view/com/modals/Modal.tsx +++ b/src/view/com/modals/Modal.tsx @@ -1,39 +1,40 @@ -import React, {useRef, useEffect} from 'react' -import {StyleSheet} from 'react-native' -import {SafeAreaView} from 'react-native-safe-area-context' import BottomSheet from '@gorhom/bottom-sheet' -import {createCustomBackdrop} from '../util/BottomSheetCustomBackdrop' import {usePalette} from 'lib/hooks/usePalette' +import React, {useEffect, useRef} from 'react' +import {StyleSheet} from 'react-native' +import {SafeAreaView} from 'react-native-safe-area-context' -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 {useModalControls, useModals} from '#/state/modals' + +import {createCustomBackdrop} from '../util/BottomSheetCustomBackdrop' +import * as AddAppPassword from './AddAppPasswords' import * as AltImageModal from './AltImage' import * as EditImageModal from './AltImage' -import * as ReportModal from './report/Modal' import * as AppealLabelModal from './AppealLabel' -import * as DeleteAccountModal from './DeleteAccount' +import * as BirthDateSettingsModal from './BirthDateSettings' +import * as ChangeEmailModal from './ChangeEmail' import * as ChangeHandleModal from './ChangeHandle' -import * as InviteCodesModal from './InviteCodes' -import * as AddAppPassword from './AddAppPasswords' +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 InviteCodesModal from './InviteCodes' 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 BirthDateSettingsModal from './BirthDateSettings' -import * as VerifyEmailModal from './VerifyEmail' -import * as ChangeEmailModal from './ChangeEmail' -import * as ChangePasswordModal from './ChangePassword' +import * as ReportModal from './report/Modal' +import * as RepostModal from './Repost' +import * as SelfLabelModal from './SelfLabel' import * as SwitchAccountModal from './SwitchAccount' -import * as LinkWarningModal from './LinkWarning' -import * as EmbedConsentModal from './EmbedConsent' -import * as InAppBrowserConsentModal from './InAppBrowserConsent' +import * as ThreadgateModal from './Threadgate' +import * as UserAddRemoveListsModal from './UserAddRemoveLists' +import * as VerifyEmailModal from './VerifyEmail' 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 0ced894a1..295942dd6 100644 --- a/src/view/com/modals/Modal.web.tsx +++ b/src/view/com/modals/Modal.web.tsx @@ -1,39 +1,40 @@ -import React from 'react' -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 React from 'react' +import {StyleSheet, TouchableWithoutFeedback, View} from 'react-native' +import Animated, {FadeIn, FadeOut} from 'react-native-reanimated' -import {useModals, useModalControls} from '#/state/modals' +import {useWebBodyScrollLock} from '#/lib/hooks/useWebBodyScrollLock' import type {Modal as ModalIface} from '#/state/modals' -import * as ConfirmModal from './Confirm' -import * as EditProfileModal from './EditProfile' -import * as ReportModal from './report/Modal' +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 * as ConfirmModal from './Confirm' +import * as ContentFilteringSettingsModal from './ContentFilteringSettings' import * as CreateOrEditListModal from './CreateOrEditList' -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 DeleteAccountModal from './DeleteAccount' import * as EditImageModal from './EditImage' -import * as ChangeHandleModal from './ChangeHandle' +import * as EditProfileModal from './EditProfile' +import * as EmbedConsentModal from './EmbedConsent' 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 BirthDateSettingsModal from './BirthDateSettings' +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 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 f890d50dc..77b7628e6 100644 --- a/src/view/com/modals/ModerationDetails.tsx +++ b/src/view/com/modals/ModerationDetails.tsx @@ -1,17 +1,19 @@ -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 {listUriToHref} from 'lib/strings/url-helpers' -import {Button} from '../util/forms/Button' +import React from 'react' +import {StyleSheet, View} from 'react-native' + import {useModalControls} from '#/state/modals' -import {useLingui} from '@lingui/react' -import {Trans, msg} from '@lingui/macro' + +import {Button} from '../util/forms/Button' +import {TextLink} from '../util/Link' +import {Text} from '../util/text/Text' export const snapPoints = [300] diff --git a/src/view/com/modals/Repost.tsx b/src/view/com/modals/Repost.tsx index 6e4881adc..a052979dd 100644 --- a/src/view/com/modals/Repost.tsx +++ b/src/view/com/modals/Repost.tsx @@ -1,15 +1,17 @@ +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 {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' +import {Text} from '../util/text/Text' + export const snapPoints = [250] export function Component({ diff --git a/src/view/com/modals/SelfLabel.tsx b/src/view/com/modals/SelfLabel.tsx index 779a9e71b..a79a90d37 100644 --- a/src/view/com/modals/SelfLabel.tsx +++ b/src/view/com/modals/SelfLabel.tsx @@ -1,17 +1,19 @@ -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 {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {usePalette} from 'lib/hooks/usePalette' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {colors, s} from 'lib/styles' import {isWeb} from 'platform/detection' -import {Button} from '../util/forms/Button' -import {SelectableBtn} from '../util/forms/SelectableBtn' +import React, {useState} from 'react' +import {StyleSheet, TouchableOpacity, View} from 'react-native' import {ScrollView} from 'view/com/modals/util' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' + import {useModalControls} from '#/state/modals' +import {Button} from '../util/forms/Button' +import {SelectableBtn} from '../util/forms/SelectableBtn' +import {Text} from '../util/text/Text' + const ADULT_CONTENT_LABELS = ['sexual', 'nudity', 'porn'] export const snapPoints = ['50%'] diff --git a/src/view/com/modals/SwitchAccount.tsx b/src/view/com/modals/SwitchAccount.tsx index c034c4b52..220aba43f 100644 --- a/src/view/com/modals/SwitchAccount.tsx +++ b/src/view/com/modals/SwitchAccount.tsx @@ -1,3 +1,12 @@ +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, @@ -5,23 +14,16 @@ import { TouchableOpacity, View, } from 'react-native' -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 {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 {UserAvatar} from '../util/UserAvatar' + export const snapPoints = ['40%', '90%'] function SwitchAccountCard({account}: {account: SessionAccount}) { diff --git a/src/view/com/modals/Threadgate.tsx b/src/view/com/modals/Threadgate.tsx index 0e49fc2f3..b7661c428 100644 --- a/src/view/com/modals/Threadgate.tsx +++ b/src/view/com/modals/Threadgate.tsx @@ -1,3 +1,10 @@ +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, @@ -7,18 +14,13 @@ 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 {ThreadgateSetting} from '#/state/queries/threadgate' import {useMyListsQuery} from '#/state/queries/my-lists' -import isEqual from 'lodash.isequal' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {ThreadgateSetting} from '#/state/queries/threadgate' + +import {Text} from '../util/text/Text' export const snapPoints = ['60%'] diff --git a/src/view/com/modals/UserAddRemoveLists.tsx b/src/view/com/modals/UserAddRemoveLists.tsx index 8452f2513..ff5dfea1d 100644 --- a/src/view/com/modals/UserAddRemoveLists.tsx +++ b/src/view/com/modals/UserAddRemoveLists.tsx @@ -1,3 +1,11 @@ +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, @@ -5,30 +13,24 @@ import { useWindowDimensions, View, } from 'react-native' -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 {cleanError} from '#/lib/strings/errors' 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 30a57afc5..8c8c64ad9 100644 --- a/src/view/com/modals/VerifyEmail.tsx +++ b/src/view/com/modals/VerifyEmail.tsx @@ -1,3 +1,11 @@ +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, @@ -6,23 +14,17 @@ import { StyleSheet, View, } from 'react-native' -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 {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 {Text} from '../util/text/Text' 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 {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' +import {ScrollView, TextInput} from './util' 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 6f094a1fd..9c42d9532 100644 --- a/src/view/com/modals/crop-image/CropImage.web.tsx +++ b/src/view/com/modals/crop-image/CropImage.web.tsx @@ -1,17 +1,18 @@ -import React from 'react' -import {StyleSheet, TouchableOpacity, View} from 'react-native' -import ImageEditor from 'react-avatar-editor' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {Slider} from '@miblanchard/react-native-slider' -import LinearGradient from 'react-native-linear-gradient' -import {Text} from 'view/com/util/text/Text' +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 {s, gradients} from 'lib/styles' -import {usePalette} from 'lib/hooks/usePalette' -import {SquareIcon, RectWideIcon, RectTallIcon} from 'lib/icons' +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 {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' +import LinearGradient from 'react-native-linear-gradient' +import {Text} from 'view/com/util/text/Text' + 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 91e11a19c..ce462d072 100644 --- a/src/view/com/modals/lang-settings/ConfirmLanguagesButton.tsx +++ b/src/view/com/modals/lang-settings/ConfirmLanguagesButton.tsx @@ -1,11 +1,11 @@ -import React from 'react' -import {StyleSheet, Text, View, Pressable} from 'react-native' -import LinearGradient from 'react-native-linear-gradient' -import {s, colors, gradients} from 'lib/styles' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {usePalette} from 'lib/hooks/usePalette' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' +import {colors, gradients, s} from 'lib/styles' +import React from 'react' +import {Pressable, StyleSheet, Text, View} from 'react-native' +import LinearGradient from 'react-native-linear-gradient' 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 b8c125b65..52863b2a8 100644 --- a/src/view/com/modals/lang-settings/ContentLanguagesSettings.tsx +++ b/src/view/com/modals/lang-settings/ContentLanguagesSettings.tsx @@ -1,20 +1,22 @@ -import React from 'react' -import {StyleSheet, View} from 'react-native' -import {ScrollView} from '../util' -import {Text} from '../../util/text/Text' +import {Trans} from '@lingui/macro' import {usePalette} from 'lib/hooks/usePalette' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' import {deviceLocales} from 'platform/detection' -import {LANGUAGES, LANGUAGES_MAP_CODE2} from '../../../../locale/languages' -import {LanguageToggle} from './LanguageToggle' -import {ConfirmLanguagesButton} from './ConfirmLanguagesButton' -import {Trans} from '@lingui/macro' +import React from 'react' +import {StyleSheet, View} from 'react-native' + 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 45b100f20..3d6513701 100644 --- a/src/view/com/modals/lang-settings/LanguageToggle.tsx +++ b/src/view/com/modals/lang-settings/LanguageToggle.tsx @@ -1,8 +1,9 @@ +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 {useLanguagePrefs, toPostLanguages} from '#/state/preferences/languages' + +import {toPostLanguages, useLanguagePrefs} 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 05cfb8115..49a209759 100644 --- a/src/view/com/modals/lang-settings/PostLanguagesSettings.tsx +++ b/src/view/com/modals/lang-settings/PostLanguagesSettings.tsx @@ -1,21 +1,23 @@ -import React from 'react' -import {StyleSheet, View} from 'react-native' -import {ScrollView} from '../util' -import {Text} from '../../util/text/Text' +import {Trans} from '@lingui/macro' import {usePalette} from 'lib/hooks/usePalette' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' import {deviceLocales} from 'platform/detection' -import {LANGUAGES, LANGUAGES_MAP_CODE2} from '../../../../locale/languages' -import {ConfirmLanguagesButton} from './ConfirmLanguagesButton' +import React from 'react' +import {StyleSheet, View} from 'react-native' 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 2bc86f75e..e353da56f 100644 --- a/src/view/com/modals/report/InputIssueDetails.tsx +++ b/src/view/com/modals/report/InputIssueDetails.tsx @@ -1,15 +1,16 @@ -import React from 'react' -import {View, TouchableOpacity, StyleSheet} from 'react-native' -import {TextInput} from '../util' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import {CharProgress} from '../../composer/char-progress/CharProgress' -import {Text} from '../../util/text/Text' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' 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 abbad9b40..3540b8b02 100644 --- a/src/view/com/modals/report/Modal.tsx +++ b/src/view/com/modals/report/Modal.tsx @@ -1,22 +1,24 @@ -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 23b49b664..3ed7bb79d 100644 --- a/src/view/com/modals/report/ReasonOptions.tsx +++ b/src/view/com/modals/report/ReasonOptions.tsx @@ -1,10 +1,10 @@ -import {View} from 'react-native' -import React, {useMemo} from 'react' 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 {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 40c239bff..eeda20b84 100644 --- a/src/view/com/modals/report/SendReportButton.tsx +++ b/src/view/com/modals/report/SendReportButton.tsx @@ -1,15 +1,16 @@ +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, diff --git a/src/view/com/notifications/Feed.tsx b/src/view/com/notifications/Feed.tsx index dd439d475..bfce18436 100644 --- a/src/view/com/notifications/Feed.tsx +++ b/src/view/com/notifications/Feed.tsx @@ -1,21 +1,23 @@ +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {s} from 'lib/styles' import React from 'react' -import {CenteredView} from '../util/Views' import {ActivityIndicator, StyleSheet, View} from 'react-native' -import {FeedItem} from './FeedItem' -import {NotificationFeedLoadingPlaceholder} from '../util/LoadingPlaceholder' -import {ErrorMessage} from '../util/error/ErrorMessage' -import {LoadMoreRetryBtn} from '../util/LoadMoreRetryBtn' -import {EmptyState} from '../util/EmptyState' -import {s} from 'lib/styles' + +import {usePalette} from '#/lib/hooks/usePalette' +import {cleanError} from '#/lib/strings/errors' +import {logger} from '#/logger' import {useNotificationFeedQuery} from '#/state/queries/notifications/feed' import {useUnreadNotificationsApi} from '#/state/queries/notifications/unread' -import {logger} from '#/logger' -import {cleanError} from '#/lib/strings/errors' import {useModerationOpts} from '#/state/queries/preferences' + +import {EmptyState} from '../util/EmptyState' +import {ErrorMessage} from '../util/error/ErrorMessage' import {List, ListRef} from '../util/List' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' -import {usePalette} from '#/lib/hooks/usePalette' +import {NotificationFeedLoadingPlaceholder} from '../util/LoadingPlaceholder' +import {LoadMoreRetryBtn} from '../util/LoadMoreRetryBtn' +import {CenteredView} from '../util/Views' +import {FeedItem} from './FeedItem' const EMPTY_FEED_ITEM = {_reactKey: '__empty__'} const LOAD_MORE_ERROR_ITEM = {_reactKey: '__load_more_error__'} diff --git a/src/view/com/notifications/FeedItem.tsx b/src/view/com/notifications/FeedItem.tsx index 45166fe3c..e5b3466b5 100644 --- a/src/view/com/notifications/FeedItem.tsx +++ b/src/view/com/notifications/FeedItem.tsx @@ -1,19 +1,11 @@ -import React, {memo, useMemo, useState, useEffect} from 'react' -import { - Animated, - TouchableOpacity, - Pressable, - StyleSheet, - View, -} from 'react-native' import { AppBskyEmbedImages, + AppBskyEmbedRecordWithMedia, AppBskyFeedDefs, AppBskyFeedPost, + moderateProfile, ModerationOpts, ProfileModeration, - moderateProfile, - AppBskyEmbedRecordWithMedia, } from '@atproto/api' import {AtUri} from '@atproto/api' import { @@ -21,28 +13,38 @@ import { FontAwesomeIconStyle, Props, } from '@fortawesome/react-native-fontawesome' -import {FeedNotification} from '#/state/queries/notifications/feed' -import {s, colors} from 'lib/styles' -import {niceDate} from 'lib/strings/time' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useAnimatedValue} from 'lib/hooks/useAnimatedValue' +import {usePalette} from 'lib/hooks/usePalette' +import {HeartIconSolid} from 'lib/icons' +import {makeProfileLink} from 'lib/routes/links' import {sanitizeDisplayName} from 'lib/strings/display-names' import {sanitizeHandle} from 'lib/strings/handles' import {pluralize} from 'lib/strings/helpers' -import {HeartIconSolid} from 'lib/icons' -import {Text} from '../util/text/Text' -import {UserAvatar, PreviewableUserAvatar} from '../util/UserAvatar' -import {UserPreviewLink} from '../util/UserPreviewLink' -import {ImageHorzList} from '../util/images/ImageHorzList' +import {niceDate} from 'lib/strings/time' +import {colors, s} from 'lib/styles' +import {isWeb} from 'platform/detection' +import React, {memo, useEffect, useMemo, useState} from 'react' +import { + Animated, + Pressable, + StyleSheet, + TouchableOpacity, + View, +} from 'react-native' + +import {FeedNotification} from '#/state/queries/notifications/feed' + +import {FeedSourceCard} from '../feeds/FeedSourceCard' import {Post} from '../post/Post' +import {ImageHorzList} from '../util/images/ImageHorzList' import {Link, TextLink} from '../util/Link' -import {usePalette} from 'lib/hooks/usePalette' -import {useAnimatedValue} from 'lib/hooks/useAnimatedValue' import {formatCount} from '../util/numeric/format' -import {makeProfileLink} from 'lib/routes/links' +import {Text} from '../util/text/Text' import {TimeElapsed} from '../util/TimeElapsed' -import {isWeb} from 'platform/detection' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {FeedSourceCard} from '../feeds/FeedSourceCard' +import {PreviewableUserAvatar, UserAvatar} from '../util/UserAvatar' +import {UserPreviewLink} from '../util/UserPreviewLink' const MAX_AUTHORS = 5 diff --git a/src/view/com/pager/Pager.tsx b/src/view/com/pager/Pager.tsx index 06ec2e450..e17e25099 100644 --- a/src/view/com/pager/Pager.tsx +++ b/src/view/com/pager/Pager.tsx @@ -1,11 +1,11 @@ +import {s} from 'lib/styles' import React, {forwardRef} from 'react' import {Animated, View} from 'react-native' import PagerView, { - PagerViewOnPageSelectedEvent, PagerViewOnPageScrollEvent, + PagerViewOnPageSelectedEvent, PageScrollStateChangedNativeEvent, } from 'react-native-pager-view' -import {s} from 'lib/styles' export type PageSelectedEvent = PagerViewOnPageSelectedEvent const AnimatedPagerView = Animated.createAnimatedComponent(PagerView) diff --git a/src/view/com/pager/Pager.web.tsx b/src/view/com/pager/Pager.web.tsx index 42982ef7f..2bad14491 100644 --- a/src/view/com/pager/Pager.web.tsx +++ b/src/view/com/pager/Pager.web.tsx @@ -1,7 +1,7 @@ +import {s} from 'lib/styles' import React from 'react' import {flushSync} from 'react-dom' import {View} from 'react-native' -import {s} from 'lib/styles' export interface RenderTabBarFnProps { selectedPage: number diff --git a/src/view/com/pager/PagerWithHeader.tsx b/src/view/com/pager/PagerWithHeader.tsx index aa110682a..5317a7773 100644 --- a/src/view/com/pager/PagerWithHeader.tsx +++ b/src/view/com/pager/PagerWithHeader.tsx @@ -1,27 +1,29 @@ import * as React from 'react' import { LayoutChangeEvent, + NativeScrollEvent, ScrollView, StyleSheet, View, - NativeScrollEvent, } from 'react-native' import Animated, { - useAnimatedStyle, - useSharedValue, + AnimatedRef, runOnJS, runOnUI, scrollTo, - useAnimatedRef, - AnimatedRef, SharedValue, + useAnimatedRef, + useAnimatedStyle, + useSharedValue, } from 'react-native-reanimated' import {Pager, PagerRef, RenderTabBarFnProps} from 'view/com/pager/Pager' -import {TabBar} from './TabBar' + import {useNonReactiveCallback} from '#/lib/hooks/useNonReactiveCallback' -import {ListMethods} from '../util/List' import {ScrollProvider} from '#/lib/ScrollContext' +import {ListMethods} from '../util/List' +import {TabBar} from './TabBar' + export interface PagerWithHeaderChildParams { headerHeight: number isFocused: boolean diff --git a/src/view/com/pager/PagerWithHeader.web.tsx b/src/view/com/pager/PagerWithHeader.web.tsx index 9c63c149f..4c95aa878 100644 --- a/src/view/com/pager/PagerWithHeader.web.tsx +++ b/src/view/com/pager/PagerWithHeader.web.tsx @@ -2,10 +2,12 @@ import * as React from 'react' import {FlatList, ScrollView, StyleSheet, View} from 'react-native' import {useAnimatedRef} from 'react-native-reanimated' import {Pager, PagerRef, RenderTabBarFnProps} from 'view/com/pager/Pager' -import {TabBar} from './TabBar' + import {usePalette} from '#/lib/hooks/usePalette' import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries' + import {ListMethods} from '../util/List' +import {TabBar} from './TabBar' export interface PagerWithHeaderChildParams { headerHeight: number diff --git a/src/view/com/pager/TabBar.tsx b/src/view/com/pager/TabBar.tsx index ff8acd60c..db05237c5 100644 --- a/src/view/com/pager/TabBar.tsx +++ b/src/view/com/pager/TabBar.tsx @@ -1,12 +1,14 @@ -import React, {useRef, useMemo, useEffect, useState, useCallback} from 'react' -import {StyleSheet, View, ScrollView, LayoutChangeEvent} from 'react-native' -import {Text} from '../util/text/Text' -import {PressableWithHover} from '../util/PressableWithHover' import {usePalette} from 'lib/hooks/usePalette' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {DraggableScrollView} from './DraggableScrollView' +import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react' +import {LayoutChangeEvent, ScrollView, StyleSheet, View} from 'react-native' + import {isNative} from '#/platform/detection' +import {PressableWithHover} from '../util/PressableWithHover' +import {Text} from '../util/text/Text' +import {DraggableScrollView} from './DraggableScrollView' + export interface TabBarProps { testID?: string selectedPage: number diff --git a/src/view/com/post-thread/PostLikedBy.tsx b/src/view/com/post-thread/PostLikedBy.tsx index 55463dc13..67ed3b3f5 100644 --- a/src/view/com/post-thread/PostLikedBy.tsx +++ b/src/view/com/post-thread/PostLikedBy.tsx @@ -1,15 +1,17 @@ +import {AppBskyFeedGetLikes as GetLikes} from '@atproto/api' import React, {useCallback, useMemo, useState} from 'react' import {ActivityIndicator, StyleSheet, View} from 'react-native' -import {AppBskyFeedGetLikes as GetLikes} from '@atproto/api' -import {CenteredView} from '../util/Views' -import {List} from '../util/List' -import {ErrorMessage} from '../util/error/ErrorMessage' -import {ProfileCardWithFollowBtn} from '../profile/ProfileCard' + +import {cleanError} from '#/lib/strings/errors' import {logger} from '#/logger' -import {LoadingScreen} from '../util/LoadingScreen' -import {useResolveUriQuery} from '#/state/queries/resolve-uri' import {usePostLikedByQuery} from '#/state/queries/post-liked-by' -import {cleanError} from '#/lib/strings/errors' +import {useResolveUriQuery} from '#/state/queries/resolve-uri' + +import {ProfileCardWithFollowBtn} from '../profile/ProfileCard' +import {ErrorMessage} from '../util/error/ErrorMessage' +import {List} from '../util/List' +import {LoadingScreen} from '../util/LoadingScreen' +import {CenteredView} from '../util/Views' export function PostLikedBy({uri}: {uri: string}) { const [isPTRing, setIsPTRing] = useState(false) diff --git a/src/view/com/post-thread/PostRepostedBy.tsx b/src/view/com/post-thread/PostRepostedBy.tsx index 31a0be832..82c969235 100644 --- a/src/view/com/post-thread/PostRepostedBy.tsx +++ b/src/view/com/post-thread/PostRepostedBy.tsx @@ -1,15 +1,17 @@ -import React, {useMemo, useCallback, useState} from 'react' -import {ActivityIndicator, StyleSheet, View} from 'react-native' import {AppBskyActorDefs as ActorDefs} from '@atproto/api' -import {CenteredView} from '../util/Views' -import {List} from '../util/List' +import React, {useCallback, useMemo, useState} from 'react' +import {ActivityIndicator, StyleSheet, View} from 'react-native' + +import {cleanError} from '#/lib/strings/errors' +import {logger} from '#/logger' +import {usePostRepostedByQuery} from '#/state/queries/post-reposted-by' +import {useResolveUriQuery} from '#/state/queries/resolve-uri' + import {ProfileCardWithFollowBtn} from '../profile/ProfileCard' import {ErrorMessage} from '../util/error/ErrorMessage' -import {logger} from '#/logger' +import {List} from '../util/List' import {LoadingScreen} from '../util/LoadingScreen' -import {useResolveUriQuery} from '#/state/queries/resolve-uri' -import {usePostRepostedByQuery} from '#/state/queries/post-reposted-by' -import {cleanError} from '#/lib/strings/errors' +import {CenteredView} from '../util/Views' export function PostRepostedBy({uri}: {uri: string}) { const [isPTRing, setIsPTRing] = useState(false) diff --git a/src/view/com/post-thread/PostThread.tsx b/src/view/com/post-thread/PostThread.tsx index a7ee42a94..f022bdeac 100644 --- a/src/view/com/post-thread/PostThread.tsx +++ b/src/view/com/post-thread/PostThread.tsx @@ -1,3 +1,17 @@ +import {AppBskyFeedDefs} from '@atproto/api' +import { + FontAwesomeIcon, + FontAwesomeIconStyle, +} from '@fortawesome/react-native-fontawesome' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useNavigation} from '@react-navigation/native' +import {usePalette} from 'lib/hooks/usePalette' +import {useSetTitle} from 'lib/hooks/useSetTitle' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {NavigationProp} from 'lib/routes/types' +import {sanitizeDisplayName} from 'lib/strings/display-names' +import {s} from 'lib/styles' import React, {useEffect, useRef} from 'react' import { ActivityIndicator, @@ -6,45 +20,33 @@ import { TouchableOpacity, View, } from 'react-native' -import {AppBskyFeedDefs} from '@atproto/api' -import {CenteredView} from '../util/Views' -import {LoadingScreen} from '../util/LoadingScreen' -import {List, ListMethods} from '../util/List' -import { - FontAwesomeIcon, - FontAwesomeIconStyle, -} from '@fortawesome/react-native-fontawesome' -import {PostThreadItem} from './PostThreadItem' -import {ComposePrompt} from '../composer/Prompt' -import {ViewHeader} from '../util/ViewHeader' -import {ErrorMessage} from '../util/error/ErrorMessage' -import {Text} from '../util/text/Text' -import {s} from 'lib/styles' -import {usePalette} from 'lib/hooks/usePalette' -import {useSetTitle} from 'lib/hooks/useSetTitle' + +import {moderatePost_wrapped as moderatePost} from '#/lib/moderatePost_wrapped' +import {cleanError} from '#/lib/strings/errors' +import {isAndroid, isNative, isWeb} from '#/platform/detection' import { + sortThread, + ThreadBlocked, ThreadNode, - ThreadPost, ThreadNotFound, - ThreadBlocked, + ThreadPost, usePostThreadQuery, - sortThread, } from '#/state/queries/post-thread' -import {useNavigation} from '@react-navigation/native' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {NavigationProp} from 'lib/routes/types' -import {sanitizeDisplayName} from 'lib/strings/display-names' -import {cleanError} from '#/lib/strings/errors' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' import { - UsePreferencesQueryResponse, useModerationOpts, usePreferencesQuery, + UsePreferencesQueryResponse, } from '#/state/queries/preferences' import {useSession} from '#/state/session' -import {isAndroid, isNative, isWeb} from '#/platform/detection' -import {moderatePost_wrapped as moderatePost} from '#/lib/moderatePost_wrapped' + +import {ComposePrompt} from '../composer/Prompt' +import {ErrorMessage} from '../util/error/ErrorMessage' +import {List, ListMethods} from '../util/List' +import {LoadingScreen} from '../util/LoadingScreen' +import {Text} from '../util/text/Text' +import {ViewHeader} from '../util/ViewHeader' +import {CenteredView} from '../util/Views' +import {PostThreadItem} from './PostThreadItem' // FlatList maintainVisibleContentPosition breaks if too many items // are prepended. This seems to be an optimal number based on *shrug*. diff --git a/src/view/com/post-thread/PostThreadFollowBtn.tsx b/src/view/com/post-thread/PostThreadFollowBtn.tsx index e5b747cc9..63e2888fd 100644 --- a/src/view/com/post-thread/PostThreadFollowBtn.tsx +++ b/src/view/com/post-thread/PostThreadFollowBtn.tsx @@ -1,24 +1,24 @@ -import React from 'react' -import {StyleSheet, TouchableOpacity, View} from 'react-native' -import {useNavigation} from '@react-navigation/native' import {AppBskyActorDefs} from '@atproto/api' +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' import {msg, Trans} from '@lingui/macro' import {useLingui} from '@lingui/react' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' - -import {logger} from '#/logger' -import {Text} from 'view/com/util/text/Text' -import * as Toast from 'view/com/util/Toast' -import {s} from 'lib/styles' +import {useNavigation} from '@react-navigation/native' +import {track} from 'lib/analytics/analytics' 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 {Shadow, useProfileShadow} from 'state/cache/profile-shadow' -import {track} from 'lib/analytics/analytics' import { useProfileFollowMutationQueue, useProfileQuery, } from 'state/queries/profile' import {useRequireAuth} from 'state/session' +import {Text} from 'view/com/util/text/Text' +import * as Toast from 'view/com/util/Toast' + +import {logger} from '#/logger' export function PostThreadFollowBtn({did}: {did: string}) { const {data: profile, isLoading} = useProfileQuery({did}) diff --git a/src/view/com/post-thread/PostThreadItem.tsx b/src/view/com/post-thread/PostThreadItem.tsx index 9522ea6a0..54c47adae 100644 --- a/src/view/com/post-thread/PostThreadItem.tsx +++ b/src/view/com/post-thread/PostThreadItem.tsx @@ -1,50 +1,52 @@ -import React, {memo, useMemo} from 'react' -import {StyleSheet, View} from 'react-native' import { - AtUri, AppBskyFeedDefs, AppBskyFeedPost, - RichText as RichTextAPI, + AtUri, PostModeration, + RichText as RichTextAPI, } from '@atproto/api' -import {moderatePost_wrapped as moderatePost} from '#/lib/moderatePost_wrapped' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import {PostThreadFollowBtn} from 'view/com/post-thread/PostThreadFollowBtn' -import {Link, TextLink} from '../util/Link' -import {RichText} from '#/components/RichText' -import {Text} from '../util/text/Text' -import {PreviewableUserAvatar} from '../util/UserAvatar' -import {s} from 'lib/styles' -import {niceDate} from 'lib/strings/time' -import {sanitizeDisplayName} from 'lib/strings/display-names' -import {sanitizeHandle} from 'lib/strings/handles' -import {countLines, pluralize} from 'lib/strings/helpers' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {MAX_POST_LINES} from 'lib/constants' import {isEmbedByEmbedder} from 'lib/embeds' -import {getTranslatorLink, isPostInLanguage} from '../../../locale/helpers' -import {PostMeta} from '../util/PostMeta' -import {PostEmbeds} from '../util/post-embeds' -import {PostCtrls} from '../util/post-ctrls/PostCtrls' -import {PostHider} from '../util/moderation/PostHider' -import {ContentHider} from '../util/moderation/ContentHider' -import {PostAlerts} from '../util/moderation/PostAlerts' -import {ErrorMessage} from '../util/error/ErrorMessage' import {usePalette} from 'lib/hooks/usePalette' -import {formatCount} from '../util/numeric/format' -import {makeProfileLink} from 'lib/routes/links' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {MAX_POST_LINES} from 'lib/constants' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' +import {makeProfileLink} from 'lib/routes/links' +import {sanitizeDisplayName} from 'lib/strings/display-names' +import {sanitizeHandle} from 'lib/strings/handles' +import {countLines, pluralize} from 'lib/strings/helpers' +import {niceDate} from 'lib/strings/time' +import {s} from 'lib/styles' +import React, {memo, useMemo} from 'react' +import {StyleSheet, View} from 'react-native' +import {useSession} from 'state/session' +import {PostThreadFollowBtn} from 'view/com/post-thread/PostThreadFollowBtn' + +import {atoms as a} from '#/alf' +import {RichText} from '#/components/RichText' +import {moderatePost_wrapped as moderatePost} from '#/lib/moderatePost_wrapped' +import {POST_TOMBSTONE, Shadow, usePostShadow} from '#/state/cache/post-shadow' import {useLanguagePrefs} from '#/state/preferences' -import {useComposerControls} from '#/state/shell/composer' -import {useModerationOpts} from '#/state/queries/preferences' import {useOpenLink} from '#/state/preferences/in-app-browser' -import {Shadow, usePostShadow, POST_TOMBSTONE} from '#/state/cache/post-shadow' import {ThreadPost} from '#/state/queries/post-thread' -import {useSession} from 'state/session' +import {useModerationOpts} from '#/state/queries/preferences' +import {useComposerControls} from '#/state/shell/composer' + +import {getTranslatorLink, isPostInLanguage} from '../../../locale/helpers' import {WhoCanReply} from '../threadgate/WhoCanReply' +import {ErrorMessage} from '../util/error/ErrorMessage' +import {Link, TextLink} from '../util/Link' import {LoadingPlaceholder} from '../util/LoadingPlaceholder' -import {atoms as a} from '#/alf' +import {ContentHider} from '../util/moderation/ContentHider' +import {PostAlerts} from '../util/moderation/PostAlerts' +import {PostHider} from '../util/moderation/PostHider' +import {formatCount} from '../util/numeric/format' +import {PostCtrls} from '../util/post-ctrls/PostCtrls' +import {PostEmbeds} from '../util/post-embeds' +import {PostMeta} from '../util/PostMeta' +import {Text} from '../util/text/Text' +import {PreviewableUserAvatar} from '../util/UserAvatar' export function PostThreadItem({ post, diff --git a/src/view/com/post/Post.tsx b/src/view/com/post/Post.tsx index 5fa4da84e..d7f6bb2cb 100644 --- a/src/view/com/post/Post.tsx +++ b/src/view/com/post/Post.tsx @@ -1,5 +1,3 @@ -import React, {useState, useMemo} from 'react' -import {StyleProp, StyleSheet, View, ViewStyle} from 'react-native' import { AppBskyFeedDefs, AppBskyFeedPost, @@ -7,29 +5,33 @@ import { PostModeration, RichText as RichTextAPI, } from '@atproto/api' -import {moderatePost_wrapped as moderatePost} from '#/lib/moderatePost_wrapped' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import {Link, TextLink} from '../util/Link' -import {UserInfoText} from '../util/UserInfoText' -import {PostMeta} from '../util/PostMeta' -import {PostEmbeds} from '../util/post-embeds' -import {PostCtrls} from '../util/post-ctrls/PostCtrls' -import {ContentHider} from '../util/moderation/ContentHider' -import {PostAlerts} from '../util/moderation/PostAlerts' -import {Text} from '../util/text/Text' -import {RichText} from '#/components/RichText' -import {PreviewableUserAvatar} from '../util/UserAvatar' -import {s, colors} from 'lib/styles' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {MAX_POST_LINES} from 'lib/constants' import {usePalette} from 'lib/hooks/usePalette' import {makeProfileLink} from 'lib/routes/links' -import {MAX_POST_LINES} from 'lib/constants' import {countLines} from 'lib/strings/helpers' +import {colors, s} from 'lib/styles' +import React, {useMemo, useState} from 'react' +import {StyleProp, StyleSheet, View, ViewStyle} from 'react-native' + +import {atoms as a} from '#/alf' +import {RichText} from '#/components/RichText' +import {moderatePost_wrapped as moderatePost} from '#/lib/moderatePost_wrapped' +import {POST_TOMBSTONE, Shadow, usePostShadow} from '#/state/cache/post-shadow' import {useModerationOpts} from '#/state/queries/preferences' import {useComposerControls} from '#/state/shell/composer' -import {Shadow, usePostShadow, POST_TOMBSTONE} from '#/state/cache/post-shadow' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {atoms as a} from '#/alf' + +import {Link, TextLink} from '../util/Link' +import {ContentHider} from '../util/moderation/ContentHider' +import {PostAlerts} from '../util/moderation/PostAlerts' +import {PostCtrls} from '../util/post-ctrls/PostCtrls' +import {PostEmbeds} from '../util/post-embeds' +import {PostMeta} from '../util/PostMeta' +import {Text} from '../util/text/Text' +import {PreviewableUserAvatar} from '../util/UserAvatar' +import {UserInfoText} from '../util/UserInfoText' export function Post({ post, diff --git a/src/view/com/posts/CustomFeedEmptyState.tsx b/src/view/com/posts/CustomFeedEmptyState.tsx index 62a10fd19..473968fca 100644 --- a/src/view/com/posts/CustomFeedEmptyState.tsx +++ b/src/view/com/posts/CustomFeedEmptyState.tsx @@ -1,18 +1,19 @@ -import React from 'react' -import {StyleSheet, View} from 'react-native' -import {useNavigation} from '@react-navigation/native' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' -import {Text} from '../util/text/Text' -import {Button} from '../util/forms/Button' +import {Trans} from '@lingui/macro' +import {useNavigation} from '@react-navigation/native' +import {usePalette} from 'lib/hooks/usePalette' import {MagnifyingGlassIcon} from 'lib/icons' import {NavigationProp} from 'lib/routes/types' -import {usePalette} from 'lib/hooks/usePalette' import {s} from 'lib/styles' import {isWeb} from 'platform/detection' -import {Trans} from '@lingui/macro' +import React from 'react' +import {StyleSheet, View} from 'react-native' + +import {Button} from '../util/forms/Button' +import {Text} from '../util/text/Text' export function CustomFeedEmptyState() { const pal = usePalette('default') diff --git a/src/view/com/posts/DiscoverFallbackHeader.tsx b/src/view/com/posts/DiscoverFallbackHeader.tsx index ffde89997..cb6dcc021 100644 --- a/src/view/com/posts/DiscoverFallbackHeader.tsx +++ b/src/view/com/posts/DiscoverFallbackHeader.tsx @@ -1,11 +1,13 @@ +import {Trans} from '@lingui/macro' import React from 'react' import {View} from 'react-native' -import {Trans} from '@lingui/macro' -import {Text} from '../util/text/Text' + import {usePalette} from '#/lib/hooks/usePalette' -import {TextLink} from '../util/Link' import {InfoCircleIcon} from '#/lib/icons' +import {TextLink} from '../util/Link' +import {Text} from '../util/text/Text' + export function DiscoverFallbackHeader() { const pal = usePalette('default') return ( diff --git a/src/view/com/posts/Feed.tsx b/src/view/com/posts/Feed.tsx index cd3e98785..65f5437cb 100644 --- a/src/view/com/posts/Feed.tsx +++ b/src/view/com/posts/Feed.tsx @@ -1,3 +1,9 @@ +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useQueryClient} from '@tanstack/react-query' +import {useAnalytics} from 'lib/analytics/analytics' +import {useInitialNumToRender} from 'lib/hooks/useInitialNumToRender' +import {useTheme} from 'lib/ThemeContext' import React, {memo} from 'react' import { ActivityIndicator, @@ -8,31 +14,27 @@ import { View, ViewStyle, } from 'react-native' -import {useQueryClient} from '@tanstack/react-query' -import {List, ListRef} from '../util/List' -import {PostFeedLoadingPlaceholder} from '../util/LoadingPlaceholder' -import {FeedErrorMessage} from './FeedErrorMessage' -import {FeedSlice} from './FeedSlice' -import {LoadMoreRetryBtn} from '../util/LoadMoreRetryBtn' -import {useAnalytics} from 'lib/analytics/analytics' -import {useTheme} from 'lib/ThemeContext' + +import {FALLBACK_MARKER_POST} from '#/lib/api/feed/home' import {logger} from '#/logger' +import {isWeb} from '#/platform/detection' +import {listenPostCreated} from '#/state/events' +import {STALE} from '#/state/queries' import { - RQKEY, FeedDescriptor, FeedParams, - usePostFeedQuery, pollLatest, + RQKEY, + usePostFeedQuery, } from '#/state/queries/post-feed' -import {isWeb} from '#/platform/detection' -import {listenPostCreated} from '#/state/events' import {useSession} from '#/state/session' -import {STALE} from '#/state/queries' -import {msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' + +import {List, ListRef} from '../util/List' +import {PostFeedLoadingPlaceholder} from '../util/LoadingPlaceholder' +import {LoadMoreRetryBtn} from '../util/LoadMoreRetryBtn' import {DiscoverFallbackHeader} from './DiscoverFallbackHeader' -import {FALLBACK_MARKER_POST} from '#/lib/api/feed/home' -import {useInitialNumToRender} from 'lib/hooks/useInitialNumToRender' +import {FeedErrorMessage} from './FeedErrorMessage' +import {FeedSlice} from './FeedSlice' const LOADING_ITEM = {_reactKey: '__loading__'} const EMPTY_FEED_ITEM = {_reactKey: '__empty__'} diff --git a/src/view/com/posts/FeedErrorMessage.tsx b/src/view/com/posts/FeedErrorMessage.tsx index 6d99c32f1..54381081d 100644 --- a/src/view/com/posts/FeedErrorMessage.tsx +++ b/src/view/com/posts/FeedErrorMessage.tsx @@ -1,22 +1,24 @@ -import React from 'react' -import {View} from 'react-native' import {AppBskyFeedGetAuthorFeed, AtUri} from '@atproto/api' -import {Text} from '../util/text/Text' -import {Button} from '../util/forms/Button' -import * as Toast from '../util/Toast' -import {ErrorMessage} from '../util/error/ErrorMessage' -import {usePalette} from 'lib/hooks/usePalette' +import {msg as msgLingui, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {useNavigation} from '@react-navigation/native' +import {usePalette} from 'lib/hooks/usePalette' import {NavigationProp} from 'lib/routes/types' +import React from 'react' +import {View} from 'react-native' + +import {cleanError} from '#/lib/strings/errors' import {logger} from '#/logger' import {useModalControls} from '#/state/modals' -import {msg as msgLingui, Trans} from '@lingui/macro' -import {useLingui} from '@lingui/react' import {FeedDescriptor} from '#/state/queries/post-feed' -import {EmptyState} from '../util/EmptyState' -import {cleanError} from '#/lib/strings/errors' import {useRemoveFeedMutation} from '#/state/queries/preferences' +import {EmptyState} from '../util/EmptyState' +import {ErrorMessage} from '../util/error/ErrorMessage' +import {Button} from '../util/forms/Button' +import {Text} from '../util/text/Text' +import * as Toast from '../util/Toast' + export enum KnownError { Block = 'Block', FeedgenDoesNotExist = 'FeedgenDoesNotExist', diff --git a/src/view/com/posts/FeedItem.tsx b/src/view/com/posts/FeedItem.tsx index 7d29703e2..078465961 100644 --- a/src/view/com/posts/FeedItem.tsx +++ b/src/view/com/posts/FeedItem.tsx @@ -1,5 +1,3 @@ -import React, {memo, useMemo, useState} from 'react' -import {StyleSheet, View} from 'react-native' import { AppBskyFeedDefs, AppBskyFeedPost, @@ -11,32 +9,36 @@ import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' -import {ReasonFeedSource, isReasonFeedSource} from 'lib/api/feed/types' -import {Link, TextLinkOnWebOnly, TextLink} from '../util/Link' -import {Text} from '../util/text/Text' -import {UserInfoText} from '../util/UserInfoText' -import {PostMeta} from '../util/PostMeta' -import {PostCtrls} from '../util/post-ctrls/PostCtrls' -import {PostEmbeds} from '../util/post-embeds' -import {ContentHider} from '../util/moderation/ContentHider' -import {PostAlerts} from '../util/moderation/PostAlerts' -import {RichText} from '#/components/RichText' -import {PreviewableUserAvatar} from '../util/UserAvatar' -import {s} from 'lib/styles' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {isReasonFeedSource, ReasonFeedSource} from 'lib/api/feed/types' +import {MAX_POST_LINES} from 'lib/constants' +import {isEmbedByEmbedder} from 'lib/embeds' import {usePalette} from 'lib/hooks/usePalette' +import {makeProfileLink} from 'lib/routes/links' import {sanitizeDisplayName} from 'lib/strings/display-names' import {sanitizeHandle} from 'lib/strings/handles' -import {makeProfileLink} from 'lib/routes/links' -import {isEmbedByEmbedder} from 'lib/embeds' -import {MAX_POST_LINES} from 'lib/constants' import {countLines} from 'lib/strings/helpers' +import {s} from 'lib/styles' +import React, {memo, useMemo, useState} from 'react' +import {StyleSheet, View} from 'react-native' + +import {atoms as a} from '#/alf' +import {RichText} from '#/components/RichText' +import {POST_TOMBSTONE, Shadow, usePostShadow} from '#/state/cache/post-shadow' +import {useSession} from '#/state/session' import {useComposerControls} from '#/state/shell/composer' -import {Shadow, usePostShadow, POST_TOMBSTONE} from '#/state/cache/post-shadow' + import {FeedNameText} from '../util/FeedInfoText' -import {useSession} from '#/state/session' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {atoms as a} from '#/alf' +import {Link, TextLink, TextLinkOnWebOnly} from '../util/Link' +import {ContentHider} from '../util/moderation/ContentHider' +import {PostAlerts} from '../util/moderation/PostAlerts' +import {PostCtrls} from '../util/post-ctrls/PostCtrls' +import {PostEmbeds} from '../util/post-embeds' +import {PostMeta} from '../util/PostMeta' +import {Text} from '../util/text/Text' +import {PreviewableUserAvatar} from '../util/UserAvatar' +import {UserInfoText} from '../util/UserInfoText' export function FeedItem({ post, diff --git a/src/view/com/posts/FeedSlice.tsx b/src/view/com/posts/FeedSlice.tsx index 84edee4a1..b4a6b37e6 100644 --- a/src/view/com/posts/FeedSlice.tsx +++ b/src/view/com/posts/FeedSlice.tsx @@ -1,14 +1,16 @@ +import {AtUri} from '@atproto/api' +import {Trans} from '@lingui/macro' +import {usePalette} from 'lib/hooks/usePalette' +import {makeProfileLink} from 'lib/routes/links' import React, {memo} from 'react' import {StyleSheet, View} from 'react-native' +import Svg, {Circle, Line} from 'react-native-svg' + import {FeedPostSlice} from '#/state/queries/post-feed' -import {AtUri} from '@atproto/api' + import {Link} from '../util/Link' import {Text} from '../util/text/Text' -import Svg, {Circle, Line} from 'react-native-svg' import {FeedItem} from './FeedItem' -import {usePalette} from 'lib/hooks/usePalette' -import {makeProfileLink} from 'lib/routes/links' -import {Trans} from '@lingui/macro' let FeedSlice = ({slice}: {slice: FeedPostSlice}): React.ReactNode => { if (slice.isThread && slice.items.length > 3) { diff --git a/src/view/com/posts/FollowingEmptyState.tsx b/src/view/com/posts/FollowingEmptyState.tsx index ef02039af..e2991435e 100644 --- a/src/view/com/posts/FollowingEmptyState.tsx +++ b/src/view/com/posts/FollowingEmptyState.tsx @@ -1,18 +1,19 @@ -import React from 'react' -import {StyleSheet, View} from 'react-native' -import {useNavigation} from '@react-navigation/native' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' -import {Text} from '../util/text/Text' -import {Button} from '../util/forms/Button' +import {Trans} from '@lingui/macro' +import {useNavigation} from '@react-navigation/native' +import {usePalette} from 'lib/hooks/usePalette' import {MagnifyingGlassIcon} from 'lib/icons' import {NavigationProp} from 'lib/routes/types' -import {usePalette} from 'lib/hooks/usePalette' import {s} from 'lib/styles' import {isWeb} from 'platform/detection' -import {Trans} from '@lingui/macro' +import React from 'react' +import {StyleSheet, View} from 'react-native' + +import {Button} from '../util/forms/Button' +import {Text} from '../util/text/Text' export function FollowingEmptyState() { const pal = usePalette('default') diff --git a/src/view/com/posts/FollowingEndOfFeed.tsx b/src/view/com/posts/FollowingEndOfFeed.tsx index bea5bedea..c91d94ce2 100644 --- a/src/view/com/posts/FollowingEndOfFeed.tsx +++ b/src/view/com/posts/FollowingEndOfFeed.tsx @@ -1,17 +1,18 @@ -import React from 'react' -import {StyleSheet, View, Dimensions} from 'react-native' -import {useNavigation} from '@react-navigation/native' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' -import {Text} from '../util/text/Text' -import {Button} from '../util/forms/Button' -import {NavigationProp} from 'lib/routes/types' +import {Trans} from '@lingui/macro' +import {useNavigation} from '@react-navigation/native' import {usePalette} from 'lib/hooks/usePalette' +import {NavigationProp} from 'lib/routes/types' import {s} from 'lib/styles' import {isWeb} from 'platform/detection' -import {Trans} from '@lingui/macro' +import React from 'react' +import {Dimensions, StyleSheet, View} from 'react-native' + +import {Button} from '../util/forms/Button' +import {Text} from '../util/text/Text' export function FollowingEndOfFeed() { const pal = usePalette('default') diff --git a/src/view/com/profile/FollowButton.tsx b/src/view/com/profile/FollowButton.tsx index 9cc635b66..d1ef10c36 100644 --- a/src/view/com/profile/FollowButton.tsx +++ b/src/view/com/profile/FollowButton.tsx @@ -1,12 +1,14 @@ +import {AppBskyActorDefs} from '@atproto/api' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' import React from 'react' import {StyleProp, TextStyle, View} from 'react-native' -import {AppBskyActorDefs} from '@atproto/api' + +import {Shadow} from '#/state/cache/types' +import {useProfileFollowMutationQueue} from '#/state/queries/profile' + import {Button, ButtonType} from '../util/forms/Button' import * as Toast from '../util/Toast' -import {useProfileFollowMutationQueue} from '#/state/queries/profile' -import {Shadow} from '#/state/cache/types' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' export function FollowButton({ unfollowedType = 'inverted', diff --git a/src/view/com/profile/ProfileCard.tsx b/src/view/com/profile/ProfileCard.tsx index 266adc51d..2830268d4 100644 --- a/src/view/com/profile/ProfileCard.tsx +++ b/src/view/com/profile/ProfileCard.tsx @@ -1,29 +1,31 @@ -import * as React from 'react' -import {StyleProp, StyleSheet, View, ViewStyle} from 'react-native' import { AppBskyActorDefs, moderateProfile, ProfileModeration, } from '@atproto/api' -import {Link} from '../util/Link' -import {Text} from '../util/text/Text' -import {UserAvatar} from '../util/UserAvatar' -import {s} from 'lib/styles' +import {Trans} from '@lingui/macro' import {usePalette} from 'lib/hooks/usePalette' -import {FollowButton} from './FollowButton' -import {sanitizeDisplayName} from 'lib/strings/display-names' -import {sanitizeHandle} from 'lib/strings/handles' -import {makeProfileLink} from 'lib/routes/links' import { describeModerationCause, - getProfileModerationCauses, getModerationCauseKey, + getProfileModerationCauses, } from 'lib/moderation' +import {makeProfileLink} from 'lib/routes/links' +import {sanitizeDisplayName} from 'lib/strings/display-names' +import {sanitizeHandle} from 'lib/strings/handles' +import {s} from 'lib/styles' +import * as React from 'react' +import {StyleProp, StyleSheet, View, ViewStyle} from 'react-native' + +import {useProfileShadow} from '#/state/cache/profile-shadow' import {Shadow} from '#/state/cache/types' import {useModerationOpts} from '#/state/queries/preferences' -import {useProfileShadow} from '#/state/cache/profile-shadow' import {useSession} from '#/state/session' -import {Trans} from '@lingui/macro' + +import {Link} from '../util/Link' +import {Text} from '../util/text/Text' +import {UserAvatar} from '../util/UserAvatar' +import {FollowButton} from './FollowButton' export function ProfileCard({ testID, diff --git a/src/view/com/profile/ProfileFollowers.tsx b/src/view/com/profile/ProfileFollowers.tsx index 411ae6c17..e48ec9659 100644 --- a/src/view/com/profile/ProfileFollowers.tsx +++ b/src/view/com/profile/ProfileFollowers.tsx @@ -1,15 +1,17 @@ +import {AppBskyActorDefs as ActorDefs} from '@atproto/api' import React from 'react' import {ActivityIndicator, StyleSheet, View} from 'react-native' -import {AppBskyActorDefs as ActorDefs} from '@atproto/api' -import {CenteredView} from '../util/Views' -import {LoadingScreen} from '../util/LoadingScreen' -import {List} from '../util/List' -import {ErrorMessage} from '../util/error/ErrorMessage' -import {ProfileCardWithFollowBtn} from './ProfileCard' + +import {cleanError} from '#/lib/strings/errors' +import {logger} from '#/logger' import {useProfileFollowersQuery} from '#/state/queries/profile-followers' import {useResolveDidQuery} from '#/state/queries/resolve-uri' -import {logger} from '#/logger' -import {cleanError} from '#/lib/strings/errors' + +import {ErrorMessage} from '../util/error/ErrorMessage' +import {List} from '../util/List' +import {LoadingScreen} from '../util/LoadingScreen' +import {CenteredView} from '../util/Views' +import {ProfileCardWithFollowBtn} from './ProfileCard' export function ProfileFollowers({name}: {name: string}) { const [isPTRing, setIsPTRing] = React.useState(false) diff --git a/src/view/com/profile/ProfileFollows.tsx b/src/view/com/profile/ProfileFollows.tsx index bd4af1081..58275cd0e 100644 --- a/src/view/com/profile/ProfileFollows.tsx +++ b/src/view/com/profile/ProfileFollows.tsx @@ -1,15 +1,17 @@ +import {AppBskyActorDefs as ActorDefs} from '@atproto/api' import React from 'react' import {ActivityIndicator, StyleSheet, View} from 'react-native' -import {AppBskyActorDefs as ActorDefs} from '@atproto/api' -import {CenteredView} from '../util/Views' -import {LoadingScreen} from '../util/LoadingScreen' -import {List} from '../util/List' -import {ErrorMessage} from '../util/error/ErrorMessage' -import {ProfileCardWithFollowBtn} from './ProfileCard' + +import {cleanError} from '#/lib/strings/errors' +import {logger} from '#/logger' import {useProfileFollowsQuery} from '#/state/queries/profile-follows' import {useResolveDidQuery} from '#/state/queries/resolve-uri' -import {logger} from '#/logger' -import {cleanError} from '#/lib/strings/errors' + +import {ErrorMessage} from '../util/error/ErrorMessage' +import {List} from '../util/List' +import {LoadingScreen} from '../util/LoadingScreen' +import {CenteredView} from '../util/Views' +import {ProfileCardWithFollowBtn} from './ProfileCard' export function ProfileFollows({name}: {name: string}) { const [isPTRing, setIsPTRing] = React.useState(false) diff --git a/src/view/com/profile/ProfileHeader.tsx b/src/view/com/profile/ProfileHeader.tsx index a11fe8374..b78c95f78 100644 --- a/src/view/com/profile/ProfileHeader.tsx +++ b/src/view/com/profile/ProfileHeader.tsx @@ -1,57 +1,59 @@ -import React, {memo, useMemo} from 'react' -import { - StyleSheet, - TouchableOpacity, - TouchableWithoutFeedback, - View, -} from 'react-native' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import {useNavigation} from '@react-navigation/native' import { AppBskyActorDefs, - ModerationOpts, moderateProfile, + ModerationOpts, RichText as RichTextAPI, } from '@atproto/api' -import {Trans, msg} from '@lingui/macro' +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {msg, Trans} from '@lingui/macro' import {useLingui} from '@lingui/react' +import {useNavigation} from '@react-navigation/native' +import {useAnalytics} from 'lib/analytics/analytics' +import {BACK_HITSLOP} from 'lib/constants' +import {usePalette} from 'lib/hooks/usePalette' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {makeProfileLink} from 'lib/routes/links' import {NavigationProp} from 'lib/routes/types' +import {sanitizeDisplayName} from 'lib/strings/display-names' +import {isInvalidHandle, sanitizeHandle} from 'lib/strings/handles' +import {pluralize} from 'lib/strings/helpers' +import {colors, s} from 'lib/styles' import {isNative} from 'platform/detection' -import {BlurView} from '../util/BlurView' -import * as Toast from '../util/Toast' -import {LoadingPlaceholder} from '../util/LoadingPlaceholder' -import {Text} from '../util/text/Text' -import {ThemedText} from '../util/text/ThemedText' +import React, {memo, useMemo} from 'react' +import { + StyleSheet, + TouchableOpacity, + TouchableWithoutFeedback, + View, +} from 'react-native' +import {useProfileShadow} from 'state/cache/profile-shadow' +import {ProfileMenu} from 'view/com/profile/ProfileMenu' + +import {atoms as a} from '#/alf' import {RichText} from '#/components/RichText' -import {UserAvatar} from '../util/UserAvatar' -import {UserBanner} from '../util/UserBanner' -import {ProfileHeaderAlerts} from '../util/moderation/ProfileHeaderAlerts' -import {formatCount} from '../util/numeric/format' -import {Link} from '../util/Link' -import {ProfileHeaderSuggestedFollows} from './ProfileHeaderSuggestedFollows' +import {logger} from '#/logger' +import {Shadow} from '#/state/cache/types' +import {ProfileImageLightbox, useLightboxControls} from '#/state/lightbox' import {useModalControls} from '#/state/modals' -import {useLightboxControls, ProfileImageLightbox} from '#/state/lightbox' import { useProfileBlockMutationQueue, useProfileFollowMutationQueue, } from '#/state/queries/profile' -import {usePalette} from 'lib/hooks/usePalette' -import {useAnalytics} from 'lib/analytics/analytics' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {BACK_HITSLOP} from 'lib/constants' -import {isInvalidHandle, sanitizeHandle} from 'lib/strings/handles' -import {makeProfileLink} from 'lib/routes/links' -import {pluralize} from 'lib/strings/helpers' -import {sanitizeDisplayName} from 'lib/strings/display-names' -import {s, colors} from 'lib/styles' -import {logger} from '#/logger' import {useSession} from '#/state/session' -import {Shadow} from '#/state/cache/types' import {useRequireAuth} from '#/state/session' + +import {BlurView} from '../util/BlurView' +import {Link} from '../util/Link' +import {LoadingPlaceholder} from '../util/LoadingPlaceholder' import {LabelInfo} from '../util/moderation/LabelInfo' -import {useProfileShadow} from 'state/cache/profile-shadow' -import {atoms as a} from '#/alf' -import {ProfileMenu} from 'view/com/profile/ProfileMenu' +import {ProfileHeaderAlerts} from '../util/moderation/ProfileHeaderAlerts' +import {formatCount} from '../util/numeric/format' +import {Text} from '../util/text/Text' +import {ThemedText} from '../util/text/ThemedText' +import * as Toast from '../util/Toast' +import {UserAvatar} from '../util/UserAvatar' +import {UserBanner} from '../util/UserBanner' +import {ProfileHeaderSuggestedFollows} from './ProfileHeaderSuggestedFollows' let ProfileHeaderLoading = (_props: {}): React.ReactNode => { const pal = usePalette('default') diff --git a/src/view/com/profile/ProfileHeaderSuggestedFollows.tsx b/src/view/com/profile/ProfileHeaderSuggestedFollows.tsx index 6edc61fcf..bc440a68a 100644 --- a/src/view/com/profile/ProfileHeaderSuggestedFollows.tsx +++ b/src/view/com/profile/ProfileHeaderSuggestedFollows.tsx @@ -1,27 +1,28 @@ -import React from 'react' -import {View, StyleSheet, Pressable, ScrollView} from 'react-native' import {AppBskyActorDefs, moderateProfile} from '@atproto/api' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' - -import * as Toast from '../util/Toast' +import {Trans} from '@lingui/macro' +import {useAnalytics} from 'lib/analytics/analytics' import {usePalette} from 'lib/hooks/usePalette' -import {Text} from 'view/com/util/text/Text' -import {UserAvatar} from 'view/com/util/UserAvatar' -import {Button} from 'view/com/util/forms/Button' +import {makeProfileLink} from 'lib/routes/links' import {sanitizeDisplayName} from 'lib/strings/display-names' import {sanitizeHandle} from 'lib/strings/handles' -import {makeProfileLink} from 'lib/routes/links' -import {Link} from 'view/com/util/Link' -import {useAnalytics} from 'lib/analytics/analytics' import {isWeb} from 'platform/detection' -import {useModerationOpts} from '#/state/queries/preferences' -import {useSuggestedFollowsByActorQuery} from '#/state/queries/suggested-follows' +import React from 'react' +import {Pressable, ScrollView, StyleSheet, View} from 'react-native' +import {Button} from 'view/com/util/forms/Button' +import {Link} from 'view/com/util/Link' +import {Text} from 'view/com/util/text/Text' +import {UserAvatar} from 'view/com/util/UserAvatar' + import {useProfileShadow} from '#/state/cache/profile-shadow' +import {useModerationOpts} from '#/state/queries/preferences' import {useProfileFollowMutationQueue} from '#/state/queries/profile' -import {Trans} from '@lingui/macro' +import {useSuggestedFollowsByActorQuery} from '#/state/queries/suggested-follows' + +import * as Toast from '../util/Toast' const OUTER_PADDING = 10 const INNER_PADDING = 14 diff --git a/src/view/com/profile/ProfileMenu.tsx b/src/view/com/profile/ProfileMenu.tsx index d79e1891d..c427ac9f7 100644 --- a/src/view/com/profile/ProfileMenu.tsx +++ b/src/view/com/profile/ProfileMenu.tsx @@ -1,21 +1,17 @@ -import React, {memo} from 'react' -import {TouchableOpacity} from 'react-native' import {AppBskyActorDefs} from '@atproto/api' +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' import {msg, Trans} from '@lingui/macro' import {useLingui} from '@lingui/react' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' import {useQueryClient} from '@tanstack/react-query' -import * as Toast from 'view/com/util/Toast' -import {EventStopper} from 'view/com/util/EventStopper' -import {useSession} from 'state/session' -import * as Menu from '#/components/Menu' -import {useTheme} from '#/alf' -import {usePalette} from 'lib/hooks/usePalette' +import {useAnalytics} from 'lib/analytics/analytics' import {HITSLOP_10} from 'lib/constants' +import {usePalette} from 'lib/hooks/usePalette' +import {makeProfileLink} from 'lib/routes/links' import {shareUrl} from 'lib/sharing' import {toShareUrl} from 'lib/strings/url-helpers' -import {makeProfileLink} from 'lib/routes/links' -import {useAnalytics} from 'lib/analytics/analytics' +import React, {memo} from 'react' +import {TouchableOpacity} from 'react-native' +import {Shadow} from 'state/cache/types' import {useModalControls} from 'state/modals' import { RQKEY as profileQueryKey, @@ -23,16 +19,21 @@ import { useProfileFollowMutationQueue, useProfileMuteMutationQueue, } from 'state/queries/profile' +import {useSession} from 'state/session' +import {EventStopper} from 'view/com/util/EventStopper' +import * as Toast from 'view/com/util/Toast' + +import {useTheme} from '#/alf' import {ArrowOutOfBox_Stroke2_Corner0_Rounded as Share} from '#/components/icons/ArrowOutOfBox' +import {Flag_Stroke2_Corner0_Rounded as Flag} from '#/components/icons/Flag' import {ListSparkle_Stroke2_Corner0_Rounded as List} from '#/components/icons/ListSparkle' import {Mute_Stroke2_Corner0_Rounded as Mute} from '#/components/icons/Mute' -import {SpeakerVolumeFull_Stroke2_Corner0_Rounded as Unmute} from '#/components/icons/Speaker' -import {Flag_Stroke2_Corner0_Rounded as Flag} from '#/components/icons/Flag' +import {PeopleRemove2_Stroke2_Corner0_Rounded as UserMinus} from '#/components/icons/PeopleRemove2' import {PersonCheck_Stroke2_Corner0_Rounded as PersonCheck} from '#/components/icons/PersonCheck' import {PersonX_Stroke2_Corner0_Rounded as PersonX} from '#/components/icons/PersonX' -import {PeopleRemove2_Stroke2_Corner0_Rounded as UserMinus} from '#/components/icons/PeopleRemove2' +import {SpeakerVolumeFull_Stroke2_Corner0_Rounded as Unmute} from '#/components/icons/Speaker' +import * as Menu from '#/components/Menu' import {logger} from '#/logger' -import {Shadow} from 'state/cache/types' let ProfileMenu = ({ profile, diff --git a/src/view/com/profile/ProfileSubpageHeader.tsx b/src/view/com/profile/ProfileSubpageHeader.tsx index eaf00f3e6..f2934fa1c 100644 --- a/src/view/com/profile/ProfileSubpageHeader.tsx +++ b/src/view/com/profile/ProfileSubpageHeader.tsx @@ -1,24 +1,26 @@ -import React from 'react' -import {Pressable, StyleSheet, View} from 'react-native' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {useNavigation} from '@react-navigation/native' +import {BACK_HITSLOP} from 'lib/constants' import {usePalette} from 'lib/hooks/usePalette' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {Text} from '../util/text/Text' -import {TextLink} from '../util/Link' -import {UserAvatar, UserAvatarType} from '../util/UserAvatar' -import {LoadingPlaceholder} from '../util/LoadingPlaceholder' -import {CenteredView} from '../util/Views' -import {sanitizeHandle} from 'lib/strings/handles' import {makeProfileLink} from 'lib/routes/links' import {NavigationProp} from 'lib/routes/types' -import {BACK_HITSLOP} from 'lib/constants' +import {sanitizeHandle} from 'lib/strings/handles' import {isNative} from 'platform/detection' -import {useLightboxControls, ImagesLightbox} from '#/state/lightbox' -import {useLingui} from '@lingui/react' -import {Trans, msg} from '@lingui/macro' -import {useSetDrawerOpen} from '#/state/shell' +import React from 'react' +import {Pressable, StyleSheet, View} from 'react-native' + import {emitSoftReset} from '#/state/events' +import {ImagesLightbox, useLightboxControls} from '#/state/lightbox' +import {useSetDrawerOpen} from '#/state/shell' + +import {TextLink} from '../util/Link' +import {LoadingPlaceholder} from '../util/LoadingPlaceholder' +import {Text} from '../util/text/Text' +import {UserAvatar, UserAvatarType} from '../util/UserAvatar' +import {CenteredView} from '../util/Views' export function ProfileSubpageHeader({ isLoading, diff --git a/src/view/com/testing/TestCtrls.e2e.tsx b/src/view/com/testing/TestCtrls.e2e.tsx index e1e899488..77a114b54 100644 --- a/src/view/com/testing/TestCtrls.e2e.tsx +++ b/src/view/com/testing/TestCtrls.e2e.tsx @@ -1,12 +1,14 @@ +import {useQueryClient} from '@tanstack/react-query' import React from 'react' import {Pressable, View} from 'react-native' -import {navigate} from '../../../Navigation' + import {useModalControls} from '#/state/modals' -import {useQueryClient} from '@tanstack/react-query' -import {useSessionApi} from '#/state/session' import {useSetFeedViewPreferencesMutation} from '#/state/queries/preferences' +import {useSessionApi} from '#/state/session' import {useLoggedOutViewControls} from '#/state/shell/logged-out' +import {navigate} from '../../../Navigation' + /** * This utility component is only included in the test simulator * build. It gives some quick triggers which help improve the pace diff --git a/src/view/com/threadgate/WhoCanReply.tsx b/src/view/com/threadgate/WhoCanReply.tsx index 1c34623d8..bd17a0de3 100644 --- a/src/view/com/threadgate/WhoCanReply.tsx +++ b/src/view/com/threadgate/WhoCanReply.tsx @@ -1,22 +1,23 @@ -import React from 'react' -import {StyleProp, View, ViewStyle} from 'react-native' import { AppBskyFeedDefs, AppBskyFeedThreadgate, AppBskyGraphDefs, AtUri, } from '@atproto/api' -import {Trans} from '@lingui/macro' -import {usePalette} from '#/lib/hooks/usePalette' -import {Text} from '../util/text/Text' -import {TextLink} from '../util/Link' -import {makeProfileLink, makeListLink} from '#/lib/routes/links' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {Trans} from '@lingui/macro' +import React from 'react' +import {StyleProp, View, ViewStyle} from 'react-native' + import {useColorSchemeStyle} from '#/lib/hooks/useColorSchemeStyle' +import {usePalette} from '#/lib/hooks/usePalette' import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries' - +import {makeListLink, makeProfileLink} from '#/lib/routes/links' import {colors} from '#/lib/styles' +import {TextLink} from '../util/Link' +import {Text} from '../util/text/Text' + export function WhoCanReply({ post, style, diff --git a/src/view/com/util/AccountDropdownBtn.tsx b/src/view/com/util/AccountDropdownBtn.tsx index 221879df7..24f64af45 100644 --- a/src/view/com/util/AccountDropdownBtn.tsx +++ b/src/view/com/util/AccountDropdownBtn.tsx @@ -1,16 +1,18 @@ -import React from 'react' -import {Pressable} from 'react-native' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' -import {s} from 'lib/styles' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {usePalette} from 'lib/hooks/usePalette' -import {DropdownItem, NativeDropdown} from './forms/NativeDropdown' +import {s} from 'lib/styles' +import React from 'react' +import {Pressable} from 'react-native' + +import {SessionAccount, useSessionApi} from '#/state/session' + import * as Toast from '../../com/util/Toast' -import {useSessionApi, SessionAccount} from '#/state/session' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' +import {DropdownItem, NativeDropdown} from './forms/NativeDropdown' export function AccountDropdownBtn({account}: {account: SessionAccount}) { const pal = usePalette('default') diff --git a/src/view/com/util/BlurView.android.tsx b/src/view/com/util/BlurView.android.tsx index eee1d9d86..a62e1dff0 100644 --- a/src/view/com/util/BlurView.android.tsx +++ b/src/view/com/util/BlurView.android.tsx @@ -1,6 +1,6 @@ +import {addStyle} from 'lib/styles' import React from 'react' import {StyleSheet, View, ViewProps} from 'react-native' -import {addStyle} from 'lib/styles' type BlurViewProps = ViewProps & { blurType?: 'dark' | 'light' diff --git a/src/view/com/util/BlurView.web.tsx b/src/view/com/util/BlurView.web.tsx index d1fb4665f..09807816b 100644 --- a/src/view/com/util/BlurView.web.tsx +++ b/src/view/com/util/BlurView.web.tsx @@ -1,6 +1,6 @@ +import {addStyle} from 'lib/styles' import React from 'react' import {StyleSheet, View, ViewProps} from 'react-native' -import {addStyle} from 'lib/styles' type BlurViewProps = ViewProps & { blurType?: 'dark' | 'light' diff --git a/src/view/com/util/BottomSheetCustomBackdrop.tsx b/src/view/com/util/BottomSheetCustomBackdrop.tsx index ed5a2f165..7cf9c10da 100644 --- a/src/view/com/util/BottomSheetCustomBackdrop.tsx +++ b/src/view/com/util/BottomSheetCustomBackdrop.tsx @@ -1,12 +1,12 @@ +import {BottomSheetBackdropProps} from '@gorhom/bottom-sheet' +import {t} from '@lingui/macro' import React, {useMemo} from 'react' import {TouchableWithoutFeedback} from 'react-native' -import {BottomSheetBackdropProps} from '@gorhom/bottom-sheet' import Animated, { Extrapolate, interpolate, useAnimatedStyle, } from 'react-native-reanimated' -import {t} from '@lingui/macro' export function createCustomBackdrop( onClose?: (() => void) | undefined, diff --git a/src/view/com/util/EmptyState.tsx b/src/view/com/util/EmptyState.tsx index 7486b212f..cc71165b5 100644 --- a/src/view/com/util/EmptyState.tsx +++ b/src/view/com/util/EmptyState.tsx @@ -1,13 +1,14 @@ -import React from 'react' -import {StyleProp, StyleSheet, View, ViewStyle} from 'react-native' import {IconProp} from '@fortawesome/fontawesome-svg-core' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' -import {Text} from './text/Text' -import {UserGroupIcon} from 'lib/icons' import {usePalette} from 'lib/hooks/usePalette' +import {UserGroupIcon} from 'lib/icons' +import React from 'react' +import {StyleProp, StyleSheet, View, ViewStyle} from 'react-native' + +import {Text} from './text/Text' export function EmptyState({ testID, diff --git a/src/view/com/util/EmptyStateWithButton.tsx b/src/view/com/util/EmptyStateWithButton.tsx index 008ca2bdb..1a580ae9a 100644 --- a/src/view/com/util/EmptyStateWithButton.tsx +++ b/src/view/com/util/EmptyStateWithButton.tsx @@ -1,14 +1,15 @@ -import React from 'react' -import {StyleSheet, View} from 'react-native' +import {IconProp} from '@fortawesome/fontawesome-svg-core' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' -import {IconProp} from '@fortawesome/fontawesome-svg-core' -import {Text} from './text/Text' -import {Button} from './forms/Button' import {usePalette} from 'lib/hooks/usePalette' import {s} from 'lib/styles' +import React from 'react' +import {StyleSheet, View} from 'react-native' + +import {Button} from './forms/Button' +import {Text} from './text/Text' interface Props { testID?: string diff --git a/src/view/com/util/ErrorBoundary.tsx b/src/view/com/util/ErrorBoundary.tsx index 5ec1d0014..b287a2469 100644 --- a/src/view/com/util/ErrorBoundary.tsx +++ b/src/view/com/util/ErrorBoundary.tsx @@ -1,8 +1,10 @@ +import {t} from '@lingui/macro' import React, {Component, ErrorInfo, ReactNode} from 'react' + +import {logger} from '#/logger' + import {ErrorScreen} from './error/ErrorScreen' import {CenteredView} from './Views' -import {t} from '@lingui/macro' -import {logger} from '#/logger' interface Props { children?: ReactNode diff --git a/src/view/com/util/FeedInfoText.tsx b/src/view/com/util/FeedInfoText.tsx index 54124c739..3afaf256c 100644 --- a/src/view/com/util/FeedInfoText.tsx +++ b/src/view/com/util/FeedInfoText.tsx @@ -1,10 +1,12 @@ +import {sanitizeDisplayName} from 'lib/strings/display-names' +import {TypographyVariant} from 'lib/ThemeContext' import React from 'react' import {StyleProp, StyleSheet, TextStyle} from 'react-native' + +import {useFeedSourceInfoQuery} from '#/state/queries/feed' + import {TextLinkOnWebOnly} from './Link' import {LoadingPlaceholder} from './LoadingPlaceholder' -import {TypographyVariant} from 'lib/ThemeContext' -import {sanitizeDisplayName} from 'lib/strings/display-names' -import {useFeedSourceInfoQuery} from '#/state/queries/feed' export function FeedNameText({ type = 'md', diff --git a/src/view/com/util/Html.tsx b/src/view/com/util/Html.tsx index 2e4719481..b8d31dfd6 100644 --- a/src/view/com/util/Html.tsx +++ b/src/view/com/util/Html.tsx @@ -1,16 +1,17 @@ -import * as React from 'react' -import {StyleSheet, View} from 'react-native' -import {usePalette} from 'lib/hooks/usePalette' -import {useTheme} from 'lib/ThemeContext' -import {Text} from './text/Text' -import {TextLink} from './Link' import { H1 as ExpoH1, H2 as ExpoH2, H3 as ExpoH3, H4 as ExpoH4, } from '@expo/html-elements' +import {usePalette} from 'lib/hooks/usePalette' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {useTheme} from 'lib/ThemeContext' +import * as React from 'react' +import {StyleSheet, View} from 'react-native' + +import {TextLink} from './Link' +import {Text} from './text/Text' /** * These utilities are used to define long documents in an html-like diff --git a/src/view/com/util/Link.tsx b/src/view/com/util/Link.tsx index f45622488..112e061bc 100644 --- a/src/view/com/util/Link.tsx +++ b/src/view/com/util/Link.tsx @@ -1,36 +1,38 @@ +import {sanitizeUrl} from '@braintree/sanitize-url' +import {StackActions, useLinkProps} from '@react-navigation/native' +import { + DebouncedNavigationProp, + useNavigationDeduped, +} from 'lib/hooks/useNavigationDeduped' +import { + convertBskyAppUrlIfNeeded, + isExternalUrl, + linkRequiresWarning, +} from 'lib/strings/url-helpers' +import {TypographyVariant} from 'lib/ThemeContext' +import {isAndroid, isWeb} from 'platform/detection' import React, {ComponentProps, memo, useMemo} from 'react' import { GestureResponderEvent, Platform, + Pressable, StyleProp, - TextStyle, TextProps, + TextStyle, + TouchableOpacity, + TouchableWithoutFeedback, View, ViewStyle, - Pressable, - TouchableWithoutFeedback, - TouchableOpacity, } from 'react-native' -import {useLinkProps, StackActions} from '@react-navigation/native' -import {Text} from './text/Text' -import {TypographyVariant} from 'lib/ThemeContext' -import {router} from '../../../routes' -import { - convertBskyAppUrlIfNeeded, - isExternalUrl, - linkRequiresWarning, -} from 'lib/strings/url-helpers' -import {isAndroid, isWeb} from 'platform/detection' -import {sanitizeUrl} from '@braintree/sanitize-url' -import {PressableWithHover} from './PressableWithHover' -import FixedTouchableHighlight from '../pager/FixedTouchableHighlight' +import {WebAuxClickWrapper} from 'view/com/util/WebAuxClickWrapper' + import {useModalControls} from '#/state/modals' import {useOpenLink} from '#/state/preferences/in-app-browser' -import {WebAuxClickWrapper} from 'view/com/util/WebAuxClickWrapper' -import { - DebouncedNavigationProp, - useNavigationDeduped, -} from 'lib/hooks/useNavigationDeduped' + +import {router} from '../../../routes' +import FixedTouchableHighlight from '../pager/FixedTouchableHighlight' +import {PressableWithHover} from './PressableWithHover' +import {Text} from './text/Text' type Event = | React.MouseEvent<HTMLAnchorElement, MouseEvent> diff --git a/src/view/com/util/List.tsx b/src/view/com/util/List.tsx index d30a9d805..896608af1 100644 --- a/src/view/com/util/List.tsx +++ b/src/view/com/util/List.tsx @@ -1,11 +1,13 @@ +import {addStyle} from 'lib/styles' import React, {memo} from 'react' import {FlatListProps, RefreshControl} from 'react-native' -import {FlatList_INTERNAL} from './Views' -import {addStyle} from 'lib/styles' -import {useScrollHandlers} from '#/lib/ScrollContext' import {runOnJS, useSharedValue} from 'react-native-reanimated' + import {useAnimatedScrollHandler} from '#/lib/hooks/useAnimatedScrollHandler_FIXED' import {usePalette} from '#/lib/hooks/usePalette' +import {useScrollHandlers} from '#/lib/ScrollContext' + +import {FlatList_INTERNAL} from './Views' export type ListMethods = FlatList_INTERNAL export type ListProps<ItemT> = Omit< diff --git a/src/view/com/util/List.web.tsx b/src/view/com/util/List.web.tsx index 936bac198..6fb17b9f6 100644 --- a/src/view/com/util/List.web.tsx +++ b/src/view/com/util/List.web.tsx @@ -1,11 +1,12 @@ -import React, {isValidElement, memo, useRef, startTransition} from 'react' -import {FlatListProps, StyleSheet, View, ViewProps} from 'react-native' -import {addStyle} from 'lib/styles' import {usePalette} from 'lib/hooks/usePalette' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {useScrollHandlers} from '#/lib/ScrollContext' -import {useNonReactiveCallback} from '#/lib/hooks/useNonReactiveCallback' +import {addStyle} from 'lib/styles' +import React, {isValidElement, memo, startTransition, useRef} from 'react' +import {FlatListProps, StyleSheet, View, ViewProps} from 'react-native' + import {batchedUpdates} from '#/lib/batchedUpdates' +import {useNonReactiveCallback} from '#/lib/hooks/useNonReactiveCallback' +import {useScrollHandlers} from '#/lib/ScrollContext' export type ListMethods = any // TODO: Better types. export type ListProps<ItemT> = Omit< diff --git a/src/view/com/util/LoadMoreRetryBtn.tsx b/src/view/com/util/LoadMoreRetryBtn.tsx index a2e9838b3..fa8245632 100644 --- a/src/view/com/util/LoadMoreRetryBtn.tsx +++ b/src/view/com/util/LoadMoreRetryBtn.tsx @@ -1,12 +1,13 @@ -import React from 'react' -import {StyleSheet} from 'react-native' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' +import {usePalette} from 'lib/hooks/usePalette' +import React from 'react' +import {StyleSheet} from 'react-native' + import {Button} from './forms/Button' import {Text} from './text/Text' -import {usePalette} from 'lib/hooks/usePalette' export function LoadMoreRetryBtn({ label, diff --git a/src/view/com/util/LoadingPlaceholder.tsx b/src/view/com/util/LoadingPlaceholder.tsx index 6dfe12598..fb2c226e8 100644 --- a/src/view/com/util/LoadingPlaceholder.tsx +++ b/src/view/com/util/LoadingPlaceholder.tsx @@ -1,20 +1,20 @@ -import React from 'react' -import { - StyleSheet, - StyleProp, - View, - ViewStyle, - DimensionValue, -} from 'react-native' +import {usePalette} from 'lib/hooks/usePalette' import { + CommentBottomArrow, HeartIcon, HeartIconSolid, - CommentBottomArrow, RepostIcon, } from 'lib/icons' import {s} from 'lib/styles' import {useTheme} from 'lib/ThemeContext' -import {usePalette} from 'lib/hooks/usePalette' +import React from 'react' +import { + DimensionValue, + StyleProp, + StyleSheet, + View, + ViewStyle, +} from 'react-native' export function LoadingPlaceholder({ width, diff --git a/src/view/com/util/LoadingScreen.tsx b/src/view/com/util/LoadingScreen.tsx index 93c3bee42..073664931 100644 --- a/src/view/com/util/LoadingScreen.tsx +++ b/src/view/com/util/LoadingScreen.tsx @@ -1,6 +1,7 @@ +import {s} from 'lib/styles' import React from 'react' import {ActivityIndicator, View} from 'react-native' -import {s} from 'lib/styles' + import {CenteredView} from './Views' export function LoadingScreen() { diff --git a/src/view/com/util/MainScrollProvider.tsx b/src/view/com/util/MainScrollProvider.tsx index 01b8a954d..1ed0631ac 100644 --- a/src/view/com/util/MainScrollProvider.tsx +++ b/src/view/com/util/MainScrollProvider.tsx @@ -1,11 +1,12 @@ -import React, {useCallback, useEffect} from 'react' import EventEmitter from 'eventemitter3' -import {ScrollProvider} from '#/lib/ScrollContext' +import {isNative, isWeb} from 'platform/detection' +import React, {useCallback, useEffect} from 'react' import {NativeScrollEvent} from 'react-native' -import {useSetMinimalShellMode, useMinimalShellMode} from '#/state/shell' +import {interpolate, useSharedValue} from 'react-native-reanimated' + +import {ScrollProvider} from '#/lib/ScrollContext' +import {useMinimalShellMode, useSetMinimalShellMode} from '#/state/shell' import {useShellLayout} from '#/state/shell/shell-layout' -import {isNative, isWeb} from 'platform/detection' -import {useSharedValue, interpolate} from 'react-native-reanimated' const WEB_HIDE_SHELL_THRESHOLD = 200 diff --git a/src/view/com/util/PostMeta.tsx b/src/view/com/util/PostMeta.tsx index 3795dcf13..5832fc5d8 100644 --- a/src/view/com/util/PostMeta.tsx +++ b/src/view/com/util/PostMeta.tsx @@ -1,19 +1,21 @@ -import React, {memo} from 'react' -import {StyleProp, StyleSheet, TextStyle, View, ViewStyle} from 'react-native' -import {Text} from './text/Text' -import {TextLinkOnWebOnly} from './Link' -import {niceDate} from 'lib/strings/time' +import {ModerationUI} from '@atproto/api' import {usePalette} from 'lib/hooks/usePalette' -import {TypographyVariant} from 'lib/ThemeContext' -import {UserAvatar} from './UserAvatar' +import {makeProfileLink} from 'lib/routes/links' import {sanitizeDisplayName} from 'lib/strings/display-names' import {sanitizeHandle} from 'lib/strings/handles' +import {niceDate} from 'lib/strings/time' +import {TypographyVariant} from 'lib/ThemeContext' import {isAndroid, isWeb} from 'platform/detection' -import {TimeElapsed} from './TimeElapsed' -import {makeProfileLink} from 'lib/routes/links' -import {ModerationUI} from '@atproto/api' +import React, {memo} from 'react' +import {StyleProp, StyleSheet, TextStyle, View, ViewStyle} from 'react-native' + import {usePrefetchProfileQuery} from '#/state/queries/profile' +import {TextLinkOnWebOnly} from './Link' +import {Text} from './text/Text' +import {TimeElapsed} from './TimeElapsed' +import {UserAvatar} from './UserAvatar' + interface PostMetaOpts { author: { avatar?: string diff --git a/src/view/com/util/PressableWithHover.tsx b/src/view/com/util/PressableWithHover.tsx index 77276f184..83c84f836 100644 --- a/src/view/com/util/PressableWithHover.tsx +++ b/src/view/com/util/PressableWithHover.tsx @@ -1,12 +1,12 @@ +import {addStyle} from 'lib/styles' import React, { - useState, - useCallback, - PropsWithChildren, forwardRef, + PropsWithChildren, Ref, + useCallback, + useState, } from 'react' import {Pressable, PressableProps, StyleProp, ViewStyle} from 'react-native' -import {addStyle} from 'lib/styles' interface PressableWithHover extends PressableProps { hoverStyle: StyleProp<ViewStyle> diff --git a/src/view/com/util/Selector.tsx b/src/view/com/util/Selector.tsx index 66e363cd4..b607a018a 100644 --- a/src/view/com/util/Selector.tsx +++ b/src/view/com/util/Selector.tsx @@ -1,9 +1,10 @@ -import React, {createRef, useState, useMemo, useRef} from 'react' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {usePalette} from 'lib/hooks/usePalette' +import React, {createRef, useMemo, useRef, useState} from 'react' import {Animated, Pressable, StyleSheet, View} from 'react-native' + import {Text} from './text/Text' -import {usePalette} from 'lib/hooks/usePalette' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' interface Layout { x: number diff --git a/src/view/com/util/SimpleViewHeader.tsx b/src/view/com/util/SimpleViewHeader.tsx index 814b2fb15..3319f7a94 100644 --- a/src/view/com/util/SimpleViewHeader.tsx +++ b/src/view/com/util/SimpleViewHeader.tsx @@ -1,3 +1,9 @@ +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {useNavigation} from '@react-navigation/native' +import {useAnalytics} from 'lib/analytics/analytics' +import {usePalette} from 'lib/hooks/usePalette' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {NavigationProp} from 'lib/routes/types' import React from 'react' import { StyleProp, @@ -6,15 +12,11 @@ import { View, ViewStyle, } from 'react-native' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import {useNavigation} from '@react-navigation/native' -import {CenteredView} from './Views' -import {usePalette} from 'lib/hooks/usePalette' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {useAnalytics} from 'lib/analytics/analytics' -import {NavigationProp} from 'lib/routes/types' -import {useSetDrawerOpen} from '#/state/shell' + import {isWeb} from '#/platform/detection' +import {useSetDrawerOpen} from '#/state/shell' + +import {CenteredView} from './Views' const BACK_HITSLOP = {left: 20, top: 20, right: 50, bottom: 20} diff --git a/src/view/com/util/TimeElapsed.tsx b/src/view/com/util/TimeElapsed.tsx index aa3a09223..bf848193d 100644 --- a/src/view/com/util/TimeElapsed.tsx +++ b/src/view/com/util/TimeElapsed.tsx @@ -1,5 +1,6 @@ -import React from 'react' import {ago} from 'lib/strings/time' +import React from 'react' + import {useTickEveryMinute} from '#/state/shell' // FIXME(dan): Figure out why the false positives diff --git a/src/view/com/util/Toast.tsx b/src/view/com/util/Toast.tsx index 5462505e1..91187e205 100644 --- a/src/view/com/util/Toast.tsx +++ b/src/view/com/util/Toast.tsx @@ -1,14 +1,16 @@ -import RootSiblings from 'react-native-root-siblings' -import React from 'react' -import {Animated, StyleSheet, View} from 'react-native' import {Props as FontAwesomeProps} from '@fortawesome/react-native-fontawesome' -import {Text} from './text/Text' +import {useAnimatedValue} from 'lib/hooks/useAnimatedValue' +import {usePalette} from 'lib/hooks/usePalette' import {colors} from 'lib/styles' import {useTheme} from 'lib/ThemeContext' -import {usePalette} from 'lib/hooks/usePalette' -import {useAnimatedValue} from 'lib/hooks/useAnimatedValue' +import React from 'react' +import {Animated, StyleSheet, View} from 'react-native' +import RootSiblings from 'react-native-root-siblings' + import {IS_TEST} from '#/env' +import {Text} from './text/Text' + const TIMEOUT = 4e3 export function show( diff --git a/src/view/com/util/Toast.web.tsx b/src/view/com/util/Toast.web.tsx index d5a843541..da7a5df8e 100644 --- a/src/view/com/util/Toast.web.tsx +++ b/src/view/com/util/Toast.web.tsx @@ -2,13 +2,13 @@ * Note: the dataSet properties are used to leverage custom CSS in public/index.html */ -import React, {useState, useEffect} from 'react' -import {StyleSheet, Text, View} from 'react-native' import { FontAwesomeIcon, FontAwesomeIconStyle, Props as FontAwesomeProps, } from '@fortawesome/react-native-fontawesome' +import React, {useEffect, useState} from 'react' +import {StyleSheet, Text, View} from 'react-native' const DURATION = 3500 diff --git a/src/view/com/util/UserAvatar.tsx b/src/view/com/util/UserAvatar.tsx index 413237397..2aa28b725 100644 --- a/src/view/com/util/UserAvatar.tsx +++ b/src/view/com/util/UserAvatar.tsx @@ -1,30 +1,31 @@ -import React, {memo, useMemo} from 'react' -import {Image, StyleSheet, TouchableOpacity, View} from 'react-native' -import Svg, {Circle, Rect, Path} from 'react-native-svg' -import {Image as RNImage} from 'react-native-image-crop-picker' -import {useLingui} from '@lingui/react' -import {msg, Trans} from '@lingui/macro' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' import {ModerationUI} from '@atproto/api' - -import {HighPriorityImage} from 'view/com/util/images/Image' -import {openCamera, openCropper, openPicker} from '../../../lib/media/picker' +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 { - usePhotoLibraryPermission, useCameraPermission, + usePhotoLibraryPermission, } from 'lib/hooks/usePermissions' import {colors} from 'lib/styles' -import {usePalette} from 'lib/hooks/usePalette' -import {isWeb, isAndroid, isNative} from 'platform/detection' -import {UserPreviewLink} from './UserPreviewLink' -import * as Menu from '#/components/Menu' +import {isAndroid, isNative, isWeb} from 'platform/detection' +import React, {memo, useMemo} from 'react' +import {Image, StyleSheet, TouchableOpacity, View} from 'react-native' +import {Image as RNImage} from 'react-native-image-crop-picker' +import Svg, {Circle, Path, Rect} from 'react-native-svg' +import {HighPriorityImage} from 'view/com/util/images/Image' + +import {useTheme} from '#/alf' import { - Camera_Stroke2_Corner0_Rounded as Camera, Camera_Filled_Stroke2_Corner0_Rounded as CameraFilled, + Camera_Stroke2_Corner0_Rounded as Camera, } from '#/components/icons/Camera' import {StreamingLive_Stroke2_Corner0_Rounded as Library} from '#/components/icons/StreamingLive' import {Trash_Stroke2_Corner0_Rounded as Trash} from '#/components/icons/Trash' -import {useTheme} from '#/alf' +import * as Menu from '#/components/Menu' + +import {openCamera, openCropper, openPicker} from '../../../lib/media/picker' +import {UserPreviewLink} from './UserPreviewLink' export type UserAvatarType = 'user' | 'algo' | 'list' diff --git a/src/view/com/util/UserBanner.tsx b/src/view/com/util/UserBanner.tsx index a5ddfee8a..6eb0ccc12 100644 --- a/src/view/com/util/UserBanner.tsx +++ b/src/view/com/util/UserBanner.tsx @@ -1,29 +1,30 @@ -import React from 'react' -import {StyleSheet, TouchableOpacity, View} from 'react-native' import {ModerationUI} from '@atproto/api' -import {Image} from 'expo-image' -import {useLingui} from '@lingui/react' import {msg, Trans} from '@lingui/macro' - -import {colors} from 'lib/styles' -import {useTheme} from 'lib/ThemeContext' -import {useTheme as useAlfTheme} from '#/alf' -import {openCamera, openCropper, openPicker} from '../../../lib/media/picker' +import {useLingui} from '@lingui/react' +import {Image} from 'expo-image' +import {usePalette} from 'lib/hooks/usePalette' import { - usePhotoLibraryPermission, useCameraPermission, + usePhotoLibraryPermission, } from 'lib/hooks/usePermissions' -import {usePalette} from 'lib/hooks/usePalette' +import {colors} from 'lib/styles' +import {useTheme} from 'lib/ThemeContext' import {isAndroid, isNative} from 'platform/detection' +import React from 'react' +import {StyleSheet, TouchableOpacity, View} from 'react-native' import {Image as RNImage} from 'react-native-image-crop-picker' import {EventStopper} from 'view/com/util/EventStopper' -import * as Menu from '#/components/Menu' + +import {useTheme as useAlfTheme} from '#/alf' import { Camera_Filled_Stroke2_Corner0_Rounded as CameraFilled, Camera_Stroke2_Corner0_Rounded as Camera, } from '#/components/icons/Camera' import {StreamingLive_Stroke2_Corner0_Rounded as Library} from '#/components/icons/StreamingLive' import {Trash_Stroke2_Corner0_Rounded as Trash} from '#/components/icons/Trash' +import * as Menu from '#/components/Menu' + +import {openCamera, openCropper, openPicker} from '../../../lib/media/picker' export function UserBanner({ banner, diff --git a/src/view/com/util/UserInfoText.tsx b/src/view/com/util/UserInfoText.tsx index 9cb9997f6..ab937c664 100644 --- a/src/view/com/util/UserInfoText.tsx +++ b/src/view/com/util/UserInfoText.tsx @@ -1,15 +1,17 @@ -import React from 'react' import {AppBskyActorGetProfile as GetProfile} from '@atproto/api' -import {StyleProp, StyleSheet, TextStyle} from 'react-native' -import {TextLinkOnWebOnly} from './Link' -import {Text} from './text/Text' -import {LoadingPlaceholder} from './LoadingPlaceholder' -import {TypographyVariant} from 'lib/ThemeContext' +import {makeProfileLink} from 'lib/routes/links' import {sanitizeDisplayName} from 'lib/strings/display-names' import {sanitizeHandle} from 'lib/strings/handles' -import {makeProfileLink} from 'lib/routes/links' -import {useProfileQuery} from '#/state/queries/profile' +import {TypographyVariant} from 'lib/ThemeContext' +import React from 'react' +import {StyleProp, StyleSheet, TextStyle} from 'react-native' + import {STALE} from '#/state/queries' +import {useProfileQuery} from '#/state/queries/profile' + +import {TextLinkOnWebOnly} from './Link' +import {LoadingPlaceholder} from './LoadingPlaceholder' +import {Text} from './text/Text' export function UserInfoText({ type = 'md', diff --git a/src/view/com/util/UserPreviewLink.tsx b/src/view/com/util/UserPreviewLink.tsx index a2c46afc0..09d230000 100644 --- a/src/view/com/util/UserPreviewLink.tsx +++ b/src/view/com/util/UserPreviewLink.tsx @@ -1,10 +1,12 @@ +import {makeProfileLink} from 'lib/routes/links' +import {isWeb} from 'platform/detection' import React from 'react' import {StyleProp, ViewStyle} from 'react-native' -import {Link} from './Link' -import {isWeb} from 'platform/detection' -import {makeProfileLink} from 'lib/routes/links' + import {usePrefetchProfileQuery} from '#/state/queries/profile' +import {Link} from './Link' + interface UserPreviewLinkProps { did: string handle: string diff --git a/src/view/com/util/ViewHeader.tsx b/src/view/com/util/ViewHeader.tsx index 872e10eef..3ac757269 100644 --- a/src/view/com/util/ViewHeader.tsx +++ b/src/view/com/util/ViewHeader.tsx @@ -1,19 +1,21 @@ -import React from 'react' -import {StyleSheet, TouchableOpacity, View} from 'react-native' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {useNavigation} from '@react-navigation/native' -import {CenteredView} from './Views' -import {Text} from './text/Text' +import {useAnalytics} from 'lib/analytics/analytics' +import {useMinimalShellMode} from 'lib/hooks/useMinimalShellMode' import {usePalette} from 'lib/hooks/usePalette' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {useAnalytics} from 'lib/analytics/analytics' import {NavigationProp} from 'lib/routes/types' -import {useMinimalShellMode} from 'lib/hooks/useMinimalShellMode' +import React from 'react' +import {StyleSheet, TouchableOpacity, View} from 'react-native' import Animated from 'react-native-reanimated' -import {useSetDrawerOpen} from '#/state/shell' -import {msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' + import {useTheme} from '#/alf' +import {useSetDrawerOpen} from '#/state/shell' + +import {Text} from './text/Text' +import {CenteredView} from './Views' const BACK_HITSLOP = {left: 20, top: 20, right: 50, bottom: 20} diff --git a/src/view/com/util/ViewSelector.tsx b/src/view/com/util/ViewSelector.tsx index ee993c564..380028334 100644 --- a/src/view/com/util/ViewSelector.tsx +++ b/src/view/com/util/ViewSelector.tsx @@ -1,20 +1,21 @@ +import {useColorSchemeStyle} from 'lib/hooks/useColorSchemeStyle' +import {usePalette} from 'lib/hooks/usePalette' +import {clamp} from 'lib/numbers' +import {colors, s} from 'lib/styles' +import {isAndroid} from 'platform/detection' import React, {useEffect, useState} from 'react' import { - NativeSyntheticEvent, NativeScrollEvent, + NativeSyntheticEvent, Pressable, RefreshControl, + ScrollView, StyleSheet, View, - ScrollView, } from 'react-native' -import {FlatList_INTERNAL} from './Views' -import {useColorSchemeStyle} from 'lib/hooks/useColorSchemeStyle' + import {Text} from './text/Text' -import {usePalette} from 'lib/hooks/usePalette' -import {clamp} from 'lib/numbers' -import {s, colors} from 'lib/styles' -import {isAndroid} from 'platform/detection' +import {FlatList_INTERNAL} from './Views' const HEADER_ITEM = {_reactKey: '__header__'} const SELECTOR_ITEM = {_reactKey: '__selector__'} diff --git a/src/view/com/util/Views.web.tsx b/src/view/com/util/Views.web.tsx index ae165077c..db023a32c 100644 --- a/src/view/com/util/Views.web.tsx +++ b/src/view/com/util/Views.web.tsx @@ -12,6 +12,9 @@ * need to match layout but which aren't scrolled. */ +import {usePalette} from 'lib/hooks/usePalette' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {addStyle} from 'lib/styles' import React from 'react' import { FlatListProps, @@ -20,9 +23,6 @@ import { View, ViewProps, } from 'react-native' -import {addStyle} from 'lib/styles' -import {usePalette} from 'lib/hooks/usePalette' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' import Animated from 'react-native-reanimated' interface AddedProps { diff --git a/src/view/com/util/anim/TriggerableAnimated.tsx b/src/view/com/util/anim/TriggerableAnimated.tsx index eedeeda03..bb88035d7 100644 --- a/src/view/com/util/anim/TriggerableAnimated.tsx +++ b/src/view/com/util/anim/TriggerableAnimated.tsx @@ -1,6 +1,6 @@ +import {useAnimatedValue} from 'lib/hooks/useAnimatedValue' import React from 'react' import {Animated, StyleProp, View, ViewStyle} from 'react-native' -import {useAnimatedValue} from 'lib/hooks/useAnimatedValue' type CreateAnimFn = (interp: Animated.Value) => Animated.CompositeAnimation type FinishCb = () => void diff --git a/src/view/com/util/error/ErrorMessage.tsx b/src/view/com/util/error/ErrorMessage.tsx index a4238b8a4..5418a0204 100644 --- a/src/view/com/util/error/ErrorMessage.tsx +++ b/src/view/com/util/error/ErrorMessage.tsx @@ -1,20 +1,21 @@ +import { + FontAwesomeIcon, + FontAwesomeIconStyle, +} from '@fortawesome/react-native-fontawesome' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {usePalette} from 'lib/hooks/usePalette' +import {useTheme} from 'lib/ThemeContext' import React from 'react' import { + StyleProp, StyleSheet, TouchableOpacity, - StyleProp, View, ViewStyle, } from 'react-native' -import { - FontAwesomeIcon, - FontAwesomeIconStyle, -} from '@fortawesome/react-native-fontawesome' + import {Text} from '../text/Text' -import {useTheme} from 'lib/ThemeContext' -import {usePalette} from 'lib/hooks/usePalette' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' export function ErrorMessage({ message, diff --git a/src/view/com/util/error/ErrorScreen.tsx b/src/view/com/util/error/ErrorScreen.tsx index 98fe6437b..f3c4a7a3b 100644 --- a/src/view/com/util/error/ErrorScreen.tsx +++ b/src/view/com/util/error/ErrorScreen.tsx @@ -1,18 +1,19 @@ -import React from 'react' -import {StyleSheet, View} from 'react-native' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' -import {Text} from '../text/Text' -import {useTheme} from 'lib/ThemeContext' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {usePalette} from 'lib/hooks/usePalette' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {useTheme} from 'lib/ThemeContext' +import React from 'react' +import {StyleSheet, View} from 'react-native' +import {ViewHeader} from 'view/com/util/ViewHeader' + import {Button} from '../forms/Button' +import {Text} from '../text/Text' import {CenteredView} from '../Views' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {ViewHeader} from 'view/com/util/ViewHeader' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' export function ErrorScreen({ title, diff --git a/src/view/com/util/fab/FAB.web.tsx b/src/view/com/util/fab/FAB.web.tsx index 0a8831fa9..cbe1adfd3 100644 --- a/src/view/com/util/fab/FAB.web.tsx +++ b/src/view/com/util/fab/FAB.web.tsx @@ -1,7 +1,8 @@ +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' import React from 'react' import {View} from 'react-native' + import {FABInner, FABProps} from './FABInner' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' export const FAB = (_opts: FABProps) => { const {isDesktop} = useWebMediaQueries() diff --git a/src/view/com/util/fab/FABInner.tsx b/src/view/com/util/fab/FABInner.tsx index 27a16117b..15e3262ae 100644 --- a/src/view/com/util/fab/FABInner.tsx +++ b/src/view/com/util/fab/FABInner.tsx @@ -1,13 +1,14 @@ +import {useMinimalShellMode} from 'lib/hooks/useMinimalShellMode' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {clamp} from 'lib/numbers' +import {gradients} from 'lib/styles' import React, {ComponentProps} from 'react' import {StyleSheet, TouchableWithoutFeedback} from 'react-native' import LinearGradient from 'react-native-linear-gradient' -import {gradients} from 'lib/styles' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import Animated from 'react-native-reanimated' import {useSafeAreaInsets} from 'react-native-safe-area-context' -import {clamp} from 'lib/numbers' -import {useMinimalShellMode} from 'lib/hooks/useMinimalShellMode' + import {isWeb} from '#/platform/detection' -import Animated from 'react-native-reanimated' export interface FABProps extends ComponentProps<typeof TouchableWithoutFeedback> { diff --git a/src/view/com/util/forms/Button.tsx b/src/view/com/util/forms/Button.tsx index e6e05bb04..62d49c00b 100644 --- a/src/view/com/util/forms/Button.tsx +++ b/src/view/com/util/forms/Button.tsx @@ -1,20 +1,21 @@ +import {choose} from 'lib/functions' +import {useTheme} from 'lib/ThemeContext' import React from 'react' import { + ActivityIndicator, GestureResponderEvent, + NativeSyntheticEvent, + NativeTouchEvent, + Pressable, + PressableStateCallbackType, StyleProp, StyleSheet, TextStyle, - Pressable, - ViewStyle, - PressableStateCallbackType, - ActivityIndicator, View, - NativeSyntheticEvent, - NativeTouchEvent, + ViewStyle, } from 'react-native' + import {Text} from '../text/Text' -import {useTheme} from 'lib/ThemeContext' -import {choose} from 'lib/functions' export type ButtonType = | 'primary' diff --git a/src/view/com/util/forms/DateInput.tsx b/src/view/com/util/forms/DateInput.tsx index 0104562aa..8a813049a 100644 --- a/src/view/com/util/forms/DateInput.tsx +++ b/src/view/com/util/forms/DateInput.tsx @@ -1,18 +1,19 @@ -import React, {useState, useCallback} from 'react' -import {StyleProp, StyleSheet, TextStyle, View, ViewStyle} from 'react-native' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' -import {isIOS, isAndroid} from 'platform/detection' -import {Button, ButtonType} from './Button' -import {Text} from '../text/Text' +import {getLocales} from 'expo-localization' +import {usePalette} from 'lib/hooks/usePalette' import {TypographyVariant} from 'lib/ThemeContext' import {useTheme} from 'lib/ThemeContext' -import {usePalette} from 'lib/hooks/usePalette' -import {getLocales} from 'expo-localization' +import {isAndroid, isIOS} from 'platform/detection' +import React, {useCallback, useState} from 'react' +import {StyleProp, StyleSheet, TextStyle, View, ViewStyle} from 'react-native' import DatePicker from 'react-native-date-picker' +import {Text} from '../text/Text' +import {Button, ButtonType} from './Button' + const LOCALE = getLocales()[0] interface Props { diff --git a/src/view/com/util/forms/DateInput.web.tsx b/src/view/com/util/forms/DateInput.web.tsx index 8d74f6dae..ff1ed58b7 100644 --- a/src/view/com/util/forms/DateInput.web.tsx +++ b/src/view/com/util/forms/DateInput.web.tsx @@ -1,8 +1,8 @@ -import React, {useState, useCallback} from 'react' +import {usePalette} from 'lib/hooks/usePalette' +import React, {useCallback, useState} from 'react' import {StyleProp, StyleSheet, TextStyle, View, ViewStyle} from 'react-native' // @ts-ignore types not available -prf import {unstable_createElement} from 'react-native-web' -import {usePalette} from 'lib/hooks/usePalette' interface Props { testID?: string diff --git a/src/view/com/util/forms/DropdownButton.tsx b/src/view/com/util/forms/DropdownButton.tsx index 2285b0615..f12f1d09c 100644 --- a/src/view/com/util/forms/DropdownButton.tsx +++ b/src/view/com/util/forms/DropdownButton.tsx @@ -1,3 +1,12 @@ +import {IconProp} from '@fortawesome/fontawesome-svg-core' +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {HITSLOP_10} from 'lib/constants' +import {usePalette} from 'lib/hooks/usePalette' +import {colors} from 'lib/styles' +import {useTheme} from 'lib/ThemeContext' +import {isWeb} from 'platform/detection' import React, {PropsWithChildren, useMemo, useRef} from 'react' import { Dimensions, @@ -10,18 +19,10 @@ import { View, ViewStyle, } from 'react-native' -import {IconProp} from '@fortawesome/fontawesome-svg-core' import RootSiblings from 'react-native-root-siblings' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' + import {Text} from '../text/Text' import {Button, ButtonType} from './Button' -import {colors} from 'lib/styles' -import {usePalette} from 'lib/hooks/usePalette' -import {useTheme} from 'lib/ThemeContext' -import {HITSLOP_10} from 'lib/constants' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' -import {isWeb} from 'platform/detection' const ESTIMATED_BTN_HEIGHT = 50 const ESTIMATED_SEP_HEIGHT = 16 diff --git a/src/view/com/util/forms/NativeDropdown.tsx b/src/view/com/util/forms/NativeDropdown.tsx index 0a47569f2..62f830c43 100644 --- a/src/view/com/util/forms/NativeDropdown.tsx +++ b/src/view/com/util/forms/NativeDropdown.tsx @@ -1,13 +1,13 @@ -import React from 'react' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import * as DropdownMenu from 'zeego/dropdown-menu' -import {Pressable, StyleSheet, Platform, View, ViewStyle} from 'react-native' import {IconProp} from '@fortawesome/fontawesome-svg-core' -import {MenuItemCommonProps} from 'zeego/lib/typescript/menu' +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {HITSLOP_10} from 'lib/constants' import {usePalette} from 'lib/hooks/usePalette' -import {isWeb} from 'platform/detection' import {useTheme} from 'lib/ThemeContext' -import {HITSLOP_10} from 'lib/constants' +import {isWeb} from 'platform/detection' +import React from 'react' +import {Platform, Pressable, StyleSheet, View, ViewStyle} from 'react-native' +import * as DropdownMenu from 'zeego/dropdown-menu' +import {MenuItemCommonProps} from 'zeego/lib/typescript/menu' // Custom Dropdown Menu Components // == diff --git a/src/view/com/util/forms/NativeDropdown.web.tsx b/src/view/com/util/forms/NativeDropdown.web.tsx index 6abeb16cc..10a005446 100644 --- a/src/view/com/util/forms/NativeDropdown.web.tsx +++ b/src/view/com/util/forms/NativeDropdown.web.tsx @@ -1,12 +1,12 @@ -import React from 'react' +import {IconProp} from '@fortawesome/fontawesome-svg-core' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' import * as DropdownMenu from '@radix-ui/react-dropdown-menu' -import {Pressable, StyleSheet, View, Text, ViewStyle} from 'react-native' -import {IconProp} from '@fortawesome/fontawesome-svg-core' -import {MenuItemCommonProps} from 'zeego/lib/typescript/menu' +import {HITSLOP_10} from 'lib/constants' import {usePalette} from 'lib/hooks/usePalette' import {useTheme} from 'lib/ThemeContext' -import {HITSLOP_10} from 'lib/constants' +import React from 'react' +import {Pressable, StyleSheet, Text, View, ViewStyle} from 'react-native' +import {MenuItemCommonProps} from 'zeego/lib/typescript/menu' // Custom Dropdown Menu Components // == diff --git a/src/view/com/util/forms/PostDropdownBtn.tsx b/src/view/com/util/forms/PostDropdownBtn.tsx index 3c1a736f3..9727fc21f 100644 --- a/src/view/com/util/forms/PostDropdownBtn.tsx +++ b/src/view/com/util/forms/PostDropdownBtn.tsx @@ -1,49 +1,50 @@ -import React, {memo} from 'react' -import {StyleProp, ViewStyle, Pressable, PressableProps} from 'react-native' -import Clipboard from '@react-native-clipboard/clipboard' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import {useNavigation} from '@react-navigation/native' import { AppBskyActorDefs, AppBskyFeedPost, AtUri, RichText as RichTextAPI, } from '@atproto/api' +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import Clipboard from '@react-native-clipboard/clipboard' +import {useNavigation} from '@react-navigation/native' +import {getCurrentRoute} from 'lib/routes/helpers' +import {shareUrl} from 'lib/sharing' import {toShareUrl} from 'lib/strings/url-helpers' import {useTheme} from 'lib/ThemeContext' -import {shareUrl} from 'lib/sharing' -import * as Toast from '../Toast' -import {EventStopper} from '../EventStopper' -import {useModalControls} from '#/state/modals' +import React, {memo} from 'react' +import {Pressable, PressableProps, StyleProp, ViewStyle} from 'react-native' + +import {atoms as a, useTheme as useAlf} from '#/alf' +import {useGlobalDialogsControlContext} from '#/components/dialogs/Context' +import {ArrowOutOfBox_Stroke2_Corner0_Rounded as Share} from '#/components/icons/ArrowOutOfBox' +import {BubbleQuestion_Stroke2_Corner0_Rounded as Translate} from '#/components/icons/Bubble' +import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfo} from '#/components/icons/CircleInfo' +import {Clipboard_Stroke2_Corner2_Rounded as ClipboardIcon} from '#/components/icons/Clipboard' +import {EyeSlash_Stroke2_Corner0_Rounded as EyeSlash} from '#/components/icons/EyeSlash' +import {Filter_Stroke2_Corner0_Rounded as Filter} from '#/components/icons/Filter' +import {Mute_Stroke2_Corner0_Rounded as Mute} from '#/components/icons/Mute' +import {SpeakerVolumeFull_Stroke2_Corner0_Rounded as Unmute} from '#/components/icons/Speaker' +import {Trash_Stroke2_Corner0_Rounded as Trash} from '#/components/icons/Trash' +import {Warning_Stroke2_Corner0_Rounded as Warning} from '#/components/icons/Warning' +import * as Menu from '#/components/Menu' import {makeProfileLink} from '#/lib/routes/links' import {CommonNavigatorParams} from '#/lib/routes/types' -import {getCurrentRoute} from 'lib/routes/helpers' +import {richTextToString} from '#/lib/strings/rich-text-helpers' import {getTranslatorLink} from '#/locale/helpers' -import {usePostDeleteMutation} from '#/state/queries/post' +import {logger} from '#/logger' +import {isWeb} from '#/platform/detection' +import {useModalControls} from '#/state/modals' import {useMutedThreads, useToggleThreadMute} from '#/state/muted-threads' import {useLanguagePrefs} from '#/state/preferences' import {useHiddenPosts, useHiddenPostsApi} from '#/state/preferences' import {useOpenLink} from '#/state/preferences/in-app-browser' -import {logger} from '#/logger' -import {msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' +import {usePostDeleteMutation} from '#/state/queries/post' import {useSession} from '#/state/session' -import {isWeb} from '#/platform/detection' -import {richTextToString} from '#/lib/strings/rich-text-helpers' -import {useGlobalDialogsControlContext} from '#/components/dialogs/Context' -import {atoms as a, useTheme as useAlf} from '#/alf' -import * as Menu from '#/components/Menu' -import {Clipboard_Stroke2_Corner2_Rounded as ClipboardIcon} from '#/components/icons/Clipboard' -import {Filter_Stroke2_Corner0_Rounded as Filter} from '#/components/icons/Filter' -import {ArrowOutOfBox_Stroke2_Corner0_Rounded as Share} from '#/components/icons/ArrowOutOfBox' -import {EyeSlash_Stroke2_Corner0_Rounded as EyeSlash} from '#/components/icons/EyeSlash' -import {Mute_Stroke2_Corner0_Rounded as Mute} from '#/components/icons/Mute' -import {SpeakerVolumeFull_Stroke2_Corner0_Rounded as Unmute} from '#/components/icons/Speaker' -import {BubbleQuestion_Stroke2_Corner0_Rounded as Translate} from '#/components/icons/Bubble' -import {Warning_Stroke2_Corner0_Rounded as Warning} from '#/components/icons/Warning' -import {Trash_Stroke2_Corner0_Rounded as Trash} from '#/components/icons/Trash' -import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfo} from '#/components/icons/CircleInfo' +import {EventStopper} from '../EventStopper' +import * as Toast from '../Toast' let PostDropdownBtn = ({ testID, diff --git a/src/view/com/util/forms/RadioButton.tsx b/src/view/com/util/forms/RadioButton.tsx index 9d1cb4749..696a0c00a 100644 --- a/src/view/com/util/forms/RadioButton.tsx +++ b/src/view/com/util/forms/RadioButton.tsx @@ -1,9 +1,10 @@ +import {choose} from 'lib/functions' +import {useTheme} from 'lib/ThemeContext' import React from 'react' import {StyleProp, StyleSheet, TextStyle, View, ViewStyle} from 'react-native' + import {Text} from '../text/Text' import {Button, ButtonType} from './Button' -import {useTheme} from 'lib/ThemeContext' -import {choose} from 'lib/functions' export function RadioButton({ testID, diff --git a/src/view/com/util/forms/RadioGroup.tsx b/src/view/com/util/forms/RadioGroup.tsx index 14599e649..abd1f5589 100644 --- a/src/view/com/util/forms/RadioGroup.tsx +++ b/src/view/com/util/forms/RadioGroup.tsx @@ -1,8 +1,9 @@ +import {s} from 'lib/styles' import React, {useState} from 'react' import {View} from 'react-native' -import {RadioButton} from './RadioButton' + import {ButtonType} from './Button' -import {s} from 'lib/styles' +import {RadioButton} from './RadioButton' export interface RadioGroupItem { label: string | JSX.Element diff --git a/src/view/com/util/forms/SearchInput.tsx b/src/view/com/util/forms/SearchInput.tsx index 5a21d8fdd..ff8b6bbdd 100644 --- a/src/view/com/util/forms/SearchInput.tsx +++ b/src/view/com/util/forms/SearchInput.tsx @@ -1,3 +1,13 @@ +import { + FontAwesomeIcon, + FontAwesomeIconStyle, +} from '@fortawesome/react-native-fontawesome' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {HITSLOP_10} from 'lib/constants' +import {usePalette} from 'lib/hooks/usePalette' +import {MagnifyingGlassIcon} from 'lib/icons' +import {useTheme} from 'lib/ThemeContext' import React from 'react' import { StyleProp, @@ -7,16 +17,6 @@ import { View, ViewStyle, } from 'react-native' -import { - FontAwesomeIcon, - FontAwesomeIconStyle, -} from '@fortawesome/react-native-fontawesome' -import {HITSLOP_10} from 'lib/constants' -import {MagnifyingGlassIcon} from 'lib/icons' -import {useTheme} from 'lib/ThemeContext' -import {usePalette} from 'lib/hooks/usePalette' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' interface Props { query: string diff --git a/src/view/com/util/forms/SelectableBtn.tsx b/src/view/com/util/forms/SelectableBtn.tsx index e577e155d..94eb049d2 100644 --- a/src/view/com/util/forms/SelectableBtn.tsx +++ b/src/view/com/util/forms/SelectableBtn.tsx @@ -1,8 +1,9 @@ -import React from 'react' -import {Pressable, ViewStyle, StyleProp, StyleSheet} from 'react-native' -import {Text} from '../text/Text' import {usePalette} from 'lib/hooks/usePalette' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import React from 'react' +import {Pressable, StyleProp, StyleSheet, ViewStyle} from 'react-native' + +import {Text} from '../text/Text' interface SelectableBtnProps { testID?: string diff --git a/src/view/com/util/forms/ToggleButton.tsx b/src/view/com/util/forms/ToggleButton.tsx index c98e846cd..e40218b80 100644 --- a/src/view/com/util/forms/ToggleButton.tsx +++ b/src/view/com/util/forms/ToggleButton.tsx @@ -1,11 +1,12 @@ +import {choose} from 'lib/functions' +import {colors} from 'lib/styles' +import {useTheme} from 'lib/ThemeContext' +import {TypographyVariant} from 'lib/ThemeContext' import React from 'react' import {StyleProp, StyleSheet, TextStyle, View, ViewStyle} from 'react-native' + import {Text} from '../text/Text' import {Button, ButtonType} from './Button' -import {useTheme} from 'lib/ThemeContext' -import {choose} from 'lib/functions' -import {colors} from 'lib/styles' -import {TypographyVariant} from 'lib/ThemeContext' export function ToggleButton({ testID, diff --git a/src/view/com/util/images/AutoSizedImage.tsx b/src/view/com/util/images/AutoSizedImage.tsx index 61cb6f69f..2b52b103d 100644 --- a/src/view/com/util/images/AutoSizedImage.tsx +++ b/src/view/com/util/images/AutoSizedImage.tsx @@ -1,11 +1,11 @@ -import React from 'react' -import {StyleProp, StyleSheet, Pressable, View, ViewStyle} from 'react-native' -import {Image} from 'expo-image' -import {clamp} from 'lib/numbers' -import {Dimensions} from 'lib/media/types' -import * as imageSizes from 'lib/media/image-sizes' import {msg} from '@lingui/macro' import {useLingui} from '@lingui/react' +import {Image} from 'expo-image' +import * as imageSizes from 'lib/media/image-sizes' +import {Dimensions} from 'lib/media/types' +import {clamp} from 'lib/numbers' +import React from 'react' +import {Pressable, StyleProp, StyleSheet, View, ViewStyle} from 'react-native' const MIN_ASPECT_RATIO = 0.33 // 1/3 const MAX_ASPECT_RATIO = 10 // 10/1 diff --git a/src/view/com/util/images/Gallery.tsx b/src/view/com/util/images/Gallery.tsx index 7de3b093a..b5bc39498 100644 --- a/src/view/com/util/images/Gallery.tsx +++ b/src/view/com/util/images/Gallery.tsx @@ -1,10 +1,10 @@ import {AppBskyEmbedImages} from '@atproto/api' -import React, {ComponentProps, FC} from 'react' -import {StyleSheet, Text, Pressable, View} from 'react-native' -import {Image} from 'expo-image' import {msg} from '@lingui/macro' import {useLingui} from '@lingui/react' +import {Image} from 'expo-image' import {isWeb} from 'platform/detection' +import React, {ComponentProps, FC} from 'react' +import {Pressable, StyleSheet, Text, View} from 'react-native' type EventFunction = (index: number) => void diff --git a/src/view/com/util/images/Image.tsx b/src/view/com/util/images/Image.tsx index e779fa378..fbdcfebbf 100644 --- a/src/view/com/util/images/Image.tsx +++ b/src/view/com/util/images/Image.tsx @@ -1,5 +1,5 @@ -import React from 'react' import {Image, ImageProps, ImageSource} from 'expo-image' +import React from 'react' interface HighPriorityImageProps extends ImageProps { source: ImageSource diff --git a/src/view/com/util/images/Image.web.tsx b/src/view/com/util/images/Image.web.tsx index ecd9d730a..eeaf16b9a 100644 --- a/src/view/com/util/images/Image.web.tsx +++ b/src/view/com/util/images/Image.web.tsx @@ -1,8 +1,8 @@ import { Image, - NativeSyntheticEvent, ImageLoadEventData, ImageSourcePropType, + NativeSyntheticEvent, } from 'react-native' export default Image export const HighPriorityImage = Image diff --git a/src/view/com/util/images/ImageHorzList.tsx b/src/view/com/util/images/ImageHorzList.tsx index e37f8af1b..a93fa195c 100644 --- a/src/view/com/util/images/ImageHorzList.tsx +++ b/src/view/com/util/images/ImageHorzList.tsx @@ -1,7 +1,7 @@ +import {AppBskyEmbedImages} from '@atproto/api' +import {Image} from 'expo-image' import React from 'react' import {StyleProp, StyleSheet, View, ViewStyle} from 'react-native' -import {Image} from 'expo-image' -import {AppBskyEmbedImages} from '@atproto/api' interface Props { images: AppBskyEmbedImages.ViewImage[] diff --git a/src/view/com/util/images/ImageLayoutGrid.tsx b/src/view/com/util/images/ImageLayoutGrid.tsx index ba6c04f50..fe2a409b2 100644 --- a/src/view/com/util/images/ImageLayoutGrid.tsx +++ b/src/view/com/util/images/ImageLayoutGrid.tsx @@ -1,8 +1,9 @@ +import {AppBskyEmbedImages} from '@atproto/api' +import {isWeb} from 'platform/detection' import React from 'react' import {StyleProp, StyleSheet, View, ViewStyle} from 'react-native' -import {AppBskyEmbedImages} from '@atproto/api' + import {GalleryItem} from './Gallery' -import {isWeb} from 'platform/detection' interface ImageLayoutGridProps { images: AppBskyEmbedImages.ViewImage[] diff --git a/src/view/com/util/layouts/LoggedOutLayout.tsx b/src/view/com/util/layouts/LoggedOutLayout.tsx index 9424a7154..1032c1f14 100644 --- a/src/view/com/util/layouts/LoggedOutLayout.tsx +++ b/src/view/com/util/layouts/LoggedOutLayout.tsx @@ -1,9 +1,10 @@ +import {useColorSchemeStyle} from 'lib/hooks/useColorSchemeStyle' +import {usePalette} from 'lib/hooks/usePalette' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' import React from 'react' import {StyleSheet, View} from 'react-native' + import {Text} from '../text/Text' -import {usePalette} from 'lib/hooks/usePalette' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {useColorSchemeStyle} from 'lib/hooks/useColorSchemeStyle' export const LoggedOutLayout = ({ leadin, diff --git a/src/view/com/util/layouts/TitleColumnLayout.tsx b/src/view/com/util/layouts/TitleColumnLayout.tsx index 49ad9fcdb..3033d7f42 100644 --- a/src/view/com/util/layouts/TitleColumnLayout.tsx +++ b/src/view/com/util/layouts/TitleColumnLayout.tsx @@ -1,7 +1,7 @@ +import {useColorSchemeStyle} from 'lib/hooks/useColorSchemeStyle' +import {usePalette} from 'lib/hooks/usePalette' import React from 'react' import {StyleProp, StyleSheet, View, ViewStyle} from 'react-native' -import {usePalette} from 'lib/hooks/usePalette' -import {useColorSchemeStyle} from 'lib/hooks/useColorSchemeStyle' interface Props { testID?: string diff --git a/src/view/com/util/layouts/withBreakpoints.tsx b/src/view/com/util/layouts/withBreakpoints.tsx index 5746aa660..de649e55c 100644 --- a/src/view/com/util/layouts/withBreakpoints.tsx +++ b/src/view/com/util/layouts/withBreakpoints.tsx @@ -1,6 +1,6 @@ -import React from 'react' -import {isNative} from 'platform/detection' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {isNative} from 'platform/detection' +import React from 'react' export const withBreakpoints = <P extends object>( Mobile: React.ComponentType<P>, diff --git a/src/view/com/util/load-latest/LoadLatestBtn.tsx b/src/view/com/util/load-latest/LoadLatestBtn.tsx index f02e4a2bd..4cc30432d 100644 --- a/src/view/com/util/load-latest/LoadLatestBtn.tsx +++ b/src/view/com/util/load-latest/LoadLatestBtn.tsx @@ -1,13 +1,13 @@ -import React from 'react' -import {StyleSheet, TouchableOpacity, View} from 'react-native' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import Animated from 'react-native-reanimated' -import {useMediaQuery} from 'react-responsive' +import {HITSLOP_20} from 'lib/constants' +import {useMinimalShellMode} from 'lib/hooks/useMinimalShellMode' import {usePalette} from 'lib/hooks/usePalette' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' import {colors} from 'lib/styles' -import {HITSLOP_20} from 'lib/constants' -import {useMinimalShellMode} from 'lib/hooks/useMinimalShellMode' +import React from 'react' +import {StyleSheet, TouchableOpacity, View} from 'react-native' +import Animated from 'react-native-reanimated' +import {useMediaQuery} from 'react-responsive' const AnimatedTouchableOpacity = Animated.createAnimatedComponent(TouchableOpacity) import {isWeb} from 'platform/detection' diff --git a/src/view/com/util/moderation/ContentHider.tsx b/src/view/com/util/moderation/ContentHider.tsx index cd2545290..8d4978d22 100644 --- a/src/view/com/util/moderation/ContentHider.tsx +++ b/src/view/com/util/moderation/ContentHider.tsx @@ -1,15 +1,17 @@ -import React from 'react' -import {Pressable, StyleProp, StyleSheet, View, ViewStyle} from 'react-native' +import {ModerationUI, PostModeration} from '@atproto/api' 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 {ModerationUI, PostModeration} from '@atproto/api' -import {Text} from '../text/Text' import {ShieldExclamation} from 'lib/icons' import {describeModerationCause} from 'lib/moderation' -import {useLingui} from '@lingui/react' -import {msg, Trans} from '@lingui/macro' -import {useModalControls} from '#/state/modals' import {isPostMediaBlurred} from 'lib/moderation' +import React from 'react' +import {Pressable, StyleProp, StyleSheet, View, ViewStyle} from 'react-native' + +import {useModalControls} from '#/state/modals' + +import {Text} from '../text/Text' export function ContentHider({ testID, diff --git a/src/view/com/util/moderation/LabelInfo.tsx b/src/view/com/util/moderation/LabelInfo.tsx index 970338752..55f8b2dab 100644 --- a/src/view/com/util/moderation/LabelInfo.tsx +++ b/src/view/com/util/moderation/LabelInfo.tsx @@ -1,12 +1,14 @@ -import React from 'react' -import {Pressable, StyleProp, View, ViewStyle} from 'react-native' import {ComAtprotoLabelDefs} from '@atproto/api' -import {Text} from '../text/Text' -import {usePalette} from 'lib/hooks/usePalette' import {msg, Trans} from '@lingui/macro' import {useLingui} from '@lingui/react' +import {usePalette} from 'lib/hooks/usePalette' +import React from 'react' +import {Pressable, StyleProp, View, ViewStyle} from 'react-native' + import {useModalControls} from '#/state/modals' +import {Text} from '../text/Text' + export function LabelInfo({ details, labels, diff --git a/src/view/com/util/moderation/PostAlerts.tsx b/src/view/com/util/moderation/PostAlerts.tsx index bc5bf9b32..135a99486 100644 --- a/src/view/com/util/moderation/PostAlerts.tsx +++ b/src/view/com/util/moderation/PostAlerts.tsx @@ -1,14 +1,16 @@ -import React from 'react' -import {Pressable, StyleProp, StyleSheet, ViewStyle} from 'react-native' import {ModerationUI} from '@atproto/api' -import {Text} from '../text/Text' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {usePalette} from 'lib/hooks/usePalette' import {ShieldExclamation} from 'lib/icons' import {describeModerationCause} from 'lib/moderation' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' +import React from 'react' +import {Pressable, StyleProp, StyleSheet, ViewStyle} from 'react-native' + import {useModalControls} from '#/state/modals' +import {Text} from '../text/Text' + export function PostAlerts({ moderation, style, diff --git a/src/view/com/util/moderation/PostHider.tsx b/src/view/com/util/moderation/PostHider.tsx index ede62e988..02d309a85 100644 --- a/src/view/com/util/moderation/PostHider.tsx +++ b/src/view/com/util/moderation/PostHider.tsx @@ -1,17 +1,19 @@ -import React, {ComponentProps} from 'react' -import {StyleSheet, Pressable, View, ViewStyle, StyleProp} from 'react-native' import {ModerationUI} from '@atproto/api' 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 {Link} from '../Link' -import {Text} from '../text/Text' -import {addStyle} from 'lib/styles' -import {describeModerationCause} from 'lib/moderation' import {ShieldExclamation} from 'lib/icons' -import {useLingui} from '@lingui/react' -import {Trans, msg} from '@lingui/macro' +import {describeModerationCause} from 'lib/moderation' +import {addStyle} from 'lib/styles' +import React, {ComponentProps} from 'react' +import {Pressable, StyleProp, StyleSheet, View, ViewStyle} from 'react-native' + import {useModalControls} from '#/state/modals' +import {Link} from '../Link' +import {Text} from '../text/Text' + interface Props extends ComponentProps<typeof Link> { iconSize: number iconStyles: StyleProp<ViewStyle> diff --git a/src/view/com/util/moderation/ProfileHeaderAlerts.tsx b/src/view/com/util/moderation/ProfileHeaderAlerts.tsx index 0f07b679b..0d4660ebb 100644 --- a/src/view/com/util/moderation/ProfileHeaderAlerts.tsx +++ b/src/view/com/util/moderation/ProfileHeaderAlerts.tsx @@ -1,18 +1,20 @@ -import React from 'react' -import {Pressable, StyleProp, StyleSheet, View, ViewStyle} from 'react-native' import {ProfileModeration} from '@atproto/api' -import {Text} from '../text/Text' +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 {ShieldExclamation} from 'lib/icons' import { describeModerationCause, getProfileModerationCauses, } from 'lib/moderation' -import {msg, Trans} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import React from 'react' +import {Pressable, StyleProp, StyleSheet, View, ViewStyle} from 'react-native' + import {useModalControls} from '#/state/modals' +import {Text} from '../text/Text' + export function ProfileHeaderAlerts({ moderation, style, diff --git a/src/view/com/util/moderation/ScreenHider.tsx b/src/view/com/util/moderation/ScreenHider.tsx index 86f0cbf7b..52e5e37a0 100644 --- a/src/view/com/util/moderation/ScreenHider.tsx +++ b/src/view/com/util/moderation/ScreenHider.tsx @@ -1,27 +1,29 @@ -import React from 'react' -import { - TouchableWithoutFeedback, - StyleProp, - StyleSheet, - View, - ViewStyle, -} from 'react-native' +import {ModerationUI} from '@atproto/api' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {useNavigation} from '@react-navigation/native' -import {ModerationUI} from '@atproto/api' import {usePalette} from 'lib/hooks/usePalette' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {NavigationProp} from 'lib/routes/types' -import {Text} from '../text/Text' -import {Button} from '../forms/Button' import {describeModerationCause} from 'lib/moderation' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {useModalControls} from '#/state/modals' +import {NavigationProp} from 'lib/routes/types' +import React from 'react' +import { + StyleProp, + StyleSheet, + TouchableWithoutFeedback, + View, + ViewStyle, +} from 'react-native' + import {s} from '#/lib/styles' +import {useModalControls} from '#/state/modals' + +import {Button} from '../forms/Button' +import {Text} from '../text/Text' import {CenteredView} from '../Views' export function ScreenHider({ diff --git a/src/view/com/util/post-ctrls/PostCtrls.tsx b/src/view/com/util/post-ctrls/PostCtrls.tsx index 1e26eecce..d1340f6d2 100644 --- a/src/view/com/util/post-ctrls/PostCtrls.tsx +++ b/src/view/com/util/post-ctrls/PostCtrls.tsx @@ -1,40 +1,42 @@ -import React, {memo, useCallback} from 'react' -import { - StyleProp, - StyleSheet, - TouchableOpacity, - View, - ViewStyle, -} from 'react-native' import { AppBskyFeedDefs, AppBskyFeedPost, AtUri, RichText as RichTextAPI, } from '@atproto/api' -import {Text} from '../text/Text' -import {PostDropdownBtn} from '../forms/PostDropdownBtn' -import {HeartIcon, HeartIconSolid, CommentBottomArrow} from 'lib/icons' -import {s} from 'lib/styles' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {HITSLOP_10, HITSLOP_20} from 'lib/constants' +import {Haptics} from 'lib/haptics' +import {CommentBottomArrow, HeartIcon, HeartIconSolid} from 'lib/icons' +import {makeProfileLink} from 'lib/routes/links' +import {shareUrl} from 'lib/sharing' import {pluralize} from 'lib/strings/helpers' +import {toShareUrl} from 'lib/strings/url-helpers' +import {s} from 'lib/styles' import {useTheme} from 'lib/ThemeContext' -import {RepostButton} from './RepostButton' -import {Haptics} from 'lib/haptics' -import {HITSLOP_10, HITSLOP_20} from 'lib/constants' +import React, {memo, useCallback} from 'react' +import { + StyleProp, + StyleSheet, + TouchableOpacity, + View, + ViewStyle, +} from 'react-native' + +import {ArrowOutOfBox_Stroke2_Corner0_Rounded as ArrowOutOfBox} from '#/components/icons/ArrowOutOfBox' +import {Shadow} from '#/state/cache/types' import {useModalControls} from '#/state/modals' import { usePostLikeMutationQueue, usePostRepostMutationQueue, } from '#/state/queries/post' -import {useComposerControls} from '#/state/shell/composer' -import {Shadow} from '#/state/cache/types' import {useRequireAuth} from '#/state/session' -import {msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {ArrowOutOfBox_Stroke2_Corner0_Rounded as ArrowOutOfBox} from '#/components/icons/ArrowOutOfBox' -import {toShareUrl} from 'lib/strings/url-helpers' -import {shareUrl} from 'lib/sharing' -import {makeProfileLink} from 'lib/routes/links' +import {useComposerControls} from '#/state/shell/composer' + +import {PostDropdownBtn} from '../forms/PostDropdownBtn' +import {Text} from '../text/Text' +import {RepostButton} from './RepostButton' let PostCtrls = ({ big, diff --git a/src/view/com/util/post-ctrls/RepostButton.tsx b/src/view/com/util/post-ctrls/RepostButton.tsx index cc3db50c8..b0cf6a7b1 100644 --- a/src/view/com/util/post-ctrls/RepostButton.tsx +++ b/src/view/com/util/post-ctrls/RepostButton.tsx @@ -1,15 +1,17 @@ -import React, {memo, useCallback} from 'react' -import {StyleProp, StyleSheet, TouchableOpacity, ViewStyle} from 'react-native' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {HITSLOP_10, HITSLOP_20} from 'lib/constants' import {RepostIcon} from 'lib/icons' -import {s, colors} from 'lib/styles' -import {useTheme} from 'lib/ThemeContext' -import {Text} from '../text/Text' import {pluralize} from 'lib/strings/helpers' -import {HITSLOP_10, HITSLOP_20} from 'lib/constants' +import {colors, s} from 'lib/styles' +import {useTheme} from 'lib/ThemeContext' +import React, {memo, useCallback} from 'react' +import {StyleProp, StyleSheet, TouchableOpacity, ViewStyle} from 'react-native' + import {useModalControls} from '#/state/modals' import {useRequireAuth} from '#/state/session' -import {msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' + +import {Text} from '../text/Text' interface Props { isReposted: boolean diff --git a/src/view/com/util/post-ctrls/RepostButton.web.tsx b/src/view/com/util/post-ctrls/RepostButton.web.tsx index bbe5869fe..391eeaf1f 100644 --- a/src/view/com/util/post-ctrls/RepostButton.web.tsx +++ b/src/view/com/util/post-ctrls/RepostButton.web.tsx @@ -1,19 +1,20 @@ -import React from 'react' -import {StyleProp, StyleSheet, View, ViewStyle, Pressable} from 'react-native' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {RepostIcon} from 'lib/icons' import {colors} from 'lib/styles' import {useTheme} from 'lib/ThemeContext' -import {Text} from '../text/Text' +import React from 'react' +import {Pressable, StyleProp, StyleSheet, View, ViewStyle} from 'react-native' +import {useRequireAuth} from '#/state/session' +import {useSession} from '#/state/session' + +import {EventStopper} from '../EventStopper' import { - NativeDropdown, DropdownItem as NativeDropdownItem, + NativeDropdown, } from '../forms/NativeDropdown' -import {EventStopper} from '../EventStopper' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' -import {useRequireAuth} from '#/state/session' -import {useSession} from '#/state/session' +import {Text} from '../text/Text' interface Props { isReposted: boolean diff --git a/src/view/com/util/post-embeds/ExternalGifEmbed.tsx b/src/view/com/util/post-embeds/ExternalGifEmbed.tsx index f06c8b794..135f9b211 100644 --- a/src/view/com/util/post-embeds/ExternalGifEmbed.tsx +++ b/src/view/com/util/post-embeds/ExternalGifEmbed.tsx @@ -1,6 +1,10 @@ +import {AppBskyEmbedExternal} from '@atproto/api' +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {Image, ImageLoadEventData} from 'expo-image' import {EmbedPlayerParams, getGifDims} from 'lib/strings/embed-player' import React from 'react' -import {Image, ImageLoadEventData} from 'expo-image' import { ActivityIndicator, GestureResponderEvent, @@ -9,13 +13,10 @@ import { StyleSheet, View, } from 'react-native' -import {isIOS, isNative, isWeb} from '#/platform/detection' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import {useExternalEmbedsPrefs} from 'state/preferences' import {useModalControls} from 'state/modals' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' -import {AppBskyEmbedExternal} from '@atproto/api' +import {useExternalEmbedsPrefs} from 'state/preferences' + +import {isIOS, isNative, isWeb} from '#/platform/detection' export function ExternalGifEmbed({ link, diff --git a/src/view/com/util/post-embeds/ExternalLinkEmbed.tsx b/src/view/com/util/post-embeds/ExternalLinkEmbed.tsx index aaa98a41f..a29901bae 100644 --- a/src/view/com/util/post-embeds/ExternalLinkEmbed.tsx +++ b/src/view/com/util/post-embeds/ExternalLinkEmbed.tsx @@ -1,15 +1,16 @@ -import React from 'react' +import {AppBskyEmbedExternal} from '@atproto/api' import {Image} from 'expo-image' -import {Text} from '../text/Text' -import {StyleSheet, View} from 'react-native' import {usePalette} from 'lib/hooks/usePalette' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {AppBskyEmbedExternal} from '@atproto/api' -import {toNiceDomain} from 'lib/strings/url-helpers' import {parseEmbedPlayerFromUrl} from 'lib/strings/embed-player' -import {ExternalPlayer} from 'view/com/util/post-embeds/ExternalPlayerEmbed' -import {ExternalGifEmbed} from 'view/com/util/post-embeds/ExternalGifEmbed' +import {toNiceDomain} from 'lib/strings/url-helpers' +import React from 'react' +import {StyleSheet, View} from 'react-native' import {useExternalEmbedsPrefs} from 'state/preferences' +import {ExternalGifEmbed} from 'view/com/util/post-embeds/ExternalGifEmbed' +import {ExternalPlayer} from 'view/com/util/post-embeds/ExternalPlayerEmbed' + +import {Text} from '../text/Text' export const ExternalLinkEmbed = ({ link, diff --git a/src/view/com/util/post-embeds/ExternalPlayerEmbed.tsx b/src/view/com/util/post-embeds/ExternalPlayerEmbed.tsx index cf2db5b33..1b9d40844 100644 --- a/src/view/com/util/post-embeds/ExternalPlayerEmbed.tsx +++ b/src/view/com/util/post-embeds/ExternalPlayerEmbed.tsx @@ -1,3 +1,12 @@ +import {AppBskyEmbedExternal} from '@atproto/api' +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useNavigation} from '@react-navigation/native' +import {Image} from 'expo-image' +import {NavigationProp} from 'lib/routes/types' +import {EmbedPlayerParams, getPlayerAspect} from 'lib/strings/embed-player' +import {isNative} from 'platform/detection' import React from 'react' import { ActivityIndicator, @@ -13,20 +22,12 @@ import Animated, { useAnimatedRef, useFrameCallback, } from 'react-native-reanimated' -import {Image} from 'expo-image' -import {WebView} from 'react-native-webview' import {useSafeAreaInsets} from 'react-native-safe-area-context' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import {msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {useNavigation} from '@react-navigation/native' -import {AppBskyEmbedExternal} from '@atproto/api' -import {EmbedPlayerParams, getPlayerAspect} from 'lib/strings/embed-player' -import {EventStopper} from '../EventStopper' -import {isNative} from 'platform/detection' -import {NavigationProp} from 'lib/routes/types' -import {useExternalEmbedsPrefs} from 'state/preferences' +import {WebView} from 'react-native-webview' import {useModalControls} from 'state/modals' +import {useExternalEmbedsPrefs} from 'state/preferences' + +import {EventStopper} from '../EventStopper' interface ShouldStartLoadRequest { url: string diff --git a/src/view/com/util/post-embeds/ListEmbed.tsx b/src/view/com/util/post-embeds/ListEmbed.tsx index fc5ad270f..ad766d900 100644 --- a/src/view/com/util/post-embeds/ListEmbed.tsx +++ b/src/view/com/util/post-embeds/ListEmbed.tsx @@ -1,9 +1,9 @@ +import {AppBskyGraphDefs} from '@atproto/api' +import {usePalette} from 'lib/hooks/usePalette' +import {s} from 'lib/styles' import React from 'react' import {StyleProp, StyleSheet, View, ViewStyle} from 'react-native' -import {usePalette} from 'lib/hooks/usePalette' import {ListCard} from 'view/com/lists/ListCard' -import {AppBskyGraphDefs} from '@atproto/api' -import {s} from 'lib/styles' export function ListEmbed({ item, diff --git a/src/view/com/util/post-embeds/QuoteEmbed.tsx b/src/view/com/util/post-embeds/QuoteEmbed.tsx index 35b091269..b3b24192b 100644 --- a/src/view/com/util/post-embeds/QuoteEmbed.tsx +++ b/src/view/com/util/post-embeds/QuoteEmbed.tsx @@ -1,27 +1,29 @@ -import React from 'react' -import {StyleProp, StyleSheet, View, ViewStyle} from 'react-native' import { - AppBskyEmbedRecord, - AppBskyFeedPost, + AppBskyEmbedExternal, AppBskyEmbedImages, + AppBskyEmbedRecord, AppBskyEmbedRecordWithMedia, + AppBskyFeedPost, ModerationUI, - AppBskyEmbedExternal, RichText as RichTextAPI, } from '@atproto/api' import {AtUri} from '@atproto/api' -import {PostMeta} from '../PostMeta' -import {Link} from '../Link' -import {Text} from '../text/Text' +import {Trans} from '@lingui/macro' import {usePalette} from 'lib/hooks/usePalette' -import {ComposerOptsQuote} from 'state/shell/composer' -import {PostEmbeds} from '.' -import {PostAlerts} from '../moderation/PostAlerts' -import {makeProfileLink} from 'lib/routes/links' import {InfoCircleIcon} from 'lib/icons' -import {Trans} from '@lingui/macro' -import {RichText} from '#/components/RichText' +import {makeProfileLink} from 'lib/routes/links' +import React from 'react' +import {StyleProp, StyleSheet, View, ViewStyle} from 'react-native' +import {ComposerOptsQuote} from 'state/shell/composer' + import {atoms as a} from '#/alf' +import {RichText} from '#/components/RichText' + +import {Link} from '../Link' +import {PostAlerts} from '../moderation/PostAlerts' +import {PostMeta} from '../PostMeta' +import {Text} from '../text/Text' +import {PostEmbeds} from '.' export function MaybeQuoteEmbed({ embed, diff --git a/src/view/com/util/post-embeds/index.tsx b/src/view/com/util/post-embeds/index.tsx index 7e235babb..c2fabd2a0 100644 --- a/src/view/com/util/post-embeds/index.tsx +++ b/src/view/com/util/post-embeds/index.tsx @@ -1,16 +1,6 @@ -import React, {useCallback} from 'react' -import { - StyleSheet, - StyleProp, - View, - ViewStyle, - Text, - InteractionManager, -} from 'react-native' -import {Image} from 'expo-image' import { - AppBskyEmbedImages, AppBskyEmbedExternal, + AppBskyEmbedImages, AppBskyEmbedRecord, AppBskyEmbedRecordWithMedia, AppBskyFeedDefs, @@ -18,19 +8,31 @@ import { ModerationUI, PostModeration, } from '@atproto/api' -import {Link} from '../Link' -import {ImageLayoutGrid} from '../images/ImageLayoutGrid' -import {useLightboxControls, ImagesLightbox} from '#/state/lightbox' +import {Image} from 'expo-image' import {usePalette} from 'lib/hooks/usePalette' -import {ExternalLinkEmbed} from './ExternalLinkEmbed' -import {MaybeQuoteEmbed} from './QuoteEmbed' -import {AutoSizedImage} from '../images/AutoSizedImage' -import {ListEmbed} from './ListEmbed' import {isCauseALabelOnUri, isQuoteBlurred} from 'lib/moderation' +import React, {useCallback} from 'react' +import { + InteractionManager, + StyleProp, + StyleSheet, + Text, + View, + ViewStyle, +} from 'react-native' import {FeedSourceCard} from 'view/com/feeds/FeedSourceCard' -import {ContentHider} from '../moderation/ContentHider' -import {isNative} from '#/platform/detection' + import {shareUrl} from '#/lib/sharing' +import {isNative} from '#/platform/detection' +import {ImagesLightbox, useLightboxControls} from '#/state/lightbox' + +import {AutoSizedImage} from '../images/AutoSizedImage' +import {ImageLayoutGrid} from '../images/ImageLayoutGrid' +import {Link} from '../Link' +import {ContentHider} from '../moderation/ContentHider' +import {ExternalLinkEmbed} from './ExternalLinkEmbed' +import {ListEmbed} from './ListEmbed' +import {MaybeQuoteEmbed} from './QuoteEmbed' type Embed = | AppBskyEmbedRecord.View diff --git a/src/view/com/util/text/RichText.tsx b/src/view/com/util/text/RichText.tsx index f4ade30e5..5756db324 100644 --- a/src/view/com/util/text/RichText.tsx +++ b/src/view/com/util/text/RichText.tsx @@ -1,16 +1,18 @@ -import React from 'react' -import {TextStyle, StyleProp} from 'react-native' -import {RichText as RichTextObj, AppBskyRichtextFacet} from '@atproto/api' -import {TextLink} from '../Link' -import {Text} from './Text' -import {lh} from 'lib/styles' -import {toShortUrl} from 'lib/strings/url-helpers' -import {useTheme, TypographyVariant} from 'lib/ThemeContext' +import {AppBskyRichtextFacet, RichText as RichTextObj} from '@atproto/api' import {usePalette} from 'lib/hooks/usePalette' import {makeTagLink} from 'lib/routes/links' +import {toShortUrl} from 'lib/strings/url-helpers' +import {lh} from 'lib/styles' +import {TypographyVariant, useTheme} from 'lib/ThemeContext' +import React from 'react' +import {StyleProp, TextStyle} from 'react-native' + import {TagMenu, useTagMenuControl} from '#/components/TagMenu' import {isNative} from '#/platform/detection' +import {TextLink} from '../Link' +import {Text} from './Text' + const WORD_WRAP = {wordWrap: 1} /** diff --git a/src/view/com/util/text/Text.tsx b/src/view/com/util/text/Text.tsx index ccb51bfca..0dfa667fb 100644 --- a/src/view/com/util/text/Text.tsx +++ b/src/view/com/util/text/Text.tsx @@ -1,8 +1,8 @@ +import {lh, s} from 'lib/styles' +import {TypographyVariant, useTheme} from 'lib/ThemeContext' +import {isIOS} from 'platform/detection' import React from 'react' import {Text as RNText, TextProps} from 'react-native' -import {s, lh} from 'lib/styles' -import {useTheme, TypographyVariant} from 'lib/ThemeContext' -import {isIOS} from 'platform/detection' import {UITextView} from 'react-native-ui-text-view' export type CustomTextProps = TextProps & { diff --git a/src/view/com/util/text/ThemedText.tsx b/src/view/com/util/text/ThemedText.tsx index 2844d273c..27268472b 100644 --- a/src/view/com/util/text/ThemedText.tsx +++ b/src/view/com/util/text/ThemedText.tsx @@ -1,7 +1,8 @@ -import React from 'react' -import {CustomTextProps, Text} from './Text' import {usePalette} from 'lib/hooks/usePalette' import {addStyle} from 'lib/styles' +import React from 'react' + +import {CustomTextProps, Text} from './Text' export type ThemedTextProps = CustomTextProps & { fg?: 'default' | 'light' | 'error' | 'inverted' | 'inverted-light' diff --git a/src/view/icons/Logo.tsx b/src/view/icons/Logo.tsx index 9212381a9..d6d4c8321 100644 --- a/src/view/icons/Logo.tsx +++ b/src/view/icons/Logo.tsx @@ -1,12 +1,12 @@ import React from 'react' import {StyleSheet, TextProps} from 'react-native' import Svg, { - Path, Defs, LinearGradient, + Path, + PathProps, Stop, SvgProps, - PathProps, } from 'react-native-svg' import {colors} from '#/lib/styles' diff --git a/src/view/icons/Logotype.tsx b/src/view/icons/Logotype.tsx index 080c402fb..d6c35f6d9 100644 --- a/src/view/icons/Logotype.tsx +++ b/src/view/icons/Logotype.tsx @@ -1,5 +1,5 @@ import React from 'react' -import Svg, {Path, SvgProps, PathProps} from 'react-native-svg' +import Svg, {Path, PathProps, SvgProps} from 'react-native-svg' import {usePalette} from '#/lib/hooks/usePalette' diff --git a/src/view/icons/index.tsx b/src/view/icons/index.tsx index ede1e6335..570d1b53b 100644 --- a/src/view/icons/index.tsx +++ b/src/view/icons/index.tsx @@ -1,63 +1,71 @@ import {library} from '@fortawesome/fontawesome-svg-core' - import {faAddressCard} from '@fortawesome/free-regular-svg-icons' +import {faBell as farBell} from '@fortawesome/free-regular-svg-icons/faBell' +import {faBookmark as farBookmark} from '@fortawesome/free-regular-svg-icons/faBookmark' +import {faCalendar as farCalendar} from '@fortawesome/free-regular-svg-icons/faCalendar' +import {faCircle} from '@fortawesome/free-regular-svg-icons/faCircle' +import {faCircleCheck as farCircleCheck} from '@fortawesome/free-regular-svg-icons/faCircleCheck' +import {faCirclePlay} from '@fortawesome/free-regular-svg-icons/faCirclePlay' +import {faCircleUser} from '@fortawesome/free-regular-svg-icons/faCircleUser' +import {faClone as farClone} from '@fortawesome/free-regular-svg-icons/faClone' +import {faComment} from '@fortawesome/free-regular-svg-icons/faComment' +import {faComments} from '@fortawesome/free-regular-svg-icons/faComments' +import {faCompass} from '@fortawesome/free-regular-svg-icons/faCompass' +import {faEyeSlash as farEyeSlash} from '@fortawesome/free-regular-svg-icons/faEyeSlash' +import {faFaceSmile} from '@fortawesome/free-regular-svg-icons/faFaceSmile' +import {faFloppyDisk} from '@fortawesome/free-regular-svg-icons/faFloppyDisk' +import {faHand as farHand} from '@fortawesome/free-regular-svg-icons/faHand' +import {faHeart} from '@fortawesome/free-regular-svg-icons/faHeart' +import {faImage as farImage} from '@fortawesome/free-regular-svg-icons/faImage' +import {faMessage} from '@fortawesome/free-regular-svg-icons/faMessage' +import {faPaste} from '@fortawesome/free-regular-svg-icons/faPaste' +import {faSquare} from '@fortawesome/free-regular-svg-icons/faSquare' +import {faSquareCheck} from '@fortawesome/free-regular-svg-icons/faSquareCheck' +import {faSquarePlus} from '@fortawesome/free-regular-svg-icons/faSquarePlus' +import {faTrashCan} from '@fortawesome/free-regular-svg-icons/faTrashCan' +import {faUser} from '@fortawesome/free-regular-svg-icons/faUser' +import {faFlask} from '@fortawesome/free-solid-svg-icons' import {faAngleDown} from '@fortawesome/free-solid-svg-icons/faAngleDown' import {faAngleLeft} from '@fortawesome/free-solid-svg-icons/faAngleLeft' import {faAngleRight} from '@fortawesome/free-solid-svg-icons/faAngleRight' import {faAngleUp} from '@fortawesome/free-solid-svg-icons/faAngleUp' +import {faArrowDown} from '@fortawesome/free-solid-svg-icons/faArrowDown' import {faArrowLeft} from '@fortawesome/free-solid-svg-icons/faArrowLeft' import {faArrowRight} from '@fortawesome/free-solid-svg-icons/faArrowRight' -import {faArrowUp} from '@fortawesome/free-solid-svg-icons/faArrowUp' -import {faArrowDown} from '@fortawesome/free-solid-svg-icons/faArrowDown' import {faArrowRightFromBracket} from '@fortawesome/free-solid-svg-icons/faArrowRightFromBracket' -import {faArrowUpFromBracket} from '@fortawesome/free-solid-svg-icons/faArrowUpFromBracket' -import {faArrowUpRightFromSquare} from '@fortawesome/free-solid-svg-icons/faArrowUpRightFromSquare' import {faArrowRotateLeft} from '@fortawesome/free-solid-svg-icons/faArrowRotateLeft' -import {faArrowTrendUp} from '@fortawesome/free-solid-svg-icons/faArrowTrendUp' import {faArrowsRotate} from '@fortawesome/free-solid-svg-icons/faArrowsRotate' +import {faArrowTrendUp} from '@fortawesome/free-solid-svg-icons/faArrowTrendUp' +import {faArrowUp} from '@fortawesome/free-solid-svg-icons/faArrowUp' +import {faArrowUpFromBracket} from '@fortawesome/free-solid-svg-icons/faArrowUpFromBracket' +import {faArrowUpRightFromSquare} from '@fortawesome/free-solid-svg-icons/faArrowUpRightFromSquare' import {faAt} from '@fortawesome/free-solid-svg-icons/faAt' -import {faBars} from '@fortawesome/free-solid-svg-icons/faBars' import {faBan} from '@fortawesome/free-solid-svg-icons/faBan' +import {faBars} from '@fortawesome/free-solid-svg-icons/faBars' import {faBell} from '@fortawesome/free-solid-svg-icons/faBell' -import {faBell as farBell} from '@fortawesome/free-regular-svg-icons/faBell' import {faBookmark} from '@fortawesome/free-solid-svg-icons/faBookmark' -import {faBookmark as farBookmark} from '@fortawesome/free-regular-svg-icons/faBookmark' -import {faCalendar as farCalendar} from '@fortawesome/free-regular-svg-icons/faCalendar' import {faCamera} from '@fortawesome/free-solid-svg-icons/faCamera' import {faCheck} from '@fortawesome/free-solid-svg-icons/faCheck' +import {faChevronDown} from '@fortawesome/free-solid-svg-icons/faChevronDown' import {faChevronRight} from '@fortawesome/free-solid-svg-icons/faChevronRight' -import {faCircle} from '@fortawesome/free-regular-svg-icons/faCircle' -import {faCircleCheck as farCircleCheck} from '@fortawesome/free-regular-svg-icons/faCircleCheck' import {faCircleCheck} from '@fortawesome/free-solid-svg-icons/faCircleCheck' import {faCircleDot} from '@fortawesome/free-solid-svg-icons/faCircleDot' import {faCircleExclamation} from '@fortawesome/free-solid-svg-icons/faCircleExclamation' -import {faCirclePlay} from '@fortawesome/free-regular-svg-icons/faCirclePlay' -import {faCircleUser} from '@fortawesome/free-regular-svg-icons/faCircleUser' import {faClone} from '@fortawesome/free-solid-svg-icons/faClone' -import {faClone as farClone} from '@fortawesome/free-regular-svg-icons/faClone' -import {faComment} from '@fortawesome/free-regular-svg-icons/faComment' import {faCommentSlash} from '@fortawesome/free-solid-svg-icons/faCommentSlash' -import {faComments} from '@fortawesome/free-regular-svg-icons/faComments' -import {faCompass} from '@fortawesome/free-regular-svg-icons/faCompass' import {faDownload} from '@fortawesome/free-solid-svg-icons/faDownload' import {faEllipsis} from '@fortawesome/free-solid-svg-icons/faEllipsis' import {faEnvelope} from '@fortawesome/free-solid-svg-icons/faEnvelope' import {faExclamation} from '@fortawesome/free-solid-svg-icons/faExclamation' import {faEye} from '@fortawesome/free-solid-svg-icons/faEye' -import {faEyeSlash as farEyeSlash} from '@fortawesome/free-regular-svg-icons/faEyeSlash' -import {faFaceSmile} from '@fortawesome/free-regular-svg-icons/faFaceSmile' +import {faFilter} from '@fortawesome/free-solid-svg-icons/faFilter' import {faFire} from '@fortawesome/free-solid-svg-icons/faFire' -import {faFlask} from '@fortawesome/free-solid-svg-icons' -import {faFloppyDisk} from '@fortawesome/free-regular-svg-icons/faFloppyDisk' import {faGear} from '@fortawesome/free-solid-svg-icons/faGear' import {faGlobe} from '@fortawesome/free-solid-svg-icons/faGlobe' import {faHand} from '@fortawesome/free-solid-svg-icons/faHand' -import {faHand as farHand} from '@fortawesome/free-regular-svg-icons/faHand' import {faHashtag} from '@fortawesome/free-solid-svg-icons/faHashtag' -import {faHeart} from '@fortawesome/free-regular-svg-icons/faHeart' import {faHeart as fasHeart} from '@fortawesome/free-solid-svg-icons/faHeart' import {faHouse} from '@fortawesome/free-solid-svg-icons/faHouse' -import {faImage as farImage} from '@fortawesome/free-regular-svg-icons/faImage' import {faImage} from '@fortawesome/free-solid-svg-icons/faImage' import {faInfo} from '@fortawesome/free-solid-svg-icons/faInfo' import {faLanguage} from '@fortawesome/free-solid-svg-icons/faLanguage' @@ -66,10 +74,8 @@ import {faList} from '@fortawesome/free-solid-svg-icons/faList' import {faListUl} from '@fortawesome/free-solid-svg-icons/faListUl' import {faLock} from '@fortawesome/free-solid-svg-icons/faLock' import {faMagnifyingGlass} from '@fortawesome/free-solid-svg-icons/faMagnifyingGlass' -import {faMessage} from '@fortawesome/free-regular-svg-icons/faMessage' import {faNoteSticky} from '@fortawesome/free-solid-svg-icons/faNoteSticky' import {faPause} from '@fortawesome/free-solid-svg-icons/faPause' -import {faPaste} from '@fortawesome/free-regular-svg-icons/faPaste' import {faPen} from '@fortawesome/free-solid-svg-icons/faPen' import {faPenNib} from '@fortawesome/free-solid-svg-icons/faPenNib' import {faPenToSquare} from '@fortawesome/free-solid-svg-icons/faPenToSquare' @@ -87,23 +93,16 @@ import {faShareFromSquare} from '@fortawesome/free-solid-svg-icons/faShareFromSq import {faShield} from '@fortawesome/free-solid-svg-icons/faShield' import {faSignal} from '@fortawesome/free-solid-svg-icons/faSignal' import {faSliders} from '@fortawesome/free-solid-svg-icons/faSliders' -import {faSquare} from '@fortawesome/free-regular-svg-icons/faSquare' -import {faSquareCheck} from '@fortawesome/free-regular-svg-icons/faSquareCheck' -import {faSquarePlus} from '@fortawesome/free-regular-svg-icons/faSquarePlus' import {faThumbtack} from '@fortawesome/free-solid-svg-icons/faThumbtack' import {faTicket} from '@fortawesome/free-solid-svg-icons/faTicket' -import {faTrashCan} from '@fortawesome/free-regular-svg-icons/faTrashCan' -import {faUser} from '@fortawesome/free-regular-svg-icons/faUser' -import {faUsers} from '@fortawesome/free-solid-svg-icons/faUsers' import {faUserCheck} from '@fortawesome/free-solid-svg-icons/faUserCheck' -import {faUserSlash} from '@fortawesome/free-solid-svg-icons/faUserSlash' import {faUserPlus} from '@fortawesome/free-solid-svg-icons/faUserPlus' -import {faUserXmark} from '@fortawesome/free-solid-svg-icons/faUserXmark' +import {faUsers} from '@fortawesome/free-solid-svg-icons/faUsers' +import {faUserSlash} from '@fortawesome/free-solid-svg-icons/faUserSlash' import {faUsersSlash} from '@fortawesome/free-solid-svg-icons/faUsersSlash' +import {faUserXmark} from '@fortawesome/free-solid-svg-icons/faUserXmark' import {faX} from '@fortawesome/free-solid-svg-icons/faX' import {faXmark} from '@fortawesome/free-solid-svg-icons/faXmark' -import {faChevronDown} from '@fortawesome/free-solid-svg-icons/faChevronDown' -import {faFilter} from '@fortawesome/free-solid-svg-icons/faFilter' library.add( faAddressCard, diff --git a/src/view/screens/AppPasswords.tsx b/src/view/screens/AppPasswords.tsx index dc439c367..b28b992bb 100644 --- a/src/view/screens/AppPasswords.tsx +++ b/src/view/screens/AppPasswords.tsx @@ -1,3 +1,12 @@ +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useFocusEffect} from '@react-navigation/native' +import {NativeStackScreenProps} from '@react-navigation/native-stack' +import {useAnalytics} from 'lib/analytics/analytics' +import {usePalette} from 'lib/hooks/usePalette' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {CommonNavigatorParams} from 'lib/routes/types' import React from 'react' import { ActivityIndicator, @@ -5,30 +14,23 @@ import { TouchableOpacity, View, } from 'react-native' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' import {ScrollView} from 'react-native-gesture-handler' -import {Text} from '../com/util/text/Text' -import {Button} from '../com/util/forms/Button' -import * as Toast from '../com/util/Toast' -import {usePalette} from 'lib/hooks/usePalette' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {NativeStackScreenProps} from '@react-navigation/native-stack' -import {CommonNavigatorParams} from 'lib/routes/types' -import {useAnalytics} from 'lib/analytics/analytics' -import {useFocusEffect} from '@react-navigation/native' -import {ViewHeader} from '../com/util/ViewHeader' import {CenteredView} from 'view/com/util/Views' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {useSetMinimalShellMode} from '#/state/shell' + +import {cleanError} from '#/lib/strings/errors' import {useModalControls} from '#/state/modals' import {useLanguagePrefs} from '#/state/preferences' import { - useAppPasswordsQuery, useAppPasswordDeleteMutation, + useAppPasswordsQuery, } from '#/state/queries/app-passwords' +import {useSetMinimalShellMode} from '#/state/shell' + import {ErrorScreen} from '../com/util/error/ErrorScreen' -import {cleanError} from '#/lib/strings/errors' +import {Button} from '../com/util/forms/Button' +import {Text} from '../com/util/text/Text' +import * as Toast from '../com/util/Toast' +import {ViewHeader} from '../com/util/ViewHeader' type Props = NativeStackScreenProps<CommonNavigatorParams, 'AppPasswords'> export function AppPasswords({}: Props) { diff --git a/src/view/screens/CommunityGuidelines.tsx b/src/view/screens/CommunityGuidelines.tsx index f6c29a3b8..e995b8795 100644 --- a/src/view/screens/CommunityGuidelines.tsx +++ b/src/view/screens/CommunityGuidelines.tsx @@ -1,16 +1,18 @@ +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useFocusEffect} from '@react-navigation/native' +import {usePalette} from 'lib/hooks/usePalette' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' +import {s} from 'lib/styles' import React from 'react' import {View} from 'react-native' -import {useFocusEffect} from '@react-navigation/native' -import {Text} from 'view/com/util/text/Text' import {TextLink} from 'view/com/util/Link' -import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types' -import {ViewHeader} from '../com/util/ViewHeader' +import {Text} from 'view/com/util/text/Text' import {ScrollView} from 'view/com/util/Views' -import {usePalette} from 'lib/hooks/usePalette' -import {s} from 'lib/styles' + import {useSetMinimalShellMode} from '#/state/shell' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' + +import {ViewHeader} from '../com/util/ViewHeader' type Props = NativeStackScreenProps< CommonNavigatorParams, diff --git a/src/view/screens/CopyrightPolicy.tsx b/src/view/screens/CopyrightPolicy.tsx index 522a9e4db..0288eaa4e 100644 --- a/src/view/screens/CopyrightPolicy.tsx +++ b/src/view/screens/CopyrightPolicy.tsx @@ -1,16 +1,18 @@ +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useFocusEffect} from '@react-navigation/native' +import {usePalette} from 'lib/hooks/usePalette' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' +import {s} from 'lib/styles' import React from 'react' import {View} from 'react-native' -import {useFocusEffect} from '@react-navigation/native' -import {Text} from 'view/com/util/text/Text' import {TextLink} from 'view/com/util/Link' -import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types' -import {ViewHeader} from '../com/util/ViewHeader' +import {Text} from 'view/com/util/text/Text' import {ScrollView} from 'view/com/util/Views' -import {usePalette} from 'lib/hooks/usePalette' -import {s} from 'lib/styles' + import {useSetMinimalShellMode} from '#/state/shell' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' + +import {ViewHeader} from '../com/util/ViewHeader' type Props = NativeStackScreenProps<CommonNavigatorParams, 'CopyrightPolicy'> export const CopyrightPolicyScreen = (_props: Props) => { diff --git a/src/view/screens/Debug.tsx b/src/view/screens/Debug.tsx index f26b1505a..226e7a9f0 100644 --- a/src/view/screens/Debug.tsx +++ b/src/view/screens/Debug.tsx @@ -1,23 +1,24 @@ -import React from 'react' -import {ScrollView, View} from 'react-native' -import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types' -import {ViewHeader} from '../com/util/ViewHeader' -import {ThemeProvider, PaletteColorName} from 'lib/ThemeContext' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {usePalette} from 'lib/hooks/usePalette' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' import {s} from 'lib/styles' +import {PaletteColorName, ThemeProvider} from 'lib/ThemeContext' +import React from 'react' +import {ScrollView, View} from 'react-native' import * as Toast from 'view/com/util/Toast' -import {Text} from '../com/util/text/Text' -import {ViewSelector} from '../com/util/ViewSelector' + import {EmptyState} from '../com/util/EmptyState' -import * as LoadingPlaceholder from '../com/util/LoadingPlaceholder' +import {ErrorMessage} from '../com/util/error/ErrorMessage' +import {ErrorScreen} from '../com/util/error/ErrorScreen' import {Button, ButtonType} from '../com/util/forms/Button' import {DropdownButton, DropdownItem} from '../com/util/forms/DropdownButton' -import {ToggleButton} from '../com/util/forms/ToggleButton' import {RadioGroup} from '../com/util/forms/RadioGroup' -import {ErrorScreen} from '../com/util/error/ErrorScreen' -import {ErrorMessage} from '../com/util/error/ErrorMessage' -import {msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' +import {ToggleButton} from '../com/util/forms/ToggleButton' +import * as LoadingPlaceholder from '../com/util/LoadingPlaceholder' +import {Text} from '../com/util/text/Text' +import {ViewHeader} from '../com/util/ViewHeader' +import {ViewSelector} from '../com/util/ViewSelector' const MAIN_VIEWS = ['Base', 'Controls', 'Error', 'Notifs'] diff --git a/src/view/screens/Feeds.tsx b/src/view/screens/Feeds.tsx index 2e3bf08db..05377b8fb 100644 --- a/src/view/screens/Feeds.tsx +++ b/src/view/screens/Feeds.tsx @@ -1,52 +1,53 @@ +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {FontAwesomeIconStyle} from '@fortawesome/react-native-fontawesome' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useFocusEffect} from '@react-navigation/native' +import {HITSLOP_10} from 'lib/constants' +import {usePalette} from 'lib/hooks/usePalette' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {CogIcon, ComposeIcon2, MagnifyingGlassIcon2} from 'lib/icons' +import {FeedsTabNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' +import {cleanError} from 'lib/strings/errors' +import {s} from 'lib/styles' +import debounce from 'lodash.debounce' import React from 'react' import { ActivityIndicator, - StyleSheet, - View, type FlatList, Pressable, + StyleSheet, + View, } from 'react-native' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import {FontAwesomeIconStyle} from '@fortawesome/react-native-fontawesome' -import {ViewHeader} from 'view/com/util/ViewHeader' +import {FeedSourceCard} from 'view/com/feeds/FeedSourceCard' +import {ErrorMessage} from 'view/com/util/error/ErrorMessage' import {FAB} from 'view/com/util/fab/FAB' -import {Link} from 'view/com/util/Link' -import {NativeStackScreenProps, FeedsTabNavigatorParams} from 'lib/routes/types' -import {usePalette} from 'lib/hooks/usePalette' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {ComposeIcon2, CogIcon, MagnifyingGlassIcon2} from 'lib/icons' -import {s} from 'lib/styles' -import {atoms as a, useTheme} from '#/alf' import {SearchInput, SearchInputRef} from 'view/com/util/forms/SearchInput' -import {UserAvatar} from 'view/com/util/UserAvatar' +import {Link} from 'view/com/util/Link' +import {List} from 'view/com/util/List' import { - LoadingPlaceholder, FeedFeedLoadingPlaceholder, + LoadingPlaceholder, } from 'view/com/util/LoadingPlaceholder' -import {ErrorMessage} from 'view/com/util/error/ErrorMessage' -import debounce from 'lodash.debounce' import {Text} from 'view/com/util/text/Text' -import {List} from 'view/com/util/List' -import {useFocusEffect} from '@react-navigation/native' -import {FeedSourceCard} from 'view/com/feeds/FeedSourceCard' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {useSetMinimalShellMode} from '#/state/shell' -import {usePreferencesQuery} from '#/state/queries/preferences' +import {UserAvatar} from 'view/com/util/UserAvatar' +import {ViewHeader} from 'view/com/util/ViewHeader' + +import {atoms as a, useTheme} from '#/alf' +import {IconCircle} from '#/components/IconCircle' +import {ListMagnifyingGlass_Stroke2_Corner0_Rounded} from '#/components/icons/ListMagnifyingGlass' +import {ListSparkle_Stroke2_Corner0_Rounded} from '#/components/icons/ListSparkle' +import {isNative, isWeb} from '#/platform/detection' import { + getAvatarTypeFromUri, useFeedSourceInfoQuery, useGetPopularFeedsQuery, useSearchPopularFeedsMutation, - getAvatarTypeFromUri, } from '#/state/queries/feed' -import {cleanError} from 'lib/strings/errors' -import {useComposerControls} from '#/state/shell/composer' +import {usePreferencesQuery} from '#/state/queries/preferences' import {useSession} from '#/state/session' -import {isNative, isWeb} from '#/platform/detection' -import {HITSLOP_10} from 'lib/constants' -import {IconCircle} from '#/components/IconCircle' -import {ListSparkle_Stroke2_Corner0_Rounded} from '#/components/icons/ListSparkle' -import {ListMagnifyingGlass_Stroke2_Corner0_Rounded} from '#/components/icons/ListMagnifyingGlass' +import {useSetMinimalShellMode} from '#/state/shell' +import {useComposerControls} from '#/state/shell/composer' type Props = NativeStackScreenProps<FeedsTabNavigatorParams, 'Feeds'> diff --git a/src/view/screens/Home.tsx b/src/view/screens/Home.tsx index 99ac8c44a..ad48d0aa1 100644 --- a/src/view/screens/Home.tsx +++ b/src/view/screens/Home.tsx @@ -1,23 +1,25 @@ -import React from 'react' -import {View, ActivityIndicator, StyleSheet} from 'react-native' import {useFocusEffect} from '@react-navigation/native' -import {NativeStackScreenProps, HomeTabNavigatorParams} from 'lib/routes/types' -import {FeedDescriptor, FeedParams} from '#/state/queries/post-feed' +import {HomeTabNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' +import React from 'react' +import {ActivityIndicator, StyleSheet, View} from 'react-native' +import {FeedPage} from 'view/com/feeds/FeedPage' +import {Pager, PagerRef, RenderTabBarFnProps} from 'view/com/pager/Pager' +import {CustomFeedEmptyState} from 'view/com/posts/CustomFeedEmptyState' import {FollowingEmptyState} from 'view/com/posts/FollowingEmptyState' import {FollowingEndOfFeed} from 'view/com/posts/FollowingEndOfFeed' -import {CustomFeedEmptyState} from 'view/com/posts/CustomFeedEmptyState' -import {HomeHeader} from '../com/home/HomeHeader' -import {Pager, RenderTabBarFnProps, PagerRef} from 'view/com/pager/Pager' -import {FeedPage} from 'view/com/feeds/FeedPage' -import {HomeLoggedOutCTA} from '../com/auth/HomeLoggedOutCTA' -import {useSetMinimalShellMode, useSetDrawerSwipeDisabled} from '#/state/shell' + +import {useSetTitle} from '#/lib/hooks/useSetTitle' +import {emitSoftReset} from '#/state/events' +import {FeedSourceInfo, usePinnedFeedsInfos} from '#/state/queries/feed' +import {FeedDescriptor, FeedParams} from '#/state/queries/post-feed' import {usePreferencesQuery} from '#/state/queries/preferences' -import {usePinnedFeedsInfos, FeedSourceInfo} from '#/state/queries/feed' import {UsePreferencesQueryResponse} from '#/state/queries/preferences/types' -import {emitSoftReset} from '#/state/events' import {useSession} from '#/state/session' +import {useSetDrawerSwipeDisabled, useSetMinimalShellMode} from '#/state/shell' import {useSelectedFeed, useSetSelectedFeed} from '#/state/shell/selected-feed' -import {useSetTitle} from '#/lib/hooks/useSetTitle' + +import {HomeLoggedOutCTA} from '../com/auth/HomeLoggedOutCTA' +import {HomeHeader} from '../com/home/HomeHeader' type Props = NativeStackScreenProps<HomeTabNavigatorParams, 'Home'> export function HomeScreen(props: Props) { diff --git a/src/view/screens/LanguageSettings.tsx b/src/view/screens/LanguageSettings.tsx index 819840a46..02251102a 100644 --- a/src/view/screens/LanguageSettings.tsx +++ b/src/view/screens/LanguageSettings.tsx @@ -1,27 +1,29 @@ -import React from 'react' -import {StyleSheet, View} from 'react-native' -import {Text} from '../com/util/text/Text' -import {s} from 'lib/styles' -import {usePalette} from 'lib/hooks/usePalette' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' -import {ViewHeader} from 'view/com/util/ViewHeader' -import {CenteredView} from 'view/com/util/Views' -import {Button} from 'view/com/util/forms/Button' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' -import {useAnalytics} from 'lib/analytics/analytics' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {useFocusEffect} from '@react-navigation/native' import {APP_LANGUAGES, LANGUAGES} from 'lib/../locale/languages' +import {useAnalytics} from 'lib/analytics/analytics' +import {usePalette} from 'lib/hooks/usePalette' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' +import {s} from 'lib/styles' +import React from 'react' +import {StyleSheet, View} from 'react-native' import RNPickerSelect, {PickerSelectProps} from 'react-native-picker-select' -import {useSetMinimalShellMode} from '#/state/shell' +import {Button} from 'view/com/util/forms/Button' +import {ViewHeader} from 'view/com/util/ViewHeader' +import {CenteredView} from 'view/com/util/Views' + +import {sanitizeAppLanguageSetting} from '#/locale/helpers' import {useModalControls} from '#/state/modals' import {useLanguagePrefs, useLanguagePrefsApi} from '#/state/preferences' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {sanitizeAppLanguageSetting} from '#/locale/helpers' +import {useSetMinimalShellMode} from '#/state/shell' + +import {Text} from '../com/util/text/Text' type Props = NativeStackScreenProps<CommonNavigatorParams, 'LanguageSettings'> diff --git a/src/view/screens/Lists.tsx b/src/view/screens/Lists.tsx index bdd5dd9b7..d57e6a714 100644 --- a/src/view/screens/Lists.tsx +++ b/src/view/screens/Lists.tsx @@ -1,20 +1,21 @@ -import React from 'react' -import {View} from 'react-native' -import {useFocusEffect, useNavigation} from '@react-navigation/native' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' import {AtUri} from '@atproto/api' -import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types' -import {MyLists} from '#/view/com/lists/MyLists' -import {Text} from 'view/com/util/text/Text' -import {Button} from 'view/com/util/forms/Button' -import {NavigationProp} from 'lib/routes/types' +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {Trans} from '@lingui/macro' +import {useFocusEffect, useNavigation} from '@react-navigation/native' import {usePalette} from 'lib/hooks/usePalette' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {SimpleViewHeader} from 'view/com/util/SimpleViewHeader' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' +import {NavigationProp} from 'lib/routes/types' import {s} from 'lib/styles' -import {useSetMinimalShellMode} from '#/state/shell' +import React from 'react' +import {View} from 'react-native' +import {Button} from 'view/com/util/forms/Button' +import {SimpleViewHeader} from 'view/com/util/SimpleViewHeader' +import {Text} from 'view/com/util/text/Text' + import {useModalControls} from '#/state/modals' -import {Trans} from '@lingui/macro' +import {useSetMinimalShellMode} from '#/state/shell' +import {MyLists} from '#/view/com/lists/MyLists' type Props = NativeStackScreenProps<CommonNavigatorParams, 'Lists'> export function ListsScreen({}: Props) { diff --git a/src/view/screens/Log.tsx b/src/view/screens/Log.tsx index e727a1fb8..eabf66bf0 100644 --- a/src/view/screens/Log.tsx +++ b/src/view/screens/Log.tsx @@ -1,19 +1,21 @@ -import React from 'react' -import {StyleSheet, TouchableOpacity, View} from 'react-native' -import {useFocusEffect} from '@react-navigation/native' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types' -import {ScrollView} from '../com/util/Views' -import {s} from 'lib/styles' -import {ViewHeader} from '../com/util/ViewHeader' -import {Text} from '../com/util/text/Text' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useFocusEffect} from '@react-navigation/native' import {usePalette} from 'lib/hooks/usePalette' -import {getEntries} from '#/logger/logDump' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' import {ago} from 'lib/strings/time' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' +import {s} from 'lib/styles' +import React from 'react' +import {StyleSheet, TouchableOpacity, View} from 'react-native' + +import {getEntries} from '#/logger/logDump' import {useSetMinimalShellMode} from '#/state/shell' +import {Text} from '../com/util/text/Text' +import {ViewHeader} from '../com/util/ViewHeader' +import {ScrollView} from '../com/util/Views' + export function LogScreen({}: NativeStackScreenProps< CommonNavigatorParams, 'Log' diff --git a/src/view/screens/Moderation.tsx b/src/view/screens/Moderation.tsx index 928766c30..5b06ab845 100644 --- a/src/view/screens/Moderation.tsx +++ b/src/view/screens/Moderation.tsx @@ -1,3 +1,16 @@ +import {ComAtprotoLabelDefs} from '@atproto/api' +import { + FontAwesomeIcon, + FontAwesomeIconStyle, +} from '@fortawesome/react-native-fontawesome' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useFocusEffect} from '@react-navigation/native' +import {useAnalytics} from 'lib/analytics/analytics' +import {usePalette} from 'lib/hooks/usePalette' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' +import {s} from 'lib/styles' import React from 'react' import { ActivityIndicator, @@ -5,33 +18,22 @@ import { TouchableOpacity, View, } from 'react-native' -import {useFocusEffect} from '@react-navigation/native' -import { - FontAwesomeIcon, - FontAwesomeIconStyle, -} from '@fortawesome/react-native-fontawesome' -import {ComAtprotoLabelDefs} from '@atproto/api' -import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types' -import {s} from 'lib/styles' -import {CenteredView} from '../com/util/Views' -import {ViewHeader} from '../com/util/ViewHeader' -import {Link, TextLink} from '../com/util/Link' -import {Text} from '../com/util/text/Text' -import {usePalette} from 'lib/hooks/usePalette' -import {useAnalytics} from 'lib/analytics/analytics' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {useSetMinimalShellMode} from '#/state/shell' + +import {useGlobalDialogsControlContext} from '#/components/dialogs/Context' import {useModalControls} from '#/state/modals' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {ToggleButton} from '../com/util/forms/ToggleButton' -import {useSession} from '#/state/session' import { useProfileQuery, useProfileUpdateMutation, } from '#/state/queries/profile' +import {useSession} from '#/state/session' +import {useSetMinimalShellMode} from '#/state/shell' + +import {ToggleButton} from '../com/util/forms/ToggleButton' +import {Link, TextLink} from '../com/util/Link' +import {Text} from '../com/util/text/Text' +import {ViewHeader} from '../com/util/ViewHeader' +import {CenteredView} from '../com/util/Views' import {ScrollView} from '../com/util/Views' -import {useGlobalDialogsControlContext} from '#/components/dialogs/Context' type Props = NativeStackScreenProps<CommonNavigatorParams, 'Moderation'> export function ModerationScreen({}: Props) { diff --git a/src/view/screens/ModerationBlockedAccounts.tsx b/src/view/screens/ModerationBlockedAccounts.tsx index 09d77987f..9c25764f8 100644 --- a/src/view/screens/ModerationBlockedAccounts.tsx +++ b/src/view/screens/ModerationBlockedAccounts.tsx @@ -1,3 +1,12 @@ +import {AppBskyActorDefs as ActorDefs} from '@atproto/api' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useFocusEffect} from '@react-navigation/native' +import {NativeStackScreenProps} from '@react-navigation/native-stack' +import {useAnalytics} from 'lib/analytics/analytics' +import {usePalette} from 'lib/hooks/usePalette' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {CommonNavigatorParams} from 'lib/routes/types' import React from 'react' import { ActivityIndicator, @@ -6,24 +15,17 @@ import { StyleSheet, View, } from 'react-native' -import {AppBskyActorDefs as ActorDefs} from '@atproto/api' -import {Text} from '../com/util/text/Text' -import {usePalette} from 'lib/hooks/usePalette' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {NativeStackScreenProps} from '@react-navigation/native-stack' -import {CommonNavigatorParams} from 'lib/routes/types' -import {useAnalytics} from 'lib/analytics/analytics' -import {useFocusEffect} from '@react-navigation/native' -import {ViewHeader} from '../com/util/ViewHeader' -import {CenteredView} from 'view/com/util/Views' -import {ErrorScreen} from '../com/util/error/ErrorScreen' import {ProfileCard} from 'view/com/profile/ProfileCard' +import {CenteredView} from 'view/com/util/Views' + +import {cleanError} from '#/lib/strings/errors' import {logger} from '#/logger' -import {useSetMinimalShellMode} from '#/state/shell' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' import {useMyBlockedAccountsQuery} from '#/state/queries/my-blocked-accounts' -import {cleanError} from '#/lib/strings/errors' +import {useSetMinimalShellMode} from '#/state/shell' + +import {ErrorScreen} from '../com/util/error/ErrorScreen' +import {Text} from '../com/util/text/Text' +import {ViewHeader} from '../com/util/ViewHeader' type Props = NativeStackScreenProps< CommonNavigatorParams, diff --git a/src/view/screens/ModerationModlists.tsx b/src/view/screens/ModerationModlists.tsx index b7d993acc..6d9e41384 100644 --- a/src/view/screens/ModerationModlists.tsx +++ b/src/view/screens/ModerationModlists.tsx @@ -1,20 +1,21 @@ -import React from 'react' -import {View} from 'react-native' -import {useFocusEffect, useNavigation} from '@react-navigation/native' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' import {AtUri} from '@atproto/api' -import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types' -import {MyLists} from '#/view/com/lists/MyLists' -import {Text} from 'view/com/util/text/Text' -import {Button} from 'view/com/util/forms/Button' -import {NavigationProp} from 'lib/routes/types' +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {Trans} from '@lingui/macro' +import {useFocusEffect, useNavigation} from '@react-navigation/native' import {usePalette} from 'lib/hooks/usePalette' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {SimpleViewHeader} from 'view/com/util/SimpleViewHeader' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' +import {NavigationProp} from 'lib/routes/types' import {s} from 'lib/styles' -import {useSetMinimalShellMode} from '#/state/shell' +import React from 'react' +import {View} from 'react-native' +import {Button} from 'view/com/util/forms/Button' +import {SimpleViewHeader} from 'view/com/util/SimpleViewHeader' +import {Text} from 'view/com/util/text/Text' + import {useModalControls} from '#/state/modals' -import {Trans} from '@lingui/macro' +import {useSetMinimalShellMode} from '#/state/shell' +import {MyLists} from '#/view/com/lists/MyLists' type Props = NativeStackScreenProps<CommonNavigatorParams, 'ModerationModlists'> export function ModerationModlistsScreen({}: Props) { diff --git a/src/view/screens/ModerationMutedAccounts.tsx b/src/view/screens/ModerationMutedAccounts.tsx index 1aff19dd3..635c9f468 100644 --- a/src/view/screens/ModerationMutedAccounts.tsx +++ b/src/view/screens/ModerationMutedAccounts.tsx @@ -1,3 +1,12 @@ +import {AppBskyActorDefs as ActorDefs} from '@atproto/api' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useFocusEffect} from '@react-navigation/native' +import {NativeStackScreenProps} from '@react-navigation/native-stack' +import {useAnalytics} from 'lib/analytics/analytics' +import {usePalette} from 'lib/hooks/usePalette' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {CommonNavigatorParams} from 'lib/routes/types' import React from 'react' import { ActivityIndicator, @@ -6,24 +15,17 @@ import { StyleSheet, View, } from 'react-native' -import {AppBskyActorDefs as ActorDefs} from '@atproto/api' -import {Text} from '../com/util/text/Text' -import {usePalette} from 'lib/hooks/usePalette' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {NativeStackScreenProps} from '@react-navigation/native-stack' -import {CommonNavigatorParams} from 'lib/routes/types' -import {useAnalytics} from 'lib/analytics/analytics' -import {useFocusEffect} from '@react-navigation/native' -import {ViewHeader} from '../com/util/ViewHeader' -import {CenteredView} from 'view/com/util/Views' -import {ErrorScreen} from '../com/util/error/ErrorScreen' import {ProfileCard} from 'view/com/profile/ProfileCard' +import {CenteredView} from 'view/com/util/Views' + +import {cleanError} from '#/lib/strings/errors' import {logger} from '#/logger' -import {useSetMinimalShellMode} from '#/state/shell' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' import {useMyMutedAccountsQuery} from '#/state/queries/my-muted-accounts' -import {cleanError} from '#/lib/strings/errors' +import {useSetMinimalShellMode} from '#/state/shell' + +import {ErrorScreen} from '../com/util/error/ErrorScreen' +import {Text} from '../com/util/text/Text' +import {ViewHeader} from '../com/util/ViewHeader' type Props = NativeStackScreenProps< CommonNavigatorParams, diff --git a/src/view/screens/NotFound.tsx b/src/view/screens/NotFound.tsx index dfa840abb..d101a45b7 100644 --- a/src/view/screens/NotFound.tsx +++ b/src/view/screens/NotFound.tsx @@ -1,19 +1,21 @@ -import React from 'react' -import {StyleSheet, View} from 'react-native' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import { - useNavigation, StackActions, useFocusEffect, + useNavigation, } from '@react-navigation/native' -import {ViewHeader} from '../com/util/ViewHeader' -import {Text} from '../com/util/text/Text' -import {Button} from 'view/com/util/forms/Button' -import {NavigationProp} from 'lib/routes/types' import {usePalette} from 'lib/hooks/usePalette' +import {NavigationProp} from 'lib/routes/types' import {s} from 'lib/styles' +import React from 'react' +import {StyleSheet, View} from 'react-native' +import {Button} from 'view/com/util/forms/Button' + import {useSetMinimalShellMode} from '#/state/shell' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' + +import {Text} from '../com/util/text/Text' +import {ViewHeader} from '../com/util/ViewHeader' export const NotFoundScreen = () => { const pal = usePalette('default') diff --git a/src/view/screens/Notifications.tsx b/src/view/screens/Notifications.tsx index 48c834a28..030f73bd8 100644 --- a/src/view/screens/Notifications.tsx +++ b/src/view/screens/Notifications.tsx @@ -1,38 +1,40 @@ -import React from 'react' -import {View} from 'react-native' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {useFocusEffect, useIsFocused} from '@react-navigation/native' import {useQueryClient} from '@tanstack/react-query' +import {useAnalytics} from 'lib/analytics/analytics' +import {usePalette} from 'lib/hooks/usePalette' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {ComposeIcon2} from 'lib/icons' import { NativeStackScreenProps, NotificationsTabNavigatorParams, } from 'lib/routes/types' -import {ViewHeader} from '../com/util/ViewHeader' -import {Feed} from '../com/notifications/Feed' +import {colors, s} from 'lib/styles' +import React from 'react' +import {View} from 'react-native' import {TextLink} from 'view/com/util/Link' import {ListMethods} from 'view/com/util/List' import {LoadLatestBtn} from 'view/com/util/load-latest/LoadLatestBtn' -import {MainScrollProvider} from '../com/util/MainScrollProvider' -import {usePalette} from 'lib/hooks/usePalette' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {s, colors} from 'lib/styles' -import {useAnalytics} from 'lib/analytics/analytics' + +import {useNonReactiveCallback} from '#/lib/hooks/useNonReactiveCallback' import {logger} from '#/logger' -import {useSetMinimalShellMode} from '#/state/shell' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' +import {isNative} from '#/platform/detection' +import {emitSoftReset, listenSoftReset} from '#/state/events' +import {RQKEY as NOTIFS_RQKEY} from '#/state/queries/notifications/feed' import { useUnreadNotifications, useUnreadNotificationsApi, } from '#/state/queries/notifications/unread' -import {RQKEY as NOTIFS_RQKEY} from '#/state/queries/notifications/feed' -import {listenSoftReset, emitSoftReset} from '#/state/events' import {truncateAndInvalidate} from '#/state/queries/util' -import {useNonReactiveCallback} from '#/lib/hooks/useNonReactiveCallback' -import {isNative} from '#/platform/detection' -import {FAB} from '../com/util/fab/FAB' -import {ComposeIcon2} from 'lib/icons' +import {useSetMinimalShellMode} from '#/state/shell' import {useComposerControls} from '#/state/shell/composer' +import {Feed} from '../com/notifications/Feed' +import {FAB} from '../com/util/fab/FAB' +import {MainScrollProvider} from '../com/util/MainScrollProvider' +import {ViewHeader} from '../com/util/ViewHeader' + type Props = NativeStackScreenProps< NotificationsTabNavigatorParams, 'Notifications' diff --git a/src/view/screens/PostLikedBy.tsx b/src/view/screens/PostLikedBy.tsx index 604301544..cfc1997f8 100644 --- a/src/view/screens/PostLikedBy.tsx +++ b/src/view/screens/PostLikedBy.tsx @@ -1,13 +1,15 @@ -import React from 'react' -import {View} from 'react-native' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {useFocusEffect} from '@react-navigation/native' -import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types' -import {ViewHeader} from '../com/util/ViewHeader' -import {PostLikedBy as PostLikedByComponent} from '../com/post-thread/PostLikedBy' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' import {makeRecordUri} from 'lib/strings/url-helpers' +import React from 'react' +import {View} from 'react-native' + import {useSetMinimalShellMode} from '#/state/shell' -import {msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' + +import {PostLikedBy as PostLikedByComponent} from '../com/post-thread/PostLikedBy' +import {ViewHeader} from '../com/util/ViewHeader' type Props = NativeStackScreenProps<CommonNavigatorParams, 'PostLikedBy'> export const PostLikedByScreen = ({route}: Props) => { diff --git a/src/view/screens/PostRepostedBy.tsx b/src/view/screens/PostRepostedBy.tsx index 07017d692..46beb7ed9 100644 --- a/src/view/screens/PostRepostedBy.tsx +++ b/src/view/screens/PostRepostedBy.tsx @@ -1,13 +1,15 @@ -import React from 'react' -import {View} from 'react-native' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {useFocusEffect} from '@react-navigation/native' -import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types' -import {ViewHeader} from '../com/util/ViewHeader' -import {PostRepostedBy as PostRepostedByComponent} from '../com/post-thread/PostRepostedBy' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' import {makeRecordUri} from 'lib/strings/url-helpers' +import React from 'react' +import {View} from 'react-native' + import {useSetMinimalShellMode} from '#/state/shell' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' + +import {PostRepostedBy as PostRepostedByComponent} from '../com/post-thread/PostRepostedBy' +import {ViewHeader} from '../com/util/ViewHeader' type Props = NativeStackScreenProps<CommonNavigatorParams, 'PostRepostedBy'> export const PostRepostedByScreen = ({route}: Props) => { diff --git a/src/view/screens/PostThread.tsx b/src/view/screens/PostThread.tsx index aa09ab9ed..5ae68db2e 100644 --- a/src/view/screens/PostThread.tsx +++ b/src/view/screens/PostThread.tsx @@ -1,28 +1,30 @@ -import React from 'react' -import {StyleSheet, View} from 'react-native' -import Animated from 'react-native-reanimated' import {useFocusEffect} from '@react-navigation/native' import {useQueryClient} from '@tanstack/react-query' -import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types' +import {useMinimalShellMode} from 'lib/hooks/useMinimalShellMode' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' import {makeRecordUri} from 'lib/strings/url-helpers' -import {PostThread as PostThreadComponent} from '../com/post-thread/PostThread' -import {ComposePrompt} from 'view/com/composer/Prompt' import {s} from 'lib/styles' +import {clamp} from 'lodash' +import React from 'react' +import {StyleSheet, View} from 'react-native' +import Animated from 'react-native-reanimated' import {useSafeAreaInsets} from 'react-native-safe-area-context' +import {ComposePrompt} from 'view/com/composer/Prompt' + +import {isWeb} from '#/platform/detection' import { RQKEY as POST_THREAD_RQKEY, ThreadNode, } from '#/state/queries/post-thread' -import {clamp} from 'lodash' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {useMinimalShellMode} from 'lib/hooks/useMinimalShellMode' -import {useSetMinimalShellMode} from '#/state/shell' import {useResolveUriQuery} from '#/state/queries/resolve-uri' +import {useSession} from '#/state/session' +import {useSetMinimalShellMode} from '#/state/shell' +import {useComposerControls} from '#/state/shell/composer' + +import {PostThread as PostThreadComponent} from '../com/post-thread/PostThread' import {ErrorMessage} from '../com/util/error/ErrorMessage' import {CenteredView} from '../com/util/Views' -import {useComposerControls} from '#/state/shell/composer' -import {useSession} from '#/state/session' -import {isWeb} from '#/platform/detection' type Props = NativeStackScreenProps<CommonNavigatorParams, 'PostThread'> export function PostThreadScreen({route}: Props) { diff --git a/src/view/screens/PreferencesExternalEmbeds.tsx b/src/view/screens/PreferencesExternalEmbeds.tsx index 1e8cedf7e..668d7a7b1 100644 --- a/src/view/screens/PreferencesExternalEmbeds.tsx +++ b/src/view/screens/PreferencesExternalEmbeds.tsx @@ -1,25 +1,27 @@ -import React from 'react' -import {StyleSheet, View} from 'react-native' +import {Trans} from '@lingui/macro' import {useFocusEffect} from '@react-navigation/native' -import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types' -import {s} from 'lib/styles' -import {Text} from '../com/util/text/Text' -import {usePalette} from 'lib/hooks/usePalette' import {useAnalytics} from 'lib/analytics/analytics' +import {usePalette} from 'lib/hooks/usePalette' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import { - EmbedPlayerSource, - externalEmbedLabels, -} from '#/lib/strings/embed-player' -import {useSetMinimalShellMode} from '#/state/shell' -import {Trans} from '@lingui/macro' -import {ScrollView} from '../com/util/Views' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' +import {s} from 'lib/styles' +import React from 'react' +import {StyleSheet, View} from 'react-native' import { useExternalEmbedsPrefs, useSetExternalEmbedPref, } from 'state/preferences' import {ToggleButton} from 'view/com/util/forms/ToggleButton' + +import { + EmbedPlayerSource, + externalEmbedLabels, +} from '#/lib/strings/embed-player' +import {useSetMinimalShellMode} from '#/state/shell' + import {SimpleViewHeader} from '../com/util/SimpleViewHeader' +import {Text} from '../com/util/text/Text' +import {ScrollView} from '../com/util/Views' type Props = NativeStackScreenProps< CommonNavigatorParams, diff --git a/src/view/screens/PreferencesFollowingFeed.tsx b/src/view/screens/PreferencesFollowingFeed.tsx index b4acbcd44..4062bea01 100644 --- a/src/view/screens/PreferencesFollowingFeed.tsx +++ b/src/view/screens/PreferencesFollowingFeed.tsx @@ -1,24 +1,26 @@ -import React, {useState} from 'react' -import {ScrollView, StyleSheet, TouchableOpacity, View} from 'react-native' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {Slider} from '@miblanchard/react-native-slider' -import {Text} from '../com/util/text/Text' -import {s, colors} from 'lib/styles' import {usePalette} from 'lib/hooks/usePalette' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' +import {colors, s} from 'lib/styles' +import debounce from 'lodash.debounce' import {isWeb} from 'platform/detection' +import React, {useState} from 'react' +import {ScrollView, StyleSheet, TouchableOpacity, View} from 'react-native' import {ToggleButton} from 'view/com/util/forms/ToggleButton' -import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' import {ViewHeader} from 'view/com/util/ViewHeader' import {CenteredView} from 'view/com/util/Views' -import debounce from 'lodash.debounce' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' + import { usePreferencesQuery, useSetFeedViewPreferencesMutation, } from '#/state/queries/preferences' +import {Text} from '../com/util/text/Text' + function RepliesThresholdInput({ enabled, initialValue, diff --git a/src/view/screens/PreferencesThreads.tsx b/src/view/screens/PreferencesThreads.tsx index 321c67293..3e4abb7db 100644 --- a/src/view/screens/PreferencesThreads.tsx +++ b/src/view/screens/PreferencesThreads.tsx @@ -1,3 +1,10 @@ +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 {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' +import {colors, s} from 'lib/styles' import React from 'react' import { ActivityIndicator, @@ -6,23 +13,18 @@ import { TouchableOpacity, View, } from 'react-native' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import {Text} from '../com/util/text/Text' -import {s, colors} from 'lib/styles' -import {usePalette} from 'lib/hooks/usePalette' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {ToggleButton} from 'view/com/util/forms/ToggleButton' import {RadioGroup} from 'view/com/util/forms/RadioGroup' -import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' +import {ToggleButton} from 'view/com/util/forms/ToggleButton' import {ViewHeader} from 'view/com/util/ViewHeader' import {CenteredView} from 'view/com/util/Views' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' + import { usePreferencesQuery, useSetThreadViewPreferencesMutation, } from '#/state/queries/preferences' +import {Text} from '../com/util/text/Text' + type Props = NativeStackScreenProps<CommonNavigatorParams, 'PreferencesThreads'> export function PreferencesThreads({navigation}: Props) { const pal = usePalette('default') diff --git a/src/view/screens/PrivacyPolicy.tsx b/src/view/screens/PrivacyPolicy.tsx index 776d83918..ff92909c9 100644 --- a/src/view/screens/PrivacyPolicy.tsx +++ b/src/view/screens/PrivacyPolicy.tsx @@ -1,16 +1,18 @@ +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useFocusEffect} from '@react-navigation/native' +import {usePalette} from 'lib/hooks/usePalette' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' +import {s} from 'lib/styles' import React from 'react' import {View} from 'react-native' -import {useFocusEffect} from '@react-navigation/native' -import {Text} from 'view/com/util/text/Text' import {TextLink} from 'view/com/util/Link' -import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types' -import {ViewHeader} from '../com/util/ViewHeader' +import {Text} from 'view/com/util/text/Text' import {ScrollView} from 'view/com/util/Views' -import {usePalette} from 'lib/hooks/usePalette' -import {s} from 'lib/styles' + import {useSetMinimalShellMode} from '#/state/shell' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' + +import {ViewHeader} from '../com/util/ViewHeader' type Props = NativeStackScreenProps<CommonNavigatorParams, 'PrivacyPolicy'> export const PrivacyPolicyScreen = (_props: Props) => { diff --git a/src/view/screens/Profile.tsx b/src/view/screens/Profile.tsx index b30b4491b..f2c0af855 100644 --- a/src/view/screens/Profile.tsx +++ b/src/view/screens/Profile.tsx @@ -1,6 +1,3 @@ -import React, {useMemo} from 'react' -import {StyleSheet, View} from 'react-native' -import {useFocusEffect} from '@react-navigation/native' import { AppBskyActorDefs, moderateProfile, @@ -9,45 +6,50 @@ import { } from '@atproto/api' import {msg, Trans} from '@lingui/macro' import {useLingui} from '@lingui/react' -import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types' -import {CenteredView} from '../com/util/Views' -import {ListRef} from '../com/util/List' -import {ScreenHider} from 'view/com/util/moderation/ScreenHider' -import {Feed} from 'view/com/posts/Feed' -import {ProfileLists} from '../com/lists/ProfileLists' -import {ProfileFeedgens} from '../com/feeds/ProfileFeedgens' -import {ProfileHeader, ProfileHeaderLoading} from '../com/profile/ProfileHeader' -import {PagerWithHeader} from 'view/com/pager/PagerWithHeader' -import {ErrorScreen} from '../com/util/error/ErrorScreen' -import {EmptyState} from '../com/util/EmptyState' -import {FAB} from '../com/util/fab/FAB' -import {s, colors} from 'lib/styles' +import {useFocusEffect} from '@react-navigation/native' +import {useQueryClient} from '@tanstack/react-query' import {useAnalytics} from 'lib/analytics/analytics' -import {ComposeIcon2} from 'lib/icons' +import {usePalette} from 'lib/hooks/usePalette' import {useSetTitle} from 'lib/hooks/useSetTitle' +import {ComposeIcon2} from 'lib/icons' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' import {combinedDisplayName} from 'lib/strings/display-names' +import {colors, s} from 'lib/styles' +import React, {useMemo} from 'react' +import {StyleSheet, View} from 'react-native' +import {PagerWithHeader} from 'view/com/pager/PagerWithHeader' +import {Feed} from 'view/com/posts/Feed' +import {ScreenHider} from 'view/com/util/moderation/ScreenHider' + +import {cleanError} from '#/lib/strings/errors' +import {isInvalidHandle} from '#/lib/strings/handles' +import {isNative} from '#/platform/detection' +import {useProfileShadow} from '#/state/cache/profile-shadow' +import {listenSoftReset} from '#/state/events' import { FeedDescriptor, resetProfilePostsQueries, } from '#/state/queries/post-feed' -import {useResolveDidQuery} from '#/state/queries/resolve-uri' -import {useProfileQuery} from '#/state/queries/profile' -import {useProfileShadow} from '#/state/cache/profile-shadow' -import {useSession, getAgent} from '#/state/session' +import {RQKEY as FEED_RQKEY} from '#/state/queries/post-feed' import {useModerationOpts} from '#/state/queries/preferences' +import {useProfileQuery} from '#/state/queries/profile' import {useProfileExtraInfoQuery} from '#/state/queries/profile-extra-info' -import {RQKEY as FEED_RQKEY} from '#/state/queries/post-feed' +import {useResolveDidQuery} from '#/state/queries/resolve-uri' +import {truncateAndInvalidate} from '#/state/queries/util' +import {getAgent, useSession} from '#/state/session' import {useSetDrawerSwipeDisabled, useSetMinimalShellMode} from '#/state/shell' -import {cleanError} from '#/lib/strings/errors' -import {LoadLatestBtn} from '../com/util/load-latest/LoadLatestBtn' -import {useQueryClient} from '@tanstack/react-query' import {useComposerControls} from '#/state/shell/composer' -import {listenSoftReset} from '#/state/events' -import {truncateAndInvalidate} from '#/state/queries/util' import {Text} from '#/view/com/util/text/Text' -import {usePalette} from 'lib/hooks/usePalette' -import {isNative} from '#/platform/detection' -import {isInvalidHandle} from '#/lib/strings/handles' + +import {ProfileFeedgens} from '../com/feeds/ProfileFeedgens' +import {ProfileLists} from '../com/lists/ProfileLists' +import {ProfileHeader, ProfileHeaderLoading} from '../com/profile/ProfileHeader' +import {EmptyState} from '../com/util/EmptyState' +import {ErrorScreen} from '../com/util/error/ErrorScreen' +import {FAB} from '../com/util/fab/FAB' +import {ListRef} from '../com/util/List' +import {LoadLatestBtn} from '../com/util/load-latest/LoadLatestBtn' +import {CenteredView} from '../com/util/Views' interface SectionRef { scrollToTop: () => void diff --git a/src/view/screens/ProfileFeed.tsx b/src/view/screens/ProfileFeed.tsx index b3a7328c1..87c8f82b7 100644 --- a/src/view/screens/ProfileFeed.tsx +++ b/src/view/screens/ProfileFeed.tsx @@ -1,70 +1,71 @@ -import React, {useMemo, useCallback} from 'react' -import {StyleSheet, View, Pressable} from 'react-native' -import {NativeStackScreenProps} from '@react-navigation/native-stack' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {useIsFocused, useNavigation} from '@react-navigation/native' +import {NativeStackScreenProps} from '@react-navigation/native-stack' import {useQueryClient} from '@tanstack/react-query' +import {useAnalytics} from 'lib/analytics/analytics' +import {Haptics} from 'lib/haptics' import {usePalette} from 'lib/hooks/usePalette' +import {useSetTitle} from 'lib/hooks/useSetTitle' +import {ComposeIcon2} from 'lib/icons' +import {makeCustomFeedLink} from 'lib/routes/links' import {CommonNavigatorParams} from 'lib/routes/types' +import {NavigationProp} from 'lib/routes/types' +import {shareUrl} from 'lib/sharing' +import {pluralize} from 'lib/strings/helpers' import {makeRecordUri} from 'lib/strings/url-helpers' +import {toShareUrl} from 'lib/strings/url-helpers' import {s} from 'lib/styles' -import {FeedDescriptor} from '#/state/queries/post-feed' +import React, {useCallback, useMemo} from 'react' +import {Pressable, StyleSheet, View} from 'react-native' import {PagerWithHeader} from 'view/com/pager/PagerWithHeader' -import {ProfileSubpageHeader} from 'view/com/profile/ProfileSubpageHeader' import {Feed} from 'view/com/posts/Feed' -import {InlineLink} from '#/components/Link' -import {ListRef} from 'view/com/util/List' +import {ProfileSubpageHeader} from 'view/com/profile/ProfileSubpageHeader' +import {EmptyState} from 'view/com/util/EmptyState' +import {FAB} from 'view/com/util/fab/FAB' import {Button} from 'view/com/util/forms/Button' -import {Text} from 'view/com/util/text/Text' -import {RichText} from '#/components/RichText' +import {ListRef} from 'view/com/util/List' import {LoadLatestBtn} from 'view/com/util/load-latest/LoadLatestBtn' -import {FAB} from 'view/com/util/fab/FAB' -import {EmptyState} from 'view/com/util/EmptyState' import {LoadingScreen} from 'view/com/util/LoadingScreen' +import {Text} from 'view/com/util/text/Text' import * as Toast from 'view/com/util/Toast' -import {useSetTitle} from 'lib/hooks/useSetTitle' -import {RQKEY as FEED_RQKEY} from '#/state/queries/post-feed' -import {shareUrl} from 'lib/sharing' -import {toShareUrl} from 'lib/strings/url-helpers' -import {Haptics} from 'lib/haptics' -import {useAnalytics} from 'lib/analytics/analytics' -import {makeCustomFeedLink} from 'lib/routes/links' -import {pluralize} from 'lib/strings/helpers' import {CenteredView} from 'view/com/util/Views' -import {NavigationProp} from 'lib/routes/types' -import {ComposeIcon2} from 'lib/icons' + +import {atoms as a, useTheme} from '#/alf' +import {Button as NewButton, ButtonText} from '#/components/Button' +import {ArrowOutOfBox_Stroke2_Corner0_Rounded as Share} from '#/components/icons/ArrowOutOfBox' +import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfo} from '#/components/icons/CircleInfo' +import {DotGrid_Stroke2_Corner0_Rounded as Ellipsis} from '#/components/icons/DotGrid' +import { + Heart2_Filled_Stroke2_Corner0_Rounded as HeartFilled, + Heart2_Stroke2_Corner0_Rounded as HeartOutline, +} from '#/components/icons/Heart2' +import {PlusLarge_Stroke2_Corner0_Rounded as Plus} from '#/components/icons/Plus' +import {Trash_Stroke2_Corner0_Rounded as Trash} from '#/components/icons/Trash' +import {InlineLink} from '#/components/Link' +import * as Menu from '#/components/Menu' +import {RichText} from '#/components/RichText' +import {HITSLOP_20} from '#/lib/constants' import {logger} from '#/logger' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' +import {isNative} from '#/platform/detection' +import {listenSoftReset} from '#/state/events' import {useModalControls} from '#/state/modals' -import {useFeedSourceInfoQuery, FeedSourceFeedInfo} from '#/state/queries/feed' -import {useResolveUriQuery} from '#/state/queries/resolve-uri' +import {FeedSourceFeedInfo, useFeedSourceInfoQuery} from '#/state/queries/feed' +import {useLikeMutation, useUnlikeMutation} from '#/state/queries/like' +import {FeedDescriptor} from '#/state/queries/post-feed' +import {RQKEY as FEED_RQKEY} from '#/state/queries/post-feed' import { - UsePreferencesQueryResponse, + usePinFeedMutation, usePreferencesQuery, - useSaveFeedMutation, + UsePreferencesQueryResponse, useRemoveFeedMutation, - usePinFeedMutation, + useSaveFeedMutation, useUnpinFeedMutation, } from '#/state/queries/preferences' +import {useResolveUriQuery} from '#/state/queries/resolve-uri' +import {truncateAndInvalidate} from '#/state/queries/util' import {useSession} from '#/state/session' -import {useLikeMutation, useUnlikeMutation} from '#/state/queries/like' import {useComposerControls} from '#/state/shell/composer' -import {truncateAndInvalidate} from '#/state/queries/util' -import {isNative} from '#/platform/detection' -import {listenSoftReset} from '#/state/events' -import {atoms as a, useTheme} from '#/alf' -import * as Menu from '#/components/Menu' -import {HITSLOP_20} from '#/lib/constants' -import {DotGrid_Stroke2_Corner0_Rounded as Ellipsis} from '#/components/icons/DotGrid' -import {Trash_Stroke2_Corner0_Rounded as Trash} from '#/components/icons/Trash' -import {PlusLarge_Stroke2_Corner0_Rounded as Plus} from '#/components/icons/Plus' -import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfo} from '#/components/icons/CircleInfo' -import {ArrowOutOfBox_Stroke2_Corner0_Rounded as Share} from '#/components/icons/ArrowOutOfBox' -import { - Heart2_Stroke2_Corner0_Rounded as HeartOutline, - Heart2_Filled_Stroke2_Corner0_Rounded as HeartFilled, -} from '#/components/icons/Heart2' -import {Button as NewButton, ButtonText} from '#/components/Button' const SECTION_TITLES = ['Posts'] diff --git a/src/view/screens/ProfileFeedLikedBy.tsx b/src/view/screens/ProfileFeedLikedBy.tsx index b1bcf48ba..877378403 100644 --- a/src/view/screens/ProfileFeedLikedBy.tsx +++ b/src/view/screens/ProfileFeedLikedBy.tsx @@ -1,13 +1,15 @@ -import React from 'react' -import {View} from 'react-native' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {useFocusEffect} from '@react-navigation/native' -import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types' -import {ViewHeader} from '../com/util/ViewHeader' -import {PostLikedBy as PostLikedByComponent} from '../com/post-thread/PostLikedBy' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' import {makeRecordUri} from 'lib/strings/url-helpers' +import React from 'react' +import {View} from 'react-native' + import {useSetMinimalShellMode} from '#/state/shell' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' + +import {PostLikedBy as PostLikedByComponent} from '../com/post-thread/PostLikedBy' +import {ViewHeader} from '../com/util/ViewHeader' type Props = NativeStackScreenProps<CommonNavigatorParams, 'ProfileFeedLikedBy'> export const ProfileFeedLikedByScreen = ({route}: Props) => { diff --git a/src/view/screens/ProfileFollowers.tsx b/src/view/screens/ProfileFollowers.tsx index 2cad08cb5..792583796 100644 --- a/src/view/screens/ProfileFollowers.tsx +++ b/src/view/screens/ProfileFollowers.tsx @@ -1,12 +1,14 @@ +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useFocusEffect} from '@react-navigation/native' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' import React from 'react' import {View} from 'react-native' -import {useFocusEffect} from '@react-navigation/native' -import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types' -import {ViewHeader} from '../com/util/ViewHeader' -import {ProfileFollowers as ProfileFollowersComponent} from '../com/profile/ProfileFollowers' + import {useSetMinimalShellMode} from '#/state/shell' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' + +import {ProfileFollowers as ProfileFollowersComponent} from '../com/profile/ProfileFollowers' +import {ViewHeader} from '../com/util/ViewHeader' type Props = NativeStackScreenProps<CommonNavigatorParams, 'ProfileFollowers'> export const ProfileFollowersScreen = ({route}: Props) => { diff --git a/src/view/screens/ProfileFollows.tsx b/src/view/screens/ProfileFollows.tsx index 80502b98b..70fcfa9c6 100644 --- a/src/view/screens/ProfileFollows.tsx +++ b/src/view/screens/ProfileFollows.tsx @@ -1,12 +1,14 @@ +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useFocusEffect} from '@react-navigation/native' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' import React from 'react' import {View} from 'react-native' -import {useFocusEffect} from '@react-navigation/native' -import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types' -import {ViewHeader} from '../com/util/ViewHeader' -import {ProfileFollows as ProfileFollowsComponent} from '../com/profile/ProfileFollows' + import {useSetMinimalShellMode} from '#/state/shell' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' + +import {ProfileFollows as ProfileFollowsComponent} from '../com/profile/ProfileFollows' +import {ViewHeader} from '../com/util/ViewHeader' type Props = NativeStackScreenProps<CommonNavigatorParams, 'ProfileFollows'> export const ProfileFollowsScreen = ({route}: Props) => { diff --git a/src/view/screens/ProfileList.tsx b/src/view/screens/ProfileList.tsx index 9e98757ef..08644dccc 100644 --- a/src/view/screens/ProfileList.tsx +++ b/src/view/screens/ProfileList.tsx @@ -1,66 +1,67 @@ -import React, {useCallback, useMemo} from 'react' -import {Pressable, StyleSheet, View} from 'react-native' +import {AppBskyGraphDefs, AtUri, RichText as RichTextAPI} from '@atproto/api' +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {useFocusEffect, useIsFocused} from '@react-navigation/native' -import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types' import {useNavigation} from '@react-navigation/native' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import {AppBskyGraphDefs, AtUri, RichText as RichTextAPI} from '@atproto/api' import {useQueryClient} from '@tanstack/react-query' -import {PagerWithHeader} from 'view/com/pager/PagerWithHeader' -import {ProfileSubpageHeader} from 'view/com/profile/ProfileSubpageHeader' -import {Feed} from 'view/com/posts/Feed' -import {Text} from 'view/com/util/text/Text' -import {NativeDropdown, DropdownItem} from 'view/com/util/forms/NativeDropdown' -import {CenteredView} from 'view/com/util/Views' -import {EmptyState} from 'view/com/util/EmptyState' -import {LoadingScreen} from 'view/com/util/LoadingScreen' -import {RichText} from '#/components/RichText' -import {Button} from 'view/com/util/forms/Button' -import {TextLink} from 'view/com/util/Link' -import {ListRef} from 'view/com/util/List' -import * as Toast from 'view/com/util/Toast' -import {LoadLatestBtn} from 'view/com/util/load-latest/LoadLatestBtn' -import {FAB} from 'view/com/util/fab/FAB' import {Haptics} from 'lib/haptics' -import {FeedDescriptor} from '#/state/queries/post-feed' import {usePalette} from 'lib/hooks/usePalette' import {useSetTitle} from 'lib/hooks/useSetTitle' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {RQKEY as FEED_RQKEY} from '#/state/queries/post-feed' +import {ComposeIcon2} from 'lib/icons' +import {makeListLink, makeProfileLink} from 'lib/routes/links' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' import {NavigationProp} from 'lib/routes/types' -import {toShareUrl} from 'lib/strings/url-helpers' import {shareUrl} from 'lib/sharing' -import {s} from 'lib/styles' import {sanitizeHandle} from 'lib/strings/handles' -import {makeProfileLink, makeListLink} from 'lib/routes/links' -import {ComposeIcon2} from 'lib/icons' -import {ListMembers} from '#/view/com/lists/ListMembers' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {useSetMinimalShellMode} from '#/state/shell' +import {toShareUrl} from 'lib/strings/url-helpers' +import {s} from 'lib/styles' +import React, {useCallback, useMemo} from 'react' +import {Pressable, StyleSheet, View} from 'react-native' +import {PagerWithHeader} from 'view/com/pager/PagerWithHeader' +import {Feed} from 'view/com/posts/Feed' +import {ProfileSubpageHeader} from 'view/com/profile/ProfileSubpageHeader' +import {EmptyState} from 'view/com/util/EmptyState' +import {FAB} from 'view/com/util/fab/FAB' +import {Button} from 'view/com/util/forms/Button' +import {DropdownItem, NativeDropdown} from 'view/com/util/forms/NativeDropdown' +import {TextLink} from 'view/com/util/Link' +import {ListRef} from 'view/com/util/List' +import {LoadLatestBtn} from 'view/com/util/load-latest/LoadLatestBtn' +import {LoadingScreen} from 'view/com/util/LoadingScreen' +import {Text} from 'view/com/util/text/Text' +import * as Toast from 'view/com/util/Toast' +import {CenteredView} from 'view/com/util/Views' + +import {atoms as a, useTheme} from '#/alf' +import {RichText} from '#/components/RichText' +import {useAnalytics} from '#/lib/analytics/analytics' +import {cleanError} from '#/lib/strings/errors' +import {logger} from '#/logger' +import {isNative, isWeb} from '#/platform/detection' +import {listenSoftReset} from '#/state/events' import {useModalControls} from '#/state/modals' -import {useResolveUriQuery} from '#/state/queries/resolve-uri' import { - useListQuery, - useListMuteMutation, useListBlockMutation, useListDeleteMutation, + useListMuteMutation, + useListQuery, } from '#/state/queries/list' -import {cleanError} from '#/lib/strings/errors' -import {useSession} from '#/state/session' -import {useComposerControls} from '#/state/shell/composer' -import {isNative, isWeb} from '#/platform/detection' -import {truncateAndInvalidate} from '#/state/queries/util' +import {FeedDescriptor} from '#/state/queries/post-feed' +import {RQKEY as FEED_RQKEY} from '#/state/queries/post-feed' import { - usePreferencesQuery, usePinFeedMutation, - useUnpinFeedMutation, + usePreferencesQuery, useSetSaveFeedsMutation, + useUnpinFeedMutation, } from '#/state/queries/preferences' -import {logger} from '#/logger' -import {useAnalytics} from '#/lib/analytics/analytics' -import {listenSoftReset} from '#/state/events' -import {atoms as a, useTheme} from '#/alf' +import {useResolveUriQuery} from '#/state/queries/resolve-uri' +import {truncateAndInvalidate} from '#/state/queries/util' +import {useSession} from '#/state/session' +import {useSetMinimalShellMode} from '#/state/shell' +import {useComposerControls} from '#/state/shell/composer' +import {ListMembers} from '#/view/com/lists/ListMembers' const SECTION_TITLES_CURATE = ['Posts', 'About'] const SECTION_TITLES_MOD = ['About'] diff --git a/src/view/screens/SavedFeeds.tsx b/src/view/screens/SavedFeeds.tsx index 251c70638..b58f9f4f1 100644 --- a/src/view/screens/SavedFeeds.tsx +++ b/src/view/screens/SavedFeeds.tsx @@ -1,31 +1,32 @@ -import React from 'react' -import {StyleSheet, View, ActivityIndicator, Pressable} from 'react-native' +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {useFocusEffect} from '@react-navigation/native' import {NativeStackScreenProps} from '@react-navigation/native-stack' -import {track} from '#/lib/analytics/analytics' import {useAnalytics} from 'lib/analytics/analytics' +import {Haptics} from 'lib/haptics' import {usePalette} from 'lib/hooks/usePalette' -import {CommonNavigatorParams} from 'lib/routes/types' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {ViewHeader} from 'view/com/util/ViewHeader' -import {ScrollView, CenteredView} from 'view/com/util/Views' -import {Text} from 'view/com/util/text/Text' -import {s, colors} from 'lib/styles' +import {CommonNavigatorParams} from 'lib/routes/types' +import {colors, s} from 'lib/styles' +import React from 'react' +import {ActivityIndicator, Pressable, StyleSheet, View} from 'react-native' import {FeedSourceCard} from 'view/com/feeds/FeedSourceCard' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' -import * as Toast from 'view/com/util/Toast' -import {Haptics} from 'lib/haptics' import {TextLink} from 'view/com/util/Link' +import {Text} from 'view/com/util/text/Text' +import * as Toast from 'view/com/util/Toast' +import {ViewHeader} from 'view/com/util/ViewHeader' +import {CenteredView, ScrollView} from 'view/com/util/Views' + +import {track} from '#/lib/analytics/analytics' import {logger} from '#/logger' -import {useSetMinimalShellMode} from '#/state/shell' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' import { - usePreferencesQuery, usePinFeedMutation, - useUnpinFeedMutation, + usePreferencesQuery, useSetSaveFeedsMutation, + useUnpinFeedMutation, } from '#/state/queries/preferences' +import {useSetMinimalShellMode} from '#/state/shell' const HITSLOP_TOP = { top: 20, diff --git a/src/view/screens/Search/Search.tsx b/src/view/screens/Search/Search.tsx index 42eec53d3..d9d11c810 100644 --- a/src/view/screens/Search/Search.tsx +++ b/src/view/screens/Search/Search.tsx @@ -1,59 +1,59 @@ -import React from 'react' -import { - View, - StyleSheet, - ActivityIndicator, - TextInput, - Pressable, - Platform, -} from 'react-native' -import {ScrollView, CenteredView} from '#/view/com/util/Views' -import {List} from '#/view/com/util/List' import {AppBskyActorDefs, AppBskyFeedDefs, moderateProfile} from '@atproto/api' -import {msg, Trans} from '@lingui/macro' -import {useLingui} from '@lingui/react' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import AsyncStorage from '@react-native-async-storage/async-storage' import {useFocusEffect, useNavigation} from '@react-navigation/native' - -import {logger} from '#/logger' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' import { NativeStackScreenProps, SearchTabNavigatorParams, } from 'lib/routes/types' -import {Text} from '#/view/com/util/text/Text' +import {useTheme} from 'lib/ThemeContext' +import React from 'react' +import { + ActivityIndicator, + Platform, + Pressable, + StyleSheet, + TextInput, + View, +} from 'react-native' import {ProfileCardFeedLoadingPlaceholder} from 'view/com/util/LoadingPlaceholder' -import {ProfileCardWithFollowBtn} from '#/view/com/profile/ProfileCard' -import {Post} from '#/view/com/post/Post' -import {Pager} from '#/view/com/pager/Pager' -import {TabBar} from '#/view/com/pager/TabBar' + +import {useAnalytics} from '#/lib/analytics/analytics' import {HITSLOP_10} from '#/lib/constants' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' import {usePalette} from '#/lib/hooks/usePalette' -import {useTheme} from 'lib/ThemeContext' -import {useSession} from '#/state/session' -import {useGetSuggestedFollowersByActor} from '#/state/queries/suggested-follows' -import {useSearchPostsQuery} from '#/state/queries/search-posts' -import {useActorSearch} from '#/state/queries/actor-search' -import {useActorAutocompleteFn} from '#/state/queries/actor-autocomplete' -import {useSetDrawerOpen} from '#/state/shell' -import {useAnalytics} from '#/lib/analytics/analytics' import {MagnifyingGlassIcon} from '#/lib/icons' +import {NavigationProp} from '#/lib/routes/types' +import {augmentSearchQuery} from '#/lib/strings/helpers' +import {s} from '#/lib/styles' +import {logger} from '#/logger' +import {isNative, isWeb} from '#/platform/detection' +import {listenSoftReset} from '#/state/events' +import {useActorAutocompleteFn} from '#/state/queries/actor-autocomplete' +import {useActorSearch} from '#/state/queries/actor-search' import {useModerationOpts} from '#/state/queries/preferences' +import {useSearchPostsQuery} from '#/state/queries/search-posts' +import {useGetSuggestedFollowersByActor} from '#/state/queries/suggested-follows' +import {useSession} from '#/state/session' +import {useSetDrawerOpen} from '#/state/shell' +import {useSetDrawerSwipeDisabled, useSetMinimalShellMode} from '#/state/shell' +import {Pager} from '#/view/com/pager/Pager' +import {TabBar} from '#/view/com/pager/TabBar' +import {Post} from '#/view/com/post/Post' +import {ProfileCardWithFollowBtn} from '#/view/com/profile/ProfileCard' +import {List} from '#/view/com/util/List' +import {Text} from '#/view/com/util/text/Text' +import {CenteredView, ScrollView} from '#/view/com/util/Views' import { MATCH_HANDLE, SearchLinkCard, SearchProfileCard, } from '#/view/shell/desktop/Search' -import {useSetMinimalShellMode, useSetDrawerSwipeDisabled} from '#/state/shell' -import {isNative, isWeb} from '#/platform/detection' -import {listenSoftReset} from '#/state/events' -import {s} from '#/lib/styles' -import AsyncStorage from '@react-native-async-storage/async-storage' -import {augmentSearchQuery} from '#/lib/strings/helpers' -import {NavigationProp} from '#/lib/routes/types' function Loader() { const pal = usePalette('default') diff --git a/src/view/screens/Settings/ExportCarDialog.tsx b/src/view/screens/Settings/ExportCarDialog.tsx index dca51c0dc..e4747c696 100644 --- a/src/view/screens/Settings/ExportCarDialog.tsx +++ b/src/view/screens/Settings/ExportCarDialog.tsx @@ -1,13 +1,13 @@ +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import React from 'react' import {View} from 'react-native' -import {useLingui} from '@lingui/react' -import {Trans, msg} from '@lingui/macro' import {atoms as a, useBreakpoints, useTheme} from '#/alf' -import * as Dialog from '#/components/Dialog' -import {Text, P} from '#/components/Typography' import {Button, ButtonText} from '#/components/Button' +import * as Dialog from '#/components/Dialog' import {InlineLink, Link} from '#/components/Link' +import {P, Text} from '#/components/Typography' import {getAgent, useSession} from '#/state/session' export function ExportCarDialog({ diff --git a/src/view/screens/Settings/index.tsx b/src/view/screens/Settings/index.tsx index 00b507a99..f25fca15a 100644 --- a/src/view/screens/Settings/index.tsx +++ b/src/view/screens/Settings/index.tsx @@ -1,72 +1,73 @@ +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 {useFocusEffect, useNavigation} from '@react-navigation/native' +import {useQueryClient} from '@tanstack/react-query' +import {useAnalytics} from 'lib/analytics/analytics' +import * as AppInfo from 'lib/app-info' +import {STATUS_PAGE_URL} from 'lib/constants' +import {useAccountSwitcher} from 'lib/hooks/useAccountSwitcher' +import {useCustomPalette} from 'lib/hooks/useCustomPalette' +import {usePalette} from 'lib/hooks/usePalette' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {HandIcon, HashtagIcon} from 'lib/icons' +import {makeProfileLink} from 'lib/routes/links' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' +import {NavigationProp} from 'lib/routes/types' +import {colors, s} from 'lib/styles' import React from 'react' import { ActivityIndicator, Linking, Platform, - StyleSheet, Pressable, + StyleSheet, TextStyle, TouchableOpacity, View, ViewStyle, } from 'react-native' -import {useFocusEffect, useNavigation} from '@react-navigation/native' -import { - FontAwesomeIcon, - FontAwesomeIconStyle, -} from '@fortawesome/react-native-fontawesome' -import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types' -import * as AppInfo from 'lib/app-info' -import {usePalette} from 'lib/hooks/usePalette' -import {useCustomPalette} from 'lib/hooks/useCustomPalette' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {useAccountSwitcher} from 'lib/hooks/useAccountSwitcher' -import {useAnalytics} from 'lib/analytics/analytics' -import {NavigationProp} from 'lib/routes/types' -import {HandIcon, HashtagIcon} from 'lib/icons' -import Clipboard from '@react-native-clipboard/clipboard' -import {makeProfileLink} from 'lib/routes/links' -import {RQKEY as RQKEY_PROFILE} from '#/state/queries/profile' +import {AccountDropdownBtn} from 'view/com/util/AccountDropdownBtn' +import {SelectableBtn} from 'view/com/util/forms/SelectableBtn' +import {ToggleButton} from 'view/com/util/forms/ToggleButton' +import {Link, TextLink} from 'view/com/util/Link' +import {SimpleViewHeader} from 'view/com/util/SimpleViewHeader' +import {Text} from 'view/com/util/text/Text' +import * as Toast from 'view/com/util/Toast' +import {UserAvatar} from 'view/com/util/UserAvatar' +import {ScrollView} from 'view/com/util/Views' + +import {useDialogControl} from '#/components/Dialog' +import {isNative} from '#/platform/detection' import {useModalControls} from '#/state/modals' -import { - useSetMinimalShellMode, - useThemePrefs, - useSetThemePrefs, - useOnboardingDispatch, -} from '#/state/shell' +import {clearLegacyStorage} from '#/state/persisted/legacy' +// TODO import {useInviteCodesQuery} from '#/state/queries/invites' +import {clear as clearStorage} from '#/state/persisted/store' import { useRequireAltTextEnabled, useSetRequireAltTextEnabled, } from '#/state/preferences' -import {useSession, useSessionApi, SessionAccount} from '#/state/session' -import {useProfileQuery} from '#/state/queries/profile' -import {useClearPreferencesMutation} from '#/state/queries/preferences' -// TODO import {useInviteCodesQuery} from '#/state/queries/invites' -import {clear as clearStorage} from '#/state/persisted/store' -import {clearLegacyStorage} from '#/state/persisted/legacy' -import {STATUS_PAGE_URL} from 'lib/constants' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {useQueryClient} from '@tanstack/react-query' -import {useLoggedOutViewControls} from '#/state/shell/logged-out' -import {useCloseAllActiveElements} from '#/state/util' import { useInAppBrowser, useSetInAppBrowser, } from '#/state/preferences/in-app-browser' -import {isNative} from '#/platform/detection' -import {useDialogControl} from '#/components/Dialog' +import {useClearPreferencesMutation} from '#/state/queries/preferences' +import {RQKEY as RQKEY_PROFILE} from '#/state/queries/profile' +import {useProfileQuery} from '#/state/queries/profile' +import {SessionAccount, useSession, useSessionApi} from '#/state/session' +import { + useOnboardingDispatch, + useSetMinimalShellMode, + useSetThemePrefs, + useThemePrefs, +} from '#/state/shell' +import {useLoggedOutViewControls} from '#/state/shell/logged-out' +import {useCloseAllActiveElements} from '#/state/util' -import {s, colors} from 'lib/styles' -import {ScrollView} from 'view/com/util/Views' -import {Link, TextLink} from 'view/com/util/Link' -import {Text} from 'view/com/util/text/Text' -import * as Toast from 'view/com/util/Toast' -import {UserAvatar} from 'view/com/util/UserAvatar' -import {ToggleButton} from 'view/com/util/forms/ToggleButton' -import {SelectableBtn} from 'view/com/util/forms/SelectableBtn' -import {AccountDropdownBtn} from 'view/com/util/AccountDropdownBtn' -import {SimpleViewHeader} from 'view/com/util/SimpleViewHeader' import {ExportCarDialog} from './ExportCarDialog' function SettingsAccountCard({account}: {account: SessionAccount}) { diff --git a/src/view/screens/Storybook/Breakpoints.tsx b/src/view/screens/Storybook/Breakpoints.tsx index 1b846d517..5dd8a89fc 100644 --- a/src/view/screens/Storybook/Breakpoints.tsx +++ b/src/view/screens/Storybook/Breakpoints.tsx @@ -1,8 +1,8 @@ import React from 'react' import {View} from 'react-native' -import {atoms as a, useTheme, useBreakpoints} from '#/alf' -import {Text, H3} from '#/components/Typography' +import {atoms as a, useBreakpoints, useTheme} from '#/alf' +import {H3, Text} from '#/components/Typography' export function Breakpoints() { const t = useTheme() diff --git a/src/view/screens/Storybook/Buttons.tsx b/src/view/screens/Storybook/Buttons.tsx index 320db13ff..8a037844e 100644 --- a/src/view/screens/Storybook/Buttons.tsx +++ b/src/view/screens/Storybook/Buttons.tsx @@ -4,15 +4,15 @@ import {View} from 'react-native' import {atoms as a} from '#/alf' import { Button, - ButtonVariant, ButtonColor, ButtonIcon, ButtonText, + ButtonVariant, } from '#/components/Button' -import {H1} from '#/components/Typography' import {ArrowTopRight_Stroke2_Corner0_Rounded as ArrowTopRight} from '#/components/icons/ArrowTopRight' import {ChevronLeft_Stroke2_Corner0_Rounded as ChevronLeft} from '#/components/icons/Chevron' import {Globe_Stroke2_Corner0_Rounded as Globe} from '#/components/icons/Globe' +import {H1} from '#/components/Typography' export function Buttons() { return ( diff --git a/src/view/screens/Storybook/Dialogs.tsx b/src/view/screens/Storybook/Dialogs.tsx index 09be124db..af51c808f 100644 --- a/src/view/screens/Storybook/Dialogs.tsx +++ b/src/view/screens/Storybook/Dialogs.tsx @@ -3,9 +3,9 @@ import {View} from 'react-native' import {atoms as a} from '#/alf' import {Button} from '#/components/Button' -import {H3, P} from '#/components/Typography' import * as Dialog from '#/components/Dialog' import * as Prompt from '#/components/Prompt' +import {H3, P} from '#/components/Typography' import {useDialogStateControlContext} from '#/state/dialogs' export function Dialogs() { diff --git a/src/view/screens/Storybook/Forms.tsx b/src/view/screens/Storybook/Forms.tsx index 2d5495d70..0904f6113 100644 --- a/src/view/screens/Storybook/Forms.tsx +++ b/src/view/screens/Storybook/Forms.tsx @@ -2,13 +2,13 @@ import React from 'react' import {View} from 'react-native' import {atoms as a} from '#/alf' -import {H1, H3} from '#/components/Typography' -import * as TextField from '#/components/forms/TextField' +import {Button} from '#/components/Button' import {DateField, Label} from '#/components/forms/DateField' +import * as TextField from '#/components/forms/TextField' import * as Toggle from '#/components/forms/Toggle' import * as ToggleButton from '#/components/forms/ToggleButton' -import {Button} from '#/components/Button' import {Globe_Stroke2_Corner0_Rounded as Globe} from '#/components/icons/Globe' +import {H1, H3} from '#/components/Typography' export function Forms() { const [toggleGroupAValues, setToggleGroupAValues] = React.useState(['a']) diff --git a/src/view/screens/Storybook/Icons.tsx b/src/view/screens/Storybook/Icons.tsx index 9d7dc0aa8..f411a726b 100644 --- a/src/view/screens/Storybook/Icons.tsx +++ b/src/view/screens/Storybook/Icons.tsx @@ -2,11 +2,11 @@ import React from 'react' import {View} from 'react-native' import {atoms as a, useTheme} from '#/alf' -import {H1} from '#/components/Typography' -import {Globe_Stroke2_Corner0_Rounded as Globe} from '#/components/icons/Globe' import {ArrowTopRight_Stroke2_Corner0_Rounded as ArrowTopRight} from '#/components/icons/ArrowTopRight' import {CalendarDays_Stroke2_Corner0_Rounded as CalendarDays} from '#/components/icons/CalendarDays' +import {Globe_Stroke2_Corner0_Rounded as Globe} from '#/components/icons/Globe' import {Loader} from '#/components/Loader' +import {H1} from '#/components/Typography' export function Icons() { const t = useTheme() diff --git a/src/view/screens/Storybook/Links.tsx b/src/view/screens/Storybook/Links.tsx index f9ecfba55..db65d6fed 100644 --- a/src/view/screens/Storybook/Links.tsx +++ b/src/view/screens/Storybook/Links.tsx @@ -1,7 +1,7 @@ import React from 'react' import {View} from 'react-native' -import {useTheme, atoms as a} from '#/alf' +import {atoms as a, useTheme} from '#/alf' import {ButtonText} from '#/components/Button' import {InlineLink, Link} from '#/components/Link' import {H1, Text} from '#/components/Typography' diff --git a/src/view/screens/Storybook/Menus.tsx b/src/view/screens/Storybook/Menus.tsx index 2f2b14721..3e5c74d86 100644 --- a/src/view/screens/Storybook/Menus.tsx +++ b/src/view/screens/Storybook/Menus.tsx @@ -2,9 +2,9 @@ import React from 'react' import {View} from 'react-native' import {atoms as a, useTheme} from '#/alf' -import {Text} from '#/components/Typography' -import * as Menu from '#/components/Menu' import {MagnifyingGlass2_Stroke2_Corner0_Rounded as Search} from '#/components/icons/MagnifyingGlass2' +import * as Menu from '#/components/Menu' +import {Text} from '#/components/Typography' // import {useDialogStateControlContext} from '#/state/dialogs' export function Menus() { diff --git a/src/view/screens/Storybook/Spacing.tsx b/src/view/screens/Storybook/Spacing.tsx index d7faf93a8..9b97e92ad 100644 --- a/src/view/screens/Storybook/Spacing.tsx +++ b/src/view/screens/Storybook/Spacing.tsx @@ -2,7 +2,7 @@ import React from 'react' import {View} from 'react-native' import {atoms as a, useTheme} from '#/alf' -import {Text, H1} from '#/components/Typography' +import {H1, Text} from '#/components/Typography' export function Spacing() { const t = useTheme() diff --git a/src/view/screens/Storybook/Theming.tsx b/src/view/screens/Storybook/Theming.tsx index 5b6763370..122a57cf8 100644 --- a/src/view/screens/Storybook/Theming.tsx +++ b/src/view/screens/Storybook/Theming.tsx @@ -3,6 +3,7 @@ import {View} from 'react-native' import {atoms as a, useTheme} from '#/alf' import {Text} from '#/components/Typography' + import {Palette} from './Palette' export function Theming() { diff --git a/src/view/screens/Storybook/Typography.tsx b/src/view/screens/Storybook/Typography.tsx index f0d67c528..03f86fd46 100644 --- a/src/view/screens/Storybook/Typography.tsx +++ b/src/view/screens/Storybook/Typography.tsx @@ -2,8 +2,8 @@ import React from 'react' import {View} from 'react-native' import {atoms as a} from '#/alf' -import {Text} from '#/components/Typography' import {RichText} from '#/components/RichText' +import {Text} from '#/components/Typography' export function Typography() { return ( diff --git a/src/view/screens/Storybook/index.tsx b/src/view/screens/Storybook/index.tsx index e43d756de..e1a31c76a 100644 --- a/src/view/screens/Storybook/index.tsx +++ b/src/view/screens/Storybook/index.tsx @@ -1,22 +1,22 @@ import React from 'react' import {View} from 'react-native' -import {CenteredView, ScrollView} from '#/view/com/util/Views' -import {atoms as a, useTheme, ThemeProvider} from '#/alf' -import {useSetThemePrefs} from '#/state/shell' +import {atoms as a, ThemeProvider, useTheme} from '#/alf' import {Button} from '#/components/Button' +import {useSetThemePrefs} from '#/state/shell' +import {CenteredView, ScrollView} from '#/view/com/util/Views' -import {Theming} from './Theming' -import {Typography} from './Typography' -import {Spacing} from './Spacing' +import {Breakpoints} from './Breakpoints' import {Buttons} from './Buttons' -import {Links} from './Links' -import {Forms} from './Forms' import {Dialogs} from './Dialogs' -import {Breakpoints} from './Breakpoints' -import {Shadows} from './Shadows' +import {Forms} from './Forms' import {Icons} from './Icons' +import {Links} from './Links' import {Menus} from './Menus' +import {Shadows} from './Shadows' +import {Spacing} from './Spacing' +import {Theming} from './Theming' +import {Typography} from './Typography' export function Storybook() { const t = useTheme() diff --git a/src/view/screens/Support.tsx b/src/view/screens/Support.tsx index 9e7d36ec7..083a70d07 100644 --- a/src/view/screens/Support.tsx +++ b/src/view/screens/Support.tsx @@ -1,17 +1,19 @@ +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useFocusEffect} from '@react-navigation/native' +import {HELP_DESK_URL} from 'lib/constants' +import {usePalette} from 'lib/hooks/usePalette' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' +import {s} from 'lib/styles' import React from 'react' import {View} from 'react-native' -import {useFocusEffect} from '@react-navigation/native' -import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types' -import {ViewHeader} from '../com/util/ViewHeader' -import {Text} from 'view/com/util/text/Text' import {TextLink} from 'view/com/util/Link' +import {Text} from 'view/com/util/text/Text' import {CenteredView} from 'view/com/util/Views' -import {usePalette} from 'lib/hooks/usePalette' -import {s} from 'lib/styles' -import {HELP_DESK_URL} from 'lib/constants' + import {useSetMinimalShellMode} from '#/state/shell' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' + +import {ViewHeader} from '../com/util/ViewHeader' type Props = NativeStackScreenProps<CommonNavigatorParams, 'Support'> export const SupportScreen = (_props: Props) => { diff --git a/src/view/screens/TermsOfService.tsx b/src/view/screens/TermsOfService.tsx index 47aa9f268..307cd330e 100644 --- a/src/view/screens/TermsOfService.tsx +++ b/src/view/screens/TermsOfService.tsx @@ -1,16 +1,18 @@ +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useFocusEffect} from '@react-navigation/native' +import {usePalette} from 'lib/hooks/usePalette' +import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types' +import {s} from 'lib/styles' import React from 'react' import {View} from 'react-native' -import {useFocusEffect} from '@react-navigation/native' -import {Text} from 'view/com/util/text/Text' import {TextLink} from 'view/com/util/Link' -import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types' -import {ViewHeader} from '../com/util/ViewHeader' +import {Text} from 'view/com/util/text/Text' import {ScrollView} from 'view/com/util/Views' -import {usePalette} from 'lib/hooks/usePalette' -import {s} from 'lib/styles' + import {useSetMinimalShellMode} from '#/state/shell' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' + +import {ViewHeader} from '../com/util/ViewHeader' type Props = NativeStackScreenProps<CommonNavigatorParams, 'TermsOfService'> export const TermsOfServiceScreen = (_props: Props) => { diff --git a/src/view/shell/Composer.tsx b/src/view/shell/Composer.tsx index 1937fcb6e..5ab9407f0 100644 --- a/src/view/shell/Composer.tsx +++ b/src/view/shell/Composer.tsx @@ -1,10 +1,11 @@ -import React, {useEffect} from 'react' +import {useAnimatedValue} from 'lib/hooks/useAnimatedValue' +import {usePalette} from 'lib/hooks/usePalette' import {observer} from 'mobx-react-lite' +import React, {useEffect} from 'react' import {Animated, Easing, Platform, StyleSheet, View} from 'react-native' -import {ComposePost} from '../com/composer/Composer' import {useComposerState} from 'state/shell/composer' -import {useAnimatedValue} from 'lib/hooks/useAnimatedValue' -import {usePalette} from 'lib/hooks/usePalette' + +import {ComposePost} from '../com/composer/Composer' export const Composer = observer(function ComposerImpl({ winHeight, diff --git a/src/view/shell/Composer.web.tsx b/src/view/shell/Composer.web.tsx index 00233f66a..c0b71a1c8 100644 --- a/src/view/shell/Composer.web.tsx +++ b/src/view/shell/Composer.web.tsx @@ -1,16 +1,18 @@ +import {usePalette} from 'lib/hooks/usePalette' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' import React from 'react' import {StyleSheet, View} from 'react-native' import Animated, {FadeIn, FadeInDown, FadeOut} from 'react-native-reanimated' -import {ComposePost} from '../com/composer/Composer' import {useComposerState} from 'state/shell/composer' -import {usePalette} from 'lib/hooks/usePalette' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {useWebBodyScrollLock} from '#/lib/hooks/useWebBodyScrollLock' import { EmojiPicker, EmojiPickerState, } from 'view/com/composer/text-input/web/EmojiPicker.web' +import {useWebBodyScrollLock} from '#/lib/hooks/useWebBodyScrollLock' + +import {ComposePost} from '../com/composer/Composer' + const BOTTOM_BAR_HEIGHT = 61 export function Composer({}: {winHeight: number}) { diff --git a/src/view/shell/Drawer.tsx b/src/view/shell/Drawer.tsx index 2a37d1fe9..6bc9700ee 100644 --- a/src/view/shell/Drawer.tsx +++ b/src/view/shell/Drawer.tsx @@ -1,57 +1,58 @@ -import React, {ComponentProps} from 'react' -import { - Linking, - SafeAreaView, - ScrollView, - StyleProp, - StyleSheet, - TouchableOpacity, - View, - ViewStyle, -} from 'react-native' -import {useNavigation, StackActions} from '@react-navigation/native' import { FontAwesomeIcon, FontAwesomeIconStyle, } from '@fortawesome/react-native-fontawesome' -import {s, colors} from 'lib/styles' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {StackActions, useNavigation} from '@react-navigation/native' +import {useAnalytics} from 'lib/analytics/analytics' import {FEEDBACK_FORM_URL, HELP_DESK_URL} from 'lib/constants' +import {useNavigationTabState} from 'lib/hooks/useNavigationTabState' +import {usePalette} from 'lib/hooks/usePalette' import { - HomeIcon, - HomeIconSolid, BellIcon, BellIconSolid, - UserIcon, CogIcon, + HandIcon, + HashtagIcon, + HomeIcon, + HomeIconSolid, + ListIcon, MagnifyingGlassIcon2, MagnifyingGlassIcon2Solid, + UserIcon, UserIconSolid, - HashtagIcon, - ListIcon, - HandIcon, } from 'lib/icons' -import {UserAvatar} from 'view/com/util/UserAvatar' -import {Text} from 'view/com/util/text/Text' -import {useTheme} from 'lib/ThemeContext' -import {usePalette} from 'lib/hooks/usePalette' -import {useAnalytics} from 'lib/analytics/analytics' -import {pluralize} from 'lib/strings/helpers' import {getTabState, TabState} from 'lib/routes/helpers' import {NavigationProp} from 'lib/routes/types' -import {useNavigationTabState} from 'lib/hooks/useNavigationTabState' +import {pluralize} from 'lib/strings/helpers' +import {colors, s} from 'lib/styles' +import {useTheme} from 'lib/ThemeContext' import {isWeb} from 'platform/detection' +import React, {ComponentProps} from 'react' +import { + Linking, + SafeAreaView, + ScrollView, + StyleProp, + StyleSheet, + TouchableOpacity, + View, + ViewStyle, +} from 'react-native' import {formatCountShortOnly} from 'view/com/util/numeric/format' -import {Trans, msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' -import {useSetDrawerOpen} from '#/state/shell' -import {useSession, SessionAccount} from '#/state/session' -import {useProfileQuery} from '#/state/queries/profile' -import {useUnreadNotifications} from '#/state/queries/notifications/unread' +import {Text} from 'view/com/util/text/Text' +import {UserAvatar} from 'view/com/util/UserAvatar' + +import {useTheme as useAlfTheme} from '#/alf' import {emitSoftReset} from '#/state/events' +import {useUnreadNotifications} from '#/state/queries/notifications/unread' +import {useProfileQuery} from '#/state/queries/profile' +import {SessionAccount, useSession} from '#/state/session' +import {useSetDrawerOpen} from '#/state/shell' import {NavSignupCard} from '#/view/shell/NavSignupCard' -import {TextLink} from '../com/util/Link' -import {useTheme as useAlfTheme} from '#/alf' +import {TextLink} from '../com/util/Link' let DrawerProfileCard = ({ account, diff --git a/src/view/shell/NavSignupCard.tsx b/src/view/shell/NavSignupCard.tsx index bae37e838..63d5ea2b0 100644 --- a/src/view/shell/NavSignupCard.tsx +++ b/src/view/shell/NavSignupCard.tsx @@ -1,14 +1,14 @@ -import React from 'react' -import {View} from 'react-native' import {msg, Trans} from '@lingui/macro' import {useLingui} from '@lingui/react' - -import {s} from 'lib/styles' import {usePalette} from 'lib/hooks/usePalette' -import {Text} from '#/view/com/util/text/Text' -import {Button} from '#/view/com/util/forms/Button' +import {s} from 'lib/styles' +import React from 'react' +import {View} from 'react-native' + import {useLoggedOutViewControls} from '#/state/shell/logged-out' import {useCloseAllActiveElements} from '#/state/util' +import {Button} from '#/view/com/util/forms/Button' +import {Text} from '#/view/com/util/text/Text' import {Logo} from '#/view/icons/Logo' let NavSignupCard = ({}: {}): React.ReactNode => { diff --git a/src/view/shell/bottom-bar/BottomBar.tsx b/src/view/shell/bottom-bar/BottomBar.tsx index 115faa296..70503f4c4 100644 --- a/src/view/shell/bottom-bar/BottomBar.tsx +++ b/src/view/shell/bottom-bar/BottomBar.tsx @@ -1,42 +1,44 @@ -import React, {ComponentProps} from 'react' -import {GestureResponderEvent, TouchableOpacity, View} from 'react-native' -import Animated from 'react-native-reanimated' -import {StackActions} from '@react-navigation/native' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import {BottomTabBarProps} from '@react-navigation/bottom-tabs' -import {useSafeAreaInsets} from 'react-native-safe-area-context' -import {Text} from 'view/com/util/text/Text' +import {StackActions} from '@react-navigation/native' import {useAnalytics} from 'lib/analytics/analytics' -import {clamp} from 'lib/numbers' +import {useDedupe} from 'lib/hooks/useDedupe' +import {useMinimalShellMode} from 'lib/hooks/useMinimalShellMode' +import {useNavigationTabState} from 'lib/hooks/useNavigationTabState' +import {usePalette} from 'lib/hooks/usePalette' import { + BellIcon, + BellIconSolid, + HashtagIcon, HomeIcon, HomeIconSolid, MagnifyingGlassIcon2, MagnifyingGlassIcon2Solid, - HashtagIcon, - BellIcon, - BellIconSolid, } from 'lib/icons' -import {usePalette} from 'lib/hooks/usePalette' +import {clamp} from 'lib/numbers' import {getTabState, TabState} from 'lib/routes/helpers' -import {styles} from './BottomBarStyles' -import {useMinimalShellMode} from 'lib/hooks/useMinimalShellMode' -import {useNavigationTabState} from 'lib/hooks/useNavigationTabState' +import {s} from 'lib/styles' +import React, {ComponentProps} from 'react' +import {GestureResponderEvent, TouchableOpacity, View} from 'react-native' +import Animated from 'react-native-reanimated' +import {useSafeAreaInsets} from 'react-native-safe-area-context' +import {Text} from 'view/com/util/text/Text' import {UserAvatar} from 'view/com/util/UserAvatar' -import {useLingui} from '@lingui/react' -import {msg, Trans} from '@lingui/macro' + +import {emitSoftReset} from '#/state/events' import {useModalControls} from '#/state/modals' -import {useShellLayout} from '#/state/shell/shell-layout' import {useUnreadNotifications} from '#/state/queries/notifications/unread' -import {emitSoftReset} from '#/state/events' -import {useSession} from '#/state/session' import {useProfileQuery} from '#/state/queries/profile' +import {useSession} from '#/state/session' import {useLoggedOutViewControls} from '#/state/shell/logged-out' +import {useShellLayout} from '#/state/shell/shell-layout' import {useCloseAllActiveElements} from '#/state/util' import {Button} from '#/view/com/util/forms/Button' -import {s} from 'lib/styles' import {Logo} from '#/view/icons/Logo' import {Logotype} from '#/view/icons/Logotype' -import {useDedupe} from 'lib/hooks/useDedupe' + +import {styles} from './BottomBarStyles' type TabOptions = 'Home' | 'Search' | 'Notifications' | 'MyProfile' | 'Feeds' diff --git a/src/view/shell/bottom-bar/BottomBarStyles.tsx b/src/view/shell/bottom-bar/BottomBarStyles.tsx index f226406f5..1e8347161 100644 --- a/src/view/shell/bottom-bar/BottomBarStyles.tsx +++ b/src/view/shell/bottom-bar/BottomBarStyles.tsx @@ -1,5 +1,5 @@ -import {StyleSheet} from 'react-native' import {colors} from 'lib/styles' +import {StyleSheet} from 'react-native' export const styles = StyleSheet.create({ bottomBar: { diff --git a/src/view/shell/bottom-bar/BottomBarWeb.tsx b/src/view/shell/bottom-bar/BottomBarWeb.tsx index b330c4b80..582c92b02 100644 --- a/src/view/shell/bottom-bar/BottomBarWeb.tsx +++ b/src/view/shell/bottom-bar/BottomBarWeb.tsx @@ -1,38 +1,40 @@ -import React from 'react' -import {usePalette} from 'lib/hooks/usePalette' -import {useNavigationState} from '@react-navigation/native' -import Animated from 'react-native-reanimated' -import {useSafeAreaInsets} from 'react-native-safe-area-context' -import {View} from 'react-native' import {msg, Trans} from '@lingui/macro' import {useLingui} from '@lingui/react' -import {getCurrentRoute, isTab} from 'lib/routes/helpers' -import {styles} from './BottomBarStyles' -import {clamp} from 'lib/numbers' +import {useNavigationState} from '@react-navigation/native' +import {useMinimalShellMode} from 'lib/hooks/useMinimalShellMode' +import {usePalette} from 'lib/hooks/usePalette' import { BellIcon, BellIconSolid, + HashtagIcon, HomeIcon, HomeIconSolid, MagnifyingGlassIcon2, MagnifyingGlassIcon2Solid, - HashtagIcon, UserIcon, UserIconSolid, } from 'lib/icons' -import {Link} from 'view/com/util/Link' -import {useMinimalShellMode} from 'lib/hooks/useMinimalShellMode' +import {clamp} from 'lib/numbers' +import {getCurrentRoute, isTab} from 'lib/routes/helpers' import {makeProfileLink} from 'lib/routes/links' import {CommonNavigatorParams} from 'lib/routes/types' +import {s} from 'lib/styles' +import React from 'react' +import {View} from 'react-native' +import Animated from 'react-native-reanimated' +import {useSafeAreaInsets} from 'react-native-safe-area-context' +import {Link} from 'view/com/util/Link' + import {useSession} from '#/state/session' import {useLoggedOutViewControls} from '#/state/shell/logged-out' import {useCloseAllActiveElements} from '#/state/util' import {Button} from '#/view/com/util/forms/Button' import {Text} from '#/view/com/util/text/Text' -import {s} from 'lib/styles' import {Logo} from '#/view/icons/Logo' import {Logotype} from '#/view/icons/Logotype' +import {styles} from './BottomBarStyles' + export function BottomBarWeb() { const {_} = useLingui() const {hasSession, currentAccount} = useSession() diff --git a/src/view/shell/createNativeStackNavigatorWithAuth.tsx b/src/view/shell/createNativeStackNavigatorWithAuth.tsx index 938213c31..968e149f6 100644 --- a/src/view/shell/createNativeStackNavigatorWithAuth.tsx +++ b/src/view/shell/createNativeStackNavigatorWithAuth.tsx @@ -1,11 +1,6 @@ -import * as React from 'react' -import {View} from 'react-native' -import {PWI_ENABLED, NEW_ONBOARDING_ENABLED} from '#/lib/build-flags' - // Based on @react-navigation/native-stack/src/createNativeStackNavigator.ts // MIT License // Copyright (c) 2017 React Navigation Contributors - import { createNavigatorFactory, EventArg, @@ -21,24 +16,28 @@ import type { NativeStackNavigationEventMap, NativeStackNavigationOptions, } from '@react-navigation/native-stack' -import type {NativeStackNavigatorProps} from '@react-navigation/native-stack/src/types' import {NativeStackView} from '@react-navigation/native-stack' +import type {NativeStackNavigatorProps} from '@react-navigation/native-stack/src/types' +import {isWeb} from 'platform/detection' +import * as React from 'react' +import {View} from 'react-native' -import {BottomBarWeb} from './bottom-bar/BottomBarWeb' -import {DesktopLeftNav} from './desktop/LeftNav' -import {DesktopRightNav} from './desktop/RightNav' +import {NEW_ONBOARDING_ENABLED, PWI_ENABLED} from '#/lib/build-flags' import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries' +import {Deactivated} from '#/screens/Deactivated' +import {Onboarding as NewOnboarding} from '#/screens/Onboarding' +import {useSession} from '#/state/session' import {useOnboardingState} from '#/state/shell' import { useLoggedOutView, useLoggedOutViewControls, } from '#/state/shell/logged-out' -import {useSession} from '#/state/session' -import {isWeb} from 'platform/detection' -import {Deactivated} from '#/screens/Deactivated' + import {LoggedOut} from '../com/auth/LoggedOut' import {Onboarding} from '../com/auth/Onboarding' -import {Onboarding as NewOnboarding} from '#/screens/Onboarding' +import {BottomBarWeb} from './bottom-bar/BottomBarWeb' +import {DesktopLeftNav} from './desktop/LeftNav' +import {DesktopRightNav} from './desktop/RightNav' type NativeStackNavigationOptionsWithAuth = NativeStackNavigationOptions & { requireAuth?: boolean diff --git a/src/view/shell/desktop/Feeds.tsx b/src/view/shell/desktop/Feeds.tsx index f447490b3..22e1f9e67 100644 --- a/src/view/shell/desktop/Feeds.tsx +++ b/src/view/shell/desktop/Feeds.tsx @@ -1,16 +1,17 @@ -import React from 'react' -import {View, StyleSheet} from 'react-native' -import {useNavigationState, useNavigation} from '@react-navigation/native' +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {useNavigation, useNavigationState} from '@react-navigation/native' import {usePalette} from 'lib/hooks/usePalette' -import {TextLink} from 'view/com/util/Link' import {getCurrentRoute} from 'lib/routes/helpers' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' -import {usePinnedFeedsInfos} from '#/state/queries/feed' -import {useSelectedFeed, useSetSelectedFeed} from '#/state/shell/selected-feed' -import {FeedDescriptor} from '#/state/queries/post-feed' import {NavigationProp} from 'lib/routes/types' +import React from 'react' +import {StyleSheet, View} from 'react-native' +import {TextLink} from 'view/com/util/Link' + import {emitSoftReset} from '#/state/events' +import {usePinnedFeedsInfos} from '#/state/queries/feed' +import {FeedDescriptor} from '#/state/queries/post-feed' +import {useSelectedFeed, useSetSelectedFeed} from '#/state/shell/selected-feed' export function DesktopFeeds() { const pal = usePalette('default') diff --git a/src/view/shell/desktop/LeftNav.tsx b/src/view/shell/desktop/LeftNav.tsx index c56ba941e..f3340b7a7 100644 --- a/src/view/shell/desktop/LeftNav.tsx +++ b/src/view/shell/desktop/LeftNav.tsx @@ -1,52 +1,54 @@ -import React from 'react' -import {StyleSheet, TouchableOpacity, View} from 'react-native' -import {PressableWithHover} from 'view/com/util/PressableWithHover' +import { + FontAwesomeIcon, + FontAwesomeIconStyle, +} from '@fortawesome/react-native-fontawesome' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' import { useLinkProps, useNavigation, useNavigationState, } from '@react-navigation/native' -import { - FontAwesomeIcon, - FontAwesomeIconStyle, -} from '@fortawesome/react-native-fontawesome' -import {Text} from 'view/com/util/text/Text' -import {UserAvatar} from 'view/com/util/UserAvatar' -import {Link} from 'view/com/util/Link' -import {LoadingPlaceholder} from 'view/com/util/LoadingPlaceholder' import {usePalette} from 'lib/hooks/usePalette' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {s, colors} from 'lib/styles' import { - HomeIcon, - HomeIconSolid, - MagnifyingGlassIcon2, - MagnifyingGlassIcon2Solid, BellIcon, BellIconSolid, - UserIcon, - UserIconSolid, CogIcon, CogIconSolid, ComposeIcon2, - ListIcon, - HashtagIcon, HandIcon, + HashtagIcon, + HomeIcon, + HomeIconSolid, + ListIcon, + MagnifyingGlassIcon2, + MagnifyingGlassIcon2Solid, + UserIcon, + UserIconSolid, } from 'lib/icons' -import {getCurrentRoute, isTab, isStateAtTabRoot} from 'lib/routes/helpers' -import {NavigationProp, CommonNavigatorParams} from 'lib/routes/types' -import {router} from '../../../routes' +import {getCurrentRoute, isStateAtTabRoot, isTab} from 'lib/routes/helpers' import {makeProfileLink} from 'lib/routes/links' -import {useLingui} from '@lingui/react' -import {Trans, msg} from '@lingui/macro' +import {CommonNavigatorParams, NavigationProp} from 'lib/routes/types' +import {colors, s} from 'lib/styles' +import React from 'react' +import {StyleSheet, TouchableOpacity, View} from 'react-native' +import {Link} from 'view/com/util/Link' +import {LoadingPlaceholder} from 'view/com/util/LoadingPlaceholder' +import {PressableWithHover} from 'view/com/util/PressableWithHover' +import {Text} from 'view/com/util/text/Text' +import {UserAvatar} from 'view/com/util/UserAvatar' + +import {isInvalidHandle} from '#/lib/strings/handles' +import {emitSoftReset} from '#/state/events' +import {useFetchHandle} from '#/state/queries/handle' +import {useUnreadNotifications} from '#/state/queries/notifications/unread' import {useProfileQuery} from '#/state/queries/profile' import {useSession} from '#/state/session' -import {useUnreadNotifications} from '#/state/queries/notifications/unread' import {useComposerControls} from '#/state/shell/composer' -import {useFetchHandle} from '#/state/queries/handle' -import {emitSoftReset} from '#/state/events' import {NavSignupCard} from '#/view/shell/NavSignupCard' -import {isInvalidHandle} from '#/lib/strings/handles' + +import {router} from '../../../routes' function ProfileCard() { const {currentAccount} = useSession() diff --git a/src/view/shell/desktop/RightNav.tsx b/src/view/shell/desktop/RightNav.tsx index c1f498724..bfbb19f10 100644 --- a/src/view/shell/desktop/RightNav.tsx +++ b/src/view/shell/desktop/RightNav.tsx @@ -1,17 +1,19 @@ +import {msg} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {FEEDBACK_FORM_URL, HELP_DESK_URL} from 'lib/constants' +import {usePalette} from 'lib/hooks/usePalette' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import {s} from 'lib/styles' import React from 'react' import {StyleSheet, View} from 'react-native' -import {usePalette} from 'lib/hooks/usePalette' -import {DesktopSearch} from './Search' -import {DesktopFeeds} from './Feeds' -import {Text} from 'view/com/util/text/Text' import {TextLink} from 'view/com/util/Link' -import {FEEDBACK_FORM_URL, HELP_DESK_URL} from 'lib/constants' -import {s} from 'lib/styles' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {useLingui} from '@lingui/react' -import {msg} from '@lingui/macro' +import {Text} from 'view/com/util/text/Text' + import {useSession} from '#/state/session' +import {DesktopFeeds} from './Feeds' +import {DesktopSearch} from './Search' + export function DesktopRightNav({routeName}: {routeName: string}) { const pal = usePalette('default') const {_} = useLingui() diff --git a/src/view/shell/desktop/Search.tsx b/src/view/shell/desktop/Search.tsx index 4a9483733..043b9ff3c 100644 --- a/src/view/shell/desktop/Search.tsx +++ b/src/view/shell/desktop/Search.tsx @@ -1,33 +1,33 @@ -import React from 'react' -import { - ViewStyle, - TextInput, - View, - StyleSheet, - TouchableOpacity, - ActivityIndicator, -} from 'react-native' -import {useNavigation, StackActions} from '@react-navigation/native' import { AppBskyActorDefs, moderateProfile, ProfileModeration, } from '@atproto/api' -import {Trans, msg} from '@lingui/macro' +import {msg, Trans} from '@lingui/macro' import {useLingui} from '@lingui/react' - -import {s} from '#/lib/styles' -import {sanitizeDisplayName} from '#/lib/strings/display-names' -import {sanitizeHandle} from '#/lib/strings/handles' -import {makeProfileLink} from '#/lib/routes/links' -import {Link} from '#/view/com/util/Link' +import {StackActions, useNavigation} from '@react-navigation/native' import {usePalette} from 'lib/hooks/usePalette' import {MagnifyingGlassIcon2} from 'lib/icons' import {NavigationProp} from 'lib/routes/types' +import React from 'react' +import { + ActivityIndicator, + StyleSheet, + TextInput, + TouchableOpacity, + View, + ViewStyle, +} from 'react-native' import {Text} from 'view/com/util/text/Text' -import {UserAvatar} from '#/view/com/util/UserAvatar' + +import {makeProfileLink} from '#/lib/routes/links' +import {sanitizeDisplayName} from '#/lib/strings/display-names' +import {sanitizeHandle} from '#/lib/strings/handles' +import {s} from '#/lib/styles' import {useActorAutocompleteFn} from '#/state/queries/actor-autocomplete' import {useModerationOpts} from '#/state/queries/preferences' +import {Link} from '#/view/com/util/Link' +import {UserAvatar} from '#/view/com/util/UserAvatar' export const MATCH_HANDLE = /@?([a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*(?:\.[a-zA-Z]{2,}))/ diff --git a/src/view/shell/index.tsx b/src/view/shell/index.tsx index 76a7f8fb3..b20754378 100644 --- a/src/view/shell/index.tsx +++ b/src/view/shell/index.tsx @@ -1,37 +1,39 @@ -import React from 'react' +import {useNavigationState} from '@react-navigation/native' import {StatusBar} from 'expo-status-bar' +import {usePalette} from 'lib/hooks/usePalette' +import * as notifications from 'lib/notifications/notifications' +import {isStateAtTabRoot} from 'lib/routes/helpers' +import {useTheme} from 'lib/ThemeContext' +import {isAndroid} from 'platform/detection' +import React from 'react' import { + BackHandler, DimensionValue, StyleSheet, useWindowDimensions, View, - BackHandler, } from 'react-native' -import {useSafeAreaInsets} from 'react-native-safe-area-context' import {Drawer} from 'react-native-drawer-layout' -import {useNavigationState} from '@react-navigation/native' -import {ModalsContainer} from 'view/com/modals/Modal' +import Animated from 'react-native-reanimated' +import {useSafeAreaInsets} from 'react-native-safe-area-context' +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 {DrawerContent} from './Drawer' -import {Composer} from './Composer' -import {useTheme} from 'lib/ThemeContext' -import {usePalette} from 'lib/hooks/usePalette' -import {RoutesContainer, TabsNavigator} from '../../Navigation' -import {isStateAtTabRoot} from 'lib/routes/helpers' + +import {MutedWordsDialog} from '#/components/dialogs/MutedWords' +import {Outlet as PortalOutlet} from '#/components/Portal' +import {useSession} from '#/state/session' import { useIsDrawerOpen, - useSetDrawerOpen, useIsDrawerSwipeDisabled, + useSetDrawerOpen, } from '#/state/shell' -import {isAndroid} from 'platform/detection' -import {useSession} from '#/state/session' import {useCloseAnyActiveElement} from '#/state/util' -import * as notifications from 'lib/notifications/notifications' -import {Outlet as PortalOutlet} from '#/components/Portal' -import {MutedWordsDialog} from '#/components/dialogs/MutedWords' -import {useDialogStateContext} from 'state/dialogs' -import Animated from 'react-native-reanimated' + +import {RoutesContainer, TabsNavigator} from '../../Navigation' +import {Composer} from './Composer' +import {DrawerContent} from './Drawer' function ShellInner() { const isDrawerOpen = useIsDrawerOpen() diff --git a/src/view/shell/index.web.tsx b/src/view/shell/index.web.tsx index 71dccb8c4..d5ac5b970 100644 --- a/src/view/shell/index.web.tsx +++ b/src/view/shell/index.web.tsx @@ -1,22 +1,24 @@ +import {t} from '@lingui/macro' +import {useNavigation} from '@react-navigation/native' +import {useColorSchemeStyle} from 'lib/hooks/useColorSchemeStyle' +import {NavigationProp} from 'lib/routes/types' +import {colors, s} from 'lib/styles' import React, {useEffect} from 'react' -import {View, StyleSheet, TouchableOpacity} from 'react-native' -import {ErrorBoundary} from '../com/util/ErrorBoundary' +import {StyleSheet, TouchableOpacity, View} from 'react-native' + +import {MutedWordsDialog} from '#/components/dialogs/MutedWords' +import {Outlet as PortalOutlet} from '#/components/Portal' +import {useWebBodyScrollLock} from '#/lib/hooks/useWebBodyScrollLock' +import {useIsDrawerOpen, useSetDrawerOpen} from '#/state/shell' +import {useCloseAllActiveElements} from '#/state/util' + +import {useWebMediaQueries} from '../../lib/hooks/useWebMediaQueries' +import {FlatNavigator, RoutesContainer} from '../../Navigation' import {Lightbox} from '../com/lightbox/Lightbox' import {ModalsContainer} from '../com/modals/Modal' +import {ErrorBoundary} from '../com/util/ErrorBoundary' import {Composer} from './Composer.web' -import {useColorSchemeStyle} from 'lib/hooks/useColorSchemeStyle' -import {s, colors} from 'lib/styles' -import {RoutesContainer, FlatNavigator} from '../../Navigation' import {DrawerContent} from './Drawer' -import {useWebMediaQueries} from '../../lib/hooks/useWebMediaQueries' -import {useNavigation} from '@react-navigation/native' -import {NavigationProp} from 'lib/routes/types' -import {t} from '@lingui/macro' -import {useIsDrawerOpen, useSetDrawerOpen} from '#/state/shell' -import {useCloseAllActiveElements} from '#/state/util' -import {useWebBodyScrollLock} from '#/lib/hooks/useWebBodyScrollLock' -import {Outlet as PortalOutlet} from '#/components/Portal' -import {MutedWordsDialog} from '#/components/dialogs/MutedWords' function ShellInner() { const isDrawerOpen = useIsDrawerOpen() |