red header text

src/components/Header/index.tsx

@@ -13,9 +13,15 @@ type Props = {
   label: string;
   rightElement?: ReactNode;
   shouldClose?: boolean;
+  textColor?: string;
 };
 
-export const Header: FC<Props> = ({ label, rightElement, shouldClose }) => {
+export const Header: FC<Props> = ({
+  label,
+  rightElement,
+  shouldClose,
+  textColor = Colors.DARK_BLUE
+}) => {
   const navigation = useNavigation();
 
   const handlePress = () => {
@@ -36,9 +42,11 @@ export const Header: FC<Props> = ({ label, rightElement, shouldClose }) => {
   return (
     <View style={styles.wrapper}>
       <TouchableOpacity onPress={handlePress}>
-        <View style={styles.chevronWrapper}>{shouldClose ? <CloseSvg /> : <ChevronLeft fill={Colors.DARK_BLUE} />}</View>
+        <View style={styles.chevronWrapper}>
+          {shouldClose ? <CloseSvg /> : <ChevronLeft fill={Colors.DARK_BLUE} />}
+        </View>
       </TouchableOpacity>
-      <Text style={styles.label}>{label}</Text>
+      <Text style={[styles.label, { color: textColor }]}>{label}</Text>
       {rightElement ? <View>{rightElement}</View> : <View style={styles.placeholder} />}
     </View>
   );

src/screens/InAppScreens/MessagesScreen/ChatScreen/index.tsx

@@ -1190,6 +1190,7 @@ const ChatScreen = ({ route }: { route: any }) => {
       <View style={{ paddingHorizontal: '5%' }}>
         <Header
           label={userName}
+          textColor={userType !== 'normal' ? Colors.RED : Colors.DARK_BLUE}
           rightElement={
             <TouchableOpacity
               onPress={() =>