@alpaca-editor/core 1.0.4096 → 1.0.4098

package/src/editor/ai/ContextInfoBar.tsx

@@ -290,11 +290,19 @@ export function ContextInfoBar({
     try {
       const dragObj = editContext?.dragObject;
       if (dragObj?.type === "component") {
-        const idFromContext = dragObj.component?.id;
+        const idsFromComponents = (dragObj.components || [])
+          .map((c) => c.id)
+          .filter((x) => !!x);
         const idFromData = e.dataTransfer.getData("componentId");
-        const compId = idFromContext || idFromData;
-        if (compId) {
-          await addComponentIdsToContext([compId]);
+        const allIds = Array.from(
+          new Set(
+            [...(idsFromComponents as string[]), idFromData].filter(
+              (x): x is string => !!x,
+            ),
+          ),
+        );
+        if (allIds.length) {
+          await addComponentIdsToContext(allIds);
           if (isCollapsed) setIsCollapsed(false);
           return;
         }
@@ -306,6 +314,14 @@ export function ContextInfoBar({
         return;
       }
 
+      // Fallbacks when no dragObj or different source
+      const fallbackComponentId = e.dataTransfer.getData("componentId");
+      if (fallbackComponentId) {
+        await addComponentIdsToContext([fallbackComponentId]);
+        if (isCollapsed) setIsCollapsed(false);
+        return;
+      }
+
       try {
         const textData = e.dataTransfer.getData("text/plain");
         if (textData) {
@@ -525,14 +541,14 @@ export function ContextInfoBar({
           <div className="flex flex-wrap items-center gap-2">{chips}</div>
           <div className="ml-2 flex flex-col items-end gap-1">
             {canAddPage && (
-              <Button size="sm" variant="outline" onClick={addPagesToContext}>
+              <Button size="xs" variant="outline" onClick={addPagesToContext}>
                 <Plus className="mr-1 h-3 w-3" strokeWidth={1} /> Add current
                 item
               </Button>
             )}
             {canAddSelection && (
               <Button
-                size="sm"
+                size="xs"
                 variant="outline"
                 onClick={addSelectedComponentsToContext}
               >

package/src/editor/ai/ToolCallDisplay.tsx

@@ -61,6 +61,8 @@ const getToolIcon = (toolName: string) => {
     // Comments and suggestions
     "add-comment": <CheckSquare strokeWidth={1} size={14} />,
     "get-comments": <CheckSquare strokeWidth={1} size={14} />,
+    "get-reviews": <CheckSquare strokeWidth={1} size={14} />,
+    "invite-reviewer": <CheckSquare strokeWidth={1} size={14} />,
     "get-suggestions": <Brain strokeWidth={1} size={14} />,
 
     // Default fallback

package/src/editor/client/AboutDialog.tsx

@@ -1,4 +1,4 @@
-import { Dialog } from "primereact/dialog";
+import { Dialog, DialogContent, DialogHeader, DialogTitle } from "../../components/ui/dialog";
 import { DialogProps } from "./editContext";
 import { useImperativeHandle, useState, forwardRef, useEffect } from "react";
 import { buildDate, version } from "../../revision";
@@ -20,25 +20,30 @@ export const AboutDialog = forwardRef<DialogProps<void>, DialogProps<void>>(
 
     return (
       <Dialog
-        visible={visible}
-        onHide={() => {
-          setVisible(false);
-          props.onClose(null);
+        open={visible}
+        onOpenChange={(open: boolean) => {
+          if (!open) {
+            setVisible(false);
+            props.onClose(null);
+          }
         }}
-        header="About SiteMagician"
-        style={{ width: "400px" }}
       >
-        <div className="flex flex-col gap-4 p-2">
-          <div className="bg-wizard-demo mt-3 aspect-[1.75] w-full rounded-lg"></div>
-          <div>
-            Build: <span className="font-bold"> {version}</span> from{" "}
-            <span className="font-bold">{buildDate}</span>
+        <DialogContent style={{ width: 400 }}>
+          <DialogHeader>
+            <DialogTitle>About parhelion</DialogTitle>
+          </DialogHeader>
+          <div className="flex flex-col gap-4 p-2">
+            <div className="bg-wizard-demo mt-3 aspect-[1.75] w-full rounded-lg"></div>
+            <div>
+              Build: <span className="font-bold"> {version}</span> from{" "}
+              <span className="font-bold">{buildDate}</span>
+            </div>
+            <div className="mt-4 text-sm text-gray-600">
+              &copy; {new Date().getFullYear()} canvas Reply GmbH. All rights
+              reserved.
+            </div>
           </div>
-          <div className="mt-4 text-sm text-gray-600">
-            &copy; {new Date().getFullYear()} canvas Reply GmbH. All rights
-            reserved.
-          </div>
-        </div>
+        </DialogContent>
       </Dialog>
     );
   },

package/src/editor/client/EditorShell.tsx

@@ -1644,6 +1644,9 @@ export function EditorShell({
       readonly: isReadOnly,
       selection,
       select: (ids: string[]) => {
+        try {
+          console.log("[DND][EditContext] select", ids);
+        } catch {}
         setSelection(ids);
       },
       selectedForInsertion,
@@ -1691,6 +1694,7 @@ export function EditorShell({
       ) => {
         if ((!dragObject && !insertOption) || !page) return;
         setDragObject(undefined);
+        
 
         if (spotPositionElement && spotPositionAnchor) {
           setInserting({
@@ -1761,7 +1765,8 @@ export function EditorShell({
             } as LinkComponentOperation;
             console.log("op", op);
           } else {
-            if (!dragObject.component) return;
+            const componentIds = dragObject.components?.map((c) => c.id) ?? [];
+            if (componentIds.length === 0) return;
             op = {
               type: "move-component",
               mainItem: page!.item.descriptor,
@@ -1772,11 +1777,12 @@ export function EditorShell({
               },
               placeholderKey,
               placeholderIndex: index,
-              componentIds: [dragObject.component.id],
+              componentIds,
               date: new Date().toISOString(),
               id: uuid(),
               description: "Move component",
             } as MoveComponentOperation;
+            
           }
         }
 

package/src/editor/client/editContext.ts

@@ -58,7 +58,7 @@ export type DragObject = {
   typeId: string;
   templateId?: string;
   name?: string;
-  component?: ItemDescriptor;
+  components?: ItemDescriptor[];
   items?: ItemDescriptor[];
 };
 
@@ -176,7 +176,7 @@ export type EditContextType = {
   showToast: (message: string) => void;
   sessionId: string;
   openSplashScreen: () => void;
-  getComponentCommands: (component: Component[]) => Promise<ComponentCommand[]>;
+  getComponentCommands: (components: Component[]) => Promise<ComponentCommand[]>;
   selectMedia: ({
     selectedIdPath,
     mode,

package/src/editor/client/hooks/useSocketMessageHandler.ts

@@ -244,6 +244,14 @@ export function useSocketMessageHandler(deps: {
       if (message.type === "edit-operation") {
         const op = message.payload as EditOperation;
         if (op.type === "edit-field") {
+          // Ignore our own edit-field operations to avoid redundant updates
+          if (
+            op.sessionId &&
+            op.sessionId === sessionId &&
+            (op as any).user?.ai !== true
+          )
+            return;
+
           const editFieldOperation = op as any;
           const field = await itemsRepository.getField({
             item: {

package/src/editor/client/itemsRepository.ts

@@ -516,6 +516,7 @@ export function useItemsRepository(
 
             // Avoid clobbering in-flight edits: only sync to server value if not dirty
             if (isOutdated(modifiedField) && !modifiedField.isDirty) {
+              console.log("Syncing to server value", modifiedField.fieldId, modifiedField.item.id, modifiedField.item.language, modifiedField.item.version, serverValue);
               return { ...modifiedField, value: serverValue };
             }
 

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

@@ -16,7 +16,7 @@ export function Setup() {
   return (
     <div className="h-full overflow-auto p-4">
       <div className="mb-4 text-lg font-semibold text-gray-800">Setup</div>
-      <div className="grid grid-cols-1 gap-4">
+      <div className="grid grid-cols-1 gap-4 max-w-xl">
         {steps.map((Step, idx) => (
           <Step key={idx} />
         ))}

package/src/editor/control-center/setup-steps/AiSetupStep/EmbeddingsModelSection.tsx

@@ -0,0 +1,296 @@
+import React from "react";
+import { Button } from "../../../../components/ui/button";
+import { AlertCircle, CheckCircle, RefreshCw } from "lucide-react";
+import { useEditContext } from "../../../client/editContext";
+import type { ItemDescriptor } from "../../../pageModel";
+import { getChildren } from "../../../services/contentService";
+import type { ItemTreeNodeData } from "../../../services/contentService";
+import { findByName, resolvePathUnderContent } from "./utils";
+import type { StepState } from "./types";
+
+// Sitecore IDs and constants used by AI models/endpoints
+const AI_MODELS_CONTAINER_TEMPLATE_ID = "e5f6a7b8-9c0d-1e2f-3a4b-5c6d7e8f9a0b";
+const AI_MODEL_TEMPLATE_ID = "d2e3f4a5-4b5c-5c6d-bf0b-3e4f5a6b7c8e";
+const MODEL_NAME_FIELD_ID = "f1e2d3c4-5b6a-7980-8e9f-1a2b3c4d5e6f";
+const MODEL_ENDPOINT_FIELD_ID = "cbade708-ce95-4f54-81b7-308ea61a76a6";
+const EDITOR_SETTINGS_EMBEDDINGS_MODEL_FIELD_ID = "08d0579d-3bf2-4777-981f-3f0856da948e"; // Embeddings Model (Droptree)
+
+const DEFAULT_EMBEDDINGS_MODEL_NAME = "text-embedding-3-large";
+
+export function EmbeddingsModelSection() {
+  const editContext = useEditContext();
+  const [state, setState] = React.useState<StepState>("checking");
+  const [error, setError] = React.useState<string | null>(null);
+  const [isBusy, setIsBusy] = React.useState(false);
+  const [currentModelName, setCurrentModelName] = React.useState<string | null>(
+    null,
+  );
+
+  const userLang = editContext?.contentEditorItem?.language || "en";
+
+  const statusIcon = React.useCallback((s: StepState) => {
+    if (s === "success")
+      return <CheckCircle className="h-4 w-4 text-green-600" strokeWidth={1} />;
+    if (s === "error")
+      return <AlertCircle className="h-4 w-4 text-red-600" strokeWidth={1} />;
+    return (
+      <RefreshCw className="h-4 w-4 animate-spin text-amber-600" strokeWidth={1} />
+    );
+  }, []);
+
+  const checkStatus = React.useCallback(async () => {
+    try {
+      setState("checking");
+      setError(null);
+      setCurrentModelName(null);
+
+      const settingsItem = await resolvePathUnderContent(
+        editContext?.sessionId,
+        userLang,
+        ["Settings", "Editor"],
+      );
+      if (!settingsItem) {
+        setState("error");
+        setError("Editor settings item not found. Create it first.");
+        return;
+      }
+
+      // Read the Embeddings Model droptree field
+      const field = await editContext!.itemsRepository.getField({
+        item: { id: settingsItem.id, language: userLang, version: 0 },
+        fieldId: EDITOR_SETTINGS_EMBEDDINGS_MODEL_FIELD_ID,
+      });
+
+      const raw = (field?.rawValue || "").trim();
+      if (!raw) {
+        setState("error");
+        return;
+      }
+
+      // Normalize ID braces and load the model item to get its display name
+      const modelId = raw.replace(/^[{(]+|[})]+$/g, "");
+      const model = await editContext!.itemsRepository.getItem({
+        id: `{${modelId}}`,
+        language: userLang,
+        version: 0,
+      });
+      if (!model) {
+        setState("error");
+        setError(
+          "Embeddings Model points to a missing item. Please fix to re-create and assign.",
+        );
+        return;
+      }
+
+      setCurrentModelName(model.name);
+      setState("success");
+    } catch (e: any) {
+      setState("error");
+      setError(e?.message || "Failed to check embeddings model");
+    }
+  }, [editContext, userLang]);
+
+  React.useEffect(() => {
+    checkStatus();
+  }, [checkStatus]);
+
+  const ensureEmbeddingsModel = React.useCallback(async () => {
+    if (!editContext) return;
+    try {
+      setIsBusy(true);
+      setError(null);
+
+      const settingsItem = await resolvePathUnderContent(
+        editContext.sessionId,
+        userLang,
+        ["Settings", "Editor"],
+      );
+      if (!settingsItem)
+        throw new Error("Editor settings item not found. Create it first.");
+
+      // Load children under /Settings/Editor
+      const editorChildren = (await getChildren(
+        settingsItem.id,
+        editContext.sessionId!,
+        [],
+        false,
+        userLang,
+        "path",
+      )) as unknown as ItemTreeNodeData[];
+
+      // Find endpoints container and choose OpenAI or Azure OpenAI endpoint
+      const endpointsContainer = findByName(editorChildren, "Ai Endpoints");
+      if (!endpointsContainer) {
+        throw new Error(
+          "No AI endpoints found. Please add an OpenAI or Azure OpenAI endpoint first.",
+        );
+      }
+      const endpointChildren = (await getChildren(
+        endpointsContainer.id,
+        editContext.sessionId!,
+        [],
+        false,
+        userLang,
+        "path",
+      )) as unknown as ItemTreeNodeData[];
+      const openAi = findByName(endpointChildren, "OpenAI");
+      const azureOpenAi = findByName(endpointChildren, "Azure OpenAI");
+      const selectedEndpoint = openAi || azureOpenAi;
+      if (!selectedEndpoint) {
+        throw new Error(
+          "No OpenAI or Azure OpenAI endpoint exists. Add one in 'Provider' section.",
+        );
+      }
+
+      // Ensure Ai Models container exists
+      let modelsContainer = findByName(editorChildren, "Ai Models");
+      if (!modelsContainer) {
+        const createdModels = await editContext.operations.createItem(
+          settingsItem,
+          AI_MODELS_CONTAINER_TEMPLATE_ID,
+          "Ai Models",
+        );
+        if (!createdModels)
+          throw new Error("Failed to create 'Ai Models' container");
+        modelsContainer = {
+          id: createdModels.id,
+          name: "Ai Models",
+          displayName: "Ai Models",
+          thumbUrl: "",
+          previewUrl: "",
+          templateId: "",
+          icon: "",
+          hasChildren: false,
+          isComponent: false,
+          language: userLang,
+          version: 0,
+          hasLayout: false,
+        } as unknown as ItemTreeNodeData;
+      }
+
+      // Find or create the "text-embedding-3-large" model
+      const modelChildren = (await getChildren(
+        modelsContainer.id,
+        editContext.sessionId!,
+        [],
+        false,
+        userLang,
+        "path",
+      )) as unknown as ItemTreeNodeData[];
+
+      let modelNode = findByName(modelChildren, DEFAULT_EMBEDDINGS_MODEL_NAME);
+      let modelDescriptor: ItemDescriptor | null = null;
+
+      if (modelNode) {
+        modelDescriptor = {
+          id: modelNode.id,
+          language: userLang,
+          version: 0,
+        } as ItemDescriptor;
+      } else {
+        const createdModel = await editContext.operations.createItem(
+          {
+            id: modelsContainer.id,
+            language: userLang,
+            version: 0,
+          } as ItemDescriptor,
+          AI_MODEL_TEMPLATE_ID,
+          DEFAULT_EMBEDDINGS_MODEL_NAME,
+        );
+        if (!createdModel)
+          throw new Error(
+            `Failed to create model '${DEFAULT_EMBEDDINGS_MODEL_NAME}'`,
+          );
+        modelDescriptor = createdModel;
+
+        // Set Model Name field
+        await editContext.operations.editField({
+          field: {
+            fieldId: MODEL_NAME_FIELD_ID,
+            item: {
+              id: modelDescriptor.id,
+              language: userLang,
+              version: 0,
+            },
+          },
+          value: DEFAULT_EMBEDDINGS_MODEL_NAME,
+          rawValue: DEFAULT_EMBEDDINGS_MODEL_NAME,
+          refresh: "delayed",
+        });
+      }
+
+      // Link model to the selected endpoint
+      const endpointGuid = `{${(selectedEndpoint.id as string)
+        .replace(/[{}()]/g, "")
+        .toUpperCase()}}`;
+      await editContext.operations.editField({
+        field: {
+          fieldId: MODEL_ENDPOINT_FIELD_ID,
+          item: { id: modelDescriptor!.id, language: userLang, version: 0 },
+        },
+        rawValue: endpointGuid,
+        refresh: "delayed",
+      });
+
+      // Assign model to Editor settings' Embeddings Model field
+      const modelGuid = `{${(modelDescriptor!.id as string)
+        .replace(/[{}()]/g, "")
+        .toUpperCase()}}`;
+      await editContext.operations.editField({
+        field: {
+          fieldId: EDITOR_SETTINGS_EMBEDDINGS_MODEL_FIELD_ID,
+          item: { id: settingsItem.id, language: userLang, version: 0 },
+        },
+        rawValue: modelGuid,
+        refresh: "immediate",
+      });
+
+      editContext.requestRefresh?.("immediate");
+      editContext.showToast?.(
+        `Embeddings model set to '${DEFAULT_EMBEDDINGS_MODEL_NAME}'`,
+      );
+      await checkStatus();
+    } catch (e: any) {
+      setError(e?.message || "Failed to ensure embeddings model");
+      setState("error");
+    } finally {
+      setIsBusy(false);
+    }
+  }, [editContext, userLang, checkStatus]);
+
+  return (
+    <div className="mt-3">
+      <div className="flex items-center justify-between gap-2">
+        <div className="flex items-center gap-2">
+          {statusIcon(state)}
+          <span className="text-sm text-gray-700">
+            {state === "success"
+              ? `Embeddings model: ${currentModelName}`
+              : state === "error"
+                ? "Embeddings model not assigned"
+                : "Checking embeddings model..."}
+          </span>
+        </div>
+        {state !== "success" && (
+          <Button size="sm" onClick={ensureEmbeddingsModel} disabled={isBusy}>
+            {isBusy ? (
+              <RefreshCw strokeWidth={1} className="h-4 w-4 animate-spin" />
+            ) : (
+              <CheckCircle strokeWidth={1} className="h-4 w-4" />
+            )}
+            Fix
+          </Button>
+        )}
+      </div>
+      {error && (
+        <div className="mt-2 rounded border border-yellow-200 bg-yellow-50 p-2 text-xs whitespace-pre-wrap text-yellow-800">
+          {error}
+        </div>
+      )}
+    </div>
+  );
+}
+
+export default EmbeddingsModelSection;
+
+