[WIP] ntp attach tabs#2726
Conversation
- Introduced `enableAttachTabs` configuration to allow users to attach open tabs as context in Duck.ai submissions. - Implemented `omnibar_getOpenTabs` and `omnibar_getTabContent` requests to fetch open tab metadata and extract content. - Updated omnibar UI to include options for attaching tab content, with appropriate labels and loading/error states. - Added unit tests for mention detection related to tab attachments. - Enhanced type definitions and JSON schemas for new functionalities. This feature enhances user interaction by enabling context-aware submissions, improving the overall chat experience.
…hods - Added `enableAttachTabs` configuration to support attaching open tabs in the omnibar. - Introduced `getOpenTabs` and `getTabContent` methods in the context for fetching tab metadata and content. - Created `TabChips` component to display attached tabs in the UI, enhancing user interaction with AI chat submissions. - Updated type definitions to accommodate new functionalities. This update improves the omnibar's capability to provide context-aware submissions, enriching the overall user experience.
…combobox functionality - Updated AiChatForm to support caret position tracking and enhanced combobox integration for better accessibility. - Modified Omnibar to include new props for tab attachment features, allowing users to attach open tabs in AI chat submissions. - Improved type definitions to reflect changes in props and functionality, ensuring better type safety and clarity. These updates improve user interaction and accessibility within the omnibar, enriching the overall chat experience.
…on support - Added a `header` prop to the Dropdown component for non-interactive headers. - Introduced a `trailingIcon` prop in DropdownItem for additional visual elements. - Updated styles for header and trailing icons to improve UI consistency. - Enhanced Dropdown functionality to support better user interaction and accessibility. These changes enrich the Dropdown component, providing a more flexible and visually appealing user experience.
- Introduced `useOpenTabs` hook to fetch and manage open tabs within the omnibar context. - Created `useTabAttachments` hook for handling tab attachment logic, including attaching, removing, and clearing tabs. - Enhanced existing `useAiChats` hook with `useCallback` for improved performance in chat visibility functions. These additions enhance the omnibar's functionality, allowing for better management of open tabs and their integration into the chat experience.
- Introduced the `AttachMenu` component to facilitate attaching images and tabs within the omnibar. - Implemented conditional rendering based on the availability of image and tab attachment features. - Created supporting components for image-only and tabs-only menus, enhancing user interaction. - Added styles for the new component to ensure a consistent UI experience. This addition improves the omnibar's functionality by allowing users to easily attach images and tabs, enriching the overall chat experience.
…unctionality - Removed the "Close tab picker" label from the omnibar strings as it is no longer needed. - Introduced a new `filterTabs` function in `tabFilter.js` to enable case-insensitive filtering of tabs based on title and URL, improving user experience when searching for tabs. These changes streamline the omnibar's functionality and enhance tab management capabilities.
|
This PR requires a manual review and approval from a member of one of the following teams:
|
- Added the `MentionPicker` component to facilitate tab mentions within the omnibar, enhancing user interaction by allowing users to select from open tabs. - Created associated styles in `MentionPicker.module.css` for a consistent UI experience. - Introduced `useMentionPicker` hook to manage the mention detection and selection logic, improving the overall functionality of the omnibar. - Added unit tests for the new tab filtering functionality to ensure reliability. These changes enrich the omnibar's capabilities, providing a more intuitive way for users to attach tabs in their conversations.
- Added support for attaching PDF files in the omnibar, allowing users to include files in their chat submissions. - Updated the omnibar configuration to include `supportedFileTypes` and `enableAttachFiles` options, enhancing flexibility for file handling. - Introduced a new JSON schema for `NativePromptFile` to define the structure of attached files, ensuring compatibility with existing systems. - Modified the omnibar submission notification to include a `files` field, reflecting the new attachment capabilities. These changes improve the omnibar's functionality by enabling users to attach files, enriching the overall chat experience.
…d configurations - Updated omnibar strings to reflect new labels for attaching images and PDFs, improving clarity for users. - Added support for attaching files (PDFs) in the omnibar configuration, including enabling/disabling file attachments per model. - Introduced a new JSON schema for `NativePromptFile` to define the structure of attached files, ensuring compatibility with existing systems. - Enhanced the omnibar mock transport to support file types, allowing for better testing and development of file attachment features. These changes enrich the omnibar's functionality by enabling users to attach files, thereby enhancing the overall chat experience.
… tab attachment functionality - Added a new tech design document outlining the implementation of PDF file attachments in the omnibar, allowing users to attach files alongside images. - Implemented `useFileAttachments` hook to manage file uploads, including validation against supported MIME types and handling file processing. - Enhanced the `AttachMenu` component to support both image and file attachments, providing a unified interface for users. - Updated the omnibar configuration to include `supportedFileTypes` for models, enabling dynamic file attachment capabilities based on model support. - Improved the mock transport and type definitions to accommodate new file attachment features, ensuring compatibility with existing systems. These changes significantly enhance the omnibar's functionality, enriching the user experience by allowing for versatile file and tab attachments in chat submissions.
Build Branch
Static preview entry points
QR codes (mobile preview)
Integration commandsnpm (Android / Extension): Swift Package Manager (Apple): .package(url: "https://github.com/duckduckgo/content-scope-scripts.git", branch: "pr-releases/alavrenchuk/ntp-attach-tabs")git submodule (Windows): git -C submodules/content-scope-scripts fetch origin pr-releases/alavrenchuk/ntp-attach-tabs
git -C submodules/content-scope-scripts checkout origin/pr-releases/alavrenchuk/ntp-attach-tabsPin to exact commitnpm (Android / Extension): Swift Package Manager (Apple): .package(url: "https://github.com/duckduckgo/content-scope-scripts.git", revision: "42f68f77bc0bca558401829063d13e1d3dcddedc")git submodule (Windows): git -C submodules/content-scope-scripts fetch origin pr-releases/alavrenchuk/ntp-attach-tabs
git -C submodules/content-scope-scripts checkout 42f68f77bc0bca558401829063d13e1d3dcddedc |
[Beta] Generated file diffTime updated: Thu, 28 May 2026 18:03:58 GMT Apple
File has changed Integration
File has changed Windows
File has changed |
There was a problem hiding this comment.
Web Compatibility Assessment
special-pages/pages/new-tab/app/omnibar/components/chat-tools/file-attachment/useFileAttachments.js:41-52,84-110— warning: file attachments are read wholesale withFileReader.readAsDataURL()and only capped by count. A few large PDFs can block the privileged NTP UI and produce oversizedomnibar_submitChatmessages, which is a native-message reliability regression surface.- No injected runtime API-surface/prototype findings: this diff does not touch
injected/src,wrapper-utils,captured-globals, DDGProxy, message bridge, or page-world API hooks.
Security Assessment
special-pages/pages/new-tab/app/omnibar/components/chat-tools/tab-attachment/useTabAttachments.js:50-52,79-82— error:pageContextcomes from native and is spread into state/submission payloads. That can echo reserved or unexpected fields, includingnativeData, into the outgoingomnibar_submitChatnotify path.special-pages/pages/new-tab/messages/omnibar_submitChat.notify.json:54-63andspecial-pages/pages/new-tab/messages/types/page-context.json:5-35— warning: the new attachment payloads lack schema hardening forpageContext/filescardinality andPageContextextra properties, so the TypeScript contract does not enforce the UI’s intended payload boundary.special-pages/pages/new-tab/app/omnibar/components/chat-tools/file-attachment/useFileAttachments.js:41-52,84-110— warning: local file bytes are base64 encoded without a byte-size cap before being sent to native. This is a privileged-page/native-transport DoS risk even though the file picker is user-driven.
Risk Level
High Risk — not injected page-world code, but this adds privileged NTP native requests/notify payloads that carry page content and local file bytes across all supported browser integrations.
Recommendations
- Whitelist
PageContextfields instead of spreading native-returned objects, and addadditionalProperties: falseto thePageContextschema. - Add explicit limits:
MAX_ATTACHED_TABS, file byte-size caps beforeFileReader, schemamaxItems, and stringmaxLengthfor base64/content-bearing fields. - Add unit tests for stripping unexpected
pageContextfields and rejecting oversized files before read/submission.
Validation run: npm run test-unit --workspace=special-pages -- --run pages/new-tab/app/omnibar/unit-tests/tabPicker.spec.js and targeted npx eslint on the changed omnibar JS files both passed.
Sent by Cursor Automation: Web compat and sec
|
|
||
| return prev.map((tab) => | ||
| tab.tabId === tabToAttach.tabId | ||
| ? { ...tab, status: /** @type {const} */ ('ready'), pageContext: { ...pageContext, tabId: tabToAttach.tabId } } |
There was a problem hiding this comment.
pageContext is native-returned data, so spreading it here (and again in getTabsForSubmission) can echo reserved or unexpected fields into the outgoing omnibar_submitChat notify payload. In particular, this violates the nativeData trust-boundary rule if native ever includes that field in the response. Please construct a whitelisted PageContext object instead, e.g. copy only title, url, favicon, content, truncated, fullContentLength, and the local tabId.
| reject(new Error('Failed to read file')); | ||
| }; | ||
|
|
||
| reader.readAsDataURL(file); |
There was a problem hiding this comment.
This reads the full selected file into memory and later sends the full base64 string through native messaging, but there is no byte-size cap. MAX_FILES limits count only; three large PDFs can still hang the NTP page or exceed native/WebView message limits. Please reject files over an explicit max size before readAsDataURL() and mirror that limit in the message schema/tests.


Asana Task/Github Issue:
Description
Testing Steps
Checklist
Please tick all that apply: