Update color scheme

src/Index.tsx

@@ -171,20 +171,25 @@ export const Index: React.FC<Props> = ({ localCorrupt }) => {
           })}
           tabBarOptions={{
             activeTintColor: theme.primary,
-            inactiveTintColor: localInstance ? theme.secondary : theme.disabled,
+            inactiveTintColor: theme.secondary,
             showLabel: false
           }}
         >
           <Tab.Screen
             name='Screen-Local'
             component={ScreenLocal}
-            listeners={{
+            listeners={({ navigation }) => ({
               tabPress: e => {
                 if (!localInstance) {
                   e.preventDefault()
+                  toast({
+                    type: 'error',
+                    content: '请先登录',
+                    onHide: () => navigation.navigate('Screen-Me')
+                  })
                 }
               }
-            }}
+            })}
           />
           <Tab.Screen name='Screen-Public' component={ScreenPublic} />
           <Tab.Screen
@@ -192,10 +197,17 @@ export const Index: React.FC<Props> = ({ localCorrupt }) => {
             listeners={({ navigation }) => ({
               tabPress: e => {
                 e.preventDefault()
-                localInstance &&
+                if (localInstance) {
                   navigation.navigate(getCurrentTab(navigation), {
                     screen: 'Screen-Shared-Compose'
                   })
+                } else {
+                  toast({
+                    type: 'error',
+                    content: '请先登录',
+                    onHide: () => navigation.navigate('Screen-Me')
+                  })
+                }
               }
             })}
           >
@@ -207,15 +219,23 @@ export const Index: React.FC<Props> = ({ localCorrupt }) => {
             options={{
               tabBarBadge:
                 prevNotification && prevNotification.unread ? '' : undefined,
-              tabBarBadgeStyle: { transform: [{ scale: 0.5 }] }
+              tabBarBadgeStyle: {
+                transform: [{ scale: 0.5 }],
+                backgroundColor: theme.red
+              }
             }}
-            listeners={{
+            listeners={({ navigation }) => ({
               tabPress: e => {
                 if (!localInstance) {
                   e.preventDefault()
+                  toast({
+                    type: 'error',
+                    content: '请先登录',
+                    onHide: () => navigation.navigate('Screen-Me')
+                  })
                 }
               }
-            }}
+            })}
           />
           <Tab.Screen name='Screen-Me' component={ScreenMe} />
         </Tab.Navigator>

src/components/Menu/Button.tsx

@@ -27,7 +27,7 @@ const Core: React.FC<Props> = ({ text, destructive = false }) => {
 
   return (
     <View style={styles.core}>
-      <Text style={{ color: destructive ? theme.error : theme.primary }}>
+      <Text style={{ color: destructive ? theme.red : theme.primary }}>
         {text}
       </Text>
     </View>

src/components/ParseContent.tsx

@@ -36,7 +36,7 @@ const renderNode = ({
           <Text
             key={index}
             style={{
-              color: theme.link,
+              color: theme.blue,
               fontSize: StyleConstants.Font.Size[size]
             }}
             onPress={() => {
@@ -55,7 +55,7 @@ const renderNode = ({
           <Text
             key={index}
             style={{
-              color: theme.link,
+              color: theme.blue,
               fontSize: StyleConstants.Font.Size[size]
             }}
             onPress={() => {
@@ -79,7 +79,7 @@ const renderNode = ({
         <Text
           key={index}
           style={{
-            color: theme.link,
+            color: theme.blue,
             fontSize: StyleConstants.Font.Size[size]
           }}
           onPress={async () => await openLink(href)}
@@ -87,7 +87,7 @@ const renderNode = ({
           <Feather
             name='external-link'
             size={StyleConstants.Font.Size[size]}
-            color={theme.link}
+            color={theme.blue}
           />{' '}
           {showFullLink ? href : domain[1]}
         </Text>
@@ -152,7 +152,7 @@ const ParseContent: React.FC<Props> = ({
     const [totalLines, setTotalLines] = useState<number | undefined>()
     const [lineHeight, setLineHeight] = useState<number | undefined>()
     const [shownLines, setShownLines] = useState(numberOfLines)
-    // console.log(children)
+
     return (
       <>
         <Text

src/components/Timelines/Timeline/Shared/Actions.tsx

@@ -143,16 +143,19 @@ const TimelineActions: React.FC<Props> = ({
       }
     })
   }, [])
-  const onPressReblog = useCallback(
-    () =>
+  const onPressReblog = useCallback(() => {
+    if (status.visibility === 'private' || status.visibility === 'direct') {
+      console.log('awjerio')
+      toast({ type: 'error', content: '禁止转发' })
+    } else {
       mutate({
         id: status.id,
         type: 'reblog',
         stateKey: 'reblogged',
         prevState: status.reblogged
-      }),
-    [status.reblogged]
-  )
+      })
+    }
+  }, [status.reblogged])
   const onPressFavourite = useCallback(
     () =>
       mutate({
@@ -218,11 +221,7 @@ const TimelineActions: React.FC<Props> = ({
     () => (
       <Feather
         name='repeat'
-        color={
-          status.visibility === 'public' || status.visibility === 'unlisted'
-            ? iconColorAction(status.reblogged)
-            : theme.disabled
-        }
+        color={iconColorAction(status.reblogged)}
         size={StyleConstants.Font.Size.M + 2}
       />
     ),
@@ -270,11 +269,7 @@ const TimelineActions: React.FC<Props> = ({
 
         <Pressable
           style={styles.action}
-          onPress={
-            status.visibility === 'public' || status.visibility === 'unlisted'
-              ? onPressReblog
-              : null
-          }
+          onPress={onPressReblog}
           children={childrenReblog}
         />
 

src/components/Timelines/Timeline/Shared/Attachment/Audio.tsx

@@ -93,8 +93,8 @@ const AttachmentAudio: React.FC<Props> = ({ sensitiveShown, audio }) => {
           minimumValue={0}
           maximumValue={audio.meta.original.duration * 1000}
           value={audioPosition}
-          minimumTrackTintColor={theme.secondary}
-          maximumTrackTintColor={theme.disabled}
+          minimumTrackTintColor={theme.primary}
+          maximumTrackTintColor={theme.secondary}
           onSlidingStart={() => {
             audioPlayer?.pauseAsync()
             setAudioPlaying(false)

src/components/toast.tsx

@@ -53,6 +53,11 @@ const ToastBase = ({ config }: { config: Config }) => {
     error: 'x-circle',
     warning: 'alert-circle'
   }
+  enum colorMapping {
+    success = 'blue',
+    error = 'red',
+    warning = 'primary'
+  }
 
   return (
     <SafeAreaView
@@ -65,7 +70,7 @@ const ToastBase = ({ config }: { config: Config }) => {
         <Feather
           // @ts-ignore
           name={iconSet[config.type]}
-          color={theme[config.type]}
+          color={theme[colorMapping[config.type]]}
           size={StyleConstants.Font.Size.M + 2}
         />
         <View style={styles.texts}>

src/screens/Shared/Compose.tsx

@@ -31,6 +31,8 @@ import { StyleConstants } from '@utils/styles/constants'
 import { useTheme } from '@utils/styles/ThemeManager'
 import formatText from '@screens/Shared/Compose/formatText'
 import { useQueryClient } from 'react-query'
+import Toast from 'react-native-toast-message'
+import { toastConfig } from '@root/components/toast'
 
 const Stack = createNativeStackNavigator()
 
@@ -566,8 +568,7 @@ const Compose: React.FC<Props> = ({ route: { params }, navigation }) => {
                   style={[
                     styles.count,
                     {
-                      color:
-                        totalTextCount > 500 ? theme.error : theme.secondary
+                      color: totalTextCount > 500 ? theme.red : theme.secondary
                     }
                   ]}
                 >
@@ -596,6 +597,7 @@ const Compose: React.FC<Props> = ({ route: { params }, navigation }) => {
           </Stack.Screen>
         </Stack.Navigator>
       </SafeAreaView>
+      <Toast ref={(ref: any) => Toast.setRef(ref)} config={toastConfig} />
     </KeyboardAvoidingView>
   )
 }

src/screens/Shared/Compose/Actions.tsx

@@ -1,17 +1,17 @@
 import { Feather } from '@expo/vector-icons'
-import React, { useCallback, useContext, useMemo } from 'react'
-import { ActionSheetIOS, StyleSheet, View } from 'react-native'
+import React, { RefObject, useCallback, useContext, useMemo } from 'react'
+import { ActionSheetIOS, StyleSheet, TextInput, View } from 'react-native'
 import { StyleConstants } from '@utils/styles/constants'
 import { useTheme } from '@utils/styles/ThemeManager'
 import { ComposeContext } from '@screens/Shared/Compose'
 import addAttachments from '@screens/Shared/Compose/addAttachments'
+import { toast } from '@root/components/toast'
 
 const ComposeActions: React.FC = () => {
   const { composeState, composeDispatch } = useContext(ComposeContext)
   const { theme } = useTheme()
 
   const attachmentColor = useMemo(() => {
-    if (composeState.poll.active) return theme.disabled
     if (composeState.attachmentUploadProgress) return theme.primary
 
     if (composeState.attachments.uploads.length) {
@@ -25,7 +25,13 @@ const ComposeActions: React.FC = () => {
     composeState.attachmentUploadProgress
   ])
   const attachmentOnPress = useCallback(async () => {
-    if (composeState.poll.active) return
+    if (composeState.poll.active) {
+      toast({
+        type: 'error',
+        content: '长毛象不支持同时发布附件及投票'
+      })
+      return
+    }
     if (composeState.attachmentUploadProgress) return
 
     if (!composeState.attachments.uploads.length) {
@@ -38,9 +44,6 @@ const ComposeActions: React.FC = () => {
   ])
 
   const pollColor = useMemo(() => {
-    if (composeState.attachments.uploads.length) return theme.disabled
-    if (composeState.attachmentUploadProgress) return theme.disabled
-
     if (composeState.poll.active) {
       return theme.primary
     } else {
@@ -52,6 +55,17 @@ const ComposeActions: React.FC = () => {
     composeState.attachmentUploadProgress
   ])
   const pollOnPress = useCallback(() => {
+    if (
+      composeState.attachments.uploads.length ||
+      composeState.attachmentUploadProgress
+    ) {
+      toast({
+        type: 'error',
+        content: '长毛象不支持同时发布附件及投票'
+      })
+      return
+    }
+
     if (
       !composeState.attachments.uploads.length &&
       !composeState.attachmentUploadProgress
@@ -82,9 +96,8 @@ const ComposeActions: React.FC = () => {
         return 'mail'
     }
   }, [composeState.visibility])
-  const visibilityOnPress = useCallback(
-    () =>
-      !composeState.visibilityLock &&
+  const visibilityOnPress = useCallback(() => {
+    if (!composeState.visibilityLock) {
       ActionSheetIOS.showActionSheetWithOptions(
         {
           options: ['公开', '不公开', '仅关注着', '私信', '取消'],
@@ -106,21 +119,21 @@ const ComposeActions: React.FC = () => {
               break
           }
         }
-      ),
-    []
       )
+    }
+  }, [])
 
-  const spoilerOnPress = useCallback(
-    () =>
+  const spoilerOnPress = useCallback(() => {
+    if (composeState.spoiler.active) {
+      composeState.textInputFocus.refs.text.current?.focus()
+    }
     composeDispatch({
       type: 'spoiler',
       payload: { active: !composeState.spoiler.active }
-      }),
-    [composeState.spoiler.active]
-  )
+    })
+  }, [composeState.spoiler.active, composeState.textInputFocus])
 
   const emojiColor = useMemo(() => {
-    if (!composeState.emoji.emojis) return theme.disabled
     if (composeState.emoji.active) {
       return theme.primary
     } else {
@@ -128,6 +141,14 @@ const ComposeActions: React.FC = () => {
     }
   }, [composeState.emoji.active, composeState.emoji.emojis])
   const emojiOnPress = useCallback(() => {
+    if (!composeState.emoji.emojis) {
+      toast({
+        type: 'error',
+        content: '提取emoji错误'
+      })
+      return
+    }
+
     if (composeState.emoji.emojis) {
       if (composeState.emoji.active) {
         composeDispatch({
@@ -165,7 +186,7 @@ const ComposeActions: React.FC = () => {
       <Feather
         name={visibilityIcon}
         size={24}
-        color={composeState.visibilityLock ? theme.disabled : theme.secondary}
+        color={composeState.visibilityLock ? theme.primary : theme.secondary}
         onPress={visibilityOnPress}
       />
       <Feather

src/screens/Shared/Compose/Poll.tsx

@@ -59,7 +59,7 @@ const ComposePoll: React.FC = () => {
                   styles.textInput,
                   {
                     borderColor: theme.border,
-                    color: hasConflict ? theme.error : theme.primary
+                    color: hasConflict ? theme.red : theme.primary
                   }
                 ]}
                 placeholder={`选项`}

src/screens/Shared/Compose/Reply.tsx

@@ -31,7 +31,10 @@ const ComposeReply: React.FC = () => {
           <TimelineContent status={replyToStatus!} />
         )}
         {replyToStatus!.media_attachments.length > 0 && (
-          <TimelineAttachment status={replyToStatus!} width={contentWidth} />
+          <TimelineAttachment
+            status={replyToStatus!}
+            contentWidth={contentWidth}
+          />
         )}
         {replyToStatus!.card && <TimelineCard card={replyToStatus!.card} />}
       </View>

src/screens/Shared/Compose/Root.tsx

@@ -40,19 +40,15 @@ const ListItem = React.memo(
   ({
     item,
     composeState,
-    composeDispatch,
-    textInputRef
+    composeDispatch
   }: {
     item: Mastodon.Account & Mastodon.Tag
     composeState: ComposeState
     composeDispatch: Dispatch<ComposeAction>
-    textInputRef: RefObject<TextInput>
   }) => {
     const { theme } = useTheme()
     const onPress = useCallback(() => {
-      const focusedInput = textInputRef.current?.isFocused()
-        ? 'text'
-        : 'spoiler'
+      const focusedInput = composeState.textInputFocus.current
       updateText({
         composeState: {
           ...composeState,
@@ -161,8 +157,6 @@ const ComposeRoot: React.FC = () => {
     }
   }, [emojisData])
 
-  const textInputRef = useRef<TextInput>(null)
-
   const listEmpty = useMemo(() => {
     if (isFetching) {
       return <ActivityIndicator />
@@ -180,7 +174,6 @@ const ComposeRoot: React.FC = () => {
           item={item}
           composeState={composeState}
           composeDispatch={composeDispatch}
-          textInputRef={textInputRef}
         />
       ) : null,
     [isSuccess]

src/screens/Shared/Compose/Root/Footer.tsx

@@ -9,7 +9,7 @@ import ComposeReply from '@screens/Shared/Compose/Reply'
 
 const ComposeRootFooter: React.FC = () => {
   const { composeState } = useContext(ComposeContext)
-  console.log(composeState)
+
   return (
     <>
       {composeState.emoji.active && (

src/screens/Shared/Compose/SpoilerInput.tsx

@@ -44,6 +44,12 @@ const ComposeSpoilerInput: React.FC = () => {
       }}
       ref={composeState.textInputFocus.refs.spoiler}
       scrollEnabled
+      onFocus={() =>
+        composeDispatch({
+          type: 'textInputFocus',
+          payload: { current: 'spoiler' }
+        })
+      }
     >
       <Text>{composeState.spoiler.formatted}</Text>
     </TextInput>

src/screens/Shared/Compose/TextInput.tsx

@@ -1,4 +1,4 @@
-import React, { useContext } from 'react'
+import React, { useCallback, useContext } from 'react'
 import { StyleSheet, Text, TextInput } from 'react-native'
 import { StyleConstants } from '@utils/styles/constants'
 import { useTheme } from '@utils/styles/ThemeManager'

src/screens/Shared/Compose/formatText.tsx

@@ -17,7 +17,7 @@ export interface Params {
 const TagText = ({ text }: { text: string }) => {
   const { theme } = useTheme()
 
-  return <Text style={{ color: theme.link }}>{text}</Text>
+  return <Text style={{ color: theme.blue }}>{text}</Text>
 }
 
 const debouncedSuggestions = debounce(

src/utils/fetches/timelineFetch.ts

@@ -128,7 +128,6 @@ export const timelineFetch = async ({
       return Promise.resolve({ toots: res.body })
 
     case 'Account_Media':
-      console.log(account)
       res = await client({
         method: 'get',
         instance: 'local',

src/utils/styles/themes.ts

@@ -4,17 +4,14 @@ export type ColorDefinitions =
   | 'primary'
   | 'primaryOverlay'
   | 'secondary'
-  | 'disabled'
+  | 'blue'
+  | 'red'
   | 'background'
   | 'backgroundGradientStart'
   | 'backgroundGradientEnd'
   | 'backgroundOverlay'
-  | 'link'
   | 'border'
   | 'separator'
-  | 'success'
-  | 'error'
-  | 'warning'
 
 const themeColors: {
   [key in ColorDefinitions]: {
@@ -23,41 +20,42 @@ const themeColors: {
   }
 } = {
   primary: {
-    light: 'rgb(0, 0, 0)',
-    dark: 'rgb(255, 255, 255)'
+    light: 'rgb(18, 18, 18)',
+    dark: 'rgb(218, 218, 218)'
   },
   primaryOverlay: {
-    light: 'rgb(255, 255, 255)',
-    dark: 'rgb(0, 0, 0)'
+    light: 'rgb(250, 250, 250)',
+    dark: 'rgb(218, 218, 218)'
   },
   secondary: {
-    light: 'rgb(153, 153, 153)',
-    dark: 'rgb(117, 117, 117)'
+    light: 'rgb(135, 135, 135)',
+    dark: 'rgb(135, 135, 135)'
   },
-  disabled: {
-    light: 'rgb(229, 229, 234)',
-    dark: 'rgb(44, 44, 46)'
+  blue: {
+    light: 'rgb(43, 144, 221)',
+    dark: 'rgb(43, 144, 221)'
   },
+  red: {
+    light: 'rgb(225, 45, 35)',
+    dark: 'rgb(225, 98, 89)'
+  },
+
   background: {
-    light: 'rgb(255, 255, 255)',
-    dark: 'rgb(0, 0, 0)'
+    light: 'rgb(250, 250, 250)',
+    dark: 'rgb(18, 18, 18)'
   },
   backgroundGradientStart: {
-    light: 'rgba(255, 255, 255, 0.5)',
-    dark: 'rgba(0, 0, 0, 0.5)'
+    light: 'rgba(250, 250, 250, 0.5)',
+    dark: 'rgba(18, 18, 18, 0.5)'
   },
   backgroundGradientEnd: {
-    light: 'rgba(255, 255, 255, 1)',
-    dark: 'rgba(0, 0, 0, 1)'
+    light: 'rgba(250, 250, 250, 1)',
+    dark: 'rgba(18, 18, 18, 1)'
   },
   backgroundOverlay: {
-    light: 'rgba(0, 0, 0, 0.5)',
+    light: 'rgba(18, 18, 18, 0.5)',
     dark: 'rgba(255, 255, 255, 0.5)'
   },
-  link: {
-    light: 'rgb(0, 122, 255)',
-    dark: 'rgb(10, 132, 255)'
-  },
   border: {
     light: 'rgba(0, 0, 0, 0.3)',
     dark: 'rgba(255, 255, 255, 0.16)'
@@ -65,18 +63,6 @@ const themeColors: {
   separator: {
     light: 'rgba(0, 0, 0, 0.1)',
     dark: 'rgba(255, 255, 255, 0.1)'
-  },
-  success: {
-    light: 'rgb(52, 199, 89)',
-    dark: 'rgb(48, 209, 88)'
-  },
-  error: {
-    light: 'rgb(255, 59, 48)',
-    dark: 'rgb(255, 69, 58)'
-  },
-  warning: {
-    light: 'rgb(255, 149, 0)',
-    dark: 'rgb(255, 159, 10)'
   }
 }