Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Point of Contact - Phase 1 #453

Merged
merged 5 commits into from
May 7, 2024
Merged

Point of Contact - Phase 1 #453

merged 5 commits into from
May 7, 2024

Conversation

meissadia
Copy link
Collaborator

Closes #416

Changes

  • Integrates form into workflow
  • Enables saving POC info to API
  • Populates form with existing POC contact when available
  • Only saves data to API if it has changed

Screenshots

What we see:

  • User populates form data
  • Form validates content and displays an error for missing/malformed fields
  • On initial successful submit the data is sent to the API and user is routed to next step
  • When revisiting the POC page, contact info from the Filing API is pre-populated in the form
  • On second submit, when no data has changed, no API call is made
Screen.Recording.2024-05-06.at.11.15.52.AM.mov

@meissadia meissadia changed the base branch from main to 434-warnings-part2 May 6, 2024 18:02
Copy link
Contributor

@billhimmelsbach billhimmelsbach left a comment

Choose a reason for hiding this comment

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

Looks good! I had a few comments that you can scoop up for a second PR if you'd like.

Also, one more thing for the next PR would be to show a loading state before the API call completes, instead of showing a blank form that fills in with data. Slow internet connections would make this experience a little weird.

src/pages/PointOfContact/index.tsx Show resolved Hide resolved
src/pages/PointOfContact/index.tsx Show resolved Hide resolved
});
}

if (onSubmit) onSubmit();
} catch (error) {
// eslint-disable-next-line no-console
console.log(error);
Copy link
Contributor

Choose a reason for hiding this comment

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

Some kind of error box for a later PR right?

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

@billhimmelsbach
Copy link
Contributor

Also, one more thing for the next PR would be to show a loading state before the API call completes, instead of showing a blank form that fills in with data. Slow internet connections would make this experience a little weird.

It's Bill from the Future who just reviewed your next PR, which has those inputs disabled on load, which I think will definitely work for MVP. I do think natalia will have thoughts about the various load states later though, so can we make a post-mvp ticket to re-visit form loading states?

@meissadia
Copy link
Collaborator Author

meissadia commented May 7, 2024

Also, one more thing for the next PR would be to show a loading state before the API call completes, instead of showing a blank form that fills in with data. Slow internet connections would make this experience a little weird.

It's Bill from the Future who just reviewed your next PR, which has those inputs disabled on load, which I think will definitely work for MVP. I do think natalia will have thoughts about the various load states later though, so can we make a post-mvp ticket to re-visit form loading states?

[Design review] Loading states #459

@meissadia
Copy link
Collaborator Author

Added todo items in POC - Phase 2 ticket

  • Full page loading state instead of form level
  • Error alert for API submission errors

@meissadia meissadia merged commit dbb1f6a into 434-warnings-part2 May 7, 2024
2 checks passed
@meissadia meissadia deleted the 416-poc-form branch May 7, 2024 16:43
meissadia added a commit that referenced this pull request May 7, 2024
Closes #445

## Changes
- Consolidates Warnings phase 1 with Warnings skeleton

## How to test this PR
Note: These steps demoed in the video below
1. Upload `sbl-validations-pass.csv` from the `regtech-data-validations`
repo (or any file with warnings)
2. Navigate to the `Warnings` page
3. Observe that warnings were found and the alert is shown
4. Scroll to bottom of page and check the verification box
5. Click `Save and continue`, after a brief pause you should move to the
POC page
6. Return to the `Warnings` page and observe that a `Success` alert is
shown in place of the `warning` alert, indicating that the warnings are
verified.
7. Scroll to bottom of page and observe that the checkbox is disabled,
but checked
8. Observe that the `Save and continue` button is enabled, click it. 
9. There should be no pause (no API call when Submission already
verified), just a quick navigation to the next page.

## Screenshots


https://github.com/cfpb/sbl-frontend/assets/2592907/28534b49-4cf4-4c14-888d-7d8bc0ee013a

## Note
- Includes Point of Contact from
#453

---------

Co-authored-by: shindigira <shindigira@gmail.com>
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.

[Filing] Integrate existing Point of Contact form - Phase 1 - just get it in there
2 participants