Compare commits
70 Commits
open-relea
...
astankiewi
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
ba5456b03f | ||
|
|
4d8151a1d0 | ||
|
|
c39fd332b6 | ||
|
|
04d515f554 | ||
|
|
f425e9b94f | ||
|
|
7ec147fe6f | ||
|
|
7a8ae85b72 | ||
|
|
0f8f5a1e9a | ||
|
|
757a9ac033 | ||
|
|
9efc8d1290 | ||
|
|
5f53270148 | ||
|
|
9716495951 | ||
|
|
f9b29948e7 | ||
|
|
bededb3912 | ||
|
|
bb6390f9ae | ||
|
|
d2300d2dfd | ||
|
|
a501407907 | ||
|
|
88e63cd390 | ||
|
|
eaebe6980b | ||
|
|
d6efba63ca | ||
|
|
257e425fd9 | ||
|
|
02e3364874 | ||
|
|
9ae74708fb | ||
|
|
e946e377c6 | ||
|
|
5dbe649b2c | ||
|
|
2792902975 | ||
|
|
6f643070ea | ||
|
|
ce946f56b2 | ||
|
|
de1e67f68d | ||
|
|
79001bccd8 | ||
|
|
963884cc4c | ||
|
|
e43c1bcc9e | ||
|
|
32cc2c7835 | ||
|
|
5c39c279f3 | ||
|
|
12bca9b771 | ||
|
|
5e10c2bc18 | ||
|
|
f2fe22b8f7 | ||
|
|
d5601a21fd | ||
|
|
f3bd7a8589 | ||
|
|
7643bbd6ba | ||
|
|
fd1044b531 | ||
|
|
f25e5db422 | ||
|
|
0d569a060b | ||
|
|
350016cbe0 | ||
|
|
1619dade50 | ||
|
|
dafc34f535 | ||
|
|
9bbab2620c | ||
|
|
81bef65cc2 | ||
|
|
a18daecf8a | ||
|
|
449e4c0253 | ||
|
|
a66ba187ae | ||
|
|
2d710f7060 | ||
|
|
e109e5018e | ||
|
|
1444831833 | ||
|
|
4b4f29ae19 | ||
|
|
cbc4123e78 | ||
|
|
2c896f77d4 | ||
|
|
112ddf80e6 | ||
|
|
6f2a69acc1 | ||
|
|
d2c83b82f7 | ||
|
|
03501a8125 | ||
|
|
6e17214476 | ||
|
|
2c6cec7f8c | ||
|
|
f76797cade | ||
|
|
59325bd412 | ||
|
|
65a6bc5002 | ||
|
|
eff28d8b47 | ||
|
|
dfb13c4286 | ||
|
|
aada46f6eb | ||
|
|
9e967ba1ea |
2
.env
2
.env
@@ -25,3 +25,5 @@ SITE_NAME=''
|
||||
STUDIO_BASE_URL=''
|
||||
SUPPORT_URL=''
|
||||
USER_INFO_COOKIE_NAME=''
|
||||
ENABLE_COPPA_COMPLIANCE=''
|
||||
MARKETING_EMAILS_OPT_IN=''
|
||||
|
||||
@@ -26,3 +26,5 @@ SITE_NAME=localhost
|
||||
STUDIO_BASE_URL=''
|
||||
SUPPORT_URL='http://localhost:18000/support'
|
||||
USER_INFO_COOKIE_NAME='edx-user-info'
|
||||
ENABLE_COPPA_COMPLIANCE=''
|
||||
MARKETING_EMAILS_OPT_IN=''
|
||||
|
||||
@@ -25,3 +25,5 @@ SITE_NAME=localhost
|
||||
STUDIO_BASE_URL=''
|
||||
SUPPORT_URL='http://localhost:18000/support'
|
||||
USER_INFO_COOKIE_NAME='edx-user-info'
|
||||
ENABLE_COPPA_COMPLIANCE=''
|
||||
MARKETING_EMAILS_OPT_IN=''
|
||||
|
||||
1
.github/CODEOWNERS
vendored
1
.github/CODEOWNERS
vendored
@@ -1 +0,0 @@
|
||||
* @edx/community-engineering
|
||||
19
.github/workflows/add-depr-ticket-to-depr-board.yml
vendored
Normal file
19
.github/workflows/add-depr-ticket-to-depr-board.yml
vendored
Normal file
@@ -0,0 +1,19 @@
|
||||
# Run the workflow that adds new tickets that are either:
|
||||
# - labelled "DEPR"
|
||||
# - title starts with "[DEPR]"
|
||||
# - body starts with "Proposal Date" (this is the first template field)
|
||||
# to the org-wide DEPR project board
|
||||
|
||||
name: Add newly created DEPR issues to the DEPR project board
|
||||
|
||||
on:
|
||||
issues:
|
||||
types: [opened]
|
||||
|
||||
jobs:
|
||||
routeissue:
|
||||
uses: openedx/.github/.github/workflows/add-depr-ticket-to-depr-board.yml@master
|
||||
secrets:
|
||||
GITHUB_APP_ID: ${{ secrets.GRAPHQL_AUTH_APP_ID }}
|
||||
GITHUB_APP_PRIVATE_KEY: ${{ secrets.GRAPHQL_AUTH_APP_PEM }}
|
||||
SLACK_BOT_TOKEN: ${{ secrets.SLACK_ISSUE_BOT_TOKEN }}
|
||||
13
.github/workflows/ci.yml
vendored
13
.github/workflows/ci.yml
vendored
@@ -1,4 +1,3 @@
|
||||
---
|
||||
name: ci
|
||||
on:
|
||||
push:
|
||||
@@ -6,23 +5,23 @@ on:
|
||||
- master
|
||||
pull_request:
|
||||
jobs:
|
||||
build:
|
||||
tests:
|
||||
runs-on: ubuntu-latest
|
||||
strategy:
|
||||
matrix:
|
||||
node-version:
|
||||
- 12
|
||||
node: [16]
|
||||
npm: [8.5.0]
|
||||
npm-test:
|
||||
- i18n_extract
|
||||
- is-es5
|
||||
- lint
|
||||
- is-es6
|
||||
- test
|
||||
steps:
|
||||
- uses: actions/checkout@v2
|
||||
- uses: actions/setup-node@v2
|
||||
with:
|
||||
node-version: ${{ matrix.node-version }}
|
||||
- run: npm install -g npm@6
|
||||
node-version: ${{ matrix.node }}
|
||||
- run: npm install -g npm@${{ matrix.npm }}
|
||||
- run: make requirements
|
||||
- run: make test NPM_TESTS=build
|
||||
- run: make test NPM_TESTS=${{ matrix.npm-test }}
|
||||
|
||||
14
.github/workflows/lockfileversion-check.yml
vendored
Normal file
14
.github/workflows/lockfileversion-check.yml
vendored
Normal file
@@ -0,0 +1,14 @@
|
||||
#check package-lock file version
|
||||
|
||||
name: Lockfile Version check
|
||||
|
||||
on:
|
||||
push:
|
||||
branches:
|
||||
- master
|
||||
pull_request:
|
||||
|
||||
jobs:
|
||||
version-check:
|
||||
uses: edx/.github/.github/workflows/lockfileversion-check.yml@master
|
||||
|
||||
@@ -1,8 +1,9 @@
|
||||
[main]
|
||||
host = https://www.transifex.com
|
||||
|
||||
[edx-platform.frontend-app-account]
|
||||
[o:open-edx:p:edx-platform:r:frontend-app-account]
|
||||
file_filter = src/i18n/messages/<lang>.json
|
||||
source_file = src/i18n/transifex_input.json
|
||||
source_lang = en
|
||||
type = KEYVALUEJSON
|
||||
type = KEYVALUEJSON
|
||||
|
||||
|
||||
11
Makefile
11
Makefile
@@ -1,3 +1,4 @@
|
||||
export TRANSIFEX_RESOURCE = frontend-app-account
|
||||
transifex_resource = frontend-app-account
|
||||
transifex_langs = "ar,fr,es_419,zh_CN"
|
||||
|
||||
@@ -10,7 +11,7 @@ tx_url2 = https://www.transifex.com/api/2/project/edx-platform/resource/$(transi
|
||||
# This directory must match .babelrc .
|
||||
transifex_temp = ./temp/babel-plugin-react-intl
|
||||
|
||||
NPM_TESTS=build i18n_extract lint test is-es5
|
||||
NPM_TESTS=build i18n_extract lint test is-es6
|
||||
|
||||
.PHONY: test
|
||||
test: $(addprefix test.npm.,$(NPM_TESTS)) ## validate ci suite
|
||||
@@ -45,15 +46,15 @@ push_translations:
|
||||
# Pushing strings to Transifex...
|
||||
tx push -s
|
||||
# Fetching hashes from Transifex...
|
||||
./node_modules/reactifex/bash_scripts/get_hashed_strings.sh $(tx_url1)
|
||||
./node_modules/@edx/reactifex/bash_scripts/get_hashed_strings_v3.sh
|
||||
# Writing out comments to file...
|
||||
$(transifex_utils) $(transifex_temp) --comments
|
||||
$(transifex_utils) $(transifex_temp) --comments --v3-scripts-path
|
||||
# Pushing comments to Transifex...
|
||||
./node_modules/reactifex/bash_scripts/put_comments.sh $(tx_url2)
|
||||
./node_modules/@edx/reactifex/bash_scripts/put_comments_v3.sh
|
||||
|
||||
# Pulls translations from Transifex.
|
||||
pull_translations:
|
||||
tx pull -f --mode reviewed --language=$(transifex_langs)
|
||||
tx pull -f --mode reviewed --languages=$(transifex_langs)
|
||||
|
||||
# This target is used by Travis.
|
||||
validate-no-uncommitted-package-lock-changes:
|
||||
|
||||
34305
package-lock.json
generated
34305
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
34
package.json
34
package.json
@@ -11,8 +11,8 @@
|
||||
"scripts": {
|
||||
"build": "fedx-scripts webpack",
|
||||
"i18n_extract": "BABEL_ENV=i18n fedx-scripts babel src --quiet > /dev/null",
|
||||
"is-es5": "es-check es5 ./dist/*.js",
|
||||
"lint": "fedx-scripts eslint --ext .js --ext .jsx .",
|
||||
"is-es6": "es-check es6 ./dist/*.js",
|
||||
"snapshot": "fedx-scripts jest --updateSnapshot",
|
||||
"start": "fedx-scripts webpack-dev-server --progress",
|
||||
"test": "fedx-scripts jest --coverage --passWithNoTests"
|
||||
@@ -25,31 +25,31 @@
|
||||
"access": "public"
|
||||
},
|
||||
"browserslist": [
|
||||
"last 2 versions",
|
||||
"ie 11"
|
||||
"extends @edx/browserslist-config"
|
||||
],
|
||||
"dependencies": {
|
||||
"@edx/brand": "npm:@edx/brand-openedx@1.1.0",
|
||||
"@edx/frontend-component-footer": "10.1.6",
|
||||
"@edx/frontend-component-header": "2.3.0",
|
||||
"@edx/frontend-platform": "1.12.7",
|
||||
"@edx/paragon": "16.1.0",
|
||||
"@edx/frontend-component-footer": "10.2.0",
|
||||
"@edx/frontend-component-header": "2.4.5",
|
||||
"@edx/frontend-platform": "1.15.1",
|
||||
"@edx/paragon": "19.20.0",
|
||||
"@fortawesome/fontawesome-svg-core": "1.2.36",
|
||||
"@fortawesome/free-brands-svg-icons": "5.15.4",
|
||||
"@fortawesome/free-regular-svg-icons": "5.15.4",
|
||||
"@fortawesome/free-solid-svg-icons": "5.15.4",
|
||||
"@fortawesome/react-fontawesome": "0.1.15",
|
||||
"@fortawesome/react-fontawesome": "0.1.16",
|
||||
"@tensorflow-models/blazeface": "0.0.7",
|
||||
"@tensorflow/tfjs-converter": "1.7.4",
|
||||
"@tensorflow/tfjs-core": "1.7.4",
|
||||
"bowser": "2.11.0",
|
||||
"classnames": "2.3.1",
|
||||
"core-js": "3.18.2",
|
||||
"core-js": "3.19.3",
|
||||
"font-awesome": "4.7.0",
|
||||
"form-urlencoded": "4.0.1",
|
||||
"formdata-polyfill": "4.0.10",
|
||||
"history": "4.10.1",
|
||||
"jslib-html5-camera-photo": "3.1.8",
|
||||
"lodash.camelcase": "4.3.0",
|
||||
"lodash.debounce": "4.0.8",
|
||||
"lodash.findindex": "4.6.0",
|
||||
"lodash.get": "4.4.2",
|
||||
@@ -60,16 +60,16 @@
|
||||
"lodash.pickby": "4.6.0",
|
||||
"memoize-one": "5.2.1",
|
||||
"prop-types": "15.7.2",
|
||||
"qs": "6.10.1",
|
||||
"qs": "6.10.3",
|
||||
"react": "16.14.0",
|
||||
"react-dom": "16.14.0",
|
||||
"react-redux": "7.2.5",
|
||||
"react-redux": "7.2.6",
|
||||
"react-router": "5.2.1",
|
||||
"react-router-dom": "5.3.0",
|
||||
"react-router-hash-link": "1.2.2",
|
||||
"react-scrollspy": "3.4.3",
|
||||
"react-transition-group": "4.4.2",
|
||||
"redux": "4.1.1",
|
||||
"redux": "4.1.2",
|
||||
"redux-devtools-extension": "2.13.9",
|
||||
"redux-logger": "3.0.6",
|
||||
"redux-saga": "1.1.3",
|
||||
@@ -79,13 +79,15 @@
|
||||
"universal-cookie": "4.0.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@edx/frontend-build": "8.0.4",
|
||||
"@testing-library/jest-dom": "5.14.1",
|
||||
"@testing-library/react": "12.1.2",
|
||||
"@edx/browserslist-config": "1.0.0",
|
||||
"@edx/frontend-build": "9.1.1",
|
||||
"@edx/reactifex": "^1.0.3",
|
||||
"@testing-library/jest-dom": "5.15.1",
|
||||
"@testing-library/react": "12.1.4",
|
||||
"codecov": "3.8.3",
|
||||
"enzyme": "3.11.0",
|
||||
"enzyme-adapter-react-16": "1.15.6",
|
||||
"es-check": "6.0.0",
|
||||
"es-check": "6.1.1",
|
||||
"react-test-renderer": "16.14.0",
|
||||
"reactifex": "1.1.1",
|
||||
"redux-mock-store": "1.5.4"
|
||||
|
||||
@@ -259,26 +259,27 @@ class AccountSettingsPage extends React.Component {
|
||||
);
|
||||
}
|
||||
|
||||
renderFullNameHelpText = (status) => {
|
||||
if (
|
||||
!this.props.verifiedNameHistory
|
||||
|| !this.props.verifiedNameEnabled
|
||||
) {
|
||||
renderFullNameHelpText = (status, proctoredExamId) => {
|
||||
if (!this.props.verifiedNameHistory) {
|
||||
return this.props.intl.formatMessage(messages['account.settings.field.full.name.help.text']);
|
||||
}
|
||||
|
||||
switch (status) {
|
||||
case 'submitted':
|
||||
if (this.props.committedValues.useVerifiedNameForCerts) {
|
||||
return this.props.intl.formatMessage(messages['account.settings.field.full.name.help.text.submitted']);
|
||||
}
|
||||
return this.props.intl.formatMessage(messages['account.settings.field.full.name.help.text.submitted.certificate']);
|
||||
default:
|
||||
if (this.props.committedValues.useVerifiedNameForCerts) {
|
||||
return this.props.intl.formatMessage(messages['account.settings.field.full.name.help.text.non.certificate']);
|
||||
}
|
||||
return this.props.intl.formatMessage(messages['account.settings.field.full.name.help.text.certificate']);
|
||||
let messageString = 'account.settings.field.full.name.help.text';
|
||||
|
||||
if (status === 'submitted') {
|
||||
messageString += '.submitted';
|
||||
if (proctoredExamId) {
|
||||
messageString += '.proctored';
|
||||
}
|
||||
} else {
|
||||
messageString += '.default';
|
||||
}
|
||||
|
||||
if (!this.props.committedValues.useVerifiedNameForCerts) {
|
||||
messageString += '.certificate';
|
||||
}
|
||||
|
||||
return this.props.intl.formatMessage(messages[messageString]);
|
||||
}
|
||||
|
||||
renderVerifiedNameSuccessMessage = (verifiedName, created) => {
|
||||
@@ -351,6 +352,7 @@ class AccountSettingsPage extends React.Component {
|
||||
status,
|
||||
profile_name: profileName,
|
||||
verified_name: verifiedName,
|
||||
proctored_exam_attempt_id: proctoredExamId,
|
||||
} = verifiedNameRecord;
|
||||
let willCertNameChange = false;
|
||||
|
||||
@@ -369,6 +371,10 @@ class AccountSettingsPage extends React.Component {
|
||||
willCertNameChange = true;
|
||||
}
|
||||
|
||||
if (proctoredExamId) {
|
||||
return null;
|
||||
}
|
||||
|
||||
switch (status) {
|
||||
case 'approved':
|
||||
return this.renderVerifiedNameSuccessMessage(verifiedName, created);
|
||||
@@ -392,21 +398,29 @@ class AccountSettingsPage extends React.Component {
|
||||
}
|
||||
}
|
||||
|
||||
renderVerifiedNameHelpText = (status) => {
|
||||
switch (status) {
|
||||
case 'approved':
|
||||
if (this.props.committedValues.useVerifiedNameForCerts) {
|
||||
return this.props.intl.formatMessage(messages['account.settings.field.name.verified.help.text.certificate']);
|
||||
}
|
||||
return this.props.intl.formatMessage(messages['account.settings.field.name.verified.help.text.verified']);
|
||||
case 'submitted':
|
||||
if (this.props.committedValues.useVerifiedNameForCerts) {
|
||||
return this.props.intl.formatMessage(messages['account.settings.field.name.verified.help.text.submitted.certificate']);
|
||||
}
|
||||
return this.props.intl.formatMessage(messages['account.settings.field.name.verified.help.text.submitted']);
|
||||
default:
|
||||
return null;
|
||||
renderVerifiedNameHelpText = (status, proctoredExamId) => {
|
||||
let messageStr = 'account.settings.field.name.verified.help.text';
|
||||
|
||||
// add additional string based on status
|
||||
if (status === 'approved') {
|
||||
messageStr += '.verified';
|
||||
} else if (status === 'submitted') {
|
||||
messageStr += '.submitted';
|
||||
} else {
|
||||
return null;
|
||||
}
|
||||
|
||||
// add additional string if verified name came from a proctored exam attempt
|
||||
if (proctoredExamId) {
|
||||
messageStr += '.proctored';
|
||||
}
|
||||
|
||||
// add additional string based on certificate name use
|
||||
if (this.props.committedValues.useVerifiedNameForCerts) {
|
||||
messageStr += '.certificate';
|
||||
}
|
||||
|
||||
return this.props.intl.formatMessage(messages[messageStr]);
|
||||
}
|
||||
|
||||
renderEmptyStaticFieldMessage() {
|
||||
@@ -471,7 +485,7 @@ class AccountSettingsPage extends React.Component {
|
||||
// Show State field only if the country is US (could include Canada later)
|
||||
const showState = this.props.formValues.country === COUNTRY_WITH_STATES;
|
||||
|
||||
const { verifiedName, verifiedNameEnabled } = this.props;
|
||||
const { verifiedName } = this.props;
|
||||
|
||||
const timeZoneOptions = this.getLocalizedTimeZoneOptions(
|
||||
this.props.timeZoneOptions,
|
||||
@@ -482,13 +496,13 @@ class AccountSettingsPage extends React.Component {
|
||||
const hasLinkedTPA = findIndex(this.props.tpaProviders, provider => provider.connected) >= 0;
|
||||
return (
|
||||
<>
|
||||
<div className="account-section" id="basic-information" ref={this.navLinkRefs['#basic-information']}>
|
||||
<div className="account-section pt-3 mb-5" id="basic-information" ref={this.navLinkRefs['#basic-information']}>
|
||||
{
|
||||
verifiedNameEnabled && this.props.mostRecentVerifiedName
|
||||
this.props.mostRecentVerifiedName
|
||||
&& this.renderVerifiedNameMessage(this.props.mostRecentVerifiedName)
|
||||
}
|
||||
|
||||
<h2 className="section-heading">
|
||||
<h2 className="section-heading h4 mb-3">
|
||||
{this.props.intl.formatMessage(messages['account.settings.section.account.information'])}
|
||||
</h2>
|
||||
<p>{this.props.intl.formatMessage(messages['account.settings.section.account.information.description'])}</p>
|
||||
@@ -512,8 +526,7 @@ class AccountSettingsPage extends React.Component {
|
||||
name="name"
|
||||
type="text"
|
||||
value={
|
||||
verifiedNameEnabled
|
||||
&& verifiedName?.status === 'submitted'
|
||||
verifiedName?.status === 'submitted'
|
||||
&& this.props.formValues.pending_name_change
|
||||
? this.props.formValues.pending_name_change
|
||||
: this.props.formValues.name
|
||||
@@ -525,22 +538,22 @@ class AccountSettingsPage extends React.Component {
|
||||
: this.renderEmptyStaticFieldMessage()
|
||||
}
|
||||
helpText={
|
||||
verifiedNameEnabled && verifiedName
|
||||
? this.renderFullNameHelpText(verifiedName.status)
|
||||
verifiedName
|
||||
? this.renderFullNameHelpText(verifiedName.status, verifiedName.proctored_exam_attempt_id)
|
||||
: this.props.intl.formatMessage(messages['account.settings.field.full.name.help.text'])
|
||||
}
|
||||
isEditable={
|
||||
verifiedNameEnabled && verifiedName
|
||||
verifiedName
|
||||
? this.isEditable('verifiedName') && this.isEditable('name')
|
||||
: this.isEditable('name')
|
||||
}
|
||||
isGrayedOut={
|
||||
verifiedNameEnabled && verifiedName && !this.isEditable('verifiedName')
|
||||
verifiedName && !this.isEditable('verifiedName')
|
||||
}
|
||||
onChange={this.handleEditableFieldChange}
|
||||
onSubmit={this.handleSubmitProfileName}
|
||||
/>
|
||||
{verifiedNameEnabled && verifiedName
|
||||
{verifiedName
|
||||
&& (
|
||||
<EditableField
|
||||
name="verified_name"
|
||||
@@ -556,7 +569,7 @@ class AccountSettingsPage extends React.Component {
|
||||
</div>
|
||||
)
|
||||
}
|
||||
helpText={this.renderVerifiedNameHelpText(verifiedName.status)}
|
||||
helpText={this.renderVerifiedNameHelpText(verifiedName.status, verifiedName.proctored_exam_attempt_id)}
|
||||
isEditable={this.isEditable('verifiedName')}
|
||||
isGrayedOut={!this.isEditable('verifiedName')}
|
||||
onChange={this.handleEditableFieldChange}
|
||||
@@ -583,15 +596,18 @@ class AccountSettingsPage extends React.Component {
|
||||
/>
|
||||
{this.renderSecondaryEmailField(editableFieldProps)}
|
||||
<ResetPassword email={this.props.formValues.email} />
|
||||
<EditableField
|
||||
name="year_of_birth"
|
||||
type="select"
|
||||
label={this.props.intl.formatMessage(messages['account.settings.field.dob'])}
|
||||
emptyLabel={this.props.intl.formatMessage(messages['account.settings.field.dob.empty'])}
|
||||
value={this.props.formValues.year_of_birth}
|
||||
options={yearOfBirthOptions}
|
||||
{...editableFieldProps}
|
||||
/>
|
||||
{(!getConfig().ENABLE_COPPA_COMPLIANCE)
|
||||
&& (
|
||||
<EditableField
|
||||
name="year_of_birth"
|
||||
type="select"
|
||||
label={this.props.intl.formatMessage(messages['account.settings.field.dob'])}
|
||||
emptyLabel={this.props.intl.formatMessage(messages['account.settings.field.dob.empty'])}
|
||||
value={this.props.formValues.year_of_birth}
|
||||
options={yearOfBirthOptions}
|
||||
{...editableFieldProps}
|
||||
/>
|
||||
)}
|
||||
<EditableField
|
||||
name="country"
|
||||
type="select"
|
||||
@@ -625,8 +641,8 @@ class AccountSettingsPage extends React.Component {
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="account-section" id="profile-information" ref={this.navLinkRefs['#profile-information']}>
|
||||
<h2 className="section-heading">
|
||||
<div className="account-section pt-3 mb-5" id="profile-information" ref={this.navLinkRefs['#profile-information']}>
|
||||
<h2 className="section-heading h4 mb-3">
|
||||
{this.props.intl.formatMessage(messages['account.settings.section.profile.information'])}
|
||||
</h2>
|
||||
|
||||
@@ -668,8 +684,8 @@ class AccountSettingsPage extends React.Component {
|
||||
)}
|
||||
</div>
|
||||
{getConfig().ENABLE_DEMOGRAPHICS_COLLECTION && this.renderDemographicsSection()}
|
||||
<div className="account-section" id="social-media">
|
||||
<h2 className="section-heading">
|
||||
<div className="account-section pt-3 mb-5" id="social-media">
|
||||
<h2 className="section-heading h4 mb-3">
|
||||
{this.props.intl.formatMessage(messages['account.settings.section.social.media'])}
|
||||
</h2>
|
||||
<p>
|
||||
@@ -705,8 +721,8 @@ class AccountSettingsPage extends React.Component {
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="account-section" id="site-preferences" ref={this.navLinkRefs['#site-preferences']}>
|
||||
<h2 className="section-heading">
|
||||
<div className="account-section pt-3 mb-5" id="site-preferences" ref={this.navLinkRefs['#site-preferences']}>
|
||||
<h2 className="section-heading h4 mb-3">
|
||||
{this.props.intl.formatMessage(messages['account.settings.section.site.preferences'])}
|
||||
</h2>
|
||||
|
||||
@@ -736,8 +752,8 @@ class AccountSettingsPage extends React.Component {
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="account-section" id="linked-accounts" ref={this.navLinkRefs['#linked-accounts']}>
|
||||
<h2 className="section-heading">{this.props.intl.formatMessage(messages['account.settings.section.linked.accounts'])}</h2>
|
||||
<div className="account-section pt-3 mb-5" id="linked-accounts" ref={this.navLinkRefs['#linked-accounts']}>
|
||||
<h2 className="section-heading h4 mb-3">{this.props.intl.formatMessage(messages['account.settings.section.linked.accounts'])}</h2>
|
||||
<p>
|
||||
{this.props.intl.formatMessage(
|
||||
messages['account.settings.section.linked.accounts.description'],
|
||||
@@ -747,7 +763,7 @@ class AccountSettingsPage extends React.Component {
|
||||
<ThirdPartyAuth />
|
||||
</div>
|
||||
|
||||
<div className="account-section" id="delete-account" ref={this.navLinkRefs['#delete-account']}>
|
||||
<div className="account-section pt-3 mb-5" id="delete-account" ref={this.navLinkRefs['#delete-account']}>
|
||||
<DeleteAccount
|
||||
isVerifiedAccount={this.props.isActive}
|
||||
hasLinkedTPA={hasLinkedTPA}
|
||||
@@ -884,19 +900,21 @@ AccountSettingsPage.propTypes = {
|
||||
nameChangeModal: PropTypes.shape({
|
||||
formId: PropTypes.string,
|
||||
}),
|
||||
verifiedNameEnabled: PropTypes.bool,
|
||||
verifiedName: PropTypes.shape({
|
||||
verified_name: PropTypes.string,
|
||||
status: PropTypes.string,
|
||||
proctored_exam_attempt_id: PropTypes.number,
|
||||
}),
|
||||
mostRecentVerifiedName: PropTypes.shape({
|
||||
verified_name: PropTypes.string,
|
||||
status: PropTypes.string,
|
||||
proctored_exam_attempt_id: PropTypes.number,
|
||||
}),
|
||||
verifiedNameHistory: PropTypes.arrayOf(
|
||||
PropTypes.shape({
|
||||
verified_name: PropTypes.string,
|
||||
status: PropTypes.string,
|
||||
proctored_exam_attempt_id: PropTypes.number,
|
||||
}),
|
||||
),
|
||||
};
|
||||
@@ -921,7 +939,6 @@ AccountSettingsPage.defaultProps = {
|
||||
isActive: true,
|
||||
secondary_email_enabled: false,
|
||||
nameChangeModal: {},
|
||||
verifiedNameEnabled: false,
|
||||
verifiedName: null,
|
||||
mostRecentVerifiedName: {},
|
||||
verifiedNameHistory: [],
|
||||
|
||||
@@ -91,13 +91,13 @@ const messages = defineMessages({
|
||||
defaultMessage: 'The name that is used for ID verification and that appears on your certificates.',
|
||||
description: 'Help text for the account settings name field.',
|
||||
},
|
||||
'account.settings.field.full.name.help.text.non.certificate': {
|
||||
id: 'account.settings.field.full.name.help.text.non.certificate',
|
||||
'account.settings.field.full.name.help.text.default': {
|
||||
id: 'account.settings.field.full.name.help.text.default',
|
||||
defaultMessage: 'The name that appears on your public profile.',
|
||||
description: 'Help text for the account settings name field.',
|
||||
},
|
||||
'account.settings.field.full.name.help.text.certificate': {
|
||||
id: 'account.settings.field.full.name.help.text.certificate',
|
||||
'account.settings.field.full.name.help.text.default.certificate': {
|
||||
id: 'account.settings.field.full.name.help.text.default.certificate',
|
||||
defaultMessage: 'This name is selected to appear on your certificates and public-facing records.',
|
||||
description: 'Help text for the account settings name field.',
|
||||
},
|
||||
@@ -108,27 +108,47 @@ const messages = defineMessages({
|
||||
},
|
||||
'account.settings.field.name.verified.help.text.verified': {
|
||||
id: 'account.settings.field.name.verified.help.text.verified',
|
||||
defaultMessage: 'This name has been verified by government ID.',
|
||||
defaultMessage: 'This name has been verified by photo ID.',
|
||||
description: 'Help text for the account settings verified name field when the name is verified.',
|
||||
},
|
||||
'account.settings.field.name.verified.help.text.certificate': {
|
||||
id: 'account.settings.field.name.verified.help.text.certificate',
|
||||
defaultMessage: 'This name has been verified by government ID and selected to appear on your certificates and public-facing records.',
|
||||
'account.settings.field.name.verified.help.text.verified.proctored': {
|
||||
id: 'account.settings.field.name.verified.help.text.verified.proctored',
|
||||
defaultMessage: 'This name has been verified by proctoring.',
|
||||
description: 'Help text for the account settings verified name field when the name is verified through proctoring.',
|
||||
},
|
||||
'account.settings.field.name.verified.help.text.verified.certificate': {
|
||||
id: 'account.settings.field.name.verified.help.text.verified.certificate',
|
||||
defaultMessage: 'This name has been verified by photo ID, and is selected to appear on your certificates and public-facing records.',
|
||||
description: 'Help text for the account settings verified name field when the name is selected for certificates.',
|
||||
},
|
||||
'account.settings.field.name.verified.help.text.verified.proctored.certificate': {
|
||||
id: 'account.settings.field.name.verified.help.text.verified.proctored.certificate',
|
||||
defaultMessage: 'This name has been verified by proctoring, and is selected to appear on your certificates and public-facing records.',
|
||||
description: 'Help text for the account settings verified name field when the name is selected for certificates, and the name is verified through proctoring.',
|
||||
},
|
||||
'account.settings.field.name.verified.help.text.submitted': {
|
||||
id: 'account.settings.field.name.verified.help.text.submitted',
|
||||
defaultMessage: 'Verification has been submitted. This usually takes 48 hours or less. Verified name cannot be changed at this time.',
|
||||
description: 'Help text for the account settings verified name field when a verified name has been submitted.',
|
||||
},
|
||||
'account.settings.field.name.verified.help.text.submitted.proctored': {
|
||||
id: 'account.settings.field.name.verified.help.text.submitted.proctored',
|
||||
defaultMessage: 'Your proctored exam has been submitted. Verified name cannot be changed at this time. Please check back in 2-5 days.',
|
||||
description: 'Help text for the account settings verified name field when a verified name has been submitted through proctoring.',
|
||||
},
|
||||
'account.settings.field.name.verified.help.text.submitted.certificate': {
|
||||
id: 'account.settings.field.name.verified.help.text.submitted.certificate',
|
||||
defaultMessage: 'When identity verification is successful, this name will appear on your certificates and public-facing records. Verified name cannot be changed at this time.',
|
||||
description: 'Help text for the account settings verified name field when a verified name has been submitted and will appear on certificates.',
|
||||
},
|
||||
'account.settings.field.name.verified.help.text.submitted.proctored.certificate': {
|
||||
id: 'account.settings.field.name.verified.help.text.submitted.proctored.certificate',
|
||||
defaultMessage: 'Once your proctored exam passes review, this name will appear on your certificate and public-facing records. Verified Name cannot be changed at this time.',
|
||||
description: 'Help text for the account settings verified name field when a verified name has been submitted through proctoring and will appear on certificates.',
|
||||
},
|
||||
'account.settings.field.name.verified.verification.alert': {
|
||||
id: 'account.settings.field.name.verified.verification.help',
|
||||
defaultMessage: 'Enter your name as it appears on your government-issued ID.',
|
||||
defaultMessage: 'Enter your name as it appears on your unexpired student, work, or government-issued identification card.',
|
||||
description: 'Form label instructing the user to enter the name on their ID.',
|
||||
},
|
||||
'account.settings.field.full.name.help.text.submitted': {
|
||||
@@ -136,11 +156,21 @@ const messages = defineMessages({
|
||||
defaultMessage: 'Verification has been submitted. This usually takes 48 hours or less. Full name cannot be changed at this time.',
|
||||
description: 'Help text for the account settings full name field when a verified name has been submitted.',
|
||||
},
|
||||
'account.settings.field.full.name.help.text.submitted.proctored': {
|
||||
id: 'account.settings.field.full.name.help.text.submitted.proctored',
|
||||
defaultMessage: 'Your proctored exam has been submitted. Full name cannot be changed at this time. Please check back in 2-5 days.',
|
||||
description: 'Help text for the account settings full name field when a verified name has been submitted through proctoring.',
|
||||
},
|
||||
'account.settings.field.full.name.help.text.submitted.certificate': {
|
||||
id: 'account.settings.field.full.name.help.text.submitted.certificate',
|
||||
defaultMessage: 'When identity verification is successful, this name will appear on your certificates and public-facing records. Full name cannot be changed at this time.',
|
||||
description: 'Help text for the account settings full name field when a full name has been submitted and will appear on certificates.',
|
||||
},
|
||||
'account.settings.field.full.name.help.text.submitted.proctored.certificate': {
|
||||
id: 'account.settings.field.full.name.help.text.submitted.proctored.certificate',
|
||||
defaultMessage: 'Once your proctored exam passes review, this name will appear on your certificates and public-facing records. Full name cannot be changed at this time.',
|
||||
description: 'Help text for the account settings full name field when a full name has been submitted and will appear on certificates.',
|
||||
},
|
||||
'account.settings.field.name.verified.success.message': {
|
||||
id: 'account.settings.field.name.verified.success.message',
|
||||
defaultMessage: 'Your identity verification request has successfully completed. You now have the option of selecting which name you prefer to appear on your certificates and public-records.',
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { connect } from 'react-redux';
|
||||
import { getConfig } from '@edx/frontend-platform';
|
||||
import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
|
||||
import {
|
||||
Button, Input, StatefulButton, ValidationFormGroup,
|
||||
@@ -43,6 +44,10 @@ function EditableField(props) {
|
||||
...others
|
||||
} = props;
|
||||
const id = `field-${name}`;
|
||||
let inputOptions = options;
|
||||
if (getConfig().ENABLE_COPPA_COMPLIANCE && name === 'level_of_education' && options) {
|
||||
inputOptions = options.filter(option => option.value !== 'el');
|
||||
}
|
||||
|
||||
const handleSubmit = (e) => {
|
||||
e.preventDefault();
|
||||
@@ -120,7 +125,7 @@ function EditableField(props) {
|
||||
type={type}
|
||||
value={value}
|
||||
onChange={handleChange}
|
||||
options={options}
|
||||
options={inputOptions}
|
||||
{...others}
|
||||
/>
|
||||
<>{others.children}</>
|
||||
|
||||
@@ -1,15 +1,20 @@
|
||||
import React from 'react';
|
||||
import { getConfig } from '@edx/frontend-platform';
|
||||
import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
|
||||
import { breakpoints, useWindowSize } from '@edx/paragon';
|
||||
import classNames from 'classnames';
|
||||
import PropTypes from 'prop-types';
|
||||
import React from 'react';
|
||||
import { NavHashLink } from 'react-router-hash-link';
|
||||
import Scrollspy from 'react-scrollspy';
|
||||
|
||||
import { getConfig } from '@edx/frontend-platform';
|
||||
import PropTypes from 'prop-types';
|
||||
import messages from './AccountSettingsPage.messages';
|
||||
|
||||
function JumpNav({ intl, displayDemographicsLink }) {
|
||||
function JumpNav({
|
||||
intl,
|
||||
displayDemographicsLink,
|
||||
}) {
|
||||
const stickToTop = useWindowSize().width > breakpoints.small.minWidth;
|
||||
return (
|
||||
<div className="jump-nav">
|
||||
<div className={classNames('jump-nav', { 'jump-nav-sm position-sticky pt-3': stickToTop })}>
|
||||
<Scrollspy
|
||||
items={[
|
||||
'basic-information',
|
||||
|
||||
@@ -8,7 +8,7 @@ export default function NotFoundPage() {
|
||||
<FormattedMessage
|
||||
id="error.notfound.message"
|
||||
defaultMessage="The page you're looking for is unavailable or there's an error in the URL. Please check the URL and try again."
|
||||
description="error message when a page does not exist"
|
||||
description="Error message when a page does not exist"
|
||||
/>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@@ -14,12 +14,11 @@
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.jump-nav-sm {
|
||||
top: 1rem;
|
||||
}
|
||||
|
||||
.jump-nav {
|
||||
@media (min-width: map-get($grid-breakpoints, "sm")) {
|
||||
padding-top: 1rem;
|
||||
position: sticky;
|
||||
top: 1rem;
|
||||
}
|
||||
|
||||
li {
|
||||
margin-bottom: .5rem;
|
||||
@@ -30,16 +29,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
.section-heading {
|
||||
@extend .h4;
|
||||
margin-bottom: map-get($spacers, 3);
|
||||
}
|
||||
|
||||
.account-section {
|
||||
// These properties together will shift the hashlink position
|
||||
margin-bottom: map-get($spacers, 5);
|
||||
padding-top: 1rem;
|
||||
}
|
||||
|
||||
.custom-switch {
|
||||
padding: 0;
|
||||
|
||||
@@ -28,9 +28,8 @@ function CertificatePreference({
|
||||
originalVerifiedName,
|
||||
saveState,
|
||||
useVerifiedNameForCerts,
|
||||
verifiedNameEnabled,
|
||||
}) {
|
||||
if (!verifiedNameEnabled || !originalVerifiedName) {
|
||||
if (!originalVerifiedName) {
|
||||
// If the user doesn't have an approved verified name, do not display this component
|
||||
return null;
|
||||
}
|
||||
@@ -161,7 +160,6 @@ CertificatePreference.propTypes = {
|
||||
originalVerifiedName: PropTypes.string,
|
||||
saveState: PropTypes.string,
|
||||
useVerifiedNameForCerts: PropTypes.bool,
|
||||
verifiedNameEnabled: PropTypes.bool,
|
||||
};
|
||||
|
||||
CertificatePreference.defaultProps = {
|
||||
@@ -169,7 +167,6 @@ CertificatePreference.defaultProps = {
|
||||
originalVerifiedName: '',
|
||||
saveState: null,
|
||||
useVerifiedNameForCerts: false,
|
||||
verifiedNameEnabled: false,
|
||||
};
|
||||
|
||||
export default connect(certPreferenceSelector)(injectIntl(CertificatePreference));
|
||||
|
||||
@@ -56,7 +56,6 @@ describe('NameChange', () => {
|
||||
originalVerifiedName: 'edX Verified',
|
||||
saveState: null,
|
||||
useVerifiedNameForCerts: false,
|
||||
verifiedNameEnabled: true,
|
||||
intl: {},
|
||||
};
|
||||
|
||||
|
||||
@@ -17,7 +17,7 @@ const ManagedProfileAlert = ({ profileDataManager }) => (
|
||||
<FormattedMessage
|
||||
id="account.settings.coaching.managed.alert"
|
||||
defaultMessage="Your name is managed by {managerTitle}. Contact your administrator for help."
|
||||
description="alert message informing the user their account data is managed by a third party"
|
||||
description="Alert message informing the user their account data is managed by a third party"
|
||||
values={{
|
||||
managerTitle: <b>{profileDataManager}</b>,
|
||||
}}
|
||||
|
||||
@@ -114,7 +114,7 @@ exports[`CoachingConsent disables name field on enterprise user 1`] = `
|
||||
className="mt-3"
|
||||
>
|
||||
<a
|
||||
className="mt-3 text-dark btn-link small"
|
||||
className="pgn__hyperlink default-link standalone-link mt-3 text-dark btn-link small"
|
||||
href="http://localhost:18000/dashboard/"
|
||||
onClick={[Function]}
|
||||
target="_self"
|
||||
@@ -263,7 +263,7 @@ exports[`CoachingConsent should render 1`] = `
|
||||
className="mt-3"
|
||||
>
|
||||
<a
|
||||
className="mt-3 text-dark btn-link small"
|
||||
className="pgn__hyperlink default-link standalone-link mt-3 text-dark btn-link small"
|
||||
href="http://localhost:18000/dashboard/"
|
||||
onClick={[Function]}
|
||||
target="_self"
|
||||
|
||||
@@ -39,7 +39,6 @@ export const defaultState = {
|
||||
verifiedName: null,
|
||||
mostRecentVerifiedName: {},
|
||||
verifiedNameHistory: {},
|
||||
verifiedNameEnabled: false,
|
||||
};
|
||||
|
||||
const reducer = (state = defaultState, action) => {
|
||||
|
||||
@@ -12,7 +12,6 @@ const verifiedNameSettingsSelector = createSelector(
|
||||
accountSettingsSelector,
|
||||
accountSettings => ({
|
||||
history: accountSettings.verifiedNameHistory.results,
|
||||
verifiedNameEnabled: accountSettings?.verifiedNameHistory.verified_name_enabled,
|
||||
useVerifiedNameForCerts: accountSettings?.verifiedNameHistory.use_verified_name_for_certs,
|
||||
}),
|
||||
);
|
||||
@@ -229,7 +228,6 @@ export const accountSettingsPageSelector = createSelector(
|
||||
mostRecentApprovedVerifiedNameValueSelector,
|
||||
mostRecentVerifiedNameSelector,
|
||||
sortedVerifiedNameHistorySelector,
|
||||
verifiedNameSettingsSelector,
|
||||
(
|
||||
accountSettings,
|
||||
siteLanguageOptions,
|
||||
@@ -247,7 +245,6 @@ export const accountSettingsPageSelector = createSelector(
|
||||
verifiedName,
|
||||
mostRecentVerifiedName,
|
||||
verifiedNameHistory,
|
||||
verifiedNameSettings,
|
||||
) => ({
|
||||
siteLanguageOptions,
|
||||
siteLanguage,
|
||||
@@ -268,19 +265,16 @@ export const accountSettingsPageSelector = createSelector(
|
||||
verifiedName,
|
||||
mostRecentVerifiedName,
|
||||
verifiedNameHistory,
|
||||
verifiedNameEnabled: verifiedNameSettings?.verifiedNameEnabled,
|
||||
}),
|
||||
);
|
||||
|
||||
export const certPreferenceSelector = createSelector(
|
||||
verifiedNameSettingsSelector,
|
||||
valuesSelector,
|
||||
formValuesSelector,
|
||||
mostRecentApprovedVerifiedNameValueSelector,
|
||||
saveStateSelector,
|
||||
errorSelector,
|
||||
(
|
||||
verifiedNameSettings,
|
||||
committedValues,
|
||||
formValues,
|
||||
mostRecentApprovedVerifiedNameValue,
|
||||
@@ -291,7 +285,6 @@ export const certPreferenceSelector = createSelector(
|
||||
originalVerifiedName: mostRecentApprovedVerifiedNameValue?.verified_name || '',
|
||||
useVerifiedNameForCerts: formValues.useVerifiedNameForCerts || false,
|
||||
saveState,
|
||||
verifiedNameEnabled: verifiedNameSettings.verifiedNameEnabled || false,
|
||||
formErrors: errors,
|
||||
}),
|
||||
);
|
||||
|
||||
@@ -177,19 +177,6 @@ export async function shouldDisplayDemographicsQuestions() {
|
||||
return false;
|
||||
}
|
||||
|
||||
export async function getVerifiedNameEnabled() {
|
||||
let data;
|
||||
const client = getAuthenticatedHttpClient();
|
||||
try {
|
||||
const requestUrl = `${getConfig().LMS_BASE_URL}/api/edx_name_affirmation/v1/verified_name_enabled`;
|
||||
({ data } = await client.get(requestUrl));
|
||||
} catch (error) {
|
||||
return {};
|
||||
}
|
||||
|
||||
return data;
|
||||
}
|
||||
|
||||
export async function getVerifiedName() {
|
||||
let data;
|
||||
const client = getAuthenticatedHttpClient();
|
||||
|
||||
@@ -66,9 +66,13 @@ export class DeleteAccount extends React.Component {
|
||||
? 'account.settings.delete.account.text.2.edX'
|
||||
: 'account.settings.delete.account.text.2';
|
||||
|
||||
const optInInstructionMessageId = getConfig().MARKETING_EMAILS_OPT_IN
|
||||
? 'account.settings.delete.account.please.confirm'
|
||||
: 'account.settings.delete.account.please.activate';
|
||||
|
||||
return (
|
||||
<div>
|
||||
<h2 className="section-heading">
|
||||
<h2 className="section-heading h4 mb-3">
|
||||
{intl.formatMessage(messages['account.settings.delete.account.header'])}
|
||||
</h2>
|
||||
<p>{intl.formatMessage(messages['account.settings.delete.account.subheader'])}</p>
|
||||
@@ -108,8 +112,8 @@ export class DeleteAccount extends React.Component {
|
||||
|
||||
{isVerifiedAccount ? null : (
|
||||
<BeforeProceedingBanner
|
||||
instructionMessageId="account.settings.delete.account.please.activate"
|
||||
supportArticleUrl="https://support.edx.org/hc/en-us/articles/115000940568-How-do-I-activate-my-account-"
|
||||
instructionMessageId={optInInstructionMessageId}
|
||||
supportArticleUrl="https://support.edx.org/hc/en-us/articles/115000940568-How-do-I-confirm-my-email-"
|
||||
/>
|
||||
)}
|
||||
|
||||
|
||||
@@ -16,21 +16,6 @@ Array [
|
||||
className=""
|
||||
role="dialog"
|
||||
>
|
||||
<div
|
||||
data-focus-guard={true}
|
||||
style={
|
||||
Object {
|
||||
"height": "0px",
|
||||
"left": "1px",
|
||||
"overflow": "hidden",
|
||||
"padding": 0,
|
||||
"position": "fixed",
|
||||
"top": "1px",
|
||||
"width": "1px",
|
||||
}
|
||||
}
|
||||
tabIndex={-1}
|
||||
/>
|
||||
<div
|
||||
data-focus-guard={true}
|
||||
style={
|
||||
@@ -207,21 +192,6 @@ Array [
|
||||
}
|
||||
tabIndex={0}
|
||||
/>
|
||||
<div
|
||||
data-focus-guard={true}
|
||||
style={
|
||||
Object {
|
||||
"height": "0px",
|
||||
"left": "1px",
|
||||
"overflow": "hidden",
|
||||
"padding": 0,
|
||||
"position": "fixed",
|
||||
"top": "1px",
|
||||
"width": "1px",
|
||||
}
|
||||
}
|
||||
tabIndex={1}
|
||||
/>
|
||||
<div
|
||||
data-focus-lock-disabled={false}
|
||||
onBlur={[Function]}
|
||||
@@ -418,21 +388,6 @@ Array [
|
||||
}
|
||||
tabIndex={0}
|
||||
/>
|
||||
<div
|
||||
data-focus-guard={true}
|
||||
style={
|
||||
Object {
|
||||
"height": "0px",
|
||||
"left": "1px",
|
||||
"overflow": "hidden",
|
||||
"padding": 0,
|
||||
"position": "fixed",
|
||||
"top": "1px",
|
||||
"width": "1px",
|
||||
}
|
||||
}
|
||||
tabIndex={1}
|
||||
/>
|
||||
<div
|
||||
data-focus-lock-disabled={false}
|
||||
onBlur={[Function]}
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
exports[`DeleteAccount should match default section snapshot 1`] = `
|
||||
<div>
|
||||
<h2
|
||||
className="section-heading"
|
||||
className="section-heading h4 mb-3"
|
||||
>
|
||||
Delete My Account
|
||||
</h2>
|
||||
@@ -28,7 +28,7 @@ exports[`DeleteAccount should match default section snapshot 1`] = `
|
||||
</p>
|
||||
<p>
|
||||
<a
|
||||
className="default-link standalone-link"
|
||||
className="pgn__hyperlink default-link standalone-link"
|
||||
href="https://support.edx.org/hc/en-us/sections/115004139268-Manage-Your-Account-Settings"
|
||||
onClick={[Function]}
|
||||
target="_self"
|
||||
@@ -52,7 +52,7 @@ exports[`DeleteAccount should match default section snapshot 1`] = `
|
||||
exports[`DeleteAccount should match unverified account section snapshot 1`] = `
|
||||
<div>
|
||||
<h2
|
||||
className="section-heading"
|
||||
className="section-heading h4 mb-3"
|
||||
>
|
||||
Delete My Account
|
||||
</h2>
|
||||
@@ -77,7 +77,7 @@ exports[`DeleteAccount should match unverified account section snapshot 1`] = `
|
||||
</p>
|
||||
<p>
|
||||
<a
|
||||
className="default-link standalone-link"
|
||||
className="pgn__hyperlink default-link standalone-link"
|
||||
href="https://support.edx.org/hc/en-us/sections/115004139268-Manage-Your-Account-Settings"
|
||||
onClick={[Function]}
|
||||
target="_self"
|
||||
@@ -121,8 +121,8 @@ exports[`DeleteAccount should match unverified account section snapshot 1`] = `
|
||||
<span>
|
||||
Before proceeding, please
|
||||
<a
|
||||
className="default-link standalone-link"
|
||||
href="https://support.edx.org/hc/en-us/articles/115000940568-How-do-I-activate-my-account-"
|
||||
className="pgn__hyperlink default-link standalone-link"
|
||||
href="https://support.edx.org/hc/en-us/articles/115000940568-How-do-I-confirm-my-email-"
|
||||
onClick={[Function]}
|
||||
target="_self"
|
||||
>
|
||||
@@ -138,7 +138,7 @@ exports[`DeleteAccount should match unverified account section snapshot 1`] = `
|
||||
exports[`DeleteAccount should match unverified account section snapshot 2`] = `
|
||||
<div>
|
||||
<h2
|
||||
className="section-heading"
|
||||
className="section-heading h4 mb-3"
|
||||
>
|
||||
Delete My Account
|
||||
</h2>
|
||||
@@ -163,7 +163,7 @@ exports[`DeleteAccount should match unverified account section snapshot 2`] = `
|
||||
</p>
|
||||
<p>
|
||||
<a
|
||||
className="default-link standalone-link"
|
||||
className="pgn__hyperlink default-link standalone-link"
|
||||
href="https://support.edx.org/hc/en-us/sections/115004139268-Manage-Your-Account-Settings"
|
||||
onClick={[Function]}
|
||||
target="_self"
|
||||
@@ -207,7 +207,7 @@ exports[`DeleteAccount should match unverified account section snapshot 2`] = `
|
||||
<span>
|
||||
Before proceeding, please
|
||||
<a
|
||||
className="default-link standalone-link"
|
||||
className="pgn__hyperlink default-link standalone-link"
|
||||
href="https://support.edx.org/hc/en-us/articles/207206067"
|
||||
onClick={[Function]}
|
||||
target="_self"
|
||||
|
||||
@@ -16,21 +16,6 @@ Array [
|
||||
className=""
|
||||
role="dialog"
|
||||
>
|
||||
<div
|
||||
data-focus-guard={true}
|
||||
style={
|
||||
Object {
|
||||
"height": "0px",
|
||||
"left": "1px",
|
||||
"overflow": "hidden",
|
||||
"padding": 0,
|
||||
"position": "fixed",
|
||||
"top": "1px",
|
||||
"width": "1px",
|
||||
}
|
||||
}
|
||||
tabIndex={-1}
|
||||
/>
|
||||
<div
|
||||
data-focus-guard={true}
|
||||
style={
|
||||
@@ -128,21 +113,6 @@ Array [
|
||||
className=""
|
||||
role="dialog"
|
||||
>
|
||||
<div
|
||||
data-focus-guard={true}
|
||||
style={
|
||||
Object {
|
||||
"height": "0px",
|
||||
"left": "1px",
|
||||
"overflow": "hidden",
|
||||
"padding": 0,
|
||||
"position": "fixed",
|
||||
"top": "1px",
|
||||
"width": "1px",
|
||||
}
|
||||
}
|
||||
tabIndex={-1}
|
||||
/>
|
||||
<div
|
||||
data-focus-guard={true}
|
||||
style={
|
||||
@@ -240,21 +210,6 @@ Array [
|
||||
className=""
|
||||
role="dialog"
|
||||
>
|
||||
<div
|
||||
data-focus-guard={true}
|
||||
style={
|
||||
Object {
|
||||
"height": "0px",
|
||||
"left": "1px",
|
||||
"overflow": "hidden",
|
||||
"padding": 0,
|
||||
"position": "fixed",
|
||||
"top": "1px",
|
||||
"width": "1px",
|
||||
}
|
||||
}
|
||||
tabIndex={-1}
|
||||
/>
|
||||
<div
|
||||
data-focus-guard={true}
|
||||
style={
|
||||
@@ -352,21 +307,6 @@ Array [
|
||||
className=""
|
||||
role="dialog"
|
||||
>
|
||||
<div
|
||||
data-focus-guard={true}
|
||||
style={
|
||||
Object {
|
||||
"height": "0px",
|
||||
"left": "1px",
|
||||
"overflow": "hidden",
|
||||
"padding": 0,
|
||||
"position": "fixed",
|
||||
"top": "1px",
|
||||
"width": "1px",
|
||||
}
|
||||
}
|
||||
tabIndex={-1}
|
||||
/>
|
||||
<div
|
||||
data-focus-guard={true}
|
||||
style={
|
||||
@@ -479,21 +419,6 @@ Array [
|
||||
}
|
||||
tabIndex={0}
|
||||
/>
|
||||
<div
|
||||
data-focus-guard={true}
|
||||
style={
|
||||
Object {
|
||||
"height": "0px",
|
||||
"left": "1px",
|
||||
"overflow": "hidden",
|
||||
"padding": 0,
|
||||
"position": "fixed",
|
||||
"top": "1px",
|
||||
"width": "1px",
|
||||
}
|
||||
}
|
||||
tabIndex={1}
|
||||
/>
|
||||
<div
|
||||
data-focus-lock-disabled={false}
|
||||
onBlur={[Function]}
|
||||
|
||||
@@ -51,6 +51,11 @@ const messages = defineMessages({
|
||||
defaultMessage: 'activate your account',
|
||||
description: 'This is the text on a link that goes to the support page. It is part of this sentence: Before proceeding, please activate your account.',
|
||||
},
|
||||
'account.settings.delete.account.please.confirm': {
|
||||
id: 'account.settings.delete.account.please.confirm',
|
||||
defaultMessage: 'confirm your account',
|
||||
description: 'This is the text on a link that goes to the support page. It is part of this sentence: Before proceeding, please confirm your account.',
|
||||
},
|
||||
'account.settings.delete.account.please.unlink': {
|
||||
id: 'account.settings.delete.account.please.unlink',
|
||||
defaultMessage: 'unlink all social media accounts',
|
||||
|
||||
@@ -162,8 +162,8 @@ class DemographicsSection extends React.Component {
|
||||
const showWorkStatusDescribe = this.props.formValues.demographics_work_status === OTHER;
|
||||
|
||||
return (
|
||||
<div className="account-section" id="demographics-information" ref={this.props.forwardRef}>
|
||||
<h2 className="section-heading">
|
||||
<div className="account-section pt-3 mb-5" id="demographics-information" ref={this.props.forwardRef}>
|
||||
<h2 className="section-heading h4 mb-3">
|
||||
{this.props.intl.formatMessage(messages['account.settings.section.demographics.information'])}
|
||||
</h2>
|
||||
<p>
|
||||
|
||||
@@ -2,27 +2,27 @@
|
||||
|
||||
exports[`DemographicsSection should render 1`] = `
|
||||
<div
|
||||
className="account-section"
|
||||
className="account-section pt-3 mb-5"
|
||||
id="demographics-information"
|
||||
>
|
||||
<h2
|
||||
className="section-heading"
|
||||
className="section-heading h4 mb-3"
|
||||
>
|
||||
Optional Information
|
||||
</h2>
|
||||
<p>
|
||||
<a
|
||||
className="default-link standalone-link"
|
||||
className="pgn__hyperlink default-link standalone-link"
|
||||
href="http://localhost:5335/demographics"
|
||||
onClick={[Function]}
|
||||
rel="noopener noopener noreferrer"
|
||||
rel="noopener noreferrer"
|
||||
target="_blank"
|
||||
>
|
||||
Why does localhost collect this information?
|
||||
<span
|
||||
className="d-inline-block align-text-top"
|
||||
className="pgn__hyperlink__external-icon"
|
||||
title="Opens in a new tab"
|
||||
>
|
||||
|
||||
<span
|
||||
className="pgn__icon"
|
||||
style={
|
||||
@@ -34,7 +34,6 @@ exports[`DemographicsSection should render 1`] = `
|
||||
>
|
||||
<svg
|
||||
aria-hidden={true}
|
||||
aria-label=""
|
||||
fill="none"
|
||||
focusable={false}
|
||||
height={24}
|
||||
@@ -48,6 +47,11 @@ exports[`DemographicsSection should render 1`] = `
|
||||
fill="currentColor"
|
||||
/>
|
||||
</svg>
|
||||
<span
|
||||
className="sr-only"
|
||||
>
|
||||
in a new tab
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</a>
|
||||
@@ -644,27 +648,27 @@ exports[`DemographicsSection should render 1`] = `
|
||||
|
||||
exports[`DemographicsSection should render an Alert if an error occurs 1`] = `
|
||||
<div
|
||||
className="account-section"
|
||||
className="account-section pt-3 mb-5"
|
||||
id="demographics-information"
|
||||
>
|
||||
<h2
|
||||
className="section-heading"
|
||||
className="section-heading h4 mb-3"
|
||||
>
|
||||
Optional Information
|
||||
</h2>
|
||||
<p>
|
||||
<a
|
||||
className="default-link standalone-link"
|
||||
className="pgn__hyperlink default-link standalone-link"
|
||||
href="http://localhost:5335/demographics"
|
||||
onClick={[Function]}
|
||||
rel="noopener noopener noreferrer"
|
||||
rel="noopener noreferrer"
|
||||
target="_blank"
|
||||
>
|
||||
Why does localhost collect this information?
|
||||
<span
|
||||
className="d-inline-block align-text-top"
|
||||
className="pgn__hyperlink__external-icon"
|
||||
title="Opens in a new tab"
|
||||
>
|
||||
|
||||
<span
|
||||
className="pgn__icon"
|
||||
style={
|
||||
@@ -676,7 +680,6 @@ exports[`DemographicsSection should render an Alert if an error occurs 1`] = `
|
||||
>
|
||||
<svg
|
||||
aria-hidden={true}
|
||||
aria-label=""
|
||||
fill="none"
|
||||
focusable={false}
|
||||
height={24}
|
||||
@@ -690,6 +693,11 @@ exports[`DemographicsSection should render an Alert if an error occurs 1`] = `
|
||||
fill="currentColor"
|
||||
/>
|
||||
</svg>
|
||||
<span
|
||||
className="sr-only"
|
||||
>
|
||||
in a new tab
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</a>
|
||||
@@ -1300,27 +1308,27 @@ exports[`DemographicsSection should render an Alert if an error occurs 1`] = `
|
||||
|
||||
exports[`DemographicsSection should render an Alert when demographicsOptions props are empty 1`] = `
|
||||
<div
|
||||
className="account-section"
|
||||
className="account-section pt-3 mb-5"
|
||||
id="demographics-information"
|
||||
>
|
||||
<h2
|
||||
className="section-heading"
|
||||
className="section-heading h4 mb-3"
|
||||
>
|
||||
Optional Information
|
||||
</h2>
|
||||
<p>
|
||||
<a
|
||||
className="default-link standalone-link"
|
||||
className="pgn__hyperlink default-link standalone-link"
|
||||
href="http://localhost:5335/demographics"
|
||||
onClick={[Function]}
|
||||
rel="noopener noopener noreferrer"
|
||||
rel="noopener noreferrer"
|
||||
target="_blank"
|
||||
>
|
||||
Why does localhost collect this information?
|
||||
<span
|
||||
className="d-inline-block align-text-top"
|
||||
className="pgn__hyperlink__external-icon"
|
||||
title="Opens in a new tab"
|
||||
>
|
||||
|
||||
<span
|
||||
className="pgn__icon"
|
||||
style={
|
||||
@@ -1332,7 +1340,6 @@ exports[`DemographicsSection should render an Alert when demographicsOptions pro
|
||||
>
|
||||
<svg
|
||||
aria-hidden={true}
|
||||
aria-label=""
|
||||
fill="none"
|
||||
focusable={false}
|
||||
height={24}
|
||||
@@ -1346,6 +1353,11 @@ exports[`DemographicsSection should render an Alert when demographicsOptions pro
|
||||
fill="currentColor"
|
||||
/>
|
||||
</svg>
|
||||
<span
|
||||
className="sr-only"
|
||||
>
|
||||
in a new tab
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</a>
|
||||
@@ -1369,27 +1381,27 @@ exports[`DemographicsSection should render an Alert when demographicsOptions pro
|
||||
|
||||
exports[`DemographicsSection should render ethnicity correctly when multiple options are selected 1`] = `
|
||||
<div
|
||||
className="account-section"
|
||||
className="account-section pt-3 mb-5"
|
||||
id="demographics-information"
|
||||
>
|
||||
<h2
|
||||
className="section-heading"
|
||||
className="section-heading h4 mb-3"
|
||||
>
|
||||
Optional Information
|
||||
</h2>
|
||||
<p>
|
||||
<a
|
||||
className="default-link standalone-link"
|
||||
className="pgn__hyperlink default-link standalone-link"
|
||||
href="http://localhost:5335/demographics"
|
||||
onClick={[Function]}
|
||||
rel="noopener noopener noreferrer"
|
||||
rel="noopener noreferrer"
|
||||
target="_blank"
|
||||
>
|
||||
Why does localhost collect this information?
|
||||
<span
|
||||
className="d-inline-block align-text-top"
|
||||
className="pgn__hyperlink__external-icon"
|
||||
title="Opens in a new tab"
|
||||
>
|
||||
|
||||
<span
|
||||
className="pgn__icon"
|
||||
style={
|
||||
@@ -1401,7 +1413,6 @@ exports[`DemographicsSection should render ethnicity correctly when multiple opt
|
||||
>
|
||||
<svg
|
||||
aria-hidden={true}
|
||||
aria-label=""
|
||||
fill="none"
|
||||
focusable={false}
|
||||
height={24}
|
||||
@@ -1415,6 +1426,11 @@ exports[`DemographicsSection should render ethnicity correctly when multiple opt
|
||||
fill="currentColor"
|
||||
/>
|
||||
</svg>
|
||||
<span
|
||||
className="sr-only"
|
||||
>
|
||||
in a new tab
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</a>
|
||||
@@ -2004,27 +2020,27 @@ exports[`DemographicsSection should render ethnicity correctly when multiple opt
|
||||
|
||||
exports[`DemographicsSection should render ethnicity text correctly 1`] = `
|
||||
<div
|
||||
className="account-section"
|
||||
className="account-section pt-3 mb-5"
|
||||
id="demographics-information"
|
||||
>
|
||||
<h2
|
||||
className="section-heading"
|
||||
className="section-heading h4 mb-3"
|
||||
>
|
||||
Optional Information
|
||||
</h2>
|
||||
<p>
|
||||
<a
|
||||
className="default-link standalone-link"
|
||||
className="pgn__hyperlink default-link standalone-link"
|
||||
href="http://localhost:5335/demographics"
|
||||
onClick={[Function]}
|
||||
rel="noopener noopener noreferrer"
|
||||
rel="noopener noreferrer"
|
||||
target="_blank"
|
||||
>
|
||||
Why does localhost collect this information?
|
||||
<span
|
||||
className="d-inline-block align-text-top"
|
||||
className="pgn__hyperlink__external-icon"
|
||||
title="Opens in a new tab"
|
||||
>
|
||||
|
||||
<span
|
||||
className="pgn__icon"
|
||||
style={
|
||||
@@ -2036,7 +2052,6 @@ exports[`DemographicsSection should render ethnicity text correctly 1`] = `
|
||||
>
|
||||
<svg
|
||||
aria-hidden={true}
|
||||
aria-label=""
|
||||
fill="none"
|
||||
focusable={false}
|
||||
height={24}
|
||||
@@ -2050,6 +2065,11 @@ exports[`DemographicsSection should render ethnicity text correctly 1`] = `
|
||||
fill="currentColor"
|
||||
/>
|
||||
</svg>
|
||||
<span
|
||||
className="sr-only"
|
||||
>
|
||||
in a new tab
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</a>
|
||||
@@ -2639,27 +2659,27 @@ exports[`DemographicsSection should render ethnicity text correctly 1`] = `
|
||||
|
||||
exports[`DemographicsSection should set user input correctly when user provides answers to work_status question 1`] = `
|
||||
<div
|
||||
className="account-section"
|
||||
className="account-section pt-3 mb-5"
|
||||
id="demographics-information"
|
||||
>
|
||||
<h2
|
||||
className="section-heading"
|
||||
className="section-heading h4 mb-3"
|
||||
>
|
||||
Optional Information
|
||||
</h2>
|
||||
<p>
|
||||
<a
|
||||
className="default-link standalone-link"
|
||||
className="pgn__hyperlink default-link standalone-link"
|
||||
href="http://localhost:5335/demographics"
|
||||
onClick={[Function]}
|
||||
rel="noopener noopener noreferrer"
|
||||
rel="noopener noreferrer"
|
||||
target="_blank"
|
||||
>
|
||||
Why does localhost collect this information?
|
||||
<span
|
||||
className="d-inline-block align-text-top"
|
||||
className="pgn__hyperlink__external-icon"
|
||||
title="Opens in a new tab"
|
||||
>
|
||||
|
||||
<span
|
||||
className="pgn__icon"
|
||||
style={
|
||||
@@ -2671,7 +2691,6 @@ exports[`DemographicsSection should set user input correctly when user provides
|
||||
>
|
||||
<svg
|
||||
aria-hidden={true}
|
||||
aria-label=""
|
||||
fill="none"
|
||||
focusable={false}
|
||||
height={24}
|
||||
@@ -2685,6 +2704,11 @@ exports[`DemographicsSection should set user input correctly when user provides
|
||||
fill="currentColor"
|
||||
/>
|
||||
</svg>
|
||||
<span
|
||||
className="sr-only"
|
||||
>
|
||||
in a new tab
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</a>
|
||||
@@ -3281,27 +3305,27 @@ exports[`DemographicsSection should set user input correctly when user provides
|
||||
|
||||
exports[`DemographicsSection should set user input correctly when user provides gender self-description 1`] = `
|
||||
<div
|
||||
className="account-section"
|
||||
className="account-section pt-3 mb-5"
|
||||
id="demographics-information"
|
||||
>
|
||||
<h2
|
||||
className="section-heading"
|
||||
className="section-heading h4 mb-3"
|
||||
>
|
||||
Optional Information
|
||||
</h2>
|
||||
<p>
|
||||
<a
|
||||
className="default-link standalone-link"
|
||||
className="pgn__hyperlink default-link standalone-link"
|
||||
href="http://localhost:5335/demographics"
|
||||
onClick={[Function]}
|
||||
rel="noopener noopener noreferrer"
|
||||
rel="noopener noreferrer"
|
||||
target="_blank"
|
||||
>
|
||||
Why does localhost collect this information?
|
||||
<span
|
||||
className="d-inline-block align-text-top"
|
||||
className="pgn__hyperlink__external-icon"
|
||||
title="Opens in a new tab"
|
||||
>
|
||||
|
||||
<span
|
||||
className="pgn__icon"
|
||||
style={
|
||||
@@ -3313,7 +3337,6 @@ exports[`DemographicsSection should set user input correctly when user provides
|
||||
>
|
||||
<svg
|
||||
aria-hidden={true}
|
||||
aria-label=""
|
||||
fill="none"
|
||||
focusable={false}
|
||||
height={24}
|
||||
@@ -3327,6 +3350,11 @@ exports[`DemographicsSection should set user input correctly when user provides
|
||||
fill="currentColor"
|
||||
/>
|
||||
</svg>
|
||||
<span
|
||||
className="sr-only"
|
||||
>
|
||||
in a new tab
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
@@ -69,7 +69,7 @@ function NameChangeModal({
|
||||
useEffect(() => {
|
||||
if (saveState === 'complete') {
|
||||
handleClose();
|
||||
push('/id-verification');
|
||||
push(`/id-verification?next=${encodeURIComponent('account/settings')}`);
|
||||
}
|
||||
}, [saveState]);
|
||||
|
||||
|
||||
@@ -23,12 +23,12 @@ const messages = defineMessages({
|
||||
},
|
||||
'account.settings.name.change.id.name.label': {
|
||||
id: 'account.settings.name.change.id.name.label',
|
||||
defaultMessage: 'Enter your name as it appears on your government-issued ID.',
|
||||
defaultMessage: 'Enter your name as it appears on your unexpired student, work, or government-issued identification card.',
|
||||
description: 'Form label instructing the user to enter the name on their ID.',
|
||||
},
|
||||
'account.settings.name.change.id.name.placeholder': {
|
||||
id: 'account.settings.name.change.id.name.placeholder',
|
||||
defaultMessage: 'Enter the name on your government ID',
|
||||
defaultMessage: 'Enter the name on your photo ID',
|
||||
description: 'Form label instructing the user to enter the name on their ID.',
|
||||
},
|
||||
'account.settings.name.change.error.valid.name': {
|
||||
|
||||
@@ -70,7 +70,7 @@ describe('NameChange', () => {
|
||||
afterEach(() => jest.clearAllMocks());
|
||||
|
||||
it('renders populated input after clicking continue if verified_name in form data', async () => {
|
||||
const getInput = () => screen.queryByPlaceholderText('Enter the name on your government ID');
|
||||
const getInput = () => screen.queryByPlaceholderText('Enter the name on your photo ID');
|
||||
|
||||
render(reduxWrapper(<IntlNameChange {...props} />));
|
||||
expect(getInput()).toBeNull();
|
||||
@@ -82,7 +82,7 @@ describe('NameChange', () => {
|
||||
});
|
||||
|
||||
it('renders empty input after clicking continue if verified_name not in form data', async () => {
|
||||
const getInput = () => screen.queryByPlaceholderText('Enter the name on your government ID');
|
||||
const getInput = () => screen.queryByPlaceholderText('Enter the name on your photo ID');
|
||||
const formProps = {
|
||||
...props,
|
||||
formValues: {
|
||||
@@ -112,7 +112,7 @@ describe('NameChange', () => {
|
||||
const continueButton = screen.getByText('Continue');
|
||||
fireEvent.click(continueButton);
|
||||
|
||||
const input = screen.getByPlaceholderText('Enter the name on your government ID');
|
||||
const input = screen.getByPlaceholderText('Enter the name on your photo ID');
|
||||
fireEvent.change(input, { target: { value: 'Verified Name' } });
|
||||
|
||||
const submitButton = screen.getByText('Continue');
|
||||
@@ -139,7 +139,7 @@ describe('NameChange', () => {
|
||||
const continueButton = screen.getByText('Continue');
|
||||
fireEvent.click(continueButton);
|
||||
|
||||
const input = screen.getByPlaceholderText('Enter the name on your government ID');
|
||||
const input = screen.getByPlaceholderText('Enter the name on your photo ID');
|
||||
fireEvent.change(input, { target: { value: 'Verified Name' } });
|
||||
|
||||
const submitButton = screen.getByText('Continue');
|
||||
@@ -155,7 +155,7 @@ describe('NameChange', () => {
|
||||
const continueButton = screen.getByText('Continue');
|
||||
fireEvent.click(continueButton);
|
||||
|
||||
const input = screen.getByPlaceholderText('Enter the name on your government ID');
|
||||
const input = screen.getByPlaceholderText('Enter the name on your photo ID');
|
||||
fireEvent.change(input, { target: { value: 'Verified Name' } });
|
||||
|
||||
const submitButton = screen.getByText('Continue');
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
|
||||
exports[`JumpNav should not render Optional Information link 1`] = `
|
||||
<div
|
||||
className="jump-nav"
|
||||
className="jump-nav jump-nav-sm position-sticky pt-3"
|
||||
>
|
||||
<ul
|
||||
className="list-unstyled"
|
||||
@@ -92,7 +92,7 @@ exports[`JumpNav should not render Optional Information link 1`] = `
|
||||
|
||||
exports[`JumpNav should render Optional Information link 1`] = `
|
||||
<div
|
||||
className="jump-nav"
|
||||
className="jump-nav jump-nav-sm position-sticky pt-3"
|
||||
>
|
||||
<ul
|
||||
className="list-unstyled"
|
||||
|
||||
4
src/constants.js
Normal file
4
src/constants.js
Normal file
@@ -0,0 +1,4 @@
|
||||
export const IDLE_STATUS = 'idle';
|
||||
export const LOADING_STATUS = 'loading';
|
||||
export const SUCCESS_STATUS = 'success';
|
||||
export const FAILURE_STATUS = 'failure';
|
||||
46
src/hooks.js
46
src/hooks.js
@@ -1,23 +1,55 @@
|
||||
import { useEffect, useState } from 'react';
|
||||
|
||||
import {
|
||||
IDLE_STATUS, LOADING_STATUS, SUCCESS_STATUS, FAILURE_STATUS,
|
||||
} from './constants';
|
||||
|
||||
// eslint-disable-next-line import/prefer-default-export
|
||||
export function useAsyncCall(asyncFunc) {
|
||||
const [isLoading, setIsLoading] = useState();
|
||||
const [data, setData] = useState();
|
||||
// React doesn't batch setStates call in async useEffect hooks,
|
||||
// so we use a combined object here to ensure that users
|
||||
// re-render once.
|
||||
const [data, setData] = useState({ status: IDLE_STATUS });
|
||||
|
||||
useEffect(
|
||||
() => {
|
||||
(async () => {
|
||||
setIsLoading(true);
|
||||
setData(currData => ({ ...currData, status: LOADING_STATUS }));
|
||||
const response = await asyncFunc();
|
||||
setIsLoading(false);
|
||||
if (response) {
|
||||
setData(response);
|
||||
|
||||
if (Object.keys(response).length === 0) {
|
||||
setData(currData => ({ ...currData, status: FAILURE_STATUS, data: response }));
|
||||
} else {
|
||||
setData(currData => ({ ...currData, status: SUCCESS_STATUS, data: response }));
|
||||
}
|
||||
})();
|
||||
},
|
||||
[asyncFunc],
|
||||
);
|
||||
|
||||
return [isLoading, data];
|
||||
return data;
|
||||
}
|
||||
|
||||
// Redirect the user to their original location based on session storage
|
||||
export function useRedirect() {
|
||||
const [redirect, setRedirect] = useState({
|
||||
location: 'dashboard',
|
||||
text: 'id.verification.return.dashboard',
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
if (sessionStorage.getItem('courseId')) {
|
||||
setRedirect({
|
||||
location: `courses/${sessionStorage.getItem('courseId')}`,
|
||||
text: 'id.verification.return.course',
|
||||
});
|
||||
} else if (sessionStorage.getItem('next')) {
|
||||
setRedirect({
|
||||
location: sessionStorage.getItem('next'),
|
||||
text: 'id.verification.return.generic',
|
||||
});
|
||||
}
|
||||
}, []);
|
||||
|
||||
return redirect;
|
||||
}
|
||||
|
||||
@@ -20,16 +20,22 @@
|
||||
"account.settings.field.full.name": "الاسم الكامل",
|
||||
"account.settings.field.full.name.empty": "إضافة اسم",
|
||||
"account.settings.field.full.name.help.text": "الاسم المستخدم للتحقق من هويتك والذي سوف يظهر على الشهادات الخاصة بك.",
|
||||
"account.settings.field.full.name.help.text.non.certificate": "The name that appears on your public profile.",
|
||||
"account.settings.field.full.name.help.text.certificate": "This name is selected to appear on your certificates and public-facing records.",
|
||||
"account.settings.field.full.name.help.text.default": "The name that appears on your public profile.",
|
||||
"account.settings.field.full.name.help.text.default.certificate": "This name is selected to appear on your certificates and public-facing records.",
|
||||
"account.settings.field.name.verified": "Verified name",
|
||||
"account.settings.field.name.verified.help.text.verified": "This name has been verified by government ID.",
|
||||
"account.settings.field.name.verified.help.text.certificate": "This name has been verified by government ID and selected to appear on your certificates and public-facing records.",
|
||||
"account.settings.field.name.verified.help.text.verified": "This name has been verified by photo ID.",
|
||||
"account.settings.field.name.verified.help.text.verified.proctored": "This name has been verified by proctoring.",
|
||||
"account.settings.field.name.verified.help.text.verified.certificate": "This name has been verified by photo ID, and is selected to appear on your certificates and public-facing records.",
|
||||
"account.settings.field.name.verified.help.text.verified.proctored.certificate": "This name has been verified by proctoring, and is selected to appear on your certificates and public-facing records.",
|
||||
"account.settings.field.name.verified.help.text.submitted": "Verification has been submitted. This usually takes 48 hours or less. Verified name cannot be changed at this time.",
|
||||
"account.settings.field.name.verified.help.text.submitted.proctored": "Your proctored exam has been submitted. Verified name cannot be changed at this time. Please check back in 2-5 days.",
|
||||
"account.settings.field.name.verified.help.text.submitted.certificate": "When identity verification is successful, this name will appear on your certificates and public-facing records. Verified name cannot be changed at this time.",
|
||||
"account.settings.field.name.verified.verification.help": "Enter your name as it appears on your government-issued ID.",
|
||||
"account.settings.field.name.verified.help.text.submitted.proctored.certificate": "Once your proctored exam passes review, this name will appear on your certificate and public-facing records. Verified Name cannot be changed at this time.",
|
||||
"account.settings.field.name.verified.verification.help": "Enter your name as it appears on your unexpired student, work, or government-issued identification card.",
|
||||
"account.settings.field.full.name.help.text.submitted": "Verification has been submitted. This usually takes 48 hours or less. Full name cannot be changed at this time.",
|
||||
"account.settings.field.full.name.help.text.submitted.proctored": "Your proctored exam has been submitted. Full name cannot be changed at this time. Please check back in 2-5 days.",
|
||||
"account.settings.field.full.name.help.text.submitted.certificate": "When identity verification is successful, this name will appear on your certificates and public-facing records. Full name cannot be changed at this time.",
|
||||
"account.settings.field.full.name.help.text.submitted.proctored.certificate": "Once your proctored exam passes review, this name will appear on your certificates and public-facing records. Full name cannot be changed at this time.",
|
||||
"account.settings.field.name.verified.success.message": "Your identity verification request has successfully completed. You now have the option of selecting which name you prefer to appear on your certificates and public-records.",
|
||||
"account.settings.field.name.verified.success.message.header": "Your name change request is complete!",
|
||||
"account.settings.field.name.verified.failure.message": "Your most recent identity verification attempt did not pass. Related account settings have been restored.",
|
||||
@@ -133,6 +139,7 @@
|
||||
"account.settings.delete.account.text.change.instead": "هل تريد تغيير البريد الإلكتروني أو الاسم أو كلمة المرور بدلاً من ذلك؟",
|
||||
"account.settings.delete.account.button": "احذف حسابي",
|
||||
"account.settings.delete.account.please.activate": "تنشيط حسابك",
|
||||
"account.settings.delete.account.please.confirm": "confirm your account",
|
||||
"account.settings.delete.account.please.unlink": "إلغاء ربط جميع حسابات التواصل الاجتماعي",
|
||||
"account.settings.delete.account.modal.header": "هل أنت متأكد؟",
|
||||
"account.settings.delete.account.modal.text.1": "You have selected \"Delete My Account\". Deletion of your account and personal data is permanent and cannot be undone. {siteName} will not be able to recover your account or the data that is deleted.",
|
||||
@@ -185,8 +192,8 @@
|
||||
"account.settings.name.change.title.begin": "Before we begin",
|
||||
"account.settings.name.change.warning.one": "Warning: This action updates the name that appears on all certificates that have been earned on this account in the past and any certificates you are currently earning or will earn in the future.",
|
||||
"account.settings.name.change.warning.two": "This action cannot be undone without verifying your identity.",
|
||||
"account.settings.name.change.id.name.label": "Enter your name as it appears on your government-issued ID.",
|
||||
"account.settings.name.change.id.name.placeholder": "Enter the name on your government ID",
|
||||
"account.settings.name.change.id.name.label": "Enter your name as it appears on your unexpired student, work, or government-issued identification card.",
|
||||
"account.settings.name.change.id.name.placeholder": "Enter the name on your photo ID",
|
||||
"account.settings.name.change.error.valid.name": "Please enter a valid name.",
|
||||
"account.settings.name.change.error.general": "A technical error occurred. Please try again.",
|
||||
"account.settings.name.change.continue": "Continue",
|
||||
@@ -202,10 +209,9 @@
|
||||
"account.settings.sso.account.disconnect.error": "حدثت مشكلة أثناء قطع اتصال هذا الحساب، اتصل بالدعم عند استمرار المشكلة.",
|
||||
"account.settings.sso.unlink.account": "إلغاء ربط حساب {name} ",
|
||||
"account.settings.sso.no.providers": "لا يمكن ربط أية حسابات حاليًا",
|
||||
"id.verification.access.blocked.denied": "لا يمكنك التحقق من هويتك في الوقت الحالي. إذا لم تقم بعد بتنشيط حسابك، فيرجى التحقق من مجلد البريد المهمل للحصول على رسالة التفعيل من {email}.",
|
||||
"id.verification.access.blocked.denied": "We cannot verify your identity at this time. If you have yet to activate your account, please check your spam folder for the activation email from {email}.",
|
||||
"id.verification.next": "التالي",
|
||||
"id.verification.support": "support",
|
||||
"id.verification.continue.upload": "Continue with Upload",
|
||||
"id.verification.example.card.alt": "مثال على بطاقة هوية صحيحة بالاسم الكامل وصورة.",
|
||||
"id.verification.requirements.title": "متطلبات التحقق من الصورة",
|
||||
"id.verification.requirements.description": "In order to complete Photo Verification, you will need the following:",
|
||||
@@ -283,18 +289,13 @@
|
||||
"id.verification.photo.tips.list.well.lit": "أنّ الإضاءة جيّدة على وجهك.",
|
||||
"id.verification.photo.tips.list.inside.frame": "أنّ وجهك داخل إطار الصورة بالكامل.",
|
||||
"id.verification.portrait.photo.title.camera": "التقط صورة لنفسك",
|
||||
"id.verification.portrait.photo.title.upload": "ارفع صورتك",
|
||||
"id.verification.portrait.photo.preview.alt": "معاينة صورة وجه المستخدم.",
|
||||
"id.verification.portrait.photo.instructions.camera": "عندما يكون وجهك في موضعه، استخدم زر التقاط صورة أدناه لالتقاط الصورة.",
|
||||
"id.verification.portrait.photo.instructions.upload": "Please upload a portrait photo. Ensure your entire face fits inside the frame and is well-lit. Supported formats: ",
|
||||
"id.verification.camera.help.sight.question": "ماذا لو لم أتمكن من رؤية صورة الكاميرا ؟ أو إذا لم أتمكن من رؤية صورتي لتحديد أي جانب مرئي؟",
|
||||
"id.verification.camera.help.sight.answer.portrait": "قد تتمكن من إكمال إجراء التقاط الصور من دون مساعدة، ولكن قد يتطلب الأمر بضع محاولات ضبط وضع الكاميرا بشكل صحيح. يختلف وضع الكاميرا المثالي باختلاف الكمبيوتر، ولكن بشكل عام، يكون أفضل موضع للتصوير في الرأس هو 12 إلى 18 بوصة (30-45 سم) تقريبًا من الكاميرا، مع وضع الرأس في المنتصف بالنسبة إلى شاشة الكمبيوتر. إذا تم رفض الصور التي ترسلها، فحاول تحريك اتجاه الكمبيوتر أو الكاميرا لتغيير زاوية الإضاءة.",
|
||||
"id.verification.camera.help.sight.answer.id": "قد تتمكن من إكمال إجراء التقاط الصور من دون مساعدة، ولكن قد يتطلب الأمر بضع محاولات لضبط وضع الكاميرا بشكل صحيح. يختلف الوضع الأمثل للكاميرا باختلاف جهاز الكمبيوتر، ولكن بشكل عام، يكون أفضل وضع لصورة بطاقة تعريف من 8 إلى 12 بوصة (من 20 إلى 30 سم) عن الكاميرا، مع وضع بطاقة الهوية في الوسط بالنسبة للكاميرا. إذا تم رفض الصور التي ترسلها، فحاول تحريك اتجاه الكمبيوتر أو الكاميرا لتغيير زاوية الإضاءة. إن السبب الأكثر شيوعاً للرفض هو عدم القدرة على قراءة النص الموجود على بطاقة الهوية.",
|
||||
"id.verification.camera.help.difficulty.question.portrait": "ماذا لو واجهت صعوبة في تثبيت رأسي في الموضع المناسب للكاميرا؟",
|
||||
"id.verification.camera.help.difficulty.question.id": "ماذا لو واجهت صعوبة في تثبيت بطاقة هويتي في الموضع المناسب للكاميرا؟",
|
||||
"id.verification.camera.help.difficulty.answer": "If you require assistance with taking a photo for submission, contact {siteName} support for additional suggestions.",
|
||||
"id.verification.camera.help.upload.question": "What if I want to upload a photo instead?",
|
||||
"id.verification.camera.help.upload.answer": "On the next page you will have the option to switch to upload mode. By selecting that option, you will be able to upload a photo instead.",
|
||||
"id.verification.id.photo.unclear.question": "Is your ID card image not clear or too blurry?",
|
||||
"id.verification.id.tips.title": "Helpful Identification Card Tips",
|
||||
"id.verification.id.tips.description": "Next, we'll need you to take a photo of a valid identification card that includes your full name and photo, such as a driver’s license or passport. Please have your ID ready.",
|
||||
@@ -307,24 +308,14 @@
|
||||
"id.verification.id.photo.instructions.upload": "Please upload a photo of your identification card. Ensure the entire ID fits inside the frame and is well-lit. The file size must be under 10 MB. Supported formats: ",
|
||||
"id.verification.id.photo.instructions.upload.error.invalidFileType": "The file you have selected is not a supported image type. Please choose from the following formats: ",
|
||||
"id.verification.id.photo.instructions.upload.error.fileTooLarge": "The file you have selected is too large. Please try again with a file less than 10MB.",
|
||||
"id.verification.account.name.title": "التحقق من اسم الحساب",
|
||||
"id.verification.name.check.title": "Double-Check Your Name",
|
||||
"id.verification.account.name.instructions": "يجب أن يكون الاسم الموجود على حسابك والاسم الموجود على المعرّف الخاص بك متطابقًا تمامًا. إذا لم يكن الأمر كذلك، فيرجى النقر فوق \"لا\" لتحديث اسم حسابك.",
|
||||
"id.verification.name.check.instructions": "Does the name below match the name on your government-issued ID? If not, update the name below to match your goverment-issued ID.",
|
||||
"id.verification.name.check.mismatch.information": "If the name below does not match your government-issued ID, your identity verification will be denied.",
|
||||
"id.verification.account.name.radio.label": "هل يتطابق الاسم الموجود على هويتك مع اسم الحساب أدناه؟",
|
||||
"id.verification.name.check.radio.label": "Select an option",
|
||||
"id.verification.account.name.radio.yes": "نعم",
|
||||
"id.verification.name.check.radio.yes": "Yes, the name below matches my ID",
|
||||
"id.verification.account.name.radio.no": "لا",
|
||||
"id.verification.name.check.radio.no": "No, the name below does not match my ID",
|
||||
"id.verification.account.name.error": "يرجى تحديث اسم الحساب لمطابقة الاسم على بطاقة الهوية.",
|
||||
"id.verification.name.check.instructions": "Does the name below match the name on your photo ID? If not, update the name below to match your photo ID.",
|
||||
"id.verification.name.check.mismatch.information": "If the name below does not match your photo ID, your identity verification will be denied.",
|
||||
"id.verification.name.error": "Please enter your name as it appears on your photo ID.",
|
||||
"id.verification.account.name.warning.prefix": "يُرجى الملاحظة:",
|
||||
"id.verification.account.name.settings": "إعدادات الحساب",
|
||||
"id.verification.account.name.label": "اسم الحساب",
|
||||
"id.verification.name.label": "Name",
|
||||
"id.verification.account.name.photo.alt": "صورة من هويتك للتقديم.",
|
||||
"id.verification.account.name.save": "حفظ ثم التالي",
|
||||
"id.verification.review.title": "مراجعة صورك",
|
||||
"id.verification.review.description": "يُرجى التأكّد من أنّ الصور والمعلومات التي قدّمتها تمكّننا من التحقّق من هويّتك. ",
|
||||
"id.verification.review.portrait.label": "صورتك الشخصية",
|
||||
@@ -340,20 +331,16 @@
|
||||
"id.verification.submission.alert.error.unsupported": "One or more of the files you have uploaded is in an unsupported format. Please choose from the following: ",
|
||||
"id.verification.review.error": "{siteName} Support Page",
|
||||
"id.verification.submitted.title": "جارِ التحقق من الهوية",
|
||||
"id.verification.submitted.text": "لقد تلقينا معلوماتك وجاري الآن العمل على التحقق من هويتك. ستصلك رسالة على لوحة المعلومات عند اكتمال عملية التحقق (عادةً خلال 5 أيام). في غضون ذلك، لا يزال بإمكانك الوصول إلى كل محتوى المساق المتوفر.",
|
||||
"id.verification.submitted.text": "We have received your information and are verifying your identity. You will be notified when the verification process is complete (usually within 5 days). In the meantime, you can still access all available course content.",
|
||||
"id.verification.return.dashboard": "العودة إلى لوحة المعلومات",
|
||||
"id.verification.return.course": "العودة للمساق",
|
||||
"id.verification.return.generic": "Return",
|
||||
"id.verification.photo.upload.help.title": "Upload a Photo Instead",
|
||||
"id.verification.photo.camera.help.title": "Use Your Camera Instead",
|
||||
"id.verification.photo.upload.help.text": "If you are having trouble using the photo capture above, you may want to upload a photo instead. To upload a photo, click the button below.",
|
||||
"id.verification.photo.camera.help.text": "If you are having trouble uploading a photo above, you may want to use your camera instead. To use your camera, click the button below.",
|
||||
"id.verification.upload.help.button": "Switch to Upload Mode",
|
||||
"id.verification.camera.help.button": "Switch to Camera Mode",
|
||||
"id.verification.choose.mode.title": "Photo Requirements Options",
|
||||
"id.verification.choose.mode.hep.text": "To complete verification, please select one of the following options to submit photos. You will be able to switch between these options throughout the process if needed.",
|
||||
"id.verification.choose.mode.radio.upload": "Upload photos from my device",
|
||||
"id.verification.choose.mode.radio.camera": "Take pictures using my camera",
|
||||
"id.verification.account.name.managed.alert": "Your profile settings are managed by {managerTitle}, so you are not allowed to update your name. Please contact your {profileDataManager} administrator or {support} for help.",
|
||||
"id.verification.request.camera.access.instructions": "لالتقاط صورة باستخدام كاميرا الويب، قد تتلقى طلب المتصفح للوصول إلى الكاميرا. {clickAllow}",
|
||||
"id.verification.requirements.account.managed.alert": "Your account settings are managed by {managerTitle}. If the name on your photo ID does not match the name on your account, please contact your {profileDataManager} administrator or {support} for help before completing the Photo Verification process.",
|
||||
"id.verification.requirements.card.device.text": "أنت بحاجة إلى جهاز مزود بكاميرا. إذا تلقيت طلب المتصفح للوصول إلى الكاميرا، فيرجى التأكد من النقر فوق {السماح}.",
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
{
|
||||
"account.settings.message.duplicate.tpa.provider": "The {provider} account you selected is already linked to another {siteName} account.",
|
||||
"account.settings.message.duplicate.tpa.provider": "La cuenta de {provider} seleccionada ya está vinculada con otra cuenta de {siteName}. ",
|
||||
"account.settings.message.managed.settings": "Los ajustes en el perfil son administrados por {managerTitle}. Contacte su administrador o {support} para obtener ayuda.",
|
||||
"account.settings.message.managed.settings.support": "soporte",
|
||||
"account.settings.page.heading": "Configuración de cuenta",
|
||||
@@ -14,34 +14,40 @@
|
||||
"account.settings.section.demographics.information": "Información opcional",
|
||||
"account.settings.section.site.preferences": "Preferencias del sitio",
|
||||
"account.settings.section.linked.accounts": "Cuentas vinculadas",
|
||||
"account.settings.section.linked.accounts.description": "You can link your identity accounts to simplify signing in to {siteName}.",
|
||||
"account.settings.section.linked.accounts.description": "Puedes vincular tus cuentas de redes sociales para simplificar el proceso de iniciar sesión en {siteName}.",
|
||||
"account.settings.field.username": "Nombre de usuario",
|
||||
"account.settings.field.username.help.text": "The name that identifies you on {siteName}. You cannot change your username.",
|
||||
"account.settings.field.username.help.text": "El nombre que lo identifica en {siteName}. No podrá cambiar el nombre de usuario.",
|
||||
"account.settings.field.full.name": "Nombre completo",
|
||||
"account.settings.field.full.name.empty": "Añade nombre",
|
||||
"account.settings.field.full.name.help.text": "El nombre que es usado para la verificación de identidad y aparece en sus certificados.",
|
||||
"account.settings.field.full.name.help.text.non.certificate": "The name that appears on your public profile.",
|
||||
"account.settings.field.full.name.help.text.certificate": "This name is selected to appear on your certificates and public-facing records.",
|
||||
"account.settings.field.name.verified": "Verified name",
|
||||
"account.settings.field.name.verified.help.text.verified": "This name has been verified by government ID.",
|
||||
"account.settings.field.name.verified.help.text.certificate": "This name has been verified by government ID and selected to appear on your certificates and public-facing records.",
|
||||
"account.settings.field.name.verified.help.text.submitted": "Verification has been submitted. This usually takes 48 hours or less. Verified name cannot be changed at this time.",
|
||||
"account.settings.field.name.verified.help.text.submitted.certificate": "When identity verification is successful, this name will appear on your certificates and public-facing records. Verified name cannot be changed at this time.",
|
||||
"account.settings.field.name.verified.verification.help": "Enter your name as it appears on your government-issued ID.",
|
||||
"account.settings.field.full.name.help.text.submitted": "Verification has been submitted. This usually takes 48 hours or less. Full name cannot be changed at this time.",
|
||||
"account.settings.field.full.name.help.text.submitted.certificate": "When identity verification is successful, this name will appear on your certificates and public-facing records. Full name cannot be changed at this time.",
|
||||
"account.settings.field.name.verified.success.message": "Your identity verification request has successfully completed. You now have the option of selecting which name you prefer to appear on your certificates and public-records.",
|
||||
"account.settings.field.name.verified.success.message.header": "Your name change request is complete!",
|
||||
"account.settings.field.name.verified.failure.message": "Your most recent identity verification attempt did not pass. Related account settings have been restored.",
|
||||
"account.settings.field.name.verified.failure.message.header": "We were not able to verify your identity.",
|
||||
"account.settings.field.full.name.help.text.default": "El nombre que aparece en tu perfil público.",
|
||||
"account.settings.field.full.name.help.text.default.certificate": "Este nombre está seleccionado para aparecer en tus certificados y registros públicos.",
|
||||
"account.settings.field.name.verified": "Nombre verificado",
|
||||
"account.settings.field.name.verified.help.text.verified": "Este nombre ha sido verificado por una identificación con foto.",
|
||||
"account.settings.field.name.verified.help.text.verified.proctored": "Este nombre ha sido verificado por supervisión.",
|
||||
"account.settings.field.name.verified.help.text.verified.certificate": "Este nombre ha sido verificado por una identificación con foto y está seleccionado para aparecer en sus certificados y registros públicos.",
|
||||
"account.settings.field.name.verified.help.text.verified.proctored.certificate": "Este nombre se ha verificado mediante supervisión y se ha seleccionado para que aparezca en sus certificados y registros públicos.",
|
||||
"account.settings.field.name.verified.help.text.submitted": "La verificación ha sido enviada. Este proceso usualmente toma 48 horas o menos. El nombre verificado no puede ser modificado en este momento. ",
|
||||
"account.settings.field.name.verified.help.text.submitted.proctored": "Su examen supervisado ha sido enviado. El nombre verificado no se puede cambiar en este momento. Vuelva a consultar en 2-5 días.",
|
||||
"account.settings.field.name.verified.help.text.submitted.certificate": "Cuando el proceso de verificación de identidad sea exitoso, este nombre aparecerá en tus certificados y registros públicos. El nombre verificado no puede ser cambiado en este momento. ",
|
||||
"account.settings.field.name.verified.help.text.submitted.proctored.certificate": "Una vez que su examen supervisado pase la revisión, este nombre aparecerá en su certificado y en los registros públicos. El nombre verificado no se puede cambiar en este momento.",
|
||||
"account.settings.field.name.verified.verification.help": "Ingrese su nombre tal como aparece en su tarjeta de identificación vigente de estudiante, trabajo o emitida por el gobierno.",
|
||||
"account.settings.field.full.name.help.text.submitted": "La verificación ha sido enviada. Este proceso usualmente toma 48 horas o menos. El nombre verificado no puede ser modificado en este momento. ",
|
||||
"account.settings.field.full.name.help.text.submitted.proctored": "Su examen supervisado ha sido enviado. El nombre completo no se puede cambiar en este momento. Vuelva a consultar en 2-5 días.",
|
||||
"account.settings.field.full.name.help.text.submitted.certificate": "En cuanto el proceso de verificación de identidad sea exitoso, este nombre aparecerá en tus certificados y registros públicos. El nombre completo no puede ser cambiado en este momento. ",
|
||||
"account.settings.field.full.name.help.text.submitted.proctored.certificate": "Una vez que su examen supervisado pase la revisión, este nombre aparecerá en sus certificados y registros públicos. El nombre completo no se puede cambiar en este momento.",
|
||||
"account.settings.field.name.verified.success.message": "Tu solicitud de verificación de identidad se ha completado exitosamente. Ahora puedes seleccionar el nombre prefieres que aparezca en tus certificados y registros públicos.",
|
||||
"account.settings.field.name.verified.success.message.header": "¡Tu solicitud de cambio de nombre está completada!",
|
||||
"account.settings.field.name.verified.failure.message": "Tu más reciente intento de verificación de ID no fue aprobado. Las configuraciones relacionadas con el proceso se han restablecido.",
|
||||
"account.settings.field.name.verified.failure.message.header": "No pudimos verificar tu identidad.",
|
||||
"account.settings.field.name.verified.failure.message.help.link": "Más información sobre la verificación de ID",
|
||||
"account.settings.field.name.verified.submitted.message": "Your identity verification request has been submitted and usually takes between 24 and 48 hours to complete.",
|
||||
"account.settings.field.name.verified.submitted.message.certificate": "When your request is approved, your updated name will appear on all associated certificates and public-facing records.",
|
||||
"account.settings.field.name.verified.submitted.message.header": "Your name change request is almost complete!",
|
||||
"account.settings.field.name.verified.submitted.message": "Tu solicitud de verificación de identidad ha sido enviada y usualmente se tarda entre 24 a 48 horas para completarse. ",
|
||||
"account.settings.field.name.verified.submitted.message.certificate": "Cuando la solicitud esté aprobada, la actualización de tu nombre aparecerá en todos los certificados asociados y registros públicos.",
|
||||
"account.settings.field.name.verified.submitted.message.header": "¡Tu solicitud de cambio de nombre esta por completarse!",
|
||||
"account.settings.field.email": "Correo electrónico (Ingresar)",
|
||||
"account.settings.field.email.empty": "Agregar correo electrónico",
|
||||
"account.settings.field.email.confirmation": "Le enviamos un mensaje de confirmación a {value}. Hacer click en la liga del mensaje para actualizar su correo electrónico.",
|
||||
"account.settings.field.email.help.text": "You receive messages from {siteName} and course teams at this address.",
|
||||
"account.settings.field.email.help.text": "Tienes un mensaje de {siteName} y el equipo de curso en esta dirección. ",
|
||||
"account.settings.field.secondary.email": "Correo electrónico de recuperación",
|
||||
"account.settings.field.secondary.email.empty": "Agregar un correo electrónico de recuperación",
|
||||
"account.settings.field.secondary.email.confirmation": "Le enviamos un mensaje de confirmación a {value}. Hacer click en la liga del mensaje para actualizar su correo electrónico.",
|
||||
@@ -85,7 +91,7 @@
|
||||
"account.settings.field.time.zone.all": "Todas las zonas horarias",
|
||||
"account.settings.field.time.zone.country": "Zonas horarias",
|
||||
"account.settings.section.social.media": "Enlaces de redes sociales",
|
||||
"account.settings.section.social.media.description": "Optionally, link your personal accounts to the social media icons on your {siteName} profile.",
|
||||
"account.settings.section.social.media.description": "Opcionalmente, conecte sus cuentas personales a los iconos de redes sociales en su perfil de {siteName}.",
|
||||
"account.settings.field.social.platform.name.linkedin": "LinkedIn",
|
||||
"account.settings.field.social.platform.name.linkedin.empty": "Agregar perfil de LinkedIn",
|
||||
"account.settings.jump.nav.delete.account": "Eliminar mi cuenta",
|
||||
@@ -98,12 +104,12 @@
|
||||
"account.settings.editable.field.action.edit": "Editar",
|
||||
"account.settings.static.field.empty": "No hay valor establecido. Contacte su administrador {enterprise} para hacer cambios.",
|
||||
"account.settings.static.field.empty.no.admin": "No hay valor establecido.",
|
||||
"account.settings.field.name.certificate.select": "If checked, this name will appear on your certificates and public-facing records.",
|
||||
"account.settings.field.name.modal.certificate.title": "Choose a preferred name for certificates and public-facing records",
|
||||
"account.settings.field.name.modal.certificate.select": "Select a name",
|
||||
"account.settings.field.name.modal.certificate.option.full": "Full Name",
|
||||
"account.settings.field.name.modal.certificate.option.verified": "Verified Name",
|
||||
"account.settings.field.name.modal.certificate.button.choose": "Choose name",
|
||||
"account.settings.field.name.certificate.select": "En caso de ser seleccionado, este nombre aparecerá en tus certificados y registros públicos. ",
|
||||
"account.settings.field.name.modal.certificate.title": "Escoge un nombre de preferencia para tus certificados y registros públicos.",
|
||||
"account.settings.field.name.modal.certificate.select": "Selecciona un nombre",
|
||||
"account.settings.field.name.modal.certificate.option.full": "Nombre completo",
|
||||
"account.settings.field.name.modal.certificate.option.verified": "Nombre verificado",
|
||||
"account.settings.field.name.modal.certificate.button.choose": "Escoge un nombre",
|
||||
"account.settings.coaching.consent.welcome.header": "Empecemos",
|
||||
"account.settings.coaching.consent.welcome.subheader": "Estamos aquí para ustede desde el inicio hasta el final",
|
||||
"account.settings.coaching.consent.description": "Los programas de MicroBachelors incluyen entrenamiento que se enfoca en su carrera, educación y cómo logrará resultados a través de la comunicación individual con un profesional experimentado. Si está interesado, proporcione la información a continuación y haga clic en \"Enviar\", y nuestro socio asesor se comunicará con usted por correo electrónico y / o mensaje de texto para ayudarlo a avanzar. Los términos y Condiciones aplican.*",
|
||||
@@ -125,18 +131,19 @@
|
||||
"account.settings.delete.account.before.proceeding": "Antes de continuar, por favor {actionLink}.",
|
||||
"account.settings.delete.account.header": "Eliminar mi cuenta",
|
||||
"account.settings.delete.account.subheader": "¡Sentimos que te vayas!",
|
||||
"account.settings.delete.account.text.1": "Please note: Deletion of your account and personal data is permanent and cannot be undone. {siteName} will not be able to recover your account or the data that is deleted.",
|
||||
"account.settings.delete.account.text.2": "Once your account is deleted, you cannot use it to take courses on {siteName}.",
|
||||
"account.settings.delete.account.text.1": "Para tener en cuenta: La eliminación de su cuenta y sus datos personales es permanente y no se puede deshacer. {siteName} no podrá recuperar tu cuenta o la información que sea eliminada.",
|
||||
"account.settings.delete.account.text.2": "Una véz tu cuenta haya sido eliminada, no podrás usarla para tomar cursos en {siteName}. ",
|
||||
"account.settings.delete.account.text.2.edX": "Una vez su cuenta haya sido eliminada, no la podrá usar para tomar cursos en la app de edX, edx.org o en cualquier otro sitio administrado por edX. Esto incluye el acceso a edx.org desde el sistema de su empleador o universidad y el acceso a páginas privadas ofrecidas por MIT Open Learning, Wharton Executive Education y Harvard Medical School.",
|
||||
"account.settings.delete.account.text.3.link": "Follow these instructions for printing or downloading a certificate",
|
||||
"account.settings.delete.account.text.warning": "Warning: Account deletion is permanent. Please read the above carefully before proceeding. This is an irreversible action, and you will no longer be able to use the same email on {siteName}.",
|
||||
"account.settings.delete.account.text.3.link": "Sigue estas instrucciones para imprimir o descargar un certificado. ",
|
||||
"account.settings.delete.account.text.warning": "Atención: la eliminación de su cuenta es permanente. Por favor lea el previo aviso cautelosamente antes de proceder, ya que esto es una acción irreversible, y no podrá usar el mismo correo electrónico en {siteName}.",
|
||||
"account.settings.delete.account.text.change.instead": "En lugar de eso, ¿quieres cambiar tu correo electrónico, nombre o contraseña?",
|
||||
"account.settings.delete.account.button": "Eliminar mi cuenta",
|
||||
"account.settings.delete.account.please.activate": "activar su cuenta",
|
||||
"account.settings.delete.account.please.confirm": "Confirma tu cuenta",
|
||||
"account.settings.delete.account.please.unlink": "Desvincular todas las cuentas de redes sociales.",
|
||||
"account.settings.delete.account.modal.header": "¿Está seguro?",
|
||||
"account.settings.delete.account.modal.text.1": "You have selected \"Delete My Account\". Deletion of your account and personal data is permanent and cannot be undone. {siteName} will not be able to recover your account or the data that is deleted.",
|
||||
"account.settings.delete.account.modal.text.2": "If you proceed, you will be unable to use this account to take courses on {siteName}.",
|
||||
"account.settings.delete.account.modal.text.1": "Has seleccionado la opción ''Eliminar mi cuenta''. Ten en cuenta que la eliminación de tu cuenta e información personal es permanente y no puede revertirse. {siteName} no será capaz de recuperar tu cuenta o información una vez esta sea eliminada. ",
|
||||
"account.settings.delete.account.modal.text.2": "Si aceptas proceder, ya no podrás usar esta cuenta para tomar cursos en {siteName}.",
|
||||
"account.settings.delete.account.modal.text.2.edX": "Si procedes, no será posible usar esta cuenta para tomar cursos ni en la aplicación móvil de edX, ni en edx.org, ni en cualquier otro sitio hospedado por edX. Esto incluye el acceso a edx.org desde el sistema de tu empleador o universidad, y el acceso a sitios privados ofrecidos por MIT Open Learning, Wharton Executive Education, y Harvard Medical School.",
|
||||
"account.settings.delete.account.modal.enter.password": "Si deseas continuar y eliminar tu cuenta, por favor introduce la contraseña de tu cuenta:",
|
||||
"account.settings.delete.account.modal.confirm.delete": "Si, Eliminar",
|
||||
@@ -148,8 +155,8 @@
|
||||
"account.settings.delete.account.modal.after.header": "¡Sentimos que te vayas! Tu cuenta será eliminada en breve.",
|
||||
"account.settings.delete.account.modal.after.text": "La eliminación de cuenta, incluyendo la eliminación de las listas de correo electrónico, puede tardar unas semanas en procesarse totalmente en nuestro sistema. Si quieres renunciar a recibir correos antes de que la eliminación se haya completado, por favor date de baja mediante el enlace que aparece al final de los correos.",
|
||||
"account.settings.delete.account.modal.after.button": "Cerrar",
|
||||
"account.settings.delete.account.text.3.edX": "You may also lose access to verified certificates and other program credentials like MicroMasters certificates. You can make a copy of these for your records before proceeding with deletion. {actionLink}.",
|
||||
"account.settings.delete.account.text.3": "You may also lose access to verified certificates and other program credentials. You can make a copy of these for your records before proceeding with deletion.",
|
||||
"account.settings.delete.account.text.3.edX": "También podrás perder el acceso a certificados verificados y a otras credenciales del programa como los certificados MicroMasters. Puedes hacer una copia de estos registros antes de proceder con la eliminación. {actionLink}.",
|
||||
"account.settings.delete.account.text.3": "También podrás perder el acceso a certificados verificados y a otras credenciales del programa. Puedes hacer una copia de estos registros antes de proceder con la eliminación. ",
|
||||
"account.settings.message.demographics.service.issue": "Ocurrió un error al intentar recuperar o guardar la información de tu cuenta. Por favor inténtalo más tarde.",
|
||||
"account.settings.field.demographics.gender": "Identidad de género",
|
||||
"account.settings.field.demographics.gender.empty": "Añade identidad de género",
|
||||
@@ -180,17 +187,17 @@
|
||||
"account.settings.field.demographics.future_work_sector": "Área profesional futura",
|
||||
"account.settings.field.demographics.future_work_sector.empty": "Añade área profesional",
|
||||
"account.settings.field.demographics.work_sector.options.empty": "Selecciona área profesional",
|
||||
"account.settings.section.demographics.why": "Why does {siteName} collect this information?",
|
||||
"account.settings.name.change.title.id": "This name change requires identity verification",
|
||||
"account.settings.name.change.title.begin": "Before we begin",
|
||||
"account.settings.name.change.warning.one": "Warning: This action updates the name that appears on all certificates that have been earned on this account in the past and any certificates you are currently earning or will earn in the future.",
|
||||
"account.settings.name.change.warning.two": "This action cannot be undone without verifying your identity.",
|
||||
"account.settings.name.change.id.name.label": "Enter your name as it appears on your government-issued ID.",
|
||||
"account.settings.name.change.id.name.placeholder": "Enter the name on your government ID",
|
||||
"account.settings.name.change.error.valid.name": "Please enter a valid name.",
|
||||
"account.settings.name.change.error.general": "A technical error occurred. Please try again.",
|
||||
"account.settings.name.change.continue": "Continue",
|
||||
"account.settings.name.change.cancel": "Cancel",
|
||||
"account.settings.section.demographics.why": "¿Por qué {siteName} recauda esta información?",
|
||||
"account.settings.name.change.title.id": "Este cambio de nombre requiere de verificación de identidad.",
|
||||
"account.settings.name.change.title.begin": "Antes de empezar",
|
||||
"account.settings.name.change.warning.one": "Atención: esta acción actualizará el nombre que aparece en todos los certificados obtenidos a través de esta cuenta en el pasado y en aquellos en que actualmente estás obteniendo o que adquirirás en el futuro.",
|
||||
"account.settings.name.change.warning.two": "Esta acción no podrá revertirse sin antes verificar tu identidad.",
|
||||
"account.settings.name.change.id.name.label": "Ingrese su nombre tal como aparece en su tarjeta de identificación vigente de estudiante, trabajo o emitida por el gobierno.",
|
||||
"account.settings.name.change.id.name.placeholder": "Enter the name on your photo ID",
|
||||
"account.settings.name.change.error.valid.name": "Por favor ingresa un nombre valido.",
|
||||
"account.settings.name.change.error.general": "Ha ocurrido un error técnico. Por favor intentalo de nuevo.",
|
||||
"account.settings.name.change.continue": "Continuar",
|
||||
"account.settings.name.change.cancel": "Cancelar",
|
||||
"error.notfound.message": "La página que estas buscando no está disponible o hay un error en la URL. Por favor, comprueba la URL y vuelve a intentarlo.",
|
||||
"account.settings.editable.field.password.reset.button.confirmation.support.link": "soporte técnico",
|
||||
"account.settings.editable.field.password.reset.button.confirmation": "Hemos mandado un mensaje a {email}. Haz clic en el enlace en el mensaje para restablecer tu contraseña. ¿No recibiste el mensaje? Contáctate con {technicalSupportLink}.",
|
||||
@@ -202,22 +209,21 @@
|
||||
"account.settings.sso.account.disconnect.error": "Hubo un problema al desconectar esta Cuenta. Si el problema persiste, contacte soporte.",
|
||||
"account.settings.sso.unlink.account": "Desvincular la cuenta de {accountName} ",
|
||||
"account.settings.sso.no.providers": "No se pueden vincular cuentas en este momento.",
|
||||
"id.verification.access.blocked.denied": "No puedes verificar tu identidad en este momento. Si aún tienes que activar tu cuenta, revisa tu carpeta de correo no deseado y busca el correo electrónico de activación de {email}.",
|
||||
"id.verification.access.blocked.denied": "No podemos verificar tu identidad en este momento. Si aún no has activado tu cuenta, comprueba en tu carpeta de correo no deseado el correo de activación de {email}.",
|
||||
"id.verification.next": "Siguiente",
|
||||
"id.verification.support": "soporte",
|
||||
"id.verification.continue.upload": "Continue with Upload",
|
||||
"id.verification.example.card.alt": "Ejemplo de un documento de identidad válido con foto y nombre completo.",
|
||||
"id.verification.requirements.title": "Requerimientos de verificación por foto",
|
||||
"id.verification.requirements.description": "In order to complete Photo Verification, you will need the following:",
|
||||
"id.verification.requirements.description": "Para completa la verificación de foto, necesitarás lo siguiente:",
|
||||
"id.verification.requirements.card.device.title": "Dispositivo con cámara",
|
||||
"id.verification.requirements.card.device.allow": "Permitir",
|
||||
"id.verification.requirements.card.id.title": "Photo Identification Card",
|
||||
"id.verification.requirements.card.id.text": "You need a valid identification card that contains your full name and photo, such as a driver’s license or passport.",
|
||||
"id.verification.requirements.card.id.title": "Tarjeta de identificación con foto",
|
||||
"id.verification.requirements.card.id.text": "Necesitas una tarjeta de identificación válida que contenga tu nombre completo y foto, similar a una licencia de conducir o pasaporte.",
|
||||
"id.verification.privacy.title": "Información de privacidad",
|
||||
"id.verification.privacy.need.photo.question": "Why does {siteName} need my photo?",
|
||||
"id.verification.privacy.need.photo.question": "¿Por qué {siteName} necesita mi foto?",
|
||||
"id.verification.privacy.need.photo.answer": "Utilizamos tus fotos de verificación para confirmar tu identidad y garantizar la validez de tu certificado.",
|
||||
"id.verification.privacy.do.with.photo.question": "What does {siteName} do with this photo?",
|
||||
"id.verification.privacy.do.with.photo.answer": "We securely encrypt your photo and send it our authorization service for review. Your photo and information are not saved or visible anywhere on {siteName} after the verification process is complete.",
|
||||
"id.verification.privacy.do.with.photo.question": "¿Qué hace {siteName} con esta foto?",
|
||||
"id.verification.privacy.do.with.photo.answer": "Encriptamos de forma segura tu foto y la enviamos a nuestro servicio de autorización para su revisión. Tu foto e información no se guardan ni se ven en ninguna parte de {siteName} después de que se completa el proceso de verificación.",
|
||||
"id.verification.access.blocked.title": "Verificación de identidad",
|
||||
"id.verification.access.blocked.enrollment": "Actualmente, no estás inscrito en un curso que requiera verificación de identidad.",
|
||||
"id.verification.access.blocked.pending": "Ya has enviado tu información de verificación de identidad. Recibirás un mensaje en tu panel principal cuando el proceso de verificación esté completado (usualmente dentro de los 5 días).",
|
||||
@@ -273,9 +279,9 @@
|
||||
"id.verification.camera.access.failure.temporary.safari.step2": "Haz clic en el menú de la aplicación Safari y luego selecciona \"Preferencias\". También puedes utilizar Command +, como método abreviado de teclado.",
|
||||
"id.verification.camera.access.failure.temporary.safari.step3": "Selecciona la pestaña \"Sitios web\" y luego selecciona \"Cámara\".",
|
||||
"id.verification.camera.access.failure.temporary.safari.step4": "Selecciona \"edx.org\" y cambia los permisos de la cámara a \"Permitir.\"",
|
||||
"id.verification.camera.access.failure.unsupported": "It looks like your browser does not support camera access.",
|
||||
"id.verification.camera.access.failure.unsupported.chrome.explanation": "The Chrome browser currently does not support camera access on iOS devices, such as iPhones and iPads.",
|
||||
"id.verification.camera.access.failure.unsupported.instructions": "Please use another browser to complete Identity Verification.",
|
||||
"id.verification.camera.access.failure.unsupported": "Parece que tu navegar no soporta el acceso a la cámara.",
|
||||
"id.verification.camera.access.failure.unsupported.chrome.explanation": "El navegador de Chrome actualmente no soporta el acceso a la cámara en dispositivos iOS, como iPhones y iPads.",
|
||||
"id.verification.camera.access.failure.unsupported.instructions": "Por favor utilice otro navegador para completar la verificación de identidad.",
|
||||
"id.verification.photo.tips.title": "Consejos útiles de fotos",
|
||||
"id.verification.photo.tips.description": "A continuación, necesitaremos que tomes una foto de tu rostro. Por favor, revisa los siguientes consejos útiles.",
|
||||
"id.verification.photo.tips.list.title": "Consejos para fotos",
|
||||
@@ -283,81 +289,62 @@
|
||||
"id.verification.photo.tips.list.well.lit": "El rostro esté bien iluminado",
|
||||
"id.verification.photo.tips.list.inside.frame": "Tu cara está completamente dentro del marco de la foto.",
|
||||
"id.verification.portrait.photo.title.camera": "Toma una foto de ti mismo",
|
||||
"id.verification.portrait.photo.title.upload": "Sube una foto tuya",
|
||||
"id.verification.portrait.photo.preview.alt": "Previsualización de la foto con el rostro del usuario",
|
||||
"id.verification.portrait.photo.instructions.camera": "Cuando tu rostro esté en posición, usa el botón Tomar foto a continuación para tomar tu foto.",
|
||||
"id.verification.portrait.photo.instructions.upload": "Please upload a portrait photo. Ensure your entire face fits inside the frame and is well-lit. Supported formats: ",
|
||||
"id.verification.camera.help.sight.question": "¿Qué pasa si no puedo ver la imagen de la cámara o si no puedo ver mi foto para determinar qué lado es visible?",
|
||||
"id.verification.camera.help.sight.answer.portrait": "Es posible que puedas completar el procedimiento de captura de imágenes sin ayuda, pero es posible que necesites un par de intentos de envío para que la cámara se coloque correctamente. La posición óptima de la cámara varía con cada computadora, pero generalmente la mejor distancia para una foto de rostro es aproximadamente a 12 a 18 pulgadas (30 a 45 centímetros) de la cámara, con la cabeza centrada en relación con la pantalla de la computadora. Si las fotos que envías son rechazadas, intenta mover la computadora o la orientación de la cámara para cambiar el ángulo de iluminación.",
|
||||
"id.verification.camera.help.sight.answer.id": "Es posible que puedas completar el procedimiento de captura de imágenes sin ayuda, pero es posible que necesites un par de intentos de envío para que la cámara se coloque correctamente. El posicionamiento óptimo de la cámara varía con cada computadora pero, generalmente, la mejor distancia para una foto de un documento de identificación es a 8 a 12 pulgadas (20 a 30 centímetros) de la cámara, con el documento de identificación centrado en relación con la cámara. Si las fotos que envías son rechazadas, intenta mover la computadora o la orientación de la cámara para cambiar el ángulo de iluminación. La razón más común de rechazo es la imposibilidad de leer el texto del documento de identidad.",
|
||||
"id.verification.camera.help.difficulty.question.portrait": "¿Qué sucede si tengo dificultades para mantener la cabeza en posición con respecto a la cámara?",
|
||||
"id.verification.camera.help.difficulty.question.id": "¿Qué sucede si tengo dificultades para mantener mi identificación en posición con respecto a la cámara?",
|
||||
"id.verification.camera.help.difficulty.answer": "If you require assistance with taking a photo for submission, contact {siteName} support for additional suggestions.",
|
||||
"id.verification.camera.help.upload.question": "What if I want to upload a photo instead?",
|
||||
"id.verification.camera.help.upload.answer": "On the next page you will have the option to switch to upload mode. By selecting that option, you will be able to upload a photo instead.",
|
||||
"id.verification.id.photo.unclear.question": "Is your ID card image not clear or too blurry?",
|
||||
"id.verification.id.tips.title": "Helpful Identification Card Tips",
|
||||
"id.verification.id.tips.description": "Next, we'll need you to take a photo of a valid identification card that includes your full name and photo, such as a driver’s license or passport. Please have your ID ready.",
|
||||
"id.verification.id.tips.list.well.lit": "Your identification card is well-lit.",
|
||||
"id.verification.camera.help.difficulty.answer": "Si requieres de asistencia para cargar una foto, contacta el equipo de soporte de {siteName} para sugerencias adicionales.",
|
||||
"id.verification.id.photo.unclear.question": "¿No es clara la foto de tu tarjeta de ID ó es muy borrosa?",
|
||||
"id.verification.id.tips.title": "Tips de ayuda para tarjetas de identificación",
|
||||
"id.verification.id.tips.description": "Después, necesitaremos que tomes una foto de una tarjeta de ID válida que tengas en la que incluya tu nombre completo y foto, como una licencia de conducción o un pasaporte. Por favor ten tú ID lista.",
|
||||
"id.verification.id.tips.list.well.lit": "Tu tarjeta de identificación está bien iluminada.",
|
||||
"id.verification.id.tips.list.clear": "Asegúrate de que puedes ver tu foto y leer claramente tu nombre.",
|
||||
"id.verification.id.photo.title.camera": "Take a Photo of Your Identification Card",
|
||||
"id.verification.id.photo.title.upload": "Upload a Photo of Your Identification Card",
|
||||
"id.verification.id.photo.title.camera": "Toma una foto de tu tarjeta de identificación",
|
||||
"id.verification.id.photo.title.upload": "Sube una foto de tu tarjeta de identificación",
|
||||
"id.verification.id.photo.preview.alt": "Previsualización de Foto ID",
|
||||
"id.verification.id.photo.instructions.camera": "When your ID is in position, use the Take Photo button below to take your photo. Please use a passport, driver’s license, or another identification card that includes your full name and a picture of your face.",
|
||||
"id.verification.id.photo.instructions.upload": "Please upload a photo of your identification card. Ensure the entire ID fits inside the frame and is well-lit. The file size must be under 10 MB. Supported formats: ",
|
||||
"id.verification.id.photo.instructions.upload.error.invalidFileType": "The file you have selected is not a supported image type. Please choose from the following formats: ",
|
||||
"id.verification.id.photo.instructions.camera": "Cuando tú ID este en posición, utiliza el botón de tomar foto que se encuentra debajo para proceder a tomar tu foto. Por favor usa un pasaporte, licencia de conducción, u otra tarjeta de identificación que incluya tu nombre completo y una foto de tu rostro.",
|
||||
"id.verification.id.photo.instructions.upload": "Por favor sube una foto de tu identificación. Asegurate de que todo el ID encaje dentro de el marco y que este bien iluminado. El tamaño del archivo debe ser por debajo de 10 MB. Los formatos soportados son: ",
|
||||
"id.verification.id.photo.instructions.upload.error.invalidFileType": "El archivo que has seleccionado no cumple con el tipo de imágenes soportadas. Por favor escoge entre los siguientes formatos:",
|
||||
"id.verification.id.photo.instructions.upload.error.fileTooLarge": "El archivo que has seleccionado es demasiado grande. Vuelve a intentarlo con un archivo de menos de 10 MB.",
|
||||
"id.verification.account.name.title": "Verificación de nombre de cuenta",
|
||||
"id.verification.name.check.title": "Double-Check Your Name",
|
||||
"id.verification.account.name.instructions": "El nombre de tu cuenta y el nombre de tu identificación deben coincidir exactamente. De lo contrario, haz clic en \"No\" para actualizar el nombre de tu cuenta.",
|
||||
"id.verification.name.check.instructions": "Does the name below match the name on your government-issued ID? If not, update the name below to match your goverment-issued ID.",
|
||||
"id.verification.name.check.mismatch.information": "If the name below does not match your government-issued ID, your identity verification will be denied.",
|
||||
"id.verification.account.name.radio.label": "¿El nombre de tu identificación coincide con el nombre de la cuenta a continuación?",
|
||||
"id.verification.name.check.radio.label": "Select an option",
|
||||
"id.verification.account.name.radio.yes": "Si",
|
||||
"id.verification.name.check.radio.yes": "Yes, the name below matches my ID",
|
||||
"id.verification.account.name.radio.no": "No",
|
||||
"id.verification.name.check.radio.no": "No, the name below does not match my ID",
|
||||
"id.verification.account.name.error": "Actualiza el nombre de la cuenta para que coincida con el nombre de tu identificación.",
|
||||
"id.verification.name.check.title": "Revisa nuevamente tu nombre",
|
||||
"id.verification.name.check.instructions": "Does the name below match the name on your photo ID? If not, update the name below to match your photo ID.",
|
||||
"id.verification.name.check.mismatch.information": "Si el nombre a continuación no coincide con su identificación con foto, se denegará su verificación de identidad.",
|
||||
"id.verification.name.error": "Ingrese su nombre tal como aparece en su identificación con foto.",
|
||||
"id.verification.account.name.warning.prefix": "Ten en cuenta:",
|
||||
"id.verification.account.name.settings": "Configuración de cuenta",
|
||||
"id.verification.account.name.label": "Nombre de la cuenta",
|
||||
"id.verification.name.label": "Name",
|
||||
"id.verification.name.label": "Nombre",
|
||||
"id.verification.account.name.photo.alt": "Foto de tu identificación a enviar.",
|
||||
"id.verification.account.name.save": "Guardar y siguiente",
|
||||
"id.verification.review.title": "Revisar tus fotos",
|
||||
"id.verification.review.description": "Asegúrate de que podamos verificar tu identidad con las imágenes y la información suministradas.",
|
||||
"id.verification.review.portrait.label": "Tu Retrato",
|
||||
"id.verification.review.portrait.alt": "Foto de tu rostro a enviar.",
|
||||
"id.verification.review.portrait.retake": "Retomar Foto de Retrato",
|
||||
"id.verification.review.id.label": "Your Identification Card",
|
||||
"id.verification.review.id.alt": "Photo of your identification card to be submitted.",
|
||||
"id.verification.review.id.label": "Tú tarjeta de identificación",
|
||||
"id.verification.review.id.alt": "Foto de tu tarjeta de identificación para ser enviada.",
|
||||
"id.verification.review.id.retake": "Retomar Foto de identificación",
|
||||
"id.verification.review.confirm": "Enviar",
|
||||
"id.verification.submission.alert.error.face": "Se requiere una foto de tu rostro. Vuelve a tomar tu foto de retrato.",
|
||||
"id.verification.submission.alert.error.id": "Se requiere una foto de tu documento de ID. Vuelve a tomar tu foto de ID.",
|
||||
"id.verification.submission.alert.error.name": "Se requiere un nombre de cuenta válido. Actualiza el nombre de tu cuenta para que coincida con el nombre que figura en tu ID.",
|
||||
"id.verification.submission.alert.error.unsupported": "One or more of the files you have uploaded is in an unsupported format. Please choose from the following: ",
|
||||
"id.verification.review.error": "{siteName} Support Page",
|
||||
"id.verification.submission.alert.error.unsupported": "Uno o más de los siguientes archivos que has subido se encuentran en un formato no soportado. Por favor escoge de los siguientes formatos:",
|
||||
"id.verification.review.error": "Página de soporte de {siteName}",
|
||||
"id.verification.submitted.title": "Verificación de identidad en progreso.",
|
||||
"id.verification.submitted.text": "Hemos recibido tu información y estamos verificando tu identidad. Verás un mensaje en tu tablero cuando se complete el proceso de verificación (generalmente en un periodo de 5 días). Mientras tanto, aún puedes acceder a todo el contenido del curso disponible.",
|
||||
"id.verification.submitted.text": "Hemos recibido su información y estamos verificando su identidad. Se le notificará cuando se complete el proceso de verificación (generalmente dentro de los 5 días). Mientras tanto, aún puede acceder a todo el contenido del curso disponible.",
|
||||
"id.verification.return.dashboard": "Volver al panel principal",
|
||||
"id.verification.return.course": "Regresar al curso",
|
||||
"id.verification.photo.upload.help.title": "Upload a Photo Instead",
|
||||
"id.verification.photo.camera.help.title": "Use Your Camera Instead",
|
||||
"id.verification.photo.upload.help.text": "If you are having trouble using the photo capture above, you may want to upload a photo instead. To upload a photo, click the button below.",
|
||||
"id.verification.photo.camera.help.text": "If you are having trouble uploading a photo above, you may want to use your camera instead. To use your camera, click the button below.",
|
||||
"id.verification.upload.help.button": "Switch to Upload Mode",
|
||||
"id.verification.camera.help.button": "Switch to Camera Mode",
|
||||
"id.verification.choose.mode.title": "Photo Requirements Options",
|
||||
"id.verification.choose.mode.hep.text": "To complete verification, please select one of the following options to submit photos. You will be able to switch between these options throughout the process if needed.",
|
||||
"id.verification.choose.mode.radio.upload": "Upload photos from my device",
|
||||
"id.verification.choose.mode.radio.camera": "Take pictures using my camera",
|
||||
"id.verification.account.name.managed.alert": "Your profile settings are managed by {managerTitle}, so you are not allowed to update your name. Please contact your {profileDataManager} administrator or {support} for help.",
|
||||
"id.verification.return.generic": "Regresar",
|
||||
"id.verification.photo.upload.help.title": "Cargar una imágen en vez",
|
||||
"id.verification.photo.camera.help.title": "Usar la cámara en vez",
|
||||
"id.verification.photo.upload.help.text": "Si estás presentando problemas usando el capturador de fotos, es posible que prefieras subir una foto en vez. Para subir una foto, has clic en el botón a continuación ",
|
||||
"id.verification.photo.camera.help.text": "Si estás presentando problemas subiendo una foto, es posible que prefieras usar la cámara en vez. Para usar una cámara, has clic en el botón a continuación.",
|
||||
"id.verification.upload.help.button": "Cambia a modo de carga",
|
||||
"id.verification.camera.help.button": "Cambia a modo de cámara",
|
||||
"id.verification.request.camera.access.instructions": "Para tomar una foto con tu cámara web, es posible que recibas un aviso del navegador para acceder a tu cámara. {clickAllow}",
|
||||
"id.verification.requirements.account.managed.alert": "Your account settings are managed by {managerTitle}. If the name on your photo ID does not match the name on your account, please contact your {profileDataManager} administrator or {support} for help before completing the Photo Verification process.",
|
||||
"id.verification.requirements.account.managed.alert": "La configuración de tu perfil es administrada por {managerTitle}. Por lo tanto si el nombre en tu ID de foto coincide con tu nombre de cuenta por favor ponte en contacto con tu administrador de {profileDataManager} o con {soporte} para solicitar ayuda antes de completar el proceso de verificación de foto.",
|
||||
"id.verification.requirements.card.device.text": "Necesitas un dispositivo que tenga una cámara. Si has recibido un aviso del navegador para habilitar acceso a tu cámara, por favor asegúrate de seleccionar [allow].",
|
||||
"id.verification.account.name.summary.alert": "Your account settings are managed by {managerTitle}. If the name on your photo ID does not match the name on your account, please contact your {profileDataManager} administrator or {support} for help.",
|
||||
"id.verification.account.name.summary.alert": "La configuración de tu perfil es administrada por {managerTitle}. Por lo tanto si el nombre en tu ID de foto coincide con tu nombre de cuenta por favor ponte en contacto con tu administrador de {profileDataManager} o con {soporte} para solicitar ayuda.",
|
||||
"idv.submission.alert.error": "\n Se produjo un error técnico al intentar enviar la verificación de ID.\n Es posible que sea una cuestión temporal, así que inténtalo de nuevo en unos minutos.\n Si el problema continúa, dirígete a {support_link} para obtener ayuda.\n ",
|
||||
"id.verification.account.name.edit": "Editar {sr}"
|
||||
}
|
||||
@@ -20,16 +20,22 @@
|
||||
"account.settings.field.full.name": "Nom complet",
|
||||
"account.settings.field.full.name.empty": "Ajouter un nom",
|
||||
"account.settings.field.full.name.help.text": "Le nom qui apparaîtra sur vos certificats et dans le cadre de toute vérification d'identité.",
|
||||
"account.settings.field.full.name.help.text.non.certificate": "Le nom qui apparaît sur votre profile public.",
|
||||
"account.settings.field.full.name.help.text.certificate": "Ce nom va apparaître sur vos attestations et dossiers publics.",
|
||||
"account.settings.field.full.name.help.text.default": "Le nom qui apparaît sur votre profile public.",
|
||||
"account.settings.field.full.name.help.text.default.certificate": "Ce nom va apparaître sur vos attestations et dossiers publics.",
|
||||
"account.settings.field.name.verified": "Nom vérifié",
|
||||
"account.settings.field.name.verified.help.text.verified": "Ce nom a été vérifié par une pièce d'identité gouvernementale.",
|
||||
"account.settings.field.name.verified.help.text.certificate": "This name has been verified by government ID and selected to appear on your certificates and public-facing records.",
|
||||
"account.settings.field.name.verified.help.text.verified": "Ce nom a été vérifié par une pièce d'identité avec photo.",
|
||||
"account.settings.field.name.verified.help.text.verified.proctored": "Ce nom a été vérifié par la surveillance.",
|
||||
"account.settings.field.name.verified.help.text.verified.certificate": "Ce nom a été vérifié par une pièce d'identité avec photo et est sélectionné pour apparaître sur vos certificats et vos dossiers publics.",
|
||||
"account.settings.field.name.verified.help.text.verified.proctored.certificate": "Ce nom a été vérifié par la surveillance et est sélectionné pour apparaître sur vos certificats et vos enregistrements publics.",
|
||||
"account.settings.field.name.verified.help.text.submitted": "La vérification a été soumise. Cela prend généralement 48 heures ou moins. Le nom vérifié ne peut pas être modifié pour le moment.",
|
||||
"account.settings.field.name.verified.help.text.submitted.proctored": "Votre examen surveillé a été soumis. Le nom vérifié ne peut pas être modifié pour le moment. Veuillez réessayer dans 2 à 5 jours.",
|
||||
"account.settings.field.name.verified.help.text.submitted.certificate": "Une fois la vérification d'identité réussie, ce nom apparaîtra sur vos attestations et vos dossiers publics. Le nom complet ne peut pas être modifié pour le moment.",
|
||||
"account.settings.field.name.verified.verification.help": "Enter your name as it appears on your government-issued ID.",
|
||||
"account.settings.field.name.verified.help.text.submitted.proctored.certificate": "Une fois que votre examen surveillé a réussi l'examen, ce nom apparaîtra sur votre certificat et vos dossiers publics. Le nom vérifié ne peut pas être modifié pour le moment.",
|
||||
"account.settings.field.name.verified.verification.help": "Entrez votre nom tel qu'il apparaît sur votre carte d'étudiant, de travail ou d'identité émise par le gouvernement.",
|
||||
"account.settings.field.full.name.help.text.submitted": "La vérification a été soumise. Cela prend généralement 48 heures ou moins. Le nom vérifié ne peut pas être modifié pour le moment.",
|
||||
"account.settings.field.full.name.help.text.submitted.proctored": "Votre examen surveillé a été soumis. Le nom complet ne peut pas être modifié pour le moment. Veuillez réessayer dans 2 à 5 jours.",
|
||||
"account.settings.field.full.name.help.text.submitted.certificate": "Une fois la vérification d'identité réussie, ce nom apparaîtra sur vos attestations et vos dossiers publics. Le nom complet ne peut pas être modifié pour le moment.",
|
||||
"account.settings.field.full.name.help.text.submitted.proctored.certificate": "Une fois que votre examen surveillé a réussi l'examen, ce nom apparaîtra sur vos certificats et vos dossiers publics. Le nom complet ne peut pas être modifié pour le moment.",
|
||||
"account.settings.field.name.verified.success.message": "Votre demande de vérification d'identité a été complétée avec succès. Vous avez maintenant la possibilité de sélectionner le nom que vous préférez voir apparaître sur vos attestations et documents publics.",
|
||||
"account.settings.field.name.verified.success.message.header": "Votre demande de changement de nom est terminée!",
|
||||
"account.settings.field.name.verified.failure.message": "Votre dernière tentative de vérification d'identité n'a pas abouti. Les paramètres du compte correspondant ont été restaurés.",
|
||||
@@ -133,6 +139,7 @@
|
||||
"account.settings.delete.account.text.change.instead": "Vous souhaitez modifier votre adresse électronique, votre nom ou votre mot de passe?",
|
||||
"account.settings.delete.account.button": "Supprimer mon compte",
|
||||
"account.settings.delete.account.please.activate": "activez votre compte",
|
||||
"account.settings.delete.account.please.confirm": "confirmer votre compte",
|
||||
"account.settings.delete.account.please.unlink": "dissocier tous les comptes de médias sociaux",
|
||||
"account.settings.delete.account.modal.header": "Êtes-vous certain ?",
|
||||
"account.settings.delete.account.modal.text.1": "Vous avez sélectionné \"Supprimer mon compte\". La suppression de votre compte et de vos données personnelles est permanente et ne peut être annulée. {siteName} ne pourra ni récupérer votre compte ni les données supprimées.",
|
||||
@@ -185,8 +192,8 @@
|
||||
"account.settings.name.change.title.begin": "Avant que l'on commençons",
|
||||
"account.settings.name.change.warning.one": "Warning: This action updates the name that appears on all certificates that have been earned on this account in the past and any certificates you are currently earning or will earn in the future.",
|
||||
"account.settings.name.change.warning.two": "Cette action ne peut pas être renversée sans vérification d'identité.",
|
||||
"account.settings.name.change.id.name.label": "Enter your name as it appears on your government-issued ID.",
|
||||
"account.settings.name.change.id.name.placeholder": "Enter the name on your government ID",
|
||||
"account.settings.name.change.id.name.label": "Entrez votre nom tel qu'il apparaît sur votre carte d'étudiant, de travail ou d'identité émise par le gouvernement.",
|
||||
"account.settings.name.change.id.name.placeholder": "Entrez le nom sur votre pièce d'identité avec photo",
|
||||
"account.settings.name.change.error.valid.name": "Entrez un nom valide",
|
||||
"account.settings.name.change.error.general": "Une erreur est survenue. Veuillez réessayer.",
|
||||
"account.settings.name.change.continue": "Continuer",
|
||||
@@ -202,10 +209,9 @@
|
||||
"account.settings.sso.account.disconnect.error": "Un problème est survenu lors de la déconnexion de ce compte. Contactez le support si le problème persiste.",
|
||||
"account.settings.sso.unlink.account": "Dissocier le compte {name}",
|
||||
"account.settings.sso.no.providers": "Aucun compte ne peut être lié pour le moment.",
|
||||
"id.verification.access.blocked.denied": "Vous ne pouvez pas vérifier votre identité pour le moment. Si vous n'avez pas encore activé votre compte, veuillez vérifier votre dossier de pourriels pour le courriel d'activation de {email}.",
|
||||
"id.verification.access.blocked.denied": "Nous ne pouvez pas vérifier votre identité pour le moment. Si vous n'avez pas encore activé votre compte, veuillez vérifier votre dossier de pourriels pour le courriel d'activation de {email}.",
|
||||
"id.verification.next": "Suivant",
|
||||
"id.verification.support": "support",
|
||||
"id.verification.continue.upload": "Continuer avec le téléchargement",
|
||||
"id.verification.example.card.alt": "Exemple de carte d'identité valide avec un nom complet et une photo.",
|
||||
"id.verification.requirements.title": "Exigences de vérification des photos",
|
||||
"id.verification.requirements.description": "Afin de procéder à la vérification des photos, vous aurez besoin des éléments suivants :",
|
||||
@@ -283,18 +289,13 @@
|
||||
"id.verification.photo.tips.list.well.lit": "Votre visage est bien éclairé",
|
||||
"id.verification.photo.tips.list.inside.frame": " Votre visage est entièrement dans le cadre.",
|
||||
"id.verification.portrait.photo.title.camera": "Prenez une photo de vous",
|
||||
"id.verification.portrait.photo.title.upload": "Téléchargez une photo de vous",
|
||||
"id.verification.portrait.photo.preview.alt": "Aperçu de la photo du visage de l'utilisateur.",
|
||||
"id.verification.portrait.photo.instructions.camera": "Lorsque votre visage est en position, utilisez le bouton Prendre une photo ci-dessous pour prendre votre photo.",
|
||||
"id.verification.portrait.photo.instructions.upload": "Veuillez télécharger une photo de portrait. Assurez-vous que tout votre visage s'insère dans le cadre et est bien éclairé. Formats pris en charge :",
|
||||
"id.verification.camera.help.sight.question": "Que faire si je ne peux pas voir l'image de la caméra ou si je ne peux pas voir ma photo pour déterminer quel côté est visible?",
|
||||
"id.verification.camera.help.sight.answer.portrait": "Vous pourrez peut-être terminer la procédure de capture d'image sans aide, mais cela peut prendre quelques tentatives de soumission pour obtenir le bon positionnement de la caméra. Le positionnement optimal de la caméra varie avec chaque ordinateur, mais généralement la meilleure position pour une prise de vue de la tête est d'environ 12-18 pouces (30-45 centimètres) de la caméra, la tête étant centrée par rapport à l'écran de l'ordinateur. Si les photos que vous soumettez sont rejetées, essayez de déplacer l’orientation de l’ordinateur ou de l’appareil photo pour modifier l’angle d’éclairage.",
|
||||
"id.verification.camera.help.sight.answer.id": "Vous pourrez peut-être terminer la procédure de capture d'image sans aide, mais cela peut prendre quelques tentatives de soumission pour obtenir le bon positionnement de la caméra. Le positionnement optimal de la caméra varie avec chaque ordinateur, mais généralement, la meilleure position pour une photo d'une carte d'identité est de 8-12 pouces (20-30 centimètres) de la caméra, la carte d'identité étant centrée par rapport à la caméra. Si les photos que vous soumettez sont rejetées, essayez de déplacer l’orientation de l’ordinateur ou de l’appareil photo pour modifier l’angle d’éclairage. La raison la plus courante de rejet est l'incapacité de lire le texte sur la carte d'identité.",
|
||||
"id.verification.camera.help.difficulty.question.portrait": "Que faire si j'ai des difficultés à maintenir ma tête en position par rapport à la caméra ?",
|
||||
"id.verification.camera.help.difficulty.question.id": "Que faire si j'ai des difficultés à tenir ma carte d'identité en position par rapport à la caméra ?",
|
||||
"id.verification.camera.help.difficulty.answer": "Si vous avez besoin d'aide pour prendre une photo à soumettre, contactez le support {siteName} pour des suggestions supplémentaires.",
|
||||
"id.verification.camera.help.upload.question": "Et si je souhaite télécharger une photo à la place ?",
|
||||
"id.verification.camera.help.upload.answer": "Sur la page suivante, vous aurez la possibilité de passer en mode téléchargement. En sélectionnant cette option, vous pourrez télécharger une photo à la place.",
|
||||
"id.verification.id.photo.unclear.question": "L'image de votre carte d'identité n'est pas claire ou trop floue ?",
|
||||
"id.verification.id.tips.title": "Conseils utiles pour les cartes d'identité",
|
||||
"id.verification.id.tips.description": "Ensuite, nous vous demanderons de prendre une photo d'une carte d'identité valide comportant votre nom complet et votre photo, comme un permis de conduire ou un passeport. Veuillez préparer votre carte d'identité.",
|
||||
@@ -307,24 +308,14 @@
|
||||
"id.verification.id.photo.instructions.upload": "Veuillez téléverser une photo de votre carte d'identité. Assurez-vous que la totalité de la carte d'identité rentre dans le cadre et qu'elle est bien éclairée. La taille du fichier doit être inférieure à 10 Mo. Formats pris en charge : ",
|
||||
"id.verification.id.photo.instructions.upload.error.invalidFileType": "Le fichier que vous avez sélectionné n'est pas un type d'image pris en charge. Veuillez choisir parmi les formats suivants :",
|
||||
"id.verification.id.photo.instructions.upload.error.fileTooLarge": "Le fichier que vous avez sélectionné est trop volumineux. Veuillez réessayer avec un fichier de moins de 10 Mo.",
|
||||
"id.verification.account.name.title": "Vérification du nom du compte",
|
||||
"id.verification.name.check.title": "Vérifiez votre nom",
|
||||
"id.verification.account.name.instructions": "Le nom de votre compte et le nom de votre pièce d'identité doivent correspondre exactement. Sinon, cliquez sur \"Non\" pour mettre à jour le nom de votre compte.",
|
||||
"id.verification.name.check.instructions": "Le nom ci-dessous correspond-il au nom figurant sur votre pièce d'identité officielle ? Si ce n'est pas le cas, mettez à jour le nom ci-dessous afin qu'il corresponde à votre pièce d'identité.",
|
||||
"id.verification.name.check.mismatch.information": "Si le nom ci-dessous ne correspond pas à votre pièce d'identité, la vérification de votre identité sera refusée.",
|
||||
"id.verification.account.name.radio.label": "Le nom sur votre pièce d'identité correspond-il au nom du compte ci-dessous?",
|
||||
"id.verification.name.check.radio.label": "Sélectionnez une option",
|
||||
"id.verification.account.name.radio.yes": "Oui",
|
||||
"id.verification.name.check.radio.yes": "Oui, le nom ci-dessous correspond à mon ID",
|
||||
"id.verification.account.name.radio.no": "Non",
|
||||
"id.verification.name.check.radio.no": "Non, le nom ci-dessous ne correspond pas à mon ID",
|
||||
"id.verification.account.name.error": "Veuillez mettre à jour le nom de votre compte pour qu'il corresponde au nom sur votre pièce d'identité.",
|
||||
"id.verification.name.check.instructions": "Le nom ci-dessous correspond-il au nom sur votre pièce d'identité avec photo ? Si ce n'est pas le cas, mettez à jour le nom ci-dessous pour qu'il corresponde à votre pièce d'identité avec photo.",
|
||||
"id.verification.name.check.mismatch.information": "Si le nom ci-dessous ne correspond pas à votre pièce d'identité avec photo, votre vérification d'identité sera refusée.",
|
||||
"id.verification.name.error": "Veuillez entrer votre nom tel qu'il apparaît sur votre pièce d'identité avec photo.",
|
||||
"id.verification.account.name.warning.prefix": "Veuillez noter:",
|
||||
"id.verification.account.name.settings": "Paramètres du compte",
|
||||
"id.verification.account.name.label": "Nom du compte",
|
||||
"id.verification.name.label": "Nom",
|
||||
"id.verification.account.name.photo.alt": "Photo de votre pièce d'identité à soumettre.",
|
||||
"id.verification.account.name.save": "Enregistrer et suivant",
|
||||
"id.verification.review.title": "Vérifiez vos photos",
|
||||
"id.verification.review.description": "Assurez-vous que nous pourrons vérifier votre identité avec les photos et les informations fournies.",
|
||||
"id.verification.review.portrait.label": "Votre portrait",
|
||||
@@ -340,20 +331,16 @@
|
||||
"id.verification.submission.alert.error.unsupported": "Un ou plusieurs des fichiers que vous avez téléchargés sont dans un format non pris en charge. Veuillez choisir parmi les formats suivants :",
|
||||
"id.verification.review.error": "Page de Support {siteName}",
|
||||
"id.verification.submitted.title": "Vérification d'identité en cours",
|
||||
"id.verification.submitted.text": "Nous avons reçu vos informations et vérifions votre identité. Vous verrez un message sur votre tableau de bord lorsque le processus de vérification sera terminé (généralement dans les 5 jours). En attendant, vous pouvez toujours accéder à tous les contenus de cours disponibles.",
|
||||
"id.verification.submitted.text": "Nous avons reçu vos informations et vérifions votre identité. Vous serez averti lorsque le processus de vérification sera terminé (généralement dans les 5 jours). En attendant, vous pouvez toujours accéder à tous les contenus de cours disponibles.",
|
||||
"id.verification.return.dashboard": "Retour au Tableau de bord",
|
||||
"id.verification.return.course": "Revenir au cours",
|
||||
"id.verification.return.generic": "Retour",
|
||||
"id.verification.photo.upload.help.title": "Téléchargez une photo à la place",
|
||||
"id.verification.photo.camera.help.title": "Utilisez votre appareil photo à la place",
|
||||
"id.verification.photo.upload.help.text": "Si vous rencontrez des difficultés lors de l'utilisation de la capture de photo ci-dessus, vous souhaiterez peut-être télécharger une photo à la place. Pour télécharger une photo, cliquez sur le bouton ci-dessous.",
|
||||
"id.verification.photo.camera.help.text": "Si vous rencontrez des difficultés pour télécharger une photo ci-dessus, vous pouvez utiliser votre appareil photo à la place. Pour utiliser votre appareil photo, cliquez sur le bouton ci-dessous.",
|
||||
"id.verification.upload.help.button": "Passer en mode de téléchargement",
|
||||
"id.verification.camera.help.button": "Passer en mode caméra",
|
||||
"id.verification.choose.mode.title": "Options d'exigences relatives aux photos",
|
||||
"id.verification.choose.mode.hep.text": "Pour terminer la vérification, veuillez sélectionner l'une des options suivantes pour soumettre des photos. Vous pourrez basculer entre ces options tout au long du processus si nécessaire.",
|
||||
"id.verification.choose.mode.radio.upload": "Télécharger des photos depuis mon appareil",
|
||||
"id.verification.choose.mode.radio.camera": "Prendre des photos avec mon appareil photo",
|
||||
"id.verification.account.name.managed.alert": "Les paramètres de votre profil sont gérés par {managerTitle}, vous n'êtes donc pas autorisé à mettre à jour votre nom. Veuillez contacter votre administrateur {profileDataManager} ou {support} pour obtenir de l'aide.",
|
||||
"id.verification.request.camera.access.instructions": "Afin de prendre une photo à l'aide de votre webcam, vous pouvez recevoir une invite du navigateur pour accéder à votre caméra. {clickAllow}",
|
||||
"id.verification.requirements.account.managed.alert": "Les paramètres de votre compte sont gérés par {managerTitle}. Si le nom sur votre pièce d'identité avec photo ne correspond pas au nom de votre compte, veuillez contacter votre administrateur {profileDataManager} ou {support} pour obtenir de l'aide avant de terminer le processus de vérification des photos.",
|
||||
"id.verification.requirements.card.device.text": "Vous avez besoin d'un appareil équipé d'une caméra. Si vous recevez une invite du navigateur pour accéder à votre caméra, assurez-vous de cliquer sur {allow}.",
|
||||
|
||||
@@ -20,16 +20,22 @@
|
||||
"account.settings.field.full.name": "Full name",
|
||||
"account.settings.field.full.name.empty": "Add name",
|
||||
"account.settings.field.full.name.help.text": "The name that is used for ID verification and that appears on your certificates.",
|
||||
"account.settings.field.full.name.help.text.non.certificate": "The name that appears on your public profile.",
|
||||
"account.settings.field.full.name.help.text.certificate": "This name is selected to appear on your certificates and public-facing records.",
|
||||
"account.settings.field.full.name.help.text.default": "The name that appears on your public profile.",
|
||||
"account.settings.field.full.name.help.text.default.certificate": "This name is selected to appear on your certificates and public-facing records.",
|
||||
"account.settings.field.name.verified": "Verified name",
|
||||
"account.settings.field.name.verified.help.text.verified": "This name has been verified by government ID.",
|
||||
"account.settings.field.name.verified.help.text.certificate": "This name has been verified by government ID and selected to appear on your certificates and public-facing records.",
|
||||
"account.settings.field.name.verified.help.text.verified": "This name has been verified by photo ID.",
|
||||
"account.settings.field.name.verified.help.text.verified.proctored": "This name has been verified by proctoring.",
|
||||
"account.settings.field.name.verified.help.text.verified.certificate": "This name has been verified by photo ID, and is selected to appear on your certificates and public-facing records.",
|
||||
"account.settings.field.name.verified.help.text.verified.proctored.certificate": "This name has been verified by proctoring, and is selected to appear on your certificates and public-facing records.",
|
||||
"account.settings.field.name.verified.help.text.submitted": "Verification has been submitted. This usually takes 48 hours or less. Verified name cannot be changed at this time.",
|
||||
"account.settings.field.name.verified.help.text.submitted.proctored": "Your proctored exam has been submitted. Verified name cannot be changed at this time. Please check back in 2-5 days.",
|
||||
"account.settings.field.name.verified.help.text.submitted.certificate": "When identity verification is successful, this name will appear on your certificates and public-facing records. Verified name cannot be changed at this time.",
|
||||
"account.settings.field.name.verified.verification.help": "Enter your name as it appears on your government-issued ID.",
|
||||
"account.settings.field.name.verified.help.text.submitted.proctored.certificate": "Once your proctored exam passes review, this name will appear on your certificate and public-facing records. Verified Name cannot be changed at this time.",
|
||||
"account.settings.field.name.verified.verification.help": "Enter your name as it appears on your unexpired student, work, or government-issued identification card.",
|
||||
"account.settings.field.full.name.help.text.submitted": "Verification has been submitted. This usually takes 48 hours or less. Full name cannot be changed at this time.",
|
||||
"account.settings.field.full.name.help.text.submitted.proctored": "Your proctored exam has been submitted. Full name cannot be changed at this time. Please check back in 2-5 days.",
|
||||
"account.settings.field.full.name.help.text.submitted.certificate": "When identity verification is successful, this name will appear on your certificates and public-facing records. Full name cannot be changed at this time.",
|
||||
"account.settings.field.full.name.help.text.submitted.proctored.certificate": "Once your proctored exam passes review, this name will appear on your certificates and public-facing records. Full name cannot be changed at this time.",
|
||||
"account.settings.field.name.verified.success.message": "Your identity verification request has successfully completed. You now have the option of selecting which name you prefer to appear on your certificates and public-records.",
|
||||
"account.settings.field.name.verified.success.message.header": "Your name change request is complete!",
|
||||
"account.settings.field.name.verified.failure.message": "Your most recent identity verification attempt did not pass. Related account settings have been restored.",
|
||||
@@ -133,6 +139,7 @@
|
||||
"account.settings.delete.account.text.change.instead": "Want to change your email, name, or password instead?",
|
||||
"account.settings.delete.account.button": "Delete My Account",
|
||||
"account.settings.delete.account.please.activate": "activate your account",
|
||||
"account.settings.delete.account.please.confirm": "confirm your account",
|
||||
"account.settings.delete.account.please.unlink": "unlink all social media accounts",
|
||||
"account.settings.delete.account.modal.header": "Are you sure?",
|
||||
"account.settings.delete.account.modal.text.1": "You have selected \"Delete My Account\". Deletion of your account and personal data is permanent and cannot be undone. {siteName} will not be able to recover your account or the data that is deleted.",
|
||||
@@ -185,8 +192,8 @@
|
||||
"account.settings.name.change.title.begin": "Before we begin",
|
||||
"account.settings.name.change.warning.one": "Warning: This action updates the name that appears on all certificates that have been earned on this account in the past and any certificates you are currently earning or will earn in the future.",
|
||||
"account.settings.name.change.warning.two": "This action cannot be undone without verifying your identity.",
|
||||
"account.settings.name.change.id.name.label": "Enter your name as it appears on your government-issued ID.",
|
||||
"account.settings.name.change.id.name.placeholder": "Enter the name on your government ID",
|
||||
"account.settings.name.change.id.name.label": "Enter your name as it appears on your unexpired student, work, or government-issued identification card.",
|
||||
"account.settings.name.change.id.name.placeholder": "Enter the name on your photo ID",
|
||||
"account.settings.name.change.error.valid.name": "Please enter a valid name.",
|
||||
"account.settings.name.change.error.general": "A technical error occurred. Please try again.",
|
||||
"account.settings.name.change.continue": "Continue",
|
||||
@@ -202,10 +209,9 @@
|
||||
"account.settings.sso.account.disconnect.error": "There was a problem disconnecting this account. Contact support if the problem persists.",
|
||||
"account.settings.sso.unlink.account": "Unlink {name} account",
|
||||
"account.settings.sso.no.providers": "No accounts can be linked at this time.",
|
||||
"id.verification.access.blocked.denied": "You cannot verify your identity at this time. If you have yet to activate your account, please check your spam folder for the activation email from {email}.",
|
||||
"id.verification.access.blocked.denied": "We cannot verify your identity at this time. If you have yet to activate your account, please check your spam folder for the activation email from {email}.",
|
||||
"id.verification.next": "Next",
|
||||
"id.verification.support": "support",
|
||||
"id.verification.continue.upload": "Continue with Upload",
|
||||
"id.verification.example.card.alt": "Example of a valid identification card with a full name and photo.",
|
||||
"id.verification.requirements.title": "Photo Verification Requirements",
|
||||
"id.verification.requirements.description": "In order to complete Photo Verification, you will need the following:",
|
||||
@@ -283,18 +289,13 @@
|
||||
"id.verification.photo.tips.list.well.lit": "Your face is well-lit.",
|
||||
"id.verification.photo.tips.list.inside.frame": "Your entire face fits inside the frame.",
|
||||
"id.verification.portrait.photo.title.camera": "Take a Photo of Yourself",
|
||||
"id.verification.portrait.photo.title.upload": "Upload a Photo of Yourself",
|
||||
"id.verification.portrait.photo.preview.alt": "Preview of photo of user's face.",
|
||||
"id.verification.portrait.photo.instructions.camera": "When your face is in position, use the Take Photo button below to take your photo.",
|
||||
"id.verification.portrait.photo.instructions.upload": "Please upload a portrait photo. Ensure your entire face fits inside the frame and is well-lit. Supported formats: ",
|
||||
"id.verification.camera.help.sight.question": "What if I can't see the camera image or if I can't see my photo to determine which side is visible?",
|
||||
"id.verification.camera.help.sight.answer.portrait": "You may be able to complete the image capture procedure without assistance, but it may take a couple of submission attempts to get the camera positioning right. Optimal camera positioning varies with each computer, but generally the best position for a headshot is approximately 12-18 inches (30-45 centimeters) from the camera, with your head centered relative to the computer screen. If the photos you submit are rejected, try moving the computer or camera orientation to change the lighting angle.",
|
||||
"id.verification.camera.help.sight.answer.id": "You may be able to complete the image capture procedure without assistance, but it may take a couple of submission attempts to get the camera positioning right. Optimal camera positioning varies with each computer, but generally, the best position for a photo of an ID card is 8-12 inches (20-30 centimeters) from the camera, with the ID card centered relative to the camera. If the photos you submit are rejected, try moving the computer or camera orientation to change the lighting angle. The most common reason for rejection is inability to read the text on the ID card.",
|
||||
"id.verification.camera.help.difficulty.question.portrait": "What if I have difficulty holding my head in position relative to the camera?",
|
||||
"id.verification.camera.help.difficulty.question.id": "What if I have difficulty holding my ID in position relative to the camera?",
|
||||
"id.verification.camera.help.difficulty.answer": "If you require assistance with taking a photo for submission, contact {siteName} support for additional suggestions.",
|
||||
"id.verification.camera.help.upload.question": "What if I want to upload a photo instead?",
|
||||
"id.verification.camera.help.upload.answer": "On the next page you will have the option to switch to upload mode. By selecting that option, you will be able to upload a photo instead.",
|
||||
"id.verification.id.photo.unclear.question": "Is your ID card image not clear or too blurry?",
|
||||
"id.verification.id.tips.title": "Helpful Identification Card Tips",
|
||||
"id.verification.id.tips.description": "Next, we'll need you to take a photo of a valid identification card that includes your full name and photo, such as a driver’s license or passport. Please have your ID ready.",
|
||||
@@ -307,24 +308,14 @@
|
||||
"id.verification.id.photo.instructions.upload": "Please upload a photo of your identification card. Ensure the entire ID fits inside the frame and is well-lit. The file size must be under 10 MB. Supported formats: ",
|
||||
"id.verification.id.photo.instructions.upload.error.invalidFileType": "The file you have selected is not a supported image type. Please choose from the following formats: ",
|
||||
"id.verification.id.photo.instructions.upload.error.fileTooLarge": "The file you have selected is too large. Please try again with a file less than 10MB.",
|
||||
"id.verification.account.name.title": "Account Name Check",
|
||||
"id.verification.name.check.title": "Double-Check Your Name",
|
||||
"id.verification.account.name.instructions": "The name on your account and the name on your ID must be an exact match. If not, please click \"No\" to update your account name.",
|
||||
"id.verification.name.check.instructions": "Does the name below match the name on your government-issued ID? If not, update the name below to match your goverment-issued ID.",
|
||||
"id.verification.name.check.mismatch.information": "If the name below does not match your government-issued ID, your identity verification will be denied.",
|
||||
"id.verification.account.name.radio.label": "Does the name on your ID match the Account Name below?",
|
||||
"id.verification.name.check.radio.label": "Select an option",
|
||||
"id.verification.account.name.radio.yes": "Yes",
|
||||
"id.verification.name.check.radio.yes": "Yes, the name below matches my ID",
|
||||
"id.verification.account.name.radio.no": "No",
|
||||
"id.verification.name.check.radio.no": "No, the name below does not match my ID",
|
||||
"id.verification.account.name.error": "Please update account name to match the name on your ID.",
|
||||
"id.verification.name.check.instructions": "Does the name below match the name on your photo ID? If not, update the name below to match your photo ID.",
|
||||
"id.verification.name.check.mismatch.information": "If the name below does not match your photo ID, your identity verification will be denied.",
|
||||
"id.verification.name.error": "Please enter your name as it appears on your photo ID.",
|
||||
"id.verification.account.name.warning.prefix": "Please Note:",
|
||||
"id.verification.account.name.settings": "Account Settings",
|
||||
"id.verification.account.name.label": "Account Name",
|
||||
"id.verification.name.label": "Name",
|
||||
"id.verification.account.name.photo.alt": "Photo of your ID to be submitted.",
|
||||
"id.verification.account.name.save": "Save and Next",
|
||||
"id.verification.review.title": "Review Your Photos",
|
||||
"id.verification.review.description": "Make sure we can verify your identity with the photos and information you have provided.",
|
||||
"id.verification.review.portrait.label": "Your Portrait",
|
||||
@@ -340,20 +331,16 @@
|
||||
"id.verification.submission.alert.error.unsupported": "One or more of the files you have uploaded is in an unsupported format. Please choose from the following: ",
|
||||
"id.verification.review.error": "{siteName} Support Page",
|
||||
"id.verification.submitted.title": "Identity Verification in Progress",
|
||||
"id.verification.submitted.text": "We have received your information and are verifying your identity. You will see a message on your dashboard when the verification process is complete (usually within 5 days). In the meantime, you can still access all available course content.",
|
||||
"id.verification.submitted.text": "We have received your information and are verifying your identity. You will be notified when the verification process is complete (usually within 5 days). In the meantime, you can still access all available course content.",
|
||||
"id.verification.return.dashboard": "Return to Your Dashboard",
|
||||
"id.verification.return.course": "Return to Course",
|
||||
"id.verification.return.generic": "Return",
|
||||
"id.verification.photo.upload.help.title": "Upload a Photo Instead",
|
||||
"id.verification.photo.camera.help.title": "Use Your Camera Instead",
|
||||
"id.verification.photo.upload.help.text": "If you are having trouble using the photo capture above, you may want to upload a photo instead. To upload a photo, click the button below.",
|
||||
"id.verification.photo.camera.help.text": "If you are having trouble uploading a photo above, you may want to use your camera instead. To use your camera, click the button below.",
|
||||
"id.verification.upload.help.button": "Switch to Upload Mode",
|
||||
"id.verification.camera.help.button": "Switch to Camera Mode",
|
||||
"id.verification.choose.mode.title": "Photo Requirements Options",
|
||||
"id.verification.choose.mode.hep.text": "To complete verification, please select one of the following options to submit photos. You will be able to switch between these options throughout the process if needed.",
|
||||
"id.verification.choose.mode.radio.upload": "Upload photos from my device",
|
||||
"id.verification.choose.mode.radio.camera": "Take pictures using my camera",
|
||||
"id.verification.account.name.managed.alert": "Your profile settings are managed by {managerTitle}, so you are not allowed to update your name. Please contact your {profileDataManager} administrator or {support} for help.",
|
||||
"id.verification.request.camera.access.instructions": "In order to take a photo using your webcam, you may receive a browser prompt for access to your camera. {clickAllow}",
|
||||
"id.verification.requirements.account.managed.alert": "Your account settings are managed by {managerTitle}. If the name on your photo ID does not match the name on your account, please contact your {profileDataManager} administrator or {support} for help before completing the Photo Verification process.",
|
||||
"id.verification.requirements.card.device.text": "You need a device that has a camera. If you receive a browser prompt for access to your camera, please make sure to click {allow}.",
|
||||
|
||||
@@ -17,7 +17,7 @@ function AccessBlocked({ error, intl }) {
|
||||
return (
|
||||
<FormattedMessage
|
||||
id="id.verification.access.blocked.denied"
|
||||
defaultMessage="You cannot verify your identity at this time. If you have yet to activate your account, please check your spam folder for the activation email from {email}."
|
||||
defaultMessage="We cannot verify your identity at this time. If you have yet to activate your account, please check your spam folder for the activation email from {email}."
|
||||
description="Text that displays when user is denied from making a request, and to check their email for an activation email."
|
||||
values={{
|
||||
email: <strong>no-reply@registration.edx.org</strong>,
|
||||
|
||||
@@ -262,7 +262,6 @@ class Camera extends React.Component {
|
||||
const dataUri = this.cameraPhoto.getDataUri(config);
|
||||
this.setState({ dataUri });
|
||||
this.props.onImageCapture(dataUri);
|
||||
this.props.setPhotoMode('camera');
|
||||
}
|
||||
|
||||
playShutterClick() {
|
||||
@@ -360,7 +359,6 @@ class Camera extends React.Component {
|
||||
Camera.propTypes = {
|
||||
intl: intlShape.isRequired,
|
||||
onImageCapture: PropTypes.func.isRequired,
|
||||
setPhotoMode: PropTypes.func.isRequired,
|
||||
isPortrait: PropTypes.bool.isRequired,
|
||||
};
|
||||
|
||||
|
||||
@@ -1,30 +1,14 @@
|
||||
import React, { useContext } from 'react';
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Collapsible } from '@edx/paragon';
|
||||
import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
|
||||
|
||||
import { getConfig } from '@edx/frontend-platform';
|
||||
import messages from './IdVerification.messages';
|
||||
import IdVerificationContext from './IdVerificationContext';
|
||||
|
||||
function CameraHelp(props) {
|
||||
const { optimizelyExperimentName } = useContext(IdVerificationContext);
|
||||
|
||||
return (
|
||||
<div>
|
||||
{ optimizelyExperimentName
|
||||
&& (
|
||||
<Collapsible
|
||||
styling="card"
|
||||
title={props.intl.formatMessage(messages['id.verification.camera.help.upload.question'])}
|
||||
className="mb-4 shadow"
|
||||
defaultOpen={props.isOpen}
|
||||
>
|
||||
<p>
|
||||
{props.intl.formatMessage(messages['id.verification.camera.help.upload.answer'])}
|
||||
</p>
|
||||
</Collapsible>
|
||||
)}
|
||||
<Collapsible
|
||||
styling="card"
|
||||
title={props.intl.formatMessage(messages['id.verification.camera.help.sight.question'])}
|
||||
|
||||
@@ -2,72 +2,55 @@ import React, { useContext } from 'react';
|
||||
import { sendTrackEvent } from '@edx/frontend-platform/analytics';
|
||||
import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
|
||||
import { Button, Collapsible } from '@edx/paragon';
|
||||
import { Link } from 'react-router-dom';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
import IdVerificationContext, { MEDIA_ACCESS } from './IdVerificationContext';
|
||||
import IdVerificationContext from './IdVerificationContext';
|
||||
import messages from './IdVerification.messages';
|
||||
|
||||
function CollapsibleImageHelp(props) {
|
||||
const {
|
||||
userId, shouldUseCamera, setShouldUseCamera, optimizelyExperimentName, mediaAccess,
|
||||
userId, useCameraForId, setUseCameraForId,
|
||||
} = useContext(IdVerificationContext);
|
||||
|
||||
function handleClick() {
|
||||
const toggleTo = shouldUseCamera ? 'upload' : 'camera';
|
||||
const toggleTo = useCameraForId ? 'upload' : 'camera';
|
||||
const eventName = `edx.id_verification.toggle_to.${toggleTo}`;
|
||||
sendTrackEvent(eventName, {
|
||||
category: 'id_verification',
|
||||
user_id: userId,
|
||||
});
|
||||
setShouldUseCamera(!shouldUseCamera);
|
||||
setUseCameraForId(!useCameraForId);
|
||||
}
|
||||
|
||||
if (optimizelyExperimentName && mediaAccess !== MEDIA_ACCESS.DENIED && mediaAccess !== MEDIA_ACCESS.UNSUPPORTED) {
|
||||
return (
|
||||
<Collapsible
|
||||
styling="card"
|
||||
title={shouldUseCamera ? props.intl.formatMessage(messages['id.verification.photo.upload.help.title']) : props.intl.formatMessage(messages['id.verification.photo.camera.help.title'])}
|
||||
className="mb-4 shadow"
|
||||
defaultOpen
|
||||
return (
|
||||
<Collapsible
|
||||
styling="card"
|
||||
title={useCameraForId
|
||||
? props.intl.formatMessage(messages['id.verification.photo.upload.help.title'])
|
||||
: props.intl.formatMessage(messages['id.verification.photo.camera.help.title'])}
|
||||
className="mb-4 shadow"
|
||||
defaultOpen
|
||||
>
|
||||
<p data-testid="help-text">
|
||||
{useCameraForId
|
||||
? props.intl.formatMessage(messages['id.verification.photo.upload.help.text'])
|
||||
: props.intl.formatMessage(messages['id.verification.photo.camera.help.text'])}
|
||||
</p>
|
||||
<Button
|
||||
title={useCameraForId ? 'Upload Photo' : 'Take Photo'} // TO-DO: translation
|
||||
data-testid="toggle-button"
|
||||
onClick={handleClick}
|
||||
style={{ marginTop: '0.5rem' }}
|
||||
>
|
||||
<p data-testid="help-text">
|
||||
{shouldUseCamera
|
||||
? props.intl.formatMessage(messages['id.verification.photo.upload.help.text'])
|
||||
: props.intl.formatMessage(messages['id.verification.photo.camera.help.text'])}
|
||||
</p>
|
||||
{ (mediaAccess === MEDIA_ACCESS.PENDING && !shouldUseCamera)
|
||||
? (
|
||||
// if a user has not enabled camera access yet, and they are trying to switch
|
||||
// to camera mode, direct them to panel that requests camera access
|
||||
<Link
|
||||
to={{ pathname: 'request-camera-access', state: { fromPortraitCapture: props.isPortrait, fromIdCapture: !props.isPortrait } }}
|
||||
className="btn btn-primary"
|
||||
data-testid="access-link"
|
||||
>
|
||||
{props.intl.formatMessage(messages['id.verification.photo.camera.help.button'])}
|
||||
</Link>
|
||||
)
|
||||
: (
|
||||
<Button
|
||||
title={shouldUseCamera ? 'Upload Portrait Photo' : 'Take Portrait Photo'}
|
||||
data-testid="toggle-button"
|
||||
onClick={handleClick}
|
||||
style={{ marginTop: '0.5rem' }}
|
||||
>
|
||||
{shouldUseCamera ? props.intl.formatMessage(messages['id.verification.photo.upload.help.button']) : props.intl.formatMessage(messages['id.verification.photo.camera.help.button'])}
|
||||
</Button>
|
||||
)}
|
||||
</Collapsible>
|
||||
);
|
||||
}
|
||||
|
||||
return null;
|
||||
{useCameraForId
|
||||
? props.intl.formatMessage(messages['id.verification.photo.upload.help.button'])
|
||||
: props.intl.formatMessage(messages['id.verification.photo.camera.help.button'])}
|
||||
</Button>
|
||||
</Collapsible>
|
||||
);
|
||||
}
|
||||
|
||||
CollapsibleImageHelp.propTypes = {
|
||||
intl: intlShape.isRequired,
|
||||
isPortrait: PropTypes.bool.isRequired,
|
||||
};
|
||||
|
||||
export default injectIntl(CollapsibleImageHelp);
|
||||
|
||||
@@ -11,11 +11,6 @@ const messages = defineMessages({
|
||||
defaultMessage: 'support',
|
||||
description: 'Website support.',
|
||||
},
|
||||
'id.verification.continue.upload': {
|
||||
id: 'id.verification.continue.upload',
|
||||
defaultMessage: 'Continue with Upload',
|
||||
description: 'Button to continue with upload.',
|
||||
},
|
||||
'id.verification.example.card.alt': {
|
||||
id: 'id.verification.example.card.alt',
|
||||
defaultMessage: 'Example of a valid identification card with a full name and photo.',
|
||||
@@ -401,26 +396,11 @@ const messages = defineMessages({
|
||||
defaultMessage: 'Take a Photo of Yourself',
|
||||
description: 'Title for the Portrait Photo page if camera access is enabled.',
|
||||
},
|
||||
'id.verification.portrait.photo.title.upload': {
|
||||
id: 'id.verification.portrait.photo.title.upload',
|
||||
defaultMessage: 'Upload a Photo of Yourself',
|
||||
description: 'Title for the Portrait Photo page if camera access is disabled.',
|
||||
},
|
||||
'id.verification.portrait.photo.preview.alt': {
|
||||
id: 'id.verification.portrait.photo.preview.alt',
|
||||
defaultMessage: 'Preview of photo of user\'s face.',
|
||||
description: 'Alt text for the portrait photo preview.',
|
||||
},
|
||||
'id.verification.portrait.photo.instructions.camera': {
|
||||
id: 'id.verification.portrait.photo.instructions.camera',
|
||||
defaultMessage: 'When your face is in position, use the Take Photo button below to take your photo.',
|
||||
description: 'Instructions to use the camera to take a portrait photo..',
|
||||
},
|
||||
'id.verification.portrait.photo.instructions.upload': {
|
||||
id: 'id.verification.portrait.photo.instructions.upload',
|
||||
defaultMessage: 'Please upload a portrait photo. Ensure your entire face fits inside the frame and is well-lit. Supported formats: ',
|
||||
description: 'Instructions for portrait photo upload.',
|
||||
},
|
||||
'id.verification.camera.help.sight.question': {
|
||||
id: 'id.verification.camera.help.sight.question',
|
||||
defaultMessage: 'What if I can\'t see the camera image or if I can\'t see my photo to determine which side is visible?',
|
||||
@@ -451,16 +431,6 @@ const messages = defineMessages({
|
||||
defaultMessage: 'If you require assistance with taking a photo for submission, contact {siteName} support for additional suggestions.',
|
||||
description: 'Confirming what to do if the user has difficult holding their head relative to the camera.',
|
||||
},
|
||||
'id.verification.camera.help.upload.question': {
|
||||
id: 'id.verification.camera.help.upload.question',
|
||||
defaultMessage: 'What if I want to upload a photo instead?',
|
||||
description: 'Question on what to do if the user would like to upload a photo instead.',
|
||||
},
|
||||
'id.verification.camera.help.upload.answer': {
|
||||
id: 'id.verification.camera.help.upload.answer',
|
||||
defaultMessage: 'On the next page you will have the option to switch to upload mode. By selecting that option, you will be able to upload a photo instead.',
|
||||
description: 'Confirming what to do if the user would like to upload a photo.',
|
||||
},
|
||||
'id.verification.id.photo.unclear.question': {
|
||||
id: 'id.verification.id.photo.unclear.question',
|
||||
defaultMessage: 'Is your ID card image not clear or too blurry?',
|
||||
@@ -521,65 +491,25 @@ const messages = defineMessages({
|
||||
defaultMessage: 'The file you have selected is too large. Please try again with a file less than 10MB.',
|
||||
description: 'Error message for file upload that is larger than 10MB.',
|
||||
},
|
||||
'id.verification.account.name.title': {
|
||||
id: 'id.verification.account.name.title',
|
||||
defaultMessage: 'Account Name Check',
|
||||
description: 'Title for the Account Name Check page.',
|
||||
},
|
||||
'id.verification.name.check.title': {
|
||||
id: 'id.verification.name.check.title',
|
||||
defaultMessage: 'Double-Check Your Name',
|
||||
description: 'Title for the page where a user double-checks that their name is correct.',
|
||||
},
|
||||
'id.verification.account.name.instructions': {
|
||||
id: 'id.verification.account.name.instructions',
|
||||
defaultMessage: 'The name on your account and the name on your ID must be an exact match. If not, please click "No" to update your account name.',
|
||||
description: 'Text to verify that the account name matches the name on the ID photo.',
|
||||
},
|
||||
'id.verification.name.check.instructions': {
|
||||
id: 'id.verification.name.check.instructions',
|
||||
defaultMessage: 'Does the name below match the name on your government-issued ID? If not, update the name below to match your goverment-issued ID.',
|
||||
description: 'Text to instruct the user to check that the name displayed on the page matches what is on their government-issued ID.',
|
||||
defaultMessage: 'Does the name below match the name on your photo ID? If not, update the name below to match your photo ID.',
|
||||
description: 'Text to instruct the user to check that the name displayed on the page matches what is on their photo ID.',
|
||||
},
|
||||
'id.verification.name.check.mismatch.information': {
|
||||
id: 'id.verification.name.check.mismatch.information',
|
||||
defaultMessage: 'If the name below does not match your government-issued ID, your identity verification will be denied.',
|
||||
description: 'Text to inform the user that if the name displayed on the page does not match what is on their government-issued ID, identity verification will be denied.',
|
||||
defaultMessage: 'If the name below does not match your photo ID, your identity verification will be denied.',
|
||||
description: 'Text to inform the user that if the name displayed on the page does not match what is on their photo ID, identity verification will be denied.',
|
||||
},
|
||||
'id.verification.account.name.radio.label': {
|
||||
id: 'id.verification.account.name.radio.label',
|
||||
defaultMessage: 'Does the name on your ID match the Account Name below?',
|
||||
description: 'Question to ask the user whether their account name match the name on their ID card.',
|
||||
},
|
||||
'id.verification.name.check.radio.label': {
|
||||
id: 'id.verification.name.check.radio.label',
|
||||
defaultMessage: 'Select an option',
|
||||
description: 'Label for a radio button group where the user needs to choose one of two options.',
|
||||
},
|
||||
'id.verification.account.name.radio.yes': {
|
||||
id: 'id.verification.account.name.radio.yes',
|
||||
defaultMessage: 'Yes',
|
||||
description: 'The radio button that says the account name matches.',
|
||||
},
|
||||
'id.verification.name.check.radio.yes': {
|
||||
id: 'id.verification.name.check.radio.yes',
|
||||
defaultMessage: 'Yes, the name below matches my ID',
|
||||
description: 'Label for a radio button that indicates that the name displayed on the page matches the name on the user\'s ID.',
|
||||
},
|
||||
'id.verification.account.name.radio.no': {
|
||||
id: 'id.verification.account.name.radio.no',
|
||||
defaultMessage: 'No',
|
||||
description: 'The radio button that says the account name does not match.',
|
||||
},
|
||||
'id.verification.name.check.radio.no': {
|
||||
id: 'id.verification.name.check.radio.no',
|
||||
defaultMessage: 'No, the name below does not match my ID',
|
||||
description: 'Label for a radio button that indicates that the name displayed on the page does not match the name on the user\'s ID.',
|
||||
},
|
||||
'id.verification.account.name.error': {
|
||||
id: 'id.verification.account.name.error',
|
||||
defaultMessage: 'Please update account name to match the name on your ID.',
|
||||
description: 'Error that shows when the user needs to update their account name to match the name on their ID.',
|
||||
'id.verification.name.error': {
|
||||
id: 'id.verification.name.error',
|
||||
defaultMessage: 'Please enter your name as it appears on your photo ID.',
|
||||
description: 'Error that shows when the user needs to update their name to match the name on their ID.',
|
||||
},
|
||||
'id.verification.account.name.warning.prefix': {
|
||||
id: 'id.verification.account.name.warning.prefix',
|
||||
@@ -591,11 +521,6 @@ const messages = defineMessages({
|
||||
defaultMessage: 'Account Settings',
|
||||
description: 'Link to Account Settings.',
|
||||
},
|
||||
'id.verification.account.name.label': {
|
||||
id: 'id.verification.account.name.label',
|
||||
defaultMessage: 'Account Name',
|
||||
description: 'Label for account name input.',
|
||||
},
|
||||
'id.verification.name.label': {
|
||||
id: 'id.verification.name.label',
|
||||
defaultMessage: 'Name',
|
||||
@@ -606,11 +531,6 @@ const messages = defineMessages({
|
||||
defaultMessage: 'Photo of your ID to be submitted.',
|
||||
description: 'Alt text for the photo of the user\'s ID.',
|
||||
},
|
||||
'id.verification.account.name.save': {
|
||||
id: 'id.verification.account.name.save',
|
||||
defaultMessage: 'Save and Next',
|
||||
description: 'Button to save the account name.',
|
||||
},
|
||||
'id.verification.review.title': {
|
||||
id: 'id.verification.review.title',
|
||||
defaultMessage: 'Review Your Photos',
|
||||
@@ -688,7 +608,7 @@ const messages = defineMessages({
|
||||
},
|
||||
'id.verification.submitted.text': {
|
||||
id: 'id.verification.submitted.text',
|
||||
defaultMessage: 'We have received your information and are verifying your identity. You will see a message on your dashboard when the verification process is complete (usually within 5 days). In the meantime, you can still access all available course content.',
|
||||
defaultMessage: 'We have received your information and are verifying your identity. You will be notified when the verification process is complete (usually within 5 days). In the meantime, you can still access all available course content.',
|
||||
description: 'Text confirming that ID verification request has been received.',
|
||||
},
|
||||
'id.verification.return.dashboard': {
|
||||
@@ -701,6 +621,11 @@ const messages = defineMessages({
|
||||
defaultMessage: 'Return to Course',
|
||||
description: 'Return to the course which ID verification was accessed from.',
|
||||
},
|
||||
'id.verification.return.generic': {
|
||||
id: 'id.verification.return.generic',
|
||||
defaultMessage: 'Return',
|
||||
description: 'Button to return to the user\'s original location.',
|
||||
},
|
||||
'id.verification.photo.upload.help.title': {
|
||||
id: 'id.verification.photo.upload.help.title',
|
||||
defaultMessage: 'Upload a Photo Instead',
|
||||
@@ -731,26 +656,6 @@ const messages = defineMessages({
|
||||
defaultMessage: 'Switch to Camera Mode',
|
||||
description: 'Button used to switch to camera mode.',
|
||||
},
|
||||
'id.verification.choose.mode.title': {
|
||||
id: 'id.verification.choose.mode.title',
|
||||
defaultMessage: 'Photo Requirements Options',
|
||||
description: 'Title for section that allows user to choose photo mode.',
|
||||
},
|
||||
'id.verification.choose.mode.help.text': {
|
||||
id: 'id.verification.choose.mode.hep.text',
|
||||
defaultMessage: 'To complete verification, please select one of the following options to submit photos. You will be able to switch between these options throughout the process if needed.',
|
||||
description: 'Help text for section that allows user to choose photo mode.',
|
||||
},
|
||||
'id.verification.choose.mode.radio.upload': {
|
||||
id: 'id.verification.choose.mode.radio.upload',
|
||||
defaultMessage: 'Upload photos from my device',
|
||||
description: 'Radio button to choose to upload photos.',
|
||||
},
|
||||
'id.verification.choose.mode.radio.camera': {
|
||||
id: 'id.verification.choose.mode.radio.camera',
|
||||
defaultMessage: 'Take pictures using my camera',
|
||||
description: 'Radio button to choose to use camera for photos.',
|
||||
},
|
||||
});
|
||||
|
||||
export default messages;
|
||||
|
||||
@@ -5,6 +5,7 @@ import { AppContext } from '@edx/frontend-platform/react';
|
||||
import { getProfileDataManager } from '../account-settings/data/service';
|
||||
import PageLoading from '../account-settings/PageLoading';
|
||||
import { useAsyncCall } from '../hooks';
|
||||
import { IDLE_STATUS, LOADING_STATUS, SUCCESS_STATUS } from '../constants';
|
||||
|
||||
import { getExistingIdVerification, getEnrollments } from './data/service';
|
||||
import AccessBlocked from './AccessBlocked';
|
||||
@@ -14,17 +15,10 @@ import { VerifiedNameContext } from './VerifiedNameContext';
|
||||
|
||||
export default function IdVerificationContextProvider({ children }) {
|
||||
const { authenticatedUser } = useContext(AppContext);
|
||||
const { isVerifiedNameHistoryLoading, verifiedName, verifiedNameEnabled } = useContext(VerifiedNameContext);
|
||||
const { verifiedNameHistoryCallStatus, verifiedName } = useContext(VerifiedNameContext);
|
||||
|
||||
// Call verification status endpoint to check whether we can verify.
|
||||
const [existingIdVerification, setExistingIdVerification] = useState(null);
|
||||
const [isIDVerificationLoading, idVerificationData] = useAsyncCall(getExistingIdVerification);
|
||||
const [isEnrollmentsLoading, enrollmentsData] = useAsyncCall(getEnrollments);
|
||||
useEffect(() => {
|
||||
if (idVerificationData) {
|
||||
setExistingIdVerification(idVerificationData);
|
||||
}
|
||||
}, [idVerificationData]);
|
||||
const idVerificationData = useAsyncCall(getExistingIdVerification);
|
||||
const enrollmentsData = useAsyncCall(getEnrollments);
|
||||
|
||||
const [facePhotoFile, setFacePhotoFile] = useState(null);
|
||||
const [idPhotoFile, setIdPhotoFile] = useState(null);
|
||||
@@ -34,36 +28,6 @@ export default function IdVerificationContextProvider({ children }) {
|
||||
hasGetUserMediaSupport ? MEDIA_ACCESS.PENDING : MEDIA_ACCESS.UNSUPPORTED,
|
||||
);
|
||||
|
||||
const [canVerify, setCanVerify] = useState(true);
|
||||
const [error, setError] = useState('');
|
||||
useEffect(() => {
|
||||
// With verified name we can redo verification multiple times
|
||||
// if not a successful request prevents re-verification
|
||||
if (!verifiedNameEnabled && existingIdVerification && !existingIdVerification.canVerify) {
|
||||
const { status } = existingIdVerification;
|
||||
setCanVerify(false);
|
||||
if (status === 'pending' || status === 'approved') {
|
||||
setError(ERROR_REASONS.EXISTING_REQUEST);
|
||||
} else {
|
||||
setError(ERROR_REASONS.CANNOT_VERIFY);
|
||||
}
|
||||
} else if (verifiedNameEnabled) {
|
||||
setCanVerify(true);
|
||||
}
|
||||
}, [existingIdVerification, verifiedNameEnabled]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!isEnrollmentsLoading && enrollmentsData) {
|
||||
const verifiedEnrollments = enrollmentsData.filter((enrollment) => (
|
||||
VERIFIED_MODES.includes(enrollment.mode)
|
||||
));
|
||||
if (verifiedEnrollments.length === 0) {
|
||||
setCanVerify(false);
|
||||
setError(ERROR_REASONS.COURSE_ENROLLMENT);
|
||||
}
|
||||
}
|
||||
}, [enrollmentsData]);
|
||||
|
||||
const [profileDataManager, setProfileDataManager] = useState(null);
|
||||
useEffect(() => {
|
||||
// Determine if the user's profile data is managed by a third-party identity provider.
|
||||
@@ -81,17 +45,31 @@ export default function IdVerificationContextProvider({ children }) {
|
||||
}
|
||||
}, [authenticatedUser]);
|
||||
|
||||
const [optimizelyExperimentName, setOptimizelyExperimentName] = useState('');
|
||||
const [shouldUseCamera, setShouldUseCamera] = useState(false);
|
||||
|
||||
// The following are used to keep track of how a user has submitted photos
|
||||
const [portraitPhotoMode, setPortraitPhotoMode] = useState('');
|
||||
const [idPhotoMode, setIdPhotoMode] = useState('');
|
||||
// Default to upload for the ID image
|
||||
const [useCameraForId, setUseCameraForId] = useState(false);
|
||||
|
||||
// If the user reaches the end of the flow and goes back to retake their photos,
|
||||
// this flag ensures that they are directed straight back to the summary panel
|
||||
const [reachedSummary, setReachedSummary] = useState(false);
|
||||
|
||||
let canVerify = true;
|
||||
let error = '';
|
||||
let existingIdVerification;
|
||||
|
||||
if (idVerificationData?.data) {
|
||||
existingIdVerification = idVerificationData.data;
|
||||
}
|
||||
|
||||
if (enrollmentsData.status === SUCCESS_STATUS && enrollmentsData?.data) {
|
||||
const verifiedEnrollments = enrollmentsData.data.filter((enrollment) => (
|
||||
VERIFIED_MODES.includes(enrollment.mode)
|
||||
));
|
||||
if (verifiedEnrollments.length === 0) {
|
||||
canVerify = false;
|
||||
error = ERROR_REASONS.COURSE_ENROLLMENT;
|
||||
}
|
||||
}
|
||||
|
||||
const contextValue = {
|
||||
existingIdVerification,
|
||||
facePhotoFile,
|
||||
@@ -104,32 +82,23 @@ export default function IdVerificationContextProvider({ children }) {
|
||||
// when determining the context value nameOnAccount.
|
||||
nameOnAccount: verifiedName || authenticatedUser.name,
|
||||
profileDataManager,
|
||||
optimizelyExperimentName,
|
||||
shouldUseCamera,
|
||||
portraitPhotoMode,
|
||||
idPhotoMode,
|
||||
useCameraForId,
|
||||
reachedSummary,
|
||||
setExistingIdVerification,
|
||||
setFacePhotoFile,
|
||||
setIdPhotoFile,
|
||||
setIdPhotoName,
|
||||
setOptimizelyExperimentName,
|
||||
setShouldUseCamera,
|
||||
setPortraitPhotoMode,
|
||||
setIdPhotoMode,
|
||||
setUseCameraForId,
|
||||
setReachedSummary,
|
||||
tryGetUserMedia: async () => {
|
||||
try {
|
||||
const stream = await navigator.mediaDevices.getUserMedia({ video: true });
|
||||
setMediaAccess(MEDIA_ACCESS.GRANTED);
|
||||
setMediaStream(stream);
|
||||
setShouldUseCamera(true);
|
||||
// stop the stream, as we are not using it yet
|
||||
const tracks = stream.getTracks();
|
||||
tracks.forEach(track => track.stop());
|
||||
} catch (err) {
|
||||
setMediaAccess(MEDIA_ACCESS.DENIED);
|
||||
setShouldUseCamera(false);
|
||||
}
|
||||
},
|
||||
stopUserMedia: () => {
|
||||
@@ -141,8 +110,9 @@ export default function IdVerificationContextProvider({ children }) {
|
||||
},
|
||||
};
|
||||
|
||||
// If we are waiting for verification status endpoint, show spinner.
|
||||
if (isIDVerificationLoading || isVerifiedNameHistoryLoading) {
|
||||
const loadingStatuses = [IDLE_STATUS, LOADING_STATUS];
|
||||
// If we are waiting for verification status or verified name history endpoint, show spinner.
|
||||
if (loadingStatuses.includes(idVerificationData.status) || loadingStatuses.includes(verifiedNameHistoryCallStatus)) {
|
||||
return <PageLoading srMessage="Loading verification status" />;
|
||||
}
|
||||
|
||||
|
||||
@@ -3,6 +3,7 @@ import { connect } from 'react-redux';
|
||||
import {
|
||||
Route, Switch, Redirect, useRouteMatch, useLocation,
|
||||
} from 'react-router-dom';
|
||||
import camelCase from 'lodash.camelcase';
|
||||
import qs from 'qs';
|
||||
import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
|
||||
import { Modal, Button } from '@edx/paragon';
|
||||
@@ -13,7 +14,6 @@ import './getUserMediaShim';
|
||||
import IdVerificationContextProvider from './IdVerificationContextProvider';
|
||||
import { VerifiedNameContextProvider } from './VerifiedNameContext';
|
||||
import ReviewRequirementsPanel from './panels/ReviewRequirementsPanel';
|
||||
import ChooseModePanel from './panels/ChooseModePanel';
|
||||
import RequestCameraAccessPanel from './panels/RequestCameraAccessPanel';
|
||||
import PortraitPhotoContextPanel from './panels/PortraitPhotoContextPanel';
|
||||
import TakePortraitPhotoPanel from './panels/TakePortraitPhotoPanel';
|
||||
@@ -32,16 +32,16 @@ function IdVerificationPage(props) {
|
||||
|
||||
const [isModalOpen, setIsModalOpen] = useState(false);
|
||||
|
||||
// Course run key is passed as a query string
|
||||
// Save query params in order to route back to the correct location later
|
||||
useEffect(() => {
|
||||
if (search) {
|
||||
const parsed = qs.parse(search, {
|
||||
const parsedQueryParams = qs.parse(search, {
|
||||
ignoreQueryPrefix: true,
|
||||
interpretNumericEntities: true,
|
||||
});
|
||||
if (Object.prototype.hasOwnProperty.call(parsed, 'course_id') && parsed.course_id) {
|
||||
sessionStorage.setItem('courseRunKey', parsed.course_id);
|
||||
}
|
||||
Object.entries(parsedQueryParams).forEach(([key, value]) => {
|
||||
sessionStorage.setItem(camelCase(key), value);
|
||||
});
|
||||
}
|
||||
}, [search]);
|
||||
|
||||
@@ -56,7 +56,6 @@ function IdVerificationPage(props) {
|
||||
<IdVerificationContextProvider>
|
||||
<Switch>
|
||||
<Route path={`${path}/review-requirements`} component={ReviewRequirementsPanel} />
|
||||
<Route path={`${path}/choose-mode`} component={ChooseModePanel} />
|
||||
<Route path={`${path}/request-camera-access`} component={RequestCameraAccessPanel} />
|
||||
<Route path={`${path}/portrait-photo-context`} component={PortraitPhotoContextPanel} />
|
||||
<Route path={`${path}/take-portrait-photo`} component={TakePortraitPhotoPanel} />
|
||||
|
||||
@@ -5,7 +5,7 @@ import { Alert } from '@edx/paragon';
|
||||
import messages from './IdVerification.messages';
|
||||
import SupportedMediaTypes from './SupportedMediaTypes';
|
||||
|
||||
export default function ImageFileUpload({ onFileChange, setPhotoMode, intl }) {
|
||||
export default function ImageFileUpload({ onFileChange, intl }) {
|
||||
const [error, setError] = useState(null);
|
||||
const errorTypes = {
|
||||
invalidFileType: 'invalidFileType',
|
||||
@@ -28,7 +28,6 @@ export default function ImageFileUpload({ onFileChange, setPhotoMode, intl }) {
|
||||
const fileReader = new FileReader();
|
||||
fileReader.addEventListener('load', () => {
|
||||
onFileChange(fileReader.result);
|
||||
setPhotoMode('upload');
|
||||
});
|
||||
fileReader.readAsDataURL(fileObject);
|
||||
}
|
||||
@@ -59,6 +58,5 @@ export default function ImageFileUpload({ onFileChange, setPhotoMode, intl }) {
|
||||
|
||||
ImageFileUpload.propTypes = {
|
||||
onFileChange: PropTypes.func.isRequired,
|
||||
setPhotoMode: PropTypes.func.isRequired,
|
||||
intl: intlShape.isRequired,
|
||||
};
|
||||
|
||||
@@ -1,32 +1,25 @@
|
||||
import React, { createContext, useEffect, useState } from 'react';
|
||||
import React, { createContext } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
import { getVerifiedNameHistory } from '../account-settings/data/service';
|
||||
import { getMostRecentApprovedOrPendingVerifiedName } from '../utils';
|
||||
import { useAsyncCall } from '../hooks';
|
||||
import { SUCCESS_STATUS } from '../constants';
|
||||
|
||||
export const VerifiedNameContext = createContext();
|
||||
|
||||
export function VerifiedNameContextProvider({ children }) {
|
||||
const [verifiedNameEnabled, setVerifiedNameEnabled] = useState(false);
|
||||
const [verifiedName, setVerifiedName] = useState('');
|
||||
const [isVerifiedNameHistoryLoading, verifiedNameHistory] = useAsyncCall(getVerifiedNameHistory);
|
||||
const verifiedNameHistoryData = useAsyncCall(getVerifiedNameHistory);
|
||||
|
||||
useEffect(() => {
|
||||
if (verifiedNameHistory) {
|
||||
const { verified_name_enabled: verifiedNameFeatureEnabled, results } = verifiedNameHistory;
|
||||
setVerifiedNameEnabled(verifiedNameFeatureEnabled);
|
||||
|
||||
if (verifiedNameFeatureEnabled) {
|
||||
const applicableVerifiedName = getMostRecentApprovedOrPendingVerifiedName(results);
|
||||
setVerifiedName(applicableVerifiedName);
|
||||
}
|
||||
}
|
||||
}, [verifiedNameHistory]);
|
||||
let verifiedName = '';
|
||||
const { status, data } = verifiedNameHistoryData;
|
||||
if (status === SUCCESS_STATUS && data) {
|
||||
const { results } = data;
|
||||
verifiedName = getMostRecentApprovedOrPendingVerifiedName(results);
|
||||
}
|
||||
|
||||
const value = {
|
||||
isVerifiedNameHistoryLoading,
|
||||
verifiedNameEnabled,
|
||||
verifiedNameHistoryCallStatus: status,
|
||||
verifiedName,
|
||||
};
|
||||
|
||||
|
||||
@@ -4,7 +4,8 @@
|
||||
max-width: 100%;
|
||||
}
|
||||
.card.accent {
|
||||
border-top: solid 4px theme-color('warning');
|
||||
border-top-width: 4px;
|
||||
border-top-style: solid;
|
||||
}
|
||||
.image-preview {
|
||||
margin-bottom: 1rem;
|
||||
|
||||
@@ -44,7 +44,7 @@ export async function getEnrollments() {
|
||||
const { data } = await getAuthenticatedHttpClient().get(url, requestConfig);
|
||||
return data;
|
||||
} catch (e) {
|
||||
return [];
|
||||
return {};
|
||||
}
|
||||
}
|
||||
|
||||
@@ -64,9 +64,6 @@ export async function submitIdVerification(verificationData) {
|
||||
facePhotoFile: 'face_image',
|
||||
idPhotoFile: 'photo_id_image',
|
||||
idPhotoName: 'full_name',
|
||||
optimizelyExperimentName: 'experiment_name',
|
||||
portraitPhotoMode: 'portrait_photo_mode',
|
||||
idPhotoMode: 'id_photo_mode',
|
||||
};
|
||||
const postData = {};
|
||||
// Don't include blank/null/undefined values.
|
||||
|
||||
@@ -1,67 +0,0 @@
|
||||
import React, { useContext } from 'react';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { sendTrackEvent } from '@edx/frontend-platform/analytics';
|
||||
import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
|
||||
import { Form } from '@edx/paragon';
|
||||
|
||||
import { useNextPanelSlug } from '../routing-utilities';
|
||||
import BasePanel from './BasePanel';
|
||||
import IdVerificationContext from '../IdVerificationContext';
|
||||
import messages from '../IdVerification.messages';
|
||||
|
||||
function ChooseModePanel(props) {
|
||||
const panelSlug = 'choose-mode';
|
||||
const { userId, shouldUseCamera, setShouldUseCamera } = useContext(IdVerificationContext);
|
||||
|
||||
function onPhotoModeChange(value) {
|
||||
setShouldUseCamera(value);
|
||||
const mode = value ? 'camera' : 'upload';
|
||||
const eventName = `edx.id_verification.choose.${mode}`;
|
||||
sendTrackEvent(eventName, {
|
||||
category: 'id_verification',
|
||||
user_id: userId,
|
||||
});
|
||||
}
|
||||
|
||||
return (
|
||||
<BasePanel
|
||||
name={panelSlug}
|
||||
title={props.intl.formatMessage(messages['id.verification.choose.mode.title'])}
|
||||
>
|
||||
<p>
|
||||
{props.intl.formatMessage(messages['id.verification.choose.mode.help.text'])}
|
||||
</p>
|
||||
<fieldset>
|
||||
<Form.Group controlId="formChoosePhotoOption" style={{ marginLeft: '1.25rem' }}>
|
||||
<Form.Check
|
||||
type="radio"
|
||||
id="useUploadMode"
|
||||
label={props.intl.formatMessage(messages['id.verification.choose.mode.radio.upload'])}
|
||||
name="photoMode"
|
||||
checked={!shouldUseCamera}
|
||||
onChange={() => onPhotoModeChange(false)}
|
||||
/>
|
||||
<Form.Check
|
||||
type="radio"
|
||||
id="useCameraMode"
|
||||
label={props.intl.formatMessage(messages['id.verification.choose.mode.radio.camera'])}
|
||||
name="photoMode"
|
||||
checked={shouldUseCamera}
|
||||
onChange={() => onPhotoModeChange(true)}
|
||||
/>
|
||||
</Form.Group>
|
||||
</fieldset>
|
||||
<div className="action-row">
|
||||
<Link to={useNextPanelSlug(panelSlug)} className="btn btn-primary" data-testid="next-button">
|
||||
{props.intl.formatMessage(messages['id.verification.next'])}
|
||||
</Link>
|
||||
</div>
|
||||
</BasePanel>
|
||||
);
|
||||
}
|
||||
|
||||
ChooseModePanel.propTypes = {
|
||||
intl: intlShape.isRequired,
|
||||
};
|
||||
|
||||
export default injectIntl(ChooseModePanel);
|
||||
@@ -1,91 +1,38 @@
|
||||
import React, {
|
||||
useContext, useState, useEffect, useRef,
|
||||
useContext, useEffect, useRef,
|
||||
} from 'react';
|
||||
import { getConfig } from '@edx/frontend-platform';
|
||||
import { Hyperlink, Form } from '@edx/paragon';
|
||||
import { Form } from '@edx/paragon';
|
||||
import { Link, useHistory } from 'react-router-dom';
|
||||
import { sendTrackEvent } from '@edx/frontend-platform/analytics';
|
||||
import { injectIntl, intlShape, FormattedMessage } from '@edx/frontend-platform/i18n';
|
||||
import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
|
||||
|
||||
import { useNextPanelSlug } from '../routing-utilities';
|
||||
import BasePanel from './BasePanel';
|
||||
import IdVerificationContext from '../IdVerificationContext';
|
||||
import { VerifiedNameContext } from '../VerifiedNameContext';
|
||||
|
||||
import messages from '../IdVerification.messages';
|
||||
|
||||
function GetNameIdPanel(props) {
|
||||
const { push } = useHistory();
|
||||
const panelSlug = 'get-name-id';
|
||||
const [nameMatches, setNameMatches] = useState(true);
|
||||
const { push, location } = useHistory();
|
||||
const nameInputRef = useRef();
|
||||
const panelSlug = 'get-name-id';
|
||||
const nextPanelSlug = useNextPanelSlug(panelSlug);
|
||||
|
||||
const {
|
||||
nameOnAccount, userId, profileDataManager, idPhotoName, setIdPhotoName,
|
||||
} = useContext(IdVerificationContext);
|
||||
const { verifiedNameEnabled } = useContext(VerifiedNameContext);
|
||||
const { nameOnAccount, idPhotoName, setIdPhotoName } = useContext(IdVerificationContext);
|
||||
const nameOnAccountValue = nameOnAccount || '';
|
||||
const invalidName = !nameMatches && (!idPhotoName || idPhotoName === nameOnAccount);
|
||||
const blankName = !nameOnAccount && !idPhotoName;
|
||||
|
||||
useEffect(() => {
|
||||
setIdPhotoName(null);
|
||||
}, []);
|
||||
if (idPhotoName === null) {
|
||||
setIdPhotoName(nameOnAccountValue);
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
if (!nameMatches && nameInputRef.current) {
|
||||
if (location.state?.fromSummary && nameInputRef.current) {
|
||||
nameInputRef.current.focus();
|
||||
}
|
||||
if (!nameMatches) {
|
||||
sendTrackEvent('edx.id_verification.name_change', {
|
||||
category: 'id_verification',
|
||||
user_id: userId,
|
||||
});
|
||||
}
|
||||
if (blankName) {
|
||||
setNameMatches(false);
|
||||
}
|
||||
}, [nameMatches, blankName]);
|
||||
|
||||
function getNameValue() {
|
||||
if (!nameMatches) {
|
||||
// Explicitly check for null, as an empty string should still be used here
|
||||
if (idPhotoName === null) {
|
||||
return nameOnAccountValue;
|
||||
}
|
||||
return idPhotoName;
|
||||
}
|
||||
return nameOnAccountValue;
|
||||
}
|
||||
|
||||
function getErrorMessage() {
|
||||
if (profileDataManager) {
|
||||
return (
|
||||
<FormattedMessage
|
||||
id="id.verification.account.name.managed.alert"
|
||||
defaultMessage="Your profile settings are managed by {managerTitle}, so you are not allowed to update your name. Please contact your {profileDataManager} administrator or {support} for help."
|
||||
description="Alert message informing the user their account name is managed by a third party."
|
||||
values={{
|
||||
managerTitle: <strong>{profileDataManager}</strong>,
|
||||
profileDataManager,
|
||||
support: (
|
||||
<Hyperlink destination={getConfig().SUPPORT_URL} target="_blank">
|
||||
{props.intl.formatMessage(messages['id.verification.support'])}
|
||||
</Hyperlink>
|
||||
),
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
||||
return props.intl.formatMessage(messages['id.verification.account.name.error']);
|
||||
}
|
||||
}, []);
|
||||
|
||||
function handleSubmit(e) {
|
||||
e.preventDefault();
|
||||
// If the input is empty, or if no changes have been made to the
|
||||
// mismatching name, the user should not be able to proceed.
|
||||
if (!invalidName && !blankName) {
|
||||
if (idPhotoName) {
|
||||
push(nextPanelSlug);
|
||||
}
|
||||
}
|
||||
@@ -93,83 +40,38 @@ function GetNameIdPanel(props) {
|
||||
return (
|
||||
<BasePanel
|
||||
name={panelSlug}
|
||||
title={
|
||||
verifiedNameEnabled
|
||||
? props.intl.formatMessage(messages['id.verification.name.check.title'])
|
||||
: props.intl.formatMessage(messages['id.verification.account.name.title'])
|
||||
}
|
||||
title={props.intl.formatMessage(messages['id.verification.name.check.title'])}
|
||||
>
|
||||
<p>
|
||||
{
|
||||
verifiedNameEnabled
|
||||
? props.intl.formatMessage(messages['id.verification.name.check.instructions'])
|
||||
: props.intl.formatMessage(messages['id.verification.account.name.instructions'])
|
||||
}
|
||||
{props.intl.formatMessage(messages['id.verification.name.check.instructions'])}
|
||||
</p>
|
||||
<p>
|
||||
{verifiedNameEnabled && props.intl.formatMessage(messages['id.verification.name.check.mismatch.information'])}
|
||||
{props.intl.formatMessage(messages['id.verification.name.check.mismatch.information'])}
|
||||
</p>
|
||||
|
||||
<Form onSubmit={handleSubmit}>
|
||||
<Form.Group>
|
||||
<Form.Label className="font-weight-bold" htmlFor="nameMatchesYes">
|
||||
{
|
||||
verifiedNameEnabled
|
||||
? props.intl.formatMessage(messages['id.verification.name.check.radio.label'])
|
||||
: props.intl.formatMessage(messages['id.verification.account.name.radio.label'])
|
||||
}
|
||||
</Form.Label>
|
||||
<Form.Check
|
||||
type="radio"
|
||||
id="nameMatchesYes"
|
||||
name="nameMatches"
|
||||
data-testid="name-matches-yes"
|
||||
label={verifiedNameEnabled ? props.intl.formatMessage(messages['id.verification.name.check.radio.yes']) : props.intl.formatMessage(messages['id.verification.account.name.radio.yes'])}
|
||||
checked={nameMatches}
|
||||
disabled={!nameOnAccount}
|
||||
onChange={() => {
|
||||
setNameMatches(true);
|
||||
setIdPhotoName(null);
|
||||
}}
|
||||
/>
|
||||
<Form.Check
|
||||
type="radio"
|
||||
id="nameMatchesNo"
|
||||
name="nameMatches"
|
||||
data-testid="name-matches-no"
|
||||
label={verifiedNameEnabled ? props.intl.formatMessage(messages['id.verification.name.check.radio.no']) : props.intl.formatMessage(messages['id.verification.account.name.radio.no'])}
|
||||
checked={!nameMatches}
|
||||
disabled={!nameOnAccount}
|
||||
onChange={() => setNameMatches(false)}
|
||||
/>
|
||||
</Form.Group>
|
||||
<Form.Group>
|
||||
<Form.Label className="font-weight-bold" htmlFor="photo-id-name">
|
||||
{
|
||||
verifiedNameEnabled
|
||||
? props.intl.formatMessage(messages['id.verification.name.label'])
|
||||
: props.intl.formatMessage(messages['id.verification.account.name.label'])
|
||||
}
|
||||
{props.intl.formatMessage(messages['id.verification.name.label'])}
|
||||
</Form.Label>
|
||||
<Form.Control
|
||||
controlId="photo-id-name"
|
||||
size="lg"
|
||||
type="text"
|
||||
ref={nameInputRef}
|
||||
readOnly={nameMatches || !!profileDataManager}
|
||||
isInvalid={invalidName || blankName}
|
||||
isInvalid={!idPhotoName}
|
||||
aria-describedby="photo-id-name-feedback"
|
||||
value={getNameValue()}
|
||||
value={idPhotoName}
|
||||
onChange={e => setIdPhotoName(e.target.value)}
|
||||
data-testid="name-input"
|
||||
/>
|
||||
{(invalidName || !!profileDataManager) && (
|
||||
{!idPhotoName && (
|
||||
<Form.Control.Feedback
|
||||
id="photo-id-name-feedback"
|
||||
data-testid="id-name-feedback-message"
|
||||
type="invalid"
|
||||
>
|
||||
{getErrorMessage()}
|
||||
{props.intl.formatMessage(messages['id.verification.name.error'])}
|
||||
</Form.Control.Feedback>
|
||||
)}
|
||||
</Form.Group>
|
||||
@@ -178,15 +80,11 @@ function GetNameIdPanel(props) {
|
||||
<div className="action-row">
|
||||
<Link
|
||||
to={nextPanelSlug}
|
||||
className={`btn btn-primary ${(invalidName || blankName) && 'disabled'}`}
|
||||
className={`btn btn-primary ${!idPhotoName && 'disabled'}`}
|
||||
data-testid="next-button"
|
||||
aria-disabled={invalidName || blankName}
|
||||
aria-disabled={!idPhotoName}
|
||||
>
|
||||
{
|
||||
!nameMatches
|
||||
? props.intl.formatMessage(messages['id.verification.account.name.save'])
|
||||
: props.intl.formatMessage(messages['id.verification.next'])
|
||||
}
|
||||
{props.intl.formatMessage(messages['id.verification.next'])}
|
||||
</Link>
|
||||
</div>
|
||||
</BasePanel>
|
||||
|
||||
@@ -17,7 +17,7 @@ function IdContextPanel(props) {
|
||||
title={props.intl.formatMessage(messages['id.verification.id.tips.title'])}
|
||||
>
|
||||
<p>{props.intl.formatMessage(messages['id.verification.id.tips.description'])}</p>
|
||||
<div className="card mb-4 shadow accent">
|
||||
<div className="card mb-4 shadow accent border-warning">
|
||||
<div className="card-body">
|
||||
<h6>
|
||||
{props.intl.formatMessage(messages['id.verification.photo.tips.list.title'])}
|
||||
|
||||
@@ -18,7 +18,7 @@ function PortraitPhotoContextPanel(props) {
|
||||
<p>
|
||||
{props.intl.formatMessage(messages['id.verification.photo.tips.description'])}
|
||||
</p>
|
||||
<div className="card mb-4 shadow accent">
|
||||
<div className="card mb-4 shadow accent border-warning">
|
||||
<div className="card-body">
|
||||
<h6>
|
||||
{props.intl.formatMessage(messages['id.verification.photo.tips.list.title'])}
|
||||
|
||||
@@ -1,10 +1,11 @@
|
||||
import React, { useState, useEffect, useContext } from 'react';
|
||||
import React, { useEffect, useContext } from 'react';
|
||||
import { Link } from 'react-router-dom';
|
||||
import Bowser from 'bowser';
|
||||
import { getConfig } from '@edx/frontend-platform';
|
||||
import { sendTrackEvent } from '@edx/frontend-platform/analytics';
|
||||
import { injectIntl, intlShape, FormattedMessage } from '@edx/frontend-platform/i18n';
|
||||
|
||||
import { useRedirect } from '../../hooks';
|
||||
import { useNextPanelSlug } from '../routing-utilities';
|
||||
import BasePanel from './BasePanel';
|
||||
import IdVerificationContext, { MEDIA_ACCESS } from '../IdVerificationContext';
|
||||
@@ -14,12 +15,11 @@ import { UnsupportedCameraDirectionsPanel } from './UnsupportedCameraDirectionsP
|
||||
import messages from '../IdVerification.messages';
|
||||
|
||||
function RequestCameraAccessPanel(props) {
|
||||
const [returnUrl, setReturnUrl] = useState('dashboard');
|
||||
const [returnText, setReturnText] = useState('id.verification.return.dashboard');
|
||||
const { location: returnUrl, text: returnText } = useRedirect();
|
||||
const panelSlug = 'request-camera-access';
|
||||
const nextPanelSlug = useNextPanelSlug(panelSlug);
|
||||
const {
|
||||
tryGetUserMedia, mediaAccess, userId, optimizelyExperimentName,
|
||||
tryGetUserMedia, mediaAccess, userId,
|
||||
} = useContext(IdVerificationContext);
|
||||
const browserName = Bowser.parse(window.navigator.userAgent).browser.name;
|
||||
|
||||
@@ -38,15 +38,6 @@ function RequestCameraAccessPanel(props) {
|
||||
}
|
||||
}, [mediaAccess, userId]);
|
||||
|
||||
// If the user accessed IDV through a course,
|
||||
// link back to that course rather than the dashboard
|
||||
useEffect(() => {
|
||||
if (sessionStorage.getItem('courseRunKey')) {
|
||||
setReturnUrl(`courses/${sessionStorage.getItem('courseRunKey')}`);
|
||||
setReturnText('id.verification.return.course');
|
||||
}
|
||||
}, []);
|
||||
|
||||
const getTitle = () => {
|
||||
if (mediaAccess === MEDIA_ACCESS.GRANTED) {
|
||||
return props.intl.formatMessage(messages['id.verification.camera.access.title.success']);
|
||||
@@ -57,18 +48,12 @@ function RequestCameraAccessPanel(props) {
|
||||
return props.intl.formatMessage(messages['id.verification.camera.access.title']);
|
||||
};
|
||||
|
||||
const returnToDashboardLink = (
|
||||
const returnLink = (
|
||||
<a className="btn btn-primary" href={`${getConfig().LMS_BASE_URL}/${returnUrl}`}>
|
||||
{props.intl.formatMessage(messages[returnText])}
|
||||
</a>
|
||||
);
|
||||
|
||||
const nextButtonLink = (
|
||||
<Link to={nextPanelSlug} className="btn btn-primary" data-testid="next-button">
|
||||
{props.intl.formatMessage(messages['id.verification.continue.upload'])}
|
||||
</Link>
|
||||
);
|
||||
|
||||
return (
|
||||
<BasePanel
|
||||
name={panelSlug}
|
||||
@@ -114,7 +99,7 @@ function RequestCameraAccessPanel(props) {
|
||||
</p>
|
||||
<EnableCameraDirectionsPanel browserName={browserName} intl={props.intl} />
|
||||
<div className="action-row">
|
||||
{optimizelyExperimentName ? nextButtonLink : returnToDashboardLink}
|
||||
{returnLink}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
@@ -126,7 +111,7 @@ function RequestCameraAccessPanel(props) {
|
||||
</p>
|
||||
<UnsupportedCameraDirectionsPanel browserName={browserName} intl={props.intl} />
|
||||
<div className="action-row">
|
||||
{optimizelyExperimentName ? nextButtonLink : returnToDashboardLink}
|
||||
{returnLink}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -13,31 +13,15 @@ import messages from '../IdVerification.messages';
|
||||
import exampleCard from '../assets/example-card.png';
|
||||
|
||||
function ReviewRequirementsPanel(props) {
|
||||
const {
|
||||
userId, profileDataManager, setOptimizelyExperimentName,
|
||||
} = useContext(IdVerificationContext);
|
||||
const { userId, profileDataManager } = useContext(IdVerificationContext);
|
||||
const panelSlug = 'review-requirements';
|
||||
const nextPanelSlug = useNextPanelSlug(panelSlug);
|
||||
|
||||
const getExperiments = () => {
|
||||
const {
|
||||
experimentVariables: {
|
||||
experimentName = '',
|
||||
} = {},
|
||||
} = window;
|
||||
|
||||
if (experimentName) {
|
||||
setOptimizelyExperimentName(experimentName);
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
sendTrackEvent('edx.id_verification.started', {
|
||||
category: 'id_verification',
|
||||
user_id: userId,
|
||||
});
|
||||
|
||||
getExperiments();
|
||||
}, [userId]);
|
||||
|
||||
function renderManagedProfileMessage() {
|
||||
@@ -77,7 +61,7 @@ function ReviewRequirementsPanel(props) {
|
||||
<p>
|
||||
{props.intl.formatMessage(messages['id.verification.requirements.description'])}
|
||||
</p>
|
||||
<div className="card mb-4 shadow accent">
|
||||
<div className="card mb-4 shadow accent border-warning">
|
||||
<div className="card-body">
|
||||
<h6 aria-level="3">
|
||||
{props.intl.formatMessage(messages['id.verification.requirements.card.device.title'])}
|
||||
@@ -94,7 +78,7 @@ function ReviewRequirementsPanel(props) {
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="card mb-4 shadow accent">
|
||||
<div className="card mb-4 shadow accent border-warning">
|
||||
<div className="card-body">
|
||||
<h6 aria-level="3">
|
||||
{props.intl.formatMessage(messages['id.verification.requirements.card.id.title'])}
|
||||
|
||||
@@ -1,15 +1,18 @@
|
||||
import React, { useEffect, useContext } from 'react';
|
||||
import React, { useContext, useEffect } from 'react';
|
||||
import { getConfig } from '@edx/frontend-platform';
|
||||
import { sendTrackEvent } from '@edx/frontend-platform/analytics';
|
||||
import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
|
||||
|
||||
import BasePanel from './BasePanel';
|
||||
import { useRedirect } from '../../hooks';
|
||||
|
||||
import IdVerificationContext from '../IdVerificationContext';
|
||||
import messages from '../IdVerification.messages';
|
||||
|
||||
import BasePanel from './BasePanel';
|
||||
|
||||
function SubmittedPanel(props) {
|
||||
const { userId } = useContext(IdVerificationContext);
|
||||
const { location: returnUrl, text: returnText } = useRedirect();
|
||||
const panelSlug = 'submitted';
|
||||
|
||||
useEffect(() => {
|
||||
@@ -29,10 +32,10 @@ function SubmittedPanel(props) {
|
||||
</p>
|
||||
<a
|
||||
className="btn btn-primary"
|
||||
href={`${getConfig().LMS_BASE_URL}/dashboard`}
|
||||
href={`${getConfig().LMS_BASE_URL}/${returnUrl}`}
|
||||
data-testid="return-button"
|
||||
>
|
||||
{props.intl.formatMessage(messages['id.verification.return.dashboard'])}
|
||||
{props.intl.formatMessage(messages[returnText])}
|
||||
</a>
|
||||
</BasePanel>
|
||||
);
|
||||
|
||||
@@ -11,7 +11,6 @@ import { useNextPanelSlug } from '../routing-utilities';
|
||||
import BasePanel from './BasePanel';
|
||||
import IdVerificationContext from '../IdVerificationContext';
|
||||
import ImagePreview from '../ImagePreview';
|
||||
import { VerifiedNameContext } from '../VerifiedNameContext';
|
||||
|
||||
import messages from '../IdVerification.messages';
|
||||
import CameraHelpWithUpload from '../CameraHelpWithUpload';
|
||||
@@ -27,12 +26,8 @@ function SummaryPanel(props) {
|
||||
nameOnAccount,
|
||||
idPhotoName,
|
||||
stopUserMedia,
|
||||
optimizelyExperimentName,
|
||||
setReachedSummary,
|
||||
portraitPhotoMode,
|
||||
idPhotoMode,
|
||||
} = useContext(IdVerificationContext);
|
||||
const { verifiedNameEnabled } = useContext(VerifiedNameContext);
|
||||
const nameToBeUsed = idPhotoName || nameOnAccount || '';
|
||||
const [isSubmitting, setIsSubmitting] = useState(false);
|
||||
const [submissionError, setSubmissionError] = useState(null);
|
||||
@@ -74,25 +69,13 @@ function SummaryPanel(props) {
|
||||
};
|
||||
if (idPhotoName) {
|
||||
verificationData.idPhotoName = idPhotoName;
|
||||
} else if (verifiedNameEnabled) {
|
||||
} else {
|
||||
/**
|
||||
* If learner has not entered an idPhotoName on the GetNameIdPanel,
|
||||
* and the verified name feature is enabled, use the current nameOnAccount
|
||||
* when submitting IDV. The reason we only do this if the feature is enabled
|
||||
* is that, when the feature is off, the server will change the learner's
|
||||
* profile name to this value. If we send the idPhotoName on all requests,
|
||||
* even ones where the learner does not change the idPhotoName, then the
|
||||
* server will record that the full name on the learner's profile has
|
||||
* a requested change, even if the name is the same. This will pollute
|
||||
* the history.
|
||||
* use the current nameOnAccount when submitting IDV.
|
||||
*/
|
||||
verificationData.idPhotoName = nameOnAccount;
|
||||
}
|
||||
if (optimizelyExperimentName) {
|
||||
verificationData.optimizelyExperimentName = optimizelyExperimentName;
|
||||
verificationData.portraitPhotoMode = portraitPhotoMode;
|
||||
verificationData.idPhotoMode = idPhotoMode;
|
||||
}
|
||||
const result = await submitIdVerification(verificationData);
|
||||
if (result.success) {
|
||||
stopUserMedia();
|
||||
@@ -217,12 +200,10 @@ function SummaryPanel(props) {
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
{!optimizelyExperimentName && <CameraHelpWithUpload />}
|
||||
<CameraHelpWithUpload />
|
||||
<div className="form-group">
|
||||
<label htmlFor="name-to-be-used" className="font-weight-bold">
|
||||
{verifiedNameEnabled
|
||||
? props.intl.formatMessage(messages['id.verification.name.label'])
|
||||
: props.intl.formatMessage(messages['id.verification.account.name.label'])}
|
||||
{props.intl.formatMessage(messages['id.verification.name.label'])}
|
||||
</label>
|
||||
{renderManagedProfileMessage()}
|
||||
<div className="d-flex">
|
||||
@@ -242,29 +223,14 @@ function SummaryPanel(props) {
|
||||
state: { fromSummary: true },
|
||||
}}
|
||||
>
|
||||
{
|
||||
verifiedNameEnabled
|
||||
? (
|
||||
<FormattedMessage
|
||||
id="id.verification.account.name.edit"
|
||||
defaultMessage="Edit {sr}"
|
||||
description="Button to edit account name, with clarifying information for screen readers."
|
||||
values={{
|
||||
sr: <span className="sr-only">Name</span>,
|
||||
}}
|
||||
/>
|
||||
)
|
||||
: (
|
||||
<FormattedMessage
|
||||
id="id.verification.account.name.edit"
|
||||
defaultMessage="Edit {sr}"
|
||||
description="Button to edit account name, with clarifying information for screen readers."
|
||||
values={{
|
||||
sr: <span className="sr-only">Account Name</span>,
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}
|
||||
<FormattedMessage
|
||||
id="id.verification.account.name.edit"
|
||||
defaultMessage="Edit {sr}"
|
||||
description="Button to edit name, with clarifying information for screen readers."
|
||||
values={{
|
||||
sr: <span className="sr-only">Name</span>,
|
||||
}}
|
||||
/>
|
||||
</Link>
|
||||
)}
|
||||
</div>
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React, { useContext } from 'react';
|
||||
import React, { useContext, useEffect, useState } from 'react';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
|
||||
|
||||
@@ -17,24 +17,36 @@ import SupportedMediaTypes from '../SupportedMediaTypes';
|
||||
function TakeIdPhotoPanel(props) {
|
||||
const panelSlug = 'take-id-photo';
|
||||
const nextPanelSlug = useNextPanelSlug(panelSlug);
|
||||
const {
|
||||
setIdPhotoFile, idPhotoFile, optimizelyExperimentName, shouldUseCamera, setIdPhotoMode,
|
||||
} = useContext(IdVerificationContext);
|
||||
const { setIdPhotoFile, idPhotoFile, useCameraForId } = useContext(IdVerificationContext);
|
||||
const [mounted, setMounted] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
// This prevents focus switching to the heading when taking a photo
|
||||
setMounted(true);
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<BasePanel
|
||||
name={panelSlug}
|
||||
title={shouldUseCamera ? props.intl.formatMessage(messages['id.verification.id.photo.title.camera']) : props.intl.formatMessage(messages['id.verification.id.photo.title.upload'])}
|
||||
focusOnMount={!mounted}
|
||||
title={useCameraForId
|
||||
? props.intl.formatMessage(messages['id.verification.id.photo.title.camera'])
|
||||
: props.intl.formatMessage(messages['id.verification.id.photo.title.upload'])}
|
||||
>
|
||||
<div>
|
||||
{idPhotoFile && !shouldUseCamera && <ImagePreview src={idPhotoFile} alt={props.intl.formatMessage(messages['id.verification.id.photo.preview.alt'])} />}
|
||||
{idPhotoFile && !useCameraForId && (
|
||||
<ImagePreview
|
||||
src={idPhotoFile}
|
||||
alt={props.intl.formatMessage(messages['id.verification.id.photo.preview.alt'])}
|
||||
/>
|
||||
)}
|
||||
|
||||
{shouldUseCamera ? (
|
||||
{useCameraForId ? (
|
||||
<div>
|
||||
<p>
|
||||
{props.intl.formatMessage(messages['id.verification.id.photo.instructions.camera'])}
|
||||
</p>
|
||||
<Camera onImageCapture={setIdPhotoFile} setPhotoMode={setIdPhotoMode} isPortrait={false} />
|
||||
<Camera onImageCapture={setIdPhotoFile} isPortrait={false} />
|
||||
</div>
|
||||
) : (
|
||||
<div style={{ marginBottom: '1.25rem' }}>
|
||||
@@ -42,12 +54,12 @@ function TakeIdPhotoPanel(props) {
|
||||
{props.intl.formatMessage(messages['id.verification.id.photo.instructions.upload'])}
|
||||
<SupportedMediaTypes />
|
||||
</p>
|
||||
<ImageFileUpload onFileChange={setIdPhotoFile} setPhotoMode={setIdPhotoMode} intl={props.intl} />
|
||||
<ImageFileUpload onFileChange={setIdPhotoFile} intl={props.intl} />
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
{shouldUseCamera && !optimizelyExperimentName && <CameraHelp />}
|
||||
<CollapsibleImageHelp isPortrait={false} />
|
||||
{useCameraForId && <CameraHelp />}
|
||||
<CollapsibleImageHelp />
|
||||
<div className="action-row" style={{ visibility: idPhotoFile ? 'unset' : 'hidden' }}>
|
||||
<Link to={nextPanelSlug} className="btn btn-primary" data-testid="next-button">
|
||||
{props.intl.formatMessage(messages['id.verification.next'])}
|
||||
|
||||
@@ -1,53 +1,39 @@
|
||||
import React, { useContext } from 'react';
|
||||
import React, { useContext, useEffect, useState } from 'react';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
|
||||
|
||||
import { useNextPanelSlug } from '../routing-utilities';
|
||||
import BasePanel from './BasePanel';
|
||||
import ImageFileUpload from '../ImageFileUpload';
|
||||
import ImagePreview from '../ImagePreview';
|
||||
import Camera from '../Camera';
|
||||
import CameraHelp from '../CameraHelp';
|
||||
import IdVerificationContext from '../IdVerificationContext';
|
||||
|
||||
import messages from '../IdVerification.messages';
|
||||
import CollapsibleImageHelp from '../CollapsibleImageHelp';
|
||||
import SupportedMediaTypes from '../SupportedMediaTypes';
|
||||
|
||||
function TakePortraitPhotoPanel(props) {
|
||||
const panelSlug = 'take-portrait-photo';
|
||||
const nextPanelSlug = useNextPanelSlug(panelSlug);
|
||||
const {
|
||||
setFacePhotoFile, facePhotoFile, shouldUseCamera, optimizelyExperimentName, setPortraitPhotoMode,
|
||||
} = useContext(IdVerificationContext);
|
||||
const { setFacePhotoFile, facePhotoFile } = useContext(IdVerificationContext);
|
||||
const [mounted, setMounted] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
// This prevents focus switching to the heading when taking a photo
|
||||
setMounted(true);
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<BasePanel
|
||||
name={panelSlug}
|
||||
title={shouldUseCamera ? props.intl.formatMessage(messages['id.verification.portrait.photo.title.camera']) : props.intl.formatMessage(messages['id.verification.portrait.photo.title.upload'])}
|
||||
focusOnMount={!mounted}
|
||||
title={props.intl.formatMessage(messages['id.verification.portrait.photo.title.camera'])}
|
||||
>
|
||||
<div>
|
||||
{facePhotoFile && !shouldUseCamera && <ImagePreview src={facePhotoFile} alt={props.intl.formatMessage(messages['id.verification.portrait.photo.preview.alt'])} />}
|
||||
|
||||
{shouldUseCamera ? (
|
||||
<div>
|
||||
<p>
|
||||
{props.intl.formatMessage(messages['id.verification.portrait.photo.instructions.camera'])}
|
||||
</p>
|
||||
<Camera onImageCapture={setFacePhotoFile} setPhotoMode={setPortraitPhotoMode} isPortrait />
|
||||
</div>
|
||||
) : (
|
||||
<div style={{ marginBottom: '1.25rem' }}>
|
||||
<p data-testid="upload-text">
|
||||
{props.intl.formatMessage(messages['id.verification.portrait.photo.instructions.upload'])}
|
||||
<SupportedMediaTypes />
|
||||
</p>
|
||||
<ImageFileUpload onFileChange={setFacePhotoFile} setPhotoMode={setPortraitPhotoMode} intl={props.intl} />
|
||||
</div>
|
||||
)}
|
||||
<p>
|
||||
{props.intl.formatMessage(messages['id.verification.portrait.photo.instructions.camera'])}
|
||||
</p>
|
||||
<Camera onImageCapture={setFacePhotoFile} isPortrait />
|
||||
</div>
|
||||
{shouldUseCamera && !optimizelyExperimentName && <CameraHelp isPortrait />}
|
||||
<CollapsibleImageHelp isPortrait />
|
||||
<CameraHelp isPortrait />
|
||||
<div className="action-row" style={{ visibility: facePhotoFile ? 'unset' : 'hidden' }}>
|
||||
<Link to={nextPanelSlug} className="btn btn-primary" data-testid="next-button">
|
||||
{props.intl.formatMessage(messages['id.verification.next'])}
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
import { useContext } from 'react';
|
||||
import { useLocation } from 'react-router-dom';
|
||||
import IdVerificationContext, { MEDIA_ACCESS } from './IdVerificationContext';
|
||||
import IdVerificationContext from './IdVerificationContext';
|
||||
|
||||
const SLUGS = {
|
||||
REVIEW_REQUIREMENTS: 'review-requirements',
|
||||
@@ -17,7 +16,6 @@ const SLUGS = {
|
||||
|
||||
const panelSteps = [
|
||||
SLUGS.REVIEW_REQUIREMENTS,
|
||||
SLUGS.CHOOSE_MODE,
|
||||
SLUGS.REQUEST_CAMERA_ACCESS,
|
||||
SLUGS.PORTRAIT_PHOTO_CONTEXT,
|
||||
SLUGS.TAKE_PORTRAIT_PHOTO,
|
||||
@@ -31,15 +29,7 @@ const panelSteps = [
|
||||
// eslint-disable-next-line import/prefer-default-export
|
||||
export const useNextPanelSlug = (originSlug) => {
|
||||
// Go back to the summary view if that's where they came from
|
||||
const location = useLocation();
|
||||
const isFromPortrait = location.state && location.state.fromPortraitCapture;
|
||||
const isFromId = location.state && location.state.fromIdCapture;
|
||||
const {
|
||||
mediaAccess,
|
||||
optimizelyExperimentName,
|
||||
reachedSummary,
|
||||
shouldUseCamera,
|
||||
} = useContext(IdVerificationContext);
|
||||
const { reachedSummary } = useContext(IdVerificationContext);
|
||||
|
||||
const canRerouteToSummary = [
|
||||
SLUGS.TAKE_PORTRAIT_PHOTO,
|
||||
@@ -51,32 +41,6 @@ export const useNextPanelSlug = (originSlug) => {
|
||||
return SLUGS.SUMMARY;
|
||||
}
|
||||
|
||||
// the following are used as part of an A/B experiment
|
||||
if (isFromPortrait) {
|
||||
if (mediaAccess === MEDIA_ACCESS.GRANTED) {
|
||||
return SLUGS.PORTRAIT_PHOTO_CONTEXT;
|
||||
}
|
||||
return SLUGS.TAKE_PORTRAIT_PHOTO;
|
||||
}
|
||||
if (isFromId) {
|
||||
if (mediaAccess === MEDIA_ACCESS.GRANTED) {
|
||||
return SLUGS.ID_CONTEXT;
|
||||
}
|
||||
return SLUGS.TAKE_ID_PHOTO;
|
||||
}
|
||||
if (originSlug === SLUGS.REVIEW_REQUIREMENTS && !optimizelyExperimentName) {
|
||||
return SLUGS.REQUEST_CAMERA_ACCESS;
|
||||
}
|
||||
if (originSlug === SLUGS.CHOOSE_MODE && !shouldUseCamera) {
|
||||
return SLUGS.TAKE_PORTRAIT_PHOTO;
|
||||
}
|
||||
if (originSlug === SLUGS.TAKE_PORTRAIT_PHOTO && !shouldUseCamera) {
|
||||
return SLUGS.TAKE_ID_PHOTO;
|
||||
}
|
||||
if (originSlug === SLUGS.REQUEST_CAMERA_ACCESS && mediaAccess !== MEDIA_ACCESS.GRANTED) {
|
||||
return SLUGS.TAKE_PORTRAIT_PHOTO;
|
||||
}
|
||||
|
||||
const nextIndex = panelSteps.indexOf(originSlug) + 1;
|
||||
return nextIndex < panelSteps.length ? panelSteps[nextIndex] : null;
|
||||
};
|
||||
@@ -84,11 +48,8 @@ export const useNextPanelSlug = (originSlug) => {
|
||||
// check if the user is too far into the flow and if so, return the slug of the
|
||||
// furthest panel they are allow to be.
|
||||
export const useVerificationRedirectSlug = (slug) => {
|
||||
const { facePhotoFile, idPhotoFile, optimizelyExperimentName } = useContext(IdVerificationContext);
|
||||
const { facePhotoFile, idPhotoFile } = useContext(IdVerificationContext);
|
||||
const indexOfCurrentPanel = panelSteps.indexOf(slug);
|
||||
if (!optimizelyExperimentName && slug === SLUGS.CHOOSE_MODE) {
|
||||
return SLUGS.REVIEW_REQUIREMENTS;
|
||||
}
|
||||
if (!facePhotoFile) {
|
||||
if (indexOfCurrentPanel > panelSteps.indexOf(SLUGS.TAKE_PORTRAIT_PHOTO)) {
|
||||
return SLUGS.PORTRAIT_PHOTO_CONTEXT;
|
||||
|
||||
@@ -67,7 +67,7 @@ describe('AccessBlocked', () => {
|
||||
</Router>
|
||||
)));
|
||||
|
||||
const text = screen.getByText(/You cannot verify your identity at this time./);
|
||||
const text = screen.getByText(/We cannot verify your identity at this time./);
|
||||
|
||||
expect(text).toBeInTheDocument();
|
||||
});
|
||||
|
||||
@@ -27,7 +27,6 @@ describe('SubmittedPanel', () => {
|
||||
const defaultProps = {
|
||||
intl: {},
|
||||
onImageCapture: jest.fn(),
|
||||
setPhotoMode: jest.fn(),
|
||||
isPortrait: true,
|
||||
};
|
||||
|
||||
@@ -57,7 +56,6 @@ describe('SubmittedPanel', () => {
|
||||
expect(button).toHaveTextContent('Take Photo');
|
||||
fireEvent.click(button);
|
||||
expect(defaultProps.onImageCapture).toHaveBeenCalled();
|
||||
expect(defaultProps.setPhotoMode).toHaveBeenCalledWith('camera');
|
||||
});
|
||||
|
||||
it('shows correct help text for portrait photo capture', async () => {
|
||||
|
||||
@@ -2,7 +2,7 @@ import React from 'react';
|
||||
import { Router } from 'react-router-dom';
|
||||
import { createMemoryHistory } from 'history';
|
||||
import {
|
||||
render, cleanup, screen, act, fireEvent,
|
||||
render, cleanup, screen, act,
|
||||
} from '@testing-library/react';
|
||||
import { injectIntl, IntlProvider } from '@edx/frontend-platform/i18n';
|
||||
import * as analytics from '@edx/frontend-platform/analytics';
|
||||
@@ -22,71 +22,18 @@ const IntlCollapsible = injectIntl(CollapsibleImageHelp);
|
||||
const history = createMemoryHistory();
|
||||
|
||||
describe('CollapsibleImageHelpPanel', () => {
|
||||
const defaultProps = {
|
||||
intl: {},
|
||||
isPortrait: true,
|
||||
};
|
||||
const defaultProps = { intl: {} };
|
||||
|
||||
const contextValue = {
|
||||
shouldUseCamera: true,
|
||||
setShouldUseCamera: jest.fn(),
|
||||
optimizelyExperimentName: '',
|
||||
mediaAccess: 'granted',
|
||||
useCameraForId: true,
|
||||
setUseCameraForId: jest.fn(),
|
||||
};
|
||||
|
||||
afterEach(() => {
|
||||
cleanup();
|
||||
});
|
||||
|
||||
it('does not return if not part of experiment', async () => {
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlCollapsible {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
|
||||
const titleText = screen.queryByText('Upload a Photo Instead');
|
||||
expect(titleText).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('does not return if media access denied or unsupported', async () => {
|
||||
let titleText = '';
|
||||
contextValue.mediaAccess = 'denied';
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlCollapsible {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
|
||||
titleText = screen.queryByText('Upload a Photo Instead');
|
||||
expect(titleText).not.toBeInTheDocument();
|
||||
|
||||
contextValue.mediaAccess = 'unsupported';
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlCollapsible {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
|
||||
titleText = screen.queryByText('Upload a Photo Instead');
|
||||
expect(titleText).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('shows the correct text if user should switch to upload', async () => {
|
||||
contextValue.optimizelyExperimentName = 'test';
|
||||
contextValue.mediaAccess = 'granted';
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
@@ -106,9 +53,7 @@ describe('CollapsibleImageHelpPanel', () => {
|
||||
});
|
||||
|
||||
it('shows the correct text if user should switch to camera', async () => {
|
||||
contextValue.optimizelyExperimentName = 'test';
|
||||
contextValue.mediaAccess = 'granted';
|
||||
contextValue.shouldUseCamera = false;
|
||||
contextValue.useCameraForId = false;
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
@@ -126,27 +71,4 @@ describe('CollapsibleImageHelpPanel', () => {
|
||||
const button = screen.getByTestId('toggle-button');
|
||||
expect(button).toHaveTextContent('Switch to Camera Mode');
|
||||
});
|
||||
|
||||
it('shows the correct text if user should switch to camera with pending media access', async () => {
|
||||
contextValue.optimizelyExperimentName = 'test';
|
||||
contextValue.mediaAccess = 'pending';
|
||||
contextValue.shouldUseCamera = false;
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlCollapsible {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
|
||||
const titleText = screen.getByText('Use Your Camera Instead');
|
||||
expect(titleText).toBeInTheDocument();
|
||||
const helpText = screen.getByTestId('help-text');
|
||||
expect(helpText.textContent).toContain('If you are having trouble uploading a photo above');
|
||||
const accessLink = screen.getByTestId('access-link');
|
||||
fireEvent.click(accessLink);
|
||||
expect(history.location.pathname).toEqual('/request-camera-access');
|
||||
});
|
||||
});
|
||||
|
||||
@@ -16,8 +16,8 @@ jest.mock('../../account-settings/data/service', () => ({
|
||||
}));
|
||||
|
||||
jest.mock('../data/service', () => ({
|
||||
getExistingIdVerification: jest.fn(),
|
||||
getEnrollments: jest.fn(() => []),
|
||||
getExistingIdVerification: jest.fn(() => ({})),
|
||||
getEnrollments: jest.fn(() => ({})),
|
||||
}));
|
||||
|
||||
describe('IdVerificationContextProvider', () => {
|
||||
@@ -32,7 +32,7 @@ describe('IdVerificationContextProvider', () => {
|
||||
|
||||
it('renders correctly and calls getExistingIdVerification + getEnrollments', async () => {
|
||||
const appContext = { authenticatedUser: { userId: 3, roles: [] } };
|
||||
const verifiedNameContext = { verifiedName: '', verifiedNameEnabled: false };
|
||||
const verifiedNameContext = { verifiedName: '' };
|
||||
await act(async () => render((
|
||||
<AppContext.Provider value={appContext}>
|
||||
<VerifiedNameContext.Provider value={verifiedNameContext}>
|
||||
@@ -54,7 +54,7 @@ describe('IdVerificationContextProvider', () => {
|
||||
roles: ['enterprise_learner'],
|
||||
},
|
||||
};
|
||||
const verifiedNameContext = { verifiedName: '', verifiedNameEnabled: false };
|
||||
const verifiedNameContext = { verifiedName: '' };
|
||||
await act(async () => render((
|
||||
<AppContext.Provider value={appContext}>
|
||||
<VerifiedNameContext.Provider value={verifiedNameContext}>
|
||||
|
||||
@@ -41,36 +41,8 @@ describe('IdVerificationPage', () => {
|
||||
intl: {},
|
||||
};
|
||||
|
||||
it('does not store irrelevant query params', async () => {
|
||||
history.push('/?test=irrelevant');
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<Provider store={store}>
|
||||
<IntlIdVerificationPage {...props} />
|
||||
</Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
expect(sessionStorage.setItem).toHaveBeenCalledTimes(0);
|
||||
});
|
||||
|
||||
it('does not store empty course_id', async () => {
|
||||
history.push('/?course_id=');
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<Provider store={store}>
|
||||
<IntlIdVerificationPage {...props} />
|
||||
</Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
expect(sessionStorage.setItem).toHaveBeenCalledTimes(0);
|
||||
});
|
||||
|
||||
it('decodes and stores course_id', async () => {
|
||||
history.push('/?course_id=course-v1%3AedX%2BDemoX%2BDemo_Course');
|
||||
history.push(`/?course_id=${encodeURIComponent('course-v1:edX+DemoX+Demo_Course')}`);
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
@@ -81,8 +53,25 @@ describe('IdVerificationPage', () => {
|
||||
</Router>
|
||||
)));
|
||||
expect(sessionStorage.setItem).toHaveBeenCalledWith(
|
||||
'courseRunKey',
|
||||
'courseId',
|
||||
'course-v1:edX+DemoX+Demo_Course',
|
||||
);
|
||||
});
|
||||
|
||||
it('stores `next` value', async () => {
|
||||
history.push('/?next=dashboard');
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<Provider store={store}>
|
||||
<IntlIdVerificationPage {...props} />
|
||||
</Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
expect(sessionStorage.setItem).toHaveBeenCalledWith(
|
||||
'next',
|
||||
'dashboard',
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -5,17 +5,16 @@ import { getVerifiedNameHistory } from '../../account-settings/data/service';
|
||||
import { VerifiedNameContext, VerifiedNameContextProvider } from '../VerifiedNameContext';
|
||||
|
||||
const VerifiedNameContextTestComponent = () => {
|
||||
const { verifiedName, verifiedNameEnabled } = useContext(VerifiedNameContext);
|
||||
const { verifiedName } = useContext(VerifiedNameContext);
|
||||
return (
|
||||
<>
|
||||
{verifiedNameEnabled && (<div data-testid="verified-name">{verifiedName}</div>)}
|
||||
<div data-testid="verified-name-enabled">{verifiedNameEnabled ? 'true' : 'false'}</div>
|
||||
{verifiedName && (<div data-testid="verified-name">{verifiedName}</div>)}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
jest.mock('../../account-settings/data/service', () => ({
|
||||
getVerifiedNameHistory: jest.fn(),
|
||||
getVerifiedNameHistory: jest.fn(() => ({})),
|
||||
}));
|
||||
|
||||
describe('VerifiedNameContextProvider', () => {
|
||||
@@ -31,16 +30,15 @@ describe('VerifiedNameContextProvider', () => {
|
||||
|
||||
it('calls getVerifiedNameHistory', async () => {
|
||||
jest.mock('../../account-settings/data/service', () => ({
|
||||
getVerifiedNameHistory: jest.fn(),
|
||||
getVerifiedNameHistory: jest.fn(() => ({})),
|
||||
}));
|
||||
|
||||
render(<VerifiedNameContextProvider {...defaultProps} />);
|
||||
expect(getVerifiedNameHistory).toHaveBeenCalledTimes(1);
|
||||
await waitFor(() => expect(getVerifiedNameHistory).toHaveBeenCalledTimes(1));
|
||||
});
|
||||
|
||||
it('sets verifiedName and verifiedNameEnabled correctly when verified name feature enabled', async () => {
|
||||
it('sets verifiedName', async () => {
|
||||
const mockReturnValue = {
|
||||
verified_name_enabled: true,
|
||||
results: [{
|
||||
verified_name: 'Michael',
|
||||
status: 'approved',
|
||||
@@ -57,28 +55,5 @@ describe('VerifiedNameContextProvider', () => {
|
||||
|
||||
await waitFor(() => expect(getVerifiedNameHistory).toHaveBeenCalledTimes(1));
|
||||
expect(getByTestId('verified-name')).toHaveTextContent('Michael');
|
||||
expect(getByTestId('verified-name-enabled')).toHaveTextContent('true');
|
||||
});
|
||||
|
||||
it('sets verifiedName and verifiedNameEnabled correctly when verified name feature not enabled', async () => {
|
||||
const mockReturnValue = {
|
||||
verified_name_enabled: false,
|
||||
results: [{
|
||||
verified_name: 'Michael',
|
||||
status: 'approved',
|
||||
created: '2021-08-31T18:33:32.489200Z',
|
||||
}],
|
||||
};
|
||||
getVerifiedNameHistory.mockReturnValueOnce(mockReturnValue);
|
||||
|
||||
const { queryByTestId } = render((
|
||||
<VerifiedNameContextProvider {...defaultProps}>
|
||||
<VerifiedNameContextTestComponent />
|
||||
</VerifiedNameContextProvider>
|
||||
));
|
||||
|
||||
await waitFor(() => expect(getVerifiedNameHistory).toHaveBeenCalledTimes(1));
|
||||
expect(queryByTestId('verified-name')).toBeNull();
|
||||
expect(queryByTestId('verified-name-enabled')).toHaveTextContent('false');
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1,110 +0,0 @@
|
||||
import React from 'react';
|
||||
import { Router } from 'react-router-dom';
|
||||
import { createMemoryHistory } from 'history';
|
||||
import {
|
||||
render, cleanup, act, screen, fireEvent,
|
||||
} from '@testing-library/react';
|
||||
import { injectIntl, IntlProvider } from '@edx/frontend-platform/i18n';
|
||||
import IdVerificationContext from '../../IdVerificationContext';
|
||||
import ChooseModePanel from '../../panels/ChooseModePanel';
|
||||
|
||||
jest.mock('@edx/frontend-platform/analytics', () => ({
|
||||
sendTrackEvent: jest.fn(),
|
||||
}));
|
||||
|
||||
const IntlChooseModePanel = injectIntl(ChooseModePanel);
|
||||
|
||||
const history = createMemoryHistory();
|
||||
|
||||
describe('ChooseModePanel', () => {
|
||||
const defaultProps = {
|
||||
intl: {},
|
||||
};
|
||||
|
||||
const contextValue = {
|
||||
optimizelyExperimentName: 'test',
|
||||
shouldUseCamera: false,
|
||||
reachedSummary: false,
|
||||
};
|
||||
|
||||
afterEach(() => {
|
||||
cleanup();
|
||||
});
|
||||
|
||||
it('renders correctly', async () => {
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlChooseModePanel {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
|
||||
// check that radio button for upload is selected
|
||||
const uploadRadioButton = await screen.findByLabelText('Upload photos from my device');
|
||||
expect(uploadRadioButton).toBeChecked();
|
||||
|
||||
// check that if upload is selected, next button goes to correct screen
|
||||
const nextButton = await screen.findByTestId('next-button');
|
||||
expect(nextButton.getAttribute('href')).toEqual('/take-portrait-photo');
|
||||
});
|
||||
|
||||
it('renders correctly if user wants to use camera', async () => {
|
||||
contextValue.shouldUseCamera = true;
|
||||
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlChooseModePanel {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
|
||||
// check that radio button for camera is selected
|
||||
const cameraRadioButton = await screen.findByLabelText('Take pictures using my camera');
|
||||
expect(cameraRadioButton).toBeChecked();
|
||||
|
||||
// check that if upload is selected, next button goes to correct screen
|
||||
const nextButton = await screen.findByTestId('next-button');
|
||||
expect(nextButton.getAttribute('href')).toEqual('/request-camera-access');
|
||||
});
|
||||
|
||||
it('reroutes correctly if reachedSummary is true', async () => {
|
||||
contextValue.shouldUseCamera = true;
|
||||
contextValue.reachedSummary = true;
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlChooseModePanel {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
const nextButton = await screen.findByTestId('next-button');
|
||||
fireEvent.click(nextButton);
|
||||
expect(history.location.pathname).toEqual('/request-camera-access');
|
||||
});
|
||||
|
||||
it('redirects if user is not part of experiment', async () => {
|
||||
contextValue.optimizelyExperimentName = '';
|
||||
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlChooseModePanel {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
|
||||
// check that radio button is not in document
|
||||
const cameraRadioButton = await screen.queryByLabelText('Take pictures using my camera');
|
||||
expect(cameraRadioButton).not.toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
@@ -32,16 +32,14 @@ describe('GetNameIdPanel', () => {
|
||||
idPhotoFile: 'test.jpg',
|
||||
};
|
||||
|
||||
const verifiedNameContextValue = {
|
||||
verifiedNameEnabled: false,
|
||||
};
|
||||
const verifiedNameContextValue = {};
|
||||
|
||||
const getPanel = async () => {
|
||||
const getPanel = async (idVerificationContextValue = IDVerificationContextValue) => {
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<VerifiedNameContext.Provider value={verifiedNameContextValue}>
|
||||
<IdVerificationContext.Provider value={IDVerificationContextValue}>
|
||||
<IdVerificationContext.Provider value={idVerificationContextValue}>
|
||||
<IntlGetNameIdPanel {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</VerifiedNameContext.Provider>
|
||||
@@ -54,65 +52,28 @@ describe('GetNameIdPanel', () => {
|
||||
cleanup();
|
||||
});
|
||||
|
||||
it('edits', async () => {
|
||||
it('shows feedback message when user has an empty name', async () => {
|
||||
await getPanel();
|
||||
|
||||
const yesButton = await screen.findByTestId('name-matches-yes');
|
||||
const noButton = await screen.findByTestId('name-matches-no');
|
||||
const input = await screen.findByTestId('name-input');
|
||||
const nextButton = await screen.findByTestId('next-button');
|
||||
const errorMessageQuery = await screen.queryByTestId('id-name-feedback-message');
|
||||
|
||||
expect(input).toHaveAttribute('readonly');
|
||||
expect(errorMessageQuery).toBeNull();
|
||||
|
||||
fireEvent.click(noButton);
|
||||
expect(input).not.toHaveAttribute('readonly');
|
||||
expect(nextButton.classList.contains('disabled')).toBe(true);
|
||||
expect(nextButton).toHaveAttribute('aria-disabled');
|
||||
|
||||
fireEvent.change(input, { target: { value: 'test change' } });
|
||||
expect(IDVerificationContextValue.setIdPhotoName).toHaveBeenCalled();
|
||||
// Ensure the feedback message on name shows when the user says the name does not match ID
|
||||
// Ensure the feedback message on name shows when the user has an empty name
|
||||
expect(await screen.queryByTestId('id-name-feedback-message')).toBeTruthy();
|
||||
|
||||
fireEvent.click(yesButton);
|
||||
expect(input).toHaveAttribute('readonly');
|
||||
expect(IDVerificationContextValue.setIdPhotoName).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it('disables radio buttons + next button and enables input if account name is blank', async () => {
|
||||
IDVerificationContextValue.nameOnAccount = '';
|
||||
await getPanel();
|
||||
|
||||
const yesButton = await screen.findByTestId('name-matches-yes');
|
||||
const noButton = await screen.findByTestId('name-matches-no');
|
||||
const input = await screen.findByTestId('name-input');
|
||||
const nextButton = await screen.findByTestId('next-button');
|
||||
const errorMessageQuery = await screen.queryByTestId('id-name-feedback-message');
|
||||
|
||||
expect(yesButton).toBeDisabled();
|
||||
expect(noButton).toBeDisabled();
|
||||
expect(input).not.toHaveAttribute('readonly');
|
||||
expect(nextButton.classList.contains('disabled')).toBe(true);
|
||||
expect(nextButton).toHaveAttribute('aria-disabled');
|
||||
expect(errorMessageQuery).toBeTruthy();
|
||||
it('does not show feedback message when user has an non-empty name', async () => {
|
||||
const idVerificationContextValue = {
|
||||
...IDVerificationContextValue,
|
||||
idPhotoName: 'test',
|
||||
};
|
||||
await getPanel(idVerificationContextValue);
|
||||
// Ensure the feedback message on name shows when the user has an empty name
|
||||
expect(await screen.queryByTestId('id-name-feedback-message')).toBeNull();
|
||||
});
|
||||
|
||||
it('blocks the user from changing account name if managed by a third party', async () => {
|
||||
IDVerificationContextValue.profileDataManager = 'test-org';
|
||||
it('calls setIdPhotoName with correct name', async () => {
|
||||
await getPanel();
|
||||
|
||||
const noButton = await screen.findByTestId('name-matches-no');
|
||||
const input = await screen.findByTestId('name-input');
|
||||
const nextButton = await screen.findByTestId('next-button');
|
||||
|
||||
fireEvent.click(noButton);
|
||||
expect(input).toHaveAttribute('readonly');
|
||||
expect(nextButton.classList.contains('disabled')).toBe(true);
|
||||
expect(nextButton).toHaveAttribute('aria-disabled');
|
||||
const warning = await screen.getAllByText('test-org');
|
||||
expect(warning.length).toEqual(1);
|
||||
fireEvent.change(input, { target: { value: 'test' } });
|
||||
expect(IDVerificationContextValue.setIdPhotoName).toHaveBeenCalledWith('test');
|
||||
});
|
||||
|
||||
it('routes to SummaryPanel', async () => {
|
||||
|
||||
@@ -23,7 +23,6 @@ describe('IdContextPanel', () => {
|
||||
};
|
||||
|
||||
const contextValue = {
|
||||
optimizelyExperimentName: '',
|
||||
facePhotoFile: 'test.jpg',
|
||||
reachedSummary: false,
|
||||
};
|
||||
@@ -62,33 +61,4 @@ describe('IdContextPanel', () => {
|
||||
fireEvent.click(button);
|
||||
expect(history.location.pathname).toEqual('/take-id-photo');
|
||||
});
|
||||
|
||||
it('does not show help text for photo upload if not part of experiment', async () => {
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlIdContextPanel {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
const title = await screen.queryByText('What if I want to upload a photo instead?');
|
||||
expect(title).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('shows help text for photo upload if part of experiment', async () => {
|
||||
contextValue.optimizelyExperimentName = 'test';
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlIdContextPanel {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
const title = await screen.queryByText('What if I want to upload a photo instead?');
|
||||
expect(title).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
||||
@@ -22,10 +22,7 @@ describe('PortraitPhotoContextPanel', () => {
|
||||
intl: {},
|
||||
};
|
||||
|
||||
const contextValue = {
|
||||
optimizelyExperimentName: '',
|
||||
reachedSummary: false,
|
||||
};
|
||||
const contextValue = { reachedSummary: false };
|
||||
|
||||
afterEach(() => {
|
||||
cleanup();
|
||||
@@ -61,33 +58,4 @@ describe('PortraitPhotoContextPanel', () => {
|
||||
fireEvent.click(button);
|
||||
expect(history.location.pathname).toEqual('/take-portrait-photo');
|
||||
});
|
||||
|
||||
it('does not show help text for photo upload if not part of experiment', async () => {
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlPortraitPhotoContextPanel {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
const title = await screen.queryByText('What if I want to upload a photo instead?');
|
||||
expect(title).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('shows help text for photo upload if part of experiment', async () => {
|
||||
contextValue.optimizelyExperimentName = 'test';
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlPortraitPhotoContextPanel {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
const title = await screen.queryByText('What if I want to upload a photo instead?');
|
||||
expect(title).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
||||
@@ -5,6 +5,7 @@ import { createMemoryHistory } from 'history';
|
||||
import {
|
||||
render, screen, cleanup, act, fireEvent,
|
||||
} from '@testing-library/react';
|
||||
import { getConfig } from '@edx/frontend-platform';
|
||||
import { injectIntl, IntlProvider } from '@edx/frontend-platform/i18n';
|
||||
import IdVerificationContext from '../../IdVerificationContext';
|
||||
import RequestCameraAccessPanel from '../../panels/RequestCameraAccessPanel';
|
||||
@@ -84,27 +85,6 @@ describe('RequestCameraAccessPanel', () => {
|
||||
expect(text).toHaveTextContent(/It looks like we're unable to access your camera./);
|
||||
});
|
||||
|
||||
it('renders correctly with media access denied in optimizely experiment', async () => {
|
||||
contextValue.mediaAccess = 'denied';
|
||||
contextValue.optimizelyExperimentName = 'test';
|
||||
Bowser.parse = jest.fn().mockReturnValue({ browser: { name: '' } });
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlRequestCameraAccessPanel {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
const text = await screen.findByTestId('camera-access-failure');
|
||||
expect(text).toHaveTextContent(/It looks like we're unable to access your camera./);
|
||||
const nextButton = await screen.findByText('Continue with Upload');
|
||||
fireEvent.click(nextButton);
|
||||
expect(history.location.pathname).toEqual('/take-portrait-photo');
|
||||
contextValue.optimizelyExperimentName = '';
|
||||
});
|
||||
|
||||
it('renders correctly with media access unsupported with Chrome browser', async () => {
|
||||
contextValue.mediaAccess = 'unsupported';
|
||||
Bowser.parse = jest.fn().mockReturnValue({ browser: { name: 'Chrome' } });
|
||||
@@ -203,9 +183,25 @@ describe('RequestCameraAccessPanel', () => {
|
||||
expect(text).toHaveTextContent(/Open the Flash Player/);
|
||||
});
|
||||
|
||||
it('reroutes correctly to portrait context', async () => {
|
||||
it('routes to dashboard when camera access is denied', async () => {
|
||||
contextValue.mediaAccess = 'denied';
|
||||
|
||||
Bowser.parse = jest.fn().mockReturnValue({ browser: { name: '' } });
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlRequestCameraAccessPanel {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
const button = await screen.findByRole('link');
|
||||
expect(button).toHaveAttribute('href', `${getConfig().LMS_BASE_URL}/dashboard`);
|
||||
});
|
||||
|
||||
it('routes correctly to portrait context', async () => {
|
||||
contextValue.mediaAccess = 'granted';
|
||||
history.location.state = { fromPortraitCapture: true };
|
||||
|
||||
Bowser.parse = jest.fn().mockReturnValue({ browser: { name: '' } });
|
||||
await act(async () => render((
|
||||
@@ -221,105 +217,4 @@ describe('RequestCameraAccessPanel', () => {
|
||||
fireEvent.click(button);
|
||||
expect(history.location.pathname).toEqual('/portrait-photo-context');
|
||||
});
|
||||
|
||||
it('reroutes correctly to ID context', async () => {
|
||||
contextValue.mediaAccess = 'granted';
|
||||
history.location.state = { fromIdCapture: true };
|
||||
|
||||
Bowser.parse = jest.fn().mockReturnValue({ browser: { name: '' } });
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlRequestCameraAccessPanel {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
const button = await screen.findByTestId('next-button');
|
||||
fireEvent.click(button);
|
||||
expect(history.location.pathname).toEqual('/id-context');
|
||||
});
|
||||
|
||||
it('reroutes to portrait context when reachedSummary is true', async () => {
|
||||
contextValue.mediaAccess = 'granted';
|
||||
contextValue.reachedSummary = true;
|
||||
history.location.state = { fromPortraitCapture: true };
|
||||
|
||||
Bowser.parse = jest.fn().mockReturnValue({ browser: { name: '' } });
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlRequestCameraAccessPanel {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
const button = await screen.findByTestId('next-button');
|
||||
fireEvent.click(button);
|
||||
expect(history.location.pathname).toEqual('/portrait-photo-context');
|
||||
});
|
||||
|
||||
it('reroutes to ID context when reachedSummary is true', async () => {
|
||||
contextValue.mediaAccess = 'granted';
|
||||
contextValue.reachedSummary = true;
|
||||
history.location.state = { fromIdCapture: true };
|
||||
|
||||
Bowser.parse = jest.fn().mockReturnValue({ browser: { name: '' } });
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlRequestCameraAccessPanel {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
const button = await screen.findByTestId('next-button');
|
||||
fireEvent.click(button);
|
||||
expect(history.location.pathname).toEqual('/id-context');
|
||||
});
|
||||
|
||||
it('reroutes correctly to portrait context with no media access', async () => {
|
||||
contextValue.mediaAccess = 'denied';
|
||||
contextValue.optimizelyExperimentName = 'test';
|
||||
history.location.state = { fromPortraitCapture: true };
|
||||
|
||||
Bowser.parse = jest.fn().mockReturnValue({ browser: { name: '' } });
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlRequestCameraAccessPanel {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
const button = await screen.findByTestId('next-button');
|
||||
fireEvent.click(button);
|
||||
expect(history.location.pathname).toEqual('/take-portrait-photo');
|
||||
contextValue.optimizelyExperimentName = '';
|
||||
});
|
||||
|
||||
it('reroutes correctly to ID context with no media access', async () => {
|
||||
contextValue.mediaAccess = 'denied';
|
||||
contextValue.optimizelyExperimentName = 'test';
|
||||
history.location.state = { fromIdCapture: true };
|
||||
|
||||
Bowser.parse = jest.fn().mockReturnValue({ browser: { name: '' } });
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlRequestCameraAccessPanel {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
const button = await screen.findByTestId('next-button');
|
||||
fireEvent.click(button);
|
||||
expect(history.location.pathname).toEqual('/take-id-photo');
|
||||
contextValue.optimizelyExperimentName = '';
|
||||
});
|
||||
});
|
||||
|
||||
@@ -22,7 +22,7 @@ describe('ReviewRequirementsPanel', () => {
|
||||
intl: {},
|
||||
};
|
||||
|
||||
const context = { setOptimizelyExperimentName: jest.fn() };
|
||||
const context = {};
|
||||
|
||||
const getPanel = async () => {
|
||||
await act(async () => render((
|
||||
@@ -47,13 +47,6 @@ describe('ReviewRequirementsPanel', () => {
|
||||
expect(history.location.pathname).toEqual('/request-camera-access');
|
||||
});
|
||||
|
||||
it('updates optimizely experiment name in context', async () => {
|
||||
window.experimentVariables = {};
|
||||
window.experimentVariables.experimentName = 'test-experiment';
|
||||
await getPanel();
|
||||
expect(context.setOptimizelyExperimentName).toHaveBeenCalledWith('test-experiment');
|
||||
});
|
||||
|
||||
it('displays an alert if the user\'s account information is managed by a third party', async () => {
|
||||
context.profileDataManager = 'test-org';
|
||||
await getPanel();
|
||||
|
||||
@@ -28,14 +28,20 @@ describe('SubmittedPanel', () => {
|
||||
};
|
||||
|
||||
beforeEach(() => {
|
||||
global.sessionStorage.getItem = jest.fn();
|
||||
const mockStorage = {};
|
||||
global.Storage.prototype.setItem = jest.fn((key, value) => {
|
||||
mockStorage[key] = value;
|
||||
});
|
||||
global.Storage.prototype.getItem = jest.fn(key => mockStorage[key]);
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
global.Storage.prototype.setItem.mockReset();
|
||||
global.Storage.prototype.getItem.mockReset();
|
||||
cleanup();
|
||||
});
|
||||
|
||||
it('links to dashboard without courseRunKey', async () => {
|
||||
it('links to dashboard without courseId or next value', async () => {
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
@@ -47,5 +53,38 @@ describe('SubmittedPanel', () => {
|
||||
)));
|
||||
const button = await screen.findByTestId('return-button');
|
||||
expect(button).toHaveTextContent(/Return to Your Dashboard/);
|
||||
expect(button).toHaveAttribute('href', `${process.env.LMS_BASE_URL}/dashboard`);
|
||||
});
|
||||
|
||||
it('links to course when courseId is stored', async () => {
|
||||
sessionStorage.setItem('courseId', 'course-v1:edX+DemoX+Demo_Course');
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlSubmittedPanel {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
const button = await screen.findByTestId('return-button');
|
||||
expect(button).toHaveTextContent(/Return to Course/);
|
||||
expect(button).toHaveAttribute('href', `${process.env.LMS_BASE_URL}/courses/course-v1:edX+DemoX+Demo_Course`);
|
||||
});
|
||||
|
||||
it('links to specified page when `next` value is provided', async () => {
|
||||
sessionStorage.setItem('next', 'some_page');
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlSubmittedPanel {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
const button = await screen.findByTestId('return-button');
|
||||
expect(button).toHaveTextContent(/Return/);
|
||||
expect(button).toHaveAttribute('href', `${process.env.LMS_BASE_URL}/some_page`);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -32,16 +32,11 @@ describe('SummaryPanel', () => {
|
||||
idPhotoFile: 'test.jpg',
|
||||
nameOnAccount: 'test name',
|
||||
idPhotoName: 'test name',
|
||||
optimizelyExperimentName: 'test-experiment',
|
||||
portraitPhotoMode: 'camera',
|
||||
idPhotoMode: 'upload',
|
||||
stopUserMedia: jest.fn(),
|
||||
setReachedSummary: jest.fn(),
|
||||
};
|
||||
|
||||
const verifiedNameContextValue = {
|
||||
verifiedNameEnabled: false,
|
||||
};
|
||||
const verifiedNameContextValue = {};
|
||||
|
||||
const getPanel = async () => {
|
||||
await act(async () => render((
|
||||
@@ -78,13 +73,11 @@ describe('SummaryPanel', () => {
|
||||
});
|
||||
|
||||
it('allows user to upload ID photo', async () => {
|
||||
appContextValue.optimizelyExperimentName = '';
|
||||
await getPanel();
|
||||
const collapsible = await screen.getAllByRole('button', { 'aria-expanded': false })[0];
|
||||
fireEvent.click(collapsible);
|
||||
const uploadButton = await screen.getByTestId('fileUpload');
|
||||
expect(uploadButton).toBeVisible();
|
||||
appContextValue.optimizelyExperimentName = 'test-experiment';
|
||||
});
|
||||
|
||||
it('displays warning if account is managed by a third party', async () => {
|
||||
@@ -99,9 +92,6 @@ describe('SummaryPanel', () => {
|
||||
facePhotoFile: appContextValue.facePhotoFile,
|
||||
idPhotoFile: appContextValue.idPhotoFile,
|
||||
idPhotoName: appContextValue.idPhotoName,
|
||||
optimizelyExperimentName: appContextValue.optimizelyExperimentName,
|
||||
portraitPhotoMode: appContextValue.portraitPhotoMode,
|
||||
idPhotoMode: appContextValue.idPhotoMode,
|
||||
courseRunKey: null,
|
||||
};
|
||||
await getPanel();
|
||||
@@ -111,15 +101,13 @@ describe('SummaryPanel', () => {
|
||||
await waitFor(() => expect(appContextValue.stopUserMedia).toHaveBeenCalled());
|
||||
});
|
||||
|
||||
it('does not submit a name if name is blank', async () => {
|
||||
it('submits a name if name is blank', async () => {
|
||||
appContextValue.idPhotoName = '';
|
||||
const verificationData = {
|
||||
facePhotoFile: appContextValue.facePhotoFile,
|
||||
idPhotoFile: appContextValue.idPhotoFile,
|
||||
portraitPhotoMode: appContextValue.portraitPhotoMode,
|
||||
idPhotoMode: appContextValue.idPhotoMode,
|
||||
optimizelyExperimentName: appContextValue.optimizelyExperimentName,
|
||||
courseRunKey: null,
|
||||
idPhotoName: appContextValue.nameOnAccount,
|
||||
};
|
||||
await getPanel();
|
||||
const button = await screen.findByTestId('submit-button');
|
||||
@@ -127,31 +115,11 @@ describe('SummaryPanel', () => {
|
||||
expect(dataService.submitIdVerification).toHaveBeenCalledWith(verificationData);
|
||||
});
|
||||
|
||||
it('does not submit a name if name is unchanged', async () => {
|
||||
it('submits a name if a name is unchanged', async () => {
|
||||
appContextValue.idPhotoName = null;
|
||||
const verificationData = {
|
||||
facePhotoFile: appContextValue.facePhotoFile,
|
||||
idPhotoFile: appContextValue.idPhotoFile,
|
||||
portraitPhotoMode: appContextValue.portraitPhotoMode,
|
||||
idPhotoMode: appContextValue.idPhotoMode,
|
||||
optimizelyExperimentName: appContextValue.optimizelyExperimentName,
|
||||
courseRunKey: null,
|
||||
};
|
||||
await getPanel();
|
||||
const button = await screen.findByTestId('submit-button');
|
||||
fireEvent.click(button);
|
||||
expect(dataService.submitIdVerification).toHaveBeenCalledWith(verificationData);
|
||||
});
|
||||
|
||||
it('submits a name if a name is unchanged if verified name feature is enabled', async () => {
|
||||
appContextValue.idPhotoName = null;
|
||||
verifiedNameContextValue.verifiedNameEnabled = true;
|
||||
const verificationData = {
|
||||
facePhotoFile: appContextValue.facePhotoFile,
|
||||
idPhotoFile: appContextValue.idPhotoFile,
|
||||
portraitPhotoMode: appContextValue.portraitPhotoMode,
|
||||
idPhotoMode: appContextValue.idPhotoMode,
|
||||
optimizelyExperimentName: appContextValue.optimizelyExperimentName,
|
||||
courseRunKey: null,
|
||||
idPhotoName: appContextValue.nameOnAccount,
|
||||
};
|
||||
@@ -226,11 +194,4 @@ describe('SummaryPanel', () => {
|
||||
'One or more of the files you have uploaded is in an unsupported format. Please choose from the following:',
|
||||
);
|
||||
});
|
||||
|
||||
it('does not show ID upload option if user is in experiment', async () => {
|
||||
await getPanel();
|
||||
const collapsible = await screen.queryByTestId('collapsible');
|
||||
expect(collapsible).not.toBeInTheDocument();
|
||||
appContextValue.optimizelyExperimentName = 'test-experiment';
|
||||
});
|
||||
});
|
||||
|
||||
@@ -28,6 +28,7 @@ describe('TakeIdPhotoPanel', () => {
|
||||
idPhotoFile: null,
|
||||
reachedSummary: false,
|
||||
setIdPhotoFile: jest.fn(),
|
||||
useCameraForId: false,
|
||||
};
|
||||
|
||||
afterEach(() => {
|
||||
@@ -83,9 +84,6 @@ describe('TakeIdPhotoPanel', () => {
|
||||
});
|
||||
|
||||
it('shows correct text if user should use upload', async () => {
|
||||
contextValue.optimizelyExperimentName = 'test';
|
||||
contextValue.shouldUseCamera = false;
|
||||
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
|
||||
@@ -28,7 +28,6 @@ describe('TakePortraitPhotoPanel', () => {
|
||||
idPhotoFile: null,
|
||||
reachedSummary: false,
|
||||
setFacePhotoFile: jest.fn(),
|
||||
setShouldUseCamera: jest.fn(),
|
||||
};
|
||||
|
||||
afterEach(() => {
|
||||
@@ -51,7 +50,6 @@ describe('TakePortraitPhotoPanel', () => {
|
||||
|
||||
it('shows next button after photo is taken and routes to IdContextPanel', async () => {
|
||||
contextValue.facePhotoFile = 'test.jpg';
|
||||
contextValue.shouldUseCamera = true;
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
@@ -84,26 +82,4 @@ describe('TakePortraitPhotoPanel', () => {
|
||||
fireEvent.click(button);
|
||||
expect(history.location.pathname).toEqual('/summary');
|
||||
});
|
||||
|
||||
it('shows correct text if user should use upload', async () => {
|
||||
contextValue.optimizelyExperimentName = 'test';
|
||||
contextValue.shouldUseCamera = false;
|
||||
|
||||
await act(async () => render((
|
||||
<Router history={history}>
|
||||
<IntlProvider locale="en">
|
||||
<IdVerificationContext.Provider value={contextValue}>
|
||||
<IntlTakePortraitPhotoPanel {...defaultProps} />
|
||||
</IdVerificationContext.Provider>
|
||||
</IntlProvider>
|
||||
</Router>
|
||||
)));
|
||||
|
||||
// check that upload title and text are correct
|
||||
const title = await screen.findByText('Upload a Photo of Yourself');
|
||||
expect(title).toBeVisible();
|
||||
|
||||
const text = await screen.findByTestId('upload-text');
|
||||
expect(text.textContent).toContain('Please upload a portrait photo');
|
||||
});
|
||||
});
|
||||
|
||||
@@ -63,6 +63,8 @@ initialize({
|
||||
COACHING_ENABLED: (process.env.COACHING_ENABLED || false),
|
||||
ENABLE_DEMOGRAPHICS_COLLECTION: (process.env.ENABLE_DEMOGRAPHICS_COLLECTION || false),
|
||||
DEMOGRAPHICS_BASE_URL: process.env.DEMOGRAPHICS_BASE_URL,
|
||||
ENABLE_COPPA_COMPLIANCE: (process.env.ENABLE_COPPA_COMPLIANCE || false),
|
||||
MARKETING_EMAILS_OPT_IN: (process.env.MARKETING_EMAILS_OPT_IN || false),
|
||||
}, 'App loadConfig override handler');
|
||||
},
|
||||
},
|
||||
|
||||
@@ -2,15 +2,14 @@ import PropTypes from 'prop-types';
|
||||
import { render, waitFor } from '@testing-library/react';
|
||||
|
||||
import { useAsyncCall } from '../hooks';
|
||||
import { LOADING_STATUS, SUCCESS_STATUS, FAILURE_STATUS } from '../constants';
|
||||
|
||||
const TestUseAsyncCallHookComponent = (props) => {
|
||||
const { asyncFunc } = props;
|
||||
const [isCallLoading, callData] = useAsyncCall(asyncFunc);
|
||||
|
||||
const TestUseAsyncCallHookComponent = ({ asyncFunc }) => {
|
||||
const { status, data } = useAsyncCall(asyncFunc);
|
||||
return (
|
||||
<>
|
||||
{ isCallLoading && <div>loading</div> }
|
||||
<div>{ callData }</div>
|
||||
<div>{status}</div>
|
||||
{data && Object.keys(data).length !== 0 && <div data-testid="data">{ data.data }</div>}
|
||||
</>
|
||||
);
|
||||
};
|
||||
@@ -20,27 +19,31 @@ TestUseAsyncCallHookComponent.propTypes = {
|
||||
};
|
||||
|
||||
describe('useAsyncCall mock', () => {
|
||||
it('returns data correctly for response', async () => {
|
||||
const mockAsyncFunc = jest.fn(async () => ('data'));
|
||||
it('returns status and data correctly for successful response', async () => {
|
||||
const mockAsyncFunc = jest.fn(async () => ({ data: 'data' }));
|
||||
|
||||
const { queryByText } = render(<TestUseAsyncCallHookComponent asyncFunc={mockAsyncFunc} />);
|
||||
|
||||
await waitFor(() => (expect(mockAsyncFunc).toHaveBeenCalledTimes(1)));
|
||||
expect(queryByText(SUCCESS_STATUS)).not.toBeNull();
|
||||
expect(queryByText('data')).not.toBeNull();
|
||||
});
|
||||
it('returns data correctly for no response', async () => {
|
||||
const mockAsyncFunc = jest.fn(async () => {});
|
||||
it('returns status and data correctly for unsuccessful response', async () => {
|
||||
const mockAsyncFunc = jest.fn(async () => ({}));
|
||||
|
||||
const { queryByText } = render(<TestUseAsyncCallHookComponent asyncFunc={mockAsyncFunc} />);
|
||||
const { queryByText, queryByTestId } = render(<TestUseAsyncCallHookComponent asyncFunc={mockAsyncFunc} />);
|
||||
|
||||
await waitFor(() => (expect(mockAsyncFunc).toHaveBeenCalledTimes(1)));
|
||||
expect(queryByText('data')).toBeNull();
|
||||
expect(queryByText(FAILURE_STATUS)).not.toBeNull();
|
||||
expect(queryByTestId('data')).toBeNull();
|
||||
});
|
||||
it('returns isLoading correctly', async () => {
|
||||
const mockAsyncFunc = jest.fn(async () => {});
|
||||
it('returns status and data correctly for pending request', async () => {
|
||||
const mockAsyncFunc = jest.fn(async () => ({}));
|
||||
|
||||
const { queryByText } = render(<TestUseAsyncCallHookComponent asyncFunc={mockAsyncFunc} />);
|
||||
expect(queryByText('loading')).not.toBeNull();
|
||||
expect(queryByText('data')).toBeNull();
|
||||
const { queryByText, queryByTestId } = render(<TestUseAsyncCallHookComponent asyncFunc={mockAsyncFunc} />);
|
||||
expect(queryByText(LOADING_STATUS)).not.toBeNull();
|
||||
expect(queryByTestId('data')).toBeNull();
|
||||
|
||||
await waitFor(() => (expect(mockAsyncFunc).toHaveBeenCalledTimes(1)));
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user