@alpaca-editor/core 1.0.4104 → 1.0.4105

package/dist/revision.d.ts

@@ -1,2 +1,2 @@
-export declare const version = "1.0.4104";
-export declare const buildDate = "2025-09-23 14:05:05";
+export declare const version = "1.0.4105";
+export declare const buildDate = "2025-09-23 15:04:32";

package/dist/revision.js

@@ -1,3 +1,3 @@
-export const version = "1.0.4104";
-export const buildDate = "2025-09-23 14:05:05";
+export const version = "1.0.4105";
+export const buildDate = "2025-09-23 15:04:32";
 //# sourceMappingURL=revision.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alpaca-editor/core",
-  "version": "1.0.4104",
+  "version": "1.0.4105",
   "publishConfig": {
     "access": "public"
   },

package/src/editor/MainLayout.tsx

@@ -84,7 +84,7 @@ export default function MainLayout(props: MainLayoutProps) {
   }
 
   return (
-    <div className={classNames("flex font-light select-none", className)}>
+    <div className={classNames("flex font-normal select-none", className)}>
       <div className="flex flex-1">
         {!props.view.hideViewSelector && <LeftToolbar />}
         <div className="flex flex-1 flex-col">

package/src/editor/Terminal.tsx

@@ -175,10 +175,10 @@ export const Terminal = forwardRef<
   }, [messages, response]);
 
   const responseBoxClasses =
-    "text-xs self-stretch text-gray-700 p-2 rounded border border-theme-secondary bg-theme-secondary-light min-h-8 flex flex-col justify-end";
+    "text-xs self-stretch text-dark p-2 rounded border border-theme-secondary bg-theme-secondary-light min-h-8 flex flex-col justify-end";
   const getClasses = (m: Message) => {
     if (m.type === "response") return responseBoxClasses;
-    return "text-xs text-gray-700 bg-indigo-100 border border-indigo-300 p-2 rounded prompt";
+    return "text-xs text-dark bg-indigo-100 border border-indigo-300 p-2 rounded prompt";
   };
 
   // Expose the submit function via the ref.

package/src/editor/ai/AgentTerminal.tsx

@@ -5,22 +5,7 @@ import React, {
   useCallback,
   useLayoutEffect,
 } from "react";
-import {
-  Send,
-  Bot,
-  AlertCircle,
-  Loader2,
-  User,
-  X,
-  FileText,
-  Puzzle,
-  Type,
-  Plus,
-  MessageSquare,
-  Wand2,
-  Square,
-  ChevronDown,
-} from "lucide-react";
+import { Send, AlertCircle, Loader2, User, Wand2, Square } from "lucide-react";
 import { DancingDots } from "./DancingDots";
 import {
   AgentChatMessage,
@@ -52,6 +37,8 @@ import {
   PopoverContent,
   PopoverTrigger,
 } from "../../components/ui/popover";
+import { SecretAgentIcon } from "../ui/Icons";
+import { formatTime, formatDateTime } from "../utils";
 
 // Simple user message component
 const UserMessage = ({ message }: { message: AgentChatMessage }) => {
@@ -62,10 +49,10 @@ const UserMessage = ({ message }: { message: AgentChatMessage }) => {
       </div>
       <div className="min-w-0 flex-1 select-text">
         <div className="mb-1 flex items-center gap-2">
-          <span className="text-sm font-medium text-gray-900">You</span>
+          <span className="text-xs font-medium text-gray-900">You</span>
           {message.createdDate && (
             <span className="text-xs text-gray-400">
-              {new Date(message.createdDate).toLocaleTimeString()}
+              {formatTime(new Date(message.createdDate))}
             </span>
           )}
         </div>
@@ -2233,9 +2220,10 @@ export function AgentTerminal({
         {messages.length === 0 && !error && (
           <div className="flex h-full items-center justify-center p-8">
             <div className="text-center">
-              <Bot
-                className="mx-auto mb-4 h-12 w-12 text-gray-400"
+              <SecretAgentIcon
+                size={48}
                 strokeWidth={1}
+                className="mx-auto mb-4 text-gray-400"
               />
               <h3 className="mb-2 text-lg font-medium text-gray-900">
                 Start a conversation

package/src/editor/ai/Agents.tsx

@@ -502,7 +502,6 @@ export function Agents({ closeButton }: { closeButton?: React.ReactNode }) {
     return (
       <div className="flex h-full items-center justify-center">
         <div className="w-72">
-   
           {loadingProfiles ? (
             <div className="text-center text-xs text-gray-500">
               Loading profiles...
@@ -670,7 +669,20 @@ export function Agents({ closeButton }: { closeButton?: React.ReactNode }) {
                               {agent.name}
                             </div>
                             <div className="text-xs text-gray-400">
-                              {new Date(agent.updatedDate).toLocaleString()}
+                              {(() => {
+                                try {
+                                  const {
+                                    formatDateTime,
+                                  } = require("../utils");
+                                  return formatDateTime(
+                                    new Date(agent.updatedDate),
+                                  );
+                                } catch {
+                                  return new Date(
+                                    agent.updatedDate,
+                                  ).toLocaleString();
+                                }
+                              })()}
                             </div>
                           </div>
                           <SimpleIconButton

package/src/editor/ai/AiResponseMessage.tsx

@@ -1,13 +1,15 @@
-import React, { useState, useEffect, useMemo } from "react";
+import { useState, useEffect, useMemo } from "react";
+import { formatTime } from "../utils";
 
 import { useEditContext } from "../client/editContext";
 import { EditOperation } from "../../types";
 import { Message, ToolCall } from "./types";
 import { ToolCallDisplay } from "./ToolCallDisplay";
 
-import { X, Bot, Loader2 } from "lucide-react";
+import { X } from "lucide-react";
 import { Button } from "../../components/ui/button";
 import { Checkbox } from "../../components/ui/checkbox";
+import { SecretAgentIcon } from "../ui/Icons";
 
 type QuickAction = {
   id?: string;
@@ -464,15 +466,15 @@ export function AiResponseMessage({
   return (
     <div className="flex gap-3 p-4" data-testid="agent-message">
       <div className="flex-shrink-0">
-        <Bot className="h-6 w-6 text-green-600" strokeWidth={1} />
+        <SecretAgentIcon size={24} strokeWidth={1} className="text-gray-2" />
       </div>
       <div className="min-w-0 flex-1 select-text">
         <div className="mb-1 flex items-center gap-2">
-          <span className="text-sm font-medium text-gray-900">Agent</span>
+          <span className="text-dark text-xs font-medium">Agent</span>
 
           {lastMessage && lastMessage.createdDate && (
             <span className="text-xs text-gray-400">
-              {new Date(lastMessage.createdDate).toLocaleTimeString()}
+              {formatTime(new Date(lastMessage.createdDate))}
             </span>
           )}
         </div>

package/src/editor/client/EditorShell.tsx

@@ -2157,6 +2157,7 @@ export function EditorShell({
     revision,
     comments,
     setComments,
+    availableCommentTags,
     selectedComment,
     setSelectedComment,
     loadComments,
@@ -2172,6 +2173,7 @@ export function EditorShell({
     setShowSuggestedEdits,
     showSuggestedEditsDiff,
     setShowSuggestedEditsDiff,
+    showComments,
     showResolvedComments,
     setShowResolvedComments,
     showComponentNavigator,

package/src/editor/control-center/IndexOverview.tsx

@@ -9,6 +9,7 @@ import {
 } from "lucide-react";
 
 import { classNames } from "primereact/utils";
+import { formatDateOnly, formatDateTime } from "../utils";
 import {
   IndexStatus,
   StagingStatus,
@@ -527,7 +528,7 @@ export function IndexOverview() {
                           </div>
                           <div className="text-xs text-gray-500">
                             {batch.created
-                              ? new Date(batch.created).toLocaleDateString()
+                              ? formatDateOnly(new Date(batch.created))
                               : "Unknown"}
                           </div>
                         </div>
@@ -584,7 +585,7 @@ export function IndexOverview() {
                           )}
                         </div>
                         <div className="ml-2 shrink-0 text-xs text-gray-500">
-                          {new Date(it.created).toLocaleString()}
+                          {formatDateTime(new Date(it.created))}
                         </div>
                       </div>
                     ))}

package/src/editor/control-center/WebSocketMessages.tsx

@@ -1,4 +1,5 @@
 import { useState, useEffect, useRef } from "react";
+import { formatTime } from "../utils";
 import { useEditContext } from "../client/editContext";
 
 export function WebSocketMessages() {
@@ -34,11 +35,8 @@ export function WebSocketMessages() {
 
   const formatTimestamp = (isoString: string) => {
     const date = new Date(isoString);
-    return (
-      date.toLocaleTimeString() +
-      "." +
-      date.getMilliseconds().toString().padStart(3, "0")
-    );
+    const base = formatTime(date);
+    return base + "." + date.getMilliseconds().toString().padStart(3, "0");
   };
 
   const getMessageTypeColor = (type: string) => {

package/src/editor/media-selector/MediaFolderBrowser.tsx

@@ -195,7 +195,7 @@ export function MediaFolderBrowser({
             />
           </div>
           <div className="min-w-0 flex-1">
-            <div className="truncate text-sm font-medium text-gray-900">
+            <div className="text-dark truncate text-xs font-medium">
               {t.name}
             </div>
             <div className="mt-1 text-xs text-gray-500">Media File</div>
@@ -305,7 +305,7 @@ export function MediaFolderBrowser({
       {/* Selected Item Info */}
       {selectedImage && (
         <div className="border-t bg-gray-50 p-3">
-          <div className="truncate text-sm font-medium text-gray-900">
+          <div className="text-dark truncate text-xs font-medium">
             Selected: {selectedImage.name}
           </div>
           <div className="mt-1 text-xs text-gray-500">

package/src/editor/menubar/ActiveUsers.tsx

@@ -9,6 +9,7 @@ import { useEffect, useState } from "react";
 import { getItemVisitors, ItemVisitor } from "../services/editService";
 import { VerticalDotsIcon } from "../ui/Icons";
 import { AboutDialog } from "../client/AboutDialog";
+import { formatDateOnly } from "../utils";
 
 type UserListItem = {
   type: "active" | "visitor";
@@ -258,7 +259,7 @@ export function ActiveUsers() {
                 />
               </div>
               <div className="min-w-0 flex-1">
-                <div className="text-sm font-medium text-gray-900">About</div>
+                <div className="text-dark text-xs font-medium">About</div>
               </div>
             </div>
             <div
@@ -272,7 +273,7 @@ export function ActiveUsers() {
                 />
               </div>
               <div className="min-w-0 flex-1">
-                <div className="text-sm font-medium text-gray-900">Log Out</div>
+                <div className="text-dark text-xs font-medium">Log Out</div>
               </div>
             </div>
           </div>
@@ -296,5 +297,5 @@ function formatTimeAgo(date: Date): string {
   if (diffInSeconds < 604800)
     return `${Math.floor(diffInSeconds / 86400)}d ago`;
 
-  return date.toLocaleDateString();
+  return formatDateOnly(date);
 }

package/src/editor/reviews/Comments.tsx

@@ -22,6 +22,8 @@ import {
   Tags,
   Lightbulb,
 } from "lucide-react";
+import { getChildren } from "../services/contentService";
+import { getComments as getCommentsApi } from "../services/reviewsService";
 
 // Define a union type for feedback items:
 export type FeedbackItem = CommentType | SuggestedEdit;
@@ -56,52 +58,135 @@ export function Comments() {
   const availableTags = editContext?.availableCommentTags || [];
 
   useEffect(() => {
-    // Retrieve your list of comments (and ensure there's an array of suggested edits,
-    // for instance from your editContext)
-    const comments: CommentType[] = editContext?.comments || [];
-    const suggestedEdits: SuggestedEdit[] = editContext?.suggestedEdits || [];
+    let cancelled = false;
 
-    // Filter out applied suggestions if hideAppliedSuggestions is true
-    const filteredSuggestedEdits = hideAppliedSuggestions
-      ? suggestedEdits.filter((edit) => edit.status !== "applied")
-      : suggestedEdits;
+    const load = async () => {
+      // Base lists from context
+      const mainComments: CommentType[] = editContext?.comments || [];
+      const suggestedEdits: SuggestedEdit[] = editContext?.suggestedEdits || [];
 
-    // Start with combined list
-    const combined: FeedbackItem[] = [...comments, ...filteredSuggestedEdits];
+      // Filter out applied suggestions if hideAppliedSuggestions is true
+      const filteredSuggestedEdits = hideAppliedSuggestions
+        ? suggestedEdits.filter((edit) => edit.status !== "applied")
+        : suggestedEdits;
 
-    // Apply scope filter (item-only vs item + children)
-    const baseItemId =
-      (editContext?.selection && editContext.selection[0]) ||
-      editContext?.currentItemDescriptor?.id ||
-      undefined;
+      // Start with main page comments and suggestions
+      let allComments: CommentType[] = [...mainComments];
 
-    const scoped =
-      scope === "itemOnly" && baseItemId
-        ? combined.filter((item: any) => item.itemId === baseItemId)
+      // If including children, fetch comments for descendant pages and merge
+      const basePageId = editContext?.currentItemDescriptor?.id;
+      const baseLanguage = editContext?.currentItemDescriptor?.language;
+      const baseVersion = editContext?.currentItemDescriptor?.version;
+
+      if (scope === "all" && basePageId && baseLanguage && baseVersion) {
+        try {
+          const sessionId = editContext?.sessionId || "";
+
+          // BFS to collect all descendant nodes
+          const queue: string[] = [basePageId];
+          const visited = new Set<string>();
+          const descendantPages: {
+            id: string;
+            language: string;
+            version: number;
+            hasChildren: boolean;
+          }[] = [];
+
+          while (queue.length > 0) {
+            const parentId = queue.shift()!;
+            if (visited.has(parentId)) continue;
+            visited.add(parentId);
+
+            const children = await getChildren(
+              parentId,
+              sessionId,
+              [],
+              false,
+              baseLanguage,
+              undefined,
+            );
+
+            for (const child of children) {
+              // Enqueue for deeper traversal when it has children
+              if (child.hasChildren) queue.push(child.id);
+              // Only pages (hasLayout) contribute comments
+              if (child.hasLayout) {
+                descendantPages.push({
+                  id: child.id,
+                  language: child.language,
+                  version: child.version,
+                  hasChildren: child.hasChildren,
+                });
+              }
+            }
+          }
+
+          // Fetch comments for all descendant pages in parallel
+          const results = await Promise.all(
+            descendantPages.map((p) =>
+              getCommentsApi(p.id, p.language, p.version),
+            ),
+          );
+
+          const childComments = results
+            .map((r) => (r.data || []) as CommentType[])
+            .flat();
+
+          // Merge unique by id
+          const existingIds = new Set(allComments.map((c) => c.id));
+          for (const c of childComments) {
+            if (!existingIds.has(c.id)) {
+              allComments.push(c);
+              existingIds.add(c.id);
+            }
+          }
+        } catch {
+          // Ignore child-loading errors to avoid blocking main list
+        }
+      }
+
+      // Combine with suggestions
+      let combined: FeedbackItem[] = [
+        ...allComments,
+        ...filteredSuggestedEdits,
+      ];
+
+      // Apply scope filter for item-only: keep only items whose mainItemId is the current page
+      if (scope === "itemOnly" && basePageId) {
+        combined = combined.filter(
+          (item: any) => item.mainItemId === basePageId,
+        );
+      }
+
+      // Apply tag filter to comments only (suggested edits do not have tags)
+      const tagFiltered = selectedTagsFilter.length
+        ? combined.filter((item: any) => {
+            // Keep suggested edits
+            if ("oldValue" in item && "newValue" in item) return true;
+            const tags = (item.tags || "")
+              .split(",")
+              .map((t: string) => t.trim())
+              .filter(Boolean);
+            // OR logic: include if any selected tag matches
+            return selectedTagsFilter.some((t) => tags.includes(t));
+          })
         : combined;
 
-    // Apply tag filter to comments only (suggested edits do not have tags)
-    const tagFiltered = selectedTagsFilter.length
-      ? scoped.filter((item: any) => {
-          // Keep suggested edits
-          if ("oldValue" in item && "newValue" in item) return true;
-          const tags = (item.tags || "")
-            .split(",")
-            .map((t: string) => t.trim())
-            .filter(Boolean);
-          // OR logic: include if any selected tag matches
-          return selectedTagsFilter.some((t) => tags.includes(t));
-        })
-      : scoped;
+      // Sort by creation date
+      tagFiltered.sort(
+        (a, b) =>
+          new Date(b.created || "").getTime() -
+          new Date(a.created || "").getTime(),
+      );
+
+      if (!cancelled) setFeedbackItems(tagFiltered);
+    };
 
-    // Sort by creation date. Adjust the comparison as needed if the date properties differ.
-    tagFiltered.sort(
-      (a, b) =>
-        new Date(b.created || "").getTime() -
-        new Date(a.created || "").getTime(),
-    );
+    load();
 
-    setFeedbackItems(tagFiltered);
+    return () => {
+      cancelled = true;
+    };
   }, [editContext, hideAppliedSuggestions, scope, selectedTagsFilter]);
 
   useEffect(() => {

package/src/editor/sidebar/Completions.tsx

@@ -4,6 +4,7 @@ import { Switch } from "../../components/ui/switch";
 import { Button } from "../../components/ui/button";
 import { Badge } from "../../components/ui/badge";
 import { Loader2, RefreshCw, FileText } from "lucide-react";
+import { formatTime } from "../utils";
 
 import {
   generatePageContext,
@@ -120,7 +121,7 @@ export function Completions() {
               {pageContext.abstract}
             </p>
             <div className="text-xs text-gray-400">
-              Generated: {pageContext.lastGenerated.toLocaleTimeString()}
+              {`Generated: ${formatTime(pageContext.lastGenerated)}`}
             </div>
           </div>
         ) : (

package/src/editor/ui/Icons.tsx

@@ -891,10 +891,12 @@ export function SecretAgentIcon({
   title,
   strokeWidth = 1,
   size = 20,
+  className,
 }: {
   title?: string;
   strokeWidth?: number;
   size?: number;
+  className?: string;
 }) {
   return (
     <svg
@@ -909,6 +911,7 @@ export function SecretAgentIcon({
       strokeLinejoin="round"
       role="img"
       aria-label={title}
+      className={className}
     >
       <path d="M3 10h18" />
       <path d="M7 10l2-5h6l2 5" />

package/src/editor/ui/SimpleTable.tsx

@@ -23,10 +23,10 @@ export function SimpleTable<T>({
 }) {
   return (
     <table className="text-surface min-w-full table-auto text-left text-xs font-light">
-      <thead className="border-b border-neutral-200 font-medium">
+      <thead className="border-b border-neutral-200">
         <tr>
           {columns.map((col, index) => (
-            <th key={index} className="px-1.5 py-1.5">
+            <th key={index} className="px-1.5 py-1.5 font-medium">
               {col.header}
             </th>
           ))}

package/src/editor/utils.ts

@@ -504,23 +504,81 @@ export function normalizeGuid(id: string) {
   return "{" + id + "}";
 }
 
-const dateOptions: Intl.DateTimeFormatOptions = {
-  year: "numeric",
-  month: "numeric",
-  day: "numeric",
-  hour: "numeric",
-  minute: "numeric",
-  second: "numeric",
-  hour12: false,
-};
+function getLocale() {
+  try {
+    if (typeof navigator !== "undefined" && navigator.language)
+      return navigator.language;
+  } catch {}
+  return "en";
+}
+
+function getUserTimeZone() {
+  try {
+    const tz = Intl.DateTimeFormat().resolvedOptions().timeZone;
+    return tz || "UTC";
+  } catch {
+    return "UTC";
+  }
+}
+
+export function formatDate(
+  date: Date,
+  options?: Intl.DateTimeFormatOptions & { timeZone?: string },
+) {
+  const locale = getLocale();
+  const timeZone = options?.timeZone || getUserTimeZone();
+  const fmt = new Intl.DateTimeFormat(locale, {
+    year: "numeric",
+    month: "numeric",
+    day: "numeric",
+    hour: "numeric",
+    minute: "numeric",
+    second: "numeric",
+    hour12: false,
+    timeZone,
+    ...options,
+  });
+  return fmt.format(date);
+}
 
-const dateFormat = Intl.DateTimeFormat(
-  typeof navigator !== "undefined" ? navigator.language : "en",
-  dateOptions,
-);
+export function formatDateOnly(
+  date: Date,
+  options?: Intl.DateTimeFormatOptions & { timeZone?: string },
+) {
+  const locale = getLocale();
+  const timeZone = options?.timeZone || getUserTimeZone();
+  const fmt = new Intl.DateTimeFormat(locale, {
+    year: "numeric",
+    month: "numeric",
+    day: "numeric",
+    timeZone,
+    ...options,
+  });
+  return fmt.format(date);
+}
 
-export function formatDate(date: Date) {
-  return dateFormat.format(date);
+export function formatTime(
+  date: Date,
+  options?: Intl.DateTimeFormatOptions & { timeZone?: string },
+) {
+  const locale = getLocale();
+  const timeZone = options?.timeZone || getUserTimeZone();
+  const fmt = new Intl.DateTimeFormat(locale, {
+    hour: "numeric",
+    minute: "numeric",
+    second: "numeric",
+    hour12: false,
+    timeZone,
+    ...options,
+  });
+  return fmt.format(date);
+}
+
+export function formatDateTime(
+  date: Date,
+  options?: Intl.DateTimeFormatOptions & { timeZone?: string },
+) {
+  return formatDate(date, options);
 }
 
 export function findClosestFieldElement(node: Node | null): HTMLElement | null {

package/src/revision.ts

@@ -1,2 +1,2 @@
-export const version = "1.0.4104";
-export const buildDate = "2025-09-23 14:05:05";
+export const version = "1.0.4105";
+export const buildDate = "2025-09-23 15:04:32";