@agent-native/core 0.101.14 → 0.102.1

package/corpus/templates/tasks/app/components/ui/skeleton.tsx

@@ -0,0 +1 @@
+export * from "@agent-native/toolkit/ui/skeleton";

package/corpus/templates/tasks/app/components/ui/slider.tsx

@@ -0,0 +1 @@
+export * from "@agent-native/toolkit/ui/slider";

package/corpus/templates/tasks/app/components/ui/sonner.tsx

@@ -0,0 +1 @@
+export * from "@agent-native/toolkit/ui/sonner";

package/corpus/templates/tasks/app/components/ui/spinner.tsx

@@ -0,0 +1 @@
+export * from "@agent-native/toolkit/ui/spinner";

package/corpus/templates/tasks/app/components/ui/switch.tsx

@@ -0,0 +1 @@
+export * from "@agent-native/toolkit/ui/switch";

package/corpus/templates/tasks/app/components/ui/table.tsx

@@ -0,0 +1 @@
+export * from "@agent-native/toolkit/ui/table";

package/corpus/templates/tasks/app/components/ui/tabs.tsx

@@ -0,0 +1 @@
+export * from "@agent-native/toolkit/ui/tabs";

package/corpus/templates/tasks/app/components/ui/textarea.tsx

@@ -0,0 +1 @@
+export * from "@agent-native/toolkit/ui/textarea";

package/corpus/templates/tasks/app/components/ui/toast.tsx

@@ -0,0 +1 @@
+export * from "@agent-native/toolkit/ui/toast";

package/corpus/templates/tasks/app/components/ui/toaster.tsx

@@ -0,0 +1 @@
+export * from "@agent-native/toolkit/ui/toaster";

package/corpus/templates/tasks/app/components/ui/toggle-group.tsx

@@ -0,0 +1 @@
+export * from "@agent-native/toolkit/ui/toggle-group";

package/corpus/templates/tasks/app/components/ui/toggle.tsx

@@ -0,0 +1,43 @@
+import * as TogglePrimitive from "@radix-ui/react-toggle";
+import { cva, type VariantProps } from "class-variance-authority";
+import * as React from "react";
+
+import { cn } from "@/lib/utils";
+
+const toggleVariants = cva(
+  "inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 gap-2",
+  {
+    variants: {
+      variant: {
+        default: "bg-transparent",
+        outline:
+          "border border-input bg-transparent hover:bg-accent hover:text-accent-foreground",
+      },
+      size: {
+        default: "h-10 px-3 min-w-10",
+        sm: "h-9 px-2.5 min-w-9",
+        lg: "h-11 px-5 min-w-11",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+    },
+  },
+);
+
+const Toggle = React.forwardRef<
+  React.ElementRef<typeof TogglePrimitive.Root>,
+  React.ComponentPropsWithoutRef<typeof TogglePrimitive.Root> &
+    VariantProps<typeof toggleVariants>
+>(({ className, variant, size, ...props }, ref) => (
+  <TogglePrimitive.Root
+    ref={ref}
+    className={cn(toggleVariants({ variant, size, className }))}
+    {...props}
+  />
+));
+
+Toggle.displayName = TogglePrimitive.Root.displayName;
+
+export { Toggle, toggleVariants };

package/corpus/templates/tasks/app/components/ui/tooltip.tsx

@@ -0,0 +1 @@
+export * from "@agent-native/toolkit/ui/tooltip";

package/corpus/templates/tasks/app/components/ui/use-toast.ts

@@ -0,0 +1,3 @@
+import { useToast, toast } from "@/hooks/use-toast";
+
+export { useToast, toast };

package/corpus/templates/tasks/app/entry.client.tsx

@@ -0,0 +1,19 @@
+// Import only the tiny URL-helper module, not the full client barrel.
+// This keeps the ~650-700 KB gzip chat stack off the static import closure
+// of the client entry point so it can't block the first page parse.
+import { appBasePath } from "@agent-native/core/client/api-path";
+import { hydrateRoot } from "react-dom/client";
+import { HydratedRouter } from "react-router/dom";
+
+const basePath = appBasePath();
+const pathname = window.location.pathname;
+const routerBasePath =
+  basePath && (pathname === basePath || pathname.startsWith(`${basePath}/`))
+    ? basePath
+    : "";
+const context = (
+  window as Window & { __reactRouterContext?: { basename?: string } }
+).__reactRouterContext;
+if (context) context.basename = routerBasePath;
+
+hydrateRoot(document, <HydratedRouter />);

package/corpus/templates/tasks/app/entry.server.tsx

@@ -0,0 +1,10 @@
+import {
+  createDocumentRequestHandler,
+  streamTimeout,
+} from "@agent-native/core/server/entry-server";
+import { ServerRouter } from "react-router";
+
+const handleDocumentRequest = createDocumentRequestHandler(ServerRouter);
+
+export { streamTimeout };
+export default handleDocumentRequest;

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

@@ -0,0 +1,93 @@
+/* Self-hosted via @fontsource-variable/inter — no render-blocking Google Fonts request */
+@import "@fontsource-variable/inter";
+
+@import "tailwindcss";
+@import "@agent-native/core/styles/agent-native.css";
+@import "@agent-native/toolkit/styles.css";
+
+@source "./**/*.{ts,tsx}";
+
+:root {
+  --background: 0 0% 100%;
+  --foreground: 220 10% 10%;
+  --card: 0 0% 100%;
+  --card-foreground: 220 10% 10%;
+  --popover: 0 0% 100%;
+  --popover-foreground: 220 10% 10%;
+  --primary: 220 10% 15%;
+  --primary-foreground: 0 0% 100%;
+  --secondary: 220 10% 95%;
+  --secondary-foreground: 220 10% 15%;
+  --muted: 220 10% 95%;
+  --muted-foreground: 220 5% 45%;
+  --accent: 220 10% 95%;
+  --accent-foreground: 220 10% 15%;
+  --destructive: 0 84% 60%;
+  --destructive-foreground: 0 0% 98%;
+  --border: 220 10% 90%;
+  --input: 220 10% 90%;
+  --ring: 220 10% 40%;
+  --radius: 0.5rem;
+  --sidebar-background: 220 10% 97%;
+  --sidebar-foreground: 220 5% 45%;
+  --sidebar-primary: 220 10% 15%;
+  --sidebar-primary-foreground: 0 0% 100%;
+  --sidebar-accent: 220 10% 95%;
+  --sidebar-accent-foreground: 220 10% 15%;
+  --sidebar-border: 220 10% 90%;
+  --sidebar-ring: 220 10% 40%;
+}
+
+.dark {
+  --background: 220 6% 6%;
+  --foreground: 0 0% 90%;
+  --card: 220 5% 6%;
+  --card-foreground: 0 0% 90%;
+  --popover: 220 5% 6%;
+  --popover-foreground: 0 0% 90%;
+  --primary: 0 0% 75%;
+  --primary-foreground: 220 6% 6%;
+  --secondary: 220 4% 12%;
+  --secondary-foreground: 0 0% 90%;
+  --muted: 220 4% 10%;
+  --muted-foreground: 220 4% 60%;
+  --accent: 220 4% 13%;
+  --accent-foreground: 0 0% 90%;
+  --destructive: 0 63% 51%;
+  --destructive-foreground: 0 0% 98%;
+  --border: 220 4% 14%;
+  --input: 220 4% 14%;
+  --ring: 0 0% 60%;
+  --radius: 0.5rem;
+  --sidebar-background: 220 6% 4%;
+  --sidebar-foreground: 220 4% 60%;
+  --sidebar-primary: 0 0% 75%;
+  --sidebar-primary-foreground: 220 6% 6%;
+  --sidebar-accent: 220 4% 10%;
+  --sidebar-accent-foreground: 0 0% 90%;
+  --sidebar-border: 220 4% 10%;
+  --sidebar-ring: 0 0% 60%;
+}
+
+@layer base {
+  body {
+    @apply bg-background text-foreground;
+    font-family: "Inter Variable", "Inter", sans-serif;
+    font-feature-settings: "cv02", "cv03", "cv04", "cv11";
+  }
+}
+
+::-webkit-scrollbar {
+  width: 5px;
+  height: 5px;
+}
+::-webkit-scrollbar-track {
+  background: transparent;
+}
+::-webkit-scrollbar-thumb {
+  background: hsl(var(--border));
+  border-radius: 3px;
+}
+::-webkit-scrollbar-thumb:hover {
+  background: hsl(var(--muted-foreground) / 0.4);
+}

package/corpus/templates/tasks/app/hooks/cache.ts

@@ -0,0 +1,31 @@
+import type { QueryClient } from "@tanstack/react-query";
+
+export const LIST_INBOX_ITEMS_QUERY_KEY = [
+  "action",
+  "list-inbox-items",
+] as const;
+export const LIST_TASKS_QUERY_KEY = ["action", "list-tasks"] as const;
+export const LIST_CUSTOM_FIELDS_QUERY_KEY = [
+  "action",
+  "list-custom-fields",
+] as const;
+export const LIST_VISIBLE_TASK_FIELDS_QUERY_KEY = [
+  "action",
+  "list-visible-task-fields",
+] as const;
+
+export function invalidateInboxItems(qc: QueryClient) {
+  return qc.invalidateQueries({ queryKey: LIST_INBOX_ITEMS_QUERY_KEY });
+}
+
+export function invalidateTasks(qc: QueryClient) {
+  return qc.invalidateQueries({ queryKey: LIST_TASKS_QUERY_KEY });
+}
+
+export function invalidateCustomFields(qc: QueryClient) {
+  return qc.invalidateQueries({ queryKey: LIST_CUSTOM_FIELDS_QUERY_KEY });
+}
+
+export function invalidateVisibleTaskFields(qc: QueryClient) {
+  return qc.invalidateQueries({ queryKey: LIST_VISIBLE_TASK_FIELDS_QUERY_KEY });
+}

package/corpus/templates/tasks/app/hooks/use-custom-fields.ts

@@ -0,0 +1,93 @@
+import { useActionMutation, useActionQuery } from "@agent-native/core/client";
+import { useQueryClient } from "@tanstack/react-query";
+
+import type {
+  FieldDefinition,
+  FieldType,
+} from "../../server/custom-fields/types.js";
+import {
+  invalidateCustomFields,
+  invalidateTasks,
+  invalidateVisibleTaskFields,
+} from "./cache";
+
+export type {
+  FieldConfig,
+  FieldDefinition,
+  FieldType,
+  SelectColorToken,
+  SelectOption,
+} from "../../server/custom-fields/types.js";
+export type {
+  FieldValue,
+  FieldValueInput,
+} from "../../server/custom-fields/values/store.js";
+export type { TaskFieldValue } from "../../server/custom-fields/task-fields.js";
+
+type ListCustomFieldsData = { fields: FieldDefinition[] };
+
+export function useCustomFields() {
+  const query = useActionQuery("list-custom-fields", {});
+  const listData = query.data as ListCustomFieldsData | undefined;
+
+  return {
+    ...query,
+    fields: listData?.fields ?? [],
+  };
+}
+
+export function useCreateCustomField() {
+  const queryClient = useQueryClient();
+  return useActionMutation<
+    FieldDefinition,
+    { title: string; type: FieldType; config?: unknown }
+  >("create-custom-field", {
+    onSettled: () => {
+      invalidateCustomFields(queryClient);
+      invalidateTasks(queryClient);
+      invalidateVisibleTaskFields(queryClient);
+    },
+  });
+}
+
+export function useUpdateCustomField() {
+  const queryClient = useQueryClient();
+  return useActionMutation<
+    FieldDefinition,
+    { fieldId: string; title?: string; config?: unknown }
+  >("update-custom-field", {
+    onSettled: () => {
+      invalidateCustomFields(queryClient);
+      invalidateTasks(queryClient);
+      invalidateVisibleTaskFields(queryClient);
+    },
+  });
+}
+
+export function useDeleteCustomField() {
+  const queryClient = useQueryClient();
+  return useActionMutation<
+    { ok: true; deletedValues: number },
+    { fieldId: string }
+  >("delete-custom-field", {
+    onSettled: () => {
+      invalidateCustomFields(queryClient);
+      invalidateTasks(queryClient);
+      invalidateVisibleTaskFields(queryClient);
+    },
+  });
+}
+
+export function useReorderCustomFields() {
+  const queryClient = useQueryClient();
+  return useActionMutation<
+    { fields: FieldDefinition[] },
+    { fieldIds: string[] }
+  >("reorder-custom-fields", {
+    onSettled: () => {
+      invalidateCustomFields(queryClient);
+      invalidateTasks(queryClient);
+      invalidateVisibleTaskFields(queryClient);
+    },
+  });
+}

package/corpus/templates/tasks/app/hooks/use-inbox-items.ts

@@ -0,0 +1,196 @@
+import { useActionMutation, useActionQuery } from "@agent-native/core/client";
+import { useQueryClient, type QueryClient } from "@tanstack/react-query";
+
+import type { InboxItem } from "../../server/inbox/store.js";
+import type { Task } from "../../server/tasks/store.js";
+import {
+  invalidateInboxItems,
+  invalidateTasks,
+  LIST_INBOX_ITEMS_QUERY_KEY,
+} from "./cache";
+
+export type { InboxItem } from "../../server/inbox/store.js";
+
+type ListInboxItemsData = { items: InboxItem[] };
+
+type InboxMutationContext = {
+  previous: [readonly unknown[], ListInboxItemsData | undefined][];
+};
+
+function patchListInboxItemsCache(
+  queryClient: QueryClient,
+  patch: (items: InboxItem[]) => InboxItem[],
+) {
+  queryClient.setQueriesData<ListInboxItemsData>(
+    { queryKey: LIST_INBOX_ITEMS_QUERY_KEY },
+    (old) => {
+      if (!old?.items) return old;
+      return { items: patch(old.items) };
+    },
+  );
+}
+
+function snapshotListInboxItemsQueries(queryClient: QueryClient) {
+  return queryClient.getQueriesData<ListInboxItemsData>({
+    queryKey: LIST_INBOX_ITEMS_QUERY_KEY,
+  });
+}
+
+function restoreListInboxItemsQueries(
+  queryClient: QueryClient,
+  previous: InboxMutationContext["previous"],
+) {
+  for (const [key, data] of previous) {
+    queryClient.setQueryData(key, data);
+  }
+}
+
+export function runMarkInboxItemReadyInvalidation(queryClient: QueryClient) {
+  invalidateInboxItems(queryClient);
+  invalidateTasks(queryClient);
+}
+
+export function useInboxItems() {
+  const query = useActionQuery("list-inbox-items", {});
+  const listData = query.data as ListInboxItemsData | undefined;
+
+  return {
+    ...query,
+    items: listData?.items ?? [],
+  };
+}
+
+export function useCreateInboxItem() {
+  const queryClient = useQueryClient();
+  return useActionMutation<InboxItem, { title: string }>("create-inbox-item", {
+    onSettled: () => {
+      invalidateInboxItems(queryClient);
+    },
+  });
+}
+
+export function useUpdateInboxItem() {
+  const queryClient = useQueryClient();
+  return useActionMutation<InboxItem, { inboxItemId: string; title?: string }>(
+    "update-inbox-item",
+    {
+      onSettled: () => {
+        invalidateInboxItems(queryClient);
+      },
+    },
+  );
+}
+
+export function useDeleteInboxItem() {
+  const queryClient = useQueryClient();
+  return useActionMutation<{ ok: true }, { inboxItemId: string }>(
+    "delete-inbox-item",
+    {
+      onSettled: () => {
+        invalidateInboxItems(queryClient);
+      },
+    },
+  );
+}
+
+export function useMarkInboxItemReady() {
+  const queryClient = useQueryClient();
+  return useActionMutation<{ task: Task }, { inboxItemId: string }>(
+    "mark-inbox-item-ready",
+    {
+      onMutate: async ({ inboxItemId }) => {
+        await queryClient.cancelQueries({
+          queryKey: LIST_INBOX_ITEMS_QUERY_KEY,
+        });
+        const previous = snapshotListInboxItemsQueries(queryClient);
+
+        patchListInboxItemsCache(queryClient, (items) =>
+          items.filter((item) => item.id !== inboxItemId),
+        );
+
+        return { previous };
+      },
+      onError: (_error, _variables, context) => {
+        restoreListInboxItemsQueries(
+          queryClient,
+          (context as InboxMutationContext | undefined)?.previous ?? [],
+        );
+      },
+      onSettled: () => {
+        runMarkInboxItemReadyInvalidation(queryClient);
+      },
+    },
+  );
+}
+
+export function useBulkMarkInboxItemsReady() {
+  const queryClient = useQueryClient();
+  return useActionMutation<{ tasks: Task[] }, { inboxItemIds: string[] }>(
+    "bulk-mark-inbox-items-ready",
+    {
+      onMutate: async ({ inboxItemIds }) => {
+        await queryClient.cancelQueries({
+          queryKey: LIST_INBOX_ITEMS_QUERY_KEY,
+        });
+        const previous = snapshotListInboxItemsQueries(queryClient);
+        const selected = new Set(inboxItemIds);
+
+        patchListInboxItemsCache(queryClient, (items) =>
+          items.filter((item) => !selected.has(item.id)),
+        );
+
+        return { previous };
+      },
+      onError: (_error, _variables, context) => {
+        restoreListInboxItemsQueries(
+          queryClient,
+          (context as InboxMutationContext | undefined)?.previous ?? [],
+        );
+      },
+      onSettled: () => {
+        runMarkInboxItemReadyInvalidation(queryClient);
+      },
+    },
+  );
+}
+
+export function useBulkDeleteInboxItems() {
+  const queryClient = useQueryClient();
+  return useActionMutation<
+    { ok: true; deleted: number },
+    { inboxItemIds: string[] }
+  >("bulk-delete-inbox-items", {
+    onMutate: async ({ inboxItemIds }) => {
+      await queryClient.cancelQueries({ queryKey: LIST_INBOX_ITEMS_QUERY_KEY });
+      const previous = snapshotListInboxItemsQueries(queryClient);
+      const selected = new Set(inboxItemIds);
+
+      patchListInboxItemsCache(queryClient, (items) =>
+        items.filter((item) => !selected.has(item.id)),
+      );
+
+      return { previous };
+    },
+    onError: (_error, _variables, context) => {
+      restoreListInboxItemsQueries(
+        queryClient,
+        (context as InboxMutationContext | undefined)?.previous ?? [],
+      );
+    },
+    onSettled: () => {
+      invalidateInboxItems(queryClient);
+    },
+  });
+}
+
+export function useReorderInboxItems() {
+  const queryClient = useQueryClient();
+  return useActionMutation<{ items: InboxItem[] }, { inboxItemIds: string[] }>(
+    "reorder-inbox-items",
+    {
+      onSettled: () => {
+        invalidateInboxItems(queryClient);
+      },
+    },
+  );
+}

package/corpus/templates/tasks/app/hooks/use-mobile.tsx

@@ -0,0 +1,21 @@
+import * as React from "react";
+
+const MOBILE_BREAKPOINT = 768;
+
+export function useIsMobile() {
+  const [isMobile, setIsMobile] = React.useState<boolean | undefined>(
+    undefined,
+  );
+
+  React.useEffect(() => {
+    const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
+    const onChange = () => {
+      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
+    };
+    mql.addEventListener("change", onChange);
+    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
+    return () => mql.removeEventListener("change", onChange);
+  }, []);
+
+  return !!isMobile;
+}

package/corpus/templates/tasks/app/hooks/use-navigation-state.ts

@@ -0,0 +1,40 @@
+import { appPath, useAgentRouteState } from "@agent-native/core/client";
+import { parseIncludeDoneParam } from "@shared/boolean-param";
+import {
+  type NavigateCommand,
+  type NavigationState,
+  buildNavigatePath,
+  pathForView,
+  viewForPath,
+} from "@shared/navigation";
+import { useLocation } from "react-router";
+
+import { TAB_ID } from "@/lib/tab-id";
+
+export type { NavigateCommand, NavigationState };
+
+export function useNavigationState() {
+  const location = useLocation();
+
+  useAgentRouteState<NavigationState, NavigateCommand & { _writeId?: string }>({
+    browserTabId: TAB_ID,
+    requestSource: TAB_ID,
+    getNavigationState: ({ pathname, search }) => {
+      const params = new URLSearchParams(search);
+      return {
+        view: viewForPath(pathname),
+        path: appPath(pathname),
+        includeDone: parseIncludeDoneParam(params.get("includeDone")),
+        taskId: params.get("task") ?? undefined,
+        inboxItemId: params.get("inboxItem") ?? undefined,
+        fieldId: params.get("field") ?? undefined,
+      };
+    },
+    getCommandPath: (command) => {
+      const currentParams = new URLSearchParams(location.search);
+      return buildNavigatePath(pathForView(command.view), command, {
+        includeDone: parseIncludeDoneParam(currentParams.get("includeDone")),
+      });
+    },
+  });
+}