eagle-id
Version:
A React based component to perform identity verification
532 lines (483 loc) • 22.1 kB
JavaScript
import React, { Component } from 'react';
import { SnackbarProvider } from 'notistack';
import { defaultConfig, defaultStyles } from './config';
import Controller from './Controller.jsx';
class EagleId extends Component {
constructor(props) {
super(props)
this.state = {
config: defaultConfig,
styles: defaultStyles,
}
}
componentDidMount() {
if ('config' in this.props) {
this.configureLayout()
}
if ('styles' in this.props) {
this.configureStyle()
}
}
configureLayout = () => {
let baseUrl = ""
if ('baseUrl' in this.props.config &&
this.props.config.baseUrl !== undefined) {
baseUrl = this.props.config.baseUrl
} else {
baseUrl = defaultConfig.baseUrl
}
let apiSecret = ""
if ('apiSecret' in this.props.config &&
this.props.config.apiSecret !== undefined) {
apiSecret = this.props.config.apiSecret
} else {
apiSecret = defaultConfig.apiSecret
}
let title = ""
if ('title' in this.props.config &&
this.props.config.title !== undefined) {
title = this.props.config.title
} else {
title = defaultConfig.title
}
let showPrivacy = ""
if ('privacy' in this.props.config &&
'show' in this.props.config.ui &&
this.props.config.privacy.show !== undefined) {
showPrivacy = this.props.config.privacy.show
} else {
showPrivacy = defaultConfig.privacy.show
}
let privacyNotice = ""
if ('privacy' in this.props.config &&
'notice' in this.props.config.ui &&
this.props.config.privacy.notice !== undefined) {
privacyNotice = this.props.config.privacy.notice
} else {
privacyNotice = defaultConfig.privacy.notice
}
let documentTitle = ""
if ('ui' in this.props.config &&
'documentTitle' in this.props.config.ui &&
this.props.config.ui.documentTitle !== undefined) {
documentTitle = this.props.config.ui.documentTitle
} else {
documentTitle = defaultConfig.ui.documentTitle
}
let documentSubTitle = ""
if ('ui' in this.props.config &&
'documentSubTitle' in this.props.config.ui &&
this.props.config.ui.documentSubTitle !== undefined) {
documentSubTitle = this.props.config.ui.documentSubTitle
} else {
documentSubTitle = defaultConfig.ui.documentSubTitle
}
let imageFormat = ""
if ('camera' in this.props.config &&
'imageFormat' in this.props.config.camera &&
this.props.config.camera.imageFormat !== undefined) {
imageFormat = this.props.config.camera.imageFormat
} else {
imageFormat = defaultConfig.camera.imageFormat
}
let scanLabelIdFront = ""
if ('camera' in this.props.config &&
'ui' in this.props.config.camera &&
'idFront' in this.props.config.camera.ui &&
'scanLabel' in this.props.config.camera.ui.idFront &&
this.props.config.camera.ui.idFront.scanLabel !== undefined) {
scanLabelIdFront = this.props.config.camera.ui.idFront.scanLabel
} else {
scanLabelIdFront = defaultConfig.camera.ui.idFront.scanLabel
}
let infoLabelIdFront = ""
if ('camera' in this.props.config &&
'ui' in this.props.config.camera &&
'idFront' in this.props.config.camera.ui &&
'infoLabel' in this.props.config.camera.ui.idFront &&
this.props.config.camera.ui.idFront.infoLabel !== undefined) {
infoLabelIdFront = this.props.config.camera.ui.idFront.infoLabel
} else {
infoLabelIdFront = defaultConfig.camera.ui.idFront.infoLabel
}
let scanNumberIdFront = ""
if ('camera' in this.props.config &&
'ui' in this.props.config.camera &&
'idFront' in this.props.config.camera.ui &&
'scanNumber' in this.props.config.camera.ui.idFront &&
this.props.config.camera.ui.idFront.scanNumber !== undefined) {
scanNumberIdFront = this.props.config.camera.ui.idFront.scanNumber
} else {
scanNumberIdFront = defaultConfig.camera.ui.idFront.scanNumber
}
let scanLabelIdBack = ""
if ('camera' in this.props.config &&
'ui' in this.props.config.camera &&
'idBack' in this.props.config.camera.ui &&
'scanLabel' in this.props.config.camera.ui.idBack &&
this.props.config.camera.ui.idBack.scanLabel !== undefined) {
scanLabelIdBack = this.props.config.camera.ui.idBack.scanLabel
} else {
scanLabelIdBack = defaultConfig.camera.ui.idBack.scanLabel
}
let infoLabelIdBack = ""
if ('camera' in this.props.config &&
'ui' in this.props.config.camera &&
'idBack' in this.props.config.camera.ui &&
'infoLabel' in this.props.config.camera.ui.idBack &&
this.props.config.camera.ui.idBack.infoLabel !== undefined) {
infoLabelIdBack = this.props.config.camera.ui.idBack.infoLabel
} else {
infoLabelIdBack = defaultConfig.camera.ui.idBack.infoLabel
}
let scanNumberIdBack = ""
if ('camera' in this.props.config &&
'ui' in this.props.config.camera &&
'idBack' in this.props.config.camera.ui &&
'scanNumber' in this.props.config.camera.ui.idBack &&
this.props.config.camera.ui.idBack.scanNumber !== undefined) {
scanNumberIdBack = this.props.config.camera.ui.idBack.scanNumber
} else {
scanNumberIdBack = defaultConfig.camera.ui.idBack.scanNumber
}
let scanLabelVisa = ""
if ('camera' in this.props.config &&
'ui' in this.props.config.camera &&
'visa' in this.props.config.camera.ui &&
'scanLabel' in this.props.config.camera.ui.visa &&
this.props.config.camera.ui.visa.scanLabel !== undefined) {
scanLabelVisa = this.props.config.camera.ui.visa.scanLabel
} else {
scanLabelVisa = defaultConfig.camera.ui.visa.scanLabel
}
let infoLabelVisa = ""
if ('camera' in this.props.config &&
'ui' in this.props.config.camera &&
'visa' in this.props.config.camera.ui &&
'infoLabel' in this.props.config.camera.ui.visa &&
this.props.config.camera.ui.visa.infoLabel !== undefined) {
infoLabelVisa = this.props.config.camera.ui.visa.infoLabel
} else {
infoLabelVisa = defaultConfig.camera.ui.visa.infoLabel
}
let scanNumberVisa = ""
if ('camera' in this.props.config &&
'ui' in this.props.config.camera &&
'visa' in this.props.config.camera.ui &&
'scanNumber' in this.props.config.camera.ui.visa &&
this.props.config.camera.ui.visa.scanNumber !== undefined) {
scanNumberVisa = this.props.config.camera.ui.visa.scanNumber
} else {
scanNumberVisa = defaultConfig.camera.ui.visa.scanNumber
}
let scanLabelPassport = ""
if ('camera' in this.props.config &&
'ui' in this.props.config.camera &&
'passport' in this.props.config.camera.ui &&
'scanLabel' in this.props.config.camera.ui.passport &&
this.props.config.camera.ui.passport.scanLabel !== undefined) {
scanLabelPassport = this.props.config.camera.ui.passport.scanLabel
} else {
scanLabelPassport = defaultConfig.camera.ui.passport.scanLabel
}
let infoLabelPassport = ""
if ('camera' in this.props.config &&
'ui' in this.props.config.camera &&
'passport' in this.props.config.camera.ui &&
'infoLabel' in this.props.config.camera.ui.passport &&
this.props.config.camera.ui.passport.infoLabel !== undefined) {
infoLabelPassport = this.props.config.camera.ui.passport.infoLabel
} else {
infoLabelPassport = defaultConfig.camera.ui.passport.infoLabel
}
let scanNumberPassport = ""
if ('camera' in this.props.config &&
'ui' in this.props.config.camera &&
'passport' in this.props.config.camera.ui &&
'scanNumber' in this.props.config.camera.ui.passport &&
this.props.config.camera.ui.passport.scanNumber !== undefined) {
scanNumberPassport = this.props.config.camera.ui.passport.scanNumber
} else {
scanNumberPassport = defaultConfig.camera.ui.passport.scanNumber
}
let scanLabelOther = ""
if ('camera' in this.props.config &&
'ui' in this.props.config.camera &&
'other' in this.props.config.camera.ui &&
'scanLabel' in this.props.config.camera.ui.other &&
this.props.config.camera.ui.other.scanLabel !== undefined) {
scanLabelOther = this.props.config.camera.ui.other.scanLabel
} else {
scanLabelOther = defaultConfig.camera.ui.other.scanLabel
}
let infoLabelOther = ""
if ('camera' in this.props.config &&
'ui' in this.props.config.camera &&
'other' in this.props.config.camera.ui &&
'infoLabel' in this.props.config.camera.ui.other &&
this.props.config.camera.ui.other.infoLabel !== undefined) {
infoLabelOther = this.props.config.camera.ui.other.infoLabel
} else {
infoLabelOther = defaultConfig.camera.ui.other.infoLabel
}
let scanNumberOther = ""
if ('camera' in this.props.config &&
'ui' in this.props.config.camera &&
'other' in this.props.config.camera.ui &&
'scanNumber' in this.props.config.camera.ui.other &&
this.props.config.camera.ui.other.scanNumber !== undefined) {
scanNumberOther = this.props.config.camera.ui.other.scanNumber
} else {
scanNumberOther = defaultConfig.camera.ui.other.scanNumber
}
let scanLabelSelfie = ""
if ('camera' in this.props.config &&
'ui' in this.props.config.camera &&
'selfie' in this.props.config.camera.ui &&
'scanLabel' in this.props.config.camera.ui.selfie &&
this.props.config.camera.ui.selfie.scanLabel !== undefined) {
scanLabelSelfie = this.props.config.camera.ui.selfie.scanLabel
} else {
scanLabelSelfie = defaultConfig.camera.ui.selfie.scanLabel
}
let infoLabelSelfie = ""
if ('camera' in this.props.config &&
'ui' in this.props.config.camera &&
'selfie' in this.props.config.camera.ui &&
'infoLabel' in this.props.config.camera.ui.selfie &&
this.props.config.camera.ui.selfie.infoLabel !== undefined) {
infoLabelSelfie = this.props.config.camera.ui.selfie.infoLabel
} else {
infoLabelSelfie = defaultConfig.camera.ui.selfie.infoLabel
}
let scanNumberSelfie = ""
if ('camera' in this.props.config &&
'ui' in this.props.config.camera &&
'selfie' in this.props.config.camera.ui &&
'scanNumber' in this.props.config.camera.ui.selfie &&
this.props.config.camera.ui.selfie.scanNumber !== undefined) {
scanNumberSelfie = this.props.config.camera.ui.selfie.scanNumber
} else {
scanNumberSelfie = defaultConfig.camera.ui.selfie.scanNumber
}
let logo = ""
if ('resources' in this.props.config &&
'images' in this.props.config.resources &&
'logo' in this.props.config.resources &&
this.props.config.resources.images.logo !== undefined) {
logo = this.props.config.resources.images.logo
} else {
logo = defaultConfig.resources.images.logo
}
let logoTitle = ""
if ('resources' in this.props.config &&
'images' in this.props.config.resources &&
'logoTitle' in this.props.config.resources &&
this.props.config.resources.images.logoTitle !== undefined) {
logoTitle = this.props.config.resources.images.logoTitle
} else {
logoTitle = defaultConfig.resources.images.logoTitle
}
let privacy = ""
if ('resources' in this.props.config &&
'images' in this.props.config.resources &&
'privacy' in this.props.config.resources &&
this.props.config.resources.images.privacy !== undefined) {
privacy = this.props.config.resources.images.privacy
} else {
privacy = defaultConfig.resources.images.privacy
}
let icon_passport = ""
if ('resources' in this.props.config &&
'images' in this.props.config.resources &&
'icon_passport' in this.props.config.resources &&
this.props.config.resources.images.icon_passport !== undefined) {
icon_passport = this.props.config.resources.images.icon_passport
} else {
icon_passport = defaultConfig.resources.images.icon_passport
}
let icon_id = ""
if ('resources' in this.props.config &&
'images' in this.props.config.resources &&
'icon_id' in this.props.config.resources &&
this.props.config.resources.images.icon_id !== undefined) {
icon_id = this.props.config.resources.images.icon_id
} else {
icon_id = defaultConfig.resources.images.icon_id
}
let icon_other = ""
if ('resources' in this.props.config &&
'images' in this.props.config.resources &&
'icon_other' in this.props.config.resources &&
this.props.config.resources.images.icon_other !== undefined) {
icon_other = this.props.config.resources.images.icon_other
} else {
icon_other = defaultConfig.resources.images.icon_other
}
let icon_camera = ""
if ('resources' in this.props.config &&
'images' in this.props.config.resources &&
'icon_camera' in this.props.config.resources &&
this.props.config.resources.images.icon_camera !== undefined) {
icon_camera = this.props.config.resources.images.icon_camera
} else {
icon_camera = defaultConfig.resources.images.icon_camera
}
let image_selfie = ""
if ('resources' in this.props.config &&
'images' in this.props.config.resources &&
'image_selfie' in this.props.config.resources &&
this.props.config.resources.images.image_selfie !== undefined) {
image_selfie = this.props.config.resources.images.image_selfie
} else {
image_selfie = defaultConfig.resources.images.image_selfie
}
let overlay_document_web = ""
if ('resources' in this.props.config &&
'images' in this.props.config.resources &&
'overlay_document_web' in this.props.config.resources &&
this.props.config.resources.images.overlay_document_web !== undefined) {
overlay_document_web = this.props.config.resources.images.overlay_document_web
} else {
overlay_document_web = defaultConfig.resources.images.overlay_document_web
}
let overlay_document_mobile = ""
if ('resources' in this.props.config &&
'images' in this.props.config.resources &&
'overlay_document_mobile' in this.props.config.resources &&
this.props.config.resources.images.overlay_document_mobile !== undefined) {
overlay_document_mobile = this.props.config.resources.images.overlay_document_mobile
} else {
overlay_document_mobile = defaultConfig.resources.images.overlay_document_mobile
}
let overlay_selfie_web = ""
if ('resources' in this.props.config &&
'images' in this.props.config.resources &&
'overlay_selfie_web' in this.props.config.resources &&
this.props.config.resources.images.overlay_selfie_web !== undefined) {
overlay_selfie_web = this.props.config.resources.images.overlay_selfie_web
} else {
overlay_selfie_web = defaultConfig.resources.images.overlay_selfie_web
}
let overlay_selfie_mobile = ""
if ('resources' in this.props.config &&
'images' in this.props.config.resources &&
'overlay_selfie_mobile' in this.props.config.resources &&
this.props.config.resources.images.overlay_selfie_mobile !== undefined) {
overlay_selfie_mobile = this.props.config.resources.images.overlay_selfie_mobile
} else {
overlay_selfie_mobile = defaultConfig.resources.images.overlay_selfie_mobile
}
this.setState({
config: {
"baseUrl": baseUrl,
"apiSecret": apiSecret,
"privacy": {
"show": showPrivacy,
"notice": privacyNotice,
},
"title": title,
"ui": {
"documentTitle": documentTitle,
"documentSubTitle": documentSubTitle,
},
"camera": {
"imageFormat": imageFormat,
"ui": {
"idFront": {
"scanLabel": scanLabelIdFront,
"infoLabel": infoLabelIdFront,
"scanNumber": scanNumberIdFront
},
"idBack": {
"scanLabel": scanLabelIdBack,
"infoLabel": infoLabelIdBack,
"scanNumber": scanNumberIdBack
},
"visa": {
"scanLabel": scanLabelVisa,
"infoLabel": infoLabelVisa,
"scanNumber": scanNumberVisa
},
"passport": {
"scanLabel": scanLabelPassport,
"infoLabel": infoLabelPassport,
"scanNumber": scanNumberPassport
},
"other": {
"scanLabel": scanLabelOther,
"infoLabel": infoLabelOther,
"scanNumber": scanNumberOther
},
"selfie": {
"scanLabel": scanLabelSelfie,
"infoLabel": infoLabelSelfie,
"scanNumber": scanNumberSelfie
},
},
},
"resources": {
"images": {
"logo": logo,
"logoTitle": logoTitle,
"privacy": privacy,
"icon_passport": icon_passport,
"icon_id": icon_id,
"icon_other": icon_other,
"icon_camera": icon_camera,
"image_selfie": image_selfie,
"overlay_document_web": overlay_document_web,
"overlay_document_mobile": overlay_document_mobile,
"overlay_selfie_web": overlay_selfie_web,
"overlay_selfie_mobile": overlay_selfie_mobile,
},
"animations": {
"passport": "./resources/animations/scan_passport.json",
"idfront": "./resources/animations/scan_document_front.json",
"idback": "./resources/animations/scan_document_back.json",
"status_good": "./resources/animations/verify_status_good.json",
"loading": "./resources/animations/loading_coffee.json",
}
}
}
}, this.forceUpdate())
}
configureStyle = () => {
var styles = Object.assign({}, this.state.styles)
var color = ""
if ('color' in this.props.styles &&
this.props.styles.color !== undefined) {
color = this.props.styles.color
Object.entries(styles).forEach(([key, value]) => {
Object.entries(value).forEach(([subkey, value]) => {
if((subkey === "color" ||
subkey === "borderColor" ||
subkey === "backgroundColor") &&
value === "#05294B") {
try {
styles[key][subkey] = color
} catch(error) {
console.log(error)
}
}
})
})
}
this.setState({
styles: styles
}, this.forceUpdate())
}
render () {
return (
<div id="eagle-id">
<SnackbarProvider maxSnack={3}>
<Controller
config={this.state.config}
styles={this.state.styles}
/>
</SnackbarProvider>
</div>
)
}
}
export default EagleId;