chore(runway): cherry-pick fix: Bridge long token values show the right hand side, make it show the left (#15517)

- fix: Bridge long token values show the right hand side, make it show the left (#15335)

Author: runway-github[bot]

app/components/UI/Bridge/Views/BridgeView/__snapshots__/BridgeView.test.tsx.snap

@@ -399,6 +399,12 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         onBlur={[Function]}
                                         onFocus={[Function]}
                                         placeholder="0"
+                                        selection={
+                                          {
+                                            "end": 0,
+                                            "start": 0,
+                                          }
+                                        }
                                         showSoftInputOnFocus={false}
                                         style={
                                           {
@@ -782,6 +788,12 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         onBlur={[Function]}
                                         onFocus={[Function]}
                                         placeholder="0"
+                                        selection={
+                                          {
+                                            "end": 0,
+                                            "start": 0,
+                                          }
+                                        }
                                         showSoftInputOnFocus={false}
                                         style={
                                           {
@@ -1353,6 +1365,12 @@ exports[`BridgeView renders 1`] = `
                                         onBlur={[Function]}
                                         onFocus={[Function]}
                                         placeholder="0"
+                                        selection={
+                                          {
+                                            "end": 0,
+                                            "start": 0,
+                                          }
+                                        }
                                         showSoftInputOnFocus={false}
                                         style={
                                           {
@@ -1736,6 +1754,12 @@ exports[`BridgeView renders 1`] = `
                                         onBlur={[Function]}
                                         onFocus={[Function]}
                                         placeholder="0"
+                                        selection={
+                                          {
+                                            "end": 0,
+                                            "start": 0,
+                                          }
+                                        }
                                         showSoftInputOnFocus={false}
                                         style={
                                           {

app/components/UI/Bridge/components/TokenInputArea/index.tsx

@@ -34,8 +34,11 @@ import { selectMultichainAssetsRates } from '../../../../../selectors/multichain
 ///: END:ONLY_INCLUDE_IF(keyring-snaps)
 import { getDisplayCurrencyValue } from '../../utils/exchange-rates';
 import { useBridgeExchangeRates } from '../../hooks/useBridgeExchangeRates';
+import parseAmount from '../../../Ramp/utils/parseAmount';
 import useIsInsufficientBalance from '../../hooks/useInsufficientBalance';
 
+const MAX_DECIMALS = 5;
+
 const createStyles = () =>
   StyleSheet.create({
     content: {
@@ -188,7 +191,7 @@ export const TokenInputArea = forwardRef<
               ) : (
                 <Input
                   ref={inputRef}
-                  value={amount}
+                  value={amount ? parseAmount(amount, MAX_DECIMALS) : amount}
                   style={styles.input}
                   isDisabled={false}
                   isReadonly={tokenType === TokenInputAreaType.Destination}
@@ -204,6 +207,9 @@ export const TokenInputArea = forwardRef<
                   onBlur={() => {
                     onBlur?.();
                   }}
+                  // Android only issue, for long numbers, the input field will focus on the right hand side
+                  // Force it to focus on the left hand side
+                  selection={{ start: 0, end: 0 }}
                 />
               )}
             </Box>