Function SelectFeeScreen

screen/SelectFeeScreen.tsx:137–343

()

type SelectFeeScreenRouteProp = RouteProp<SendDetailsStackParamList, 'SelectFee'>;

const SelectFeeScreen = () => {
  const navigation = useNavigation<SelectFeeScreenNavigationProp>();
  const route = useRoute<SelectFeeScreenRouteProp>();
  const { colors } = useTheme();
  const insets = useSafeAreaInsets();

  const { networkTransactionFees, feePrecalc, feeRate, feeUnit = BitcoinUnit.BTC, walletID, customFee } = route.params;

  const [state, dispatch] = useReducer(feeScreenReducer, {
    customFeeValue: customFee || '',
    isCustomFeeFocused: false,
    options: [],
    isCustomFeeSelected: false,
  });

  const customFeeInputRef = useRef<TextInput>(null);
  const nf = networkTransactionFees;

  const stylesHook = StyleSheet.create({
    keyboardAvoidingRoot: {
      backgroundColor: colors.elevated,
    },
    scrollView: {
      backgroundColor: colors.elevated,
    },
    container: {
      backgroundColor: colors.elevated,
      paddingHorizontal: 16,
      paddingTop: 12,
      paddingBottom: Math.max(insets.bottom, 48) + 16,
    },
    feeModalItemActiveBackground: {
      backgroundColor: colors.feeActive,
    },
    customLabelColor: {
      color: colors.successColor,
    },
    satVbyteText: {
      color: colors.successColor,
    },
    customFeeInputColors: {
      color: colors.successColor,
      borderColor: colors.formBorder,
    },
    feeTimeBackground: {
      backgroundColor: colors.successColor,
    },
    feeTimeBackgroundDisabled: {
      backgroundColor: colors.buttonDisabledBackgroundColor,
    },
    feeTimeText: {
      color: colors.background,
    },
  });

  const formatFee = useCallback((fee: number) => formatBalance(fee, feeUnit, true), [feeUnit]);

  useEffect(() => {