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

upcoming: [M3 7738] - Update Placement Group Create & Edit Drawers #10205

Merged
merged 20 commits into from
Mar 5, 2024

Conversation

abailly-akamai
Copy link
Contributor

@abailly-akamai abailly-akamai commented Feb 16, 2024

Description 📝

This brings a handful of updates to the Placement Group create/edit flow (functionality, nomenclature, cleanup).

The UX/UI has warranted this change. We previously had a shared drawer for create & edit flows, which made sense since we were showing the same fields on both (some being disabled for the edit flow). Those requirements have now changed, and the flows differences warrants two separate components. It helps with logic, readability and types.

There's few functionality changes, which I made sure to include in the testing steps and in the list below.

The diff is a bit larger than expected due to the naming convention changes.

Changes 🔄

  • Change "rename" in favor of "update" (code) or "edit" (copy)
  • Split concern/.code between Create and Edit drawers
  • Make Affinity Type select its own component for clarity/code consistency
  • Default Affinity Type select to "Anti-affinity" and disable the "Affinity" option
    • "Anti-affinity" it will be the only option for phase 1 (new requirement)
    • We are keeping the disabled "Affinity" menu item(with a tooltip) as it will be a quick follow up and we want to expose users to the upcoming availability without altering the UX/UI
  • Implement new Affinity Enforcement radio group
  • Improve error handling

Note: we are aware of the links within the tooltips. I am leaving those for now until a better solution is provided, or we accept the lack of keyboard accessibility for phase 1 (TBD)

Preview 📷

Create Drawer Edit Drawer
localhost_3000_placement-groups_edit_5 (1) localhost_3000_placement-groups_edit_1 (2)

How to test 🧪

Prerequisites

  • Pull code locally, turn on both the "Placement Group" feature flag and MSW

Verification steps

  • Navigate to http://localhost:3000/placement-groups
    • verify the create drawer by clicking on "Create Placement Group"
    • verify the create drawer by clicking on "Edit" for any of the placement groups

Things to verify:

  • form validation
  • error handling
  • payload

Variation on the Create Drawer (with preselected region ID:

localhost_3000_placement-groups_edit_1 (1)

⚠️ Copy is still very much in progress and will be updated in subsequent PRs (no need to check this PR for it)

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

@abailly-akamai abailly-akamai changed the title upcoming: [M3 7738] - Update Placement Group Edit Drawer upcoming: [M3 7738] - Update Placement Group Edit Drawer and Types Feb 16, 2024
@abailly-akamai abailly-akamai self-assigned this Feb 16, 2024
@abailly-akamai abailly-akamai changed the title upcoming: [M3 7738] - Update Placement Group Edit Drawer and Types upcoming: [M3 7738] - Update Placement Group Edit Drawer Feb 27, 2024
@@ -59,7 +59,6 @@ describe('PlacementGroupsAssignLinodesDrawer', () => {

const { getByText } = renderWithTheme(
<PlacementGroupsAssignLinodesDrawer
numberOfPlacementGroupsCreated={9}
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Obsolete and replaced by query data

@abailly-akamai abailly-akamai changed the title upcoming: [M3 7738] - Update Placement Group Edit Drawer upcoming: [M3 7738] - Update Placement Group Create & Edit Drawers Feb 29, 2024
@abailly-akamai abailly-akamai marked this pull request as ready for review March 1, 2024 14:29
@abailly-akamai abailly-akamai requested a review from a team as a code owner March 1, 2024 14:29
@abailly-akamai abailly-akamai requested review from jdamore-linode, bnussman-akamai and carrillo-erik and removed request for a team March 1, 2024 14:29
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Add regionsData capabilities. Decided on the following defaults for testing:

  • Chicago won't get the "Placement Group" capability
  • Fremont gets maximum_pgs_per_customer: 0 so we can test that behavior as well

CC @carrillo-erik

Copy link

github-actions bot commented Mar 1, 2024

Coverage Report:
Base Coverage: 81.29%
Current Coverage: 81.35%

@carrillo-erik
Copy link
Contributor

LGTM!

@mjac0bs mjac0bs added the Approved Multiple approvals and ready to merge! label Mar 5, 2024
@abailly-akamai abailly-akamai merged commit e8b3716 into linode:develop Mar 5, 2024
17 of 18 checks passed
vrajesh73 added a commit to vrajesh73/manager that referenced this pull request Mar 12, 2024
…eature/namespace-create

* 'develop' of https://github.com/vrajesh73/manager: (89 commits)
  fix: [M3-7269] - Display parent email in user menu when no company name is available for restricted parent user (linode#10248)
  fix: [M3-7817] - Show correct status of Child Account Enabled column for parent users (linode#10233)
  upcoming: [M3-7616] - Add Placement Groups Events and Notifications (linode#10221)
  upcoming: [M3-7816-v2] - Adjust logic for when to show Switch Account button (linode#10266)
  fix: [M3-7831] - Persisting error messages in ACLB delete dialogs (linode#10254)
  upcoming: [M3-7842] - Update Assign Linode Drawer and improve query skipping (linode#10263)
  upcoming: [M3-7704] - Disable Cloning, Private IP, Backups for edge regions (linode#10222)
  test: Fix test flake for Images landing page test (linode#10267)
  fix: [M3-7824] - ACLB TCP Rule Creation and other fixes (linode#10264)
  refactor: [M3-7687] - Linodes Restricted User Experience 2/2 (linode#10227)
  test: Resolve OBJ create and delete E2E test flake (linode#10245)
  upcoming: [M3-7723] - Placement Group feature flag as object (linode#10256)
  chore(deps): Bump sanitize-html from 2.11.0 to 2.12.1 (linode#10247)
  change: [M3-7813] - Allow the disabling of the TypeToConfirm input (linode#10251)
  upcoming: [M3-7839] - Change Business Partner to Parent User (linode#10259)
  upcoming: [M3-7835] - Adjust user table column count (linode#10252)
  upcoming: [M3 7738] - Update Placement Group Create & Edit Drawers (linode#10205)
  refactor: [M3-7437] - Use `@lukemorales/query-key-factory` for Profile Queries (linode#10241)
  fix: React Query `updateInPaginatedStore` helper function not working as expected (linode#10249)
  test: [M3-7497] - Add tests for child user verification banner (linode#10204)
  ...

# Conflicts:
#	packages/manager/src/MainContent.tsx
#	packages/manager/src/dev-tools/FeatureFlagTool.tsx
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! Placement Groups
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants