From 689910f1d1512cf5883555691c5613a8e82f0293 Mon Sep 17 00:00:00 2001 From: michielderoos Date: Thu, 7 Jul 2022 15:32:55 -0300 Subject: [PATCH 1/8] Update ID --- src/sagas/authSaga.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/sagas/authSaga.js b/src/sagas/authSaga.js index 899a290..2b2b6aa 100644 --- a/src/sagas/authSaga.js +++ b/src/sagas/authSaga.js @@ -63,11 +63,9 @@ function* getVersionAndLocale() { } function setFirebaseAnalyticsTracker(token_response) { - const userId = token_response.user_id.toString(); + const userId = token_response.user_id.toString()+'-mobile-'+token_response.deployment_name.toString(); const androidHash = token_response.android_intercom_hash; const name = token_response.first_name + ' ' + token_response.last_name; - // const deploymentName = token_response.deployment_name.toString(); - if (token_response.terms_accepted) { // Setup User Id for Google Analytics tracker.setUserId(userId); From f12f82a4c0429f6cc23cb95ea7eba4b774b66968 Mon Sep 17 00:00:00 2001 From: michielderoos Date: Thu, 7 Jul 2022 15:33:05 -0300 Subject: [PATCH 2/8] version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 043a742..57087f6 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "Sempo", - "version": "1.7.2", + "version": "1.7.3", "private": true, "scripts": { "android": "react-native run-android", From 1670c88af23c2152df0102d54d1523975d1d6137 Mon Sep 17 00:00:00 2001 From: michielderoos Date: Mon, 25 Jul 2022 14:46:25 -0300 Subject: [PATCH 3/8] Send NFC metadata with payload --- src/sagas/nfcSaga.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/sagas/nfcSaga.js b/src/sagas/nfcSaga.js index f3a2b57..2a8a6b2 100644 --- a/src/sagas/nfcSaga.js +++ b/src/sagas/nfcSaga.js @@ -148,7 +148,10 @@ function* makeTransfer(amountLoaded, amountDeductedOnCard, transferData, nfcId, 'my_transfer_account_id': transferData.my_transfer_account_id, 'uuid': uuidv4(), 'created': date.toISOString(), - 'inCache': true + 'inCache': true, + 'nfc_session_number': session, + 'amount_deducted': desiredDeducted, + 'amount_loaded': amountLoaded }, userId: userId }; From eef8dc9a59fd69b582b487a589a90c785220e8c8 Mon Sep 17 00:00:00 2001 From: michielderoos Date: Mon, 25 Jul 2022 14:46:38 -0300 Subject: [PATCH 4/8] Version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 57087f6..99442fb 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "Sempo", - "version": "1.7.3", + "version": "1.7.4", "private": true, "scripts": { "android": "react-native run-android", From 55f7dbc0cceed35c0250cfba3695a839e3f2174a Mon Sep 17 00:00:00 2001 From: michielderoos Date: Tue, 20 Sep 2022 15:52:10 -0300 Subject: [PATCH 5/8] . --- package-lock.json | 2 +- .../SendPaymentFlow/CheckCardBalanceScreen.js | 516 ++++++++++++++++++ 2 files changed, 517 insertions(+), 1 deletion(-) create mode 100644 src/components/SendPaymentFlow/CheckCardBalanceScreen.js diff --git a/package-lock.json b/package-lock.json index 33adafc..6ce8816 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "Sempo", - "version": "1.7.0", + "version": "1.7.4", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/src/components/SendPaymentFlow/CheckCardBalanceScreen.js b/src/components/SendPaymentFlow/CheckCardBalanceScreen.js new file mode 100644 index 0000000..e6dd5f8 --- /dev/null +++ b/src/components/SendPaymentFlow/CheckCardBalanceScreen.js @@ -0,0 +1,516 @@ +'use strict'; +import React, { Component } from 'react'; +import { + Dimensions, + StyleSheet, + Text, + View, + Alert, + Vibration, + Clipboard, + Linking, +} from 'react-native'; +import { RNCamera } from 'react-native-camera'; + +import { newFeedback, RESET_NEW_FEEDBACK_DATA } from '../../reducers/feedbackReducer' +import { updateTransferData, createTransferRequest, RESET_NEW_TRANSFER, RESET_TRANSFER_DATA } from '../../reducers/creditTransferReducer.js' +import { getUserFromPublicSerialNumber, RESET_USER_BY_PUBLIC_SERIAL } from "../../reducers/userReducer"; +import {chargeNFCCard, closeNFCRead, resetNFCStatus} from "../../reducers/nfcReducer"; +import NfcManager from "react-native-nfc-manager"; + +import { connect } from "react-redux"; +import { strings } from '../../../locales/i18n'; +import { trim, parseEthQRCode } from '../../utils'; + +import CameraModal from './CameraModal.js' +import {tracker} from "../../analytics"; +import PaymentModeSwitcher from "../PaymentModeSwitcher"; +import ExitToHome from "../ExitToHome" + +const mapStateToProps = (state) => { + return { + newTransferStatus: state.creditTransfers.createStatus, + login: state.login, + newFeedbackData: state.newFeedbackData, + transferData: state.creditTransfers.transferData, + NFCTransceiveStatus: state.NFC.TransceiveStatus, + tokens: state.tokens.byId, + transferAccounts: state.transferAccounts.byId + }; +}; + +const mapDispatchToProps = (dispatch) => { + return { + getUserFromPublicSerialNumber: (query) => dispatch(getUserFromPublicSerialNumber({query})), + createTransferRequest: (body) => dispatch(createTransferRequest({body})), + resetNewTransfer: () => { + console.log("resetting new transfer") + dispatch({type: RESET_NEW_TRANSFER}); + dispatch({type: RESET_NEW_FEEDBACK_DATA}); + dispatch({type: RESET_TRANSFER_DATA}); + dispatch({type: RESET_USER_BY_PUBLIC_SERIAL}); + }, + newFeedback: (payload) => dispatch(newFeedback(payload)), + updateTransferData: (payload) => dispatch(updateTransferData(payload)), + chargeNFCCard: (chargeAmount) => dispatch(chargeNFCCard(chargeAmount, null)), + cancelNFCRead: () => dispatch(closeNFCRead()), + resetNFCStatus: () => dispatch(resetNFCStatus()) + }; +}; + +class SendPaymentCameraScreen extends Component { + constructor(props) { + super(props); + this.state = { + scanData: '', + transfer_account_name: '', + recipient_transfer_account_id: '', + transfer_amount: '', + transfer_use: '', + transfer_random_key: '', + modalVisible: false, + feedbackModalVisible: false, + offlineModalVisible: false, + getFeedback: false, + checkBalanceFeedback: false, + getAdditionalFeedback: false, + question: '', + rating: null, + additional_information: '', + handleScan: true, + public_serial_number: '', + checkBalance: false, + vendorScan: false, + NFC_supported: false, + NFC_enabled: false, + detection_was_on_previously: false, + nfc_id: '', + amount: '', + checking_nfc: false, + invalid_nfc: false, + } + } + + componentDidMount() { + const { navigation } = this.props; + + // Component doesn't mount or unmount through standard nav so we need these event listeners. + this._unsubscribeFocus = navigation.addListener('focus', () => { + this.cleanUp(); + }); + + this._unsubscribeBlur = navigation.addListener('blur', () => { + this.cleanUp(); + this.closeNFC(); + }); + + this.cleanUp(); + + NfcManager.isSupported() + .then(NFC_supported => { + this.setState({ NFC_supported }); + if (NFC_supported) { + this._startNfc(); + } + }); + tracker.logEvent("SendPaymentCameraScreen"); + } + + cleanUp() { + this.props.resetNewTransfer(); + this.props.resetNFCStatus(); + } + + closeNFC() { + if (this.state.NFC_supported) { + this._stopDetection(); + this.props.cancelNFCRead(); + } + } + + componentWillUnmount() { + this._unsubscribeFocus(); + this._unsubscribeBlur(); + this.cleanUp(); + this.closeNFC(); + } + + componentDidUpdate(prevProps) { + if (this.props.NFCTransceiveStatus.success !== prevProps.NFCTransceiveStatus.success) { + this.setState({ + checkBalance: this.props.NFCTransceiveStatus.success + }); + + if (this.props.NFCTransceiveStatus.success) { + this.setModalVisible(true); + } + } + if (this.state.NFC_enabled && + !this.props.NFCTransceiveStatus.isOpen && + !NfcManager.isEnabled() && + !this.props.NFCTransceiveStatus.success) { + console.log('FFFFF') + console.log('FFFFF') + console.log('FFFFF') + console.log('FFFFF') + console.log('FFFFF') + this.props.chargeNFCCard(0) + } + } + + _startNfc() { + console.log('FOURFOURFOUR') + NfcManager.start({}) + .then(result => { + console.log('start OK4', result); + }) + .catch(error => { + console.warn('start fail', error); + this.setState({supported: false}); + }); + + NfcManager.isEnabled() + .then(NFC_enabled => { + this.setState({ NFC_enabled }); + if (NFC_enabled) { + this._startDetection() + } + }) + .catch(err => { + console.log(err); + }); + } + + _startDetection = () => { + console.log('GGGGGG') + console.log('GGGGGG') + console.log('GGGGGG') + console.log('GGGGGG') + this.setState({detection_was_on_previously: true}); + this.props.chargeNFCCard(0); + }; + + _stopDetection = () => { + try { + NfcManager.cancelTechnologyRequest() + .then(result => { + console.log('stop OK', result) + }) + .catch(error => { + console.warn('nfc stop fail', error) + }) + } + catch(err) { + console.log('stop fail', err) + } + }; + + _handleAdditionalInformation(additional_information) { + this.setState({additional_information}) + } + + _handleCheckBalanceFeedback() { + this.setState({checkBalanceFeedback: true}) + } + + setModalVisible(visible) { + this.setState({modalVisible: visible}); + } + + _handleCompletePayment() { + if (this.props.newTransferStatus.feedback === true) { + this.setState({getFeedback: !this.state.getFeedback}); + } else { + this._resetModal() + } + } + + _handleFeedbackRating(question, rating) { + if (rating >= 1) { + tracker.logEvent("Fedback", {question, rating}); + this.props.newFeedback({'question': question,'rating': rating, 'additional_information': ''}); + // this.setModalVisible(!this.state.modalVisible); + // this._resetModal() + } else { + this.setState({question: question, rating: rating, getAdditionalFeedback: true}) + } + } + + _sendFeedback() { + let { question, rating } = this.state; + tracker.logEvent("Fedback", {question, rating}); + this.props.newFeedback({'question': this.state.question, 'rating': this.state.rating, 'additional_information': this.state.additional_information}) + } + + _resetNewTransfer() { + this.setModalVisible(!this.state.modalVisible); + this.setState({scanData: '', handleScan: true}); + this.props.resetNewTransfer() + } + + _resetModal() { + let transfer = this.props.newTransferStatus; + let feedback = this.props.newFeedbackData; + + this.setState({ + checkBalance: false, + public_serial_number: null, + checkBalanceFeedback: false, + getAdditionalFeedback: false, + additional_information: '', + vendorScan: false, + }, () => console.log('resetModal STATE', this.state)); + + this.props.resetNFCStatus(); + + if (transfer.isRequesting === true || feedback.isRequesting === true) { + // DO NOTHING + return null + } else if (this.state.rating !== null && feedback.success !== true) { + // CAPTURE RATING, THEN EXIT. + // This triggers when a user completes a transfer and leaves negative feedback, but exits before submitting + this._sendFeedback(); + this.props.navigation.popToTop(); + this._resetNewTransfer(); + } else if (transfer.success === true || feedback.success === true) { + // EXIT TO HOME + this.props.navigation.popToTop(); + this._resetNewTransfer() + + } else { + // RESET SCANNER + this._resetNewTransfer() + } + } + + _handleScan = (e) => { + if (this.state.handleScan) { + try { + var data = e.data.trim(); // trim removes spaces around a string + + var address = null; + if (data.length === 42 && data.search(/[ghijklmnopqrstuvwyz]/i) === -1) { + address = data + } else if (data.slice(0, 9) === 'ethereum:') { + address = data.slice(9,) + } + + if (address) { + // parse any query params + + let parsedObject = parseEthQRCode(address); + + if (Object.keys(parsedObject).length === 1) { + // it's just a normal wallet address + + if (this.props.transferData.public_identifier !== parsedObject.address) { + this.props.updateTransferData({public_identifier: parsedObject.address, temp_transfer_mode: 'send'}); + Vibration.vibrate(150, false); + } + + } else { + // it's probably an online qr code (vendor) + if (this.state.scanData !== data) { + let my_matching_transfer_accounts = this.findMatchingTransferAccounts(parsedObject.s) + this.props.updateTransferData({ + public_identifier: parsedObject.address, // should be eth address. + transfer_amount: parseFloat(parsedObject.amount) * 100, + transfer_account_name: parsedObject.n, + transfer_use: parsedObject.tu, + user_id: parsedObject.u, + token_symbol: parsedObject.s, + transfer_random_key: parsedObject.r, + my_matching_transfer_accounts: my_matching_transfer_accounts + }); + + if (my_matching_transfer_accounts.length === 1) { + this.props.updateTransferData({ + my_transfer_account_id: my_matching_transfer_accounts[0] + }); + } + this.setState({scanData: data}); + this.setModalVisible(!this.state.modalVisible); + Vibration.vibrate(150, false); + } + } + + } else if (data.length === 6 && !isNaN(parseInt(data))) { + // it's a public_serial_number - balance check + if (this.state.public_serial_number !== data) { + this.setState({ public_serial_number: data, checkBalance: true }); + this.props.getUserFromPublicSerialNumber({ + public_serial_number: e.data + }); + this.setModalVisible(!this.state.modalVisible); + Vibration.vibrate(150, false); + } + } else { + if ((data.match(/-/g) || []).length >= 2) { + // it's likely a dynamic QR code (vendor is scanning an offline QR Code) + this.handleTransferWithDynamicQRCode(data) + } else { + // it's a general QR code + this.handleOtherQRCode(data) + } + } + } catch (err) { + console.log(err) + } + } + }; + + findMatchingTransferAccounts(tokenSymbol) { + let matchingTokenId = null; + + for (let index in Object.keys(this.props.tokens)) { + let tokenId = Object.keys(this.props.tokens)[index]; //Blurggg Javascript + if (this.props.tokens[tokenId].symbol === tokenSymbol) { + matchingTokenId = tokenId; + break + } + } + + + if (!matchingTokenId) { + return [] + } + + return Object.keys(this.props.transferAccounts) + .filter(transferAccountId => this.props.transferAccounts[transferAccountId].token == matchingTokenId); + } + + handleTransferWithDynamicQRCode(data) { + this.setState({ public_serial_number: data, vendorScan: true, handleScan: false }); + this.props.createTransferRequest({ + 'qr_data': data, + }); + this.setModalVisible(!this.state.modalVisible); + Vibration.vibrate(150, false); + } + + handleOtherQRCode(data) { + this.setState({handleScan: false}); + + function validURL(str) { + var pattern = new RegExp('^(https?:\\/\\/)?'+ // protocol + '((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|'+ // domain name + '((\\d{1,3}\\.){3}\\d{1,3}))'+ // OR ip (v4) address + '(\\:\\d+)?(\\/[-a-z\\d%_.~+]*)*'+ // port and path + '(\\?[;&a-z\\d%_.~+=-]*)?'+ // query string + '(\\#[-a-z\\d_]*)?$','i'); // fragment locator + return !!pattern.test(str); + } + + let buttons = [ + { text: strings('SendPaymentCameraScreen.Cancel'), onPress: () => this.setState({handleScan: true}), style: 'cancel'}, + ]; + + if (validURL(data)) { + buttons.push({ text: strings('SendPaymentCameraScreen.Link'), onPress: () => this.setState({handleScan: true}, () => Linking.openURL(data).catch((err) => console.error('An error occurred', err)))}) + } else { + buttons.push({ text: strings('SendPaymentCameraScreen.Copy'), onPress: () => this.setState({handleScan: true}, () => Clipboard.setString(data))}) + } + + Alert.alert( + `${strings('SendPaymentCameraScreen.QR')}`, + `${data}`, + buttons, + {onDismiss: () => this.setState({handleScan: true})}, + ); + } + + render() { + const { height, width } = Dimensions.get('window'); + const maskRowHeight = Math.round((height - 270) / 20); + const maskColWidth = (width - 270) / 2; + + return ( + + + + + + + + + + + + + + + + + + + + + + + {strings('SendPaymentCameraScreen.CameraPrompt')} + + + + + ); + } +} +export default connect(mapStateToProps, mapDispatchToProps)(SendPaymentCameraScreen); + +const styles = StyleSheet.create({ + rootContainer: { + flex: 1, + backgroundColor: '#FFF', + }, + preview: { + flex: 11, + }, + container: { + flex: 1, + }, + cameraView: { + flex: 1, + justifyContent: 'flex-start', + }, + maskOutter: { + position: 'absolute', + top: 0, + left: 0, + width: '100%', + height: '100%', + alignItems: 'center', + justifyContent: 'space-around', + }, + maskInner: { + width: 270, + backgroundColor: 'transparent', + borderColor: 'white', + borderWidth: 1, + }, + maskFrame: { + backgroundColor: 'rgba(1,1,1,0.6)', + }, + maskRow: { + width: '100%', + }, + maskCenter: { + flexDirection: 'row', + }, + modalBackground: { + flex: 1, + alignItems: 'center', + flexDirection: 'column', + justifyContent: 'space-around', + backgroundColor: '#00000040', + }, + activityIndicatorWrapper: { + backgroundColor: '#FFFFFF', + height: Dimensions.get('window').height * 0.5, + width: Dimensions.get('window').width * 0.8, + padding: 30, + borderRadius: 10, + display: 'flex', + alignItems: 'center', + justifyContent: 'space-between' + }, +}); \ No newline at end of file From 5944bac579ba053e8354dc78ce4bab3d897ff4fb Mon Sep 17 00:00:00 2001 From: michielderoos Date: Thu, 22 Sep 2022 15:38:14 -0300 Subject: [PATCH 6/8] Most of the way there! --- locales/ar.json | 4 +- locales/bi.json | 4 +- locales/en.json | 4 +- locales/es.json | 4 +- locales/fr.json | 4 +- src/api/nfcAPI.js | 9 +- src/components/PaymentModeSwitcher.js | 10 +- src/components/PaymentSwitch.js | 8 +- .../SendPaymentFlow/CheckCardBalanceScreen.js | 519 ++++++++---------- .../SendPaymentFlow/DisplayBalanceNotifier.js | 78 +++ src/components/screens/CheckBalanceScreen.js | 228 -------- 11 files changed, 335 insertions(+), 537 deletions(-) create mode 100644 src/components/SendPaymentFlow/DisplayBalanceNotifier.js delete mode 100644 src/components/screens/CheckBalanceScreen.js diff --git a/locales/ar.json b/locales/ar.json index 3601d1b..4e7be4a 100644 --- a/locales/ar.json +++ b/locales/ar.json @@ -96,6 +96,7 @@ }, "NFCScreen": { "ErrorMessage": "لمس بطاقة", + "BalanceCheckMessage": "تحقق من الرصيد", "NFCError": "خطأ NFC", "NFCCounterError": "خطأ في تطبيق المعاملة على البطاقة", "NFCErrorMessage": "لا يحتوي جهازك على قارئ NFC.", @@ -221,7 +222,8 @@ "PaymentModeSwitcher": { "SendHint": "انتقل إلى شاشة الإرسال", "ChargeHint": "انتقل لاستلام الشاشة", - "ScanHint": "انتقل إلى شاشة مسح الكاميرا" + "ScanHint": "انتقل إلى شاشة مسح الكاميرا", + "BalanceHint": "انتقل للتحقق من رصيد البطاقة" }, "SendPaymentCameraScreen": { "Send": "إرسال", diff --git a/locales/bi.json b/locales/bi.json index 28d3368..1e3f46a 100644 --- a/locales/bi.json +++ b/locales/bi.json @@ -97,6 +97,7 @@ }, "NFCScreen": { "ErrorMessage": "Tajem Kad Lo Phon", + "BalanceCheckMessage": "Check Balance", "NFCError": "Problem", "NFCCounterError": "Error Applying Transaction To Card", "NFCErrorMessage": "Your device does not have an NFC reader.", @@ -222,7 +223,8 @@ "PaymentModeSwitcher": { "SendHint": "Navigate to send screen", "ChargeHint": "Navigate to receive screen", - "ScanHint": "Navigate to camera scan screen" + "ScanHint": "Navigate to camera scan screen", + "BalanceHint": "Navigate to check card balance" }, "SendPaymentCameraScreen": { "Send": "Sendem", diff --git a/locales/en.json b/locales/en.json index 3266812..6961896 100644 --- a/locales/en.json +++ b/locales/en.json @@ -96,6 +96,7 @@ }, "NFCScreen": { "ErrorMessage": "Hold Card To Back", + "BalanceCheckMessage": "Check Balance", "NFCError": "NFC Error", "NFCCounterError": "Error Applying Transaction To Card", "NFCErrorMessage": "Your device does not have an NFC reader.", @@ -221,7 +222,8 @@ "PaymentModeSwitcher": { "SendHint": "Navigate to send screen", "ChargeHint": "Navigate to receive screen", - "ScanHint": "Navigate to camera scan screen" + "ScanHint": "Navigate to camera scan screen", + "BalanceHint": "Navigate to check card balance" }, "SendPaymentCameraScreen": { "Send": "Send", diff --git a/locales/es.json b/locales/es.json index 41065d9..112c366 100644 --- a/locales/es.json +++ b/locales/es.json @@ -97,6 +97,7 @@ }, "NFCScreen": { "ErrorMessage": "Toque la tarjeta", + "BalanceCheckMessage": "Consultar saldo", "NFCError": "Error de tarjeta", "NFCCounterError": "Error al aplicar la transacción a la tarjeta", "NFCErrorMessage": "Su dispositivo no tiene una lectora NFC.", @@ -222,7 +223,8 @@ "PaymentModeSwitcher": { "SendHint": "Navegar a la pantalla de envío", "ChargeHint": "Navegar a la pantalla de recepción", - "ScanHint": "Navegar a la pantalla de escaneo de la cámara" + "ScanHint": "Navegar a la pantalla de escaneo de la cámara", + "BalanceHint": "Navegar para consultar el saldo de la tarjeta" }, "SendPaymentCameraScreen": { "Send": "Enviar", diff --git a/locales/fr.json b/locales/fr.json index 4a3c2fb..23554be 100644 --- a/locales/fr.json +++ b/locales/fr.json @@ -96,6 +96,7 @@ }, "NFCScreen": { "ErrorMessage": "Carte Tap", + "BalanceCheckMessage": "Vérifier le solde", "NFCError": "Erreur NFC", "NFCCounterError": "Erreur lors de l'application de la transaction à la carte", "NFCErrorMessage": "Votre appareil ne possède pas de lecteur NFC.", @@ -221,7 +222,8 @@ "PaymentModeSwitcher": { "SendHint": "Accédez à l'écran d'envoi", "ChargeHint": "Naviguez pour recevoir l'écran", - "ScanHint": "Accédez à l'écran de numérisation de la caméra" + "ScanHint": "Accédez à l'écran de numérisation de la caméra", + "BalanceHint": "Naviguez pour vérifier le solde de la carte" }, "SendPaymentCameraScreen": { "Send": "Envoyer", diff --git a/src/api/nfcAPI.js b/src/api/nfcAPI.js index 9698566..082d41f 100644 --- a/src/api/nfcAPI.js +++ b/src/api/nfcAPI.js @@ -2,10 +2,11 @@ import NfcManager, {NfcTech} from 'react-native-nfc-manager'; import {threeByteArrayToInt, byteArrayToHexString, intToThreeByteArray, getDisplayDecimals} from "../utils"; -export const OpenNFCRequest = async () => ( - NfcManager.registerTagEvent() - .then(() => NfcManager.requestTechnology(NfcTech.NfcA)) -); +export const OpenNFCRequest = async () => { + return NfcManager.registerTagEvent() + .then(() => NfcManager.requestTechnology(NfcTech.NfcA)) + +} export const closeNFCRequest = async () => NfcManager.cancelTechnologyRequest(); diff --git a/src/components/PaymentModeSwitcher.js b/src/components/PaymentModeSwitcher.js index 5f1411d..dbdef01 100644 --- a/src/components/PaymentModeSwitcher.js +++ b/src/components/PaymentModeSwitcher.js @@ -1,15 +1,9 @@ 'use strict'; import React, { Component } from 'react'; import { - Dimensions, StyleSheet, - Text, View, - Alert, TouchableNativeFeedback, - Vibration, - Clipboard, - Linking, } from 'react-native'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; @@ -41,6 +35,7 @@ class PaymentModeSwitcher extends Component { static defaultProps = { camera: false, send: false, + balance: false, charge: false, dark: false, }; @@ -49,13 +44,14 @@ class PaymentModeSwitcher extends Component { let paymentOptions = [ {mode: 'camera', name: 'qrcode-scan', active: this.props.camera, transform: [], label: strings('SendPaymentCameraScreen.CameraPrompt'), hint: strings('PaymentModeSwitcher.ScanHint')}, + {mode: 'balance', name: 'cellphone-nfc', active: this.props.balance, transform: [], label: strings('SendPaymentCameraScreen.CardBalance'), hint: strings('PaymentModeSwitcher.BalanceHint')}, {mode: 'send', name: 'send', active: this.props.send, transform: [{rotate: '-45deg'}], label: strings('SendPaymentCameraScreen.Send'), hint: strings('PaymentModeSwitcher.SendHint')}, ]; if (this.props.login.isVendor || this.props.login.isSupervendor) { paymentOptions.push({mode: 'charge', name: 'credit-card-multiple', active: this.props.charge, transform: [], label: strings('NavBar.chargeButtonText'), hint: strings('PaymentModeSwitcher.ChargeHint')}) } - + return ( {paymentOptions.map((option, index) => { diff --git a/src/components/PaymentSwitch.js b/src/components/PaymentSwitch.js index f4f5a8b..df2824e 100644 --- a/src/components/PaymentSwitch.js +++ b/src/components/PaymentSwitch.js @@ -9,6 +9,7 @@ import { import { connect } from "react-redux"; import SendPaymentCameraScreen from './SendPaymentFlow/SendPaymentCameraScreen'; +import CheckCardBalanceScreen from './SendPaymentFlow/CheckCardBalanceScreen'; import PaymentAmountScreen from "./SendPaymentFlow/PaymentAmountScreen.js" import PaymentsAmountScreen from "../components/ReceivePaymentFlow/PaymentsAmountScreen"; @@ -30,12 +31,13 @@ class PaymentSwitch extends Component { static defaultProps = { camera: false, send: false, - charge: false + charge: false, + balance: false }; render() { const { transferData } = this.props; - console.log('payment switch--',transferData.default_transfer_mode); + console.log('payment switch--', transferData.default_transfer_mode); if (transferData.default_transfer_mode === 'camera' && transferData.temp_transfer_mode === null) { return @@ -43,6 +45,8 @@ class PaymentSwitch extends Component { return } else if (transferData.default_transfer_mode === 'charge') { return + } else if (transferData.default_transfer_mode == 'balance') { + return } else if (this.props.login.isVendor) { return } else { diff --git a/src/components/SendPaymentFlow/CheckCardBalanceScreen.js b/src/components/SendPaymentFlow/CheckCardBalanceScreen.js index e6dd5f8..ddb4c1d 100644 --- a/src/components/SendPaymentFlow/CheckCardBalanceScreen.js +++ b/src/components/SendPaymentFlow/CheckCardBalanceScreen.js @@ -1,37 +1,34 @@ 'use strict'; import React, { Component } from 'react'; import { - Dimensions, StyleSheet, Text, View, - Alert, - Vibration, - Clipboard, - Linking, + ActivityIndicator, + Image, + StatusBar } from 'react-native'; -import { RNCamera } from 'react-native-camera'; +import { theme } from "../../Styles"; +import TransferCompleteNotifier from "./DisplayBalanceNotifier" +import AsyncButton from "../common/AsyncButton"; -import { newFeedback, RESET_NEW_FEEDBACK_DATA } from '../../reducers/feedbackReducer' -import { updateTransferData, createTransferRequest, RESET_NEW_TRANSFER, RESET_TRANSFER_DATA } from '../../reducers/creditTransferReducer.js' -import { getUserFromPublicSerialNumber, RESET_USER_BY_PUBLIC_SERIAL } from "../../reducers/userReducer"; -import {chargeNFCCard, closeNFCRead, resetNFCStatus} from "../../reducers/nfcReducer"; +import { updateTransferData, RESET_NEW_TRANSFER, RESET_TRANSFER_DATA } from '../../reducers/creditTransferReducer.js' +import { RESET_USER_BY_PUBLIC_SERIAL } from "../../reducers/userReducer"; +import { chargeNFCCard, closeNFCRead, resetNFCStatus } from "../../reducers/nfcReducer"; import NfcManager from "react-native-nfc-manager"; import { connect } from "react-redux"; import { strings } from '../../../locales/i18n'; -import { trim, parseEthQRCode } from '../../utils'; -import CameraModal from './CameraModal.js' -import {tracker} from "../../analytics"; +import { tracker } from "../../analytics"; import PaymentModeSwitcher from "../PaymentModeSwitcher"; import ExitToHome from "../ExitToHome" +import { resetTransferData } from "../../reducers/creditTransferReducer"; const mapStateToProps = (state) => { return { newTransferStatus: state.creditTransfers.createStatus, login: state.login, - newFeedbackData: state.newFeedbackData, transferData: state.creditTransfers.transferData, NFCTransceiveStatus: state.NFC.TransceiveStatus, tokens: state.tokens.byId, @@ -41,16 +38,18 @@ const mapStateToProps = (state) => { const mapDispatchToProps = (dispatch) => { return { - getUserFromPublicSerialNumber: (query) => dispatch(getUserFromPublicSerialNumber({query})), - createTransferRequest: (body) => dispatch(createTransferRequest({body})), + resetTransferData: () => { + dispatch(resetTransferData()); + dispatch(resetNFCStatus()); + dispatch(closeNFCRead()); + }, + resetNewTransfer: () => { console.log("resetting new transfer") - dispatch({type: RESET_NEW_TRANSFER}); - dispatch({type: RESET_NEW_FEEDBACK_DATA}); - dispatch({type: RESET_TRANSFER_DATA}); - dispatch({type: RESET_USER_BY_PUBLIC_SERIAL}); + dispatch({ type: RESET_NEW_TRANSFER }); + dispatch({ type: RESET_TRANSFER_DATA }); + dispatch({ type: RESET_USER_BY_PUBLIC_SERIAL }); }, - newFeedback: (payload) => dispatch(newFeedback(payload)), updateTransferData: (payload) => dispatch(updateTransferData(payload)), chargeNFCCard: (chargeAmount) => dispatch(chargeNFCCard(chargeAmount, null)), cancelNFCRead: () => dispatch(closeNFCRead()), @@ -68,12 +67,6 @@ class SendPaymentCameraScreen extends Component { transfer_amount: '', transfer_use: '', transfer_random_key: '', - modalVisible: false, - feedbackModalVisible: false, - offlineModalVisible: false, - getFeedback: false, - checkBalanceFeedback: false, - getAdditionalFeedback: false, question: '', rating: null, additional_information: '', @@ -141,32 +134,23 @@ class SendPaymentCameraScreen extends Component { checkBalance: this.props.NFCTransceiveStatus.success }); - if (this.props.NFCTransceiveStatus.success) { - this.setModalVisible(true); - } - } + } if (this.state.NFC_enabled && !this.props.NFCTransceiveStatus.isOpen && !NfcManager.isEnabled() && !this.props.NFCTransceiveStatus.success) { - console.log('FFFFF') - console.log('FFFFF') - console.log('FFFFF') - console.log('FFFFF') - console.log('FFFFF') - this.props.chargeNFCCard(0) + this.props.chargeNFCCard(0) } } _startNfc() { - console.log('FOURFOURFOUR') NfcManager.start({}) .then(result => { console.log('start OK4', result); }) .catch(error => { console.warn('start fail', error); - this.setState({supported: false}); + this.setState({ supported: false }); }); NfcManager.isEnabled() @@ -182,11 +166,7 @@ class SendPaymentCameraScreen extends Component { } _startDetection = () => { - console.log('GGGGGG') - console.log('GGGGGG') - console.log('GGGGGG') - console.log('GGGGGG') - this.setState({detection_was_on_previously: true}); + this.setState({ detection_was_on_previously: true }); this.props.chargeNFCCard(0); }; @@ -200,82 +180,41 @@ class SendPaymentCameraScreen extends Component { console.warn('nfc stop fail', error) }) } - catch(err) { + catch (err) { console.log('stop fail', err) } }; _handleAdditionalInformation(additional_information) { - this.setState({additional_information}) + this.setState({ additional_information }) } - _handleCheckBalanceFeedback() { - this.setState({checkBalanceFeedback: true}) - } - - setModalVisible(visible) { - this.setState({modalVisible: visible}); - } _handleCompletePayment() { - if (this.props.newTransferStatus.feedback === true) { - this.setState({getFeedback: !this.state.getFeedback}); - } else { - this._resetModal() - } - } - - _handleFeedbackRating(question, rating) { - if (rating >= 1) { - tracker.logEvent("Fedback", {question, rating}); - this.props.newFeedback({'question': question,'rating': rating, 'additional_information': ''}); - // this.setModalVisible(!this.state.modalVisible); - // this._resetModal() - } else { - this.setState({question: question, rating: rating, getAdditionalFeedback: true}) - } - } - - _sendFeedback() { - let { question, rating } = this.state; - tracker.logEvent("Fedback", {question, rating}); - this.props.newFeedback({'question': this.state.question, 'rating': this.state.rating, 'additional_information': this.state.additional_information}) + this._resetModal() } _resetNewTransfer() { - this.setModalVisible(!this.state.modalVisible); - this.setState({scanData: '', handleScan: true}); + this.setState({ scanData: '', handleScan: true }); this.props.resetNewTransfer() } _resetModal() { let transfer = this.props.newTransferStatus; - let feedback = this.props.newFeedbackData; this.setState({ checkBalance: false, public_serial_number: null, - checkBalanceFeedback: false, - getAdditionalFeedback: false, additional_information: '', vendorScan: false, }, () => console.log('resetModal STATE', this.state)); this.props.resetNFCStatus(); - if (transfer.isRequesting === true || feedback.isRequesting === true) { - // DO NOTHING - return null - } else if (this.state.rating !== null && feedback.success !== true) { - // CAPTURE RATING, THEN EXIT. - // This triggers when a user completes a transfer and leaves negative feedback, but exits before submitting - this._sendFeedback(); - this.props.navigation.popToTop(); - this._resetNewTransfer(); - } else if (transfer.success === true || feedback.success === true) { + if (transfer.success === true) { // EXIT TO HOME - this.props.navigation.popToTop(); this._resetNewTransfer() + this.props.navigation.popToTop(); } else { // RESET SCANNER @@ -283,176 +222,214 @@ class SendPaymentCameraScreen extends Component { } } - _handleScan = (e) => { - if (this.state.handleScan) { - try { - var data = e.data.trim(); // trim removes spaces around a string - var address = null; - if (data.length === 42 && data.search(/[ghijklmnopqrstuvwyz]/i) === -1) { - address = data - } else if (data.slice(0, 9) === 'ethereum:') { - address = data.slice(9,) - } + render() { - if (address) { - // parse any query params - - let parsedObject = parseEthQRCode(address); - - if (Object.keys(parsedObject).length === 1) { - // it's just a normal wallet address - - if (this.props.transferData.public_identifier !== parsedObject.address) { - this.props.updateTransferData({public_identifier: parsedObject.address, temp_transfer_mode: 'send'}); - Vibration.vibrate(150, false); - } - - } else { - // it's probably an online qr code (vendor) - if (this.state.scanData !== data) { - let my_matching_transfer_accounts = this.findMatchingTransferAccounts(parsedObject.s) - this.props.updateTransferData({ - public_identifier: parsedObject.address, // should be eth address. - transfer_amount: parseFloat(parsedObject.amount) * 100, - transfer_account_name: parsedObject.n, - transfer_use: parsedObject.tu, - user_id: parsedObject.u, - token_symbol: parsedObject.s, - transfer_random_key: parsedObject.r, - my_matching_transfer_accounts: my_matching_transfer_accounts - }); - - if (my_matching_transfer_accounts.length === 1) { - this.props.updateTransferData({ - my_transfer_account_id: my_matching_transfer_accounts[0] - }); - } - this.setState({scanData: data}); - this.setModalVisible(!this.state.modalVisible); - Vibration.vibrate(150, false); - } - } - - } else if (data.length === 6 && !isNaN(parseInt(data))) { - // it's a public_serial_number - balance check - if (this.state.public_serial_number !== data) { - this.setState({ public_serial_number: data, checkBalance: true }); - this.props.getUserFromPublicSerialNumber({ - public_serial_number: e.data - }); - this.setModalVisible(!this.state.modalVisible); - Vibration.vibrate(150, false); - } - } else { - if ((data.match(/-/g) || []).length >= 2) { - // it's likely a dynamic QR code (vendor is scanning an offline QR Code) - this.handleTransferWithDynamicQRCode(data) - } else { - // it's a general QR code - this.handleOtherQRCode(data) - } - } - } catch (err) { - console.log(err) - } + let { login } = this.props; + if (this.props.NFCTransceiveStatus.success) { + return ( + + ) } - }; - findMatchingTransferAccounts(tokenSymbol) { - let matchingTokenId = null; + if (this.props.NFCTransceiveStatus.error) { + var error_message = String(this.props.NFCTransceiveStatus.error); - for (let index in Object.keys(this.props.tokens)) { - let tokenId = Object.keys(this.props.tokens)[index]; //Blurggg Javascript - if (this.props.tokens[tokenId].symbol === tokenSymbol) { - matchingTokenId = tokenId; - break + if (error_message === 'transceive fail') { + error_message = strings('NFCScreen.NFCTransceiveFail') + } else if (error_message === 'fail to connect tag') { + error_message = strings('NFCScreen.NFCTagError') } + } else { + error_message = `${strings('NFCScreen.ErrorMessage')}`; } + let cardOnly = ( + + ) + + let highCard = ( + + ) + + let midCard = ( + + ) + + let cardImage = cardOnly; + let middleStyle; + let bottomSection = null; + + let textDetails = ( + + + {strings('NFCScreen.BalanceCheckMessage')} + + + + {error_message} + + + + ); - if (!matchingTokenId) { - return [] - } - - return Object.keys(this.props.transferAccounts) - .filter(transferAccountId => this.props.transferAccounts[transferAccountId].token == matchingTokenId); - } - - handleTransferWithDynamicQRCode(data) { - this.setState({ public_serial_number: data, vendorScan: true, handleScan: false }); - this.props.createTransferRequest({ - 'qr_data': data, - }); - this.setModalVisible(!this.state.modalVisible); - Vibration.vibrate(150, false); - } + if (login.NFCPositions && login.NFCPositions[model]) { + let positionDetails = login.NFCPositions[model]; - handleOtherQRCode(data) { - this.setState({handleScan: false}); - - function validURL(str) { - var pattern = new RegExp('^(https?:\\/\\/)?'+ // protocol - '((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|'+ // domain name - '((\\d{1,3}\\.){3}\\d{1,3}))'+ // OR ip (v4) address - '(\\:\\d+)?(\\/[-a-z\\d%_.~+]*)*'+ // port and path - '(\\?[;&a-z\\d%_.~+=-]*)?'+ // query string - '(\\#[-a-z\\d_]*)?$','i'); // fragment locator - return !!pattern.test(str); - } + if (positionDetails.cardImage === 'HIGH') { + cardImage = highCard + } else if (positionDetails.cardImage === 'MID') { + cardImage = midCard + } - let buttons = [ - { text: strings('SendPaymentCameraScreen.Cancel'), onPress: () => this.setState({handleScan: true}), style: 'cancel'}, - ]; + middleStyle = { + alignItems: 'center', + justifyContent: 'center', + width: '100%', + height: positionDetails.middleHeight + }; + + topSection = ( + + + + + + ); + + bottomSection = ( + + + + + {textDetails} + + ) - if (validURL(data)) { - buttons.push({ text: strings('SendPaymentCameraScreen.Link'), onPress: () => this.setState({handleScan: true}, () => Linking.openURL(data).catch((err) => console.error('An error occurred', err)))}) } else { - buttons.push({ text: strings('SendPaymentCameraScreen.Copy'), onPress: () => this.setState({handleScan: true}, () => Clipboard.setString(data))}) + middleStyle = { + alignItems: 'center', + justifyContent: 'center', + width: '100%', + height: '50%' + }; + + bottomSection = ( + + {textDetails} + + ) } - Alert.alert( - `${strings('SendPaymentCameraScreen.QR')}`, - `${data}`, - buttons, - {onDismiss: () => this.setState({handleScan: true})}, - ); - } - - render() { - const { height, width } = Dimensions.get('window'); - const maskRowHeight = Math.round((height - 270) / 20); - const maskColWidth = (width - 270) / 2; - - return ( - - - - - - - - - + if (this.props.NFCTransceiveStatus.isReading || this.props.newTransferStatus.isRequesting) { + let progressWidth; + try { + progressWidth = this.props.NFCTransceiveStatus.nfcStage / 4 * 200 + } catch (e) { + progressWidth = 200; + } - + return ( + + + + + + - - - - - - - - - - {strings('SendPaymentCameraScreen.CameraPrompt')} - + + + + ) + } else if (this.props.NFCTransceiveStatus.error) { + return ( + + + + {error_message} + this.props.chargeNFCCard(this.props.transferData.transfer_amount)} + /> + + + ); + } else { + return ( + + + + + + + + + {cardImage} + + {bottomSection} - - ); + ); + } } } export default connect(mapStateToProps, mapDispatchToProps)(SendPaymentCameraScreen); @@ -462,55 +439,15 @@ const styles = StyleSheet.create({ flex: 1, backgroundColor: '#FFF', }, - preview: { - flex: 11, - }, - container: { - flex: 1, - }, - cameraView: { - flex: 1, - justifyContent: 'flex-start', - }, - maskOutter: { - position: 'absolute', - top: 0, - left: 0, - width: '100%', - height: '100%', - alignItems: 'center', - justifyContent: 'space-around', - }, - maskInner: { - width: 270, - backgroundColor: 'transparent', - borderColor: 'white', - borderWidth: 1, - }, - maskFrame: { - backgroundColor: 'rgba(1,1,1,0.6)', - }, - maskRow: { - width: '100%', - }, - maskCenter: { - flexDirection: 'row', - }, - modalBackground: { - flex: 1, - alignItems: 'center', - flexDirection: 'column', - justifyContent: 'space-around', - backgroundColor: '#00000040', - }, - activityIndicatorWrapper: { - backgroundColor: '#FFFFFF', - height: Dimensions.get('window').height * 0.5, - width: Dimensions.get('window').width * 0.8, - padding: 30, - borderRadius: 10, - display: 'flex', - alignItems: 'center', - justifyContent: 'space-between' + retryText: { + color: theme.colors.error, + fontSize: 20, + padding: 10, + fontWeight: 'bold', }, + inputValueText: { + color: '#3D454C', + fontSize: 38, + fontWeight: 'bold', + } }); \ No newline at end of file diff --git a/src/components/SendPaymentFlow/DisplayBalanceNotifier.js b/src/components/SendPaymentFlow/DisplayBalanceNotifier.js new file mode 100644 index 0000000..6c49f92 --- /dev/null +++ b/src/components/SendPaymentFlow/DisplayBalanceNotifier.js @@ -0,0 +1,78 @@ +import React from 'react' +import { StyleSheet, Text, View } from 'react-native' +import { TouchableHighlight } from 'react-native-gesture-handler' + +import { strings } from '../../../locales/i18n'; + +import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; +import CurrencyAmount from "../CurrencyAmount"; + +export default function TransferCompleteNotifier(props) { + + const { navigation, balance, resetTransferData } = props; + + + if (balance !== undefined) { + var balanceDisplay = ( + + Balance: + + ) + } else { + balanceDisplay = null + } + + return ( + + + + + {balanceDisplay} + + + { + resetTransferData(); + navigation.navigate('Home') + }} + accessibilityLabel={strings('TransferCompleteScreen.Continue')}> + {strings('TransferCompleteScreen.Continue')} + + + + ) +} + +const styles = StyleSheet.create({ + container: { + flex: 1, + backgroundColor: '#FFF', + justifyContent: 'center', + alignItems: 'center', + }, + mainContainer: { + flex: 10, + backgroundColor: '#FFF', + justifyContent: 'center', + alignItems: 'center', + }, + chargeContainer: { + flex: 2, + margin: 20 + }, + chargeButton: { + padding: 10, + backgroundColor: '#2D9EA0', + justifyContent: 'center', + }, + chargeButtonText: { + color: '#FFF', + fontSize: 24, + textAlign: 'center' + }, + balance: { + color: '#3D454C', + fontSize: 38, + fontWeight: 'bold', + }, +}); \ No newline at end of file diff --git a/src/components/screens/CheckBalanceScreen.js b/src/components/screens/CheckBalanceScreen.js deleted file mode 100644 index c6c98c8..0000000 --- a/src/components/screens/CheckBalanceScreen.js +++ /dev/null @@ -1,228 +0,0 @@ -import React from 'react' -import { - StyleSheet, - Text, - View, - ActivityIndicator, - Modal, -} from 'react-native' - -import {connect} from "react-redux"; - -import Styles from '../../Styles'; - -import { getUserFromPublicSerialNumber, RESET_USER_BY_PUBLIC_SERIAL } from "../../reducers/userReducer"; - -import { RNCamera } from "react-native-camera"; -import { strings } from "../../../locales/i18n"; -import CurrencyAmount from '../CurrencyAmount' -import {chargeNFCCard, closeNFCRead} from "../../reducers/nfcReducer"; -import NfcManager from "react-native-nfc-manager"; - -const mapStateToProps = (state) => { - return { - locale: state.locale, - users: state.users, - NFCTransceiveStatus: state.NFC.TransceiveStatus - }; -}; - -const mapDispatchToProps = (dispatch) => { - return { - getUserFromPublicSerialNumber: (query) => dispatch(getUserFromPublicSerialNumber({query})), - resetCheckBalance: () => dispatch({type: RESET_USER_BY_PUBLIC_SERIAL}), - chargeNFCCard: (chargeAmount) => dispatch(chargeNFCCard(chargeAmount, null)), - cancelNFCRead: () => dispatch(closeNFCRead()) - }; -}; - -class CheckBalanceScreen extends React.Component { - constructor(props) { - super(props); - this.state = { - public_serial_number: '', - NFC_supported: true, - NFC_enabled: false, - detection_was_on_previously: false, - nfc_id: '', - amount: '', - checking_nfc: false, - invalid_nfc: false, - } - } - - static navigationOptions = ({ navigation }) => ({ - title: `${navigation.state.params.title}`, - }); - - componentDidMount() { - NfcManager.isSupported() - .then(NFC_supported => { - this.setState({ NFC_supported }); - if (NFC_supported) { - this._startNfc(); - } - }) - } - - componentWillUnmount() { - this.props.resetCheckBalance(); - this._stopDetection(); - this.props.cancelNFCRead(); - } - - _handleScan = (e) => { - try { - if (this.state.public_serial_number !== e.data) { - this.setState({ public_serial_number: e.data }); - this.props.getUserFromPublicSerialNumber({ - public_serial_number: e.data - }) - } - } - catch(err) { - console.log(err) - } - }; - - _startNfc() { - NfcManager.start({ - - }).then(result => { - console.log('start OK', result); - }) - .catch(error => { - console.warn('start fail', error); - this.setState({supported: false}); - }) - - - NfcManager.isEnabled() - .then(NFC_enabled => { - this.setState({ NFC_enabled }); - - if (NFC_enabled) { - this._startDetection() - } - - }) - .catch(err => { - console.log(err); - }) - - } - - _startDetection = () => { - this.setState({detection_was_on_previously: true}); - this.props.chargeNFCCard(0); - }; - - _stopDetection = () => { - NfcManager.cancelTechnologyRequest().then(result => { - console.log('stop OK', result) - }) - .catch(error => { - console.warn('stop fail', error) - }) - }; - - render() { - - if (this.props.users.getUserFromPublicSerialNumberStatus.success === true) { - var content = - - {this.props.users.getUserFromPublicSerialNumberStatus.load_result.message} - Balance: - - } else if (this.props.NFCTransceiveStatus.success === true) { - content = - - Balance: - - - } else if (this.props.users.getUserFromPublicSerialNumberStatus.error !== null) { - content = {this.props.users.getUserFromPublicSerialNumberStatus.error.message} - } else { - content = null - } - - return ( - - { - this.camera = ref; - }} - style={styles.preview} - type={RNCamera.Constants.Type.back} - flashMode={RNCamera.Constants.FlashMode.off} - onBarCodeRead={(e) => this._handleScan(e)} - barCodeTypes={[RNCamera.Constants.BarCodeType.qr]} - androidCameraPermissionOptions={{ - title: `${strings('CameraScreen.permissionDialog')}`, - message: `${strings('CameraScreen.permissionDialog')}`, - buttonPositive: 'Ok', - buttonNegative: 'Cancel', - }} - /> - {content} - {(this.props.users.getUserFromPublicSerialNumberStatus.isRequesting - || this.props.NFCTransceiveStatus.isReading)? - - - - - - - - : null } - - ) - } -} - -export default connect(mapStateToProps, mapDispatchToProps)(CheckBalanceScreen); - -const styles = StyleSheet.create({ - preview: { - flex: 11, - }, - modalBackground: { - flex: 1, - alignItems: 'center', - flexDirection: 'column', - justifyContent: 'space-around', - backgroundColor: '#00000040' - }, - activityIndicatorWrapper: { - backgroundColor: '#FFFFFF', - height: 100, - width: 100, - borderRadius: 10, - display: 'flex', - alignItems: 'center', - justifyContent: 'space-around' - }, - title: { - color: '#4A4A4A', - fontSize: 20, - fontWeight: 'bold', - textAlign: 'center', - marginTop: 20, - paddingLeft: 30, - paddingRight: 30, - paddingBottom: 5, - borderBottomWidth: 2, - borderColor: '#F7F7F7' - }, - balance: { - color: '#4A4A4A', - fontSize: 20, - fontWeight: 'bold', - textAlign: 'center', - } -}); \ No newline at end of file From 8fbe99fd3a75515c6fb7f0b002cde3cf5341be18 Mon Sep 17 00:00:00 2001 From: michielderoos Date: Thu, 22 Sep 2022 16:07:19 -0300 Subject: [PATCH 7/8] Polish it up --- .../SendPaymentFlow/CheckCardBalanceScreen.js | 56 ++++--------------- .../SendPaymentFlow/DisplayBalanceNotifier.js | 12 ++-- 2 files changed, 17 insertions(+), 51 deletions(-) diff --git a/src/components/SendPaymentFlow/CheckCardBalanceScreen.js b/src/components/SendPaymentFlow/CheckCardBalanceScreen.js index ddb4c1d..c58b871 100644 --- a/src/components/SendPaymentFlow/CheckCardBalanceScreen.js +++ b/src/components/SendPaymentFlow/CheckCardBalanceScreen.js @@ -12,7 +12,7 @@ import { theme } from "../../Styles"; import TransferCompleteNotifier from "./DisplayBalanceNotifier" import AsyncButton from "../common/AsyncButton"; -import { updateTransferData, RESET_NEW_TRANSFER, RESET_TRANSFER_DATA } from '../../reducers/creditTransferReducer.js' +import { RESET_NEW_TRANSFER, RESET_TRANSFER_DATA } from '../../reducers/creditTransferReducer.js' import { RESET_USER_BY_PUBLIC_SERIAL } from "../../reducers/userReducer"; import { chargeNFCCard, closeNFCRead, resetNFCStatus } from "../../reducers/nfcReducer"; import NfcManager from "react-native-nfc-manager"; @@ -31,8 +31,6 @@ const mapStateToProps = (state) => { login: state.login, transferData: state.creditTransfers.transferData, NFCTransceiveStatus: state.NFC.TransceiveStatus, - tokens: state.tokens.byId, - transferAccounts: state.transferAccounts.byId }; }; @@ -50,14 +48,13 @@ const mapDispatchToProps = (dispatch) => { dispatch({ type: RESET_TRANSFER_DATA }); dispatch({ type: RESET_USER_BY_PUBLIC_SERIAL }); }, - updateTransferData: (payload) => dispatch(updateTransferData(payload)), chargeNFCCard: (chargeAmount) => dispatch(chargeNFCCard(chargeAmount, null)), cancelNFCRead: () => dispatch(closeNFCRead()), resetNFCStatus: () => dispatch(resetNFCStatus()) }; }; -class SendPaymentCameraScreen extends Component { +class CheckCardBalanceScreen extends Component { constructor(props) { super(props); this.state = { @@ -90,6 +87,13 @@ class SendPaymentCameraScreen extends Component { // Component doesn't mount or unmount through standard nav so we need these event listeners. this._unsubscribeFocus = navigation.addListener('focus', () => { this.cleanUp(); + NfcManager.isSupported() + .then(NFC_supported => { + this.setState({ NFC_supported }); + if (NFC_supported) { + this._startNfc(); + } + }); }); this._unsubscribeBlur = navigation.addListener('blur', () => { @@ -106,7 +110,7 @@ class SendPaymentCameraScreen extends Component { this._startNfc(); } }); - tracker.logEvent("SendPaymentCameraScreen"); + tracker.logEvent("CheckCardBalanceScreen"); } cleanUp() { @@ -185,44 +189,6 @@ class SendPaymentCameraScreen extends Component { } }; - _handleAdditionalInformation(additional_information) { - this.setState({ additional_information }) - } - - - _handleCompletePayment() { - this._resetModal() - } - - _resetNewTransfer() { - this.setState({ scanData: '', handleScan: true }); - this.props.resetNewTransfer() - } - - _resetModal() { - let transfer = this.props.newTransferStatus; - - this.setState({ - checkBalance: false, - public_serial_number: null, - additional_information: '', - vendorScan: false, - }, () => console.log('resetModal STATE', this.state)); - - this.props.resetNFCStatus(); - - if (transfer.success === true) { - // EXIT TO HOME - this._resetNewTransfer() - this.props.navigation.popToTop(); - - } else { - // RESET SCANNER - this._resetNewTransfer() - } - } - - render() { let { login } = this.props; @@ -432,7 +398,7 @@ class SendPaymentCameraScreen extends Component { } } } -export default connect(mapStateToProps, mapDispatchToProps)(SendPaymentCameraScreen); +export default connect(mapStateToProps, mapDispatchToProps)(CheckCardBalanceScreen); const styles = StyleSheet.create({ rootContainer: { diff --git a/src/components/SendPaymentFlow/DisplayBalanceNotifier.js b/src/components/SendPaymentFlow/DisplayBalanceNotifier.js index 6c49f92..8d923b1 100644 --- a/src/components/SendPaymentFlow/DisplayBalanceNotifier.js +++ b/src/components/SendPaymentFlow/DisplayBalanceNotifier.js @@ -26,16 +26,16 @@ export default function TransferCompleteNotifier(props) { - + {balanceDisplay} { - resetTransferData(); - navigation.navigate('Home') - }} - accessibilityLabel={strings('TransferCompleteScreen.Continue')}> + onPress={() => { + resetTransferData(); + navigation.navigate('Home') + }} + accessibilityLabel={strings('TransferCompleteScreen.Continue')}> {strings('TransferCompleteScreen.Continue')} From 6860032f87cbaca63b7862e7cf05c8de16f3d222 Mon Sep 17 00:00:00 2001 From: michielderoos Date: Thu, 22 Sep 2022 16:10:36 -0300 Subject: [PATCH 8/8] Version --- package-lock.json | 2 +- package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/package-lock.json b/package-lock.json index 6ce8816..f146925 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "Sempo", - "version": "1.7.4", + "version": "1.7.5", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index 99442fb..40eb9ef 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "Sempo", - "version": "1.7.4", + "version": "1.7.5", "private": true, "scripts": { "android": "react-native run-android",