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

feat: [M3-6816] - Add AGLB Create Route Drawer #9806

Merged
merged 11 commits into from
Oct 19, 2023

Conversation

jaalah-akamai
Copy link
Contributor

@jaalah-akamai jaalah-akamai commented Oct 17, 2023

Description 📝

Implements the AGLB create route drawer.

Preview 📷

Drawer Error
Screenshot 2023-10-17 at 1 24 39 PM Screenshot 2023-10-17 at 1 24 49 PM

How to test 🧪

Prerequisites

  • Checkout this PR
  • Turn on the MSW (bottom left dev tools)

Reproduction steps

Verification steps

  • Observe drawer opens with label input field and protocol options.
  • Observe when click Create Route without a label, an error is surfaced.
  • Run cypress tests yarn cy:run -s cypress/e2e/core/loadBalancers/load-balancer-routes.spec.ts

As an Author I have considered 🤔

Check all that apply

  • 👀 Doing a self review
  • ❔ Our contribution guidelines
  • 🤏 Splitting feature into small PRs
  • ➕ Adding a changeset
  • 🧪 Providing/Improving test coverage
  • 🔐 Removing all sensitive information from the code and PR description
  • 🚩 Using a feature flag to protect the release
  • 👣 Providing comprehensive reproduction steps
  • 📑 Providing or updating our documentation
  • 🕛 Scheduling a pair reviewing session
  • 📱 Providing mobile support
  • ♿ Providing accessibility support

@jaalah-akamai jaalah-akamai added Ready for Review ACLB Relating to the Akamai Cloud Load Balancer labels Oct 17, 2023
@jaalah-akamai jaalah-akamai self-assigned this Oct 17, 2023
@jaalah-akamai jaalah-akamai requested a review from a team as a code owner October 17, 2023 17:31
@jaalah-akamai jaalah-akamai requested review from jdamore-linode and coliu-akamai and removed request for a team October 17, 2023 17:31
Copy link
Member

@bnussman-akamai bnussman-akamai 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!

Optional change but we might want to make this form have more dynamic error handling to stick to our UX best practices.

I started doing this in the RuleDrawer.tsx for example. Our patterns around dynamic error handling are a bit all over the place because formik makes it difficult so feel free to explore the options.

@coliu-akamai coliu-akamai changed the title feat: [M3-6813] - Add AGLB Create Route Drawer feat: [M3-6816] - Add AGLB Create Route Drawer Oct 18, 2023
Copy link
Contributor

@coliu-akamai coliu-akamai left a comment

Choose a reason for hiding this comment

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

Looks awesome! 🎉
✅ confirmed tests
✅ confirmed drawer appears
✅ confirmed error message appears if no label put in

Had a couple of questions, both in comments and below:

  • the mockup has the text 'Routes Creation info' beneath the drawer title -- do we still plan on including this text or are there more up to date mockups I can cross reference?
  • For vpc error handling, we had a few tickets (see M3-7170) where we ensured errors did not persist after making changes to a field. Would we want to include that behavior here/with other AGLB forms? This is what currently happens - typing in the label field doesn't get rid of the error:
    image

@jaalah-akamai
Copy link
Contributor Author

@coliu-akamai The new way of error handling should clear the error now.

the mockup has the text 'Routes Creation info' beneath the drawer title -- do we still plan on including this text or are there more up to date mockups I can cross reference?

@bnussman-akamai I omitted the text because it didn't seem legit - thoughts?

{error?.find((e) => e.field === 'protocol')?.reason}
<FormHelperText error>
{formik.touched.protocol
? typeof formik.errors.protocol === 'string'
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Had to narrow this type because it returned string | undefined and capitalize doesn't like that.

@bnussman-akamai
Copy link
Member

@jaalah-akamai You are correct, all copy isn't final so it's fine if we omit it. We will be coming back later to update and add copy anyway

Copy link
Contributor

@coliu-akamai coliu-akamai left a comment

Choose a reason for hiding this comment

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

Thanks for confirming, thanks Jaalah & Banks!
Confirmed error gets cleared 🎉

@bnussman-akamai bnussman-akamai added Approved Multiple approvals and ready to merge! and removed Ready for Review labels Oct 19, 2023
@jaalah-akamai jaalah-akamai merged commit d674091 into linode:develop Oct 19, 2023
11 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
ACLB Relating to the Akamai Cloud Load Balancer Approved Multiple approvals and ready to merge!
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants