lamassu/lamassu-server
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: change customer screen transaction list part to the new design

Browse source 
feat: created the compliance details component (no data for now)

fix: added missing properties into the gql schema and the compliance
details component

feat: added another chip type for a neutral situation

style: change the property card style for the v1 specs

fix: added front facing camera override to schema and components

feat: added authorized override (status) column to the customers list
table

fix: moved name to the front of the phone on the customers list table

fix: added sanctions description text on it's card

fix: added id icon to the right of the customer name

feat: created subpage button component and use it in the customer
profile

feat: created an image popper component and use it in the customer
compliance page

fix: added varying sizes to the customer details and id data cards fields

refactor: simplify the compliance subpage code
This commit is contained in:
Liordino Neto 2020-10-16 18:11:45 -03:00 • committed by Josh Harvey
parent 8ff0a7f79b
commit f53a934092
28 changed files with 744 additions and 260 deletions
Download patch file Download diff file Expand all files Collapse all files

93
new-lamassu-admin/src/pages/Customers/components/IdDataCard.js
View file

@ -1,4 +1,4 @@
import { makeStyles, Box } from '@material-ui/core'
import { Box } from '@material-ui/core'
import moment from 'moment'
import * as R from 'ramda'
import React, { memo } from 'react'
@ -12,65 +12,64 @@ import { ifNotNull } from 'src/utils/nullCheck'
import Field from './Field'
const useStyles = makeStyles({
idDataCard: {
width: 550,
height: 240
},
column: {
marginBottom: 7
}
})
const IdDataCard = memo(({ customerData, updateCustomer }) => {
const classes = useStyles()
const idData = R.path(['idCardData'])(customerData)
const name = R.path(['firstName'])(idData) ?? ''
const lastName = R.path(['lastName'])(idData) ?? ''
const gender = R.path(['gender'])(idData)
const idNumber = R.path(['documentNumber'])(idData)
const country = R.path(['country'])(idData)
const rawExpirationDate = R.path(['expirationDate'])(idData)
const expirationDate = ifNotNull(
rawExpirationDate,
moment.utc(rawExpirationDate).format('YYYY-MM-D')
)
const rawDob = R.path(['dateOfBirth'])(idData)
const age = ifNotNull(
rawDob,
moment.utc().diff(moment.utc(rawDob).format('YYYY-MM-D'), 'years')
)
const elements = [
{
header: 'Name',
display: `${R.path(['firstName'])(idData)} ${R.path(['lastName'])(
idData
)}`,
size: 160
},
{
header: 'ID number',
display: R.path(['documentNumber'])(idData),
size: 190
},
{
header: 'Age',
display: ifNotNull(
rawDob,
moment.utc().diff(moment.utc(rawDob).format('YYYY-MM-D'), 'years')
),
size: 70
},
{
header: 'Gender',
display: R.path(['gender'])(idData),
size: 100
},
{
header: 'Country',
display: R.path(['country'])(idData),
size: 140
},
{
header: 'Expiration Date',
display: ifNotNull(
rawExpirationDate,
moment.utc(rawExpirationDate).format('YYYY-MM-D')
)
}
]
return (
<PropertyCard
className={classes.idDataCard}
title={'ID data'}
state={R.path(['idCardDataOverride'])(customerData)}
authorize={() =>
updateCustomer({ idCardDataOverride: OVERRIDE_AUTHORIZED })
}
reject={() => updateCustomer({ idCardDataOverride: OVERRIDE_REJECTED })}>
<div>
<Box
display="flex"
alignItems="center"
justifyContent="space-between"
mb={1}>
<Field label={'Name'} display={`${name} ${lastName}`} />
<Field label={'ID number'} display={idNumber} />
<Field label={'Age'} display={age} />
</Box>
<Box display="flex" alignItems="center" justifyContent="space-between">
<Field label={'Gender'} display={gender} />
<Field label={'Country'} display={country} />
<Field label={'Expiration date'} display={expirationDate} />
</Box>
</div>
<Box display="flex" alignItems="center">
{elements.map(({ header, display, size }, idx) => (
<Field key={idx} label={header} display={display} size={size} />
))}
</Box>
</PropertyCard>
)
})