@agent-native/core 0.101.14 → 0.102.1

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

@@ -0,0 +1,276 @@
+import { useActionMutation, useActionQuery } from "@agent-native/core/client";
+import { useQueryClient, type QueryClient } from "@tanstack/react-query";
+
+import type { TaskFieldValue } from "../../server/custom-fields/task-fields.js";
+import type { FieldValue } from "../../server/custom-fields/values/store.js";
+import type { Task } from "../../server/tasks/store.js";
+import { LIST_TASKS_QUERY_KEY, invalidateTasks } from "./cache";
+
+export type { Task } from "../../server/tasks/store.js";
+export { LIST_TASKS_QUERY_KEY };
+
+export type TaskWithFields = Task & { fields?: TaskFieldValue[] };
+
+type ListTasksData = { tasks: TaskWithFields[]; hasCompletedTasks?: boolean };
+
+type ListTasksMutationContext = {
+  previous: [readonly unknown[], ListTasksData | undefined][];
+};
+
+function patchListTasksCache(
+  queryClient: QueryClient,
+  patch: (tasks: TaskWithFields[]) => TaskWithFields[],
+) {
+  queryClient.setQueriesData<ListTasksData>(
+    { queryKey: LIST_TASKS_QUERY_KEY },
+    (old) => {
+      if (!old?.tasks) return old;
+      return { ...old, tasks: patch(old.tasks) };
+    },
+  );
+}
+
+function snapshotListTasksQueries(queryClient: QueryClient) {
+  return queryClient.getQueriesData<ListTasksData>({
+    queryKey: LIST_TASKS_QUERY_KEY,
+  });
+}
+
+function restoreListTasksQueries(
+  queryClient: QueryClient,
+  previous: ListTasksMutationContext["previous"],
+) {
+  for (const [key, data] of previous) {
+    queryClient.setQueryData(key, data);
+  }
+}
+
+function getPreviousListTasksQueries(
+  context: unknown,
+): ListTasksMutationContext["previous"] {
+  if (
+    context &&
+    typeof context === "object" &&
+    "previous" in context &&
+    Array.isArray(context.previous)
+  ) {
+    return context.previous;
+  }
+  return [];
+}
+
+async function beginListTasksOptimisticUpdate(
+  queryClient: QueryClient,
+  patch: (tasks: TaskWithFields[]) => TaskWithFields[],
+) {
+  await queryClient.cancelQueries({ queryKey: LIST_TASKS_QUERY_KEY });
+  const previous = snapshotListTasksQueries(queryClient);
+  patchListTasksCache(queryClient, patch);
+  return { previous };
+}
+
+function listTasksOptimisticLifecycle(queryClient: QueryClient) {
+  return {
+    onError: (_error: unknown, _variables: unknown, context: unknown) => {
+      restoreListTasksQueries(
+        queryClient,
+        getPreviousListTasksQueries(context),
+      );
+    },
+    onSettled: () => {
+      queryClient.invalidateQueries({ queryKey: LIST_TASKS_QUERY_KEY });
+    },
+  };
+}
+
+function makeOptimisticTask(title: string, tasks: TaskWithFields[]): Task {
+  const now = new Date().toISOString();
+  const minSortOrder = Math.min(0, ...tasks.map((task) => task.sortOrder));
+  return {
+    id: `optimistic-${crypto.randomUUID()}`,
+    title,
+    done: false,
+    sortOrder: minSortOrder - 1000,
+    ownerEmail: "",
+    createdAt: now,
+    updatedAt: now,
+  };
+}
+
+function getOptimisticTaskId(context: unknown) {
+  if (
+    context &&
+    typeof context === "object" &&
+    "optimisticId" in context &&
+    typeof context.optimisticId === "string"
+  ) {
+    return context.optimisticId;
+  }
+  return undefined;
+}
+
+export function useTasks(opts?: {
+  includeDone?: boolean;
+  includeFields?: boolean;
+}) {
+  // Omit false so GET query params are not serialized as the string "false".
+  const params = {
+    ...(opts?.includeDone ? { includeDone: true } : {}),
+    ...(opts?.includeFields ? { includeFields: true } : {}),
+  };
+  const query = useActionQuery("list-tasks", params);
+  const listData = query.data as ListTasksData | undefined;
+
+  return {
+    ...query,
+    tasks: listData?.tasks ?? [],
+    hasCompletedTasks: listData?.hasCompletedTasks ?? false,
+  };
+}
+
+export function useCreateTask() {
+  const queryClient = useQueryClient();
+  return useActionMutation<Task, { title: string }>("create-task", {
+    onMutate: async ({ title }) => {
+      const existing =
+        queryClient
+          .getQueriesData<ListTasksData>({ queryKey: LIST_TASKS_QUERY_KEY })
+          .find(([, data]) => data?.tasks)?.[1]?.tasks ?? [];
+      const optimisticTask = makeOptimisticTask(title, existing);
+      const context = await beginListTasksOptimisticUpdate(
+        queryClient,
+        (tasks) => [optimisticTask, ...tasks],
+      );
+      return { ...context, optimisticId: optimisticTask.id };
+    },
+    onSuccess: (created, _variables, context) => {
+      const optimisticId = getOptimisticTaskId(context);
+      patchListTasksCache(queryClient, (tasks) =>
+        tasks.map((task) =>
+          optimisticId && task.id === optimisticId ? created : task,
+        ),
+      );
+    },
+    ...listTasksOptimisticLifecycle(queryClient),
+  });
+}
+
+export function useUpdateTask() {
+  const queryClient = useQueryClient();
+  return useActionMutation<
+    TaskWithFields,
+    {
+      taskId: string;
+      title?: string;
+      done?: boolean;
+      fieldValues?: Array<{ fieldId: string; value: FieldValue | null }>;
+    }
+  >("update-task", {
+    onMutate: async ({ taskId, title, done, fieldValues }) => {
+      const timestamp = new Date().toISOString();
+      return beginListTasksOptimisticUpdate(queryClient, (tasks) =>
+        tasks.map((task) =>
+          task.id === taskId
+            ? {
+                ...task,
+                ...(title !== undefined ? { title } : {}),
+                ...(done !== undefined ? { done } : {}),
+                ...(fieldValues && task.fields
+                  ? {
+                      fields: task.fields.map((field) => {
+                        const next = fieldValues.find(
+                          (value) => value.fieldId === field.id,
+                        );
+                        return next ? { ...field, value: next.value } : field;
+                      }),
+                    }
+                  : {}),
+                updatedAt: timestamp,
+              }
+            : task,
+        ),
+      );
+    },
+    onSuccess: (updated) => {
+      patchListTasksCache(queryClient, (tasks) =>
+        tasks.map((task) =>
+          task.id === updated.id
+            ? { ...task, ...updated, fields: updated.fields ?? task.fields }
+            : task,
+        ),
+      );
+    },
+    ...listTasksOptimisticLifecycle(queryClient),
+  });
+}
+
+export function useDeleteTask() {
+  const queryClient = useQueryClient();
+  return useActionMutation<{ ok: true }, { taskId: string }>("delete-task", {
+    onMutate: async ({ taskId }) =>
+      beginListTasksOptimisticUpdate(queryClient, (tasks) =>
+        tasks.filter((task) => task.id !== taskId),
+      ),
+    ...listTasksOptimisticLifecycle(queryClient),
+  });
+}
+
+export function useBulkUpdateTasks() {
+  const queryClient = useQueryClient();
+  return useActionMutation<
+    { tasks: Task[] },
+    { taskIds: string[]; title?: string; done?: boolean }
+  >("bulk-update-tasks", {
+    onMutate: async ({ taskIds, title, done }) => {
+      const selected = new Set(taskIds);
+      const timestamp = new Date().toISOString();
+      return beginListTasksOptimisticUpdate(queryClient, (tasks) =>
+        tasks.map((task) =>
+          selected.has(task.id)
+            ? {
+                ...task,
+                ...(title !== undefined ? { title } : {}),
+                ...(done !== undefined ? { done } : {}),
+                updatedAt: timestamp,
+              }
+            : task,
+        ),
+      );
+    },
+    onSuccess: ({ tasks: updatedTasks }) => {
+      const byId = new Map(updatedTasks.map((task) => [task.id, task]));
+      patchListTasksCache(queryClient, (tasks) =>
+        tasks.map((task) => {
+          const updated = byId.get(task.id);
+          return updated ? { ...task, ...updated, fields: task.fields } : task;
+        }),
+      );
+    },
+    ...listTasksOptimisticLifecycle(queryClient),
+  });
+}
+
+export function useBulkDeleteTasks() {
+  const queryClient = useQueryClient();
+  return useActionMutation<
+    { ok: true; deleted: number },
+    { taskIds: string[] }
+  >("bulk-delete-tasks", {
+    onMutate: async ({ taskIds }) => {
+      const selected = new Set(taskIds);
+      return beginListTasksOptimisticUpdate(queryClient, (tasks) =>
+        tasks.filter((task) => !selected.has(task.id)),
+      );
+    },
+    ...listTasksOptimisticLifecycle(queryClient),
+  });
+}
+
+export function useReorderTasks() {
+  const queryClient = useQueryClient();
+  return useActionMutation("reorder-tasks", {
+    onSettled: () => {
+      invalidateTasks(queryClient);
+    },
+  });
+}

package/corpus/templates/tasks/app/hooks/use-toast.ts

@@ -0,0 +1,188 @@
+import * as React from "react";
+
+import type { ToastActionElement, ToastProps } from "@/components/ui/toast";
+
+const TOAST_LIMIT = 1;
+const TOAST_REMOVE_DELAY = 1000000;
+
+type ToasterToast = ToastProps & {
+  id: string;
+  title?: React.ReactNode;
+  description?: React.ReactNode;
+  action?: ToastActionElement;
+};
+
+const actionTypes = {
+  ADD_TOAST: "ADD_TOAST",
+  UPDATE_TOAST: "UPDATE_TOAST",
+  DISMISS_TOAST: "DISMISS_TOAST",
+  REMOVE_TOAST: "REMOVE_TOAST",
+} as const;
+
+let count = 0;
+
+function genId() {
+  count = (count + 1) % Number.MAX_SAFE_INTEGER;
+  return count.toString();
+}
+
+type ActionType = typeof actionTypes;
+
+type Action =
+  | {
+      type: ActionType["ADD_TOAST"];
+      toast: ToasterToast;
+    }
+  | {
+      type: ActionType["UPDATE_TOAST"];
+      toast: Partial<ToasterToast>;
+    }
+  | {
+      type: ActionType["DISMISS_TOAST"];
+      toastId?: ToasterToast["id"];
+    }
+  | {
+      type: ActionType["REMOVE_TOAST"];
+      toastId?: ToasterToast["id"];
+    };
+
+interface State {
+  toasts: ToasterToast[];
+}
+
+const toastTimeouts = new Map<string, ReturnType<typeof setTimeout>>();
+
+const addToRemoveQueue = (toastId: string) => {
+  if (toastTimeouts.has(toastId)) {
+    return;
+  }
+
+  const timeout = setTimeout(() => {
+    toastTimeouts.delete(toastId);
+    dispatch({
+      type: "REMOVE_TOAST",
+      toastId: toastId,
+    });
+  }, TOAST_REMOVE_DELAY);
+
+  toastTimeouts.set(toastId, timeout);
+};
+
+export const reducer = (state: State, action: Action): State => {
+  switch (action.type) {
+    case "ADD_TOAST":
+      return {
+        ...state,
+        toasts: [action.toast, ...state.toasts].slice(0, TOAST_LIMIT),
+      };
+
+    case "UPDATE_TOAST":
+      return {
+        ...state,
+        toasts: state.toasts.map((t) =>
+          t.id === action.toast.id ? { ...t, ...action.toast } : t,
+        ),
+      };
+
+    case "DISMISS_TOAST": {
+      const { toastId } = action;
+
+      // ! Side effects ! - This could be extracted into a dismissToast() action,
+      // but I'll keep it here for simplicity
+      if (toastId) {
+        addToRemoveQueue(toastId);
+      } else {
+        state.toasts.forEach((toast) => {
+          addToRemoveQueue(toast.id);
+        });
+      }
+
+      return {
+        ...state,
+        toasts: state.toasts.map((t) =>
+          t.id === toastId || toastId === undefined
+            ? {
+                ...t,
+                open: false,
+              }
+            : t,
+        ),
+      };
+    }
+    case "REMOVE_TOAST":
+      if (action.toastId === undefined) {
+        return {
+          ...state,
+          toasts: [],
+        };
+      }
+      return {
+        ...state,
+        toasts: state.toasts.filter((t) => t.id !== action.toastId),
+      };
+  }
+};
+
+const listeners: Array<(state: State) => void> = [];
+
+let memoryState: State = { toasts: [] };
+
+function dispatch(action: Action) {
+  memoryState = reducer(memoryState, action);
+  listeners.forEach((listener) => {
+    listener(memoryState);
+  });
+}
+
+type Toast = Omit<ToasterToast, "id">;
+
+function toast({ ...props }: Toast) {
+  const id = genId();
+
+  const update = (props: ToasterToast) =>
+    dispatch({
+      type: "UPDATE_TOAST",
+      toast: { ...props, id },
+    });
+  const dismiss = () => dispatch({ type: "DISMISS_TOAST", toastId: id });
+
+  dispatch({
+    type: "ADD_TOAST",
+    toast: {
+      ...props,
+      id,
+      open: true,
+      onOpenChange: (open) => {
+        if (!open) dismiss();
+      },
+    },
+  });
+
+  return {
+    id: id,
+    dismiss,
+    update,
+  };
+}
+
+function useToast() {
+  const [state, setState] = React.useState<State>(memoryState);
+
+  React.useEffect(() => {
+    listeners.push(setState);
+    return () => {
+      const index = listeners.indexOf(setState);
+      if (index > -1) {
+        listeners.splice(index, 1);
+      }
+    };
+  }, [state]);
+
+  return {
+    ...state,
+    toast,
+    dismiss: (toastId?: string) => dispatch({ type: "DISMISS_TOAST", toastId }),
+  };
+}
+
+export { useToast, toast };

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

@@ -0,0 +1,140 @@
+import { useActionMutation, useActionQuery } from "@agent-native/core/client";
+import {
+  DEFAULT_TASK_CARD_FIELD_NAMES,
+  TASK_CARD_FIELD_LIMIT,
+} from "@shared/visible-task-fields";
+import { useQueryClient } from "@tanstack/react-query";
+import { useEffect, useRef } from "react";
+
+import type { FieldDefinition } from "@/hooks/use-custom-fields";
+import { useCustomFields } from "@/hooks/use-custom-fields";
+
+import {
+  invalidateVisibleTaskFields,
+  LIST_VISIBLE_TASK_FIELDS_QUERY_KEY,
+} from "./cache";
+
+export { DEFAULT_TASK_CARD_FIELD_NAMES, TASK_CARD_FIELD_LIMIT };
+
+const TASK_CARD_FIELD_NAMES_KEY = "task-card-field-names";
+const TASK_CARD_FIELD_IDS_KEY = "task-card-field-ids";
+
+function readStringArray(key: string, limit: number) {
+  if (typeof window === "undefined") return [];
+
+  try {
+    const stored = window.localStorage.getItem(key);
+    if (!stored) return [];
+    const parsed = JSON.parse(stored);
+    if (!Array.isArray(parsed)) return [];
+    return parsed
+      .filter((value): value is string => typeof value === "string")
+      .slice(0, limit);
+  } catch {
+    return [];
+  }
+}
+
+function fieldIdsForNames(
+  fieldNames: readonly string[],
+  fields: readonly FieldDefinition[],
+  limit: number,
+) {
+  const fieldsByName = new Map(
+    fields.map((field) => [field.title.toLowerCase(), field.id]),
+  );
+  return fieldNames
+    .map((name) => fieldsByName.get(name.toLowerCase()))
+    .filter((id): id is string => Boolean(id))
+    .slice(0, limit);
+}
+
+function readLegacyLocalStorageFieldIds(
+  fields: readonly FieldDefinition[],
+  limit: number,
+) {
+  const storedIds = readStringArray(TASK_CARD_FIELD_IDS_KEY, limit);
+  if (storedIds.length > 0) {
+    if (fields.length === 0) return [];
+    const knownIds = new Set(fields.map((field) => field.id));
+    return storedIds.filter((fieldId) => knownIds.has(fieldId));
+  }
+
+  if (fields.length === 0) return [];
+
+  return fieldIdsForNames(
+    readStringArray(TASK_CARD_FIELD_NAMES_KEY, limit),
+    fields,
+    limit,
+  );
+}
+
+function clearLegacyLocalStorage() {
+  if (typeof window === "undefined") return;
+  window.localStorage.removeItem(TASK_CARD_FIELD_IDS_KEY);
+  window.localStorage.removeItem(TASK_CARD_FIELD_NAMES_KEY);
+}
+
+type ListVisibleTaskFieldsData = { fieldIds: string[] };
+
+export function useVisibleTaskFieldIds() {
+  const query = useActionQuery("list-visible-task-fields", {});
+  const { fields } = useCustomFields();
+  const updateVisibleTaskFields = useUpdateVisibleTaskFields();
+  const migratedRef = useRef(false);
+  const listData = query.data as ListVisibleTaskFieldsData | undefined;
+
+  useEffect(() => {
+    if (migratedRef.current || query.isPending || !query.isSuccess) return;
+
+    const hasLegacyIds =
+      readStringArray(TASK_CARD_FIELD_IDS_KEY, TASK_CARD_FIELD_LIMIT).length >
+      0;
+    const hasLegacyNames =
+      readStringArray(TASK_CARD_FIELD_NAMES_KEY, TASK_CARD_FIELD_LIMIT).length >
+      0;
+    if (!hasLegacyIds && !hasLegacyNames) {
+      migratedRef.current = true;
+      return;
+    }
+
+    if (fields.length === 0) return;
+
+    const legacyFieldIds = readLegacyLocalStorageFieldIds(
+      fields,
+      TASK_CARD_FIELD_LIMIT,
+    );
+    if (legacyFieldIds.length === 0) {
+      migratedRef.current = true;
+      clearLegacyLocalStorage();
+      return;
+    }
+
+    void updateVisibleTaskFields
+      .mutateAsync({ fieldIds: legacyFieldIds })
+      .then(() => {
+        clearLegacyLocalStorage();
+        migratedRef.current = true;
+      })
+      .catch(() => {
+        // Keep localStorage so a later retry can migrate the saved selection.
+      });
+  }, [fields, query.isPending, query.isSuccess, updateVisibleTaskFields]);
+
+  return {
+    ...query,
+    fieldIds: listData?.fieldIds ?? [],
+  };
+}
+
+export function useUpdateVisibleTaskFields() {
+  const queryClient = useQueryClient();
+  return useActionMutation<{ fieldIds: string[] }, { fieldIds: string[] }>(
+    "update-visible-task-fields",
+    {
+      onSettled: () => {
+        invalidateVisibleTaskFields(queryClient);
+      },
+    },
+  );
+}

package/corpus/templates/tasks/app/lib/app-config.ts

@@ -0,0 +1,11 @@
+const rawAppName = "tasks";
+const rawAppTitle = "Tasks";
+
+const APP_NAME_PLACEHOLDER = "{" + "{APP_NAME}}";
+const APP_TITLE_PLACEHOLDER = "{" + "{APP_TITLE}}";
+
+export const APP_NAME =
+  rawAppName === APP_NAME_PLACEHOLDER ? "tasks" : rawAppName;
+
+export const APP_TITLE =
+  rawAppTitle === APP_TITLE_PLACEHOLDER ? "Tasks" : rawAppTitle;

package/corpus/templates/tasks/app/lib/tab-id.ts

@@ -0,0 +1 @@
+export const TAB_ID = Math.random().toString(36).slice(2, 10);

package/corpus/templates/tasks/app/lib/utils.ts

@@ -0,0 +1 @@
+export { cn } from "@agent-native/core/client";