-
Notifications
You must be signed in to change notification settings - Fork 128
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Appoint a rep - submission method (#34050)
* Added feature toggle for appoint v2 features * Moving page depends logic into schema files to clean up form config * Made use of feature toggle for v2 features * Adjusted feature toggle + env checks. Added constant for local testing without vets-api * Created rep submission method screen * Updated routing for to include submission method * Added to submissionmethod page conditional * Added unit tests for submission method * Added return statement * Disabled feature toggle for e2e tests * comment * Corrected error state copy * Added unit test for error state * File + component naming * Updated pageDepends conditional * Make use of new pagedepends in representativeSubmissionMethod
- Loading branch information
Showing
13 changed files
with
396 additions
and
33 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
95 changes: 95 additions & 0 deletions
95
src/applications/representative-appoint/components/RepresentativeSubmissionMethod.jsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,95 @@ | ||
| import React, { useState } from 'react'; | ||
| import PropTypes from 'prop-types'; | ||
| import { connect } from 'react-redux'; | ||
| import { VaRadio } from '@department-of-veterans-affairs/component-library/dist/react-bindings'; | ||
| import FormNavButtons from 'platform/forms-system/src/js/components/FormNavButtons'; | ||
| import { scrollToFirstError } from 'platform/utilities/ui'; | ||
| import { useReviewPage } from '../hooks/useReviewPage'; | ||
|
|
||
| const RepresentativeSubmissionMethod = props => { | ||
| const { formData, setFormData, goBack, goForward, goToPath } = props; | ||
| const [error, setError] = useState(null); | ||
|
|
||
| const isReviewPage = useReviewPage(); | ||
|
|
||
| const handleGoBack = () => { | ||
| if (isReviewPage) { | ||
| goToPath('representative-contact?review=true'); | ||
| } else { | ||
| goBack(formData); | ||
| } | ||
| }; | ||
| const handleGoForward = () => { | ||
| if (!formData?.representativeSubmissionMethod) { | ||
| setError('Choose how to submit your request by selecting an option'); | ||
| scrollToFirstError({ focusOnAlertRole: true }); | ||
| } else if (isReviewPage) { | ||
| goToPath('/representative-organization?review=true'); | ||
| } else { | ||
| goForward(formData); | ||
| } | ||
| }; | ||
|
|
||
| const handleRadioSelect = e => { | ||
| setError(null); | ||
| setFormData({ | ||
| ...formData, | ||
| representativeSubmissionMethod: e.detail.value, | ||
| }); | ||
| }; | ||
|
|
||
| return ( | ||
| <> | ||
| <VaRadio | ||
| error={error} | ||
| label="Select how to submit your request" | ||
| required | ||
| onVaValueChange={handleRadioSelect} | ||
| > | ||
| <va-radio-option | ||
| label="Online" | ||
| name="method" | ||
| value="digital" | ||
| key={0} | ||
| checked={formData.representativeSubmissionMethod === 'digital'} | ||
| /> | ||
| <va-radio-option | ||
| label="By mail" | ||
| name="method" | ||
| value="mail" | ||
| key={1} | ||
| checked={formData.representativeSubmissionMethod === 'mail'} | ||
| /> | ||
| <va-radio-option | ||
| label="In person" | ||
| name="method" | ||
| value="in person" | ||
| key={2} | ||
| checked={formData.representativeSubmissionMethod === 'in person'} | ||
| /> | ||
| </VaRadio> | ||
| <FormNavButtons goBack={handleGoBack} goForward={handleGoForward} /> | ||
| </> | ||
| ); | ||
| }; | ||
|
|
||
| RepresentativeSubmissionMethod.propTypes = { | ||
| formData: PropTypes.object, | ||
| goBack: PropTypes.func, | ||
| goForward: PropTypes.func, | ||
| goToPath: PropTypes.func, | ||
| setFormData: PropTypes.func, | ||
| }; | ||
|
|
||
| function mapStateToProps(state) { | ||
| return { | ||
| formData: state.form.data, | ||
| }; | ||
| } | ||
|
|
||
| export { RepresentativeSubmissionMethod }; // Named export for testing | ||
|
|
||
| export default connect( | ||
| mapStateToProps, | ||
| null, | ||
| )(RepresentativeSubmissionMethod); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
3 changes: 3 additions & 0 deletions
3
src/applications/representative-appoint/constants/enableV2FeaturesLocally.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,3 @@ | ||
| // toggle this eg when testing PRs locally | ||
|
|
||
| export const enableV2FeaturesForLocalTesting = true; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
31 changes: 31 additions & 0 deletions
31
src/applications/representative-appoint/hooks/useV2FeatureVisibility.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,31 @@ | ||
| import { useFeatureToggle } from '~/platform/utilities/feature-toggles'; | ||
| import environment from 'platform/utilities/environment'; | ||
| import { enableV2FeaturesForLocalTesting } from '../constants/enableV2FeaturesLocally'; | ||
|
|
||
| const useV2FeatureToggle = () => { | ||
| const { | ||
| TOGGLE_NAMES: { appointARepresentativeEnableV2Features: appToggleKey }, | ||
| useToggleLoadingValue, | ||
| useToggleValue, | ||
| } = useFeatureToggle(); | ||
|
|
||
| const appointV2FeaturesEnabled = useToggleValue(appToggleKey); | ||
| const toggleIsLoading = useToggleLoadingValue(appToggleKey); | ||
|
|
||
| if (toggleIsLoading) { | ||
| return false; | ||
| } | ||
|
|
||
| // can remove this after verifying the toggle in staging | ||
| if (environment.isProduction() || window.Cypress) { | ||
| return false; | ||
| } | ||
|
|
||
| if (environment.isLocalhost()) { | ||
| return enableV2FeaturesForLocalTesting; | ||
| } | ||
|
|
||
| return appointV2FeaturesEnabled; | ||
| }; | ||
|
|
||
| export default useV2FeatureToggle; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
43 changes: 43 additions & 0 deletions
43
...pplications/representative-appoint/pages/representative/representativeSubmissionMethod.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,43 @@ | ||
| import RepresentativeSubmissionMethod from '../../components/RepresentativeSubmissionMethod'; | ||
|
|
||
| export const uiSchema = { | ||
| representativeSubmissionMethod: { | ||
| 'ui:title': "Select how you'd like to submit your request", | ||
| 'ui:widget': RepresentativeSubmissionMethod, | ||
| 'ui:options': { | ||
| hideLabelText: true, | ||
| hideOnReview: true, | ||
| }, | ||
| 'ui:required': () => true, | ||
| }, | ||
| }; | ||
|
|
||
| export const schema = { | ||
| type: 'object', | ||
| properties: { | ||
| representativeSubmissionMethod: { | ||
| type: 'string', | ||
| }, | ||
| }, | ||
| }; | ||
|
|
||
| export const pageDepends = formData => { | ||
| const { v2IsEnabled } = formData; | ||
| // temporarily hardcoding these values | ||
| const repHasMultipleOrganizations = | ||
| !!formData['view:selectedRepresentative'] && | ||
| ['representative', 'veteran_service_officer'].includes( | ||
| formData['view:selectedRepresentative'].attributes?.individualType, | ||
| ) && | ||
| formData['view:selectedRepresentative'].attributes?.accreditedOrganizations | ||
| ?.data?.length > 1; | ||
| const userCanSubmitDigitally = true; | ||
| const representativeAcceptsDigitalSubmission = true; | ||
|
|
||
| return ( | ||
| v2IsEnabled && | ||
| repHasMultipleOrganizations && | ||
| userCanSubmitDigitally && | ||
| representativeAcceptsDigitalSubmission | ||
| ); | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.