Fix application dropdown in branding page not showing all applications

[KaveeshaPiumini]

Purpose

Fixes the application dropdown on the Branding page (/console/branding, Application mode) not showing all non-M2M applications when the first page of results is M2M-heavy.

Related Issue

• Application dropdown in Branding page does not show all applications product-is#27768

Root cause

The dropdown uses react-infinite-scroll-component, which fires its next() callback only on a scroll event. M2M apps are filtered out client-side, so when the first API page is M2M-heavy (e.g. 7 M2M + 3 OIDC) only a few options remain visible — too few to overflow the 250px listbox. With no overflow there is no scroll, next() never fires, and applications on later pages (e.g. SAML apps) are permanently unreachable.

Solution

Added a useEffect that, while the dropdown is open, measures whether the scroll container actually overflows (scrollHeight <= clientHeight) once its options are laid out, and proactively loads the next page until the container can scroll or there are no more pages. This measures the real overflow rather than estimating from a fixed item count/height, and gates re-fetching on shouldFetchApplications/isValidating to avoid duplicate requests.

Testing

Verified on a tenant seeded with 3 SAML, 7 M2M and 3 OIDC apps (page 1 = 3 OIDC + 7 M2M, page 2 = 5 SAML): the dropdown now auto-loads later pages and shows all OIDC and SAML apps with no manual scroll, while M2M apps remain filtered out.

[coderabbitai]

📝 Walkthrough

Walkthrough

Adds proactive pagination to the branding page application Autocomplete. A new isApplicationDropdownOpen state is toggled via onOpen/onClose handlers, and a useEffect polls the dropdown's scroll container via requestAnimationFrame, incrementing appListOffset whenever the container does not overflow until all pages are fetched or scrolling becomes possible.

Changes

Proactive pagination for application dropdown

Layer / File(s)	Summary
Dropdown open-state tracking and Autocomplete wiring features/admin.branding.v1/components/branding-page-layout.tsx	Introduces isApplicationDropdownOpen boolean state and wires onOpen/onClose on the Autocomplete component to toggle it, gating the proactive pagination effect to only run while the dropdown is open.
Overflow-detection pagination effect features/admin.branding.v1/components/branding-page-layout.tsx	New useEffect polls via requestAnimationFrame for the autocomplete-scroll-container element, checks whether its content overflows, and increments appListOffset when it does not, repeating until overflow occurs or no more pages are available.
Changeset entry .changeset/strong-terms-retire.md	Adds a patch Changesets entry for @wso2is/console documenting the application dropdown pagination fix.

🚥 Pre-merge checks | ✅ 6

✅ Passed checks (6 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title accurately summarizes the main bug fix: enabling the application dropdown in the branding page to show all applications.
Linked Issues check	✅ Passed	The code changes fully address issue #27768 by implementing proactive pagination that measures scroll container overflow and loads pages until scrolling becomes possible.
Out of Scope Changes check	✅ Passed	All changes are directly scoped to fixing the application dropdown pagination issue. The component modification, useEffect hook, and changeset entry are all related to the stated objective.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Changeset Required	✅ Passed	Changeset file .changeset/strong-terms-retire.md exists with proper format: includes @wso2is/console package with patch version update and accurate description of the branding page fix.
Description check	✅ Passed	The PR description is comprehensive and well-structured, covering purpose, root cause, solution, testing, and related issue reference.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

• 🛠️ create changeset

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In @.changeset/branding-application-dropdown-overflow.md:
- Around line 1-3: The changeset file branding-application-dropdown-overflow.md
currently only includes `@wso2is/admin.branding.v1` with a patch update, but since
this PR modifies code in the features directory, you must also add the consuming
app-level package to the changeset. Determine the appropriate app package
(likely `@wso2is/console` based on the branding feature context) and add it to the
changeset file with a patch version update, following the same format as the
existing `@wso2is/admin.branding.v1` entry to ensure the feature changes are
properly released through the app package.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yml

Review profile: CHILL

Plan: Pro

Run ID: b19f1258-cad0-46fc-8491-4975b874440b

📥 Commits

Reviewing files that changed from the base of the PR and between 62a2911 and 9d5310e.

📒 Files selected for processing (2)

• .changeset/branding-application-dropdown-overflow.md
• features/admin.branding.v1/components/branding-page-layout.tsx

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 72.62%. Comparing base (315e6ea) to head (39e7fb8).
⚠️ Report is 1 commits behind head on master.

Additional details and impacted files

@@           Coverage Diff           @@
##           master   #10427   +/-   ##
=======================================
  Coverage   72.62%   72.62%           
=======================================
  Files         469      469           
  Lines       70633    70633           
  Branches      453      484   +31     
=======================================
  Hits        51300    51300           
- Misses      19037    19040    +3     
+ Partials      296      293    -3     

see 3 files with indirect coverage changes

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.