upcoming: [M3-9114] - Add support for Linode Interfaces in Firewalls AddLinodeDrawer #12035

coliu-akamai · 2025-04-15T20:08:36Z

Description 📝

adds support for creating Linode Interface devices in firewalls AddLinodeDrawer
In the Create Firewall drawer, filter out Linode interfaces (we're looking into potential UIs for this)

Changes 🔄

Update AddLinodeDrawer to keep track of Linode Interface information and handle adding interface devices
Use useEffect to filter the Linodes we can add due to needing to fetch a linode's linode interfaces 🥲

Target release date 🗓️

4/24 ish, 4/22 if possible

Preview 📷

Before	After

create firewall drawer:

How to test 🧪

Have the customer tag + checkout this pr locally or use preview link

Have a linode using legacy interfaces
li-a) Have a linode using new interfaces, with only one vlan interface
li-a2) Have a linode using new interfaces, but have 0 interfaces
li-b) Have a linode using new interfaces, with only one (non vlan) interface
li-c) Have a linode using new interfaces, with two interfaces (vpc and public)
li-d) have a linode using new interfaces, with two interfaces (vlan and non vlan)

Verification steps

Confirm you can add all linodes to a firewall (except li-a and li-a2, which should not appear in the firewall drop down)
confirm selecting li-b and li-d does not show the interface select (they only have one interface that can be added to a firewall)
confirm li-c shows the interface drop down as long as both interfaces have not yet been assigned to a firewall. once one of li-c's interfaces get assigned, an Interface select should no longer appear
Confirm error handling
confirm state makes sense if some interfaces/linodes fail vs others being able to be assigned

Create Firewall drawer

confirm Linode Interface linodes don't appear in assign linode list
confirm notice (in screenshot) appears
confirm ^ notice hidden if feature flag is off

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

coliu-akamai · 2025-04-16T16:23:46Z

packages/manager/src/features/Firewalls/FirewallDetail/Devices/AddLinodeDrawer.tsx

+    filterLinodes();
+  }, [allLinodes, assignedInterfaceIds, assignedLinodes, readOnlyLinodeIds]);


I am not sure what the best approach to filter out Linodes is.
Previously we could just pass in linodeOptionsFilter to the LinodeSelect and just directly call linodes.filter(linodeOptionsFilter). This doesn't work anymore now that we need to fetch a Linode's interfaces to determine if it can be assigned to a firewall (updating linodeOptionsFilter to be an async function)

I've settled on useEffect but I'm not too confident about this approach, especially bc I had to memoize a bunch of the dependencies (or run into an infinite loop 😬)
My react knowledge is lacking...anyone have other ideas? 🥲

Here's my attempt at simplifying things: https://github.com/coliu-akamai/manager/compare/m3-9114...bnussman-akamai:firewall-poc?expand=1

I was able to get rid of the useEffect without any regressions (i think) and I was able to clean up overall logic a bit, although the POC it is unfinished

I didn't get error handling working and I didn't handle VLAN interfaces gracefully, but take a look and let me know what you think. If you like any of this better, you could try introducing it into your PR.

With that said, I don't want to de-rail your current progress and slow us down, so if you'd rather we refactor this as a follow up effort, just let me know.

thanks Banks, will take a look! definitely interested in getting rid of the useEffect
for now since we're unsure of timelines and potentially proceeding with the out of cycle release, I'd like to plan this refactor as a follow up. However, if we hear that dates get pushed back, then I'll look into making the changes here - how does that sound?
(edit: unless if I finish my current ticket soon and have more time, will look into refactoring here)

Works for me!

coliu-akamai · 2025-04-16T16:32:32Z

packages/manager/src/features/Firewalls/FirewallDetail/Devices/AddLinodeDrawer.tsx

+        {isLinodeInterfacesEnabled &&
+          linodesWithMultiInterfaces.map((linode) => (
+            <Select


Discussed with UX - since it's very unlikely for users to have Linodes with multiple interfaces, we're ok with having these additional selects on the AddLinodeDrawer to allow for multiselecting Linodes. iirc we're also going with a single select for interfaces to reduce complexity (? will double check)

🤔 May circle back to design esp if this drawer ends up needing a lot of scrolling though... Wondering if combining something like the CreateFirewallDrawer custom vs template firewall select + the Subnet Assign drawer for interface devices could be viable

…nodeDrawer

packages/manager/src/features/Firewalls/FirewallDetail/Devices/AddLinodeDrawer.tsx

dwiley-akamai · 2025-04-17T20:28:23Z

packages/manager/src/features/Firewalls/FirewallDetail/Devices/AddLinodeDrawer.tsx

+      interfaceLinodes.map(async (linode) => {
+        const linodeId = linode.id;
+        const interfaces = await getLinodeInterfaces(linodeId);
+        // vlan interfaces cannot have a firewall assigned to them


Somewhat tangentially, I noticed this earlier today

Should we even display the firewall field if it's not supported for VLANs? Or should we at least disable them?

yup I think UX will have us hiding the VLAN interface firewall field eventually, will confirm + make a follow up ticket to track it and other UX feedback soon

…/AddLinodeDrawer.tsx Co-authored-by: Dajahi Wiley <[email protected]>

bnussman-akamai

Nice job making all of this come together 🙏

linode-gh-bot · 2025-04-22T19:28:12Z

Cloud Manager UI test results

🔺 1 failing test on test run #21 ↗︎

❌ Failing	✅ Passing	↪️ Skipped	🕐 Duration
`1 Failing`	`564 Passing`	`5 Skipped`	`124m 23s`

Details

Failing Tests
	Spec	Test
❌	`rebuild-linode.spec.ts`	Cloud Manager Cypress Tests→rebuild linode » rebuild linode

Troubleshooting

Use this command to re-run the failing tests:

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

coliu-akamai self-assigned this Apr 15, 2025

coliu-akamai added the Linode Interfaces label Apr 15, 2025

coliu-akamai force-pushed the m3-9114 branch 3 times, most recently from e534839 to 3d81172 Compare April 16, 2025 14:58

coliu-akamai changed the title ~~upcoming: [M3-9114] - Add support for Linode Interfaces in AddLinodeDrawer for Firewalls~~ upcoming: [M3-9114] - Add support for Linode Interfaces in Firewalls AddLinodeDrawer Apr 16, 2025

coliu-akamai added the Help Wanted Teamwork makes the dream work! label Apr 16, 2025

coliu-akamai commented Apr 16, 2025

View reviewed changes

coliu-akamai force-pushed the m3-9114 branch from a222987 to b66e73d Compare April 16, 2025 16:45

coliu-akamai marked this pull request as ready for review April 16, 2025 16:46

coliu-akamai requested a review from a team as a code owner April 16, 2025 16:46

coliu-akamai requested review from dwiley-akamai, hasyed-akamai and bnussman-akamai and removed request for a team April 16, 2025 16:46

coliu-akamai added the Ready for Review label Apr 16, 2025

coliu-akamai added 12 commits April 16, 2025 18:55

eslint

6072adf

figure out filtering, figure out everything tbh

4cb5a3d

my head hurts

1968b6e

save progress but the progress is...

ec57e2a

probably buggy but it feels clearer now (besides filtering)

ae5db8f

need to figure out filtering

975d609

copy update

5b026f6

filtering but at what cost

f0145ac

Added changeset: Add support for Linode Interfaces in Firewalls AddLi…

246af9c

…nodeDrawer

keep track of failed linodes with multiple interfaces to add

0f9dd33

fix button disabling bug

697c5a7

oops space

b66785f

coliu-akamai force-pushed the m3-9114 branch from b66e73d to b66785f Compare April 16, 2025 22:55

dwiley-akamai reviewed Apr 17, 2025

View reviewed changes

coliu-akamai and others added 4 commits April 18, 2025 09:54

Merge branch 'develop' into m3-9114

4cda21c

Update packages/manager/src/features/Firewalls/FirewallDetail/Devices…

97d86d4

…/AddLinodeDrawer.tsx Co-authored-by: Dajahi Wiley <[email protected]>

address feedback naming

cd6d4ea

Merge branch 'develop' into m3-9114

707a51e

bnussman-akamai approved these changes Apr 21, 2025

View reviewed changes

coliu-akamai added 2 commits April 21, 2025 16:59

quick changes to firewall create drawer

7a4554b

update changeset phrasing

ab90567

cpathipa approved these changes Apr 22, 2025

View reviewed changes

cpathipa added the Approved Multiple approvals and ready to merge! label Apr 22, 2025

coliu-akamai added Firewalls Related to Firewalls and removed Help Wanted Teamwork makes the dream work! Ready for Review labels Apr 22, 2025

Merge branch 'develop' into m3-9114

e3de239

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

upcoming: [M3-9114] - Add support for Linode Interfaces in Firewalls AddLinodeDrawer #12035

upcoming: [M3-9114] - Add support for Linode Interfaces in Firewalls AddLinodeDrawer #12035

coliu-akamai commented Apr 15, 2025 •

edited

Loading

coliu-akamai Apr 16, 2025

bnussman-akamai Apr 21, 2025 •

edited

Loading

coliu-akamai Apr 21, 2025 •

edited

Loading

bnussman-akamai Apr 21, 2025

coliu-akamai Apr 16, 2025 •

edited

Loading

dwiley-akamai Apr 17, 2025

coliu-akamai Apr 18, 2025

bnussman-akamai left a comment

linode-gh-bot commented Apr 22, 2025

		filterLinodes();
		}, [allLinodes, assignedInterfaceIds, assignedLinodes, readOnlyLinodeIds]);

upcoming: [M3-9114] - Add support for Linode Interfaces in Firewalls AddLinodeDrawer #12035

Are you sure you want to change the base?

upcoming: [M3-9114] - Add support for Linode Interfaces in Firewalls AddLinodeDrawer #12035

Conversation

coliu-akamai commented Apr 15, 2025 • edited Loading

Description 📝

Changes 🔄

Target release date 🗓️

Preview 📷

How to test 🧪

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 ✅

coliu-akamai Apr 16, 2025

Choose a reason for hiding this comment

bnussman-akamai Apr 21, 2025 • edited Loading

Choose a reason for hiding this comment

coliu-akamai Apr 21, 2025 • edited Loading

Choose a reason for hiding this comment

bnussman-akamai Apr 21, 2025

Choose a reason for hiding this comment

coliu-akamai Apr 16, 2025 • edited Loading

Choose a reason for hiding this comment

dwiley-akamai Apr 17, 2025

Choose a reason for hiding this comment

coliu-akamai Apr 18, 2025

Choose a reason for hiding this comment

bnussman-akamai left a comment

Choose a reason for hiding this comment

linode-gh-bot commented Apr 22, 2025

Cloud Manager UI test results

🔺 1 failing test on test run #21 ↗︎

Details

Troubleshooting

coliu-akamai commented Apr 15, 2025 •

edited

Loading

bnussman-akamai Apr 21, 2025 •

edited

Loading

coliu-akamai Apr 21, 2025 •

edited

Loading

coliu-akamai Apr 16, 2025 •

edited

Loading