-
Notifications
You must be signed in to change notification settings - Fork 125
/
IntroductionPage.jsx
120 lines (114 loc) · 3.93 KB
/
IntroductionPage.jsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
import React from 'react';
import PropTypes from 'prop-types';
import FormTitle from 'platform/forms-system/src/js/components/FormTitle';
import SaveInProgressIntro from 'platform/forms/save-in-progress/SaveInProgressIntro';
import { focusElement } from 'platform/utilities/ui';
class IntroductionPage extends React.Component {
componentDidMount() {
focusElement('.va-nav-breadcrumbs-list');
}
render() {
const { route } = this.props;
const { formConfig, pageList } = route;
return (
<article className="schemaform-intro">
<FormTitle
title="Mock Form"
subTitle="Equal to VA Form 00-1234 (Mock Form)"
/>
<SaveInProgressIntro
headingLevel={2}
prefillEnabled
verifyRequiredPrefill={false}
messages={formConfig.savedFormMessages}
pageList={pageList}
startText="Start the Application"
>
Please complete the 00-1234 form to apply for Mock form.
</SaveInProgressIntro>
<h2 className="vads-u-font-size--h3 vads-u-margin-top--0">
What’s a mock form?
</h2>
<p>
This mock form was{' '}
<a href="https://department-of-veterans-affairs.github.io/veteran-facing-services-tools/forms/form-tutorial-basic">
built using the form generator
</a>{' '}
and includes examples from the intermediate and advanced tutorials.
Additional examples, not from the tutorial, have also been included.
</p>
<p>
It is meant to show alternative patterns and best practices, and
should help with onboarding engineers, and be a showcase for
implementation of newer patterns and workarounds for issues.
</p>
<h2 className="vads-u-font-size--h3 vads-u-margin-top--0">
Follow the steps below to apply for Mock form.
</h2>
<va-process-list uswds="false">
<li>
<h3>Prepare</h3>
<h4>To fill out this application, you’ll need your:</h4>
<ul>
<li>Social Security number (required)</li>
</ul>
<p>
<strong>What if I need help filling out my application?</strong>{' '}
An accredited representative, like a Veterans Service Officer
(VSO), can help you fill out your claim.{' '}
<a href="/disability-benefits/apply/help/index.html">
Get help filing your claim
</a>
</p>
</li>
<li>
<h3>Apply</h3>
<p>Complete this Mock form form.</p>
<p>
After submitting the form, you’ll get a confirmation message. You
can print this for your records.
</p>
</li>
<li>
<h3>VA Review</h3>
<p>
We process claims within a week. If more than a week has passed
since you submitted your application and you haven’t heard back,
please don’t apply again. Call us at.
</p>
</li>
<li>
<h3>Decision</h3>
<p>
Once we’ve processed your claim, you’ll get a notice in the mail
with our decision.
</p>
</li>
</va-process-list>
<SaveInProgressIntro
buttonOnly
prefillEnabled
verifyRequiredPrefill={false}
messages={formConfig.savedFormMessages}
pageList={pageList}
startText="Start the Application"
/>
<p />
<va-omb-info
res-burden={10}
omb-number="0000-0000"
exp-date="12/31/2022"
/>
</article>
);
}
}
IntroductionPage.propTypes = {
route: PropTypes.shape({
formConfig: PropTypes.shape({
savedFormMessages: PropTypes.shape({}),
}),
pageList: PropTypes.array,
}),
};
export default IntroductionPage;