lamassu-server/new-lamassu-admin/src/pages/Customers/components/IdDataCard.js
Liordino Neto f53a934092 feat: change customer screen transaction list part to the new design
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
2020-10-26 16:04:15 +00:00

77 lines
1.9 KiB
JavaScript

import { Box } from '@material-ui/core'
import moment from 'moment'
import * as R from 'ramda'
import React, { memo } from 'react'
import {
PropertyCard,
OVERRIDE_AUTHORIZED,
OVERRIDE_REJECTED
} from 'src/pages/Customers/components/propertyCard'
import { ifNotNull } from 'src/utils/nullCheck'
import Field from './Field'
const IdDataCard = memo(({ customerData, updateCustomer }) => {
const idData = R.path(['idCardData'])(customerData)
const rawExpirationDate = R.path(['expirationDate'])(idData)
const rawDob = R.path(['dateOfBirth'])(idData)
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
title={'ID data'}
state={R.path(['idCardDataOverride'])(customerData)}
authorize={() =>
updateCustomer({ idCardDataOverride: OVERRIDE_AUTHORIZED })
}
reject={() => updateCustomer({ idCardDataOverride: OVERRIDE_REJECTED })}>
<Box display="flex" alignItems="center">
{elements.map(({ header, display, size }, idx) => (
<Field key={idx} label={header} display={display} size={size} />
))}
</Box>
</PropertyCard>
)
})
export default IdDataCard