fix: android footer and status bar

js/packages/components/chat/ContactSettings.tsx

@@ -1,5 +1,5 @@
 import React, { useState } from 'react'
-import { View, ScrollView, ActivityIndicator } from 'react-native'
+import { View, ScrollView, ActivityIndicator, StatusBar } from 'react-native'
 import { Text } from '@ui-kitten/components'
 import { useTranslation } from 'react-i18next'
 
@@ -132,7 +132,7 @@ export const ContactSettings: React.FC<ScreenProps.Chat.ContactSettings> = ({ ro
 	const { contactId } = route.params
 	const { goBack } = useNavigation()
 	const contact: any = (useContacts() as any)[contactId] || null
-	const [{ background, flex, padding }] = useStyles()
+	const [{ background, flex, padding, color }] = useStyles()
 	if (!contact) {
 		goBack()
 		return (
@@ -144,17 +144,22 @@ export const ContactSettings: React.FC<ScreenProps.Chat.ContactSettings> = ({ ro
 		)
 	}
 	return (
-		<ScrollView
-			style={[flex.tiny, background.white]}
-			contentContainerStyle={[padding.bottom.huge]}
-			bounces={false}
-		>
-			<SwipeNavRecognizer>
-				<HeaderSettings actionIcon='upload' undo={goBack}>
-					<ContactSettingsHeader contact={contact} />
-				</HeaderSettings>
-				<ContactSettingsBody id={contact.publicKey} />
-			</SwipeNavRecognizer>
-		</ScrollView>
+		<>
+			<View style={[flex.tiny]}>
+				<StatusBar backgroundColor={color.blue} barStyle='light-content' />
+				<ScrollView
+					style={[flex.tiny, background.white]}
+					contentContainerStyle={[padding.bottom.huge]}
+					bounces={false}
+				>
+					<SwipeNavRecognizer>
+						<HeaderSettings actionIcon='upload' undo={goBack}>
+							<ContactSettingsHeader contact={contact} />
+						</HeaderSettings>
+						<ContactSettingsBody id={contact.publicKey} />
+					</SwipeNavRecognizer>
+				</ScrollView>
+			</View>
+		</>
 	)
 }

js/packages/components/chat/OneToOneSettings.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { ScrollView, View } from 'react-native'
+import { ScrollView, View, StatusBar } from 'react-native'
 import { Text } from '@ui-kitten/components'
 import { useTranslation } from 'react-i18next'
 
@@ -130,7 +130,7 @@ export const OneToOneSettings: React.FC<ScreenProps.Chat.OneToOneSettings> = ({
 	route: { params },
 }) => {
 	const { goBack, navigate } = useNavigation()
-	const [{ flex, background, padding }] = useStyles()
+	const [{ flex, background, padding, color }] = useStyles()
 	const { convId } = params
 	const conv = useConversation(convId)
 	const contact = useContact(conv?.contactPublicKey)
@@ -143,6 +143,7 @@ export const OneToOneSettings: React.FC<ScreenProps.Chat.OneToOneSettings> = ({
 	return (
 		<>
 			<View style={[flex.tiny]}>
+				<StatusBar backgroundColor={color.blue} barStyle='light-content' />
 				<ScrollView
 					style={[flex.tiny, background.white]}
 					contentContainerStyle={[padding.bottom.huge]}

js/packages/components/chat/common.tsx

@@ -200,6 +200,7 @@ export const ChatFooter: React.FC<{
 				})
 				.then(() => {
 					setMessage('')
+					setInputHeight(35)
 					setMediaCids([])
 					ctx.playSound('messageSent')
 					setActiveReplyInte()
@@ -425,16 +426,13 @@ export const ChatFooter: React.FC<{
 						<Animated.View
 							style={[
 								border.radius.medium,
-
 								{
-									alignSelf: 'flex-end',
 									backgroundColor: _isFocused ? '#E8E9FC99' : '#F7F8FF',
 									marginRight: aMaxWidth,
 									right: aFixLeft,
 									marginLeft: 9 * scaleSize,
 									zIndex: 100,
 									elevation: 100,
-
 									flex: 1,
 								},
 							]}
@@ -477,8 +475,6 @@ export const ChatFooter: React.FC<{
 										{
 											height: inputHeight < 35 ? 35 * scaleSize : inputHeight * scaleSize,
 											fontFamily: 'Open Sans',
-											marginTop: 3 * scaleSize,
-											fontSize: 15 * scaleSize,
 											paddingRight: 12 * scaleSize,
 										},
 									]}

js/packages/components/main/Scan.tsx

@@ -6,6 +6,7 @@ import {
 	TouchableOpacity,
 	Vibration,
 	Text as TextNative,
+	StatusBar,
 } from 'react-native'
 import { Layout, Text, Icon } from '@ui-kitten/components'
 import QRCodeScanner from 'react-native-qrcode-scanner'
@@ -15,7 +16,7 @@ import { useStyles } from '@berty-tech/styles'
 import { useNavigation } from '@react-navigation/native'
 
 import ScanTarget from './scan_target.svg'
-import { SwipeNavRecognizer } from '../shared-components/SwipeNavRecognizer.tsx'
+import { SwipeNavRecognizer } from '../shared-components/SwipeNavRecognizer'
 
 //
 // Scan => Scan QrCode of an other contact
@@ -211,11 +212,12 @@ const ScanComponent: React.FC<any> = () => {
 }
 
 export const Scan: React.FC<{}> = () => {
-	const [{ flex }] = useStyles()
+	const [{ flex, color }] = useStyles()
 	const navigation = useNavigation()
 
 	return (
 		<Layout style={[flex.tiny, { backgroundColor: 'transparent' }]}>
+			<StatusBar backgroundColor={color.red} barStyle='light-content' />
 			<SwipeNavRecognizer
 				onSwipeRight={() => navigation.goBack()}
 				onSwipeLeft={() => navigation.goBack()}