Skip to content

change: [M3-10449] - Enhance Linode alerts input validation messages behavior#12703

Merged
pmakode-akamai merged 8 commits intolinode:developfrom
pmakode-akamai:M3-10449-enhance-legacy-alerts-input-validation-messages-behavior
Aug 19, 2025
Merged

change: [M3-10449] - Enhance Linode alerts input validation messages behavior#12703
pmakode-akamai merged 8 commits intolinode:developfrom
pmakode-akamai:M3-10449-enhance-legacy-alerts-input-validation-messages-behavior

Conversation

@pmakode-akamai
Copy link
Contributor

@pmakode-akamai pmakode-akamai commented Aug 14, 2025

Description 📝

There is an existing issue with how validation messages are handled in the Legacy Alerts form using Formik. Currently, validation messages only appear when the form is submitted, which is not an ideal user experience.

This issue is not limited to Legacy Alerts; similar behavior can be observed in few other areas such as the Domain Edit Drawer. However, as part of the Linode-ACLP Integration and to improve the UX, we should enhance the validation message behavior for Legacy Alerts.

The validation messages behavior should be updated to display:

  • On blur of individual input fields
  • Or when the form is submitted

Changes 🔄

  • Added support for displaying client-side validation errors on blur for input fields
  • Updated alertsSchema to mark numeric input fields as required when empty
  • Improved validation messages for better clarity and user feedback

Scope 🚢

Upon production release, changes in this PR will be visible to:

  • All customers
  • Some customers (e.g. in Beta or Limited Availability)
  • No customers / Not applicable

Target release date 🗓️

N/A

Preview 📷

Before After
Screen.Recording.2025-08-14.at.10.11.32.PM.mov
Screen.Recording.2025-08-14.at.10.14.50.PM.mov

How to test 🧪

Verification steps

  • Verify that the Linode Alerts edit form functions correctly without regressions
  • Confirm that client-side validation behaves as expected:
    • Errors display on blur for invalid or empty numeric fields
    • Appropriate validation messages appear based on the updated schema
  • Ensure all tests pass
Author Checklists

As an Author, to speed up the review process, I considered 🤔

👀 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

  • I have read and considered all applicable items listed above.

As an Author, before moving this PR from Draft to Open, I confirmed ✅

  • All tests and CI checks are passing
  • TypeScript compilation succeeded without errors
  • Code passes all linting rules

@pmakode-akamai pmakode-akamai self-assigned this Aug 14, 2025
@pmakode-akamai pmakode-akamai added Enhancement Linodes Dealing with the Linodes section of the app labels Aug 14, 2025
@pmakode-akamai pmakode-akamai marked this pull request as ready for review August 14, 2025 16:55
@pmakode-akamai pmakode-akamai requested a review from a team as a code owner August 14, 2025 16:55
@pmakode-akamai pmakode-akamai requested review from bnussman-akamai and coliu-akamai and removed request for a team August 14, 2025 16:56
@pmakode-akamai pmakode-akamai force-pushed the M3-10449-enhance-legacy-alerts-input-validation-messages-behavior branch from 161fc8d to fbcbcdb Compare August 14, 2025 17:11
Copy link
Contributor

@dmcintyr-akamai dmcintyr-akamai left a comment

Choose a reason for hiding this comment

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

Fixes the reported issue in alerts form. Maybe out of scope of this pr, but would be nice if the appearance of an input error disabled the Save button
Also would also be nice if there was a error summary, preferably at the bottom of the page, so that i know why the Save button is disabled. On some really long forms, the error msg appears above the fold when i scroll down to the save button.

@pmakode-akamai pmakode-akamai added the ACLP Integration CI (Cloud Interfaces) Support for CC (Core Compute) CloudPulse Integration label Aug 18, 2025
@linode-gh-bot
Copy link
Collaborator

Cloud Manager UI test results

🎉 724 passing tests on test run #4 ↗︎

❌ Failing✅ Passing↪️ Skipped🕐 Duration
0 Failing724 Passing4 Skipped122m 58s

@github-project-automation github-project-automation bot moved this from Review to Approved in Cloud Manager Aug 18, 2025
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.

✅ functionality looks good - didn't see regressions
✅ client side validation looks good

thanks @pmakode-akamai!

@coliu-akamai coliu-akamai added the Approved Multiple approvals and ready to merge! label Aug 18, 2025
@pmakode-akamai pmakode-akamai merged commit 51e7e19 into linode:develop Aug 19, 2025
35 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

ACLP Integration CI (Cloud Interfaces) Support for CC (Core Compute) CloudPulse Integration Approved Multiple approvals and ready to merge! Enhancement Linodes Dealing with the Linodes section of the app

Projects

Archived in project

Development

Successfully merging this pull request may close these issues.

5 participants