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

fix: [M3-8802] - Object Storage landing page UI bugs #11187

Conversation

bnussman-akamai
Copy link
Member

@bnussman-akamai bnussman-akamai commented Oct 29, 2024

Description 📝

  • Fixes numerous UI bugs 🐛 on the Object Storage landings pages (Buckets 🪣 and Access Keys 🔑)
  • Does small clean up and sorting of props along the way 🧹

Changes with Preview 📷

Fixed inconstant table background color on the Buckets landing page
Before After
Screenshot 2024-10-29 at 3 00 11 PM Screenshot 2024-10-29 at 3 00 03 PM
Fixed broken loading state on Access Key landing page
Before After
Screenshot 2024-10-29 at 3 01 54 PM Screenshot 2024-10-29 at 3 02 06 PM
Improved Access Keys landing page for small screen sizes 📱

I hid the "Hostnames" column on small screens, but added an action menu item so the user can still open and view the hostnames drawer

Before After
Screenshot 2024-10-29 at 3 11 02 PM Screenshot 2024-10-29 at 3 10 53 PM
Removed "Actions" text in table column header
Before After
Screenshot 2024-10-29 at 3 12 24 PM Screenshot 2024-10-29 at 3 12 18 PM
Fixed broken action menu spacing
Before After
Screenshot 2024-10-29 at 3 14 05 PM Screenshot 2024-10-29 at 3 13 54 PM
Fixed multiple background colors in hostnames drawer
Before After
Screenshot 2024-10-29 at 3 17 04 PM Screenshot 2024-10-29 at 3 17 12 PM

How to test 🧪

As an Author I have 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

@bnussman-akamai bnussman-akamai added Bug Fixes for regressions or bugs UX/UI Changes for UI/UX to review Object Storage deals with Object Storage labels Oct 29, 2024
@bnussman-akamai bnussman-akamai self-assigned this Oct 29, 2024
@bnussman-akamai bnussman-akamai requested a review from a team as a code owner October 29, 2024 19:25
@bnussman-akamai bnussman-akamai requested review from mjac0bs and hana-akamai and removed request for a team October 29, 2024 19:25
Copy link

github-actions bot commented Oct 29, 2024

Coverage Report:
Base Coverage: 87.35%
Current Coverage: 87.35%

@bnussman-akamai bnussman-akamai requested a review from a team as a code owner October 29, 2024 20:49
@bnussman-akamai bnussman-akamai requested review from jdamore-linode and removed request for a team October 29, 2024 20:49
Copy link
Contributor

@hana-akamai hana-akamai left a comment

Choose a reason for hiding this comment

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

Should there be a min label column width for desktop view? The column feels a bit cramped now

image


return data?.map((eachKey: ObjectStorageKey, index) => (
<AccessKeyTableRow
key={index}
Copy link
Contributor

Choose a reason for hiding this comment

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

Suggested change
key={index}
key={eachKey.id}

Copy link
Member Author

Choose a reason for hiding this comment

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

Great catch. Thank you!

@hana-akamai hana-akamai added the Add'tl Approval Needed Waiting on another approval! label Nov 1, 2024
@mjac0bs
Copy link
Contributor

mjac0bs commented Nov 1, 2024

👋🏼 It's me, hi, my PR just caused merge conflict problems.

Thanks for resolving and I'll review this PR in after I take lunch. Looks like solid clean up!

@linode-gh-bot
Copy link
Collaborator

Cloud Manager UI test results

🎉 445 passing tests on test run #10 ↗︎

❌ Failing✅ Passing↪️ Skipped🕐 Duration
0 Failing445 Passing2 Skipped78m 41s

Copy link
Contributor

@mjac0bs mjac0bs left a comment

Choose a reason for hiding this comment

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

This looked really good! Styling at various screen sizes checked out and no regressions that I could find in functionality. Great attention to detail here - I don't know that I would have noticed the different background colors in hostnames copyable text field on my own. 🚀

@mjac0bs mjac0bs added Approved Multiple approvals and ready to merge! and removed Add'tl Approval Needed Waiting on another approval! labels Nov 1, 2024
@bnussman-akamai bnussman-akamai merged commit 293c677 into linode:develop Nov 1, 2024
23 checks passed
Copy link

cypress bot commented Nov 1, 2024

Cloud Manager E2E    Run #6776

Run Properties:  status check passed Passed #6776  •  git commit 293c6771f1: fix: [M3-8802] - Object Storage landing page UI bugs (#11187)
Project Cloud Manager E2E
Branch Review develop
Run status status check passed Passed #6776
Run duration 28m 06s
Commit git commit 293c6771f1: fix: [M3-8802] - Object Storage landing page UI bugs (#11187)
Committer Banks Nussman
View all properties for this run ↗︎

Test results
Tests that failed  Failures 0
Tests that were flaky  Flaky 2
Tests that did not run due to a developer annotating a test with .skip  Pending 2
Tests that did not run due to a failure in a mocha hook  Skipped 0
Tests that passed  Passing 445
View all changes introduced in this branch ↗︎

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Approved Multiple approvals and ready to merge! Bug Fixes for regressions or bugs Object Storage deals with Object Storage UX/UI Changes for UI/UX to review
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants