@mndrk/agx 2.4.3 → 2.4.5

package/cloud-runtime/standalone/apps/local/components/thread/WorkspaceSidebar.tsx

@@ -15,14 +15,15 @@ import {
   Search,
   Trash2,
   X,
-  Settings,
   Target,
+  Bell,
   Users,
   Home,
   MessageSquare,
   TerminalSquare,
   KeyRound,
   ArrowUpCircle,
+  GitPullRequest,
 } from "lucide-react";
 import Link from "next/link";
 import type { Thread } from "@/lib/storage";
@@ -72,7 +73,7 @@ interface WorkspaceSidebarProps {
   onUpdateParticipant?: (participant: Participant) => Promise<unknown>;
   onSelectProject?: (projectId: string) => void;
   activeProjectId?: string | null;
-  activeProjectView?: "home" | "objectives" | "teams" | "thread" | "automations" | "linear" | "tracking" | "terminal" | "env-vars" | "folders" | null;
+  activeProjectView?: "home" | "objectives" | "teams" | "thread" | "automations" | "linear" | "tracking" | "terminal" | "env-vars" | "folders" | "notifications" | null;
   onAddTeam?: (projectId: string) => void;
   stageShow?: SidebarStageResult["show"];
   trackerConnections?: TrackerConnectionEntry[];
@@ -84,13 +85,8 @@ function WorkspaceSidebarBrandLogo({ compact = false }: { compact?: boolean }) {
       className={`workspace-sidebar__brand-logo${compact ? " workspace-sidebar__brand-logo--compact" : ""}`}
       aria-hidden="true"
     >
-      <span className="workspace-sidebar__brand-grid">
-        <span className="workspace-sidebar__brand-dot workspace-sidebar__brand-dot--blue" />
-        <span className="workspace-sidebar__brand-dot workspace-sidebar__brand-dot--yellow" />
-        <span className="workspace-sidebar__brand-dot workspace-sidebar__brand-dot--mint" />
-        <span className="workspace-sidebar__brand-dot workspace-sidebar__brand-dot--red" />
-      </span>
-      <span className="workspace-sidebar__brand-text">AGX</span>
+      <img src="/logo_dark.png" alt="AGX" className="block dark:hidden" style={{ height: 28 }} />
+      <img src="/logo_light.png" alt="AGX" className="hidden dark:block" style={{ height: 28 }} />
     </span>
   );
 }
@@ -581,7 +577,7 @@ export function WorkspaceSidebar({
   const stageShow = stageShowProp ?? {
     home: true, threads: true, terminal: true, objectives: false,
     objectivesIsNew: false, tracking: false, teams: false, folders: false,
-    scheduledTasks: false, envVars: false,
+    scheduledTasks: false, envVars: false, notifications: false,
   };
 
   useEffect(() => {
@@ -788,6 +784,13 @@ export function WorkspaceSidebar({
                 </Link>
               </RailTooltip>
             )}
+            {stageShow.tracking && (
+              <RailTooltip label="Pull Requests">
+                <Link href={`/projects/${collapsedSlug}/prs`} className="workspace-sidebar__rail-icon">
+                  <GitPullRequest size={16} />
+                </Link>
+              </RailTooltip>
+            )}
             {stageShow.scheduledTasks && (
               <RailTooltip label="Scheduled Jobs">
                 <Link href={`/projects/${collapsedSlug}/automations`} className={`workspace-sidebar__rail-icon${activeProjectView === "automations" ? " workspace-sidebar__rail-icon--active" : ""}`}>
@@ -817,7 +820,7 @@ export function WorkspaceSidebar({
               </button>
             </RailTooltip>
 
-            {(stageShow.teams || stageShow.folders || stageShow.envVars) && (
+            {(stageShow.teams || stageShow.folders || stageShow.envVars || stageShow.notifications) && (
               <div className="workspace-sidebar__rail-separator" />
             )}
 
@@ -842,6 +845,13 @@ export function WorkspaceSidebar({
                 </Link>
               </RailTooltip>
             )}
+            {stageShow.notifications && (
+              <RailTooltip label="Notifications">
+                <Link href={`/projects/${collapsedSlug}/notifications`} className={`workspace-sidebar__rail-icon${activeProjectView === "notifications" ? " workspace-sidebar__rail-icon--active" : ""}`}>
+                  <Bell size={16} />
+                </Link>
+              </RailTooltip>
+            )}
           </nav>
         )}
 
@@ -948,10 +958,11 @@ export function WorkspaceSidebar({
           const isActiveProjectTeams = isActiveProject && activeProjectView === "teams";
           const isActiveProjectFolders = isActiveProject && activeProjectView === "folders";
           const isActiveProjectEnvVars = isActiveProject && activeProjectView === "env-vars";
+          const isActiveProjectNotifications = isActiveProject && activeProjectView === "notifications";
           const navActivity = navActivityByProject[selectedProject.id];
 
           const showWorkGroup = stageShow.objectives || stageShow.scheduledTasks;
-          const showSettingsGroup = stageShow.teams || stageShow.folders || stageShow.envVars;
+          const showSettingsGroup = stageShow.teams || stageShow.folders || stageShow.envVars || stageShow.notifications;
 
           return (
             <nav className="workspace-sidebar__section">
@@ -1138,6 +1149,19 @@ export function WorkspaceSidebar({
                         </Link>
                       </div>
                     )}
+                    {stageShow.notifications && (
+                      <div className="workspace-sidebar__workspace-item">
+                        <Link
+                          href={`/projects/${selectedProject.slug}/notifications`}
+                          onClick={closeTouchDrawer}
+                          className={`workspace-sidebar__nav-item ${isActiveProjectNotifications ? "workspace-sidebar__nav-item--active" : ""}`}
+                          aria-current={isActiveProjectNotifications ? "page" : undefined}
+                        >
+                          <Bell size={14} className="flex-shrink-0 text-[var(--muted-foreground)]" />
+                          <span className="workspace-sidebar__workspace-title text-sm">Notifications</span>
+                        </Link>
+                      </div>
+                    )}
                   </div>
                 </div>
               )}

package/cloud-runtime/standalone/apps/local/components/tracker/FolderRow.tsx

@@ -66,12 +66,15 @@ export function FolderRow({
     }
   }, [projectSlug, groupId]);
 
-  const handleNoteClick = useCallback((e: React.MouseEvent) => {
+  const handleNoteClick = useCallback(async (e: React.MouseEvent) => {
     e.stopPropagation();
-    if (!noteOpen) {
-      void loadNote();
+    if (noteOpen) {
+      setNoteOpen(false);
+      return;
     }
-    setNoteOpen((prev) => !prev);
+
+    await loadNote();
+    setNoteOpen(true);
   }, [noteOpen, loadNote]);
 
   return (

package/cloud-runtime/standalone/apps/local/components/tracker/LinkedPrsSection.tsx

@@ -0,0 +1,251 @@
+"use client";
+
+import React, { useCallback, useEffect, useState } from "react";
+import { Plus, X } from "lucide-react";
+import type { GithubPr, TrackerTargetType } from "@/lib/github-types";
+
+interface Props {
+  targetType: TrackerTargetType;
+  targetId: string;
+  projectSlug: string;
+}
+
+function statePillClasses(pr: GithubPr): string {
+  if (pr.state === "merged")
+    return "bg-purple-500/15 text-purple-400 border-purple-500/30";
+  if (pr.state === "closed")
+    return "bg-red-500/15 text-red-400 border-red-500/30";
+  if (pr.draft)
+    return "bg-neutral-500/15 text-neutral-400 border-neutral-500/30";
+  return "bg-green-500/15 text-green-400 border-green-500/30";
+}
+
+function stateLabel(pr: GithubPr): string {
+  if (pr.state === "merged") return "Merged";
+  if (pr.state === "closed") return "Closed";
+  if (pr.draft) return "Draft";
+  return "Open";
+}
+
+function ciIcon(status: GithubPr["ciStatus"]): { symbol: string; color: string } | null {
+  if (status === "success") return { symbol: "✓", color: "text-green-500" };
+  if (status === "failure") return { symbol: "✗", color: "text-red-500" };
+  if (status === "pending") return { symbol: "●", color: "text-amber-500" };
+  return null;
+}
+
+function reviewDecisionChip(decision: GithubPr["reviewDecision"]): { label: string; cls: string } | null {
+  if (decision === "approved")
+    return { label: "approved", cls: "bg-green-500/15 text-green-400 border-green-500/30" };
+  if (decision === "changes_requested")
+    return { label: "changes requested", cls: "bg-amber-500/15 text-amber-400 border-amber-500/30" };
+  if (decision === "review_required")
+    return { label: "review required", cls: "bg-neutral-500/15 text-neutral-400 border-neutral-500/30" };
+  return null;
+}
+
+export function LinkedPrsSection({ targetType, targetId, projectSlug }: Props) {
+  const [prs, setPrs] = useState<GithubPr[]>([]);
+  const [loaded, setLoaded] = useState(false);
+  const [formOpen, setFormOpen] = useState(false);
+  const [url, setUrl] = useState("");
+  const [formError, setFormError] = useState<string | null>(null);
+  const [submitting, setSubmitting] = useState(false);
+
+  const fetchPrs = useCallback(async () => {
+    try {
+      const qs = new URLSearchParams({ targetType, targetId });
+      const res = await fetch(`/api/github/prs/for-target?${qs.toString()}`);
+      if (!res.ok) {
+        setPrs([]);
+      } else {
+        const data = (await res.json()) as { prs: GithubPr[] };
+        setPrs(data.prs);
+      }
+    } catch {
+      setPrs([]);
+    } finally {
+      setLoaded(true);
+    }
+  }, [targetType, targetId]);
+
+  useEffect(() => {
+    setLoaded(false);
+    setFormOpen(false);
+    setUrl("");
+    setFormError(null);
+    void fetchPrs();
+  }, [fetchPrs]);
+
+  const handleRowClick = useCallback(
+    (pr: GithubPr) => {
+      const href = `/projects/${encodeURIComponent(projectSlug)}/prs?pr=${encodeURIComponent(pr.id)}`;
+      window.location.href = href;
+    },
+    [projectSlug],
+  );
+
+  const handleSubmit = useCallback(
+    async (e: React.FormEvent) => {
+      e.preventDefault();
+      if (!url.trim() || submitting) return;
+      setSubmitting(true);
+      setFormError(null);
+      try {
+        const res = await fetch("/api/github/prs/link", {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({ url: url.trim(), targetType, targetId }),
+        });
+        const payload = (await res.json().catch(() => ({}))) as {
+          error?: string;
+          message?: string;
+        };
+        if (!res.ok) {
+          setFormError(payload.message || payload.error || `HTTP ${res.status}`);
+          return;
+        }
+        setUrl("");
+        setFormOpen(false);
+        await fetchPrs();
+      } catch (err) {
+        setFormError(err instanceof Error ? err.message : String(err));
+      } finally {
+        setSubmitting(false);
+      }
+    },
+    [url, submitting, targetType, targetId, fetchPrs],
+  );
+
+  const handleDelete = useCallback(
+    async (pr: GithubPr, e: React.MouseEvent) => {
+      e.stopPropagation();
+      if (!window.confirm(`Unlink ${pr.id} from this issue?`)) return;
+      try {
+        const res = await fetch("/api/github/prs/link", {
+          method: "DELETE",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({ prId: pr.id, targetType, targetId }),
+        });
+        if (!res.ok) return;
+        await fetchPrs();
+      } catch {
+        /* noop */
+      }
+    },
+    [targetType, targetId, fetchPrs],
+  );
+
+  if (!loaded) return null;
+  if (prs.length === 0 && !formOpen) return null;
+
+  return (
+    <section className="border-b border-[var(--card-border)] px-6 py-4">
+      <div className="mb-2 flex items-center justify-between">
+        <h3 className="text-xs font-semibold uppercase tracking-wide text-[var(--muted-foreground)]">
+          Pull Requests ({prs.length})
+        </h3>
+        <button
+          type="button"
+          onClick={() => setFormOpen((v) => !v)}
+          className="flex items-center gap-1 rounded-md border border-[var(--card-border)] px-2 py-1 text-xs font-medium text-[var(--muted-foreground)] transition-colors hover:bg-[var(--card-bg)] hover:text-[var(--foreground)]"
+        >
+          <Plus size={12} />
+          Link PR
+        </button>
+      </div>
+
+      {formOpen && (
+        <form onSubmit={handleSubmit} className="mb-3 flex flex-col gap-1">
+          <div className="flex items-center gap-2">
+            <input
+              type="url"
+              value={url}
+              onChange={(e) => setUrl(e.target.value)}
+              placeholder="https://github.com/owner/repo/pull/123"
+              className="flex-1 rounded border border-[var(--card-border)] bg-transparent px-2 py-1 text-xs text-[var(--foreground)] outline-none focus:border-blue-500"
+              autoFocus
+            />
+            <button
+              type="submit"
+              disabled={submitting || !url.trim()}
+              className="rounded-md bg-blue-500 px-2.5 py-1 text-xs font-medium text-white transition-colors hover:bg-blue-600 disabled:opacity-50"
+            >
+              {submitting ? "Linking…" : "Link"}
+            </button>
+            <button
+              type="button"
+              onClick={() => {
+                setFormOpen(false);
+                setFormError(null);
+                setUrl("");
+              }}
+              className="rounded-md border border-[var(--card-border)] px-2 py-1 text-xs text-[var(--muted-foreground)] hover:text-[var(--foreground)]"
+            >
+              Cancel
+            </button>
+          </div>
+          {formError && (
+            <div className="text-xs text-red-400">{formError}</div>
+          )}
+        </form>
+      )}
+
+      <ul className="flex flex-col gap-1">
+        {prs.map((pr) => {
+          const ci = ciIcon(pr.ciStatus);
+          const review = reviewDecisionChip(pr.reviewDecision);
+          return (
+            <li key={pr.id}>
+              <div
+                role="button"
+                tabIndex={0}
+                onClick={() => handleRowClick(pr)}
+                onKeyDown={(e) => {
+                  if (e.key === "Enter" || e.key === " ") {
+                    e.preventDefault();
+                    handleRowClick(pr);
+                  }
+                }}
+                className="group flex cursor-pointer items-center gap-2 rounded-md border border-transparent px-2 py-1.5 text-sm hover:border-[var(--card-border)] hover:bg-[var(--card-bg)]"
+              >
+                <span
+                  className={`shrink-0 rounded border px-1.5 py-0.5 text-[10px] uppercase tracking-wide ${statePillClasses(pr)}`}
+                >
+                  {stateLabel(pr)}
+                </span>
+                <span className="shrink-0 font-mono text-xs text-[var(--muted-foreground)]">
+                  {pr.id}
+                </span>
+                <span className="min-w-0 flex-1 truncate text-[var(--foreground)]">
+                  {pr.title}
+                </span>
+                {ci && (
+                  <span className={`shrink-0 text-xs ${ci.color}`} title={`CI: ${pr.ciStatus}`}>
+                    {ci.symbol}
+                  </span>
+                )}
+                {review && (
+                  <span
+                    className={`shrink-0 rounded border px-1.5 py-0.5 text-[10px] ${review.cls}`}
+                  >
+                    {review.label}
+                  </span>
+                )}
+                <button
+                  type="button"
+                  onClick={(e) => handleDelete(pr, e)}
+                  className="shrink-0 rounded p-0.5 text-[var(--muted-foreground)] opacity-0 transition-opacity hover:bg-red-500/10 hover:text-red-400 group-hover:opacity-100"
+                  title="Unlink"
+                  aria-label="Unlink PR"
+                >
+                  <X size={12} />
+                </button>
+              </div>
+            </li>
+          );
+        })}
+      </ul>
+    </section>
+  );
+}

package/cloud-runtime/standalone/apps/local/components/tracker/NoteSticker.tsx

@@ -52,6 +52,15 @@ export function NoteSticker({ anchorRef, value, onChange, onClose, onSave }: Not
     },
   });
 
+  useEffect(() => {
+    if (!editor) return;
+
+    const current = (editor.storage as Record<string, any>).markdown?.getMarkdown() ?? "";
+    if (current !== value && !editor.isFocused) {
+      editor.commands.setContent(value);
+    }
+  }, [editor, value]);
+
   // Focus on mount
   useEffect(() => {
     if (editor) {

package/cloud-runtime/standalone/apps/local/components/tracker/RowActionsMenu.tsx

@@ -0,0 +1,228 @@
+"use client";
+
+import React, { useCallback, useEffect, useRef, useState } from "react";
+import { FileText, Hash, MessageSquare, RefreshCw, Tag } from "lucide-react";
+import { LabelPicker } from "./LabelPicker";
+import { PromptPopover } from "./PromptPopover";
+import type { FilterOption } from "./TrackerBoardFilters";
+import type { Participant } from "@/lib/types";
+
+interface LabelEntry {
+  name: string;
+  color: string | null;
+  defined: boolean;
+}
+
+interface Props {
+  anchorRef: React.RefObject<HTMLButtonElement | null>;
+  onClose: () => void;
+  participants: Participant[];
+  labels: LabelEntry[];
+  selectedLabels: string[];
+  statusOptions: FilterOption[];
+  onRecap: () => void;
+  onPrompt: (prompt: string, agentId: string) => void;
+  onEstimate: () => void;
+  onToggleLabel: (label: string) => void;
+  onAddLabel: (name: string) => void;
+  onStatus: (status: string) => void;
+}
+
+type SubPopover = "prompt" | "label" | "status" | null;
+
+export function RowActionsMenu({
+  anchorRef,
+  onClose,
+  participants,
+  labels,
+  selectedLabels,
+  statusOptions,
+  onRecap,
+  onPrompt,
+  onEstimate,
+  onToggleLabel,
+  onAddLabel,
+  onStatus,
+}: Props) {
+  const panelRef = useRef<HTMLDivElement | null>(null);
+  const subPanelRef = useRef<HTMLDivElement | null>(null);
+  const promptItemRef = useRef<HTMLButtonElement | null>(null);
+  const labelItemRef = useRef<HTMLButtonElement | null>(null);
+  const statusItemRef = useRef<HTMLButtonElement | null>(null);
+  const [sub, setSub] = useState<SubPopover>(null);
+  const [pos, setPos] = useState<{ top: number; left: number } | null>(null);
+  const [subTop, setSubTop] = useState<number | null>(null);
+
+  useEffect(() => {
+    const anchor = anchorRef.current;
+    if (!anchor) return;
+    const rect = anchor.getBoundingClientRect();
+    const estWidth = 160;
+    const left = Math.min(
+      Math.max(8, rect.right - estWidth),
+      window.innerWidth - estWidth - 8
+    );
+    const top = rect.bottom + 4;
+    setPos({ top, left });
+  }, [anchorRef]);
+
+  useEffect(() => {
+    const handlePointerDown = (e: PointerEvent) => {
+      if (panelRef.current?.contains(e.target as Node)) return;
+      if (subPanelRef.current?.contains(e.target as Node)) return;
+      if (anchorRef.current?.contains(e.target as Node)) return;
+      onClose();
+    };
+    const handleKeyDown = (e: KeyboardEvent) => {
+      if (e.key === "Escape") {
+        if (sub) setSub(null);
+        else onClose();
+      }
+    };
+    document.addEventListener("pointerdown", handlePointerDown);
+    document.addEventListener("keydown", handleKeyDown);
+    return () => {
+      document.removeEventListener("pointerdown", handlePointerDown);
+      document.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [onClose, anchorRef, sub]);
+
+  const toggleSub = useCallback((next: SubPopover) => {
+    setSub((current) => (current === next ? null : next));
+  }, []);
+
+  useEffect(() => {
+    if (!sub) {
+      setSubTop(null);
+      return;
+    }
+    const ref =
+      sub === "prompt" ? promptItemRef : sub === "label" ? labelItemRef : statusItemRef;
+    const rect = ref.current?.getBoundingClientRect();
+    if (rect) setSubTop(rect.top);
+  }, [sub]);
+
+  const actionButtonClass =
+    "flex w-full items-center gap-2 rounded-lg px-2.5 py-1.5 text-left text-[11px] font-medium text-[var(--muted-foreground)] transition-colors hover:bg-[var(--background)] hover:text-[var(--foreground)]";
+
+  if (!pos) return null;
+
+  return (
+    <>
+      <div
+        ref={panelRef}
+        className="fixed z-[60] flex w-40 flex-col gap-0.5 rounded-xl border border-[var(--card-border)] bg-[var(--card-bg)] p-1 shadow-2xl"
+        style={{ top: pos.top, left: pos.left }}
+        onClick={(e) => e.stopPropagation()}
+      >
+        <button
+          type="button"
+          className={actionButtonClass}
+          onClick={() => {
+            onRecap();
+            onClose();
+          }}
+          title="Recap this ticket"
+        >
+          <FileText size={12} />
+          Recap
+        </button>
+        <button
+          ref={promptItemRef}
+          type="button"
+          className={`${actionButtonClass} ${sub === "prompt" ? "bg-[var(--background)] text-[var(--foreground)]" : ""}`}
+          onClick={() => toggleSub("prompt")}
+          title="Send prompt"
+        >
+          <MessageSquare size={12} />
+          Prompt
+        </button>
+        <button
+          type="button"
+          className={actionButtonClass}
+          onClick={() => {
+            onEstimate();
+            onClose();
+          }}
+          title="Ask the LLM to size this ticket"
+        >
+          <Hash size={12} />
+          Estimate
+        </button>
+        <button
+          ref={labelItemRef}
+          type="button"
+          className={`${actionButtonClass} ${sub === "label" ? "bg-[var(--background)] text-[var(--foreground)]" : ""}`}
+          onClick={() => toggleSub("label")}
+          title="Label"
+        >
+          <Tag size={12} />
+          Label
+        </button>
+        <button
+          ref={statusItemRef}
+          type="button"
+          className={`${actionButtonClass} ${sub === "status" ? "bg-[var(--background)] text-[var(--foreground)]" : ""}`}
+          onClick={() => toggleSub("status")}
+          title="Change status"
+        >
+          <RefreshCw size={12} />
+          Status
+        </button>
+      </div>
+      {sub && (
+        <div
+          ref={subPanelRef}
+          className="fixed z-[60] rounded-xl border border-[var(--card-border)] bg-[var(--card-bg)] p-2 shadow-lg backdrop-blur-sm"
+          style={(() => {
+            const menuWidth = 160;
+            const subWidth = sub === "prompt" ? 340 : 200;
+            const rightEdge = pos.left + menuWidth + 4;
+            const fitsRight = rightEdge + subWidth <= window.innerWidth - 8;
+            const left = fitsRight
+              ? rightEdge
+              : Math.max(8, pos.left - subWidth - 4);
+            return { top: subTop ?? pos.top, left };
+          })()}
+          onClick={(e) => e.stopPropagation()}
+        >
+          {sub === "prompt" && (
+            <PromptPopover
+              count={1}
+              participants={participants}
+              onSend={(prompt, agentId) => {
+                onPrompt(prompt, agentId);
+                onClose();
+              }}
+            />
+          )}
+          {sub === "label" && (
+            <LabelPicker
+              labels={labels}
+              selectedLabels={selectedLabels}
+              onToggle={onToggleLabel}
+              onAdd={onAddLabel}
+            />
+          )}
+          {sub === "status" && (
+            <div className="flex max-h-48 w-44 flex-col overflow-y-auto">
+              {statusOptions.map((opt) => (
+                <button
+                  key={opt.value}
+                  type="button"
+                  className="w-full rounded-lg px-3 py-1.5 text-left text-xs text-[var(--muted-foreground)] transition-colors hover:bg-[var(--background)] hover:text-[var(--foreground)]"
+                  onClick={() => {
+                    onStatus(opt.value);
+                    onClose();
+                  }}
+                >
+                  {opt.label}
+                </button>
+              ))}
+            </div>
+          )}
+        </div>
+      )}
+    </>
+  );
+}