@agent-native/core 0.79.27 → 0.80.1

package/corpus/templates/analytics/app/pages/adhoc/sql-dashboard/index.tsx

@@ -17,7 +17,6 @@ import {
   useDroppable,
   DndContext,
   DragOverlay,
-  pointerWithin,
   PointerSensor,
   useSensor,
   useSensors,
@@ -106,9 +105,11 @@ import { DashboardSkeleton } from "../DashboardSkeleton";
 import {
   availableDropSlotIdsForPanel,
   buildDashboardPanelGroups,
+  columnExpansionForDropSlot,
   distanceFromPointerToRect,
   dropSlotId,
   movePanelToDropSlot,
+  preferredDropSlotId,
   readDropSlot,
   removePanelFromLayout,
   sameDropSlot,
@@ -427,6 +428,7 @@ export default function SqlDashboardPage() {
   const navigate = useNavigate();
   const dashboardId = searchParams.get("id") || routeId;
   const reportScreenshot = searchParams.get("reportScreenshot") === "1";
+  const reportSettingsRequested = searchParams.get("reportSettings") === "1";
   const reportPanelLimit = reportScreenshot
     ? parseReportPanelLimit(searchParams.get("reportPanelLimit"))
     : null;
@@ -977,6 +979,11 @@ export default function SqlDashboardPage() {
       const slot = readDropSlot(event.over?.data.current);
       if (!slot) return;
       const panelId = String(event.active.id);
+      const columnExpansion = columnExpansionForDropSlot(
+        buildDashboardPanelGroups(dashboard.panels, dashboardColumns),
+        panelId,
+        slot,
+      );
       const nextPanels = movePanelToDropSlot(
         dashboard.panels,
         panelId,
@@ -984,9 +991,19 @@ export default function SqlDashboardPage() {
         dashboardColumns,
       );
       if (nextPanels === dashboard.panels) return;
+      const persistedPanels = columnExpansion?.sectionPanelId
+        ? nextPanels.map((panel) =>
+            panel.id === columnExpansion.sectionPanelId
+              ? { ...panel, columns: columnExpansion.columns }
+              : panel,
+          )
+        : nextPanels;
       persist({
         ...dashboard,
-        panels: nextPanels,
+        ...(columnExpansion && !columnExpansion.sectionPanelId
+          ? { columns: columnExpansion.columns }
+          : {}),
+        panels: persistedPanels,
       });
     },
     [dashboard, dashboardColumns, persist],
@@ -1033,6 +1050,28 @@ export default function SqlDashboardPage() {
     return out;
   }, [dashboard?.filters, searchParams]);
 
+  useEffect(() => {
+    if (!reportScreenshot && reportSettingsRequested) {
+      setEmailReportOpen(true);
+    }
+  }, [reportScreenshot, reportSettingsRequested]);
+
+  const handleEmailReportOpenChange = useCallback(
+    (open: boolean) => {
+      setEmailReportOpen(open);
+      if (open || !reportSettingsRequested) return;
+      setSearchParams(
+        (prev) => {
+          const next = new URLSearchParams(prev);
+          next.delete("reportSettings");
+          return next;
+        },
+        { replace: true },
+      );
+    },
+    [reportSettingsRequested, setSearchParams],
+  );
+
   // Distinct tab values across panels in declaration order. When this is
   // non-empty the dashboard renders a tab strip and filters panels by tab.
   const tabs = useMemo<string[]>(() => {
@@ -1131,36 +1170,43 @@ export default function SqlDashboardPage() {
 
       if (droppableContainers.length === 0) return [];
 
-      const exactCollisions = pointerWithin({
-        ...args,
-        droppableContainers,
-      });
-      if (exactCollisions.length > 0) return exactCollisions;
-
       if (!args.pointerCoordinates) return [];
 
-      let closestId: string | null = null;
-      let closestContainer: (typeof droppableContainers)[number] | null = null;
-      let closestValue = Number.MAX_VALUE;
-      for (const droppableContainer of droppableContainers) {
+      const candidates = droppableContainers.flatMap((droppableContainer) => {
         const rect = args.droppableRects.get(droppableContainer.id);
-        if (!rect) continue;
-
-        const value = distanceFromPointerToRect(args.pointerCoordinates, rect);
-        if (value < closestValue) {
-          closestId = String(droppableContainer.id);
-          closestContainer = droppableContainer;
-          closestValue = value;
-        }
-      }
-
-      return closestId && closestContainer
+        const slot = readDropSlot(droppableContainer.data.current);
+        if (!rect || !slot) return [];
+        return [
+          {
+            id: String(droppableContainer.id),
+            slot,
+            rect,
+          },
+        ];
+      });
+      const preferredId = preferredDropSlotId(
+        args.pointerCoordinates,
+        candidates,
+      );
+      const preferredContainer =
+        preferredId === null
+          ? null
+          : (droppableContainers.find(
+              (container) => String(container.id) === preferredId,
+            ) ?? null);
+      const preferredRect =
+        preferredContainer && args.droppableRects.get(preferredContainer.id);
+
+      return preferredId && preferredContainer && preferredRect
         ? [
             {
-              id: closestId,
+              id: preferredId,
               data: {
-                droppableContainer: closestContainer,
-                value: closestValue,
+                droppableContainer: preferredContainer,
+                value: distanceFromPointerToRect(
+                  args.pointerCoordinates,
+                  preferredRect,
+                ),
               },
             },
           ]
@@ -1453,7 +1499,7 @@ export default function SqlDashboardPage() {
         {dashboardId ? (
           <EmailReportDialog
             open={emailReportOpen}
-            onOpenChange={setEmailReportOpen}
+            onOpenChange={handleEmailReportOpenChange}
             dashboardId={dashboardId}
             dashboardName={dashboard.name}
             filters={currentReportFilters}
@@ -1565,7 +1611,7 @@ export default function SqlDashboardPage() {
           placeholder={t("sqlDashboard.addDescriptionPlaceholder")}
           className="text-sm resize-y"
         />
-      ) : dashboard.description ? (
+      ) : !reportScreenshot && dashboard.description ? (
         <button
           className={
             canEdit
@@ -1637,12 +1683,14 @@ export default function SqlDashboardPage() {
       )}
 
       {/* Filters */}
-      {dashboard.filters && dashboard.filters.length > 0 && (
-        <DashboardFilterBar
-          filters={dashboard.filters}
-          onSaveView={canEdit ? handleSaveView : undefined}
-        />
-      )}
+      {!reportScreenshot &&
+        dashboard.filters &&
+        dashboard.filters.length > 0 && (
+          <DashboardFilterBar
+            filters={dashboard.filters}
+            onSaveView={canEdit ? handleSaveView : undefined}
+          />
+        )}
 
       {/* Panels grid */}
       {dashboard.panels.length === 0 ? (

package/corpus/templates/analytics/app/pages/sessions/SessionDetailPage.tsx

@@ -1269,6 +1269,8 @@ function visitorLabel(
   recording: SessionRecordingSummary,
   t: ReturnType<typeof useT>,
 ): string {
+  const email = emailLike(recording.userId) || emailLike(recording.userKey);
+  if (email) return email;
   return (
     recording.userId ||
     recording.userKey ||
@@ -1277,6 +1279,11 @@ function visitorLabel(
   );
 }
 
+function emailLike(value: string | null): string | null {
+  if (!value?.includes("@")) return null;
+  return value;
+}
+
 function formatDuration(ms: number | null): string {
   if (!ms || !Number.isFinite(ms) || ms <= 0) return "0s";
   const seconds = Math.round(ms / 1000);

package/corpus/templates/analytics/app/pages/sessions/SessionsPage.tsx

@@ -1,16 +1,25 @@
 import { CodeSurface } from "@agent-native/core/blocks";
-import { useActionQuery, useT } from "@agent-native/core/client";
+import {
+  useActionQuery,
+  useBuilderConnectFlow,
+  useBuilderStatus,
+  useT,
+} from "@agent-native/core/client";
 import {
   IconChevronDown,
+  IconCheck,
+  IconCloud,
   IconCode,
   IconExternalLink,
   IconFilter,
+  IconLoader2,
   IconPlayerPlay,
   IconRefresh,
   IconSearch,
+  IconServer,
 } from "@tabler/icons-react";
 import { useMemo, useState } from "react";
-import { useNavigate, useSearchParams } from "react-router";
+import { Link, useNavigate, useSearchParams } from "react-router";
 
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
@@ -24,6 +33,7 @@ import {
   SelectValue,
 } from "@/components/ui/select";
 import { Skeleton } from "@/components/ui/skeleton";
+import { useReplayStorageStatus } from "@/hooks/use-replay-storage-status";
 import { cn } from "@/lib/utils";
 
 type ReplayRange = "24h" | "7d" | "30d" | "90d" | "all";
@@ -294,46 +304,137 @@ export default function SessionsPage() {
 
 function EmptySessionsState() {
   const t = useT();
+  const storageStatus = useReplayStorageStatus();
+  const showStorageHint =
+    !storageStatus.isLoading && !storageStatus.data?.configured;
   return (
-    <div className="grid min-h-[380px] gap-6 p-6 lg:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)] lg:p-8">
-      <div className="flex flex-col justify-center gap-3">
-        <div className="flex h-10 w-10 items-center justify-center rounded-md border bg-muted/40">
-          <IconPlayerPlay className="h-5 w-5 text-primary" />
+    <div className="p-6 lg:p-8">
+      {showStorageHint ? <ReplayStorageHint /> : null}
+      <div className="grid min-h-[380px] gap-6 lg:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)]">
+        <div className="flex flex-col justify-center gap-3">
+          <div className="flex h-10 w-10 items-center justify-center rounded-md border bg-muted/40">
+            <IconPlayerPlay className="h-5 w-5 text-primary" />
+          </div>
+          <div className="space-y-2">
+            <h2 className="text-lg font-semibold">
+              {t("sessions.noSessions")}
+            </h2>
+            <p className="max-w-xl text-sm text-muted-foreground">
+              {t("sessions.noSessionsDescription")}
+            </p>
+          </div>
         </div>
-        <div className="space-y-2">
-          <h2 className="text-lg font-semibold">{t("sessions.noSessions")}</h2>
-          <p className="max-w-xl text-sm text-muted-foreground">
-            {t("sessions.noSessionsDescription")}
-          </p>
+        <div className="analytics-session-snippet overflow-hidden rounded-md border bg-muted/30">
+          <div className="flex items-center justify-between gap-3 border-b px-4 py-3">
+            <div className="flex min-w-0 items-center gap-2 text-sm font-medium">
+              <IconCode className="h-4 w-4 text-muted-foreground" />
+              <span className="truncate">
+                {t("sessions.installSnippetTitle")}
+              </span>
+            </div>
+            <Button
+              asChild
+              variant="ghost"
+              size="sm"
+              className="h-7 px-2 text-xs"
+            >
+              <a
+                href={SESSION_REPLAY_DOCS_URL}
+                target="_blank"
+                rel="noreferrer"
+              >
+                {t("common.docs")}
+                <IconExternalLink className="h-3.5 w-3.5" />
+              </a>
+            </Button>
+          </div>
+          <CodeSurface
+            code={SESSION_REPLAY_SNIPPET}
+            language="typescript"
+            maxLines={null}
+            showLanguageLabel={false}
+            className="mt-0"
+          />
         </div>
       </div>
-      <div className="analytics-session-snippet overflow-hidden rounded-md border bg-muted/30">
-        <div className="flex items-center justify-between gap-3 border-b px-4 py-3">
-          <div className="flex min-w-0 items-center gap-2 text-sm font-medium">
-            <IconCode className="h-4 w-4 text-muted-foreground" />
-            <span className="truncate">
-              {t("sessions.installSnippetTitle")}
-            </span>
+    </div>
+  );
+}
+
+function ReplayStorageHint() {
+  const t = useT();
+  const storageStatus = useReplayStorageStatus();
+  const builderStatus = useBuilderStatus();
+  const builderConnect = useBuilderConnectFlow({
+    popupUrl:
+      builderStatus.status?.cliAuthUrl ?? builderStatus.status?.connectUrl,
+    trackingSource: "analytics_sessions_storage_hint",
+    trackingFlow: "replay_storage",
+    onConnected: async () => {
+      await Promise.all([storageStatus.refetch(), builderStatus.refetch()]);
+    },
+  });
+
+  const builderConnected = Boolean(
+    builderConnect.configured ||
+    builderStatus.status?.configured ||
+    storageStatus.data?.builderConfigured,
+  );
+  const builderStatusLoading =
+    storageStatus.isLoading ||
+    builderStatus.loading ||
+    !builderConnect.hasFetchedStatus;
+
+  return (
+    <div className="mb-6 flex flex-col gap-4 rounded-md border border-primary/30 bg-primary/5 p-4 sm:flex-row sm:items-center sm:justify-between">
+      <div className="flex min-w-0 items-start gap-3">
+        <div className="flex h-9 w-9 shrink-0 items-center justify-center rounded-md bg-background text-primary">
+          <IconCloud className="h-5 w-5" />
+        </div>
+        <div className="min-w-0">
+          <div className="text-sm font-medium">
+            {t("sessions.storageSetupTitle")}
           </div>
-          <Button
-            asChild
-            variant="ghost"
-            size="sm"
-            className="h-7 px-2 text-xs"
-          >
-            <a href={SESSION_REPLAY_DOCS_URL} target="_blank" rel="noreferrer">
-              {t("common.docs")}
-              <IconExternalLink className="h-3.5 w-3.5" />
-            </a>
-          </Button>
+          <p className="mt-0.5 text-xs text-muted-foreground">
+            {t("sessions.storageSetupDescription")}
+          </p>
         </div>
-        <CodeSurface
-          code={SESSION_REPLAY_SNIPPET}
-          language="typescript"
-          maxLines={null}
-          showLanguageLabel={false}
-          className="mt-0"
-        />
+      </div>
+      <div className="flex shrink-0 flex-wrap items-center gap-3">
+        <Button
+          type="button"
+          size="sm"
+          className="shrink-0"
+          onClick={() =>
+            builderConnect.start({
+              trackingSource: "analytics_sessions_storage_hint",
+              trackingFlow: "replay_storage",
+            })
+          }
+          disabled={
+            builderConnect.connecting ||
+            builderStatusLoading ||
+            builderConnected
+          }
+        >
+          {builderConnect.connecting ? (
+            <IconLoader2 className="h-4 w-4 animate-spin" />
+          ) : builderConnected ? (
+            <IconCheck className="h-4 w-4" />
+          ) : (
+            <IconExternalLink className="h-4 w-4" />
+          )}
+          {builderConnected
+            ? t("sessions.storageConnected")
+            : t("sessions.connectBuilder")}
+        </Button>
+        <Link
+          to="/settings#replay-storage"
+          className="inline-flex items-center gap-1.5 text-xs font-medium text-muted-foreground underline underline-offset-2 hover:text-foreground"
+        >
+          <IconServer className="h-3.5 w-3.5" />
+          {t("sessions.configureS3")}
+        </Link>
       </div>
     </div>
   );
@@ -374,6 +475,8 @@ function visitorLabel(
   recording: SessionRecordingSummary,
   t: ReturnType<typeof useT>,
 ): string {
+  const email = emailLike(recording.userId) || emailLike(recording.userKey);
+  if (email) return email;
   return (
     recording.userId ||
     recording.userKey ||
@@ -382,6 +485,11 @@ function visitorLabel(
   );
 }
 
+function emailLike(value: string | null): string | null {
+  if (!value?.includes("@")) return null;
+  return value;
+}
+
 function shortId(value: string): string {
   return value.length > 22
     ? `${value.slice(0, 10)}...${value.slice(-8)}`

package/corpus/templates/analytics/changelog/2026-06-28-ask-tab-now-matches-the-darker-app-background.md

@@ -0,0 +1,6 @@
+---
+type: fixed
+date: 2026-06-28
+---
+
+The Ask tab now matches the darker background used across the rest of Analytics.

package/corpus/templates/analytics/changelog/2026-06-28-dashboard-email-reports-now-use-cleaner-light-mode-snapshots.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-06-28
+---
+
+Dashboard email reports now use cleaner light-mode snapshots with direct subscription settings links.

package/corpus/templates/analytics/changelog/2026-06-28-left-sidebar-collapses-into-an-animated-icon-rail.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-06-28
+---
+
+The left sidebar now collapses into an animated icon rail with quieter footer controls.

package/corpus/templates/analytics/changelog/2026-06-28-sessions-now-show-only-signed-in-recordings-with-playable-re.md

@@ -0,0 +1,6 @@
+---
+type: fixed
+date: 2026-06-28
+---
+
+Sessions now show only signed-in recordings with playable replay events.

package/corpus/templates/analytics/changelog/2026-06-29-analytics-agents-can-now-place-new-charts-into-requested-das.md

@@ -0,0 +1,6 @@
+---
+type: fixed
+date: 2026-06-29
+---
+
+Analytics agents can now place new charts into requested dashboard rows.

package/corpus/templates/analytics/changelog/2026-06-29-analytics-queries-now-report-failed-source-query-errors-inst.md

@@ -0,0 +1,6 @@
+---
+type: fixed
+date: 2026-06-29
+---
+
+Analytics queries now report failed source-query errors instead of falling back to a vague no-data message.

package/corpus/templates/analytics/changelog/2026-06-29-charts-can-now-be-dropped-between-full-dashboard-rows-to-cre.md

@@ -0,0 +1,6 @@
+---
+type: fixed
+date: 2026-06-29
+---
+
+Charts can now be dropped between full dashboard rows to create wider rows.

package/corpus/templates/analytics/changelog/2026-06-29-dashboard-email-reports-include-the-full-dashboard-image-wit.md

@@ -0,0 +1,6 @@
+---
+type: fixed
+date: 2026-06-29
+---
+
+Dashboard email reports include the full dashboard image without an extra image border.

package/corpus/templates/analytics/changelog/2026-06-29-main-surface-border-reaches-the-top.md

@@ -0,0 +1,6 @@
+---
+type: fixed
+date: 2026-06-29
+---
+
+The main dashboard surface border now reaches the top edge and keeps its rounded corners.

package/corpus/templates/analytics/changelog/2026-06-29-session-replay-now-records-playable-sessions-in-production-a.md

@@ -0,0 +1,6 @@
+---
+type: fixed
+date: 2026-06-29
+---
+
+Session replay now records playable sessions in production and shows them to your whole workspace

package/corpus/templates/analytics/changelog/2026-06-29-set-up-session-replay-storage-from-settings-connect-builder-.md

@@ -0,0 +1,6 @@
+---
+type: added
+date: 2026-06-29
+---
+
+Set up session replay storage from settings: connect Builder.io or add S3-compatible storage

package/corpus/templates/analytics/scripts/cleanup-empty-session-recordings.ts

@@ -0,0 +1,102 @@
+#!/usr/bin/env tsx
+
+/**
+ * One-time maintenance for session replay rows created before the capture fix.
+ *
+ * Two jobs:
+ *  1. Delete empty "shell" recordings — rows that were created on ingest but
+ *     never stored any replay data (chunk_count = 0, event_count = 0, and no
+ *     session_replay_chunks rows). These exist because, before the ingest
+ *     credential-scope fix, blob storage failed in production (no resolvable
+ *     upload provider) and left unplayable husks behind. They are always
+ *     filtered out of /sessions, so this is pure DB hygiene.
+ *  2. Backfill visibility "private" -> "org" for org-scoped recordings, so
+ *     existing recordings follow the same org-visible model new ingests now use
+ *     (teammates in the org can see them, not only the key owner).
+ *
+ * SAFE BY DEFAULT: dry-run unless you pass --apply. This connects to whatever
+ * DATABASE_URL the app is configured with, so double-check the target before
+ * using --apply against production.
+ *
+ *   pnpm --filter analytics exec tsx scripts/cleanup-empty-session-recordings.ts            # dry run
+ *   pnpm --filter analytics exec tsx scripts/cleanup-empty-session-recordings.ts --apply    # mutate
+ */
+
+import path from "node:path";
+import { pathToFileURL } from "node:url";
+
+import { and, eq, isNotNull, sql } from "drizzle-orm";
+
+import { getDb, schema } from "../server/db/index";
+import migrations from "../server/plugins/db";
+
+const apply = process.argv.includes("--apply");
+
+const emptyShellCondition = and(
+  eq(schema.sessionRecordings.chunkCount, 0),
+  eq(schema.sessionRecordings.eventCount, 0),
+  sql`not exists (
+    select 1 from ${schema.sessionReplayChunks}
+    where ${schema.sessionReplayChunks.recordingId} = ${schema.sessionRecordings.id}
+  )`,
+);
+
+const orgPrivateCondition = and(
+  isNotNull(schema.sessionRecordings.orgId),
+  eq(schema.sessionRecordings.visibility, "private"),
+);
+
+async function countWhere(condition: unknown): Promise<number> {
+  const db = getDb() as any;
+  const rows = await db
+    .select({ n: sql<number>`count(*)::int` })
+    .from(schema.sessionRecordings)
+    .where(condition);
+  return Number(rows[0]?.n ?? 0);
+}
+
+async function main() {
+  await migrations({});
+  const db = getDb() as any;
+
+  const emptyShells = await countWhere(emptyShellCondition);
+  const orgPrivate = await countWhere(orgPrivateCondition);
+
+  console.log(`[cleanup] mode: ${apply ? "APPLY (mutating)" : "dry-run"}`);
+  console.log(`[cleanup] empty shell recordings to delete: ${emptyShells}`);
+  console.log(
+    `[cleanup] org-scoped recordings to make org-visible: ${orgPrivate}`,
+  );
+
+  if (!apply) {
+    console.log("[cleanup] dry-run only — re-run with --apply to mutate.");
+    return;
+  }
+
+  // Backfill visibility first so we don't widen rows we're about to delete.
+  await db
+    .update(schema.sessionRecordings)
+    .set({ visibility: "org" })
+    .where(orgPrivateCondition);
+  console.log(
+    `[cleanup] backfilled ${orgPrivate} recordings to visibility=org`,
+  );
+
+  await db.delete(schema.sessionRecordings).where(emptyShellCondition);
+  console.log(`[cleanup] deleted ${emptyShells} empty shell recordings`);
+}
+
+function isDirectRun(): boolean {
+  const entrypoint = process.argv[1];
+  return Boolean(
+    entrypoint &&
+    import.meta.url === pathToFileURL(path.resolve(entrypoint)).href,
+  );
+}
+
+if (isDirectRun()) {
+  main().catch((error) => {
+    console.error(error);
+    process.exit(1);
+  });
+}