TODO: Bổ sung logic ui khi bấm vào to me thì hạ render bottom card xuống và ngược lại

src/screens/email/detail/view.js

-import React from 'react';
+import React, {useState} from 'react';
 import {Text, View, TouchableOpacity, Image, ScrollView} from 'react-native';
 import styles from './style';
 import Header from '../../../components/Header/Header';
@@ -7,6 +7,7 @@ import {useNavigation} from '@react-navigation/native';
 const DetailEmailView = props => {
   const {incoming_document} = props;
   const navigation = useNavigation();
+  const [showBottomCard, setShowBottomCard] = useState(false);
   const renderHeader = () => {
     return (
       <View style={styles.header}>
@@ -99,16 +100,21 @@ const DetailEmailView = props => {
           <View style={styles.avatarTextContainer}>
             <View>
               <Text style={styles.name}>{incoming_document.name}</Text>
-              <View style={styles.toMeContainer}>
+              <TouchableOpacity 
+                style={styles.toMeContainer}
+                onPress={() => setShowBottomCard(!showBottomCard)}
+              >
                 <Text>
                   to me
                 </Text>
                 <Image
                   source={R.images.icDrop}
-                  style={styles.iconDrop}
+                  style={[styles.iconDrop, {
+                    transform: [{ rotate: showBottomCard ? '180deg' : '0deg' }]
+                  }]}
                   resizeMode="contain"
                 />
-              </View>
+              </TouchableOpacity>
             </View>
 
             <Text style={styles.date}>{incoming_document.date}</Text>
@@ -116,7 +122,7 @@ const DetailEmailView = props => {
 
          
         </View>
-        {renderBottomCard()}
+        {showBottomCard && renderBottomCard()}
         <View style={{marginVertical:15}}>
           <Text style={styles.textContent}>{incoming_document.content}</Text>
         </View>