diff --git a/lib/customers.js b/lib/customers.js index d4668429..ebbc76b5 100644 --- a/lib/customers.js +++ b/lib/customers.js @@ -125,7 +125,7 @@ async function updateCustomer (id, data, userToken) { } if (data.subscriberInfo) { - Promise.all([getCustomerById(id), settingsLoader.loadLatest()]) + await Promise.all([getCustomerById(id), settingsLoader.loadLatest()]) .then(([customer, config]) => sms.getLookup(config, customer.phone)) .then(res => updateSubscriberData(id, res, userToken)) .catch(logger.error) diff --git a/new-lamassu-admin/src/pages/Customers/CustomerData.js b/new-lamassu-admin/src/pages/Customers/CustomerData.js index 837a9f93..4029814a 100644 --- a/new-lamassu-admin/src/pages/Customers/CustomerData.js +++ b/new-lamassu-admin/src/pages/Customers/CustomerData.js @@ -1,4 +1,3 @@ -import { DialogActions, DialogContent, Dialog } from '@material-ui/core' import Grid from '@material-ui/core/Grid' import { makeStyles } from '@material-ui/core/styles' import { parse, format } from 'date-fns/fp' @@ -7,9 +6,9 @@ import { useState, React } from 'react' import * as Yup from 'yup' import ImagePopper from 'src/components/ImagePopper' -import { FeatureButton, Button, IconButton } from 'src/components/buttons' +import { FeatureButton } from 'src/components/buttons' import { TextInput } from 'src/components/inputs/formik' -import { H3, Info3, H2 } from 'src/components/typography' +import { H3, Info3 } from 'src/components/typography' import { OVERRIDE_AUTHORIZED, OVERRIDE_REJECTED @@ -17,7 +16,6 @@ import { import { ReactComponent as CardIcon } from 'src/styling/icons/ID/card/comet.svg' import { ReactComponent as PhoneIcon } from 'src/styling/icons/ID/phone/comet.svg' import { ReactComponent as CrossedCameraIcon } from 'src/styling/icons/ID/photo/crossed-camera.svg' -import { ReactComponent as CloseIcon } from 'src/styling/icons/action/close/zodiac.svg' import { ReactComponent as EditIcon } from 'src/styling/icons/action/edit/comet.svg' import { ReactComponent as CustomerListViewReversedIcon } from 'src/styling/icons/circle buttons/customer-list-view/white.svg' import { ReactComponent as CustomerListViewIcon } from 'src/styling/icons/circle buttons/customer-list-view/zodiac.svg' @@ -74,11 +72,11 @@ const CustomerData = ({ updateCustomRequest, authorizeCustomRequest, updateCustomEntry, - retrieveAdditionalData + retrieveAdditionalDataDialog, + setRetrieve }) => { const classes = useStyles() const [listView, setListView] = useState(false) - const [retrieve, setRetrieve] = useState(false) const idData = R.path(['idCardData'])(customer) const rawExpirationDate = R.path(['expirationDate'])(idData) @@ -500,67 +498,9 @@ const CustomerData = ({ )} - + {retrieveAdditionalDataDialog} ) } -const RetrieveDataDialog = ({ - setRetrieve, - retrieveAdditionalData, - open, - props -}) => { - const classes = useStyles() - - return ( - -
- setRetrieve(false)}> - - -
-

{'Retrieve API data from Twilio'}

- - {`With this action you'll be using Twilio's API to retrieve additional - data from this user. This includes name and address, if available.\n`} - {` There is a small cost from Twilio for each retrieval. Would you like - to proceed?`} - - - - - -
- ) -} - export default CustomerData diff --git a/new-lamassu-admin/src/pages/Customers/CustomerData.styles.js b/new-lamassu-admin/src/pages/Customers/CustomerData.styles.js index 9a4e2871..373e2f0c 100644 --- a/new-lamassu-admin/src/pages/Customers/CustomerData.styles.js +++ b/new-lamassu-admin/src/pages/Customers/CustomerData.styles.js @@ -1,4 +1,4 @@ -import { offColor, spacer } from 'src/styling/variables' +import { offColor } from 'src/styling/variables' export default { header: { @@ -45,26 +45,5 @@ export default { left: '100%', marginLeft: 15 } - }, - closeButton: { - display: 'flex', - padding: [[spacer * 2, spacer * 2, 0, spacer * 2]], - paddingRight: spacer * 1.5, - justifyContent: 'end' - }, - dialogTitle: { - margin: [[0, spacer * 2, spacer, spacer * 4 + spacer]] - }, - dialogContent: { - width: 615, - marginLeft: 16 - }, - dialogActions: { - padding: spacer * 4, - paddingTop: spacer * 2 - }, - cancelButton: { - marginRight: 8, - padding: 0 } } diff --git a/new-lamassu-admin/src/pages/Customers/CustomerProfile.js b/new-lamassu-admin/src/pages/Customers/CustomerProfile.js index 1d44c02c..4d82ebe2 100644 --- a/new-lamassu-admin/src/pages/Customers/CustomerProfile.js +++ b/new-lamassu-admin/src/pages/Customers/CustomerProfile.js @@ -1,18 +1,27 @@ import { useQuery, useMutation } from '@apollo/react-hooks' -import { makeStyles, Breadcrumbs, Box } from '@material-ui/core' +import { + makeStyles, + Breadcrumbs, + Box, + DialogActions, + DialogContent, + Dialog +} from '@material-ui/core' import NavigateNextIcon from '@material-ui/icons/NavigateNext' import gql from 'graphql-tag' import * as R from 'ramda' import React, { memo, useState } from 'react' import { useHistory, useParams } from 'react-router-dom' -import { ActionButton } from 'src/components/buttons' +import ErrorMessage from 'src/components/ErrorMessage' +import { Button, IconButton, ActionButton } from 'src/components/buttons' import { Switch } from 'src/components/inputs' -import { Label1, Label2 } from 'src/components/typography' +import { Label1, Label2, H2, Info3 } from 'src/components/typography' import { OVERRIDE_AUTHORIZED, OVERRIDE_REJECTED } from 'src/pages/Customers/components/propertyCard' +import { ReactComponent as CloseIcon } from 'src/styling/icons/action/close/zodiac.svg' import { ReactComponent as AuthorizeReversedIcon } from 'src/styling/icons/button/authorize/white.svg' import { ReactComponent as AuthorizeIcon } from 'src/styling/icons/button/authorize/zodiac.svg' import { ReactComponent as BlockReversedIcon } from 'src/styling/icons/button/block/white.svg' @@ -280,9 +289,10 @@ const GET_ACTIVE_CUSTOM_REQUESTS = gql` const CustomerProfile = memo(() => { const history = useHistory() + const [retrieve, setRetrieve] = useState(false) const [showCompliance, setShowCompliance] = useState(false) const [wizard, setWizard] = useState(false) - const [error] = useState(null) + const [error, setError] = useState(null) const [clickedItem, setClickedItem] = useState('overview') const { id: customerId } = useParams() @@ -323,7 +333,11 @@ const CustomerProfile = memo(() => { }) const [setCustomer] = useMutation(SET_CUSTOMER, { - onCompleted: () => getCustomer() + onCompleted: () => { + getCustomer() + setRetrieve(false) + }, + onError: error => setError(error) }) const [authorizeCustomRequest] = useMutation(SET_AUTHORIZED_REQUEST, { @@ -631,7 +645,20 @@ const CustomerProfile = memo(() => { updateCustomRequest={setCustomerCustomInfoRequest} authorizeCustomRequest={authorizeCustomRequest} updateCustomEntry={updateCustomEntry} - retrieveAdditionalData={retrieveAdditionalData}> + setRetrieve={setRetrieve} + retrieveAdditionalDataDialog={ + { + setError(null) + setRetrieve(false) + }} + onConfirmed={() => { + setError(null) + retrieveAdditionalData() + }} + error={error} + open={retrieve}> + }> )} {isNotes && ( @@ -665,4 +692,64 @@ const CustomerProfile = memo(() => { ) }) +const RetrieveDataDialog = ({ + onConfirmed, + onDismissed, + open, + error, + props +}) => { + const classes = useStyles() + + return ( + +
+ onDismissed(false)}> + + +
+

{'Retrieve API data from Twilio'}

+ + {`With this action you'll be using Twilio's API to retrieve additional + data from this user. This includes name and address, if available.\n`} + {` There is a small cost from Twilio for each retrieval. Would you like + to proceed?`} + + {error && ( + + Failed to save + + )} + + + + +
+ ) +} + export default CustomerProfile diff --git a/new-lamassu-admin/src/pages/Customers/CustomerProfile.styles.js b/new-lamassu-admin/src/pages/Customers/CustomerProfile.styles.js index a486abee..cd16fb0c 100644 --- a/new-lamassu-admin/src/pages/Customers/CustomerProfile.styles.js +++ b/new-lamassu-admin/src/pages/Customers/CustomerProfile.styles.js @@ -1,4 +1,4 @@ -import { comet, subheaderColor } from 'src/styling/variables' +import { comet, subheaderColor, spacer } from 'src/styling/variables' export default { labelLink: { @@ -52,5 +52,29 @@ export default { backgroundColor: subheaderColor, borderRadius: 8, padding: [[0, 5]] + }, + closeButton: { + display: 'flex', + padding: [[spacer * 2, spacer * 2, 0, spacer * 2]], + paddingRight: spacer * 1.5, + justifyContent: 'end' + }, + dialogTitle: { + margin: [[0, spacer * 2, spacer, spacer * 4 + spacer]] + }, + dialogContent: { + width: 615, + marginLeft: 16 + }, + dialogActions: { + padding: spacer * 4, + paddingTop: spacer * 2 + }, + cancelButton: { + marginRight: 8, + padding: 0 + }, + errorMessage: { + marginLeft: 38 } }