Skip to content

Conversation

@harishsundar-okta
Copy link
Contributor

@harishsundar-okta harishsundar-okta commented Jan 30, 2026

Changes

UI polish fixes for the Organization Edit page FormActions component.

Changes

  • Removed orange dot indicator - The unsaved changes indicator now shows only text without the orange dot
  • Prevented layout shift (CLS) - The Cancel/Discard button now uses invisible class instead of conditional rendering, preserving its space in the layout when hidden
  • Fixed Save button width jump - Added min-w-[70px] to maintain consistent button width when spinner appears during loading
  • Added accessibility attributes - aria-hidden and tabIndex for the invisible Cancel button to improve screen reader and keyboard navigation behavior

References

Please include relevant links supporting this change such as a:

  • support ticket
  • community post
  • StackOverflow post
  • support forum thread

Testing

  • Updated unit tests to reflect new behavior where Cancel button requires unsaved changes to be visible
  • All existing tests pass
  • image
  • screenshot
  • image
  • image

Checklist

@github-actions
Copy link

github-actions bot commented Jan 30, 2026

🚀 Preview deployment

Branch: refs/pull/68/merge
Commit: f96705a

📝 Preview URL: https://auth0-universal-components-f41s4jpzk-okta.vercel.app


Updated at 2026-01-30T12:40:23.501Z

@codecov-commenter
Copy link

codecov-commenter commented Jan 30, 2026

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 84.99%. Comparing base (8344a69) to head (38bf4c7).

Additional details and impacted files
@@           Coverage Diff            @@
##             main      #68    +/-   ##
========================================
  Coverage   84.99%   84.99%            
========================================
  Files         126      126            
  Lines       10569    10569            
  Branches     1352     1157   -195     
========================================
  Hits         8983     8983            
  Misses       1586     1586            

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@rax7389 rax7389 assigned rax7389 and harishsundar-okta and unassigned rax7389 Jan 30, 2026
@rax7389 rax7389 added bug Something isn't working enhancement New feature or request and removed bug Something isn't working labels Jan 30, 2026
Comment on lines +92 to +94
disabled={
previousButtonProps.disabled || isLoading || (showUnsavedChanges && !hasUnsavedChanges)
}
Copy link
Contributor

Choose a reason for hiding this comment

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

Interested to understand why we have to tweak this disabled logic?

isLoading={isLoading}
showPrevious={showPrevious}
showNext={showNext}
showUnsavedChanges={false}
Copy link
Contributor

Choose a reason for hiding this comment

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

any reason that we had to pass it here explicitly now?

size={nextButtonProps.size}
disabled={nextButtonProps.disabled || isLoading}
className="FormActions-next"
className="FormActions-next min-w-[70px]"
Copy link
Contributor

Choose a reason for hiding this comment

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

also lets have this value in rem

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement New feature or request

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants