@aglyn/plugins-ai 1.0.0-beta.293 → 1.0.0-beta.296

package/src/lib/components/assist-panel.component.js

@@ -25,7 +25,7 @@ import { AppLink, MdiIcon } from "@aglyn/shared-ui-jsx";
 import { BetaChip } from "@aglyn/shared-ui-jsx/components/beta-chip.component";
 import { useSnackbar } from "@aglyn/shared-ui-snackstack";
 import { Alert, Badge, Box, Button, Chip, CircularProgress, Collapse, Drawer, Fab, IconButton, Link, Paper, Stack, TextField, Tooltip, Typography } from "@mui/material";
-import { usePathname } from "next/navigation";
+import { usePathname, useRouter } from "next/navigation";
 import { Fragment, memo, useCallback, useEffect, useRef, useState, useSyncExternalStore } from "react";
 import { useUser } from "@aglyn/tenant-feature-instance";
 import { authorizedFetch } from "@aglyn/shared-util-http/authorized-token";
@@ -35,11 +35,14 @@ import { AssistEditCard } from "./assist-edit-card.component.js";
 import { AssistBuildCard } from "./assist-build-card.component.js";
 import { isAssistBuildProposal } from "../model/assist-build.js";
 import { assistBuildDraftLinks, isAssistFollowUpDue, isLiveAssistFollowUp } from "../model/assist-follow-up.js";
-import { startAssistBuildRequest } from "./ai-job-requests.js";
+import { cancelAiJobRequest, startAssistBuildRequest, startAssistPageChangeRequest } from "./ai-job-requests.js";
+import { assistPageChangeDraftVersion, isAssistPageChangeProposal } from "../model/assist-page-change.js";
+import { AssistPageChangeCard } from "./assist-page-change-card.component.js";
 import { aiInsightSurfaceForPath } from "../model/ai-insight.js";
 import { AssistJobsDrawer } from "./assist-jobs-drawer.component.js";
 import { AI_JOB_LINK_PARAM, openAiJobs, useAiJobsInFlight, useAiJobsOpenRequest } from "./ai-jobs-store.js";
-import { aiJobsActivity, aiJobsLauncherLabel } from "../model/ai-job-activity.js";
+import { aiJobPhase, aiJobsActivity, aiJobsLauncherLabel } from "../model/ai-job-activity.js";
+import { AI_SITE_BUILD_HREF } from "../model/ai-job-notice.js";
 import { AiModelSelector } from "./ai-model-selector.component.js";
 import { AiUsageStrip } from "./ai-usage-strip.component.js";
 import { useAiModelChoice } from "./use-ai-model-choice.js";
@@ -80,28 +83,69 @@ function saveFollowUp(orgId, followUp) {
         ] : []).reverse();
     return assistBuildDraftLinks(jobs, orgSlug);
 }
+/**
+ * The builds in a thread whose plan is still waiting on the person
+ * (AGL-4116): queued, being planned, or planned and not yet confirmed. A new
+ * plan in the same thread replaces them, so a conversation that keeps
+ * changing a plan holds one plan, not one per message.
+ */ export function assistUnconfirmedBuilds(messages) {
+    return messages.flatMap((message, index)=>{
+        const job = message.build && !message.buildReplaced ? message.buildJob : null;
+        if (!job) return [];
+        const phase = aiJobPhase(job);
+        return phase === 'queued' || phase === 'planning' || phase === 'plan-ready' ? [
+            {
+                index,
+                jobId: job.id
+            }
+        ] : [];
+    });
+}
+/** What a plan a later one replaced says in its card's place (AGL-4116). */ export const ASSIST_BUILD_REPLACED_COPY = 'Replaced by the updated plan below. Nothing from this one was built.';
 /** What a stored build that never got its job says, rather than planning forever. */ const BUILD_NOT_STARTED = 'This build was not started. Ask again to plan it.';
+/** What a stored page change that never got its job says (AGL-4116). */ const PAGE_CHANGE_NOT_STARTED = 'This change was not started. Ask again to make it.';
 const HISTORY_TURNS_SENT = 12;
-const storageKey = (orgId)=>`aglyn-assist:${orgId}`;
-function loadThread(orgId) {
-    if (!orgId || typeof sessionStorage === 'undefined') return [];
+/**
+ * The thread a question belongs to: one per site, and one for the
+ * workspace's own pages (AGL-4116). A workspace-wide thread carried one
+ * site's request into a build on another site, because the history that
+ * rides each question is the thread's last turns.
+ */ export function assistThreadKey(orgId, hostId) {
+    return hostId ? `aglyn-assist:${orgId}:${hostId}` : `aglyn-assist:${orgId}`;
+}
+const NO_MESSAGES = [];
+/**
+ * The AI jobs page of the site a console page is on (AGL-4116), or `null`
+ * off a site: `/{orgSlug}/hosts/{site}/ai-jobs`, the site named as the
+ * address names it.
+ */ export function assistSiteAiJobsHref(pathname, orgSlug, hostId) {
+    if (!pathname || !orgSlug || !hostId) return null;
+    const parts = pathname.split('/').filter(Boolean);
+    const site = parts[0] === orgSlug && parts[1] === 'hosts' ? parts[2] : undefined;
+    return site ? `/${orgSlug}/hosts/${site}${AI_SITE_BUILD_HREF}` : null;
+}
+function loadThread(key) {
+    if (typeof sessionStorage === 'undefined') return [];
     try {
-        const raw = sessionStorage.getItem(storageKey(orgId));
+        const raw = sessionStorage.getItem(key);
         const parsed = raw ? JSON.parse(raw) : [];
         if (!Array.isArray(parsed)) return [];
         // A build whose job was still being created when the page went away is
         // not started again from a stored thread (AGL-3616): it says so instead.
+        // A page change likewise (AGL-4116).
         return parsed.map((message)=>message.build && !message.buildJob && !message.buildNotice ? _extends({}, message, {
                 buildNotice: BUILD_NOT_STARTED
+            }) : message.pageChange && !message.pageChangeJob && !message.pageChangeNotice ? _extends({}, message, {
+                pageChangeNotice: PAGE_CHANGE_NOT_STARTED
             }) : message);
     } catch (unused) {
         return [];
     }
 }
-function saveThread(orgId, messages) {
-    if (!orgId || typeof sessionStorage === 'undefined') return;
+function saveThread(key, messages) {
+    if (typeof sessionStorage === 'undefined') return;
     try {
-        sessionStorage.setItem(storageKey(orgId), JSON.stringify(messages));
+        sessionStorage.setItem(key, JSON.stringify(messages));
     } catch (unused) {
     // Quota/full storage never breaks chat.
     }
@@ -523,7 +567,25 @@ export function AssistPanelComponent(props) {
     const { enqueueSnackbar } = useSnackbar();
     const [open, setOpen] = useState(false);
     const [busy, setBusy] = useState(false);
-    const [messages, setMessages] = useState([]);
+    // Every thread this panel has opened, by its key (AGL-4116): the one on
+    // screen is this site's, and an answer still streaming lands in the thread
+    // it was asked in, even after the page moved to another site.
+    const threadKey = scopedOrgId ? assistThreadKey(scopedOrgId, hostId) : null;
+    const [threads, setThreads] = useState({});
+    const messages = threadKey && threads[threadKey] || NO_MESSAGES;
+    const updateThread = useCallback((key, update)=>{
+        if (!key) return;
+        setThreads((prior)=>{
+            var _prior_key;
+            return _extends({}, prior, {
+                [key]: update((_prior_key = prior[key]) != null ? _prior_key : loadThread(key))
+            });
+        });
+    }, []);
+    const setMessages = useCallback((update)=>updateThread(threadKey, update), [
+        threadKey,
+        updateThread
+    ]);
     const [quota, setQuota] = useState(null);
     const scrollRef = useRef(null);
     // The model switch and the usage strip (AGL-2942): the pick rides the
@@ -540,22 +602,40 @@ export function AssistPanelComponent(props) {
     // the one open.
     const editorRevision = useSyncExternalStore(subscribeEditorSessions, editorSessionsRevision, editorSessionsRevision);
     const editorSession = openEditorSession();
-    // Thread is per-org, session-persisted; switching orgs swaps threads.
-    // Keyed on the SCOPED org (AGL-1934): gating only the render would still
-    // load — and, on the next keystroke, save — a thread under the fallback
-    // org's key on every mount of a page that named no workspace.
+    // A thread per site, session-persisted; moving to another site or org
+    // swaps threads (AGL-4116). Keyed on the SCOPED org (AGL-1934): gating only
+    // the render would still load — and, on the next keystroke, save — a
+    // thread under the fallback org's key on every mount of a page that named
+    // no workspace.
+    useEffect(()=>{
+        if (!threadKey) return;
+        setThreads((prior)=>threadKey in prior ? prior : _extends({}, prior, {
+                [threadKey]: loadThread(threadKey)
+            }));
+    }, [
+        threadKey
+    ]);
     useEffect(()=>{
-        setMessages(loadThread(scopedOrgId));
         setQuota(null);
     }, [
         scopedOrgId
     ]);
+    // Each thread is written back when it changes, the one on screen or one an
+    // answer is still streaming into.
+    const savedThreads = useRef({});
+    useEffect(()=>{
+        for (const [key, list] of Object.entries(threads)){
+            if (savedThreads.current[key] === list) continue;
+            savedThreads.current[key] = list;
+            saveThread(key, list);
+        }
+    }, [
+        threads
+    ]);
     useEffect(()=>{
-        saveThread(scopedOrgId, messages);
         const node = scrollRef.current;
         if (node) node.scrollTop = node.scrollHeight;
     }, [
-        scopedOrgId,
         messages
     ]);
     const entitled = orgReady && checkEntitlement(org, 'aiAssist');
@@ -574,10 +654,16 @@ export function AssistPanelComponent(props) {
     // jobs that spend between chat messages move it (AGL-3722).
     useEffect(()=>followAiJobsForUsageMeter(), []);
     const jobsActivity = aiJobsActivity(inFlight);
+    // On a site, its jobs are read on its AI jobs page (AGL-4116): the list in
+    // the chat was too cramped to read, and opening it scrolled the chat to
+    // its top.
+    const siteJobsHref = assistSiteAiJobsHref(pathname, orgSlug, hostId);
+    const router = useRouter();
     // Any surface asking to open AI jobs — an "Open AI jobs" button, the
-    // indicator, a notification's link — opens the panel on its drawer.
-    // The request is handed to the drawer until the panel closes, so opening
-    // the panel again later does not re-highlight a job asked for before.
+    // indicator, a notification's link — goes to the site's AI jobs page, on
+    // the job it names. Off a site, it opens the panel on its drawer, and the
+    // request is handed to the drawer until the panel closes, so opening the
+    // panel again later does not re-highlight a job asked for before.
     const openRequest = useAiJobsOpenRequest();
     const [jobsFocus, setJobsFocus] = useState(null);
     // The request outlives the panel: it is module state, and a page in
@@ -587,6 +673,11 @@ export function AssistPanelComponent(props) {
     useEffect(()=>{
         if (openRequest.seq <= answeredSeq.current) return;
         answeredSeq.current = openRequest.seq;
+        if (siteJobsHref) {
+            setOpen(false);
+            router.push(openRequest.jobId ? `${siteJobsHref}/${encodeURIComponent(openRequest.jobId)}` : siteJobsHref);
+            return;
+        }
         setJobsFocus(openRequest);
         setOpen(true);
     // A new `seq` is a new request; the object is read as it stands.
@@ -620,11 +711,14 @@ export function AssistPanelComponent(props) {
         // The drafts this thread's builds made (AGL-3616): the chat sees refs and
         // labels; the addresses stay here, for the card a follow-up raises.
         const draftLinks = hostId ? assistThreadDraftLinks(messages, orgSlug) : [];
+        // Only this site's turns ride the question (AGL-4116), and the answer
+        // lands in the thread it was asked in.
         const history = messages.slice(-HISTORY_TURNS_SENT).map(({ role, text })=>({
                 role,
                 text
             }));
-        setMessages((prior)=>[
+        const askedIn = threadKey;
+        updateThread(askedIn, (prior)=>[
                 ...prior,
                 {
                     role: 'user',
@@ -636,7 +730,7 @@ export function AssistPanelComponent(props) {
                 }
             ]);
         const patchAnswer = (patch)=>{
-            setMessages((prior)=>{
+            updateThread(askedIn, (prior)=>{
                 const next = [
                     ...prior
                 ];
@@ -655,6 +749,7 @@ export function AssistPanelComponent(props) {
                 }));
         };
         /** The build this turn proposed, started once its stream ends (AGL-3616). */ let proposedBuild = null;
+        /** The page change this turn asked for, started once its stream ends (AGL-4116). */ let proposedChange = null;
         try {
             var _ref;
             // The canvas outline rides along from the besigner document the open
@@ -782,6 +877,9 @@ export function AssistPanelComponent(props) {
                         // The build proposal (AGL-3616), shape-checked before it can start a job.
                         const build = isAssistBuildProposal(event.build) ? event.build : null;
                         proposedBuild = build;
+                        // The page change (AGL-4116), shape-checked before it can start a job.
+                        const pageChange = isAssistPageChangeProposal(event.pageChange) ? event.pageChange : null;
+                        proposedChange = pageChange;
                         patchAnswer((message)=>{
                             var _event_exchangeId;
                             return _extends({}, message, {
@@ -793,6 +891,10 @@ export function AssistPanelComponent(props) {
                                 build,
                                 buildJob: null,
                                 buildNotice: null
+                            } : {}, pageChange ? {
+                                pageChange,
+                                pageChangeJob: null,
+                                pageChangeNotice: null
                             } : {});
                         });
                         if (event.quota) setQuota(event.quota);
@@ -816,6 +918,11 @@ export function AssistPanelComponent(props) {
                                 action: build.id
                             });
                         }
+                        if (pageChange) {
+                            trackEvent('assistant_proposal_shown', {
+                                action: pageChange.id
+                            });
+                        }
                     } else if (event.type === 'error') {
                         var _event_error;
                         failAnswer(String((_event_error = event.error) != null ? _event_error : 'The assistant stream failed.'));
@@ -825,6 +932,21 @@ export function AssistPanelComponent(props) {
             // One request, one build (AGL-3616): the job is created here, once,
             // through the job door, and plans inline; its card shows the plan.
             if (proposedBuild) {
+                // One plan per conversation (AGL-4116): a plan this thread proposed
+                // and the person has not confirmed is replaced by the new one, which
+                // the chat wrote from the whole request as it now stands. Its job is
+                // canceled, so it never builds and never warns another door.
+                for (const replaced of assistUnconfirmedBuilds(messages)){
+                    updateThread(askedIn, (prior)=>prior.map((entry, i)=>i === replaced.index ? _extends({}, entry, {
+                                buildReplaced: true
+                            }) : entry));
+                    void cancelAiJobRequest(user, scopedOrgId, replaced.jobId).then(({ job })=>{
+                        if (!job) return;
+                        updateThread(askedIn, (prior)=>prior.map((entry, i)=>i === replaced.index ? _extends({}, entry, {
+                                    buildJob: job
+                                }) : entry));
+                    });
+                }
                 const decision = await startAssistBuildRequest(user, scopedOrgId, proposedBuild);
                 // The plan the door ran inline has just spent (AGL-3722), so the strip
                 // moves with it, to the figure the plan card quotes. Left to the jobs
@@ -843,6 +965,17 @@ export function AssistPanelComponent(props) {
                         buildNotice: decision.error
                     }));
             }
+            // A change to a page (AGL-4116): its edit job starts here, once, with
+            // no plan to confirm. A follow-up to a page this conversation already
+            // changed starts from the draft that change made.
+            if (proposedChange) {
+                const decision = await startAssistPageChangeRequest(user, scopedOrgId, proposedChange, assistPageChangeDraftVersion(messages, proposedChange.pageId));
+                publishMeter(decision.meter);
+                patchAnswer((message)=>_extends({}, message, {
+                        pageChangeJob: decision.job,
+                        pageChangeNotice: decision.error
+                    }));
+            }
         } catch (error) {
             console.error(error);
             failAnswer('The assistant request failed — check your connection and try again.');
@@ -861,6 +994,8 @@ export function AssistPanelComponent(props) {
         scopedOrgId,
         orgSlug,
         pathname,
+        threadKey,
+        updateThread,
         user
     ]);
     // A follow-up waiting for its draft's canvas (AGL-3616): kept per org, so a
@@ -924,7 +1059,9 @@ export function AssistPanelComponent(props) {
         setMessages((prior)=>prior.map((entry, i)=>i === index ? _extends({}, entry, {
                     proposalResolved: true
                 }) : entry));
-    }, []);
+    }, [
+        setMessages
+    ]);
     /**
    * Land a confirmed edit on the open editor (AGL-2906): through the canvas's
    * own mutators, as one undo step, unsaved. The only request that follows is
@@ -979,18 +1116,52 @@ export function AssistPanelComponent(props) {
         enqueueSnackbar,
         messages,
         scopedOrgId,
+        setMessages,
         user
     ]);
     /** Keep what a build card learned about its job on its own message (AGL-3616). */ const patchBuild = useCallback((index, patch)=>{
         setMessages((prior)=>prior.map((entry, i)=>i === index ? _extends({}, entry, patch) : entry));
-    }, []);
+    }, [
+        setMessages
+    ]);
+    /** Keep what a page change card learned about its job on its own message (AGL-4116). */ const patchPageChange = useCallback((index, patch)=>{
+        setMessages((prior)=>prior.map((entry, i)=>i === index ? _extends({}, entry, patch) : entry));
+    }, [
+        setMessages
+    ]);
+    /** Start a page change again after it failed: a new edit job, from the same draft. */ const [retryingChange, setRetryingChange] = useState(null);
+    const retryPageChange = useCallback(async (index)=>{
+        var _messages_index;
+        const proposal = (_messages_index = messages[index]) == null ? void 0 : _messages_index.pageChange;
+        if (!proposal || !scopedOrgId) return;
+        setRetryingChange(index);
+        patchPageChange(index, {
+            pageChangeJob: null,
+            pageChangeNotice: null
+        });
+        const decision = await startAssistPageChangeRequest(user, scopedOrgId, proposal, assistPageChangeDraftVersion(messages.slice(0, index), proposal.pageId));
+        publishMeter(decision.meter);
+        patchPageChange(index, {
+            pageChangeJob: decision.job,
+            pageChangeNotice: decision.error
+        });
+        setRetryingChange(null);
+    }, [
+        messages,
+        patchPageChange,
+        publishMeter,
+        scopedOrgId,
+        user
+    ]);
     /** Wave an edit card away. Nothing to tell the server: nothing happened. */ const dismissEdit = useCallback((index)=>{
         setMessages((prior)=>prior.map((entry, i)=>i === index ? _extends({}, entry, {
                     editOutcome: {
                         kind: 'dismissed'
                     }
                 }) : entry));
-    }, []);
+    }, [
+        setMessages
+    ]);
     const sendFeedback = useCallback(async (index, feedback)=>{
         const message = messages[index];
         if (!(message == null ? void 0 : message.exchangeId) || !scopedOrgId) return;
@@ -1022,6 +1193,7 @@ export function AssistPanelComponent(props) {
         enqueueSnackbar,
         messages,
         scopedOrgId,
+        setMessages,
         user
     ]);
     // A released-off feature does not exist (staff preview excepted) — and
@@ -1163,7 +1335,8 @@ export function AssistPanelComponent(props) {
                                     // the jobs door where the member may not generate.
                                     insight: ai.generate ? aiInsightSurfaceForPath(pathname) : null,
                                     inFlight: jobsVisible ? inFlight : undefined,
-                                    focus: jobsFocus
+                                    focus: jobsFocus,
+                                    pageHref: siteJobsHref
                                 }),
                                 !messages.length && /*#__PURE__*/ _jsxs(Alert, {
                                     severity: "info",
@@ -1189,7 +1362,7 @@ export function AssistPanelComponent(props) {
                                 /*#__PURE__*/ _jsx(Stack, {
                                     spacing: 1.5,
                                     children: messages.map((message, index)=>{
-                                        var _message_buildJob, _message_buildNotice;
+                                        var _message_pageChangeJob, _message_pageChangeNotice, _message_buildJob, _message_buildNotice;
                                         var _message_editOutcome, _message_editOutcome1, _message_editOutcome2, _message_editOutcome3;
                                         return /*#__PURE__*/ _jsxs(Box, {
                                             sx: {
@@ -1249,7 +1422,29 @@ export function AssistPanelComponent(props) {
                                                     },
                                                     onDismiss: ()=>dismissEdit(index)
                                                 }),
-                                                message.role === 'assistant' && message.build && scopedOrgId && /*#__PURE__*/ _jsx(AssistBuildCard, {
+                                                message.role === 'assistant' && message.pageChange && scopedOrgId && /*#__PURE__*/ _jsx(AssistPageChangeCard, {
+                                                    proposal: message.pageChange,
+                                                    job: (_message_pageChangeJob = message.pageChangeJob) != null ? _message_pageChangeJob : null,
+                                                    notice: (_message_pageChangeNotice = message.pageChangeNotice) != null ? _message_pageChangeNotice : null,
+                                                    orgId: scopedOrgId,
+                                                    orgSlug: orgSlug,
+                                                    user: user,
+                                                    busy: retryingChange === index,
+                                                    onJob: (job)=>patchPageChange(index, {
+                                                            pageChangeJob: job
+                                                        }),
+                                                    onRetry: ()=>void retryPageChange(index)
+                                                }),
+                                                message.role === 'assistant' && message.build && message.buildReplaced && /*#__PURE__*/ _jsx(Typography, {
+                                                    variant: "caption",
+                                                    color: "text.secondary",
+                                                    component: "div",
+                                                    sx: {
+                                                        mt: 0.5
+                                                    },
+                                                    children: ASSIST_BUILD_REPLACED_COPY
+                                                }),
+                                                message.role === 'assistant' && message.build && !message.buildReplaced && scopedOrgId && /*#__PURE__*/ _jsx(AssistBuildCard, {
                                                     proposal: message.build,
                                                     job: (_message_buildJob = message.buildJob) != null ? _message_buildJob : null,
                                                     notice: (_message_buildNotice = message.buildNotice) != null ? _message_buildNotice : null,