ERROR

android/app/src/main/AndroidManifest.xml

@@ -4,6 +4,8 @@
     <uses-permission android:name="android.permission.CAMERA" />
     <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
     <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
+    <uses-feature android:name="android.hardware.camera" android:required="false" />
+    <uses-feature android:name="android.hardware.camera.autofocus" android:required="false" />
 
     <application
       android:name=".MainApplication"

android/build.gradle

 buildscript {
     ext {
         buildToolsVersion = "34.0.0"
-        minSdkVersion = 23
+        minSdkVersion = 24
         compileSdkVersion = 34
         targetSdkVersion = 34
         ndkVersion = "26.1.10909125"

src/screens/home/header.js

 import {
   Image,
-  SafeAreaView,
-  StatusBar,
   StyleSheet,
   TextInput,
   View,
+  Platform,
+  SafeAreaView,
+  StatusBar,
 } from 'react-native';
 import React from 'react';
 import R from '../../assets/R';
 import styles from './style';
-const customHeader = props => {
-  const {
-    pathLogo,
-    width,
-    height,
-    value,
-    textLabel,
-    onChangeText,
-    textColorLabel,
-  } = props;
-  const SearchIcon = R.images.icSearch;
+const HeaderHome = props => {
+  const {value, onChangeText} = props;
   return (
-    <View style={[styles.container_header, styles.spacing_header]}>
-      <Image source={pathLogo} style={{width: width, height: height}} />
-      <View style={styles.size_box}></View>
-      <View style={styles.search_box}>
-        <SearchIcon
-          width={20}
-          height={20}
-          stroke={R.colors.white}
-          stroke-width={2}
+    <SafeAreaView style={styles.container_header}>
+      <StatusBar
+        barStyle="light-content"
+        translucent={false}
+        backgroundColor="black"
+      />
+      <View style={styles.boxLogo}>
+        <Image
+          source={R.images.igLogo}
+          maxWidth={Platform.OS === 'ios' ? 65 : 75}
+          maxHeight={Platform.OS === 'ios' ? 26 : 36}
+          resizeMode="contain"
         />
-        <View style={styles.size_box_2}></View>
+      </View>
+      <View style={{flex: 1}}></View>
+      <View style={styles.searchBox}>
+        <View style={styles.boxIconSearch}>
+          <Image
+            source={R.images.icSearchHeader}
+            maxWidth={Platform.OS === 'ios' ? 16 : 20}
+            maxHeight={Platform.OS === 'ios' ? 16 : 20}
+          />
+        </View>
         <TextInput
           value={value}
+          fontSize={R.fontsize.fontSizeContent}
           onChangeText={onChangeText}
-          placeholder={textLabel}
-          placeholderTextColor={textColorLabel}
+          placeholder={'Tìm kiếm'}
+          placeholderTextColor={R.colors.white}
           style={styles.input}
         />
       </View>
-    </View>
+    </SafeAreaView>
   );
 };
 
-export default customHeader;
+export default HeaderHome;

src/screens/home/style.js

@@ -76,6 +76,25 @@ const styles = StyleSheet.create({
     backgroundColor: R.colors.white,
     overflow: 'hidden',
   },
+  boxLogo: {
+    flexDirection: 'row',
+    alignItems: 'center',
+  },
+  searchBox: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    backgroundColor: R.colors.black250,
+    borderRadius: 100,
+    paddingHorizontal: 10,
+    paddingVertical: 5,
+    width: '60%',
+  },
+  boxIconSearch: {
+    width: 20,
+    height: 20,
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
   avatar_image: {
     width: '100%',
     height: '100%',

src/screens/profile/style.js

+import { StyleSheet } from 'react-native'
+import R from '../../assets/R'
+
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+        paddingHorizontal: 15,
+        paddingBottom: 9,
+        backgroundColor: R.colors.white
+      },
+      body_header: {
+        flexDirection: "row",
+      },
+      container_image: {
+        flex: 1,
+        alignItems: "flex-start",
+        justifyContent: "flex-start",
+      },
+      container_body: {
+        flexDirection: "row",
+        marginTop: 10,
+        marginBottom: 5
+      },
+      images: {
+        backgroundColor: R.colors.grey_50,
+        minWidth: 108,
+        minHeight: 177,
+        borderRadius: 15,
+        borderWidth: 1,
+        borderColor: R.colors.grey_200,
+        justifyContent: "center",
+        alignItems: "center",
+      },
+      body_info_user: {
+        flex: 1.8,
+      },
+      text: {
+        fontFamily: R.fonts.InterRegular,
+        fontWeight: "400",
+        fontSize: R.fontsize.fontsSize12,
+        color: R.colors.blue500,
+        lineHeight: 24
+      },
+      
+      text_label: {
+        fontFamily: R.fonts.InterRegular,
+        fontWeight: "400",
+        fontSize: R.fontsize.fontsSize12,
+        color: R.colors.grey_100,
+      },
+      text_button: {
+        fontFamily: R.fonts.InterRegular,
+        fontWeight: "400",
+        fontSize: R.fontsize.fontsSize12,
+        color: R.colors.white,
+      },
+      body: {
+        marginTop: 11,
+      },
+      text_check_box_label: {
+        fontFamily: R.fonts.InterRegular,
+        fontWeight: "400",
+        fontSize: R.fontsize.fontsSize12,
+        color: R.colors.black_800,
+        alignSelf: "center"
+      },
+      text_check_box: {
+        fontFamily: R.fonts.InterRegular,
+        fontWeight: "400",
+        fontSize: R.fontsize.fontsSize12,
+        color: R.colors.blue500,
+      },
+      container_body_footer: {
+        flexDirection: "row",
+        alignItems: "center",
+        justifyContent: "space-between",
+        marginVertical: 5,
+      },
+})
+
+export default styles
\ No newline at end of file

src/screens/profile/view.js

@@ -14,6 +14,7 @@ import Button from "../../components/Button";
 import DropdownSelect from "../../components/Dropdown/DropdownSel";
 import Checkbox from "../../components/CheckBox";
 import CustomTextInput from "../../components/Input/TextFieldCus";
+import styles from "./style";
 const ProfileView = (props) => {
   const { phone, setPhone, cmnd, setCmnd, bank, setBank } = props;
   const IconCamera = R.images.icCamera;
@@ -58,6 +59,7 @@ const ProfileView = (props) => {
               </View>
             </View>
           </View>
+
           <View style={styles.body}>
             <View style={{ flexDirection: "row" }}>
               <View style={{ flex: 1 }}>
@@ -341,79 +343,4 @@ const ProfileView = (props) => {
 
 export default ProfileView;
 
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    paddingHorizontal: 15,
-    paddingBottom: 9,
-    backgroundColor: R.colors.white
-  },
-  body_header: {
-    flexDirection: "row",
-  },
-  container_image: {
-    flex: 1,
-    alignItems: "flex-start",
-    justifyContent: "flex-start",
-  },
-  container_body: {
-    flexDirection: "row",
-    marginTop: 10,
-    marginBottom: 5
-  },
-  images: {
-    backgroundColor: R.colors.grey_50,
-    minWidth: 108,
-    minHeight: 177,
-    borderRadius: 15,
-    borderWidth: 1,
-    borderColor: R.colors.grey_200,
-    justifyContent: "center",
-    alignItems: "center",
-  },
-  body_info_user: {
-    flex: 1.8,
-  },
-  text: {
-    fontFamily: R.fonts.InterRegular,
-    fontWeight: "400",
-    fontSize: R.fontsize.fontsSize12,
-    color: R.colors.blue500,
-    lineHeight: 24
-  },
-  
-  text_label: {
-    fontFamily: R.fonts.InterRegular,
-    fontWeight: "400",
-    fontSize: R.fontsize.fontsSize12,
-    color: R.colors.grey_100,
-  },
-  text_button: {
-    fontFamily: R.fonts.InterRegular,
-    fontWeight: "400",
-    fontSize: R.fontsize.fontsSize12,
-    color: R.colors.white,
-  },
-  body: {
-    marginTop: 11,
-  },
-  text_check_box_label: {
-    fontFamily: R.fonts.InterRegular,
-    fontWeight: "400",
-    fontSize: R.fontsize.fontsSize12,
-    color: R.colors.black_800,
-    alignSelf: "center"
-  },
-  text_check_box: {
-    fontFamily: R.fonts.InterRegular,
-    fontWeight: "400",
-    fontSize: R.fontsize.fontsSize12,
-    color: R.colors.blue500,
-  },
-  container_body_footer: {
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "space-between",
-    marginVertical: 5,
-  },
-});
+