[PAY-1247] Cap height of chat textinput on mobile (#3447)

packages/mobile/src/screens/chat-screen/ChatTextInput.tsx

@@ -1,16 +1,17 @@
 import { useCallback, useState } from 'react'
 
-import { chatActions } from '@audius/common'
+import { chatActions, playerSelectors } from '@audius/common'
 import { Platform } from 'react-native'
 import { TouchableWithoutFeedback } from 'react-native-gesture-handler'
-import { useDispatch } from 'react-redux'
+import { useDispatch, useSelector } from 'react-redux'
 
 import IconSend from 'app/assets/images/iconSend.svg'
 import { TextInput } from 'app/components/core'
 import { makeStyles } from 'app/styles'
 import { spacing } from 'app/styles/spacing'
 
 const { sendMessage } = chatActions
+const { getHasTrack } = playerSelectors
 
 const ICON_BLUR = 0.5
 const ICON_FOCUS = 1
@@ -22,7 +23,7 @@ const messages = {
 const useStyles = makeStyles(({ spacing, palette, typography }) => ({
   composeTextContainer: {
     display: 'flex',
-    alignItems: 'center',
+    alignItems: 'flex-end',
     backgroundColor: palette.neutralLight10,
     paddingLeft: spacing(4),
     borderRadius: spacing(1)
@@ -48,6 +49,7 @@ export const ChatTextInput = ({ chatId }: ChatTextInputProps) => {
   const dispatch = useDispatch()
 
   const [inputMessage, setInputMessage] = useState('')
+  const hasCurrentlyPlayingTrack = useSelector(getHasTrack)
 
   const handleSubmit = useCallback(
     (message) => {
@@ -76,7 +78,8 @@ export const ChatTextInput = ({ chatId }: ChatTextInputProps) => {
         root: styles.composeTextContainer,
         input: [
           styles.composeTextInput,
-          Platform.OS === 'ios' ? { paddingBottom: spacing(1) } : null
+          Platform.OS === 'ios' ? { paddingBottom: spacing(1) } : null,
+          { maxHeight: hasCurrentlyPlayingTrack ? spacing(70) : spacing(80) }
         ]
       }}
       onChangeText={(text) => {