fixup! Email OTP support

"Why is there a quarter rem?"

Removed arbitrary 0.25rem padding and simplified component structure.

Author: Jon-edge

src/components/modals/OtpVerificationModal.tsx

@@ -1,5 +1,4 @@
 import * as React from 'react'
-import { View } from 'react-native'
 import type { AirshipBridge } from 'react-native-airship'
 
 import { useHandler } from '../../hooks/useHandler'
@@ -8,7 +7,6 @@ import { translateError } from '../../util/translateError'
 import { ModalButtons } from '../buttons/ModalButtons'
 import { AlertCardUi4 } from '../cards/AlertCard'
 import { Airship } from '../services/AirshipInstance'
-import { cacheStyles, type Theme, useTheme } from '../services/ThemeContext'
 import { Paragraph } from '../themed/EdgeText'
 import { ModalFilledTextInput } from '../themed/FilledTextInput'
 import { EdgeModal } from './EdgeModal'
@@ -33,9 +31,6 @@ interface Props {
 export const OtpVerificationModal: React.FC<Props> = props => {
   const { bridge, inputLabel, message, onVerify, submitLabel, title } = props
 
-  const theme = useTheme()
-  const styles = getStyles(theme)
-
   const [code, setCode] = React.useState('')
   const [errorMessage, setErrorMessage] = React.useState<string | undefined>()
   const [verifying, setVerifying] = React.useState(false)
@@ -74,47 +69,39 @@ export const OtpVerificationModal: React.FC<Props> = props => {
       onCancel={handleCancel}
       scroll={false}
     >
-      <View style={styles.container}>
-        <Paragraph>{message}</Paragraph>
-        {errorMessage == null ? null : (
-          <AlertCardUi4
-            title={lstrings.ramp_kyc_error_title}
-            type="error"
-            body={errorMessage}
-            marginRem={0.5}
-          />
-        )}
-        <ModalFilledTextInput
-          autoCapitalize="none"
-          autoCorrect={false}
-          autoFocus
-          keyboardType="number-pad"
-          maxLength={6}
-          placeholder={inputLabel}
-          returnKeyType="done"
-          value={code}
-          onChangeText={handleChangeText}
-          onSubmitEditing={handleSubmit}
-        />
-        <ModalButtons
-          primary={{
-            label: submitLabel ?? lstrings.string_submit,
-            onPress: handleSubmit,
-            disabled: !isValid || verifying,
-            spinner: verifying
-          }}
+      <Paragraph>{message}</Paragraph>
+      {errorMessage == null ? null : (
+        <AlertCardUi4
+          title={lstrings.ramp_kyc_error_title}
+          type="error"
+          body={errorMessage}
+          marginRem={0.5}
         />
-      </View>
+      )}
+      <ModalFilledTextInput
+        autoCapitalize="none"
+        autoCorrect={false}
+        autoFocus
+        keyboardType="number-pad"
+        maxLength={6}
+        placeholder={inputLabel}
+        returnKeyType="done"
+        value={code}
+        onChangeText={handleChangeText}
+        onSubmitEditing={handleSubmit}
+      />
+      <ModalButtons
+        primary={{
+          label: submitLabel ?? lstrings.string_submit,
+          onPress: handleSubmit,
+          disabled: !isValid || verifying,
+          spinner: verifying
+        }}
+      />
     </EdgeModal>
   )
 }
 
-const getStyles = cacheStyles((theme: Theme) => ({
-  container: {
-    paddingTop: theme.rem(0.25)
-  }
-}))
-
 export const showOtpVerificationModal = async <T,>(
   params: OtpVerificationModalParams<T>
 ): Promise<T | undefined> => {