diff --git a/src/account-settings/name-change/NameChange.jsx b/src/account-settings/name-change/NameChange.jsx index 9c2f285..0159c4a 100644 --- a/src/account-settings/name-change/NameChange.jsx +++ b/src/account-settings/name-change/NameChange.jsx @@ -69,7 +69,7 @@ function NameChangeModal({ useEffect(() => { if (saveState === 'complete') { handleClose(); - push('/id-verification?next=account%2Fsettings'); + push(`/id-verification?next=${encodeURIComponent('account/settings')}`); } }, [saveState]); diff --git a/src/hooks.js b/src/hooks.js index 6cec54c..0c9e677 100644 --- a/src/hooks.js +++ b/src/hooks.js @@ -21,3 +21,27 @@ export function useAsyncCall(asyncFunc) { return [isLoading, 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; +} diff --git a/src/id-verification/panels/RequestCameraAccessPanel.jsx b/src/id-verification/panels/RequestCameraAccessPanel.jsx index 3e43543..739902a 100644 --- a/src/id-verification/panels/RequestCameraAccessPanel.jsx +++ b/src/id-verification/panels/RequestCameraAccessPanel.jsx @@ -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,8 +15,7 @@ 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 { @@ -38,18 +38,6 @@ function RequestCameraAccessPanel(props) { } }, [mediaAccess, userId]); - // Link back to the correct location if the user accessed IDV somewhere other - // than the dashboard - useEffect(() => { - if (sessionStorage.getItem('courseId')) { - setReturnUrl(`courses/${sessionStorage.getItem('courseId')}`); - setReturnText('id.verification.return.course'); - } else if (sessionStorage.getItem('next')) { - setReturnUrl(sessionStorage.getItem('next')); - setReturnText('id.verification.return.generic'); - } - }, []); - const getTitle = () => { if (mediaAccess === MEDIA_ACCESS.GRANTED) { return props.intl.formatMessage(messages['id.verification.camera.access.title.success']); diff --git a/src/id-verification/panels/SubmittedPanel.jsx b/src/id-verification/panels/SubmittedPanel.jsx index 09c5481..682cd33 100644 --- a/src/id-verification/panels/SubmittedPanel.jsx +++ b/src/id-verification/panels/SubmittedPanel.jsx @@ -1,17 +1,18 @@ -import React, { useContext, useEffect, useState } 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 [returnUrl, setReturnUrl] = useState('dashboard'); - const [returnText, setReturnText] = useState('id.verification.return.dashboard'); + const { location: returnUrl, text: returnText } = useRedirect(); const panelSlug = 'submitted'; useEffect(() => { @@ -21,18 +22,6 @@ function SubmittedPanel(props) { }); }, [userId]); - // Link back to the correct location if the user accessed IDV somewhere other - // than the dashboard - useEffect(() => { - if (sessionStorage.getItem('courseId')) { - setReturnUrl(`courses/${sessionStorage.getItem('courseId')}`); - setReturnText('id.verification.return.course'); - } else if (sessionStorage.getItem('next')) { - setReturnUrl(sessionStorage.getItem('next')); - setReturnText('id.verification.return.generic'); - } - }, []); - return ( { }; 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((