upcoming: [M3 7738] - Update Placement Group Create & Edit Drawers by abailly-akamai · Pull Request #10205 · linode/manager

abailly-akamai · 2024-02-16T21:41:33Z

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

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:

Add a selectedRegionId to the PlacementGroupLanding create drawer instance
Verify the create drawer by clicking on "Create Placement Group" (see below)

⚠️ 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

abailly-akamai · 2024-02-28T22:08:15Z

packages/manager/src/features/PlacementGroups/PlacementGroupsAssignLinodesDrawer.test.tsx

Obsolete and replaced by query data

packages/manager/src/__data__/regionsData.ts

abailly-akamai · 2024-03-01T14:26:31Z

packages/manager/src/__data__/regionsData.ts

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

github-actions · 2024-03-01T15:39:01Z

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

This reverts commit 82d2fb0.

packages/manager/src/features/PlacementGroups/PlacementGroupsCreateDrawer.tsx

packages/manager/src/features/PlacementGroups/PlacementGroupsAffinityTypeSelect.tsx

carrillo-erik · 2024-03-05T17:34:11Z

LGTM!

…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

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 self-assigned this Feb 16, 2024

abailly-akamai added Work in Progress Placement Groups labels Feb 16, 2024

abailly-akamai force-pushed the M3-7738 branch from 592bfd7 to 94114df Compare February 27, 2024 17:37

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

abailly-akamai commented Feb 28, 2024

View reviewed changes

packages/manager/src/__data__/regionsData.ts Outdated Show resolved Hide resolved

abailly-akamai force-pushed the M3-7738 branch from fdd1269 to 83a59dc Compare February 29, 2024 18:38

abailly-akamai removed the Work in Progress label Feb 29, 2024

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 force-pushed the M3-7738 branch from 3d4ec78 to 877e206 Compare March 1, 2024 13:42

abailly-akamai marked this pull request as ready for review March 1, 2024 14:29

abailly-akamai requested a review from a team as a code owner March 1, 2024 14:29

abailly-akamai requested review from bnussman-akamai, carrillo-erik and jdamore-linode and removed request for a team March 1, 2024 14:29

abailly-akamai commented Mar 1, 2024

View reviewed changes

abailly-akamai added 10 commits March 4, 2024 11:23

Change "rename" nomenclature

d5773f0

Initial commit - refactor

77ccd7a

Post rebase fix

701a157

Affinity Enforcement

fd841e9

test

9c5c490

pg/account limit

f6da73a

update tests

275ea8a

Handle region PG limit

af890ad

Handle region PG limit test

b86a47b

Better edit form

3e0bfb1

abailly-akamai added 6 commits March 4, 2024 11:23

cleanup

1048acd

PlacementGroupsAffinityTypeSelect

f43488a

PlacementGroupsAffinityEnforcementRadioGroup

795b11d

cleanup

b73c250

cleanup

6d783c9

Added changeset: Update Placement Group Create & Edit Drawers

a89c673

abailly-akamai force-pushed the M3-7738 branch from 69b089a to a89c673 Compare March 4, 2024 16:23

abailly-akamai added 3 commits March 4, 2024 11:29

Make sure id is required

82d2fb0

Added changeset: Allow the disabling of the TypeToConfirm input

0f678cf

Revert "Make sure id is required"

1641591

This reverts commit 82d2fb0.

bnussman-akamai reviewed Mar 4, 2024

View reviewed changes

carrillo-erik reviewed Mar 5, 2024

View reviewed changes

packages/manager/src/features/PlacementGroups/PlacementGroupsAffinityTypeSelect.tsx Show resolved Hide resolved

Feedback

0b605d9

abailly-akamai requested review from bnussman-akamai and carrillo-erik March 5, 2024 16:30

carrillo-erik approved these changes Mar 5, 2024

View reviewed changes

bnussman-akamai approved these changes Mar 5, 2024

View reviewed changes

mjac0bs added the Approved Multiple approvals and ready to merge! label Mar 5, 2024

abailly-akamai merged commit e8b3716 into linode:develop Mar 5, 2024

This was referenced Mar 18, 2024

Release v1.115.0 - release → staging #10292

Merged

Release v1.115.0 - staging → master #10293

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

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

upcoming: [M3 7738] - Update Placement Group Create & Edit Drawers#10205
abailly-akamai merged 20 commits intolinode:developfrom
abailly-akamai:M3-7738

abailly-akamai commented Feb 16, 2024 •

edited

Loading

Uh oh!

abailly-akamai Feb 28, 2024

Uh oh!

Uh oh!

abailly-akamai Mar 1, 2024

Uh oh!

github-actions bot commented Mar 1, 2024 •

edited

Loading

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

carrillo-erik commented Mar 5, 2024

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Conversation

abailly-akamai commented Feb 16, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description 📝

Changes 🔄

Preview 📷

How to test 🧪

Prerequisites

Verification steps

As an Author I have considered 🤔

Uh oh!

abailly-akamai Feb 28, 2024

Choose a reason for hiding this comment

Uh oh!

Uh oh!

abailly-akamai Mar 1, 2024

Choose a reason for hiding this comment

Uh oh!

github-actions bot commented Mar 1, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

carrillo-erik commented Mar 5, 2024

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

abailly-akamai commented Feb 16, 2024 •

edited

Loading

github-actions bot commented Mar 1, 2024 •

edited

Loading