Skip to content

Add React-based tips accordion to single-page document capture form#3931

Merged
aduth merged 5 commits intomasterfrom
aduth-document-tips
Jul 21, 2020
Merged

Add React-based tips accordion to single-page document capture form#3931
aduth merged 5 commits intomasterfrom
aduth-document-tips

Conversation

@aduth
Copy link
Contributor

@aduth aduth commented Jul 16, 2020

Relates to: LG-3020, LG-3023
Integrates work from: #3911

Why: To recreate the existing document capture flow as a React component, it will be required to integrate existing tips content.

This pull request seeks to implement the necessary base components for the recreation of the document tips, including:

The implementation of the tips component is done in a way which anticipates that the steps for uploading the front and the back of a document would be largely the same.

It does not:

  • Alter the design in any way
  • Incorporate Login design system
  • Change the existing accordion markup
  • Reimplement accordion behaviors from React
    • It currently reuses existing accordion script with minor supporting revisions

Screenshot:

Document tips

To do:

  • Depending on expected reuse of the accordion, it would be good to flesh out these tests more

aduth and others added 5 commits July 20, 2020 13:33
**Why**: Asset paths include a fingerprint which can't be known to the client unless provided by the server.

Co-authored-by: Will Beddow <william.beddow@gsa.gov>
**Why**: Current Login.gov pages will check for and initialize any accordions present at page load. Since React components can be mounted after page load, and also need to initialize, there should be internal checks to protect against double initialization, since otherwise event handlers may be triggered multiple times.
**Why**: As an abstraction to simply render an image at the known asset path, encapsulating behavior to perform asset lookup by asset context
**Why**: To recreate the existing document capture flow, we will need to be able to represent collapsible accordion content in React
**Why**: Recreating the existing document capture flow requires integrating existing tips content
@aduth aduth force-pushed the aduth-document-tips branch from 1747971 to 6bdf517 Compare July 20, 2020 17:34
Copy link
Contributor

@ironman5366 ironman5366 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@aduth
Copy link
Contributor Author

aduth commented Jul 21, 2020

Depending on the design direction, we may not ultimately need the accordion component. That said, the assets initialization and context, as well as the bundled Image component, will most certainly be needed for future work. It's already used in #3938, for example.

@aduth aduth merged commit 98fa9fd into master Jul 21, 2020
@aduth aduth deleted the aduth-document-tips branch July 21, 2020 15:55
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants