diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json index 5425897ab..5b3197725 100644 --- a/src/i18n/locales/en.json +++ b/src/i18n/locales/en.json @@ -255,6 +255,7 @@ "BACKGROUND_GEOLOCATION_NOTIFICATION_TEXT": "Enabled", "NEW_NOTIFICATION": "New notification", "CLOSE": "Close", + "OPTIONAL": "Optional", "ORDER_NEW": "Waiting", "ORDER_NEW_HELP": "The restaurant has to confirm your order", "ORDER_ACCEPTED": "Accepted", @@ -288,10 +289,17 @@ "TASK_ADD_PROOF_OF_DELIVERY": "Add a proof of delivery", "STORE_NEW_DELIVERY": "New delivery", "STORE_NEW_DELIVERY_ADDRESS": "Address", + "STORE_NEW_DELIVERY_SEARCH_CLIENT": "Search for a client", + "STORE_NEW_DELIVERY_ENTER_SEARCH_CLIENT": "Enter a client name", "STORE_NEW_DELIVERY_ADDRESS_HELP": "Enter dropoff address to verify feasibility", "STORE_NEW_DELIVERY_PHONE_NUMBER": "Phone number", + "STORE_NEW_DELIVERY_ENTER_PHONE_NUMBER": "Enter a valid phone number", + "STORE_NEW_DELIVERY_BUSINESS_NAME": "Business name", + "STORE_NEW_DELIVERY_ENTER_BUSINESS_NAME": "Enter a business name", "STORE_NEW_DELIVERY_CONTACT_NAME": "Contact name", + "STORE_NEW_DELIVERY_ENTER_CONTACT_NAME": "Enter a contact name", "STORE_NEW_DELIVERY_COMMENTS": "Access information", + "STORE_NEW_DELIVERY_ENTER_COMMENTS": "Induce any useful information (intercom...)", "STORE_NEW_DELIVERY_DROPOFF_BEFORE": "Dropoff before", "STORE_NEW_DELIVERY_TIME_SLOT": "Time slot", "STORE_NEW_DELIVERY_SELECT_TIME_SLOT": "Select a time slot", diff --git a/src/i18n/locales/fr.json b/src/i18n/locales/fr.json index a2277b140..2857a12f3 100644 --- a/src/i18n/locales/fr.json +++ b/src/i18n/locales/fr.json @@ -249,6 +249,7 @@ "BACKGROUND_GEOLOCATION_NOTIFICATION_TEXT": "Activée", "NEW_NOTIFICATION": "Nouvelle notification", "CLOSE": "Fermer", + "OPTIONAL": "Optionnel", "ORDER_NEW": "En attente", "ORDER_NEW_HELP": "Le restaurateur doit valider votre commande", "ORDER_ACCEPTED": "Acceptée", @@ -275,10 +276,18 @@ "TASK_ADD_PROOF_OF_DELIVERY": "Ajouter une preuve de livraison", "STORE_NEW_DELIVERY": "Nouvelle livraison", "STORE_NEW_DELIVERY_ADDRESS": "Adresse", + "STORE_NEW_DELIVERY_SEARCH_CLIENT": "Rechercher un client", + "STORE_NEW_DELIVERY_ENTER_SEARCH_CLIENT": "Entrez le nom du client", + "STORE_NEW_DELIVERY_ADDRESS_HELP": "Entrez l'adresse de dépôt pour vérifier la faisabilité", "STORE_NEW_DELIVERY_PHONE_NUMBER": "Numéro de téléphone", - "STORE_NEW_DELIVERY_CONTACT_NAME": "Nom de la personne à contacter", + "STORE_NEW_DELIVERY_ENTER_PHONE_NUMBER": "Entrez un numéro de téléphone valide", + "STORE_NEW_DELIVERY_BUSINESS_NAME": "Nom de l'entreprise", + "STORE_NEW_DELIVERY_ENTER_BUSINESS_NAME": "Entrez le nom de l'entreprise", + "STORE_NEW_DELIVERY_CONTACT_NAME": "Contact", + "STORE_NEW_DELIVERY_ENTER_CONTACT_NAME": "Entrez le nom de la personne à contacter", "STORE_NEW_DELIVERY_COMMENTS": "Informations d'accès", + "STORE_NEW_DELIVERY_ENTER_COMMENTS": "Indiquez toute information utile (interphone…)", "STORE_NEW_DELIVERY_DROPOFF_BEFORE": "À déposer avant", "STORE_NEW_DELIVERY_TIME_SLOT": "Tranche horaire", "STORE_NEW_DELIVERY_SELECT_TIME_SLOT": "Choisissez une tranche horaire", diff --git a/src/navigation/store/ClientListInput.js b/src/navigation/store/ClientListInput.js new file mode 100644 index 000000000..db20ab688 --- /dev/null +++ b/src/navigation/store/ClientListInput.js @@ -0,0 +1,145 @@ +import { Text } from 'native-base'; +import { useState } from 'react'; +import AutocompleteInput from 'react-native-autocomplete-input'; +import { TouchableOpacity } from 'react-native-gesture-handler'; +import ItemSeparator from '../../components/ItemSeparator'; +import { + useBackgroundColor, + useBackgroundContainerColor, + useBackgroundHighlightColor, + usePrimaryColor, +} from '../../styles/theme'; +import FormInput from './components/FormInput'; + +// const shadowStyle = { +// shadowColor: '#000', +// shadowOffset: { +// width: 0, +// height: 6, +// }, +// shadowOpacity: 10.39, +// shadowRadius: 8.3, + +// elevation: 13, +// }; + +export default function ClientListInput({ + addresses, + onSelectAddress, + placeholder, +}) { + const [hideSuggestions, setHideSuggestions] = useState(true); + const [value, setValue] = useState(''); + const backgroundContainerColor = useBackgroundContainerColor(); + const backgroundHighlightColor = useBackgroundHighlightColor(); + const backgroundColor = useBackgroundColor(); + // const shadowColor = useColorModeValue('rgba(0,0,0,.39)', 'rgba(0,0,0,1)'); + const primaryColor = usePrimaryColor(); + + function handleFocus() { + setHideSuggestions(false); + } + + function handleBlur() { + setHideSuggestions(true); + } + + function handleChangeText(text) { + if (hideSuggestions) setHideSuggestions(false); + setValue(text); + } + + function RenderedInput() { + return ( + + ); + } + + function selectAddress(address) { + onSelectAddress(address); + setHideSuggestions(true); + setValue(''); + } + + return ( + <> + + [name, contactName, streetAddress].some(field => + field.toLowerCase().includes(value.toLowerCase()), + ), + ) + : addresses + } + renderTextInput={RenderedInput} + onChangeText={handleChangeText} + inputContainerStyle={{ + margin: 0, + padding: 0, + borderWidth: 0, + borderRadius: 4, + }} + flatListProps={{ + style: { + borderWidth: 1, + borderTopWidth: 1, + borderColor: primaryColor, + borderRadius: 4, + marginTop: -1, + backgroundColor: backgroundContainerColor, + // overflow: 'visible', + + // ...{ ...shadowStyle, shadowColor }, + }, + keyboardShouldPersistTaps: 'always', + keyExtractor: (item, i) => `prediction-${i}`, + renderItem: item => ( + selectAddress(item.item)} + style={{ + padding: 12, + }}> + + {`${item.item.name} - ${item.item.contactName}`} + + + {`${item.item.streetAddress}`} + + + ), + ItemSeparatorComponent: ItemSeparator, + }} + style={{}} + /> + + ); +} diff --git a/src/navigation/store/ModalFormWrapper.js b/src/navigation/store/ModalFormWrapper.js index efe69ab87..c3b04a160 100644 --- a/src/navigation/store/ModalFormWrapper.js +++ b/src/navigation/store/ModalFormWrapper.js @@ -1,4 +1,4 @@ -import { Box, Button, VStack } from 'native-base'; +import { Box, Button, ScrollView, VStack } from 'native-base'; import { SafeAreaView } from 'react-native'; import { useBackgroundContainerColor } from '../../styles/theme'; @@ -22,9 +22,11 @@ export default function ModalFormWrapper({ style={{ backgroundColor, }}> - - {children} - + + + {children} + +