feat(intelligent-assistant): Lightspeed Notebook enhancements

[its-mitesh-kumar]

Description

UI/UX improvements for the Lightspeed Notebook, aligned to the prototype and acceptance criteria in RHIDP-14896.

Fixed

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

UI after changes

S_.2026-08-05.at.2.21.58.PM.mov

Changes

Notebook card list

• Humanized document count: "No resources" (zero), "1 document" (singular), "N resources" (plural)
• Removed extra left padding on card body text for proper alignment

Notebook action menu

• Added PenIcon to Rename and TrashIcon to Delete dropdown items

Add button icon

• Changed sidebar "Add" button icon from PlusCircleIcon (filled) to AddCircleOIcon (outline)
• Moved "Upload a resource" button icon to the left side

Upload modal

• Title changed to "Add resources"
• Drag-and-drop text updated to "Drag and drop files here, or click to browse"
• Replaced plain-text file types with styled chips derived from NOTEBOOK_EXTENSION_TO_FILE_TYPE
• Added "Supported formats:" label and "Maximum file size is 25 MB." text
• Upload icon styled with brand/blue color and increased size
• "Add" button shows count only when files are selected (no more "Add (0)")
• Entire dropzone area is clickable to browse files (custom DropzoneClickArea component)

Upload modal X button

• Removed red hover color from file remove button
• Replaced MUI CloseIcon with PF TimesIcon (12x12px)
• Changed file item container from solid background to border-only style

Disabled dropzone at file limit

• Dropzone is now visually disabled (opacity + pointer-events) instead of hidden when 10 files are reached
• Tooltip on hover shows the max-reached message

Prevent stacked modals

• Upload modal closes before overwrite modal opens (no more modal stacking)
• Redesigned overwrite modal: "File already exists" title, warning alert with counts, "Replace existing files" / "Ignore duplicated files" radio options, file list with warning icons on duplicates, "Upload (N)" / "Back" buttons
• "Back" returns to upload modal with previously selected files preserved

Auto-save on close

• Empty untitled notebooks are automatically deleted on close
• Notebooks are kept if name was edited, documents were uploaded, uploads are in progress, or chat was started

Notebook message bar

• Matched chat's MessageBar design: border, border-radius, pill-shaped buttons
• Added stop button for ongoing responses (wired to useStopConversation)
• Added + button (PlusIcon) via additionalActions that directly opens upload modal
• Added button tooltips for microphone and send

Checklist

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

[rhdh-gh-app]

Changed Packages

Package Name	Package Path	Changeset Bump	Current Version
@red-hat-developer-hub/backstage-plugin-intelligent-assistant	workspaces/intelligent-assistant/plugins/intelligent-assistant	patch	v3.2.0

[codecov]

Codecov Report

❌ Patch coverage is 57.34266% with 61 lines in your changes missing coverage. Please review.
✅ Project coverage is 57.12%. Comparing base (a6c3450) to head (b9a5299).
⚠️ Report is 3 commits behind head on main.
✅ All tests successful. No failed tests found.

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #3849      +/-   ##
==========================================
- Coverage   57.12%   57.12%   -0.01%     
==========================================
  Files        2430     2431       +1     
  Lines       96713    96817     +104     
  Branches    26920    26962      +42     
==========================================
+ Hits        55252    55307      +55     
- Misses      41263    41309      +46     
- Partials      198      201       +3     

Flag	Coverage Δ		*Carryforward flag
adoption-insights	84.55% <ø> (ø)		Carriedforward from 4cd6dea
ai-integrations	69.16% <ø> (ø)		Carriedforward from 4cd6dea
app-defaults	69.79% <ø> (ø)		Carriedforward from 4cd6dea
augment	46.67% <ø> (ø)		Carriedforward from 4cd6dea
boost	76.77% <ø> (ø)		Carriedforward from 4cd6dea
bulk-import	72.79% <ø> (ø)		Carriedforward from 4cd6dea
cost-management	13.55% <ø> (ø)		Carriedforward from 4cd6dea
dcm	67.21% <ø> (ø)		Carriedforward from 4cd6dea
extensions	56.59% <ø> (ø)		Carriedforward from 4cd6dea
global-floating-action-button	71.18% <ø> (ø)		Carriedforward from 4cd6dea
global-header	66.50% <ø> (ø)		Carriedforward from 4cd6dea
homepage	47.50% <ø> (ø)		Carriedforward from 4cd6dea
install-dynamic-plugins	59.95% <ø> (ø)		Carriedforward from 4cd6dea
intelligent-assistant	74.86% <57.34%> (-0.39%)	⬇️
konflux	91.98% <ø> (ø)		Carriedforward from 4cd6dea
lightspeed	69.02% <ø> (ø)		Carriedforward from 4cd6dea
mcp-integrations	83.40% <ø> (ø)		Carriedforward from 4cd6dea
orchestrator	66.91% <ø> (ø)		Carriedforward from 4cd6dea
quickstart	63.74% <ø> (ø)		Carriedforward from 4cd6dea
sandbox	79.56% <ø> (ø)		Carriedforward from 4cd6dea
scorecard	86.17% <ø> (ø)		Carriedforward from 4cd6dea
theme	88.77% <ø> (ø)		Carriedforward from 4cd6dea
translations	5.12% <ø> (ø)		Carriedforward from 4cd6dea
x2a	55.02% <ø> (ø)		Carriedforward from 4cd6dea

*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 a6c3450...b9a5299. 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.

[github-actions]

This PR has been automatically marked as stale because it has not had recent activity from the author. It will be closed if no further activity occurs. If the PR was closed and you want it re-opened, let us know and we'll re-open the PR so that you can continue the contribution!

[its-mitesh-kumar]

/cc @ShiranHi @tobiastal @ShiranHi

[openshift-ci]

@its-mitesh-kumar: GitHub didn't allow me to request PR reviews from the following users: tobiastal.

Note that only redhat-developer members and repo collaborators can review this PR, and authors cannot review their own PRs.

Details

In response to this:

/cc @ShiranHi @tobiastal @ShiranHi

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes-sigs/prow repository.

[its-mitesh-kumar]

/fs-review

[fullsend-ai-review]

🤖 Finished Review · ✅ Success · Started 6:31 PM UTC · Completed 6:48 PM UTC
Commit: 4874497 · View workflow run →

[fullsend-ai-review]

Review

Findings

Medium

• [race-condition] workspaces/intelligent-assistant/plugins/intelligent-assistant/src/components/notebooks/NotebookView.tsx:481 — The handleCloseNotebook auto-delete logic checks documents.length === 0 to determine if the notebook is empty. After a document upload completes and polling clears pendingUploads and uploadingFileNames, there is a window before invalidateQueries refetches the documents prop. During this window, documents.length is still 0 even though the notebook has server-side documents. If the user clicks close during this window, the notebook is auto-deleted despite having documents. The .catch(() => {}) silently suppresses any server-side rejection.
  Remediation: Guard against this by additionally checking completedFileNames.size > 0 in the auto-delete condition, or await the documents query refetch before evaluating.

Low

• [edge-case] workspaces/intelligent-assistant/plugins/intelligent-assistant/src/components/notebooks/OverwriteConfirmModal.tsx — The notebook.overwrite.modal.description template uses {{duplicateCount}} files already exist which is grammatically incorrect when duplicateCount is 1 (renders "1 files already exist"). All translations (en, de, es, fr, it, ja) have the same issue. Similarly, {{newCount}} new resources will be added regardless is confusing when newCount is 0.
  Remediation: Add singular/plural variants similar to notebooks.documents.none/one/other.

• [state-management] workspaces/intelligent-assistant/plugins/intelligent-assistant/src/components/notebooks/OverwriteConfirmModal.tsx — The duplicateAction state is reset to 'replace' in handleConfirm and handleClose, but not on Back button click. If the user clicks Back, changes files, and re-triggers the overwrite modal, the previous radio selection persists instead of defaulting to 'replace'.
  Remediation: Reset duplicateAction in the Back handler, or add a useEffect that resets on isOpen transition to true.

• [component-library-consistency] workspaces/intelligent-assistant/plugins/intelligent-assistant/src/components/notebooks/OverwriteConfirmModal.tsx — This modal now uses a plain <div> wrapper with PatternFly Button and PF Alert, while all sibling modals (DeleteDocumentModal, DeleteNotebookModal, RenameNotebookModal, AddDocumentModal) use MUI DialogActions, MUI Button, and MUI Alert. This creates visual and structural inconsistency across the notebook modals.
  Remediation: Use MUI components consistently, or migrate all modals uniformly if the design direction has changed.

• [native-html-vs-component-library] workspaces/intelligent-assistant/plugins/intelligent-assistant/src/components/notebooks/OverwriteConfirmModal.tsx — Radio group uses raw <input type="radio"> elements. PatternFly provides Radio/FormGroup components with consistent theming and accessibility.

• [native-html-vs-component-library] workspaces/intelligent-assistant/plugins/intelligent-assistant/src/components/notebooks/NotebookView.tsx — The add-resource <button> in the message bar and the remove <button> in FileListItem.tsx use raw HTML elements with manual styling, while the codebase uses MUI IconButton or PF Button variant="plain" for icon buttons.

• [inline-iife-in-jsx] workspaces/intelligent-assistant/plugins/intelligent-assistant/src/components/notebooks/AddDocumentModal.tsx — Dropzone rendering uses an inline IIFE spanning ~40 lines. No other component in this directory uses this pattern; extract into a named helper function.

• [naming-coherence] workspaces/intelligent-assistant/.changeset/bright-tigers-dance.md — The changeset description does not mention the auto-delete behavior for empty untitled notebooks on close. This behavioral change should be documented for downstream consumers.

• [changeset-classification] workspaces/intelligent-assistant/.changeset/bright-tigers-dance.md — The changeset uses patch but the PR contains breaking prop signature changes (OverwriteConfirmModal.onConfirm from () => void to (filesToUpload: File[]) => void, AddDocumentModal.onDuplicatesFound gains a second parameter) and new behavioral features. Consider minor instead.

---

Next steps:

• /fs-fix — agent addresses review findings automatically
• /fs-fix <your instruction> — agent fixes with your specific guidance
• Push commits directly — review re-runs automatically on push
• /fs-fix-stop — disable automatic fix runs for this PR

[fullsend-ai-review]

See the review comment for full details.

[fullsend-ai-review]

[medium] race-condition

The handleCloseNotebook auto-delete logic checks documents.length === 0 to determine if the notebook is empty. After a document upload completes and polling clears pendingUploads and uploadingFileNames, there is a window before invalidateQueries refetches the documents prop. During this window, documents.length is still 0 even though the notebook has server-side documents. If the user clicks close during this window, the notebook is auto-deleted despite having documents. The .catch(() => {}) silently suppresses any server-side rejection.

Suggested fix: Guard against this by additionally checking completedFileNames.size > 0 in the auto-delete condition, or await the documents query refetch before evaluating.

[tobiastal]

Hey Mitesh, this looks great! I just have a couple of small UX comments:

1. The Notebooks card padding seems a bit smaller than expected. It should be 24px between the card content and all sides (top, bottom, left, and right).
   Current:

Expected:

2. In the Add resource modal, based on the PF Modal guidelines, the actions should be left-aligned, with Add as the primary (first) action and Cancel following it.
   Current:

Expected:

3. In the 'Add resources' modal, the alerts should use the PF alert component
   Current:

Expected:

4. In the ‘File already exists’ modal, the alert at the top looks great, but I think we can remove the extra spacing in the bottom part.
   Current:

Expected:

5. In the ‘File already exists’ modal, the yellow warning icons below should use a darker color to match the warning icon in the alert.
   Current:

Expected:

Thanks! Overall, it's looking really good. Happy to take another look once these are updated.
cc @its-mitesh-kumar @ShiranHi

[its-mitesh-kumar]

Addressed
1. Notebooks card padding

2. Action buttons on Upload resource Modal on left

3. In the 'Add resources' modal, now using PR alerts

4. In the ‘File already exists’ modal, extra spacing in the bottom part has been removed.

5. the yellow warning icons below should use a darker color to match the warning icon in the alert.

We are using using PF alert warning variant and verify the same color is on prototype as well as on our implementation.

S_.2026-08-07.at.8.56.51.PM.mov

6. Change
   Upload a resource to get started to Add a resource to get started
Upload a resource to Add a resource

7. Made radio button as pointer: cursor, text was already having pointer: cursor and clickable

S_.2026-08-07.at.9.23.58.PM.mov

8. MessageBar
9. The stop button seems to be too close to the edge of the text field => PF native component styles, let not override it.
10. The border-radius on the text field should be a bit more rounded : PF native component styles, let not override it.

Cc: @tobiastal @HusneShabbir @ShiranHi @debsmita1

[tobiastal]

LGTM

[debsmita1]

1. 1 Resources, instead of 1 Resource

2. Way too much padding on the left of the action buttons. Also, "Updated today" text should be in italics as per the prototype

3. Kebab menu on each notebook resources appear at all times, when it should appear only on hover as per the prototype

cc @tobiastal

[its-mitesh-kumar]

1. 1 Resources, instead of 1 Resource

@debsmita1 Its being handled as part of #4208 .

Also we are not handling all improvements as part of this PR. I am only improving the portion I have mentioned in the PR description , but thanks for finding these out, I will handle the improvements you have mentioned here in this PR itself.

[sonarqubecloud]

Quality Gate passed

Issues
5 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

[HusneShabbir]

@its-mitesh-kumar when a user creates a notebook and navigates to Chat to do something, the notebook is automatically considered empty and gets closed.

But based on our latest acceptance criteria:

Auto-save on close

• Empty untitled notebooks are automatically deleted on close.

Shouldn’t the notebook be automatically deleted

Screen.Recording.2026-08-10.at.6.59.43.PM.mov

cc: @ShiranHi

[its-mitesh-kumar]

@its-mitesh-kumar when a user creates a notebook and navigates to Chat to do something, the notebook is automatically considered empty and gets closed.

But based on our latest acceptance criteria:

Auto-save on close

• Empty untitled notebooks are automatically deleted on close.

Shouldn’t the notebook be automatically deleted

Screen.Recording.2026-08-10.at.6.59.43.PM.mov
cc: @ShiranHi

@HusneShabbir Good catch. I was just deleting when user click on Close notebook. Pushing the fix.