From 92046473f8c1cff4105e9269fb01d889b26156ae Mon Sep 17 00:00:00 2001
From: Paul Frazee <pfrazee@gmail.com>
Date: Wed, 16 Nov 2022 14:33:01 -0600
Subject: [PATCH] Fix composer positioning

---
 src/view/com/composer/ComposePost.tsx | 118 +++++++++++++-------------
 1 file changed, 61 insertions(+), 57 deletions(-)

diff --git a/src/view/com/composer/ComposePost.tsx b/src/view/com/composer/ComposePost.tsx
index 30e5d0176d..0a7fadce11 100644
--- a/src/view/com/composer/ComposePost.tsx
+++ b/src/view/com/composer/ComposePost.tsx
@@ -2,6 +2,7 @@ import React, {useEffect, useMemo, useState} from 'react'
 import {
   ActivityIndicator,
   KeyboardAvoidingView,
+  SafeAreaView,
   StyleSheet,
   Text,
   TextInput,
@@ -136,69 +137,72 @@ export function ComposePost({
 
   return (
     <KeyboardAvoidingView behavior="padding" style={styles.outer}>
-      <View style={styles.topbar}>
-        <TouchableOpacity onPress={onPressCancel}>
-          <Text style={[s.blue3, s.f16]}>Cancel</Text>
-        </TouchableOpacity>
-        <View style={s.flex1} />
-        {isProcessing ? (
-          <View style={styles.postBtn}>
-            <ActivityIndicator />
-          </View>
-        ) : canPost ? (
-          <TouchableOpacity onPress={onPressPublish}>
-            <LinearGradient
-              colors={[gradients.primary.start, gradients.primary.end]}
-              start={{x: 0, y: 0}}
-              end={{x: 1, y: 1}}
-              style={styles.postBtn}>
-              <Text style={[s.white, s.f16, s.bold]}>Post</Text>
-            </LinearGradient>
+      <SafeAreaView style={s.flex1}>
+        <View style={styles.topbar}>
+          <TouchableOpacity onPress={onPressCancel}>
+            <Text style={[s.blue3, s.f16]}>Cancel</Text>
           </TouchableOpacity>
-        ) : (
-          <View style={[styles.postBtn, {backgroundColor: colors.gray1}]}>
-            <Text style={[s.gray5, s.f16, s.bold]}>Post</Text>
+          <View style={s.flex1} />
+          {isProcessing ? (
+            <View style={styles.postBtn}>
+              <ActivityIndicator />
+            </View>
+          ) : canPost ? (
+            <TouchableOpacity onPress={onPressPublish}>
+              <LinearGradient
+                colors={[gradients.primary.start, gradients.primary.end]}
+                start={{x: 0, y: 0}}
+                end={{x: 1, y: 1}}
+                style={styles.postBtn}>
+                <Text style={[s.white, s.f16, s.bold]}>Post</Text>
+              </LinearGradient>
+            </TouchableOpacity>
+          ) : (
+            <View style={[styles.postBtn, {backgroundColor: colors.gray1}]}>
+              <Text style={[s.gray5, s.f16, s.bold]}>Post</Text>
+            </View>
+          )}
+        </View>
+        {error !== '' && (
+          <View style={styles.errorLine}>
+            <View style={styles.errorIcon}>
+              <FontAwesomeIcon
+                icon="exclamation"
+                style={{color: colors.red4}}
+                size={10}
+              />
+            </View>
+            <Text style={s.red4}>{error}</Text>
           </View>
         )}
-      </View>
-      {error !== '' && (
-        <View style={styles.errorLine}>
-          <View style={styles.errorIcon}>
-            <FontAwesomeIcon
-              icon="exclamation"
-              style={{color: colors.red4}}
-              size={10}
+        <TextInput
+          multiline
+          scrollEnabled
+          autoFocus
+          onChangeText={(text: string) => onChangeText(text)}
+          placeholder={replyTo ? 'Write your reply' : "What's new?"}
+          style={styles.textInput}>
+          {textDecorated}
+        </TextInput>
+        <View
+          style={[s.flexRow, {alignItems: 'center'}, s.pt10, s.pb10, s.pr5]}>
+          <View style={s.flex1} />
+          <Text style={[s.mr10, {color: progressColor}]}>
+            {text.length} / {MAX_TEXT_LENGTH}
+          </Text>
+          <View>
+            <ProgressCircle
+              color={progressColor}
+              progress={text.length / MAX_TEXT_LENGTH}
             />
           </View>
-          <Text style={s.red4}>{error}</Text>
         </View>
-      )}
-      <TextInput
-        multiline
-        scrollEnabled
-        autoFocus
-        onChangeText={(text: string) => onChangeText(text)}
-        placeholder={replyTo ? 'Write your reply' : "What's new?"}
-        style={styles.textInput}>
-        {textDecorated}
-      </TextInput>
-      <View style={[s.flexRow, {alignItems: 'center'}, s.pt10, s.pb10, s.pr5]}>
-        <View style={s.flex1} />
-        <Text style={[s.mr10, {color: progressColor}]}>
-          {text.length} / {MAX_TEXT_LENGTH}
-        </Text>
-        <View>
-          <ProgressCircle
-            color={progressColor}
-            progress={text.length / MAX_TEXT_LENGTH}
-          />
-        </View>
-      </View>
-      <Autocomplete
-        active={autocompleteOptions.length > 0}
-        items={autocompleteOptions}
-        onSelect={onSelectAutocompleteItem}
-      />
+        <Autocomplete
+          active={autocompleteOptions.length > 0}
+          items={autocompleteOptions}
+          onSelect={onSelectAutocompleteItem}
+        />
+      </SafeAreaView>
     </KeyboardAvoidingView>
   )
 }