From d5ccc957042c669973bd077198c9e18d071c5a8e Mon Sep 17 00:00:00 2001 From: Zhiyuan Zheng Date: Fri, 1 Jan 2021 17:52:14 +0100 Subject: [PATCH] Solved cycle dependency --- src/api/client.ts | 4 ++-- src/components/Parse/HTML.tsx | 2 +- src/screens/Me/Root/Login.tsx | 2 ++ .../Shared/Account/Information/Actions.tsx | 4 +--- src/screens/Shared/Compose.tsx | 18 +++-------------- src/screens/Shared/Compose/Actions.tsx | 6 +++--- src/screens/Shared/Compose/Attachments.tsx | 10 +++++----- src/screens/Shared/Compose/EditAttachment.tsx | 8 ++++---- .../Shared/Compose/EditAttachment/Image.tsx | 6 +++--- .../Shared/Compose/EditAttachment/Root.tsx | 2 +- src/screens/Shared/Compose/Emojis.tsx | 9 ++++----- src/screens/Shared/Compose/Poll.tsx | 13 ++++++------ src/screens/Shared/Compose/Reply.tsx | 20 +++++-------------- src/screens/Shared/Compose/Root.tsx | 10 +++++----- src/screens/Shared/Compose/Root/Footer.tsx | 2 +- src/screens/Shared/Compose/Root/Header.tsx | 2 +- src/screens/Shared/Compose/SpoilerInput.tsx | 2 +- src/screens/Shared/Compose/TextInput.tsx | 4 ++-- .../Shared/Compose/utils/createContext.ts | 10 ++++++++++ 19 files changed, 60 insertions(+), 74 deletions(-) create mode 100644 src/screens/Shared/Compose/utils/createContext.ts diff --git a/src/api/client.ts b/src/api/client.ts index cf1c98fc..fbf09822 100644 --- a/src/api/client.ts +++ b/src/api/client.ts @@ -1,6 +1,5 @@ import axios from 'axios' import chalk from 'chalk' -import { store, RootState } from '@root/store' const ctx = new chalk.Instance({ level: 3 }) @@ -36,7 +35,8 @@ const client = async ({ (params ? ctx.green(' -> ') : ''), params ? params : '' ) - const state: RootState['instances'] = store.getState().instances + const { store } = require('@root/store') + const state = store.getState().instances const domain = instance === 'remote' ? instanceDomain || state.remote.url : state.local.url diff --git a/src/components/Parse/HTML.tsx b/src/components/Parse/HTML.tsx index cb8b3e3e..03fe5d0a 100644 --- a/src/components/Parse/HTML.tsx +++ b/src/components/Parse/HTML.tsx @@ -1,5 +1,5 @@ import openLink from '@components/openLink' -import { ParseEmojis } from '@components/Parse' +import ParseEmojis from '@components/Parse/Emojis' import { Feather } from '@expo/vector-icons' import { useNavigation } from '@react-navigation/native' import { StyleConstants } from '@utils/styles/constants' diff --git a/src/screens/Me/Root/Login.tsx b/src/screens/Me/Root/Login.tsx index aa5eaf07..414749dd 100644 --- a/src/screens/Me/Root/Login.tsx +++ b/src/screens/Me/Root/Login.tsx @@ -340,4 +340,6 @@ const styles = StyleSheet.create({ } }) +Login.whyDidYouRender = true + export default Login diff --git a/src/screens/Shared/Account/Information/Actions.tsx b/src/screens/Shared/Account/Information/Actions.tsx index c71667f5..fb9d5f6d 100644 --- a/src/screens/Shared/Account/Information/Actions.tsx +++ b/src/screens/Shared/Account/Information/Actions.tsx @@ -46,9 +46,7 @@ const AccountInformationActions: React.FC = ({ account }) => { const navigation = useNavigation() const relationshipQueryKey = ['Relationship', { id: account?.id }] - const query = useQuery(relationshipQueryKey, relationshipFetch, { - enabled: false - }) + const query = useQuery(relationshipQueryKey, relationshipFetch) useEffect(() => { if (account?.id) { query.refetch() diff --git a/src/screens/Shared/Compose.tsx b/src/screens/Shared/Compose.tsx index 2db40428..fc0a14b5 100644 --- a/src/screens/Shared/Compose.tsx +++ b/src/screens/Shared/Compose.tsx @@ -7,14 +7,7 @@ import ComposeRoot from '@screens/Shared/Compose/Root' import { getLocalAccountPreferences } from '@utils/slices/instancesSlice' import { StyleConstants } from '@utils/styles/constants' import { useTheme } from '@utils/styles/ThemeManager' -import React, { - createContext, - Dispatch, - useCallback, - useEffect, - useReducer, - useState -} from 'react' +import React, { useCallback, useEffect, useReducer, useState } from 'react' import { Alert, Keyboard, @@ -26,20 +19,15 @@ import { SafeAreaView } from 'react-native-safe-area-context' import { createNativeStackNavigator } from 'react-native-screens/native-stack' import { useQueryClient } from 'react-query' import ComposeEditAttachment from './Compose/EditAttachment' +import ComposeContext from './Compose/utils/createContext' import composeInitialState from './Compose/utils/initialState' import composeParseState from './Compose/utils/parseState' import composeSend from './Compose/utils/post' import composeReducer from './Compose/utils/reducer' -import { ComposeAction, ComposeState } from './Compose/utils/types' +import { ComposeState } from './Compose/utils/types' const Stack = createNativeStackNavigator() -type ContextType = { - composeState: ComposeState - composeDispatch: Dispatch -} -export const ComposeContext = createContext({} as ContextType) - export interface Props { route: { params: diff --git a/src/screens/Shared/Compose/Actions.tsx b/src/screens/Shared/Compose/Actions.tsx index 1d7355f0..781faec0 100644 --- a/src/screens/Shared/Compose/Actions.tsx +++ b/src/screens/Shared/Compose/Actions.tsx @@ -1,11 +1,11 @@ import { Feather } from '@expo/vector-icons' import { StyleConstants } from '@utils/styles/constants' +import layoutAnimation from '@utils/styles/layoutAnimation' import { useTheme } from '@utils/styles/ThemeManager' -import { ComposeContext } from '@screens/Shared/Compose' -import addAttachment from '@root/screens/Shared/Compose/addAttachment' import React, { useCallback, useContext, useMemo } from 'react' import { ActionSheetIOS, StyleSheet, View } from 'react-native' -import layoutAnimation from '@root/utils/styles/layoutAnimation' +import addAttachment from './/addAttachment' +import ComposeContext from './utils/createContext' const ComposeActions: React.FC = () => { const { composeState, composeDispatch } = useContext(ComposeContext) diff --git a/src/screens/Shared/Compose/Attachments.tsx b/src/screens/Shared/Compose/Attachments.tsx index 65798711..d31ee623 100644 --- a/src/screens/Shared/Compose/Attachments.tsx +++ b/src/screens/Shared/Compose/Attachments.tsx @@ -1,10 +1,9 @@ import { Feather } from '@expo/vector-icons' import Button from '@components/Button' +import haptics from '@components/haptics' import { useNavigation } from '@react-navigation/native' -import { ComposeContext } from '@screens/Shared/Compose' -import addAttachment from '@screens/Shared/Compose/addAttachment' -import { ExtendedAttachment } from '@screens/Shared/Compose/utils/types' import { StyleConstants } from '@utils/styles/constants' +import layoutAnimation from '@utils/styles/layoutAnimation' import { useTheme } from '@utils/styles/ThemeManager' import React, { useCallback, @@ -22,8 +21,9 @@ import { View } from 'react-native' import { Chase } from 'react-native-animated-spinkit' -import layoutAnimation from '@root/utils/styles/layoutAnimation' -import haptics from '@root/components/haptics' +import addAttachment from './addAttachment' +import ComposeContext from './utils/createContext' +import { ExtendedAttachment } from './utils/types' const DEFAULT_HEIGHT = 200 diff --git a/src/screens/Shared/Compose/EditAttachment.tsx b/src/screens/Shared/Compose/EditAttachment.tsx index ab030348..10202b93 100644 --- a/src/screens/Shared/Compose/EditAttachment.tsx +++ b/src/screens/Shared/Compose/EditAttachment.tsx @@ -1,7 +1,6 @@ -import client from '@root/api/client' -import haptics from '@root/components/haptics' -import { HeaderLeft, HeaderRight } from '@root/components/Header' -import { ComposeContext } from '@screens/Shared/Compose' +import client from '@api/client' +import haptics from '@components/haptics' +import { HeaderLeft, HeaderRight } from '@components/Header' import React, { useCallback, useContext, @@ -13,6 +12,7 @@ import { Alert, KeyboardAvoidingView } from 'react-native' import { SafeAreaView } from 'react-native-safe-area-context' import { createNativeStackNavigator } from 'react-native-screens/native-stack' import ComposeEditAttachmentRoot from './EditAttachment/Root' +import ComposeContext from './utils/createContext' const Stack = createNativeStackNavigator() diff --git a/src/screens/Shared/Compose/EditAttachment/Image.tsx b/src/screens/Shared/Compose/EditAttachment/Image.tsx index 19759e16..3dd1a3c4 100644 --- a/src/screens/Shared/Compose/EditAttachment/Image.tsx +++ b/src/screens/Shared/Compose/EditAttachment/Image.tsx @@ -1,6 +1,5 @@ -import { StyleConstants } from '@root/utils/styles/constants' -import { useTheme } from '@root/utils/styles/ThemeManager' -import { ComposeContext } from '@screens/Shared/Compose' +import { StyleConstants } from '@utils/styles/constants' +import { useTheme } from '@utils/styles/ThemeManager' import React, { MutableRefObject, useCallback, useContext, useRef } from 'react' import { Animated, @@ -12,6 +11,7 @@ import { } from 'react-native' import { PanGestureHandler } from 'react-native-gesture-handler' import Svg, { Circle, G, Path } from 'react-native-svg' +import ComposeContext from '../utils/createContext' export interface Props { index: number diff --git a/src/screens/Shared/Compose/EditAttachment/Root.tsx b/src/screens/Shared/Compose/EditAttachment/Root.tsx index e69f78f9..af406307 100644 --- a/src/screens/Shared/Compose/EditAttachment/Root.tsx +++ b/src/screens/Shared/Compose/EditAttachment/Root.tsx @@ -1,5 +1,4 @@ import AttachmentVideo from '@components/Timelines/Timeline/Shared/Attachment/Video' -import { ComposeContext } from '@screens/Shared/Compose' import { StyleConstants } from '@utils/styles/constants' import { useTheme } from '@utils/styles/ThemeManager' import React, { @@ -10,6 +9,7 @@ import React, { useMemo } from 'react' import { ScrollView, StyleSheet, Text, TextInput, View } from 'react-native' +import ComposeContext from '../utils/createContext' import ComposeEditAttachmentImage from './Image' export interface Props { diff --git a/src/screens/Shared/Compose/Emojis.tsx b/src/screens/Shared/Compose/Emojis.tsx index 32393e7d..739688a4 100644 --- a/src/screens/Shared/Compose/Emojis.tsx +++ b/src/screens/Shared/Compose/Emojis.tsx @@ -1,3 +1,6 @@ +import haptics from '@components/haptics' +import { StyleConstants } from '@utils/styles/constants' +import { useTheme } from '@utils/styles/ThemeManager' import React, { useCallback, useContext, useMemo } from 'react' import { Image, @@ -7,12 +10,8 @@ import { Text, View } from 'react-native' -import { StyleConstants } from '@utils/styles/constants' -import { useTheme } from '@utils/styles/ThemeManager' - -import { ComposeContext } from '@screens/Shared/Compose' +import ComposeContext from './utils/createContext' import updateText from './updateText' -import haptics from '@root/components/haptics' const SingleEmoji = ({ emoji }: { emoji: Mastodon.Emoji }) => { const { composeState, composeDispatch } = useContext(ComposeContext) diff --git a/src/screens/Shared/Compose/Poll.tsx b/src/screens/Shared/Compose/Poll.tsx index fa846442..85ae2778 100644 --- a/src/screens/Shared/Compose/Poll.tsx +++ b/src/screens/Shared/Compose/Poll.tsx @@ -1,12 +1,11 @@ -import React, { useContext, useEffect, useState } from 'react' -import { ActionSheetIOS, StyleSheet, TextInput, View } from 'react-native' -import { Feather } from '@expo/vector-icons' - -import { ComposeContext } from '@screens/Shared/Compose' -import { useTheme } from '@utils/styles/ThemeManager' -import { StyleConstants } from '@utils/styles/constants' import Button from '@components/Button' import { MenuRow } from '@components/Menu' +import { Feather } from '@expo/vector-icons' +import { StyleConstants } from '@utils/styles/constants' +import { useTheme } from '@utils/styles/ThemeManager' +import React, { useContext, useEffect, useState } from 'react' +import { ActionSheetIOS, StyleSheet, TextInput, View } from 'react-native' +import ComposeContext from './utils/createContext' const ComposePoll: React.FC = () => { const { diff --git a/src/screens/Shared/Compose/Reply.tsx b/src/screens/Shared/Compose/Reply.tsx index c0ef6933..0407d57f 100644 --- a/src/screens/Shared/Compose/Reply.tsx +++ b/src/screens/Shared/Compose/Reply.tsx @@ -1,14 +1,13 @@ -import React, { useContext } from 'react' -import { Dimensions, StyleSheet, View } from 'react-native' -import { useTheme } from '@utils/styles/ThemeManager' - import TimelineAttachment from '@components/Timelines/Timeline/Shared/Attachment' import TimelineAvatar from '@components/Timelines/Timeline/Shared/Avatar' import TimelineCard from '@components/Timelines/Timeline/Shared/Card' import TimelineContent from '@components/Timelines/Timeline/Shared/Content' import TimelineHeaderDefault from '@components/Timelines/Timeline/Shared/HeaderDefault' -import { ComposeContext } from '@screens/Shared/Compose' import { StyleConstants } from '@utils/styles/constants' +import { useTheme } from '@utils/styles/ThemeManager' +import ComposeContext from './utils/createContext' +import React, { useContext } from 'react' +import { StyleSheet, View } from 'react-native' const ComposeReply: React.FC = () => { const { @@ -16,12 +15,6 @@ const ComposeReply: React.FC = () => { } = useContext(ComposeContext) const { theme } = useTheme() - const contentWidth = - Dimensions.get('window').width - - StyleConstants.Spacing.Global.PagePadding * 2 - // Global page padding on both sides - StyleConstants.Avatar.M - // Avatar width - StyleConstants.Spacing.S // Avatar margin to the right - return ( @@ -31,10 +24,7 @@ const ComposeReply: React.FC = () => { )} {replyToStatus!.media_attachments.length > 0 && ( - + )} {replyToStatus!.card && } diff --git a/src/screens/Shared/Compose/Root.tsx b/src/screens/Shared/Compose/Root.tsx index 3206e740..1fbc7ea4 100644 --- a/src/screens/Shared/Compose/Root.tsx +++ b/src/screens/Shared/Compose/Root.tsx @@ -1,10 +1,5 @@ import haptics from '@components/haptics' import { ParseEmojis } from '@components/Parse' -import { ComposeContext } from '@screens/Shared/Compose' -import ComposeActions from '@screens/Shared/Compose/Actions' -import ComposeRootFooter from '@screens/Shared/Compose/Root/Footer' -import ComposeRootHeader from '@screens/Shared/Compose/Root/Header' -import updateText from '@screens/Shared/Compose/updateText' import { emojisFetch } from '@utils/fetches/emojisFetch' import { searchFetch } from '@utils/fetches/searchFetch' import { StyleConstants } from '@utils/styles/constants' @@ -27,6 +22,11 @@ import { } from 'react-native' import { Chase } from 'react-native-animated-spinkit' import { useQuery } from 'react-query' +import ComposeActions from './Actions' +import ComposeRootFooter from './Root/Footer' +import ComposeRootHeader from './Root/Header' +import updateText from './updateText' +import ComposeContext from './utils/createContext' import { ComposeAction, ComposeState } from './utils/types' const ListItem = React.memo( diff --git a/src/screens/Shared/Compose/Root/Footer.tsx b/src/screens/Shared/Compose/Root/Footer.tsx index 4a9d7986..a8494fc5 100644 --- a/src/screens/Shared/Compose/Root/Footer.tsx +++ b/src/screens/Shared/Compose/Root/Footer.tsx @@ -1,9 +1,9 @@ import React, { useContext } from 'react' -import { ComposeContext } from '@screens/Shared/Compose' import ComposeAttachments from '@screens/Shared/Compose/Attachments' import ComposeEmojis from '@screens/Shared/Compose/Emojis' import ComposePoll from '@screens/Shared/Compose/Poll' import ComposeReply from '@screens/Shared/Compose/Reply' +import ComposeContext from '@screens/Shared/Compose//utils/createContext' const ComposeRootFooter: React.FC = () => { const { composeState } = useContext(ComposeContext) diff --git a/src/screens/Shared/Compose/Root/Header.tsx b/src/screens/Shared/Compose/Root/Header.tsx index 82e1376c..135e41c9 100644 --- a/src/screens/Shared/Compose/Root/Header.tsx +++ b/src/screens/Shared/Compose/Root/Header.tsx @@ -1,7 +1,7 @@ import React, { useContext } from 'react' -import { ComposeContext } from '@screens/Shared/Compose' import ComposeSpoilerInput from '@screens/Shared/Compose/SpoilerInput' import ComposeTextInput from '@screens/Shared/Compose/TextInput' +import ComposeContext from '@screens/Shared/Compose//utils/createContext' const ComposeRootHeader: React.FC = () => { const { composeState } = useContext(ComposeContext) diff --git a/src/screens/Shared/Compose/SpoilerInput.tsx b/src/screens/Shared/Compose/SpoilerInput.tsx index 428625f0..283f7850 100644 --- a/src/screens/Shared/Compose/SpoilerInput.tsx +++ b/src/screens/Shared/Compose/SpoilerInput.tsx @@ -2,8 +2,8 @@ import React, { useContext } from 'react' import { StyleSheet, Text, TextInput } from 'react-native' import { StyleConstants } from '@utils/styles/constants' import { useTheme } from '@utils/styles/ThemeManager' -import { ComposeContext } from '@screens/Shared/Compose' import formatText from './formatText' +import ComposeContext from './utils/createContext' const ComposeSpoilerInput: React.FC = () => { const { composeState, composeDispatch } = useContext(ComposeContext) diff --git a/src/screens/Shared/Compose/TextInput.tsx b/src/screens/Shared/Compose/TextInput.tsx index a685de7e..c667e589 100644 --- a/src/screens/Shared/Compose/TextInput.tsx +++ b/src/screens/Shared/Compose/TextInput.tsx @@ -1,9 +1,9 @@ -import React, { useCallback, useContext } from 'react' +import React, { useContext } from 'react' import { StyleSheet, Text, TextInput } from 'react-native' import { StyleConstants } from '@utils/styles/constants' import { useTheme } from '@utils/styles/ThemeManager' -import { ComposeContext } from '@screens/Shared/Compose' import formatText from './formatText' +import ComposeContext from './utils/createContext' const ComposeTextInput: React.FC = () => { const { composeState, composeDispatch } = useContext(ComposeContext) diff --git a/src/screens/Shared/Compose/utils/createContext.ts b/src/screens/Shared/Compose/utils/createContext.ts new file mode 100644 index 00000000..7e7ddaf8 --- /dev/null +++ b/src/screens/Shared/Compose/utils/createContext.ts @@ -0,0 +1,10 @@ +import { createContext, Dispatch } from 'react' +import { ComposeAction, ComposeState } from './types' + +type ContextType = { + composeState: ComposeState + composeDispatch: Dispatch +} +const ComposeContext = createContext({} as ContextType) + +export default ComposeContext