Attachments sensitive done

src/screens/Shared/Compose.tsx

@@ -67,7 +67,7 @@ export type PostState = {
       | '604800'
       | string
   }
-  attachments: Mastodon.Attachment[]
+  attachments: { sensitive: boolean; uploads: Mastodon.Attachment[] }
   attachmentUploadProgress: { progress: number; aspect?: number } | undefined
   visibility: 'public' | 'unlisted' | 'private' | 'direct'
 }
@@ -95,7 +95,7 @@ export type PostAction =
     }
   | {
       type: 'attachments'
-      payload: PostState['attachments']
+      payload: Partial<PostState['attachments']>
     }
   | {
       type: 'attachmentUploadProgress'
@@ -138,7 +138,7 @@ const postInitialState: PostState = {
     multiple: false,
     expire: '86400'
   },
-  attachments: [],
+  attachments: { sensitive: false, uploads: [] },
   attachmentUploadProgress: undefined,
   visibility:
     getLocalAccountPreferences(store.getState())[
@@ -158,15 +158,21 @@ const postReducer = (state: PostState, action: PostAction): PostState => {
     case 'poll':
       return { ...state, poll: action.payload }
     case 'attachments':
-      return { ...state, attachments: action.payload }
+      return {
+        ...state,
+        attachments: { ...state.attachments, ...action.payload }
+      }
     case 'attachmentUploadProgress':
       return { ...state, attachmentUploadProgress: action.payload }
     case 'attachmentEdit':
       return {
         ...state,
-        attachments: state.attachments.map(attachment =>
+        attachments: {
-          attachment.id === action.payload.id ? action.payload : attachment
+          ...state.attachments,
-        )
+          uploads: state.attachments.uploads.map(upload =>
+            upload.id === action.payload.id ? action.payload : upload
+          )
+        }
       }
     case 'visibility':
       return { ...state, visibility: action.payload }
@@ -226,8 +232,9 @@ const Compose: React.FC = () => {
         formData.append('poll[multiple]', postState.poll.multiple.toString())
       }
 
-      if (postState.attachments.length) {
+      if (postState.attachments.uploads.length) {
-        postState.attachments.forEach(e =>
+        formData.append('sensitive', postState.attachments.sensitive.toString())
+        postState.attachments.uploads.forEach(e =>
           formData.append('media_ids[]', e!.id)
         )
       }
@@ -248,7 +255,8 @@ const Compose: React.FC = () => {
               postState.poll.options['3'] +
               postState.poll.multiple +
               postState.poll.expire +
-              postState.attachments.map(attachment => attachment.id) +
+              postState.attachments.sensitive +
+              postState.attachments.uploads.map(upload => upload.id) +
               postState.visibility
           ).toString()
         },

src/screens/Shared/Compose/Actions.tsx

@@ -43,31 +43,31 @@ const ComposeActions: React.FC<Props> = ({
     if (postState.poll.active) return theme.disabled
     if (postState.attachmentUploadProgress) return theme.primary
 
-    if (postState.attachments.length) {
+    if (postState.attachments.uploads.length) {
       return theme.primary
     } else {
       return theme.secondary
     }
   }, [
     postState.poll.active,
-    postState.attachments,
+    postState.attachments.uploads,
     postState.attachmentUploadProgress
   ])
   const attachmentOnPress = useCallback(async () => {
     if (postState.poll.active) return
     if (postState.attachmentUploadProgress) return
 
-    if (!postState.attachments.length) {
+    if (!postState.attachments.uploads.length) {
       return await addAttachments({ postState, postDispatch })
     }
   }, [
     postState.poll.active,
-    postState.attachments,
+    postState.attachments.uploads,
     postState.attachmentUploadProgress
   ])
 
   const pollColor = useMemo(() => {
-    if (postState.attachments.length) return theme.disabled
+    if (postState.attachments.uploads.length) return theme.disabled
     if (postState.attachmentUploadProgress) return theme.disabled
 
     if (postState.poll.active) {
@@ -77,11 +77,14 @@ const ComposeActions: React.FC<Props> = ({
     }
   }, [
     postState.poll.active,
-    postState.attachments,
+    postState.attachments.uploads,
     postState.attachmentUploadProgress
   ])
   const pollOnPress = useCallback(() => {
-    if (!postState.attachments.length && !postState.attachmentUploadProgress) {
+    if (
+      !postState.attachments.uploads.length &&
+      !postState.attachmentUploadProgress
+    ) {
       postDispatch({
         type: 'poll',
         payload: { ...postState.poll, active: !postState.poll.active }
@@ -92,7 +95,7 @@ const ComposeActions: React.FC<Props> = ({
     }
   }, [
     postState.poll.active,
-    postState.attachments,
+    postState.attachments.uploads,
     postState.attachmentUploadProgress
   ])
 

src/screens/Shared/Compose/Attachments.tsx

@@ -15,6 +15,7 @@ import { useNavigation } from '@react-navigation/native'
 import ShimmerPlaceholder from 'react-native-shimmer-placeholder'
 import { ButtonRound } from 'src/components/Button'
 import addAttachments from './addAttachments'
+import { Feather } from '@expo/vector-icons'
 
 const DEFAULT_HEIGHT = 200
 
@@ -74,7 +75,11 @@ const ComposeAttachments: React.FC<Props> = ({ postState, postDispatch }) => {
             onPress={() =>
               postDispatch({
                 type: 'attachments',
-                payload: postState.attachments.filter(e => e.id !== item.id)
+                payload: {
+                  uploads: postState.attachments.uploads.filter(
+                    e => e.id !== item.id
+                  )
+                }
               })
             }
             styles={styles.delete}
@@ -105,9 +110,9 @@ const ComposeAttachments: React.FC<Props> = ({ postState, postDispatch }) => {
         }
         height={200}
       >
-        {postState.attachments.length > 0 &&
+        {postState.attachments.uploads.length > 0 &&
-          postState.attachments[0].type === 'image' &&
+          postState.attachments.uploads[0].type === 'image' &&
-          postState.attachments.length < 4 && (
+          postState.attachments.uploads.length < 4 && (
             <Pressable
               style={{
                 width: DEFAULT_HEIGHT,
@@ -139,19 +144,39 @@ const ComposeAttachments: React.FC<Props> = ({ postState, postDispatch }) => {
           )}
       </ShimmerPlaceholder>
     )
-  }, [postState.attachmentUploadProgress])
+  }, [postState.attachmentUploadProgress, postState.attachments.uploads])
 
   return (
     <View style={styles.base}>
-      <FlatList
+      <Pressable
-        horizontal
+        style={styles.sensitive}
-        extraData={postState.attachmentUploadProgress}
+        onPress={() =>
-        data={postState.attachments}
+          postDispatch({
-        renderItem={renderAttachment}
+            type: 'attachments',
-        ListFooterComponent={listFooter}
+            payload: { sensitive: !postState.attachments.sensitive }
-        showsHorizontalScrollIndicator={false}
+          })
-        keyboardShouldPersistTaps='handled'
+        }
-      />
+      >
+        <Feather
+          name={postState.attachments.sensitive ? 'check-circle' : 'circle'}
+          size={StyleConstants.Font.Size.L}
+          color={theme.primary}
+        />
+        <Text style={[styles.sensitiveText, { color: theme.primary }]}>
+          标记媒体为敏感内容
+        </Text>
+      </Pressable>
+      <View style={styles.imageContainer}>
+        <FlatList
+          horizontal
+          extraData={postState.attachments.uploads.length}
+          data={postState.attachments.uploads}
+          renderItem={renderAttachment}
+          ListFooterComponent={listFooter}
+          showsHorizontalScrollIndicator={false}
+          keyboardShouldPersistTaps='handled'
+        />
+      </View>
     </View>
   )
 }
@@ -159,8 +184,20 @@ const ComposeAttachments: React.FC<Props> = ({ postState, postDispatch }) => {
 const styles = StyleSheet.create({
   base: {
     flex: 1,
-    flexDirection: 'row',
     marginRight: StyleConstants.Spacing.Global.PagePadding,
+    marginTop: StyleConstants.Spacing.M
+  },
+  sensitive: {
+    flex: 1,
+    flexDirection: 'row',
+    alignItems: 'center',
+    marginLeft: StyleConstants.Spacing.Global.PagePadding
+  },
+  sensitiveText: {
+    fontSize: StyleConstants.Font.Size.M,
+    marginLeft: StyleConstants.Spacing.S
+  },
+  imageContainer: {
     height: DEFAULT_HEIGHT
   },
   image: {
@@ -200,4 +237,4 @@ const styles = StyleSheet.create({
   }
 })
 
-export default React.memo(ComposeAttachments, () => true)
+export default ComposeAttachments

src/screens/Shared/Compose/Root.tsx

@@ -121,7 +121,7 @@ const ComposeRoot: React.FC<Props> = ({ postState, postDispatch }) => {
               </View>
             )}
 
-            {(postState.attachments.length > 0 ||
+            {(postState.attachments.uploads.length > 0 ||
               postState.attachmentUploadProgress) && (
               <View style={styles.attachments}>
                 <ComposeAttachments

src/screens/Shared/Compose/addAttachments.ts

@@ -48,7 +48,7 @@ const uploadAttachment = async ({
         body.local_url = result.uri
         postDispatch({
           type: 'attachments',
-          payload: postState.attachments.concat([body])
+          payload: { uploads: postState.attachments.uploads.concat([body]) }
         })
         return Promise.resolve()
       } else {
@@ -99,7 +99,6 @@ const addAttachments = async ({
         })
 
         if (!result.cancelled) {
-          console.log(result)
           await uploadAttachment({ result, ...params })
         }
       } else if (buttonIndex === 1) {