2068261 - [Monitor Agent] [FE] Open monitor alert URLs into new tab group

Status: NEW

(Core :: Machine Learning: Frontend, enhancement, P1)

Description

[Nick]

Summary

Clicking a task in the Smart Window Tasks panel should open its watched URLs in a tab group named after the task

Description

Rows in the Tasks panel (agent-monitor-panel) are inert today — they render
the status chip, title, schedule and match result, but there is nothing to
click. A monitor can watch up to 5 URLs (TOTAL_NUM_URLS_IN_MONITOR), and once
it reports a match the user has no way to get to the pages it matched on
without finding them again by hand.

Make the row activatable. Clicking a task should:

1. Open every URL the monitor watches (watchUrls) in the current window.
2. Put those tabs in a new tab group labelled with the monitor's title.
3. Close the panel and select the group's first tab.

See the attached mock. Note the mock is wrong in one detail: the group label
shows "Rolex listings on r/Watchexchange", but it should be the title of the
task that was clicked — for the row shown selected that would be "Le Gran
(Alsta) Day-Date price".

This makes a task's result separable from the rest of the session: the user
gets the matched pages together, labelled, and can collapse or close them as
one unit.

Comment 1

[Nick]

Technical details

The data is already in place — no plumbing needed. MonitorUIUtils
.formatMonitorForDisplay() already puts watchUrls on the object the panel
receives (ui/modules/MonitorUIUtils.sys.mjs:153), capped at 5 by
TOTAL_NUM_URLS_IN_MONITOR (models/agents/Monitor.sys.mjs:39).

ui/components/agent-monitor-panel/agent-monitor-panel.mjs

• In #renderList(), .monitor-row is a div with role="listitem". Make
  the row itself a <button type="button"> carrying role="listitem", or wrap
  the content in a button — whichever keeps the list semantics intact. It
  must not become a div with a click handler.
• Dispatch a new bubbling event on activation:
  agent-monitor-panel:open-task detail: { id }
  The component stays host-agnostic (data in via properties, actions out as
  events); it should not touch gBrowser itself.
• Skip/disable activation when monitor.watchUrls is empty.

ui/components/agent-monitor-panel/agent-monitor-panel.css

• .monitor-row needs hover, :active and :focus-visible affordances now that
  it is interactive, and the button reset the footer rows already use
  (border: none; background: transparent; font: inherit; text-align: start).
  The [data-just-created] arrive animation must keep working.

ui/modules/MonitorPanel.sys.mjs

• Add the agent-monitor-panel:open-task listener alongside the existing
  create-task / manage-tasks handlers in _createPanel().
• Look the monitor up by id (MonitorAgent), open its watchUrls as tabs,
  then group them:
  const group = win.gBrowser.addTabGroup(tabs, {
  label: monitor.title,
  metricsContext: { source: <new source, see below> },
  });
  addTabGroup throws on an empty tab array, so guard first.
  Consider createLazyBrowser: true for all but the first tab so clicking a
  5-URL task doesn't kick off five page loads at once.
• Close the panel afterwards (panel.hidePopup()), same as manage-tasks.

TabMetrics.sys.mjs

• METRIC_SOURCE has SMART_WINDOW_GROUP_SUGGESTIONS ("smartwindow_group_
  suggestions") but nothing for the Tasks panel. Add one, e.g.
  SMART_WINDOW_TASKS: "smartwindow_tasks", and update the tab.action /
  tab.tab_count labels in metrics.yaml as that file's comment requires.

Decisions needed before implementation:

• Repeat clicks. Clicking the same task twice shouldn't create a second
  identical group. Options: persist the created group's id on the monitor and
  reuse it via gBrowser.getTabGroupById(), or match on label. Reusing by id
  is more robust but means a schema addition to the saved monitor.
• Group colour. The mock shows purple. addTabGroup auto-assigns
  tabGroupMenu.nextUnusedColor when color is omitted, which will vary.
  Confirm with design whether purple is deliberate (Smart Window branding) or
  just how the mock rendered.
• Long titles. Monitor titles are user-supplied and can be long; the tab
  group label will need whatever truncation tab groups already do.
• Whether the tabs should open in the current window or the Smart Window
  specifically.

Testing: browser/components/aiwindow/ui/test/browser/
browser_aiwindow_monitor_button.js — assert clicking a row creates a group
labelled with the monitor title containing one tab per watchUrl, that the panel
closes, that a task with no URLs is a no-op, and that the row is reachable and
activatable by keyboard.