upcoming: [DPS-34193] - Add search and select to streams and destinations table

[kagora-akamai]

Description 📝

DataStream: Search and select inputs for streams and destinations tables

Changes 🔄

• In streams table:
  • Text input: Search for a Stream
  • Select: filter by Status
• In destinations table:
  • Text input: Search for a Destination

Scope 🚢

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

• No customers / Not applicable

Target release date 🗓️

September 2025

Preview 📷

Before	After

How to test 🧪

Prerequisites

• Open Local Dev Tools
• Enable MSW, set Base Preset to CRUD
• Apply

Verification steps

• Destinations:

  • Navigate to datastream/destinations
  • Create a new destination if there is none (Click on Create Destination, fill the form, submit with Create Destination, on success you will be redirected to datastream/destinations)
  • Fill search input
  • Label should appear in url query
  • Open Local Dev Tools > React Query > Select last datastream destinations query - See chosen values are in query details

• Streams:

  • Navigate to datastream/streams
  • Create a new stream if there is none (Click on Create Stream, fill the form, choose existing Destination, submit with Create Stream, on success you will be redirected to datastream/streams)
  • Fill search input, select status
  • Both values should appear in url query
  • Open Local Dev Tools > React Query > Select last datastream streams query - See chosen values are in query details

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
📱 Providing mobile 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

[linode-gh-bot]

Cloud Manager UI test results

🔺 2 failing tests on test run #2 ↗︎

❌ Failing	✅ Passing	↪️ Skipped	🕐 Duration
2 Failing	703 Passing	4 Skipped	137m 39s

Details

Failing Tests
	Spec	Test
❌	smoke-linode-landing-table.spec.ts	Cloud Manager Cypress Tests→linode landing checks » checks the landing page side menu items
❌	restricted-user-details-pages.spec.ts	Cloud Manager Cypress Tests→restricted user details pages » should disable action elements and buttons in the 'Linodes' details page

Troubleshooting

Use this command to re-run the failing tests:

pnpm cy:run -s "cypress/e2e/core/linodes/smoke-linode-landing-table.spec.ts,cypress/e2e/core/account/restricted-user-details-pages.spec.ts"

[bill-akamai]

@kagora-akamai I'm confused about what to do after reaching datastream/streams/.
Should this be done somewhere while creating a stream or should there be streams available from the mock data (I don't see any)?

Fill search input, select status

Would you be able to share a video?

[kagora-akamai]

@kagora-akamai I'm confused about what to do after reaching datastream/streams/. Should this be done somewhere while creating a stream or should there be streams available from the mock data (I don't see any)?

Fill search input, select status

Would you be able to share a video?

Hi @bill-akamai!

Sorry for the confusion. You need to create a new Stream for the view in datastream/streams to change into table. Before that create a new Destination in Destinations tab, it will be needed for creating new stream.

I've updated the commit description.

[bill-akamai]

Thanks @kagora-akamai - I was able to see the search/select inputs. Assuming the actual filtering logic will be upcoming so approving the presentation of it 👍