@agent-native/core 0.97.0 → 0.98.0

package/corpus/templates/assets/app/components/create/RecentDraftsSection.tsx

@@ -1,5 +1,9 @@
 import { useActionQuery, useT } from "@agent-native/core/client";
-import { IconArrowUpRight, IconPhoto } from "@tabler/icons-react";
+import {
+  IconAlertTriangle,
+  IconArrowUpRight,
+  IconPhoto,
+} from "@tabler/icons-react";
 import { Link } from "react-router";
 
 import { Button } from "@/components/ui/button";
@@ -20,11 +24,33 @@ const RECENT_DRAFTS_LIMIT = 5;
 
 export function RecentDraftsSection() {
   const t = useT();
-  const { data, isLoading } = useActionQuery("list-draft-assets", {
-    limit: RECENT_DRAFTS_LIMIT,
-  });
+  const { data, isLoading, isError, isFetching, refetch } = useActionQuery(
+    "list-draft-assets",
+    {
+      limit: RECENT_DRAFTS_LIMIT,
+    },
+  );
   const drafts = ((data as any)?.assets ?? []) as DraftAsset[];
 
+  if (isError) {
+    return (
+      <section className="flex items-center justify-between gap-3 rounded-lg border border-destructive/30 px-4 py-3">
+        <div className="flex min-w-0 items-center gap-2 text-sm text-muted-foreground">
+          <IconAlertTriangle className="size-4 shrink-0 text-destructive" />
+          <span className="truncate">{t("audit.unknownError")}</span>
+        </div>
+        <Button
+          size="sm"
+          variant="outline"
+          onClick={() => void refetch()}
+          disabled={isFetching}
+        >
+          {t("brandKitDetail.refresh")}
+        </Button>
+      </section>
+    );
+  }
+
   if (!isLoading && drafts.length === 0) return null;
 
   return (

package/corpus/templates/assets/app/routes/library.tsx

@@ -24,6 +24,7 @@ import {
   EMBED_TOKEN_QUERY_PARAM,
 } from "@agent-native/core/shared";
 import {
+  IconAlertTriangle,
   IconArrowUpRight,
   IconCheck,
   IconChevronDown,
@@ -1104,11 +1105,20 @@ function AllAssetsBrowser() {
   > | null>(null);
   const [standaloneCopyOk, setStandaloneCopyOk] = useState(false);
 
-  const { data: assetData, isLoading } = useActionQuery("list-assets", {
+  const {
+    data: assetData,
+    isLoading,
+    isError,
+    isFetching,
+    refetch,
+  } = useActionQuery("list-assets", {
     query: query.trim() || undefined,
   } as any) as {
     data?: { assets?: Asset[] };
     isLoading: boolean;
+    isError: boolean;
+    isFetching: boolean;
+    refetch: () => Promise<unknown>;
   };
 
   const allAssets = assetData?.assets ?? [];
@@ -1274,6 +1284,21 @@ function AllAssetsBrowser() {
               <Skeleton key={index} className="aspect-[4/3] rounded-lg" />
             ))}
           </div>
+        ) : isError ? (
+          <div className="flex min-h-64 flex-col items-center justify-center gap-3 px-6 text-center">
+            <IconAlertTriangle className="size-9 text-destructive" />
+            <p className="max-w-sm text-sm text-muted-foreground">
+              {t("audit.unknownError")}
+            </p>
+            <Button
+              size="sm"
+              variant="outline"
+              onClick={() => void refetch()}
+              disabled={isFetching}
+            >
+              {t("brandKitDetail.refresh")}
+            </Button>
+          </div>
         ) : assets.length === 0 ? (
           <div className="flex min-h-64 items-center justify-center text-center">
             <div className="max-w-sm text-sm text-muted-foreground">
@@ -1886,12 +1911,16 @@ export function LibraryWorkspace({
 }: {
   selectedLibraryId?: string | null;
 }) {
+  const t = useT();
   const navigate = useNavigate();
   const routeSelectedLibraryId = useLibraryRouteSelectedId(selectedLibraryId);
   const [createOpen, setCreateOpen] = useState(false);
-  const { data, isLoading } = useActionQuery("list-libraries", {
-    includeFolders: true,
-  } as any);
+  const { data, isLoading, isError, isFetching, refetch } = useActionQuery(
+    "list-libraries",
+    {
+      includeFolders: true,
+    } as any,
+  );
   const libraries = ((data as any)?.libraries ?? []) as ImageLibrarySummary[];
   const foldersByLibraryId = useMemo(() => {
     const result: Record<string, any[]> = {};
@@ -1939,7 +1968,22 @@ export function LibraryWorkspace({
             isLoading={isLoading}
             onCreateKit={() => setCreateOpen(true)}
           />
-          {routeSelectedLibraryId || hasLibraries ? (
+          {isError ? (
+            <div className="flex min-h-80 flex-col items-center justify-center gap-3 px-6 text-center">
+              <IconAlertTriangle className="size-9 text-destructive" />
+              <p className="max-w-sm text-sm text-muted-foreground">
+                {t("audit.unknownError")}
+              </p>
+              <Button
+                size="sm"
+                variant="outline"
+                onClick={() => void refetch()}
+                disabled={isFetching}
+              >
+                {t("brandKitDetail.refresh")}
+              </Button>
+            </div>
+          ) : routeSelectedLibraryId || hasLibraries ? (
             <>
               <LibraryCandidateStage
                 activeLibraryId={routeSelectedLibraryId}

package/corpus/templates/assets/changelog/2026-07-11-library-load-failures-now-show-a-retry-action.md

@@ -0,0 +1,6 @@
+---
+type: fixed
+date: 2026-07-11
+---
+
+Library and recent-draft loading failures now show a clear retry action instead of looking empty.

package/corpus/templates/brain/.agents/skills/frontend-design/SKILL.md

@@ -48,7 +48,7 @@ Default to Apple/Linear-level restraint: make the primary workflow obvious, then
 
 - **Typography**: Use the product's existing type system first. For net-new public pages, choose characterful but readable type and keep sizing appropriate to the surface.
 - **Color and theme**: Use semantic tokens and CSS variables. Avoid one-note palettes and default purple/blue gradients unless the brand demands them.
-- **Motion**: Prefer purposeful transitions and small state changes. Use CSS transitions/keyframes unless the app already uses a motion library.
+- **Motion**: Prefer purposeful transitions and small state changes. Use CSS transitions/keyframes unless the app already uses a motion library. Never `transition-all` — list the properties that actually change (e.g. `transition-[opacity,transform]`). Use the shared easing tokens defined in `packages/core/src/styles/agent-native.css` instead of hand-typing curves: `var(--ease-drawer)` (260ms, drawers/app chrome), `var(--ease-collapse)` (200ms, expand/collapse), `var(--ease-out-strong)` (snappy entrances) — in Tailwind, `ease-[var(--ease-collapse)]`. Enter/exit with ease-out, never `ease-in`. Overlays that zoom in must set the Radix origin var (e.g. `origin-[--radix-popover-content-transform-origin]`). Animate `transform`/`opacity`, not width/height/padding/box-shadow. Gate looping or large-movement animations with `motion-reduce:`. Command palettes and keyboard-triggered actions get no animation.
 - **Composition**: Match the workflow. Operational apps should be dense and scannable; marketing or portfolio pages can be more immersive.
 - **Visual assets**: Websites, games, and object-focused pages need real or generated media when images help users understand the subject.
 - **Responsive fit**: Text must not overflow buttons, cards, tabs, sidebars, or fixed-format tools. Use stable dimensions for boards, grids, toolbars, and counters.

package/corpus/templates/calendar/.agents/skills/frontend-design/SKILL.md

@@ -48,7 +48,7 @@ Default to Apple/Linear-level restraint: make the primary workflow obvious, then
 
 - **Typography**: Use the product's existing type system first. For net-new public pages, choose characterful but readable type and keep sizing appropriate to the surface.
 - **Color and theme**: Use semantic tokens and CSS variables. Avoid one-note palettes and default purple/blue gradients unless the brand demands them.
-- **Motion**: Prefer purposeful transitions and small state changes. Use CSS transitions/keyframes unless the app already uses a motion library.
+- **Motion**: Prefer purposeful transitions and small state changes. Use CSS transitions/keyframes unless the app already uses a motion library. Never `transition-all` — list the properties that actually change (e.g. `transition-[opacity,transform]`). Use the shared easing tokens defined in `packages/core/src/styles/agent-native.css` instead of hand-typing curves: `var(--ease-drawer)` (260ms, drawers/app chrome), `var(--ease-collapse)` (200ms, expand/collapse), `var(--ease-out-strong)` (snappy entrances) — in Tailwind, `ease-[var(--ease-collapse)]`. Enter/exit with ease-out, never `ease-in`. Overlays that zoom in must set the Radix origin var (e.g. `origin-[--radix-popover-content-transform-origin]`). Animate `transform`/`opacity`, not width/height/padding/box-shadow. Gate looping or large-movement animations with `motion-reduce:`. Command palettes and keyboard-triggered actions get no animation.
 - **Composition**: Match the workflow. Operational apps should be dense and scannable; marketing or portfolio pages can be more immersive.
 - **Visual assets**: Websites, games, and object-focused pages need real or generated media when images help users understand the subject.
 - **Responsive fit**: Text must not overflow buttons, cards, tabs, sidebars, or fixed-format tools. Use stable dimensions for boards, grids, toolbars, and counters.

package/corpus/templates/calendar/.env.example

@@ -2,6 +2,11 @@
 # GOOGLE_CLIENT_ID=
 # GOOGLE_CLIENT_SECRET=
 
+# Preferred low-scope Google credentials for "Continue with Google" app login.
+# Falls back to GOOGLE_CLIENT_ID/GOOGLE_CLIENT_SECRET above when unset.
+# GOOGLE_SIGN_IN_CLIENT_ID=
+# GOOGLE_SIGN_IN_CLIENT_SECRET=
+
 # OAuth state signing — REQUIRED in prod for Google + Zoom OAuth flows
 # Falls back to BETTER_AUTH_SECRET if unset; setting it explicitly is recommended
 # Generate via: openssl rand -hex 32

package/corpus/templates/calendar/app/components/calendar/EventCard.tsx

@@ -49,7 +49,7 @@ export function EventCard({
         onDragStart={canDrag ? handleDragStart : undefined}
         onDragEnd={canDrag ? onDragEnd : undefined}
         className={cn(
-          "relative flex w-full items-center gap-1.5 rounded px-1.5 py-0.5 text-left text-xs text-foreground transition-all hover:brightness-110",
+          "relative flex w-full items-center gap-1.5 rounded px-1.5 py-0.5 text-left text-xs text-foreground transition-[filter,transform] hover:brightness-110 active:scale-[0.98]",
           canDrag && "cursor-grab active:cursor-grabbing",
           dimmed && "opacity-40",
           event.ownerColor && "pr-3.5",
@@ -92,7 +92,7 @@ export function EventCard({
       onDragStart={canDrag ? handleDragStart : undefined}
       onDragEnd={canDrag ? onDragEnd : undefined}
       className={cn(
-        "relative flex w-full flex-col gap-0.5 rounded-md px-2 py-1.5 text-left text-xs text-foreground transition-all hover:brightness-110",
+        "relative flex w-full flex-col gap-0.5 rounded-md px-2 py-1.5 text-left text-xs text-foreground transition-[filter,transform] hover:brightness-110 active:scale-[0.98]",
         canDrag && "cursor-grab active:cursor-grabbing",
         dimmed && "opacity-40",
         event.ownerColor && "pr-4",

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

@@ -6,6 +6,8 @@ const messages = {
     clipboardUnavailable: "無法存取剪貼簿",
     disconnect: "斷開連線",
     notConnected: "未連線",
+    loadFailed: "無法載入此資料。",
+    retry: "重試",
     saving: "正在儲存...",
   },
   root: {

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

@@ -10,6 +10,8 @@ const enUS = {
     clipboardUnavailable: "Clipboard access is unavailable",
     disconnect: "Disconnect",
     notConnected: "Not connected",
+    loadFailed: "Could not load this data.",
+    retry: "Retry",
     saving: "Saving...",
   },
   root: {
@@ -3650,6 +3652,8 @@ export const messagesByLocale = {
       clipboardUnavailable: "无法访问剪贴板",
       disconnect: "断开连接",
       notConnected: "未连接",
+      loadFailed: "无法加载此数据。",
+      retry: "重试",
       saving: "正在保存...",
     },
     root: {
@@ -3706,6 +3710,8 @@ export const messagesByLocale = {
       clipboardUnavailable: "El acceso al portapapeles no está disponible",
       disconnect: "Desconectar",
       notConnected: "No conectado",
+      loadFailed: "No se pudieron cargar estos datos.",
+      retry: "Reintentar",
       saving: "Guardando...",
     },
     root: {
@@ -3763,6 +3769,8 @@ export const messagesByLocale = {
       clipboardUnavailable: "L’accès au presse-papiers n’est pas disponible",
       disconnect: "Déconnecter",
       notConnected: "Non connecté",
+      loadFailed: "Impossible de charger ces données.",
+      retry: "Réessayer",
       saving: "Enregistrement...",
     },
     root: {
@@ -3822,6 +3830,8 @@ export const messagesByLocale = {
         "Zugriff auf die Zwischenablage ist nicht verfügbar",
       disconnect: "Trennen",
       notConnected: "Nicht verbunden",
+      loadFailed: "Diese Daten konnten nicht geladen werden.",
+      retry: "Erneut versuchen",
       saving: "Speichern...",
     },
     root: {
@@ -3880,6 +3890,8 @@ export const messagesByLocale = {
       clipboardUnavailable: "クリップボードへのアクセスは利用できません",
       disconnect: "切断",
       notConnected: "未接続",
+      loadFailed: "このデータを読み込めませんでした。",
+      retry: "再試行",
       saving: "保存中...",
     },
     root: {
@@ -3936,6 +3948,8 @@ export const messagesByLocale = {
       clipboardUnavailable: "클립보드 접근을 사용할 수 없습니다",
       disconnect: "연결 해제",
       notConnected: "연결되지 않음",
+      loadFailed: "이 데이터를 불러올 수 없습니다.",
+      retry: "다시 시도",
       saving: "저장 중...",
     },
     root: {
@@ -3993,6 +4007,8 @@ export const messagesByLocale = {
         "O acesso à área de transferência não está disponível",
       disconnect: "Desconectar",
       notConnected: "Não conectado",
+      loadFailed: "Não foi possível carregar estes dados.",
+      retry: "Tentar novamente",
       saving: "Salvando...",
     },
     root: {
@@ -4050,6 +4066,8 @@ export const messagesByLocale = {
       clipboardUnavailable: "क्लिपबोर्ड एक्सेस उपलब्ध नहीं है",
       disconnect: "डिस्कनेक्ट करें",
       notConnected: "कनेक्टेड नहीं",
+      loadFailed: "यह डेटा लोड नहीं किया जा सका।",
+      retry: "फिर से प्रयास करें",
       saving: "सहेज रहे हैं...",
     },
     root: {
@@ -4105,6 +4123,8 @@ export const messagesByLocale = {
       clipboardUnavailable: "الوصول إلى الحافظة غير متاح",
       disconnect: "قطع الاتصال",
       notConnected: "غير متصل",
+      loadFailed: "تعذر تحميل هذه البيانات.",
+      retry: "إعادة المحاولة",
       saving: "جارٍ الحفظ...",
     },
     root: {

package/corpus/templates/calendar/app/pages/BookingLinksPage.tsx

@@ -612,7 +612,14 @@ export default function BookingLinksPage({
   const navigate = useNavigate();
   const [searchParams] = useSearchParams();
   const initialTab = (searchParams.get("tab") as Tab) || "links";
-  const { data: bookingLinks = [], isLoading } = useBookingLinks();
+  const bookingLinksQuery = useBookingLinks();
+  const {
+    data: bookingLinks = [],
+    isLoading,
+    isError: bookingLinksError,
+    isFetching: bookingLinksFetching,
+    refetch: refetchBookingLinks,
+  } = bookingLinksQuery;
   const createBookingLink = useCreateBookingLink();
   const updateBookingLink = useUpdateBookingLink();
   const deleteBookingLink = useDeleteBookingLink();
@@ -1048,6 +1055,21 @@ export default function BookingLinksPage({
 
   // If a link is selected, show the detail/edit view
   if (selectedId) {
+    if (bookingLinksError && !isLoading) {
+      return (
+        <div className="flex min-h-[50vh] flex-col items-center justify-center gap-3 px-6 text-center">
+          <p className="text-sm text-destructive">{t("common.loadFailed")}</p>
+          <Button
+            size="sm"
+            variant="outline"
+            onClick={() => void refetchBookingLinks()}
+            disabled={bookingLinksFetching}
+          >
+            {t("common.retry")}
+          </Button>
+        </div>
+      );
+    }
     return (
       <div className="mx-auto max-w-6xl space-y-6 px-4 py-5 sm:p-6">
         {/* Two-column layout: form left, preview right */}
@@ -1511,6 +1533,20 @@ export default function BookingLinksPage({
           <div className="space-y-6">
             {isLoading ? (
               <BookingLinksListSkeleton />
+            ) : bookingLinksError ? (
+              <div className="flex flex-col items-center justify-center gap-3 rounded-xl border border-destructive/30 px-6 py-16 text-center">
+                <p className="text-sm text-destructive">
+                  {t("common.loadFailed")}
+                </p>
+                <Button
+                  size="sm"
+                  variant="outline"
+                  onClick={() => void refetchBookingLinks()}
+                  disabled={bookingLinksFetching}
+                >
+                  {t("common.retry")}
+                </Button>
+              </div>
             ) : !hasLinks ? (
               <div className="flex flex-col items-center justify-center rounded-xl border border-dashed border-border py-16 px-6 text-center">
                 <div className="flex h-12 w-12 items-center justify-center rounded-full bg-muted mb-4">

package/corpus/templates/calendar/app/pages/BookingsList.tsx

@@ -35,8 +35,10 @@ type FilterStatus = "all" | "confirmed" | "cancelled";
 
 export default function BookingsList() {
   const t = useT();
-  const { data: bookings = [] } = useBookings();
-  const { data: bookingLinks = [] } = useBookingLinks();
+  const bookingsQuery = useBookings();
+  const bookingLinksQuery = useBookingLinks();
+  const bookings = bookingsQuery.data ?? [];
+  const bookingLinks = bookingLinksQuery.data ?? [];
   const deleteBooking = useDeleteBooking();
   const [filter, setFilter] = useState<FilterStatus>("all");
 
@@ -81,7 +83,22 @@ export default function BookingsList() {
         </TabsList>
       </Tabs>
 
-      {filtered.length === 0 ? (
+      {bookingsQuery.isError || bookingLinksQuery.isError ? (
+        <div className="flex flex-col items-center justify-center gap-3 rounded-lg border border-destructive/30 py-12 text-center">
+          <p className="text-sm text-destructive">{t("common.loadFailed")}</p>
+          <Button
+            size="sm"
+            variant="outline"
+            onClick={() => {
+              void bookingsQuery.refetch();
+              void bookingLinksQuery.refetch();
+            }}
+            disabled={bookingsQuery.isFetching || bookingLinksQuery.isFetching}
+          >
+            {t("common.retry")}
+          </Button>
+        </div>
+      ) : filtered.length === 0 ? (
         <div className="flex flex-col items-center justify-center rounded-lg border border-dashed border-border py-12">
           <p className="text-sm text-muted-foreground">
             {t("bookingLinks.noBookingsFound")}

package/corpus/templates/calendar/changelog/2026-07-11-booking-load-failures-now-show-a-retry-action.md

@@ -0,0 +1,6 @@
+---
+type: fixed
+date: 2026-07-11
+---
+
+Booking links and bookings now show a clear retry action when they cannot be loaded.

package/corpus/templates/calendar/changelog/2026-07-11-event-cards-give-subtle-press-feedback-and-smoother-hover.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-07-11
+---
+
+Event cards give subtle press feedback and smoother hover

package/corpus/templates/chat/.agents/skills/frontend-design/SKILL.md

@@ -48,7 +48,7 @@ Default to Apple/Linear-level restraint: make the primary workflow obvious, then
 
 - **Typography**: Use the product's existing type system first. For net-new public pages, choose characterful but readable type and keep sizing appropriate to the surface.
 - **Color and theme**: Use semantic tokens and CSS variables. Avoid one-note palettes and default purple/blue gradients unless the brand demands them.
-- **Motion**: Prefer purposeful transitions and small state changes. Use CSS transitions/keyframes unless the app already uses a motion library.
+- **Motion**: Prefer purposeful transitions and small state changes. Use CSS transitions/keyframes unless the app already uses a motion library. Never `transition-all` — list the properties that actually change (e.g. `transition-[opacity,transform]`). Use the shared easing tokens defined in `packages/core/src/styles/agent-native.css` instead of hand-typing curves: `var(--ease-drawer)` (260ms, drawers/app chrome), `var(--ease-collapse)` (200ms, expand/collapse), `var(--ease-out-strong)` (snappy entrances) — in Tailwind, `ease-[var(--ease-collapse)]`. Enter/exit with ease-out, never `ease-in`. Overlays that zoom in must set the Radix origin var (e.g. `origin-[--radix-popover-content-transform-origin]`). Animate `transform`/`opacity`, not width/height/padding/box-shadow. Gate looping or large-movement animations with `motion-reduce:`. Command palettes and keyboard-triggered actions get no animation.
 - **Composition**: Match the workflow. Operational apps should be dense and scannable; marketing or portfolio pages can be more immersive.
 - **Visual assets**: Websites, games, and object-focused pages need real or generated media when images help users understand the subject.
 - **Responsive fit**: Text must not overflow buttons, cards, tabs, sidebars, or fixed-format tools. Use stable dimensions for boards, grids, toolbars, and counters.

package/corpus/templates/clips/.agents/skills/frontend-design/SKILL.md

@@ -48,7 +48,7 @@ Default to Apple/Linear-level restraint: make the primary workflow obvious, then
 
 - **Typography**: Use the product's existing type system first. For net-new public pages, choose characterful but readable type and keep sizing appropriate to the surface.
 - **Color and theme**: Use semantic tokens and CSS variables. Avoid one-note palettes and default purple/blue gradients unless the brand demands them.
-- **Motion**: Prefer purposeful transitions and small state changes. Use CSS transitions/keyframes unless the app already uses a motion library.
+- **Motion**: Prefer purposeful transitions and small state changes. Use CSS transitions/keyframes unless the app already uses a motion library. Never `transition-all` — list the properties that actually change (e.g. `transition-[opacity,transform]`). Use the shared easing tokens defined in `packages/core/src/styles/agent-native.css` instead of hand-typing curves: `var(--ease-drawer)` (260ms, drawers/app chrome), `var(--ease-collapse)` (200ms, expand/collapse), `var(--ease-out-strong)` (snappy entrances) — in Tailwind, `ease-[var(--ease-collapse)]`. Enter/exit with ease-out, never `ease-in`. Overlays that zoom in must set the Radix origin var (e.g. `origin-[--radix-popover-content-transform-origin]`). Animate `transform`/`opacity`, not width/height/padding/box-shadow. Gate looping or large-movement animations with `motion-reduce:`. Command palettes and keyboard-triggered actions get no animation.
 - **Composition**: Match the workflow. Operational apps should be dense and scannable; marketing or portfolio pages can be more immersive.
 - **Visual assets**: Websites, games, and object-focused pages need real or generated media when images help users understand the subject.
 - **Responsive fit**: Text must not overflow buttons, cards, tabs, sidebars, or fixed-format tools. Use stable dimensions for boards, grids, toolbars, and counters.

package/corpus/templates/clips/actions/decline-invite.ts

@@ -14,6 +14,7 @@ import { eq } from "drizzle-orm";
 import { z } from "zod";
 
 import { getDb } from "../server/db/index.js";
+import { getCurrentOwnerEmail } from "../server/lib/recordings.js";
 
 export default defineAction({
   description:
@@ -23,10 +24,14 @@ export default defineAction({
   }),
   run: async (args) => {
     const db = getDb();
+    const me = getCurrentOwnerEmail();
+    const meLower = me.toLowerCase();
+
     const [invite] = await db
       .select({
         id: orgInvitations.id,
         orgId: orgInvitations.orgId,
+        email: orgInvitations.email,
       })
       .from(orgInvitations)
       .where(eq(orgInvitations.id, args.token))
@@ -34,6 +39,9 @@ export default defineAction({
     if (!invite) {
       return { declined: false, error: "Invite not found." };
     }
+    if (invite.email.trim().toLowerCase() !== meLower) {
+      throw new Error("This invite was sent to a different email address.");
+    }
 
     await db
       .update(orgInvitations)