upcoming: [M3-9535] - Support VPC interfaces on updated Linode Create Networking flow #11847

bnussman-akamai · 2025-03-13T22:36:50Z

Description 📝

Improves type-safety of the Linode Create flow in general to avoid as casting as much as possible
Adds initial support for adding a VPC on the updated Networking section of the Linode Create Flow

Note

I put a lot of focus on improving the type-safety of the Linode Create Flow so to keep PRs small. I will follow this PR up with more PRs to finish the VPC section and to implement other changes.

Preview 📷

How to test 🧪

Prerequisites

Use devenv
- I have a shared devenv instances setup for this project. I'm happy to share instructions on how to use it! Just reach out to me!
Ensure the Linode Interfaces Cloud Manager feature flag is enabled

Verification steps

Go to the Linode Create Flow http://localhost:3000/linodes/create
Try creating Linodes with many networking variations
Ensure you can attach a VPC using new Linode Interfaces
Ensure you can attach a VPC using legacy interfaces
Check for regressions on the Linode Create Flow and Linode Rebuild flow (because lots of types and validation schemas got updated)

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 unit tests are passing
TypeScript compilation succeeded without errors
Code passes all linting rules

…tion-drawer

…the Linode create flow

bnussman-akamai · 2025-03-17T14:55:27Z

packages/manager/src/features/Linodes/LinodeCreate/resolvers.ts

+    const { errors } = await yupResolver(
+      schema,
      {},
      { mode: 'async', raw: true }
-    )(transformedValues as LinodeCreateFormValues, context, options);
+    )(values, context, options);


No more as type casts 🎉

The type of schema now actually matches the form's values (LinodeCreateFormValues)

bnussman-akamai · 2025-03-17T14:58:05Z

packages/validation/src/linodes.schema.ts

  firewall_id: number().nullable().notRequired(),
-  placement_group: PlacementGroupPayloadSchema,
+  placement_group: PlacementGroupPayloadSchema.notRequired().default(undefined),


This is not intuitive to me, but this is how I had to handle an optional object with required fields.

How to create optional object with required fields? jquense/yup#772

Let me know if there is a better way to handle this

.notRequired().nullable() maybe? (haven't tried)

Same issue unfortunately

notRequired includes nullable already https://github.com/jquense/yup?tab=readme-ov-file#schemanotrequired-schema

Either, way it doesn't work as I expect for optional object with required fields

bnussman-akamai · 2025-03-17T15:01:00Z

packages/api-v4/src/linodes/types.ts

@@ -527,7 +543,7 @@ export interface CreateLinodeRequest {
   * This is used to set the swap disk size for the newly-created Linode.
   * @default 512
   */
-  swap_size?: number;
+  swap_size?: number | null;


Now that the type-safety is largely improved, I had to make these changes so that this type matches our validation schema

In most cases, if the API allows a value to be omitted, it will also gracefully handle null and treat it the same.

github-actions · 2025-03-17T15:37:36Z

Coverage Report: ✅
Base Coverage: 79.96%
Current Coverage: 79.97%

abailly-akamai

Thanks for improving the types here and avoiding casting for such an important flow.

I did not notice anything wrong while testing, and noticed no regressions with existing flow with flag turned off 9In DEVENV). but added some comments that hopefully can improve the PR. Also adding below a few questions:

PR review: reliance on devenv to review PRs is a big ask, and a not so team friendly approach. Is there anything that can be done by way of mocking to facilitate the review process for this feature?

Some small UI considerations:

VLAN not being available in the region selected should get a much better (and visible) treatment. Maybe closer to the kind of warnings we get in the plan selection

When creating a VOC from the Linode create flow and it gets p[laced in the select, the error should go away

abailly-akamai · 2025-03-18T03:30:27Z

packages/manager/src/features/Linodes/LinodeCreate/Networking/utilities.ts

+      }
+    }
+  }
+  return errors;


I think you could come up with a cleaner way, something like:

export const transformLegacyInterfaceErrorsToLinodeInterfaceErrors = ( errors: APIError[] ) => { return errors.map(error => ({ ...error, field: Object.entries(legacyFieldToNewFieldMap).reduce( (field, [key, value]) => field ? field.replace(key, value) : field, error.field ).replace('interfaces', 'linodeInterfaces') })); };

May not be as readable and not 100% this is the best path, but it avoids mutating which is bad practice.

abailly-akamai · 2025-03-18T03:52:56Z

packages/validation/src/linodes.schema.ts

  firewall_id: number().nullable().notRequired(),
-  placement_group: PlacementGroupPayloadSchema,
+  placement_group: PlacementGroupPayloadSchema.notRequired().default(undefined),


.notRequired().nullable() maybe? (haven't tried)

abailly-akamai · 2025-03-18T03:53:11Z

packages/manager/src/features/Linodes/LinodeCreate/resolvers.ts

+    const { errors } = await yupResolver(
+      schema,
      {},
      { mode: 'async', raw: true }
-    )(transformedValues as LinodeCreateFormValues, context, options);
+    )(values, context, options);


abailly-akamai · 2025-03-18T13:39:33Z

packages/api-v4/src/linodes/types.ts

  /**
   * A property with a string literal type indicating whether the Linode is encrypted or unencrypted.
   * @default 'enabled' (if the region supports LDE)
   */
-  disk_encryption?: EncryptionStatus;
+  disk_encryption?: EncryptionStatus | null;


This is fine, but does it open the door to having ALL our APIv4 POST/PUT payload types have to inherit this pattern eventually? Nothing wrong with it, but this is a considerable change to bring to the table.

Yeah, I think api-v4 and validation should always match what the API supports, which usually means treating null and omitting the value the same.

I'm sure apiv4 is inconstant with this and I'm confident validation is even more inconstant with it

coliu-akamai · 2025-03-18T16:31:07Z

@abailly-akamai Just put up #11875 to hopefully help with some Linode Interface mocking. This doesn't handle [M3-9097] yet but hopefully alleviates some of the burden 🤞

will begin reviewing this PR shortly!

linode-gh-bot · 2025-03-18T17:32:45Z

Cloud Manager UI test results

🔺 1 failing test on test run #9 ↗︎

❌ Failing	✅ Passing	↪️ Skipped	🕐 Duration
`1 Failing`	`538 Passing`	`3 Skipped`	`107m 23s`

Details

Failing Tests
	Spec	Test
❌	`linode-config.spec.ts`	End-to-End » Clones a config

Troubleshooting

Use this command to re-run the failing tests:

pnpm cy:run -s "cypress/e2e/core/linodes/linode-config.spec.ts"

…ork-connection-drawer

coliu-akamai

✅ Old UI - confirmed creating Linodes with various interfaces including VPC
✅ New UI

confirmed creating Linodes with legacy interfaces (with various interfaces including VPC)
Confirmed creating Linodes with new interfaces (including VPC) and attaching firewalls

✅ Confirmed rebuilding flow for each of the cases above ^

❓ On the new UI, using legacy configs, I'm unable to create a Linode with two public interfaces (expected) but I see no UI changes - there's no error/network request:

public-interface-no-error.mov

bnussman-akamai · 2025-03-18T20:29:48Z

Good catch. 🙏 I didn't try that case. I surfaced that error in 6d02652

…rovide is checked (#11902) Fixes validation bug affecting the Linode Rebuild flow When trying to rebuild a Linode with the Reuse user data previously provided checkbox checked, a client-side validation error would occur Caused by upcoming: [M3-9535] - Support VPC interfaces on updated Linode Create Networking flow #11847 In that PR, I think I correctly aligned our validation schemas with the API's behavior, but I failed to realize that the changes I made to MetadataSchema would break this flow. Co-authored-by: Banks Nussman <banks@nussman.us>

bnussman added 6 commits March 13, 2025 11:38

add vpc field

020c05c

add subnet field

6dbb533

attempt to improve validation layre

295f00c

save progress

8383903

hopefully fix all typesafety issues

ecc443b

things seems to be working

cdc5d70

bnussman-akamai added Linode Create Refactor Linode Interfaces labels Mar 13, 2025

bnussman-akamai self-assigned this Mar 13, 2025

make sure legacy interfaces can be created safely

68ff981

bnussman-akamai removed the Linode Create Refactor label Mar 13, 2025

bnussman added 5 commits March 13, 2025 19:43

improve UX a bit

056388f

Merge branch 'develop' into M3-9534-support-vpc-in-add-network-connec…

391d8a2

…tion-drawer

continue working on validation

e1e76a2

clean up tansformer function

450f87e

add nicer validation errors

a5d558d

bnussman-akamai marked this pull request as ready for review March 17, 2025 14:47

bnussman-akamai requested a review from a team as a code owner March 17, 2025 14:47

bnussman-akamai requested review from hana-akamai, abailly-akamai and coliu-akamai and removed request for a team March 17, 2025 14:47

bnussman added 3 commits March 17, 2025 10:51

Added changeset: Improved accuracy of schemas related to Linode creation

ffd9d14

Added changeset: Initial support for VPCs using Linode Interfaces on …

ff4395e

…the Linode create flow

Added changeset: Improved type-safety of Linode Create flow form

5fc42d0

bnussman-akamai commented Mar 17, 2025

View reviewed changes

abailly-akamai approved these changes Mar 18, 2025

View reviewed changes

bnussman added 2 commits March 18, 2025 10:45

validate when values are populated from drawer

42a3772

use notices instead of helper text

499b744

coliu-akamai mentioned this pull request Mar 18, 2025

upcoming: [M3-9096] - Add factories and mocks for new API /v4/linode/interfaces endpoints #11875

Merged

4 tasks

bnussman added 2 commits March 18, 2025 14:11

fix spelling

4bf1265

Merge branch 'develop' into M3-9534-support-vpc-in-addt push or -netw…

ad8acdd

…ork-connection-drawer

coliu-akamai approved these changes Mar 18, 2025

View reviewed changes

surface another error

6d02652

coliu-akamai added the Approved label Mar 18, 2025

bnussman-akamai merged commit 793d1a8 into linode:develop Mar 19, 2025
26 of 27 checks passed

This was referenced Mar 20, 2025

Release v1.138.0 - release → staging #11895

Merged

Release v1.138.0 - staging → master #11900

Merged

fix: Linode Rebuild dialog erroring when Reuse user data previously provide is checked #11902

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

upcoming: [M3-9535] - Support VPC interfaces on updated Linode Create Networking flow #11847

upcoming: [M3-9535] - Support VPC interfaces on updated Linode Create Networking flow #11847

bnussman-akamai commented Mar 13, 2025 •

edited

Loading

bnussman-akamai Mar 17, 2025

abailly-akamai Mar 18, 2025

bnussman-akamai Mar 17, 2025

abailly-akamai Mar 18, 2025

bnussman-akamai Mar 18, 2025

bnussman-akamai Mar 17, 2025

github-actions bot commented Mar 17, 2025 •

edited

Loading

abailly-akamai left a comment

abailly-akamai Mar 18, 2025

abailly-akamai Mar 18, 2025

abailly-akamai Mar 18, 2025

abailly-akamai Mar 18, 2025

bnussman-akamai Mar 18, 2025

coliu-akamai commented Mar 18, 2025

linode-gh-bot commented Mar 18, 2025

coliu-akamai left a comment

bnussman-akamai commented Mar 18, 2025

upcoming: [M3-9535] - Support VPC interfaces on updated Linode Create Networking flow #11847

upcoming: [M3-9535] - Support VPC interfaces on updated Linode Create Networking flow #11847

Conversation

bnussman-akamai commented Mar 13, 2025 • edited Loading

Description 📝

Preview 📷

How to test 🧪

Prerequisites

Verification steps

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

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

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

github-actions bot commented Mar 17, 2025 • edited Loading

abailly-akamai left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

coliu-akamai commented Mar 18, 2025

linode-gh-bot commented Mar 18, 2025

Cloud Manager UI test results

🔺 1 failing test on test run #9 ↗︎

Details

Troubleshooting

coliu-akamai left a comment

Choose a reason for hiding this comment

bnussman-akamai commented Mar 18, 2025

bnussman-akamai commented Mar 13, 2025 •

edited

Loading

github-actions bot commented Mar 17, 2025 •

edited

Loading