feat(run,notifications,profiles): stop sending prompts nobody typed, and fix notification + profile delivery
Run console:
- Picking a pipeline no longer pre-writes anything into the prompt box
(`promptPrefill` in `LaneConsolePane.tsx` is gone — it wrote the driving
slash command on a claude lane and a stage checklist on a codex one).
Whatever sits in that box is sent as a real prompt the moment the run
starts, so the box is the user's alone now.
- Resuming a session sends NO prompt at all (`handleStart` in `RunSetup.tsx`):
the resumed session carries its own transcript, and leftover text in the box
fired an extra turn into it.
Notifications:
- `client/src/lib/notify.ts` is now the ONE sender, used by both
`useNotifications` and Settings' test button, and it reports where the
notification landed: `POST /api/push/send` answering `{native:false,pushed:0}`
means it went NOWHERE, so the client falls back to a local notification
instead of counting the 200 as delivered.
- A notification carries the lane that raised it (`/workspace?lane=<id>`), and
Workspace selects that lane on arrival.
Profiles:
- `server/lib/cc-profiles.js` reads and writes the macOS login Keychain item
`Claude Code-credentials`, where the `claude` CLI actually keeps
`claudeAiOauth` on darwin — a switch used to rewrite a file nothing reads.
The file stays the fallback, is kept in step only when it already exists, and
`AGENTHUB_CC_KEYCHAIN=0` pins it (tests set it).
Tests: npm run test:server (1820 pass), client vitest (553 pass).
This commit is contained in:
@@ -129,7 +129,6 @@ export function LaneConsolePane({
|
||||
useEffect(() => {
|
||||
const { activeRuns: runs } = latest.current;
|
||||
setPrompt("");
|
||||
lastPrefill.current = "";
|
||||
setResumeSession(null);
|
||||
setError(null);
|
||||
setBusy(null);
|
||||
@@ -138,34 +137,10 @@ export function LaneConsolePane({
|
||||
refreshList();
|
||||
}, [laneId, refreshList]);
|
||||
|
||||
// Pre-fill the prompt with the slash command the lane's pipeline template
|
||||
// names as its driver, so picking the 16-node pipeline starts the 16-step
|
||||
// skill and the 8-node one the 8-step skill. Only overwrites a prompt the
|
||||
// user hasn't touched (still exactly the previous prefill), so switching
|
||||
// templates never eats a typed requirement. Must be declared AFTER the
|
||||
// lane-switch effect: on a lane change that one clears both first.
|
||||
const lastPrefill = useRef("");
|
||||
// Claude gets a slash command it can execute (`pipeline_skill`), which itself
|
||||
// declares stage at every step. Codex has no slash commands — the same
|
||||
// string would read as literal prose — so it gets the equivalent priming a
|
||||
// different way: a plain-text checklist of this lane's own pipeline node ids,
|
||||
// read directly off `pipeline_nodes` so it always matches the template in
|
||||
// use. Without SOME opening nudge a codex lane's declared stage depends
|
||||
// entirely on AGENTS.md being read on its own, which is easy to miss.
|
||||
const promptPrefill =
|
||||
laneTool === "codex"
|
||||
? currentLane?.pipeline_nodes?.length
|
||||
? `Declare progress as you go: run \`agenthub stage <stage> --tool codex --evidence "..."\` immediately at each real transition through this pipeline — ${currentLane.pipeline_nodes.map((n) => n.id).join(" -> ")}. Then, your task:\n\n`
|
||||
: ""
|
||||
: currentLane?.pipeline_skill || "";
|
||||
useEffect(() => {
|
||||
const next = promptPrefill && laneTool === "claude" ? `${promptPrefill} ` : promptPrefill;
|
||||
setPrompt((p) => (p === lastPrefill.current ? next : p));
|
||||
lastPrefill.current = next;
|
||||
// `laneId` is a dep too: switching between two lanes on the SAME template
|
||||
// leaves `promptPrefill` unchanged, and the switch effect just cleared the
|
||||
// prompt — without it the new lane would open with an empty box.
|
||||
}, [promptPrefill, laneTool, laneId]);
|
||||
// Picking a pipeline template writes NOTHING into the prompt box: a prefilled
|
||||
// slash command (or the codex stage-checklist prose) is sent as soon as the
|
||||
// run starts, which is an extra prompt nobody asked for. The prompt is the
|
||||
// user's to type; the pipeline is declared by `agenthub stage` instead.
|
||||
|
||||
// The switch effect above only sees whatever `activeRuns` the page already
|
||||
// had loaded at that instant. Remounting this page (navigating away and
|
||||
|
||||
@@ -360,7 +360,10 @@ function handleStart(props: RunSetupProps, session?: Session) {
|
||||
effort: props.effort || undefined,
|
||||
resumeSessionId: codex ? undefined : resume?.id || undefined,
|
||||
resumeLast: codex && !resume ? true : undefined,
|
||||
initialPrompt: props.prompt || undefined,
|
||||
// A resume continues a session that already has its own history — sending
|
||||
// whatever is sitting in the prompt box would fire an extra turn nobody
|
||||
// asked for, so a resume carries no prompt at all.
|
||||
initialPrompt: resume ? undefined : props.prompt || undefined,
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@@ -195,40 +195,11 @@ describe("LaneConsolePane", () => {
|
||||
expect(screen.queryByTestId("pane-empty")).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
it("pre-fills the prompt with the pipeline's driving skill, and keeps a typed prompt when the template changes", async () => {
|
||||
const lane = { ...LANE, pipeline_skill: "/agenthub:ship-feature" };
|
||||
const props = { ...baseProps(), lanes: [lane] };
|
||||
const { rerender } = render(<LaneConsolePane {...props} />);
|
||||
const prompt = screen.getByPlaceholderText(/ask claude/i) as HTMLTextAreaElement;
|
||||
await waitFor(() => expect(prompt.value).toBe("/agenthub:ship-feature "));
|
||||
|
||||
// Untouched prefill follows the template switch.
|
||||
const laneShip = { ...lane, pipeline_skill: "/agenthub:ship-feature-lane" };
|
||||
rerender(<LaneConsolePane {...props} lanes={[laneShip]} />);
|
||||
await waitFor(() => expect(prompt.value).toBe("/agenthub:ship-feature-lane "));
|
||||
|
||||
// A typed requirement is never eaten by a later template switch.
|
||||
fireEvent.change(prompt, { target: { value: "/agenthub:ship-feature-lane add a button" } });
|
||||
rerender(<LaneConsolePane {...props} lanes={[lane]} />);
|
||||
await waitFor(() => expect(prompt.value).toBe("/agenthub:ship-feature-lane add a button"));
|
||||
});
|
||||
|
||||
it("never pre-fills a claude slash command into a codex pane", async () => {
|
||||
// pipeline_skill is a Claude Code slash command. Codex would take it as
|
||||
// literal prose and run nothing, which is how a codex lane sits for half an
|
||||
// hour with an untouched pipeline map. No pipeline_nodes here either, so
|
||||
// there's nothing to build a stage checklist from — the box stays empty.
|
||||
const lane = { ...LANE, tool: "codex" as const, pipeline_skill: "/agenthub:ship-feature-lane" };
|
||||
render(<LaneConsolePane {...baseProps()} lanes={[lane]} />);
|
||||
const prompt = screen.getByPlaceholderText(/ask claude/i) as HTMLTextAreaElement;
|
||||
await waitFor(() => expect(prompt.value).toBe(""));
|
||||
});
|
||||
|
||||
it("pre-fills a codex pane with a stage-declaration checklist built from its own pipeline nodes", async () => {
|
||||
// Codex has no slash commands, so it can't run pipeline_skill as-is — it
|
||||
// gets the same priming Claude gets (an opening nudge to declare stage)
|
||||
// as plain text instead, naming this lane's actual node ids.
|
||||
const lane = {
|
||||
it("never pre-fills the prompt from the lane's pipeline, for either tool", async () => {
|
||||
// Picking a pipeline used to write its driving slash command (claude) or a
|
||||
// stage checklist (codex) into the box — an extra prompt sent on start.
|
||||
const claudeLane = { ...LANE, pipeline_skill: "/agenthub:ship-feature" };
|
||||
const codexLane = {
|
||||
...LANE,
|
||||
tool: "codex" as const,
|
||||
pipeline_skill: "/agenthub:ship-feature-lane",
|
||||
@@ -243,11 +214,23 @@ describe("LaneConsolePane", () => {
|
||||
{ id: "tests", label: "Tests", icon: "check", gate: false, state: "pending" as const },
|
||||
],
|
||||
};
|
||||
render(<LaneConsolePane {...baseProps()} lanes={[lane]} />);
|
||||
const props = { ...baseProps(), lanes: [claudeLane] };
|
||||
const { rerender } = render(<LaneConsolePane {...props} />);
|
||||
const prompt = screen.getByPlaceholderText(/ask claude/i) as HTMLTextAreaElement;
|
||||
await waitFor(() => expect(prompt.value).toContain("agenthub stage <stage> --tool codex"));
|
||||
expect(prompt.value).toContain("implement -> tests");
|
||||
expect(prompt.value).not.toContain("/agenthub:ship-feature-lane");
|
||||
await waitFor(() => expect(prompt.value).toBe(""));
|
||||
|
||||
// A typed requirement still survives a template switch.
|
||||
fireEvent.change(prompt, { target: { value: "add a button" } });
|
||||
rerender(
|
||||
<LaneConsolePane
|
||||
{...props}
|
||||
lanes={[{ ...claudeLane, pipeline_skill: "/agenthub:ship-feature-lane" }]}
|
||||
/>
|
||||
);
|
||||
await waitFor(() => expect(prompt.value).toBe("add a button"));
|
||||
|
||||
rerender(<LaneConsolePane {...props} lanes={[codexLane]} />);
|
||||
await waitFor(() => expect(prompt.value).toBe("add a button"));
|
||||
});
|
||||
|
||||
it("renders an empty placeholder with selector when laneId is null but showLaneSelector is true (split-view)", () => {
|
||||
|
||||
@@ -234,6 +234,27 @@ describe("RunSetup — resume picker scopes sessions to the selected lane", () =
|
||||
);
|
||||
});
|
||||
|
||||
it("sends no prompt when resuming, even with text in the box", async () => {
|
||||
const { api } = await import("../../../lib/api");
|
||||
vi.mocked(api.sessions.list).mockResolvedValue({
|
||||
sessions: [
|
||||
{ id: "sess-in-lane", cwd: "/Users/tester/lane-a", started_at: "", status: "completed" },
|
||||
],
|
||||
total: 1,
|
||||
limit: 100,
|
||||
offset: 0,
|
||||
} as never);
|
||||
|
||||
const { spies } = renderSetup({ laneCwd: "/Users/tester/lane-a", prompt: "leftover text" });
|
||||
fireEvent.click(screen.getByText(i18n.t("run:resume.resumeOption")));
|
||||
fireEvent.click(screen.getByText(i18n.t("run:resume.pickSession")));
|
||||
fireEvent.click(await screen.findByText("/Users/tester/lane-a"));
|
||||
|
||||
// The resumed session is the input; anything left in the box would be an
|
||||
// extra turn the user never asked for.
|
||||
expect(spies.onStart.mock.calls[0]?.[0]?.initialPrompt).toBeUndefined();
|
||||
});
|
||||
|
||||
it("falls back to the typed cwd when no lane is selected", async () => {
|
||||
const { api } = await import("../../../lib/api");
|
||||
renderSetup({ laneCwd: undefined, cwd: "/Users/tester" });
|
||||
|
||||
@@ -36,7 +36,9 @@ describe("useNotifications", () => {
|
||||
localStorage.clear();
|
||||
// notify() posts to /api/push/send first and only falls back to a local
|
||||
// Notification when that throws, so the fetch spy is what we assert on.
|
||||
fetchMock = vi.fn().mockResolvedValue({ ok: true });
|
||||
fetchMock = vi
|
||||
.fn()
|
||||
.mockResolvedValue({ ok: true, json: async () => ({ ok: true, native: true, pushed: 1 }) });
|
||||
vi.stubGlobal("fetch", fetchMock);
|
||||
vi.stubGlobal(
|
||||
"Notification",
|
||||
@@ -76,6 +78,32 @@ describe("useNotifications", () => {
|
||||
expect(sentTitles()[0]).toBe("Claude Finished Responding");
|
||||
});
|
||||
|
||||
it("shows a local notification when the push landed nowhere", async () => {
|
||||
// What a browser with no push subscription gets back: HTTP 200, zero
|
||||
// deliveries. Before this, the 200 alone counted as success and the user
|
||||
// saw nothing at all.
|
||||
fetchMock.mockResolvedValue({
|
||||
ok: true,
|
||||
json: async () => ({ ok: true, native: false, pushed: 0, failed: 0 }),
|
||||
});
|
||||
enable();
|
||||
renderHook(() => useNotifications());
|
||||
|
||||
emit("Stop", "Done");
|
||||
await vi.waitFor(() => expect(Notification).toHaveBeenCalledTimes(1));
|
||||
expect(vi.mocked(Notification).mock.calls[0]?.[0]).toBe("Claude Finished Responding");
|
||||
});
|
||||
|
||||
it("does not double up when the push was delivered", async () => {
|
||||
enable();
|
||||
renderHook(() => useNotifications());
|
||||
|
||||
emit("Stop", "Done");
|
||||
await vi.waitFor(() => expect(sentTitles()).toHaveLength(1));
|
||||
await new Promise((r) => setTimeout(r, 20));
|
||||
expect(Notification).not.toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it("stays silent while notifications are disabled", async () => {
|
||||
renderHook(() => useNotifications());
|
||||
|
||||
|
||||
@@ -24,6 +24,7 @@
|
||||
* - `../i18n`
|
||||
* - `../lib/eventBus`
|
||||
* - `../lib/push`
|
||||
* - `../lib/notify`
|
||||
* - `../lib/types`
|
||||
*
|
||||
* ## Public surface
|
||||
@@ -48,43 +49,14 @@
|
||||
*
|
||||
* ----------------------------------------------------------------------------- */
|
||||
|
||||
import { useEffect } from "react";
|
||||
import { useEffect, useRef } from "react";
|
||||
import i18n from "../i18n";
|
||||
import { api } from "../lib/api";
|
||||
import { eventBus } from "../lib/eventBus";
|
||||
import { subscribeToPush } from "../lib/push";
|
||||
import { notify } from "../lib/notify";
|
||||
import { loadNotifPrefs } from "../lib/notifPrefs";
|
||||
import type { WSMessage, Session, Agent, DashboardEvent } from "../lib/types";
|
||||
|
||||
/**
|
||||
* Shows a browser notification, preferring a server-relayed push (so it can
|
||||
* arrive even if this tab isn't the active one, or the browser is backgrounded)
|
||||
* and falling back to a local service-worker/`Notification` call if the
|
||||
* server is unreachable. No-ops when the user hasn't granted permission.
|
||||
* @param title Notification title.
|
||||
* @param body Notification body text.
|
||||
*/
|
||||
async function notify(title: string, body: string) {
|
||||
if (!("Notification" in window) || Notification.permission !== "granted") return;
|
||||
try {
|
||||
await fetch("/api/push/send", {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({ title, body }),
|
||||
});
|
||||
} catch {
|
||||
// Server unreachable - fall back to local notification
|
||||
try {
|
||||
if ("serviceWorker" in navigator) {
|
||||
const registration = await navigator.serviceWorker.ready;
|
||||
await registration.showNotification(title, { body, icon: "/favicon.ico", silent: false });
|
||||
} else {
|
||||
new Notification(title, { body, icon: "/favicon.ico" });
|
||||
}
|
||||
} catch {
|
||||
// Silently ignore
|
||||
}
|
||||
}
|
||||
}
|
||||
import type { WSMessage, Session, Agent, DashboardEvent, Lane } from "../lib/types";
|
||||
|
||||
/**
|
||||
* Wires the dashboard's {@link eventBus} up to browser notifications, per the
|
||||
@@ -96,13 +68,40 @@ async function notify(title: string, body: string) {
|
||||
* already been granted, so push delivery survives a page reload.
|
||||
*/
|
||||
export function useNotifications() {
|
||||
// A lane's `session_id` is its current/last-run session — matching on it
|
||||
// is how a click lands on the lane that actually raised the notification,
|
||||
// instead of just focusing whichever browser tab was already open.
|
||||
const lanesRef = useRef<Lane[]>([]);
|
||||
|
||||
useEffect(() => {
|
||||
const prefs = loadNotifPrefs();
|
||||
if (prefs.enabled && "Notification" in window && Notification.permission === "granted") {
|
||||
subscribeToPush().catch(() => {});
|
||||
}
|
||||
|
||||
api.lanes
|
||||
.list()
|
||||
.then((r) => (lanesRef.current = r.lanes))
|
||||
.catch(() => {});
|
||||
|
||||
function laneUrlForSession(sessionId: string): string | undefined {
|
||||
const lane = lanesRef.current.find((l) => l.session_id === sessionId);
|
||||
return lane ? `/workspace?lane=${lane.id}` : undefined;
|
||||
}
|
||||
|
||||
return eventBus.subscribe((msg: WSMessage) => {
|
||||
if (msg.type === "lane_update") {
|
||||
const payload = msg.data as { lane?: Lane; removed?: number };
|
||||
if (payload.lane) {
|
||||
const i = lanesRef.current.findIndex((l) => l.id === payload.lane!.id);
|
||||
if (i === -1) lanesRef.current = [...lanesRef.current, payload.lane];
|
||||
else lanesRef.current = lanesRef.current.map((l, idx) => (idx === i ? payload.lane! : l));
|
||||
} else if (payload.removed !== undefined) {
|
||||
lanesRef.current = lanesRef.current.filter((l) => l.id !== payload.removed);
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
const prefs = loadNotifPrefs();
|
||||
if (!prefs.enabled) return;
|
||||
|
||||
@@ -112,7 +111,8 @@ export function useNotifications() {
|
||||
const s = msg.data as Session;
|
||||
notify(
|
||||
i18n.t("errors:notifications.newSession"),
|
||||
s.name || `${i18n.t("errors:notifications.sessionDefault")}${s.id.slice(0, 8)}`
|
||||
s.name || `${i18n.t("errors:notifications.sessionDefault")}${s.id.slice(0, 8)}`,
|
||||
laneUrlForSession(s.id)
|
||||
);
|
||||
break;
|
||||
}
|
||||
@@ -121,7 +121,8 @@ export function useNotifications() {
|
||||
if (s.status === "error" && prefs.onSessionError) {
|
||||
notify(
|
||||
i18n.t("errors:notifications.sessionError"),
|
||||
s.name || `${i18n.t("errors:notifications.sessionDefault")}${s.id.slice(0, 8)}`
|
||||
s.name || `${i18n.t("errors:notifications.sessionDefault")}${s.id.slice(0, 8)}`,
|
||||
laneUrlForSession(s.id)
|
||||
);
|
||||
}
|
||||
break;
|
||||
@@ -130,12 +131,17 @@ export function useNotifications() {
|
||||
if (!prefs.onSubagentSpawn) return;
|
||||
const a = msg.data as Agent;
|
||||
if (a.type === "subagent") {
|
||||
notify(i18n.t("errors:notifications.subagentSpawned"), a.name);
|
||||
notify(
|
||||
i18n.t("errors:notifications.subagentSpawned"),
|
||||
a.name,
|
||||
laneUrlForSession(a.session_id)
|
||||
);
|
||||
}
|
||||
break;
|
||||
}
|
||||
case "new_event": {
|
||||
const ev = msg.data as DashboardEvent;
|
||||
const url = laneUrlForSession(ev.session_id);
|
||||
// The two states where Claude is BLOCKED on the user get their own
|
||||
// flags (issue #29): `Notification` is a permission prompt or a
|
||||
// question, `Stop` is the end of a turn. Both used to hang off
|
||||
@@ -144,17 +150,20 @@ export function useNotifications() {
|
||||
if (ev.event_type === "Notification" && prefs.onAwaitingInput) {
|
||||
notify(
|
||||
i18n.t("errors:notifications.awaitingInput"),
|
||||
ev.summary || i18n.t("errors:notifications.defaultBody")
|
||||
ev.summary || i18n.t("errors:notifications.defaultBody"),
|
||||
url
|
||||
);
|
||||
} else if (ev.event_type === "Stop" && prefs.onTurnComplete) {
|
||||
notify(
|
||||
i18n.t("errors:notifications.finishedResponding"),
|
||||
ev.summary || i18n.t("errors:notifications.readyForInput")
|
||||
ev.summary || i18n.t("errors:notifications.readyForInput"),
|
||||
url
|
||||
);
|
||||
} else if (ev.event_type === "SessionEnd" && prefs.onSessionComplete) {
|
||||
notify(
|
||||
i18n.t("errors:notifications.sessionCompleted"),
|
||||
ev.summary || i18n.t("errors:notifications.sessionClosed")
|
||||
ev.summary || i18n.t("errors:notifications.sessionClosed"),
|
||||
url
|
||||
);
|
||||
}
|
||||
break;
|
||||
|
||||
@@ -49,7 +49,7 @@
|
||||
"addLaneToolClaude": "Claude Code",
|
||||
"addLaneToolCodex": "Codex",
|
||||
"addLaneToolHint": "Which CLI drives this lane. Cannot be changed later.",
|
||||
"addLaneWriteDocsHint": "Opens the lane's terminal on creation and runs the /sg-all:sg-md-writing skill there.",
|
||||
"addLaneWriteDocsHint": "On creation, opens the lane's terminal and runs /sg-all:sg-md-writing there: creates CLAUDE.md/AGENTS.md if missing, or updates them concisely if they already exist.",
|
||||
"addLaneWriteDocsLabel": "Create/update readme file",
|
||||
"autoStage": "auto: {{stage}}",
|
||||
"browse.button": "Browse",
|
||||
|
||||
@@ -84,7 +84,11 @@
|
||||
"sessionComplete": "Session completes",
|
||||
"sessionError": "Session errors",
|
||||
"subagentSpawned": "Subagent spawned",
|
||||
"testBlocked": "The browser has not granted notification permission.",
|
||||
"testBody": "Notifications are working!",
|
||||
"testFailed": "Nothing could be shown.",
|
||||
"testLocal": "Your browser has no push subscription, so this was shown locally. Web Push needs a secure origin (localhost or HTTPS) and a registered service worker.",
|
||||
"testSent": "Sent via push — check your notification centre.",
|
||||
"testTitle": "Agent Monitor",
|
||||
"title": "Notifications",
|
||||
"turnComplete": "Claude finishes a turn"
|
||||
|
||||
@@ -49,7 +49,7 @@
|
||||
"addLaneToolClaude": "Claude Code",
|
||||
"addLaneToolCodex": "Codex",
|
||||
"addLaneToolHint": "CLI nào điều khiển lane này. Không thể thay đổi sau này.",
|
||||
"addLaneWriteDocsHint": "Khi tạo lane sẽ mở terminal của lane và chạy skill /sg-all:sg-md-writing tại đó.",
|
||||
"addLaneWriteDocsHint": "Khi tạo lane sẽ mở terminal và chạy skill /sg-all:sg-md-writing: tạo CLAUDE.md/AGENTS.md nếu chưa có, hoặc cập nhật ngắn gọn nếu đã có.",
|
||||
"addLaneWriteDocsLabel": "Tạo/cập nhật file readme",
|
||||
"autoStage": "tự động: {{stage}}",
|
||||
"browse.button": "Duyệt",
|
||||
|
||||
@@ -84,7 +84,11 @@
|
||||
"sessionComplete": "Phiên hoàn tất",
|
||||
"sessionError": "Phiên gặp lỗi",
|
||||
"subagentSpawned": "Subagent được tạo",
|
||||
"testBlocked": "Trình duyệt chưa cấp quyền thông báo.",
|
||||
"testBody": "Thông báo đang hoạt động!",
|
||||
"testFailed": "Không hiển thị được thông báo nào.",
|
||||
"testLocal": "Trình duyệt chưa đăng ký push nên thông báo được hiện tại chỗ. Web Push cần origin bảo mật (localhost hoặc HTTPS) và service worker đã đăng ký.",
|
||||
"testSent": "Đã gửi qua push — kiểm tra trung tâm thông báo.",
|
||||
"testTitle": "Agent Monitor",
|
||||
"title": "Thông báo",
|
||||
"turnComplete": "Claude trả lời xong"
|
||||
|
||||
@@ -28,7 +28,7 @@ export interface NotifPrefs {
|
||||
// needs to know when they are the blocker). The rest stay as they were.
|
||||
export const defaultNotifPrefs: NotifPrefs = {
|
||||
enabled: false,
|
||||
onNewSession: true,
|
||||
onNewSession: false,
|
||||
onSessionError: true,
|
||||
onAwaitingInput: true,
|
||||
onTurnComplete: true,
|
||||
|
||||
@@ -0,0 +1,85 @@
|
||||
/**
|
||||
* @file Shows a browser notification — the single `notify()` both
|
||||
* `useNotifications` (live events) and Settings' "Send Test Notification"
|
||||
* button call, so the test proves the real delivery path and can report
|
||||
* where it actually landed instead of a bare fire-and-forget.
|
||||
* @author Nguyễn Ngọc Trí Vĩ <vinnt@smartgift.vn>
|
||||
*/
|
||||
|
||||
export type NotifyVia = "native" | "push" | "local" | "blocked" | "none";
|
||||
|
||||
export interface NotifyError {
|
||||
statusCode?: number;
|
||||
message?: string;
|
||||
}
|
||||
|
||||
export interface NotifyResult {
|
||||
via: NotifyVia;
|
||||
errors: NotifyError[];
|
||||
}
|
||||
|
||||
/**
|
||||
* Prefers a server-relayed push (so it can arrive even if this tab isn't the
|
||||
* active one, or the browser is backgrounded) and falls back to a local
|
||||
* service-worker/`Notification` call when the server didn't deliver.
|
||||
* @param title Notification title.
|
||||
* @param body Notification body text.
|
||||
* @param url Same-origin path to focus/navigate to on click (e.g. the lane
|
||||
* that raised this notification). Omit for notifications with no target.
|
||||
*/
|
||||
export async function notify(title: string, body: string, url?: string): Promise<NotifyResult> {
|
||||
if (!("Notification" in window) || Notification.permission !== "granted") {
|
||||
return { via: "blocked", errors: [] };
|
||||
}
|
||||
|
||||
const errors: NotifyError[] = [];
|
||||
|
||||
// A 200 from /api/push/send means the request was ACCEPTED, not that anything
|
||||
// reached the user: with no push subscription (no service worker, a
|
||||
// non-secure origin, a browser that never subscribed) or a push service the
|
||||
// server cannot reach, it answers `{ok:true, native:false, pushed:0}` and
|
||||
// nobody is notified. Only `native` or `pushed > 0` is actual delivery —
|
||||
// anything else falls through to the local notification below, which is why
|
||||
// the fallback is keyed on the RESULT rather than on fetch throwing.
|
||||
try {
|
||||
const res = await fetch("/api/push/send", {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({ title, body, url }),
|
||||
});
|
||||
const result = res.ok ? await res.json().catch(() => null) : null;
|
||||
if (result?.native) return { via: "native", errors };
|
||||
if (result && result.pushed > 0) return { via: "push", errors };
|
||||
if (!res.ok) errors.push({ statusCode: res.status });
|
||||
} catch (e) {
|
||||
errors.push({ message: e instanceof Error ? e.message : String(e) });
|
||||
}
|
||||
|
||||
try {
|
||||
// Vector, not `/favicon.ico` (32x32 raster) — crisp at whatever size the
|
||||
// OS renders it, matching the icon server/lib/push.js already sends.
|
||||
const data = url ? { url } : undefined;
|
||||
if ("serviceWorker" in navigator) {
|
||||
const registration = await navigator.serviceWorker.ready;
|
||||
await registration.showNotification(title, {
|
||||
body,
|
||||
icon: "/favicon.svg",
|
||||
silent: false,
|
||||
data,
|
||||
});
|
||||
} else {
|
||||
const n = new Notification(title, { body, icon: "/favicon.svg", data });
|
||||
if (url) {
|
||||
// No service worker to catch the click here — navigate this tab directly.
|
||||
n.onclick = () => {
|
||||
window.focus();
|
||||
window.location.assign(url);
|
||||
};
|
||||
}
|
||||
}
|
||||
return { via: "local", errors };
|
||||
} catch (e) {
|
||||
errors.push({ message: e instanceof Error ? e.message : String(e) });
|
||||
return { via: "none", errors };
|
||||
}
|
||||
}
|
||||
@@ -112,6 +112,7 @@ import { sagiPrefs } from "../components/Sagi/prefs";
|
||||
import { fmt, fmtCost, getCurrentLocale } from "../lib/format";
|
||||
import { subscribeToPush, unsubscribeFromPush } from "../lib/push";
|
||||
import { loadNotifPrefs, saveNotifPrefs, type NotifPrefs } from "../lib/notifPrefs";
|
||||
import { notify } from "../lib/notify";
|
||||
import { Tip } from "../components/Tip";
|
||||
import { ImportHistory } from "../components/ImportHistory";
|
||||
import { RemoteSources } from "../components/RemoteSources";
|
||||
@@ -569,7 +570,10 @@ export function Settings() {
|
||||
const perm = await Notification.requestPermission();
|
||||
if (perm === "granted") {
|
||||
updateNotifPrefs({ enabled: true });
|
||||
await subscribeToPush();
|
||||
// A browser with no service worker / on a non-secure origin rejects here;
|
||||
// notifications still work through the local fallback in useNotifications,
|
||||
// so this must not blow up the enable flow.
|
||||
await subscribeToPush().catch(() => {});
|
||||
}
|
||||
};
|
||||
|
||||
@@ -1554,14 +1558,6 @@ export function Settings() {
|
||||
label={t("notifications.awaitingInput")}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex items-center gap-3 bg-surface-2 rounded-lg px-3.5 py-3">
|
||||
<MessageSquare className="w-4 h-4 text-accent flex-shrink-0" />
|
||||
<Toggle
|
||||
checked={notifPrefs.onTurnComplete}
|
||||
onChange={(v) => updateNotifPrefs({ onTurnComplete: v })}
|
||||
label={t("notifications.turnComplete")}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex items-center gap-3 bg-surface-2 rounded-lg px-3.5 py-3">
|
||||
<Play className="w-4 h-4 text-status-success flex-shrink-0" />
|
||||
<Toggle
|
||||
@@ -1570,6 +1566,14 @@ export function Settings() {
|
||||
label={t("notifications.newSession")}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex items-center gap-3 bg-surface-2 rounded-lg px-3.5 py-3">
|
||||
<MessageSquare className="w-4 h-4 text-accent flex-shrink-0" />
|
||||
<Toggle
|
||||
checked={notifPrefs.onTurnComplete}
|
||||
onChange={(v) => updateNotifPrefs({ onTurnComplete: v })}
|
||||
label={t("notifications.turnComplete")}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex items-center gap-3 bg-surface-2 rounded-lg px-3.5 py-3">
|
||||
<CheckCircle className="w-4 h-4 text-violet-400 flex-shrink-0" />
|
||||
<Toggle
|
||||
@@ -1599,15 +1603,27 @@ export function Settings() {
|
||||
<div className="pt-3 border-t border-border">
|
||||
<button
|
||||
onClick={async () => {
|
||||
if (!("Notification" in window) || Notification.permission !== "granted")
|
||||
return;
|
||||
await fetch("/api/push/send", {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({
|
||||
title: t("notifications.testTitle"),
|
||||
body: t("notifications.testBody"),
|
||||
}),
|
||||
// Same notify() the live events use, so the test proves the
|
||||
// real path — and reports WHERE it landed, since a push that
|
||||
// reaches nobody used to look exactly like success.
|
||||
const r = await notify(
|
||||
t("notifications.testTitle"),
|
||||
t("notifications.testBody")
|
||||
);
|
||||
const reason = r.errors
|
||||
.map((e) => [e.statusCode, e.message].filter(Boolean).join(" "))
|
||||
.join("; ");
|
||||
setActionResult({
|
||||
key: "notif-test",
|
||||
isError: r.via === "none" || r.via === "blocked",
|
||||
message:
|
||||
r.via === "push" || r.via === "native"
|
||||
? t("notifications.testSent")
|
||||
: r.via === "local"
|
||||
? t("notifications.testLocal")
|
||||
: r.via === "blocked"
|
||||
? t("notifications.testBlocked")
|
||||
: `${t("notifications.testFailed")}${reason ? ` (${reason})` : ""}`,
|
||||
});
|
||||
}}
|
||||
className="inline-flex items-center gap-1.5 text-xs px-3 py-1.5 rounded-md text-fg-secondary hover:text-fg-primary hover:bg-surface-4 border border-border transition-colors"
|
||||
@@ -1615,6 +1631,7 @@ export function Settings() {
|
||||
<Zap className="w-3 h-3" />
|
||||
{t("notifications.sendTest")}
|
||||
</button>
|
||||
<div className="mt-2">{actionBanner(["notif-test"])}</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -41,6 +41,7 @@
|
||||
* ----------------------------------------------------------------------------- */
|
||||
|
||||
import { useCallback, useEffect, useState, useSyncExternalStore } from "react";
|
||||
import { useSearchParams } from "react-router-dom";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { Plus, Square, Columns2, Grid2x2, Pencil } from "lucide-react";
|
||||
import { api } from "../lib/api";
|
||||
@@ -198,6 +199,7 @@ function ConsoleArea({
|
||||
export function Workspace() {
|
||||
const { t: tLanes } = useTranslation("lanes");
|
||||
const wsConnected = useSyncExternalStore(eventBus.onConnection, () => eventBus.connected);
|
||||
const [searchParams, setSearchParams] = useSearchParams();
|
||||
|
||||
// Lane state
|
||||
const [lanes, setLanes] = useState<Lane[]>([]);
|
||||
@@ -274,6 +276,26 @@ export function Workspace() {
|
||||
}
|
||||
}, []);
|
||||
|
||||
// Deep link from a notification click (`/workspace?lane=<id>`, see
|
||||
// useNotifications' laneUrlForSession): once that lane is in the loaded
|
||||
// list, select it and drop the param so a later manual lane switch sticks.
|
||||
useEffect(() => {
|
||||
const laneParam = searchParams.get("lane");
|
||||
if (laneParam === null || lanes.length === 0) return;
|
||||
const paramId = Number(laneParam);
|
||||
if (lanes.some((l) => l.id === paramId)) {
|
||||
setSelectedLaneId(paramId);
|
||||
}
|
||||
setSearchParams(
|
||||
(prev) => {
|
||||
const next = new URLSearchParams(prev);
|
||||
next.delete("lane");
|
||||
return next;
|
||||
},
|
||||
{ replace: true }
|
||||
);
|
||||
}, [lanes, searchParams, setSearchParams]);
|
||||
|
||||
useEffect(() => {
|
||||
Promise.all([api.run.binary("claude"), api.run.binary("codex")])
|
||||
.then(([claude, codex]) => setBinaryStatus({ claude, codex }))
|
||||
|
||||
Reference in New Issue
Block a user