feat(lightspeed): add Sources chip + popover for notebook context

[its-mitesh-kumar]

Description

Replace the inline SourcesCard in the Notebook view with a compact "N Sources" chip button that opens a PatternFly Popover displaying source documents. Each source is shown with a colored FileTypeIcon badge and optional description summary. This change is scoped exclusively to the Notebook context — the general chat view retains its original inline sources display.

Also consolidates source document handling during streaming to use the shared transformDocumentsToSources utility for consistency, and adds i18n translations for all 5 supported languages (Japanese, French, German, Spanish, Italian).

Fixed

• https://redhat.atlassian.net/browse/RHIDP-14655

UI after changes

S_.2026-07-03.at.1.02.25.PM.mov

S_.2026-07-03.at.1.03.36.PM.mov

S_.2026-07-03.at.1.04.11.PM.mov

S_.2026-07-03.at.2.11.46.PM.mov

✔️ Checklist

• A changeset describing the change and affected packages. (more info)
• Added or Updated documentation
• Tests for new functionality and regression tests for bug fixes
• Screenshots attached (for UI changes)

[rhdh-gh-app]

Important

This PR includes changes that affect public-facing API. Please ensure you are adding/updating documentation for new features or behavior.

Changed Packages

Package Name	Package Path	Changeset Bump	Current Version
@red-hat-developer-hub/backstage-plugin-lightspeed	workspaces/lightspeed/plugins/lightspeed	minor	v2.9.1

[codecov]

Codecov Report

❌ Patch coverage is 92.10526% with 3 lines in your changes missing coverage. Please review.
✅ Project coverage is 54.59%. Comparing base (1538230) to head (8e1a430).
✅ All tests successful. No failed tests found.

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #3672      +/-   ##
==========================================
+ Coverage   54.57%   54.59%   +0.01%     
==========================================
  Files        2360     2361       +1     
  Lines       90085    90115      +30     
  Branches    25178    25180       +2     
==========================================
+ Hits        49165    49199      +34     
+ Misses      40605    40601       -4     
  Partials      315      315              

Flag	Coverage Δ		*Carryforward flag
adoption-insights	83.70% <ø> (ø)		Carriedforward from 1538230
ai-integrations	68.35% <ø> (ø)		Carriedforward from 1538230
app-defaults	69.79% <ø> (ø)		Carriedforward from 1538230
augment	46.39% <ø> (ø)		Carriedforward from 1538230
boost	73.07% <ø> (ø)		Carriedforward from 1538230
bulk-import	72.46% <ø> (ø)		Carriedforward from 1538230
cost-management	14.10% <ø> (ø)		Carriedforward from 1538230
dcm	61.81% <ø> (ø)		Carriedforward from 1538230
extensions	61.53% <ø> (ø)		Carriedforward from 1538230
global-floating-action-button	71.18% <ø> (ø)		Carriedforward from 1538230
global-header	59.71% <ø> (ø)		Carriedforward from 1538230
homepage	50.30% <ø> (ø)		Carriedforward from 1538230
install-dynamic-plugins	56.77% <ø> (ø)		Carriedforward from 1538230
konflux	91.49% <ø> (ø)		Carriedforward from 1538230
lightspeed	69.05% <92.10%> (+0.23%)	⬆️
mcp-integrations	85.46% <ø> (ø)		Carriedforward from 1538230
orchestrator	42.97% <ø> (ø)		Carriedforward from 1538230
quickstart	65.63% <ø> (ø)		Carriedforward from 1538230
sandbox	79.56% <ø> (ø)		Carriedforward from 1538230
scorecard	82.67% <ø> (ø)		Carriedforward from 1538230
theme	61.26% <ø> (ø)		Carriedforward from 1538230
translations	7.25% <ø> (ø)		Carriedforward from 1538230
x2a	78.68% <ø> (ø)		Carriedforward from 1538230

*This pull request uses carry forward flags. Click here to find out more.

---

Continue to review full report in Codecov by Harness.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 1538230...8e1a430. Read the comment docs.

🚀 New features to boost your workflow:

• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[its-mitesh-kumar]

@HusneShabbir Lets firstly wait for @ShiranHi feedback, then only go for go for testing it. There are differences wrt to prototype like we are using PF popups and tried not overriding it much to look exactly as our prototype. Secondly in RHDH 2.1 we will not have the document summary, so we will be only showing documents name, that's why I added the lines between each doscuments.

[its-mitesh-kumar]

/fs-review

[fullsend-ai-review]

🤖 Finished Review · ✅ Success · Started 9:07 AM UTC · Completed 9:21 AM UTC
Commit: 0186e63 · View workflow run →

[fullsend-ai-review]

Review

Findings

Medium

• [injection-vuln] workspaces/lightspeed/plugins/lightspeed/src/components/SourcesChipModal.tsx:133 — The handleSourceClick function passes the link value directly to window.open() without URL scheme validation. The link originates from backend data (doc_url via transformDocumentsToSources). If backend data were poisoned, a javascript: URI could execute arbitrary code in the user's browser context. The if (link) guard only checks truthiness, not the URL scheme.
  Remediation: Validate the URL protocol before calling window.open():

  const url = new URL(link, window.location.origin);
  if (!['http:', 'https:'].includes(url.protocol)) return;

• [logic-error] workspaces/lightspeed/plugins/lightspeed/src/components/SourcesChipModal.tsx:139 — When isExternal is falsy, handleSourceClick calls window.open(link, '_self'), which navigates the entire browser window away from the Backstage SPA. This causes the user to lose their chat session and application state. In practice, transformDocumentsToSources sets isExternal: !!doc?.doc_url, so any source with a URL will have isExternal=true — making this branch reachable only if isExternal is explicitly set to false while a link is provided. The likelihood is low, but the logic is semantically incorrect.
  Remediation: Either always open links in a new tab (_blank with noopener,noreferrer) or use client-side navigation for internal links.

Low

• [test-inadequate] workspaces/lightspeed/plugins/lightspeed/src/components/__tests__/SourcesChipModal.test.tsx — The test suite covers rendering, popover open/close, fallback titles, and source display, but does not verify window.open behavior when a source link is clicked. The handleSourceClick function contains branching logic (external vs non-external) that would benefit from test coverage.

• [insufficient-referrer-protection] workspaces/lightspeed/plugins/lightspeed/src/components/SourcesChipModal.tsx:139 — When isExternal is true, window.open is called with 'noreferrer' but not 'noopener'. Modern browsers treat noreferrer as implying noopener, but using 'noopener,noreferrer' would be defense-in-depth.

• [translation-cast-idiom] workspaces/lightspeed/plugins/lightspeed/src/components/SourcesChipModal.tsx:193 — The translation call uses (t as Function)(...). While this pattern exists in ~7 places in the notebooks area, the dominant codebase convention (~16 occurrences) is t('key' as any, { params }). Consider aligning with the more prevalent pattern.

• [naming-convention] workspaces/lightspeed/plugins/lightspeed/src/components/LightspeedChatBox.tsx:118 — The prop useSourcesChipModal reads like a React hook name (the use prefix is conventionally reserved for hooks). Other boolean props in this component use patterns like topicRestrictionEnabled, isStreaming. Consider renaming to showSourcesChipPopover or sourcesChipPopoverEnabled.

[ShiranHi]

Thank you @its-mitesh-kumar, looks good to me. I understand that we are unable to remove the border line between each result or change the 'i' icon from purple to gray. If that’s a constraint, I am completely fine with this implementation. Thank you!

[its-mitesh-kumar]

@ShiranHi

we are unable to remove the border line between each result or change

We can remove the border line between each result. I did introduced it knowingly to look better. In 2.1 we will be only having only document name. Let me know your preference.

S_.2026-07-03.at.1.03.36.PM.mov

change the 'i' icon from purple to gray.

We can change the 'i' icon from purple to gray. I made it purple since to me its look better particularly in light theme. Let me know your preference.

[its-mitesh-kumar]

@ShiranHi Made both changes now

Light Theme

Dark Theme

Cc: @HusneShabbir

[HusneShabbir]

Implementation looks good.

Just one question: is there a reason we're using a different close button icon here? Wouldn't it be better to keep it consistent with the close icon used elsewhere?

.

[its-mitesh-kumar]

Implementation looks good.

Just one question: is there a reason we're using a different close button icon here? Wouldn't it be better to keep it consistent with the close icon used elsewhere?

.

@HusneShabbir this close icon is coming from PF popover. So lets not try to override it.

[HusneShabbir]

cc: @ShiranHi

[ciiay]

@HusneShabbir this close icon is coming from PF popover. So lets not try to override it.

@its-mitesh-kumar do we have a bug ticket for this issue? It affects MCP config modal icons too, the x icon and key icon. We need to find a universal fix for this.

[ciiay]

Thanks for the pr 👏 Mostly looks good to me, only left a couple nit comments. Also it might be worth adding a LightspeedChatBox test with useSourcesChipModal and updating the Message mock to render extraContent.endContent.

[its-mitesh-kumar]

@HusneShabbir this close icon is coming from PF popover. So lets not try to override it.

@its-mitesh-kumar do we have a bug ticket for this issue? It affects MCP config modal icons too, the x icon and key icon. We need to find a universal fix for this.

@ciiay Since its PF close icon only. So lets use this only. At other places if we are importing close icon from MUI or somewhere else we can change that and use PF close icon throughout lightspeed.

[ciiay]

@ciiay Since its PF close icon only. So lets use this only. At other places if we are importing close icon from MUI or somewhere else we can change that and use PF close icon throughout lightspeed.

Not only the close icon. It happens to key icon on MCP config modal as well. Before the issue gets resolved in upstream, what can we do from our level? Do you think we need a jira ticket to track this issue?

[ciiay]

Thanks for the pr 👏

/lgtm

[karthikjeeyar]

Haven't tested yet, I have some code style comments.

[karthikjeeyar]

As far as the X icon issue, I can see there two icons rendered at the same time from PF, pf-v6-icon-rh-ui and pf-v6-icon-default, these two icons stacked on each other. Check why two icons are rendering at the same time or check with PF team to solve this issue in this lightspeed plugin.

[its-mitesh-kumar]

As far as the X icon issue, I can see there two icons rendered at the same time from PF, pf-v6-icon-rh-ui and pf-v6-icon-default, these two icons stacked on each other. Check why two icons are rendering at the same time or check with PF team to solve this issue in this lightspeed plugin.

@karthikjeeyar I have commented my some findings here : #3627 (review)

I will be checking the same with PF team, too.

[its-mitesh-kumar]

@karthikjeeyar Updated the patternfly version. Its solving the double close icon issue as well as the double icon issue @ciiay was trying to fix here #3627 . I will be discussing this PF team and will do needful.

[karthikjeeyar]

@karthikjeeyar I have commented my some findings here : #3627 (review)

I will be checking the same with PF team, too.

Thanks. Since PatternFly is gradually transitioning to Red Hat brand icons, we should temporarily hideicon-default using display:none (and include a TODO comment) instead of hiding .pf-v6-icon-rh-ui

I see this pf-v6-icon-rh-ui is hidden in some other places already, can you update that as well to hide the default icon infavor of RH UI icons? cc: @ciiay

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

[karthikjeeyar]

/lgtm