DPS-42065 : Virtualization changes for autocomplete, Loading message indicator by venkymano-akamai · Pull Request #654 · ACLPManager/manager

venkymano-akamai · 2026-04-06T05:01:23Z

Description 📝

Highlight the Pull Request's context and intentions.

Changes 🔄

List any change(s) relevant to the reviewer.

...
...

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

Target release date 🗓️

Please specify a release date (and environment, if applicable) to guarantee timely review of this PR. If exact date is not known, please approximate and update it as needed.

Preview 📷

Include a screenshot <img src="" /> or video <video src="" /> of the change.

🔒 Use the Mask Sensitive Data setting for security.

💡 For changes requiring multiple steps to validate, prefer a video for clarity.

Before	After
📷	📷

How to test 🧪

Prerequisites

(How to setup test environment)

...
...

Reproduction steps

(How to reproduce the issue, if applicable)

...
...

Verification steps

(How to verify changes)

...
...

Author Checklists

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

Check all that apply

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

…tocomplete_virtualization

Copilot

Pull request overview

This PR introduces virtualization for CloudPulse resource selection to improve Autocomplete performance with large option sets, and adds a delayed “taking longer than expected” loading indicator message for long-running CloudPulse loading states.

Changes:

Add react-window (and types) and a VirtualizedListbox implementation for virtualized Autocomplete list rendering.
Add a reusable useDelayedLoadingIndicator hook (with tests) and integrate it into CloudPulse dashboard filters and alert resource loading states.
Tune Autocomplete filtering via createFilterOptions to reduce work while typing.

Reviewed changes

Copilot reviewed 8 out of 9 changed files in this pull request and generated 6 comments.

Show a summary per file

File	Description
pnpm-lock.yaml	Locks new dependencies (`react-window`, `memoize-one`, `@types/react-window`) and related snapshot updates.
packages/manager/package.json	Adds `react-window` and `@types/react-window` to Manager dependencies.
packages/manager/src/features/CloudPulse/Utils/useDelayedLoadingIndicator.ts	New hook to show a secondary loading indicator after a delay.
packages/manager/src/features/CloudPulse/Utils/useDelayedLoadingIndicator.test.ts	Unit tests for the delayed loading hook using fake timers.
packages/manager/src/features/CloudPulse/shared/VirtualizedListBox.tsx	New `react-window`-based virtualized listbox component.
packages/manager/src/features/CloudPulse/shared/VirtualizedListBox.css	Styling for the virtualized listbox scrollbar behavior.
packages/manager/src/features/CloudPulse/shared/CloudPulseResourcesSelect.tsx	Integrates virtualized listbox and optimized filtering into the resources Autocomplete.
packages/manager/src/features/CloudPulse/shared/CloudPulseDashboardFilterBuilder.tsx	Adds delayed “taking longer” message to the filter builder loading state.
packages/manager/src/features/CloudPulse/Alerts/AlertsResources/AlertsResources.tsx	Adds delayed “taking longer” message to alerts resources loading state.

Files not reviewed (1)

pnpm-lock.yaml: Language not supported

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Copilot · 2026-04-07T06:00:09Z

+    // Wrapper component to connect VirtualizedListbox with MUI Autocomplete
+    const ListboxWrapper = React.forwardRef<
+      HTMLDivElement,
+      React.HTMLAttributes<HTMLElement>
+    >((props, ref) => {
+      // Extract children and forward to VirtualizedListbox
+      const { children, ...otherProps } = props;
+      return (
+        <Box ref={ref} {...otherProps}>
+          <VirtualizedListbox>{children}</VirtualizedListbox>
+        </Box>
+      );
+    });


The virtualized listbox introduces a nested scroll container (Box wrapping FixedSizeList). MUI’s Autocomplete uses the listbox ref/element to manage scrolling the highlighted option into view; with this structure, the forwarded ref points to the Box, but the actual scrollable element is inside FixedSizeList, which can break keyboard navigation/auto-scroll. Consider making the provided listbox component itself the scroll container and forwarding the ref to react-window’s outerRef (or otherwise wiring MUI’s listbox ref to the element that actually scrolls).

Copilot · 2026-04-07T06:00:10Z

            <CircleProgress size="md" />
+            {showLoadingIndicator && (
+              <Typography mt={2} variant="body1">
+                The loading time is over 10 seconds. Please wait while the process completes.


The delayed-loading message is hard-coded to “over 10 seconds”, which couples UI copy to the 10000ms parameter and can become incorrect if the delay changes. Consider deriving the displayed duration from the delay value (or a shared constant) and using clearer user-facing copy (e.g., “Loading is taking longer than expected…”).

Suggested change

The loading time is over 10 seconds. Please wait while the process completes.

Loading is taking longer than expected. Please wait while the process completes.

Copilot · 2026-04-07T06:00:10Z

+          <CircleProgress />
+          {showLoadingIndicator && (
+            <Typography variant="body1">
+              The loading time is over 10 seconds. Please wait while the process completes.


The delayed-loading message is hard-coded to “over 10 seconds”, which couples UI copy to the 10000ms parameter and can become incorrect if the delay changes. Consider deriving the displayed duration from the delay value (or a shared constant) and using clearer user-facing copy (e.g., “Loading is taking longer than expected…”).

Suggested change

The loading time is over 10 seconds. Please wait while the process completes.

Loading is taking longer than expected. Please wait while the process completes.

Copilot

Pull request overview

Copilot reviewed 8 out of 9 changed files in this pull request and generated 1 comment.

Files not reviewed (1)

pnpm-lock.yaml: Language not supported

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

…ents is greater than 100

…amai/manager into autocomplete_virtualization

Copilot

Pull request overview

Copilot reviewed 7 out of 8 changed files in this pull request and generated 5 comments.

Files not reviewed (1)

pnpm-lock.yaml: Language not supported

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

venkymano-akamai · 2026-04-09T09:03:13Z

all the cypress failures will be fixed in automation PR

venkymano-akamai added 8 commits April 1, 2026 12:32

upcoming: [DPS-41595] - Initial changes for virtualisation

4b5a254

Merge branch 'aclp_develop' of github.com:ACLPManager/manager into au…

c2b899d

…tocomplete_virtualization

upcoming: [DPS-41595] - dependency updates

782ddd2

upcoming: [DPS-41595] - Loading indicator changes

b798128

upcoming: [DPS-41595] - remove / fix eslint warnings

30c95c0

upcoming: [DPS-41595] - Add useHook to achieve the delay indicator logic

2963d05

upcoming: [DPS-41595] - Modify useHook efficiently

836db09

upcoming: [DPS-41595] - Remove unused styles

caa5723

venkymano-akamai marked this pull request as ready for review April 7, 2026 05:54

venkymano-akamai requested a review from a team as a code owner April 7, 2026 05:54

venkymano-akamai requested review from Copilot, kmuddapo and santoshp210-akamai April 7, 2026 05:54

Copilot started reviewing on behalf of venkymano-akamai April 7, 2026 05:55 View session

Copilot AI reviewed Apr 7, 2026

View reviewed changes

Merge branch 'aclp_develop' into autocomplete_virtualization

9ca445e

agorthi-akamai requested a review from Copilot April 7, 2026 06:03

Copilot started reviewing on behalf of agorthi-akamai April 7, 2026 06:04 View session

Copilot AI reviewed Apr 7, 2026

View reviewed changes

Comment thread packages/manager/src/features/CloudPulse/shared/CloudPulseResourcesSelect.tsx

venkymano-akamai added 3 commits April 7, 2026 11:56

upcoming: [DPS-41595] - Remove unused styles

e356b2f

upcoming: [DPS-41595] - Fix styles and do virtualization only if elem…

75d004a

…ents is greater than 100

Merge branch 'autocomplete_virtualization' of github.com:venkymano-ak…

985cde7

…amai/manager into autocomplete_virtualization

agorthi-akamai requested a review from Copilot April 8, 2026 05:19

Copilot started reviewing on behalf of agorthi-akamai April 8, 2026 05:20 View session

Copilot AI reviewed Apr 8, 2026

View reviewed changes

venkymano-akamai added 4 commits April 9, 2026 10:28

upcoming: [DPS-41595] - Message modification

b0f4343

upcoming: [DPS-41595] - Added a property descritption

4af3ee7

upcoming: [DPS-41595] - Production grade code refactoring

074b619

upcoming: [DPS-41595] - Lint issue fixes

de7f5a1

santoshp210-akamai approved these changes Apr 9, 2026

View reviewed changes

venkymano-akamai merged commit 83f9676 into ACLPManager:aclp_develop Apr 9, 2026
32 checks passed

Navigation Menu

Uh oh!

DPS-42065 : Virtualization changes for autocomplete, Loading message indicator - #654

DPS-42065 : Virtualization changes for autocomplete, Loading message indicator#654
venkymano-akamai merged 16 commits into
ACLPManager:aclp_developfrom
venkymano-akamai:autocomplete_virtualization

venkymano-akamai commented Apr 6, 2026

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Copilot AI Apr 7, 2026

Uh oh!

Uh oh!

Uh oh!

Copilot AI Apr 7, 2026

Uh oh!

Copilot AI Apr 7, 2026

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

venkymano-akamai commented Apr 9, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

	The loading time is over 10 seconds. Please wait while the process completes.
	Loading is taking longer than expected. Please wait while the process completes.

Uh oh!

Conversation

venkymano-akamai commented Apr 6, 2026

Description 📝

Changes 🔄

Scope 🚢

Target release date 🗓️

Preview 📷

How to test 🧪

Prerequisites

Reproduction steps

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 ✅

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Copilot AI Apr 7, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Copilot AI Apr 7, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Apr 7, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

venkymano-akamai commented Apr 9, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants