@agent-native/core 0.91.1 → 0.92.0

package/corpus/templates/analytics/app/global.css

@@ -337,23 +337,33 @@
   opacity: 0.55;
 }
 
+/* Keep the playhead visually distinct from red console-error marker dots on
+   the scrubber track — those markers used to look like a second thumb. */
 .an-replay-scrub::-webkit-slider-thumb {
-  width: 0.75rem;
-  height: 0.75rem;
+  width: 0.875rem;
+  height: 0.875rem;
   appearance: none;
   border: 2px solid hsl(var(--background));
   border-radius: 9999px;
-  background: hsl(var(--primary));
-  box-shadow: 0 0 0 1px hsl(var(--border));
+  background: hsl(217 91% 60%);
+  box-shadow:
+    0 0 0 1px hsl(217 91% 60% / 0.55),
+    0 1px 2px hsl(0 0% 0% / 0.35);
+  position: relative;
+  z-index: 40;
 }
 
 .an-replay-scrub::-moz-range-thumb {
-  width: 0.75rem;
-  height: 0.75rem;
+  width: 0.875rem;
+  height: 0.875rem;
   border: 2px solid hsl(var(--background));
   border-radius: 9999px;
-  background: hsl(var(--primary));
-  box-shadow: 0 0 0 1px hsl(var(--border));
+  background: hsl(217 91% 60%);
+  box-shadow:
+    0 0 0 1px hsl(217 91% 60% / 0.55),
+    0 1px 2px hsl(0 0% 0% / 0.35);
+  position: relative;
+  z-index: 40;
 }
 
 .dark
@@ -570,9 +580,9 @@
   }
 }
 
-@container analytics-session-detail (min-width: 1040px) {
+@container analytics-session-detail (min-width: 880px) {
   .analytics-session-detail-workbench {
-    grid-template-columns: minmax(0, 1fr) 330px;
+    grid-template-columns: minmax(0, 1fr) minmax(260px, 300px);
   }
 
   .analytics-session-detail-timeline {
@@ -580,6 +590,12 @@
   }
 }
 
+@container analytics-session-detail (min-width: 1200px) {
+  .analytics-session-detail-workbench {
+    grid-template-columns: minmax(0, 1fr) 330px;
+  }
+}
+
 /* The dashboard grid responds to the available content width — which shrinks
    when the agent sidebar is open — not the viewport. Rows are rendered
    explicitly so deleting a card only expands the remaining cards in that row. */

package/corpus/templates/analytics/app/i18n/zh-TW.ts

@@ -964,6 +964,8 @@ const messages = {
     timeline: "事件時間線",
     replayTimeline: "回放時間線",
     timelineDescription: "顯示 {{count}} / {{total}} 個有用事件。",
+    timelineSearch: "搜尋事件...",
+    timelineNoMatches: "沒有符合目前搜尋的時間線事件。",
     noTimelineEvents: "未找到時間線標記",
     sequence: "Sequence",
     size: "Size",

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

@@ -1006,6 +1006,8 @@ const enUS = {
     timeline: "Event timeline",
     replayTimeline: "Replay timeline",
     timelineDescription: "Showing {{count}} of {{total}} useful events.",
+    timelineSearch: "Search events...",
+    timelineNoMatches: "No timeline events match the current search.",
     noTimelineEvents: "No timeline markers found",
     sequence: "Sequence",
     size: "Size",
@@ -8164,6 +8166,8 @@ const translatedSessionReplayTranslations = {
         "用于重建此回放的受控分块。提供商 URL 保持私有。",
       timeline: "事件时间线",
       timelineDescription: "显示 {{count}} / {{total}} 个有用事件。",
+      timelineSearch: "搜索事件...",
+      timelineNoMatches: "没有符合当前搜索的时间线事件。",
       started: "开始",
       signedIn: "已登录",
       anonymous: "匿名",
@@ -8287,6 +8291,9 @@ const translatedSessionReplayTranslations = {
         "Fragmentos con acceso controlado usados para reconstruir esta reproducción. Las URL del proveedor permanecen privadas.",
       timeline: "Línea de tiempo de eventos",
       timelineDescription: "Mostrando {{count}} de {{total}} eventos útiles.",
+      timelineSearch: "Buscar eventos...",
+      timelineNoMatches:
+        "Ningún evento de la línea de tiempo coincide con la búsqueda actual.",
       started: "Inicio",
       signedIn: "Con sesión iniciada",
       anonymous: "Anónimo",
@@ -8412,6 +8419,9 @@ const translatedSessionReplayTranslations = {
       timeline: "Chronologie des événements",
       timelineDescription:
         "Affichage de {{count}} événements utiles sur {{total}}.",
+      timelineSearch: "Rechercher des événements...",
+      timelineNoMatches:
+        "Aucun événement de la chronologie ne correspond à la recherche actuelle.",
       started: "Début",
       signedIn: "Connecté",
       anonymous: "Anonyme",
@@ -8536,6 +8546,9 @@ const translatedSessionReplayTranslations = {
       timeline: "Ereignis-Timeline",
       timelineDescription:
         "{{count}} von {{total}} nützlichen Ereignissen werden angezeigt.",
+      timelineSearch: "Ereignisse suchen...",
+      timelineNoMatches:
+        "Keine Timeline-Ereignisse entsprechen der aktuellen Suche.",
       started: "Gestartet",
       signedIn: "Angemeldet",
       anonymous: "Anonym",
@@ -8659,6 +8672,9 @@ const translatedSessionReplayTranslations = {
       timeline: "イベントタイムライン",
       timelineDescription:
         "有用なイベント {{count}} / {{total}} 件を表示しています。",
+      timelineSearch: "イベントを検索...",
+      timelineNoMatches:
+        "現在の検索に一致するタイムラインイベントはありません。",
       started: "開始",
       signedIn: "サインイン済み",
       anonymous: "匿名",
@@ -8781,6 +8797,8 @@ const translatedSessionReplayTranslations = {
       timeline: "이벤트 타임라인",
       timelineDescription:
         "유용한 이벤트 {{count}} / {{total}}개를 표시합니다.",
+      timelineSearch: "이벤트 검색...",
+      timelineNoMatches: "현재 검색과 일치하는 타임라인 이벤트가 없습니다.",
       started: "시작",
       signedIn: "로그인됨",
       anonymous: "익명",
@@ -8903,6 +8921,9 @@ const translatedSessionReplayTranslations = {
         "Blocos com escopo usados para reconstruir este replay. As URLs do provedor permanecem privadas.",
       timeline: "Linha do tempo de eventos",
       timelineDescription: "Mostrando {{count}} de {{total}} eventos úteis.",
+      timelineSearch: "Pesquisar eventos...",
+      timelineNoMatches:
+        "Nenhum evento da linha do tempo corresponde à pesquisa atual.",
       started: "Início",
       signedIn: "Logado",
       anonymous: "Anônimo",
@@ -9023,6 +9044,8 @@ const translatedSessionReplayTranslations = {
         "इस रीप्ले को फिर से बनाने के लिए उपयोग किए गए स्कोप्ड चंक। प्रदाता URL निजी रहते हैं।",
       timeline: "इवेंट टाइमलाइन",
       timelineDescription: "{{total}} में से {{count}} उपयोगी इवेंट दिखाए जा रहे हैं।",
+      timelineSearch: "इवेंट खोजें...",
+      timelineNoMatches: "वर्तमान खोज से कोई टाइमलाइन इवेंट मेल नहीं खाता।",
       started: "शुरू हुआ",
       signedIn: "साइन इन",
       anonymous: "अनाम",
@@ -9143,6 +9166,8 @@ const translatedSessionReplayTranslations = {
         "مقاطع محددة النطاق تُستخدم لإعادة بناء هذا التسجيل. تبقى عناوين URL الخاصة بالمزوّد خاصة.",
       timeline: "الخط الزمني للأحداث",
       timelineDescription: "عرض {{count}} من {{total}} أحداث مفيدة.",
+      timelineSearch: "البحث عن الأحداث...",
+      timelineNoMatches: "لا توجد أحداث في الخط الزمني تطابق البحث الحالي.",
       started: "بدأت",
       signedIn: "تم تسجيل الدخول",
       anonymous: "مجهول",

package/corpus/templates/analytics/app/pages/monitoring/MonitoringPage.tsx

@@ -69,11 +69,17 @@ export default function MonitoringPage() {
         {inSubView ? null : (
           <div className="flex items-center justify-between gap-2">
             <TabsList>
-              <TabsTrigger value="uptime" className="gap-2">
+              <TabsTrigger
+                value="uptime"
+                className="gap-2 data-[state=active]:bg-primary data-[state=active]:text-primary-foreground data-[state=active]:shadow-sm"
+              >
                 <IconHeartbeat className="h-4 w-4" />
                 {t("navigation.monitoringUptime")}
               </TabsTrigger>
-              <TabsTrigger value="errors" className="gap-2">
+              <TabsTrigger
+                value="errors"
+                className="gap-2 data-[state=active]:bg-primary data-[state=active]:text-primary-foreground data-[state=active]:shadow-sm"
+              >
                 <IconAlertTriangle className="h-4 w-4" />
                 {t("navigation.monitoringErrors")}
               </TabsTrigger>

package/corpus/templates/analytics/app/pages/monitoring/uptime/MonitorFormPage.tsx

@@ -101,6 +101,8 @@ interface MonitorFormValues {
   severity: MonitorSeverity;
   channels: Record<(typeof KNOWN_CHANNELS)[number], boolean>;
   emailRecipients: string;
+  slackWebhookUrl: string;
+  webhookUrl: string;
   cooldownMinutes: number;
   enabled: boolean;
 }
@@ -160,6 +162,8 @@ function defaultValues(monitor: MonitorSummary | null): MonitorFormValues {
       webhook: channelSet.has("webhook"),
     },
     emailRecipients: (monitor?.emailRecipients ?? []).join(", "),
+    slackWebhookUrl: monitor?.slackWebhookUrl ?? "",
+    webhookUrl: monitor?.webhookUrl ?? "",
     cooldownMinutes: monitor?.cooldownMinutes ?? 15,
     enabled: monitor?.enabled ?? true,
   };
@@ -206,6 +210,8 @@ function initialSections(monitor: MonitorSummary | null): SectionState {
     alerting:
       !isDefaultChannels ||
       monitor.emailRecipients.length > 0 ||
+      Boolean(monitor.slackWebhookUrl) ||
+      Boolean(monitor.webhookUrl) ||
       monitor.severity !== "critical",
     advanced:
       monitor.method !== "GET" ||
@@ -362,6 +368,30 @@ export function MonitorFormPage({
       setError("channels", { message: t.channelRequired });
       return;
     }
+    if (
+      formValues.channels.email &&
+      !splitList(formValues.emailRecipients).length
+    ) {
+      setSections((prev) => ({ ...prev, alerting: true }));
+      setError("emailRecipients", { message: t.emailRecipientsRequired });
+      return;
+    }
+    if (formValues.channels.slack) {
+      const slackUrl = formValues.slackWebhookUrl.trim();
+      if (slackUrl && !isHttpUrl(slackUrl)) {
+        setSections((prev) => ({ ...prev, alerting: true }));
+        setError("slackWebhookUrl", { message: t.slackWebhookUrlInvalid });
+        return;
+      }
+    }
+    if (formValues.channels.webhook) {
+      const hookUrl = formValues.webhookUrl.trim();
+      if (hookUrl && !isHttpUrl(hookUrl)) {
+        setSections((prev) => ({ ...prev, alerting: true }));
+        setError("webhookUrl", { message: t.webhookUrlInvalid });
+        return;
+      }
+    }
 
     const assertions = formValues.assertions
       .map((assertion) => {
@@ -399,7 +429,15 @@ export function MonitorFormPage({
       followRedirects: formValues.followRedirects,
       severity: formValues.severity,
       channels,
-      emailRecipients: splitList(formValues.emailRecipients),
+      emailRecipients: formValues.channels.email
+        ? splitList(formValues.emailRecipients)
+        : [],
+      slackWebhookUrl: formValues.channels.slack
+        ? formValues.slackWebhookUrl.trim()
+        : null,
+      webhookUrl: formValues.channels.webhook
+        ? formValues.webhookUrl.trim()
+        : null,
       cooldownMinutes: formValues.cooldownMinutes,
       enabled: formValues.enabled,
     };
@@ -736,8 +774,8 @@ export function MonitorFormPage({
             setSections((prev) => ({ ...prev, alerting: open }))
           }
         >
-          <div className="grid gap-4 sm:grid-cols-2">
-            <div className="space-y-1.5">
+          <div className="space-y-4">
+            <div className="space-y-1.5 sm:max-w-xs">
               <Label htmlFor="monitor-severity">{t.fieldSeverity}</Label>
               <Controller
                 control={control}
@@ -765,43 +803,108 @@ export function MonitorFormPage({
               />
             </div>
 
-            <div className="space-y-1.5">
+            <div className="space-y-2">
               <Label>{t.fieldChannels}</Label>
               <Controller
                 control={control}
                 name="channels"
                 render={({ field }) => (
-                  <div className="grid grid-cols-2 gap-2">
-                    {KNOWN_CHANNELS.map((channel) => (
-                      <label
-                        key={channel}
-                        className="flex items-center gap-2 rounded-md border px-2.5 py-1.5 text-xs"
-                      >
-                        <Checkbox
-                          checked={field.value[channel]}
-                          onCheckedChange={(checked) =>
-                            field.onChange({
-                              ...field.value,
-                              [channel]: checked === true,
-                            })
-                          }
-                        />
-                        {channelLabel(channel, t)}
-                      </label>
-                    ))}
+                  <div className="space-y-2">
+                    {KNOWN_CHANNELS.map((channel) => {
+                      const checked = field.value[channel];
+                      return (
+                        <div
+                          key={channel}
+                          className="rounded-md border border-border/60"
+                        >
+                          <label className="flex cursor-pointer items-start gap-2.5 px-3 py-2.5">
+                            <Checkbox
+                              className="mt-0.5"
+                              checked={checked}
+                              onCheckedChange={(next) =>
+                                field.onChange({
+                                  ...field.value,
+                                  [channel]: next === true,
+                                })
+                              }
+                            />
+                            <span className="min-w-0">
+                              <span className="block text-sm">
+                                {channelLabel(channel, t)}
+                              </span>
+                              <span className="block text-xs text-muted-foreground">
+                                {channelHint(channel, t)}
+                              </span>
+                            </span>
+                          </label>
+                          {channel === "email" && checked ? (
+                            <div className="space-y-1.5 border-t border-border/60 px-3 py-2.5">
+                              <Label htmlFor="monitor-emails">
+                                {t.fieldEmailRecipients}
+                              </Label>
+                              <Textarea
+                                id="monitor-emails"
+                                className="min-h-[64px]"
+                                placeholder={t.fieldEmailRecipientsPlaceholder}
+                                {...register("emailRecipients")}
+                              />
+                              {errors.emailRecipients ? (
+                                <p className="text-xs text-destructive">
+                                  {errors.emailRecipients.message}
+                                </p>
+                              ) : null}
+                            </div>
+                          ) : null}
+                          {channel === "slack" && checked ? (
+                            <div className="space-y-1.5 border-t border-border/60 px-3 py-2.5">
+                              <Label htmlFor="monitor-slack-url">
+                                {t.fieldSlackWebhookUrl}
+                              </Label>
+                              <Input
+                                id="monitor-slack-url"
+                                type="url"
+                                placeholder={t.fieldSlackWebhookUrlPlaceholder}
+                                {...register("slackWebhookUrl")}
+                              />
+                              {errors.slackWebhookUrl ? (
+                                <p className="text-xs text-destructive">
+                                  {errors.slackWebhookUrl.message}
+                                </p>
+                              ) : (
+                                <p className="text-xs text-muted-foreground">
+                                  {t.fieldSlackWebhookUrlHint}
+                                </p>
+                              )}
+                            </div>
+                          ) : null}
+                          {channel === "webhook" && checked ? (
+                            <div className="space-y-1.5 border-t border-border/60 px-3 py-2.5">
+                              <Label htmlFor="monitor-webhook-url">
+                                {t.fieldWebhookUrl}
+                              </Label>
+                              <Input
+                                id="monitor-webhook-url"
+                                type="url"
+                                placeholder={t.fieldWebhookUrlPlaceholder}
+                                {...register("webhookUrl")}
+                              />
+                              {errors.webhookUrl ? (
+                                <p className="text-xs text-destructive">
+                                  {errors.webhookUrl.message}
+                                </p>
+                              ) : (
+                                <p className="text-xs text-muted-foreground">
+                                  {t.fieldWebhookUrlHint}
+                                </p>
+                              )}
+                            </div>
+                          ) : null}
+                        </div>
+                      );
+                    })}
                   </div>
                 )}
               />
-            </div>
-
-            <div className="space-y-1.5 sm:col-span-2">
-              <Label htmlFor="monitor-emails">{t.fieldEmailRecipients}</Label>
-              <Textarea
-                id="monitor-emails"
-                className="min-h-[64px]"
-                placeholder={t.fieldEmailRecipientsPlaceholder}
-                {...register("emailRecipients")}
-              />
               {errors.channels ? (
                 <p className="text-xs text-destructive">
                   {errors.channels.message}
@@ -1024,3 +1127,19 @@ function channelLabel(
       return t.channelWebhook;
   }
 }
+
+function channelHint(
+  channel: (typeof KNOWN_CHANNELS)[number],
+  t: ReturnType<typeof useUptimeT>,
+): string {
+  switch (channel) {
+    case "inbox":
+      return t.channelInboxHint;
+    case "email":
+      return t.channelEmailHint;
+    case "slack":
+      return t.channelSlackHint;
+    case "webhook":
+      return t.channelWebhookHint;
+  }
+}

package/corpus/templates/analytics/app/pages/monitoring/uptime/i18n.ts

@@ -117,7 +117,7 @@ const MESSAGES = {
     sectionResponseChecksHint:
       "Choose which responses count as healthy and add body, header, or latency assertions.",
     sectionAlerting: "Alerting",
-    sectionAlertingHint: "Pick the severity and where alerts are delivered.",
+    sectionAlertingHint: "Choose severity and where alerts go.",
     sectionAdvanced: "Advanced",
     sectionAdvancedHint:
       "Request method, timeout, cooldown, redirects, and pause.",
@@ -165,12 +165,24 @@ const MESSAGES = {
     severityWarning: "Warning",
     severityCritical: "Critical",
     fieldChannels: "Notify via",
-    channelInbox: "Inbox",
+    channelInbox: "In-app inbox",
+    channelInboxHint: "Bell notifications inside Analytics.",
     channelEmail: "Email",
+    channelEmailHint: "Send to specific addresses.",
     channelSlack: "Slack",
+    channelSlackHint: "Post to a Slack incoming webhook.",
     channelWebhook: "Webhook",
+    channelWebhookHint: "POST JSON to any HTTPS endpoint.",
     fieldEmailRecipients: "Email recipients",
     fieldEmailRecipientsPlaceholder: "alerts@example.com, oncall@example.com",
+    fieldSlackWebhookUrl: "Slack webhook URL",
+    fieldSlackWebhookUrlPlaceholder: "https://hooks.slack.com/services/T…/B…/…",
+    fieldSlackWebhookUrlHint:
+      "Paste a Slack Incoming Webhook URL. Leave blank to use the workspace default, if configured.",
+    fieldWebhookUrl: "Webhook URL",
+    fieldWebhookUrlPlaceholder: "https://example.com/hooks/uptime",
+    fieldWebhookUrlHint:
+      "Receives a JSON POST with severity, title, and body. Leave blank to use the workspace default, if configured.",
     fieldCooldown: "Alert cooldown (minutes)",
     fieldEnabled: "Enabled",
     fieldEnabledHint: "Run this monitor on its schedule.",
@@ -188,6 +200,9 @@ const MESSAGES = {
     urlRequired: "Enter an absolute http(s) URL.",
     urlInvalid: "Enter a valid http(s) URL (e.g. https://example.com).",
     channelRequired: "Select at least one alert channel.",
+    emailRecipientsRequired: "Add at least one email recipient.",
+    slackWebhookUrlInvalid: "Enter a valid Slack webhook http(s) URL.",
+    webhookUrlInvalid: "Enter a valid webhook http(s) URL.",
     classRequired: "Select at least one status class.",
     codesRequired: "Enter at least one status code.",
     saved: "Monitor saved.",

package/corpus/templates/analytics/app/pages/monitoring/uptime/types.ts

@@ -61,6 +61,8 @@ export interface MonitorSummary {
   severity: MonitorSeverity;
   channels: string[];
   emailRecipients: string[];
+  slackWebhookUrl: string | null;
+  webhookUrl: string | null;
   cooldownMinutes: number;
   enabled: boolean;
   lastStatus: MonitorStatus | null;
@@ -156,6 +158,8 @@ export interface SaveMonitorInput {
   severity?: MonitorSeverity;
   channels?: string[];
   emailRecipients?: string[];
+  slackWebhookUrl?: string | null;
+  webhookUrl?: string | null;
   cooldownMinutes?: number;
   enabled?: boolean;
 }