@agent-native/core 0.78.8 → 0.79.0

package/corpus/templates/analytics/app/i18n-data.ts

@@ -351,6 +351,7 @@ const enUS = {
     panelOptions: "Panel options",
     fullScreen: "Full screen",
     refresh: "Refresh",
+    refreshing: "Refreshing...",
     downloadCsv: "Download CSV",
     viewSql: "View SQL",
     dragToReorder: "Drag to reorder",
@@ -409,6 +410,7 @@ const enUS = {
     reportSubscriptionSaved: "Email report subscription saved.",
     reportSubscriptionDeleted: "Email report subscription deleted.",
     reportSent: "Dashboard report sent.",
+    reportQueued: "Dashboard report queued.",
     reportSubscriptionSaveFailed: "Couldn't save subscription: {{message}}",
     reportSubscriptionDeleteFailed: "Couldn't delete subscription: {{message}}",
     reportSendFailed: "Couldn't send report: {{message}}",
@@ -737,6 +739,11 @@ const enUS = {
     description:
       "Review first-party browser sessions and replay recordings captured by Agent Native Analytics.",
     filters: "Filters",
+    segmentFilters: "Segment filters",
+    sessionPlaylist: "Session playlist",
+    userFilters: "User filters",
+    eventFilters: "Event filters",
+    anyActivity: "Any activity",
     filtersDescription:
       "Filters are stored in the URL so the agent and shared links see the same session list.",
     refresh: "Refresh",
@@ -753,6 +760,8 @@ const enUS = {
     last90d: "Last 90d",
     allTime: "All time",
     showing: "{{count}} sessions",
+    eventCountCompact: "{{count}} events",
+    pageCountCompact: "{{count}} pages",
     truncated: "Showing the first replay events only.",
     session: "Session",
     visitor: "Visitor",
@@ -775,18 +784,25 @@ const enUS = {
     installSnippetTitle: "Add session replay",
     backToSessions: "Back to sessions",
     askAgent: "Ask agent about this session",
+    askSessionTitle: "Ask about this session",
+    askSessionDescription:
+      "Send a focused prompt to the Analytics agent with this replay attached as context.",
+    askSessionPlaceholder: "What happened in this session?",
     replayPlayer: "Replay player",
     replayLoading: "Loading replay...",
-    replayUnavailable: "No replay chunks for this session",
+    replayUnavailable: "No playable replay for this session",
     replayUnavailableDescription:
-      "This recording has metadata, but no playable replay chunks were found.",
-    unavailableChunks: "{{count}} chunks could not be loaded.",
+      "This recording has metadata, but no playable replay events were found.",
+    unavailableChunks: "{{count}} replay segments could not be loaded.",
     replayChunks: "Replay chunks",
     replayChunksDescription:
       "Scoped chunks used to reconstruct this replay. Provider URLs stay private.",
     chunkAndEventCount: "{{chunks}} chunks, {{events}} replay events",
+    replayEventCount: "{{events}} replay events",
     timeline: "Event timeline",
+    replayTimeline: "Replay timeline",
     timelineDescription: "Showing the first {{count}} events in this session.",
+    noTimelineEvents: "No timeline markers found",
     sequence: "Sequence",
     size: "Size",
     checksum: "Checksum",
@@ -800,8 +816,13 @@ const enUS = {
     restart: "Restart",
     play: "Play",
     pause: "Pause",
+    skipBack: "Back 5 seconds",
+    skipForward: "Forward 5 seconds",
+    skipInactive: "Skip inactivity",
+    skipInactiveOn: "Skipping inactive gaps",
+    skipInactiveOff: "Playing inactive gaps",
     loadFailed: "Couldn't load session replay: {{message}}",
-    noReplayEvents: "No rrweb events were found in the replay chunks.",
+    noReplayEvents: "No rrweb events were found for this replay.",
     chunkCount: "{{count}} replay chunks",
     url: "URL",
     path: "Path",
@@ -6529,22 +6550,237 @@ const translatedAnalyticsDebtCorrections = {
       team: "الفريق - Analytics",
       tool: "الأداة - Analytics",
     },
+    sessions: {
+      segmentFilters: "عوامل تصفية الشرائح",
+      sessionPlaylist: "قائمة تشغيل الجلسات",
+      userFilters: "عوامل تصفية المستخدم",
+      eventFilters: "عوامل تصفية الأحداث",
+      anyActivity: "أي نشاط",
+      eventCountCompact: "{{count}} حدث",
+      pageCountCompact: "{{count}} صفحة",
+      askSessionTitle: "اسأل عن هذه الجلسة",
+      askSessionDescription:
+        "أرسل مطالبة مركزة إلى وكيل Analytics مع إرفاق هذا التسجيل كسياق.",
+      askSessionPlaceholder: "ماذا حدث في هذه الجلسة؟",
+      replayTimeline: "خط إعادة التشغيل الزمني",
+      noTimelineEvents: "لم يتم العثور على علامات في الخط الزمني",
+      skipBack: "الرجوع 5 ثوانٍ",
+      skipForward: "التقدم 5 ثوانٍ",
+      skipInactive: "تخطي فترات الخمول",
+      skipInactiveOn: "يتم تخطي الفجوات الخاملة",
+      skipInactiveOff: "تشغيل الفجوات الخاملة",
+    },
     sqlDashboard: {
       addDescriptionPlaceholder: "أضف وصفًا",
       collapseFilters: "طي عوامل التصفية",
+      refreshing: "جارٍ التحديث...",
     },
   },
   "de-DE": {
     routeTitles: {
       team: "Team-Bereich - Analytics",
     },
+    sessions: {
+      segmentFilters: "Segmentfilter",
+      sessionPlaylist: "Sitzungs-Playlist",
+      userFilters: "Benutzerfilter",
+      eventFilters: "Ereignisfilter",
+      anyActivity: "Beliebige Aktivität",
+      eventCountCompact: "{{count}} Ereignisse",
+      pageCountCompact: "{{count}} Seiten",
+      askSessionTitle: "Zu dieser Sitzung fragen",
+      askSessionDescription:
+        "Sende dem Analytics-Agenten eine gezielte Eingabe mit dieser Wiedergabe als Kontext.",
+      askSessionPlaceholder: "Was ist in dieser Sitzung passiert?",
+      replayTimeline: "Wiedergabe-Zeitachse",
+      noTimelineEvents: "Keine Zeitachsenmarker gefunden",
+      skipBack: "5 Sekunden zurück",
+      skipForward: "5 Sekunden vor",
+      skipInactive: "Inaktivität überspringen",
+      skipInactiveOn: "Inaktive Lücken werden übersprungen",
+      skipInactiveOff: "Inaktive Lücken werden abgespielt",
+    },
+    sqlDashboard: {
+      refreshing: "Wird aktualisiert...",
+    },
+  },
+  "es-ES": {
+    sessions: {
+      segmentFilters: "Filtros de segmento",
+      sessionPlaylist: "Lista de sesiones",
+      userFilters: "Filtros de usuario",
+      eventFilters: "Filtros de eventos",
+      anyActivity: "Cualquier actividad",
+      eventCountCompact: "{{count}} eventos",
+      pageCountCompact: "{{count}} páginas",
+      askSessionTitle: "Preguntar sobre esta sesión",
+      askSessionDescription:
+        "Envía una pregunta enfocada al agente de Analytics con esta reproducción como contexto.",
+      askSessionPlaceholder: "¿Qué pasó en esta sesión?",
+      replayTimeline: "Línea de tiempo de reproducción",
+      noTimelineEvents: "No se encontraron marcadores de línea de tiempo",
+      skipBack: "Retroceder 5 segundos",
+      skipForward: "Avanzar 5 segundos",
+      skipInactive: "Omitir inactividad",
+      skipInactiveOn: "Omitiendo pausas inactivas",
+      skipInactiveOff: "Reproduciendo pausas inactivas",
+    },
+    sqlDashboard: {
+      refreshing: "Actualizando...",
+    },
   },
   "fr-FR": {
     routeTitles: {
       analyses: "Liste des analyses - Analytics",
     },
+    sessions: {
+      segmentFilters: "Filtres de segment",
+      sessionPlaylist: "Liste de sessions",
+      userFilters: "Filtres utilisateur",
+      eventFilters: "Filtres d'événement",
+      anyActivity: "Toute activité",
+      eventCountCompact: "{{count}} événements",
+      pageCountCompact: "{{count}} pages",
+      askSessionTitle: "Poser une question sur cette session",
+      askSessionDescription:
+        "Envoyez une question ciblée à l'agent Analytics avec cette relecture en contexte.",
+      askSessionPlaceholder: "Que s'est-il passé dans cette session ?",
+      replayTimeline: "Chronologie de relecture",
+      noTimelineEvents: "Aucun marqueur de chronologie trouvé",
+      skipBack: "Reculer de 5 secondes",
+      skipForward: "Avancer de 5 secondes",
+      skipInactive: "Ignorer l'inactivité",
+      skipInactiveOn: "Les périodes inactives sont ignorées",
+      skipInactiveOff: "Les périodes inactives sont lues",
+    },
     sqlDashboard: {
       formatSql: "Formater SQL",
+      refreshing: "Actualisation...",
+    },
+  },
+  "hi-IN": {
+    sessions: {
+      segmentFilters: "सेगमेंट फ़िल्टर",
+      sessionPlaylist: "सत्र प्लेलिस्ट",
+      userFilters: "उपयोगकर्ता फ़िल्टर",
+      eventFilters: "इवेंट फ़िल्टर",
+      anyActivity: "कोई भी गतिविधि",
+      eventCountCompact: "{{count}} इवेंट",
+      pageCountCompact: "{{count}} पेज",
+      askSessionTitle: "इस सत्र के बारे में पूछें",
+      askSessionDescription:
+        "इस रीप्ले को संदर्भ के रूप में जोड़कर Analytics एजेंट को केंद्रित प्रॉम्प्ट भेजें।",
+      askSessionPlaceholder: "इस सत्र में क्या हुआ?",
+      replayTimeline: "रीप्ले टाइमलाइन",
+      noTimelineEvents: "कोई टाइमलाइन मार्कर नहीं मिला",
+      skipBack: "5 सेकंड पीछे",
+      skipForward: "5 सेकंड आगे",
+      skipInactive: "निष्क्रियता छोड़ें",
+      skipInactiveOn: "निष्क्रिय अंतराल छोड़े जा रहे हैं",
+      skipInactiveOff: "निष्क्रिय अंतराल चलाए जा रहे हैं",
+    },
+    sqlDashboard: {
+      refreshing: "रीफ़्रेश हो रहा है...",
+    },
+  },
+  "ja-JP": {
+    sessions: {
+      segmentFilters: "セグメントフィルター",
+      sessionPlaylist: "セッションプレイリスト",
+      userFilters: "ユーザーフィルター",
+      eventFilters: "イベントフィルター",
+      anyActivity: "任意のアクティビティ",
+      eventCountCompact: "{{count}} 件のイベント",
+      pageCountCompact: "{{count}} ページ",
+      askSessionTitle: "このセッションについて質問",
+      askSessionDescription:
+        "このリプレイをコンテキストとして添えて、Analytics エージェントに絞り込んだプロンプトを送信します。",
+      askSessionPlaceholder: "このセッションで何が起きましたか？",
+      replayTimeline: "リプレイタイムライン",
+      noTimelineEvents: "タイムラインマーカーが見つかりません",
+      skipBack: "5 秒戻る",
+      skipForward: "5 秒進む",
+      skipInactive: "非アクティブ時間をスキップ",
+      skipInactiveOn: "非アクティブな間隔をスキップ中",
+      skipInactiveOff: "非アクティブな間隔を再生中",
+    },
+    sqlDashboard: {
+      refreshing: "更新中...",
+    },
+  },
+  "ko-KR": {
+    sessions: {
+      segmentFilters: "세그먼트 필터",
+      sessionPlaylist: "세션 재생 목록",
+      userFilters: "사용자 필터",
+      eventFilters: "이벤트 필터",
+      anyActivity: "모든 활동",
+      eventCountCompact: "{{count}}개 이벤트",
+      pageCountCompact: "{{count}}개 페이지",
+      askSessionTitle: "이 세션에 대해 질문",
+      askSessionDescription:
+        "이 리플레이를 컨텍스트로 첨부해 Analytics 에이전트에 집중된 프롬프트를 보냅니다.",
+      askSessionPlaceholder: "이 세션에서 무슨 일이 있었나요?",
+      replayTimeline: "리플레이 타임라인",
+      noTimelineEvents: "타임라인 마커를 찾지 못했습니다",
+      skipBack: "5초 뒤로",
+      skipForward: "5초 앞으로",
+      skipInactive: "비활성 시간 건너뛰기",
+      skipInactiveOn: "비활성 구간을 건너뛰는 중",
+      skipInactiveOff: "비활성 구간을 재생하는 중",
+    },
+    sqlDashboard: {
+      refreshing: "새로고침 중...",
+    },
+  },
+  "pt-BR": {
+    sessions: {
+      segmentFilters: "Filtros de segmento",
+      sessionPlaylist: "Playlist de sessões",
+      userFilters: "Filtros de usuário",
+      eventFilters: "Filtros de eventos",
+      anyActivity: "Qualquer atividade",
+      eventCountCompact: "{{count}} eventos",
+      pageCountCompact: "{{count}} páginas",
+      askSessionTitle: "Perguntar sobre esta sessão",
+      askSessionDescription:
+        "Envie um prompt focado ao agente de Analytics com este replay como contexto.",
+      askSessionPlaceholder: "O que aconteceu nesta sessão?",
+      replayTimeline: "Linha do tempo do replay",
+      noTimelineEvents: "Nenhum marcador de linha do tempo encontrado",
+      skipBack: "Voltar 5 segundos",
+      skipForward: "Avançar 5 segundos",
+      skipInactive: "Pular inatividade",
+      skipInactiveOn: "Pulando lacunas inativas",
+      skipInactiveOff: "Reproduzindo lacunas inativas",
+    },
+    sqlDashboard: {
+      refreshing: "Atualizando...",
+    },
+  },
+  "zh-CN": {
+    sessions: {
+      segmentFilters: "分段筛选器",
+      sessionPlaylist: "会话播放列表",
+      userFilters: "用户筛选器",
+      eventFilters: "事件筛选器",
+      anyActivity: "任意活动",
+      eventCountCompact: "{{count}} 个事件",
+      pageCountCompact: "{{count}} 个页面",
+      askSessionTitle: "询问此会话",
+      askSessionDescription:
+        "将此回放作为上下文，向 Analytics 代理发送聚焦提示。",
+      askSessionPlaceholder: "此会话中发生了什么？",
+      replayTimeline: "回放时间线",
+      noTimelineEvents: "未找到时间线标记",
+      skipBack: "后退 5 秒",
+      skipForward: "前进 5 秒",
+      skipInactive: "跳过非活动时间",
+      skipInactiveOn: "正在跳过非活动间隔",
+      skipInactiveOff: "正在播放非活动间隔",
+    },
+    sqlDashboard: {
+      refreshing: "正在刷新...",
     },
   },
 } satisfies Partial<Record<LocaleCode, AnalyticsPartialMessages>>;
@@ -7536,6 +7772,7 @@ const translatedDashboardReportTranslations = {
       reportSubscriptionSaved: "电子邮件报告订阅已保存。",
       reportSubscriptionDeleted: "电子邮件报告订阅已删除。",
       reportSent: "仪表板报告已发送。",
+      reportQueued: "仪表板报告已加入队列。",
       reportSubscriptionSaveFailed: "无法保存订阅：{{message}}",
       reportSubscriptionDeleteFailed: "无法删除订阅：{{message}}",
       reportSendFailed: "无法发送报告：{{message}}",
@@ -7568,6 +7805,7 @@ const translatedDashboardReportTranslations = {
       reportSubscriptionSaved: "Suscripción al informe guardada.",
       reportSubscriptionDeleted: "Suscripción al informe eliminada.",
       reportSent: "Informe del panel enviado.",
+      reportQueued: "Informe del panel en cola.",
       reportSubscriptionSaveFailed:
         "No se pudo guardar la suscripción: {{message}}",
       reportSubscriptionDeleteFailed:
@@ -7603,6 +7841,7 @@ const translatedDashboardReportTranslations = {
       reportSubscriptionSaved: "Abonnement au rapport enregistré.",
       reportSubscriptionDeleted: "Abonnement au rapport supprimé.",
       reportSent: "Rapport du tableau de bord envoyé.",
+      reportQueued: "Rapport du tableau de bord mis en file d'attente.",
       reportSubscriptionSaveFailed:
         "Impossible d'enregistrer l'abonnement : {{message}}",
       reportSubscriptionDeleteFailed:
@@ -7637,6 +7876,7 @@ const translatedDashboardReportTranslations = {
       reportSubscriptionSaved: "E-Mail-Bericht-Abonnement gespeichert.",
       reportSubscriptionDeleted: "E-Mail-Bericht-Abonnement gelöscht.",
       reportSent: "Dashboard-Bericht gesendet.",
+      reportQueued: "Dashboard-Bericht in die Warteschlange gestellt.",
       reportSubscriptionSaveFailed:
         "Abonnement konnte nicht gespeichert werden: {{message}}",
       reportSubscriptionDeleteFailed:
@@ -7671,6 +7911,7 @@ const translatedDashboardReportTranslations = {
       reportSubscriptionSaved: "メールレポートの購読を保存しました。",
       reportSubscriptionDeleted: "メールレポートの購読を削除しました。",
       reportSent: "ダッシュボードレポートを送信しました。",
+      reportQueued: "ダッシュボードレポートをキューに追加しました。",
       reportSubscriptionSaveFailed: "購読を保存できませんでした: {{message}}",
       reportSubscriptionDeleteFailed: "購読を削除できませんでした: {{message}}",
       reportSendFailed: "レポートを送信できませんでした: {{message}}",
@@ -7703,6 +7944,7 @@ const translatedDashboardReportTranslations = {
       reportSubscriptionSaved: "이메일 보고서 구독이 저장되었습니다.",
       reportSubscriptionDeleted: "이메일 보고서 구독이 삭제되었습니다.",
       reportSent: "대시보드 보고서가 전송되었습니다.",
+      reportQueued: "대시보드 보고서가 대기열에 추가되었습니다.",
       reportSubscriptionSaveFailed: "구독을 저장할 수 없음: {{message}}",
       reportSubscriptionDeleteFailed: "구독을 삭제할 수 없음: {{message}}",
       reportSendFailed: "보고서를 전송할 수 없음: {{message}}",
@@ -7735,6 +7977,7 @@ const translatedDashboardReportTranslations = {
       reportSubscriptionSaved: "Assinatura do relatório por e-mail salva.",
       reportSubscriptionDeleted: "Assinatura do relatório por e-mail excluída.",
       reportSent: "Relatório do painel enviado.",
+      reportQueued: "Relatório do painel enfileirado.",
       reportSubscriptionSaveFailed:
         "Não foi possível salvar a assinatura: {{message}}",
       reportSubscriptionDeleteFailed:
@@ -7768,6 +8011,7 @@ const translatedDashboardReportTranslations = {
       reportSubscriptionSaved: "ईमेल रिपोर्ट सब्सक्रिप्शन सहेजा गया।",
       reportSubscriptionDeleted: "ईमेल रिपोर्ट सब्सक्रिप्शन हटाया गया।",
       reportSent: "डैशबोर्ड रिपोर्ट भेजी गई।",
+      reportQueued: "डैशबोर्ड रिपोर्ट कतार में डाली गई।",
       reportSubscriptionSaveFailed: "सब्सक्रिप्शन सहेजा नहीं जा सका: {{message}}",
       reportSubscriptionDeleteFailed: "सब्सक्रिप्शन हटाया नहीं जा सका: {{message}}",
       reportSendFailed: "रिपोर्ट भेजी नहीं जा सकी: {{message}}",
@@ -7799,6 +8043,7 @@ const translatedDashboardReportTranslations = {
       reportSubscriptionSaved: "تم حفظ اشتراك تقرير البريد الإلكتروني.",
       reportSubscriptionDeleted: "تم حذف اشتراك تقرير البريد الإلكتروني.",
       reportSent: "تم إرسال تقرير لوحة المعلومات.",
+      reportQueued: "تمت إضافة تقرير لوحة المعلومات إلى قائمة الانتظار.",
       reportSubscriptionSaveFailed: "تعذر حفظ الاشتراك: {{message}}",
       reportSubscriptionDeleteFailed: "تعذر حذف الاشتراك: {{message}}",
       reportSendFailed: "تعذر إرسال التقرير: {{message}}",

package/corpus/templates/analytics/app/pages/adhoc/explorer-dashboard/ChartCard.tsx

@@ -80,10 +80,9 @@ export function DashboardChartCard({
   } = useSortable({ id: chart.id, disabled: !editable });
 
   const style = {
-    transform: CSS.Transform.toString(transform),
+    transform: isDragging ? undefined : CSS.Transform.toString(transform),
     transition,
     zIndex: isDragging ? 50 : undefined,
-    opacity: isDragging ? 0.7 : 1,
   };
 
   const { data: config } = useQuery({
@@ -106,6 +105,7 @@ export function DashboardChartCard({
     <div
       ref={setNodeRef}
       style={style}
+      data-dragging={isDragging ? "true" : undefined}
       className={`group relative ${chart.width === 2 ? "md:col-span-2" : ""}`}
     >
       <Card className="h-full">
@@ -172,7 +172,7 @@ export function DashboardChartCard({
             </div>
           ) : null}
         </CardHeader>
-        <CardContent className="pt-0">
+        <CardContent className="explorer-dashboard-chart-content pt-0">
           {isLoading ? (
             <Skeleton className="h-48 w-full" />
           ) : config ? (

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

@@ -14,12 +14,14 @@ import {
 } from "@agent-native/core/client";
 import {
   DndContext,
+  DragOverlay,
   closestCenter,
   PointerSensor,
   KeyboardSensor,
   useSensor,
   useSensors,
   type DragEndEvent,
+  type DragStartEvent,
 } from "@dnd-kit/core";
 import {
   arrayMove,
@@ -35,6 +37,7 @@ import {
   IconDots,
   IconEye,
   IconEyeOff,
+  IconGripVertical,
 } from "@tabler/icons-react";
 import { useQuery, useQueryClient } from "@tanstack/react-query";
 import { useState, useEffect, useCallback } from "react";
@@ -111,6 +114,17 @@ type FetchedExplorerDashboard = {
   hiddenBy: string | null;
 } & ResourceAccess;
 
+function ExplorerDashboardDragPreview({ title }: { title: string | null }) {
+  if (!title) return null;
+
+  return (
+    <div className="explorer-dashboard-drag-preview flex max-w-64 items-center gap-2 rounded-md border bg-background/95 px-3 py-2 text-sm font-medium text-foreground shadow-lg ring-1 ring-primary/20">
+      <IconGripVertical className="h-4 w-4 shrink-0 text-muted-foreground" />
+      <span className="truncate">{title}</span>
+    </div>
+  );
+}
+
 async function fetchDashboard(
   id: string,
 ): Promise<FetchedExplorerDashboard | null> {
@@ -181,6 +195,9 @@ export default function ExplorerDashboardPage() {
   const [addChartOpen, setAddChartOpen] = useState(false);
   const [loaded, setLoaded] = useState(false);
   const [confirmDeleteOpen, setConfirmDeleteOpen] = useState(false);
+  const [activeDragChartId, setActiveDragChartId] = useState<string | null>(
+    null,
+  );
   const canEdit = resourceCanEdit(resourceAccess);
   const canManage = resourceCanManage(resourceAccess);
   const { mutateAsync: hideDashboardAction, isPending: unhidePending } =
@@ -456,8 +473,13 @@ export default function ExplorerDashboardPage() {
     }),
   );
 
+  const handleDragStart = useCallback((event: DragStartEvent) => {
+    setActiveDragChartId(String(event.active.id));
+  }, []);
+
   const handleDragEnd = useCallback(
     (event: DragEndEvent) => {
+      setActiveDragChartId(null);
       if (!dashboard || !canEdit) return;
       const { active, over } = event;
       if (!over || active.id === over.id) return;
@@ -472,6 +494,10 @@ export default function ExplorerDashboardPage() {
     [dashboard, canEdit, persist],
   );
 
+  const handleDragCancel = useCallback(() => {
+    setActiveDragChartId(null);
+  }, []);
+
   const handleSaveName = useCallback(() => {
     if (!dashboard || !canEdit) return;
     const name = nameInput.trim() || t("explorerDashboard.untitledDashboard");
@@ -509,6 +535,12 @@ export default function ExplorerDashboardPage() {
 
   // Config name lookup
   const configNameMap = new Map(savedConfigs.map((c) => [c.id, c.name]));
+  const activeDragChart = activeDragChartId
+    ? (dashboard.charts.find((chart) => chart.id === activeDragChartId) ?? null)
+    : null;
+  const activeDragChartTitle = activeDragChart
+    ? (configNameMap.get(activeDragChart.configId) ?? activeDragChart.configId)
+    : null;
 
   return (
     <div className="space-y-4">
@@ -700,13 +732,18 @@ export default function ExplorerDashboardPage() {
         <DndContext
           sensors={sensors}
           collisionDetection={closestCenter}
+          onDragStart={canEdit ? handleDragStart : undefined}
           onDragEnd={canEdit ? handleDragEnd : undefined}
+          onDragCancel={handleDragCancel}
         >
           <SortableContext
             items={dashboard.charts.map((c) => c.id)}
             strategy={rectSortingStrategy}
           >
-            <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
+            <div
+              className="explorer-dashboard-grid grid grid-cols-1 md:grid-cols-2 gap-4"
+              data-dashboard-dragging={activeDragChartId ? "true" : undefined}
+            >
               {dashboard.charts.map((chart) => (
                 <DashboardChartCard
                   key={chart.id}
@@ -724,6 +761,9 @@ export default function ExplorerDashboardPage() {
               ))}
             </div>
           </SortableContext>
+          <DragOverlay adjustScale={false} dropAnimation={null} zIndex={1000}>
+            <ExplorerDashboardDragPreview title={activeDragChartTitle} />
+          </DragOverlay>
         </DndContext>
       )}
 

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

@@ -231,7 +231,7 @@ export function EmailReportDialog({
     try {
       await sendNow.mutateAsync({ id: selectedId });
       await refetch();
-      toast.success(t("sqlDashboard.reportSent"));
+      toast.success(t("sqlDashboard.reportQueued"));
     } catch (err: any) {
       toast.error(
         t("sqlDashboard.reportSendFailed", {

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

@@ -225,11 +225,11 @@ function PanelEditorContent({
       message: trimmed,
       context:
         `The user wants to add a new panel to SQL dashboard "${dashboardId}". ${titlesLine} ` +
-        `REAL_DATA_REQUIRED: before saving or answering, run at least one real data-source query action for this panel; \`data-source-status\`, \`list-data-dictionary\`, \`update-dashboard\`, and dry-run validation do not count as data queries. ` +
+        `REAL_DATA_REQUIRED: before saving or answering, run at least one real data-source query action for this panel; \`data-source-status\`, \`list-data-dictionary\`, \`update-dashboard\`, \`mutate-dashboard\`, and dry-run validation do not count as data queries. ` +
         `The \`demo\` source is reserved for the built-in Node Exporter demo and does not satisfy REAL_DATA_REQUIRED unless the user explicitly asks to work on that demo dashboard. ` +
         `If no source can answer, report the exact unavailable/error result instead of saving a panel with guessed schema or metrics. ` +
-        `Use the \`update-dashboard\` action with ops=[{op:'insert', path:'/panels/-', value: <panel>}] ` +
-        `to append, or an appropriate index to place the panel in the right spot. ` +
+        `Use the \`mutate-dashboard\` action with code like \`dashboard.insertPanel({"id":"new-panel","title":"New Panel","source":"first-party","chartType":"metric","width":1,"sql":"SELECT COUNT(*) AS value FROM analytics_events"}).atBottom();\` ` +
+        `to append, or \`.before("panel-id")\`, \`.after("panel-id")\`, or \`.atIndex(n)\` to place the panel. ` +
         `Panel shape: { id (unique slug), title, sql, source ('bigquery'|'ga4'|'amplitude'|'first-party'|'demo'|'prometheus'), chartType ('line'|'area'|'bar'|'metric'|'table'|'pie'|'section'), width (legacy integer 1..6; set to 1 unless editing existing data), tab? (use 'Group / Tab' for grouped tabs), columns? (section panels only - 1..6 max panels per row for panels following this section), config? }. ` +
         `Visible layout auto-fits by row: one panel in a row spans the row, two split it, three split it into thirds, up to the section column limit. ` +
         `For amplitude panels, sql is a JSON descriptor: {"event":"event name","groupBy":"property","days":30}. ` +
@@ -240,7 +240,7 @@ function PanelEditorContent({
         `Chart legends render automatically; set config.legend=false only when the user explicitly asks to hide the legend. ` +
         `Consult the data dictionary first via \`list-data-dictionary --search <topic>\`, then use AGENTS.md, .agents/skills, and connected data-source instructions before writing SQL. ` +
         `Every BigQuery panel is dry-run validated on save — if columns/tables are wrong the save returns a 400 with the BQ error and you must fix the SQL and retry. ` +
-        `After the panel saves, call \`refresh-screen\` so the UI picks up the change.`,
+        `After the mutation saves, verify the returned panelCount, appliedOps, and insertedPanelIds; the UI refreshes automatically.`,
       submit: true,
     });
     onOpenChange(false);