change: [UIE-9701] - Add Back Navigation functionality in Drawer & Integrate the change with PrefixList Drawer

[harsh-akamai]

Description 📝

• Add optional Back Navigation to the Drawer

Scope 🚢

Upon production release, changes in this PR will be visible to:

• All customers
• Some customers (e.g. in Beta or Limited Availability)
• No customers / Not applicable

Preview 📷

Using handleBackNavigation conditionally:

Description	Preview
One level Drawer
Two level Drawer (with Back Navigation Icon)

How to test 🧪

Prerequisites

• Add the handleNavigation prop to any of the <Drawer /> Component

Verification steps

• Verify that the handleNavigation event handler works as expected
• Verify the story added to Storybook
• Verify the < icon is not visible when isFetching is true.
• Verify the < icon is visible only on second-level PrefixList Drawers:
  • You can test using real data or by enabling MSW and the "Firewall RuleSets and PrefixList" feature flag with account capabilities
  • Click the Prefix List referenced in the firewall rules table row and verify that a first-level PrefixList drawer does not show the < icon
  • Go to Add Rule Drawer -> select any Prefix List and click "View Details" of the Prefix List, then verify that the < icon is visible in the PrefixList drawer
  • Optional: Go to a Ruleset where a Prefix List is already referenced, click that Prefix List from the Ruleset drawer, and verify that the < icon is visible in the PrefixList drawer.

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

[tvijay-akamai]

Let's use spacingFunction here

[tvijay-akamai]

overall looks good. One small change needed.

[grevanak-akamai]

In figma design for prefix list requirement, size for the icon is 24*24. Also it is not looking center aligned with label.

[linode-gh-bot]

Cloud Manager UI test results

🔺 7 failing tests on test run #10 ↗︎

❌ Failing	✅ Passing	↪️ Skipped	🕐 Duration
7 Failing	820 Passing	11 Skipped	57m 39s

Details

Failing Tests
	Spec	Test
❌	create-linode.spec.ts	Cloud Manager Cypress Tests→Create Linode→End-to-end→By plan type » creates a Premium CPU Linode
❌	create-linode-blackwell.spec.ts	Cloud Manager Cypress Tests→smoketest for Nvidia blackwell GPUs in linodes/create page » disables Blackwells if disabled region selected
❌	create-linode-blackwell.spec.ts	Cloud Manager Cypress Tests→smoketest for Nvidia blackwell GPUs in linodes/create page » enables Blackwells if enabled region selected
❌	lke-create.spec.ts	Cloud Manager Cypress Tests→smoketest for Nvidia Blackwell GPUs in kubernetes/create page→standard tier » enabled feature flag includes blackwells
❌	plan-selection.spec.ts	Cloud Manager Cypress Tests→displays specific linode plans for GPU » Should render divided tables when GPU divider enabled
❌	plan-selection.spec.ts	Cloud Manager Cypress Tests→displays specific kubernetes plans for GPU » Should render divided tables when GPU divider enabled
❌	clone-linode.spec.ts	Cloud Manager Cypress Tests→clone linode » can clone a Linode from Linode details page

Troubleshooting

Use this command to re-run the failing tests:

pnpm cy:run -s "cypress/e2e/core/linodes/create-linode.spec.ts,cypress/e2e/core/linodes/create-linode-blackwell.spec.ts,cypress/e2e/core/kubernetes/lke-create.spec.ts,cypress/e2e/core/linodes/plan-selection.spec.ts,cypress/e2e/core/linodes/clone-linode.spec.ts"