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

[576] ui/config-wizard: Page for aws scanning #812

Merged

Conversation

ssangervasi
Copy link
Contributor

@ssangervasi ssangervasi commented Jun 28, 2022

Closes #576

Code Changes

  • ui/config-wizard:
    • Scanner AKA generate API - The actual call to the server
    • AuthenticateScanner component with AWS form - The Actual component
    • Clean up system logos to fix button styling - The Figma-exported SVGs had some clipped paths that were just for a background, but when using the icons as a buttons they ended up with rectangles that conflicted with Chakra.
    • Fix accordion button color
  • ui/package.json: Add Yup as a dependency for Formik validation
    • This package is recommended by Formik
    • Config wizard pages like the AWS form can be made cleaner with its validations
  • ui/theme: Solid button variant with primary design colors:
    • See the code comment. Theming with colors coming from a seperate package (fidesui) can be tricky.
    • The buttons now use this "primary" variant
  • docs/resources: Fix bullet list and add IAM heading
    • This markdown was a little broken, and now we can link to the example IAM.

Steps to Confirm

  1. Open the config wizard
  2. Enter the org info
  3. Click AWS on step 2
  4. Enter credentials on step 3
    • The credentials in 1password are called AWS: fidesctl-integration-test
    • This won't yet work because of the obscure string problem
    • Removing the obscure is in-progress

Pre-Merge Checklist

  • TODO
  • All CI Pipelines Succeeded
  • Documentation Updated:
    • documentation complete, or draft/outline provided (tag docs-team to complete/review on this branch)
    • documentation issue created (tag docs-team to complete issue separately)
  • Issue Requirements are Met
  • Relevant Follow-Up Issues Created
  • Update CHANGELOG.md

Description Of Changes

This includes the layout of wizard step 2, the form inputs, and some placeholders. I tackled a few other UI elements that were giving me trouble along the way: the buttons and icons I listed above. The PR got a little big, so I can could split some of those commits into a separate PR if we would prefer.

📢 I'm going to open a discussion on our state management for the wizard. E.g. how do we pass the organization key?
📝 The API won't yet work (I can't test it) because of how strings are obscured

Demo:
https://user-images.githubusercontent.com/2236777/176061192-51ee6c18-acd0-48cf-bb9d-1a296833ffca.mp4
📝 I noticed while recording that I didn't make the secret key hide/show so I'll add a commit for that.

@ssangervasi ssangervasi requested review from a team, LKCSmith and allisonking June 28, 2022 00:45
Copy link
Contributor

@allisonking allisonking left a comment

Choose a reason for hiding this comment

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

looks great, nice job! 💯

@ssangervasi ssangervasi changed the title Ssangervasi/576/create a config UI page for aws scanning [576] ui/config-wizard: Page for aws scanning Jun 28, 2022
@ssangervasi ssangervasi force-pushed the ssangervasi/576/create-a-config-ui-page-for-aws-scanning branch from 5276f9a to c462297 Compare June 28, 2022 19:56
@ssangervasi ssangervasi merged commit 88b37a6 into main Jun 28, 2022
@ssangervasi ssangervasi deleted the ssangervasi/576/create-a-config-ui-page-for-aws-scanning branch June 28, 2022 22:39
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.

Create a config UI page for AWS scanning
2 participants