From 027750459d0991cc261eb0d852a75781f70f24ff Mon Sep 17 00:00:00 2001
From: sliptype <sliptype@gmail.com>
Date: Wed, 2 Oct 2024 15:12:31 -0500
Subject: [PATCH 1/2] Move composer offset into ChatTextInput

---
 .../composer-input/ComposerInput.tsx          | 25 ++-----------
 .../src/components/composer-input/types.ts    |  1 -
 .../src/screens/chat-screen/ChatTextInput.tsx | 37 +++++++++++++++----
 3 files changed, 32 insertions(+), 31 deletions(-)

diff --git a/packages/mobile/src/components/composer-input/ComposerInput.tsx b/packages/mobile/src/components/composer-input/ComposerInput.tsx
index c85fa0118d1..635c91fa2c5 100644
--- a/packages/mobile/src/components/composer-input/ComposerInput.tsx
+++ b/packages/mobile/src/components/composer-input/ComposerInput.tsx
@@ -78,8 +78,7 @@ export const ComposerInput = (props: ComposerInputProps) => {
     isLoading,
     messageId,
     placeholder,
-    presetMessage,
-    extraOffset = 0
+    presetMessage
   } = props
   const [value, setValue] = useState(presetMessage ?? '')
   const [selection, setSelection] = useState<{ start: number; end: number }>()
@@ -229,26 +228,8 @@ export const ComposerInput = (props: ComposerInputProps) => {
     return parts
   }
 
-  // For iOS: default padding + extra padding
-  // For Android: extra padding is slightly larger than iOS, and only
-  // needed if the screen header size changes
-  const offset =
-    Platform.OS === 'ios'
-      ? spacing(1.5) + extraOffset
-      : Platform.OS === 'android'
-      ? extraOffset
-        ? spacing(1.5) + extraOffset
-        : undefined
-      : undefined
-
   return (
-    <Flex
-      style={{
-        position: 'relative',
-        // maxHeight: hasCurrentlyPlayingTrack ? spacing(70) : spacing(80),
-        paddingBottom: offset
-      }}
-    >
+    <>
       <View
         style={[
           styles.overlayTextContainer,
@@ -280,6 +261,6 @@ export const ComposerInput = (props: ComposerInputProps) => {
         maxLength={10000}
         autoCorrect
       />
-    </Flex>
+    </>
   )
 }
diff --git a/packages/mobile/src/components/composer-input/types.ts b/packages/mobile/src/components/composer-input/types.ts
index 012ca8279c6..86887d31a3c 100644
--- a/packages/mobile/src/components/composer-input/types.ts
+++ b/packages/mobile/src/components/composer-input/types.ts
@@ -6,7 +6,6 @@ import type { TextInputProps } from '../core'
 
 export type ComposerInputProps = {
   messageId: number
-  extraOffset?: number // Additional padding needed if screen header size changes
   entityId?: ID
   entityType?: EntityType
   onChange?: (value: string, linkEntities: LinkEntity[]) => void
diff --git a/packages/mobile/src/screens/chat-screen/ChatTextInput.tsx b/packages/mobile/src/screens/chat-screen/ChatTextInput.tsx
index 6434eb1521e..42933631420 100644
--- a/packages/mobile/src/screens/chat-screen/ChatTextInput.tsx
+++ b/packages/mobile/src/screens/chat-screen/ChatTextInput.tsx
@@ -4,10 +4,12 @@ import type { ID } from '@audius/common/models'
 import { chatActions } from '@audius/common/store'
 import type { Nullable } from '@audius/common/utils'
 import { decodeHashId } from '@audius/common/utils'
+import { Platform } from 'react-native'
 import { useDispatch } from 'react-redux'
 
 import { Flex } from '@audius/harmony-native'
 import { ComposerInput } from 'app/components/composer-input'
+import { spacing } from 'app/styles/spacing'
 
 import { ComposerCollectionInfo, ComposerTrackInfo } from './ComposePreviewInfo'
 
@@ -59,6 +61,18 @@ export const ChatTextInput = ({
     }
   }, [chatId, dispatch, onMessageSent, value])
 
+  // For iOS: default padding + extra padding
+  // For Android: extra padding is slightly larger than iOS, and only
+  // needed if the screen header size changes
+  const offset =
+    Platform.OS === 'ios'
+      ? spacing(1.5) + extraOffset
+      : Platform.OS === 'android'
+      ? extraOffset
+        ? spacing(1.5) + extraOffset
+        : undefined
+      : undefined
+
   return (
     <Flex>
       {trackId ? (
@@ -66,14 +80,21 @@ export const ChatTextInput = ({
       ) : collectionId ? (
         <ComposerCollectionInfo collectionId={collectionId} />
       ) : null}
-      <ComposerInput
-        extraOffset={extraOffset}
-        messageId={messageId}
-        presetMessage={presetMessage}
-        placeholder={messages.startNewMessage}
-        onChange={handleChange}
-        onSubmit={handleSubmit}
-      />
+
+      <Flex
+        style={{
+          position: 'relative',
+          paddingBottom: offset
+        }}
+      >
+        <ComposerInput
+          messageId={messageId}
+          presetMessage={presetMessage}
+          placeholder={messages.startNewMessage}
+          onChange={handleChange}
+          onSubmit={handleSubmit}
+        />
+      </Flex>
     </Flex>
   )
 }

From 7ecc50ffcfcf708f0aed78865ecb86e1b24c66d8 Mon Sep 17 00:00:00 2001
From: sliptype <sliptype@gmail.com>
Date: Wed, 2 Oct 2024 15:12:58 -0500
Subject: [PATCH 2/2] Lint fix

---
 packages/mobile/src/components/composer-input/ComposerInput.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/mobile/src/components/composer-input/ComposerInput.tsx b/packages/mobile/src/components/composer-input/ComposerInput.tsx
index 635c91fa2c5..c1f1f836073 100644
--- a/packages/mobile/src/components/composer-input/ComposerInput.tsx
+++ b/packages/mobile/src/components/composer-input/ComposerInput.tsx
@@ -9,7 +9,7 @@ import type {
   TextInputSelectionChangeEventData
 } from 'react-native/types'
 
-import { Flex, IconSend } from '@audius/harmony-native'
+import { IconSend } from '@audius/harmony-native'
 import { Text, TextInput } from 'app/components/core'
 import { env } from 'app/env'
 import { audiusSdk } from 'app/services/sdk/audius-sdk'