Delivery form pricing

ios/Podfile.lock

@@ -1861,7 +1861,7 @@ SPEC CHECKSUMS:
   StripePaymentSheet: a25d920bb3bb5e2580696476482dc7df9cb5e4e2
   StripePaymentsUI: 66088abec88754bbdd522ef227dfdbb2265a653e
   StripeUICore: b193c7d35e9cd1b04bc9ed4a6fb8c548fcee83fa
-  Yoga: a716eea57d0d3430219c0a5a233e1e93ee931eb7
+  Yoga: 9e6a04eacbd94f97d94577017e9f23b3ab41cf6c
   ZXingObjC: 8898711ab495761b2dbbdec76d90164a6d7e14c5
 
 PODFILE CHECKSUM: d949c9fd9c4ce5f3ec67d52ca1f4a1ca13072560

package.json

@@ -96,6 +96,7 @@
     "react-native-modal-selector": "^2.1.2",
     "react-native-pager-view": "^6.3.3",
     "react-native-payment-icons": "^1.0.11",
+    "react-native-picker-select": "^9.1.3",
     "react-native-pin-screen": "git+https://[email protected]/coopcycle/react-native-pin-screen.git#1.0.3",
     "react-native-reanimated": "^3.12.1",
     "react-native-safe-area-context": "^4.10.7",

src/components/AddressAutocomplete.js

@@ -4,7 +4,13 @@ import { AbortController } from 'abortcontroller-polyfill/dist/cjs-ponyfill';
 import axios from 'axios';
 import Fuse from 'fuse.js';
 import _ from 'lodash';
-import { Icon, Text, useColorMode, useColorModeValue } from 'native-base';
+import {
+  Icon,
+  Input,
+  Text,
+  useColorMode,
+  useColorModeValue,
+} from 'native-base';
 import PropTypes from 'prop-types';
 import qs from 'qs';
 import React, { Component } from 'react';
@@ -407,7 +413,7 @@ class AddressAutocomplete extends Component {
     return (
       <View style={styles.textInput}>
         <View style={styles.textInput}>
-          <TextInput
+          <Input
             {...props}
             style={[props.style, { flex: 1 }]}
             onFocus={this.onTextInputFocus.bind(this)}

src/components/AddressAutocomplete/components/PostCodeButton.js

@@ -0,0 +1,42 @@
+import { Icon, Text } from 'native-base';
+import React from 'react';
+import { TouchableOpacity } from 'react-native';
+import 'react-native-get-random-values';
+import FontAwesome5 from 'react-native-vector-icons/FontAwesome5';
+
+export default function PostCodeButton({ postcode, onPress }) {
+  return (
+    <TouchableOpacity
+      style={{
+        flexDirection: 'row',
+        alignItems: 'center',
+        paddingLeft: 10,
+        paddingRight: 10,
+        paddingVertical: 5,
+        position: 'absolute',
+        right: 0,
+        top: 0,
+        bottom: 0,
+        backgroundColor: '#0984e3',
+        borderTopRightRadius: 20,
+        borderBottomRightRadius: 20,
+      }}
+      onPress={onPress}>
+      <Text
+        style={{
+          marginRight: 10,
+          fontWeight: '700',
+          fontSize: 16,
+          color: 'white',
+          fontFamily: 'RobotoMono-Regular',
+        }}>
+        {postcode}
+      </Text>
+      <Icon
+        as={FontAwesome5}
+        name="times"
+        style={{ fontSize: 18, color: 'white' }}
+      />
+    </TouchableOpacity>
+  );
+}