fixes

src/agent/open-canvas/nodes/customAction.ts

@@ -16,8 +16,8 @@ import {
 } from "../../../types";
 import { LangGraphRunnableConfig } from "@langchain/langgraph";
 import { BaseMessage } from "@langchain/core/messages";
-import { getArtifactContent } from "@/hooks/use-graph/utils";
-import { isArtifactMarkdownContent } from "@/lib/artifact_content_types";
+import { getArtifactContent } from "../../../hooks/use-graph/utils";
+import { isArtifactMarkdownContent } from "../../../lib/artifact_content_types";
 
 const formatMessages = (messages: BaseMessage[]): string =>
   messages

src/agent/open-canvas/nodes/generateFollowup.ts

@@ -8,8 +8,8 @@ import {
   Reflections,
 } from "../../../types";
 import { LangGraphRunnableConfig } from "@langchain/langgraph";
-import { getArtifactContent } from "@/hooks/use-graph/utils";
-import { isArtifactMarkdownContent } from "@/lib/artifact_content_types";
+import { getArtifactContent } from "../../../hooks/use-graph/utils";
+import { isArtifactMarkdownContent } from "../../../lib/artifact_content_types";
 
 /**
  * Generate a followup message after generating or updating an artifact.

src/agent/open-canvas/nodes/generatePath.ts

@@ -9,8 +9,8 @@ import {
 import { OpenCanvasGraphAnnotation } from "../state";
 import { z } from "zod";
 import { formatArtifactContentWithTemplate } from "../../utils";
-import { getArtifactContent } from "@/hooks/use-graph/utils";
-import { ArtifactCodeV3, ArtifactMarkdownV3 } from "@/types";
+import { getArtifactContent } from "../../../hooks/use-graph/utils";
+import { ArtifactCodeV3, ArtifactMarkdownV3 } from "../../../types";
 
 /**
  * Routes to the proper node in the graph based on the user's query.

src/agent/open-canvas/nodes/respondToQuery.ts

@@ -12,7 +12,7 @@ import {
   Reflections,
 } from "../../../types";
 import { CURRENT_ARTIFACT_PROMPT, NO_ARTIFACT_PROMPT } from "../prompts";
-import { getArtifactContent } from "@/hooks/use-graph/utils";
+import { getArtifactContent } from "../../../hooks/use-graph/utils";
 
 /**
  * Generate responses to questions. Does not generate artifacts.

src/agent/open-canvas/nodes/rewriteArtifact.ts

@@ -19,11 +19,11 @@ import {
 } from "../../../types";
 import { LangGraphRunnableConfig } from "@langchain/langgraph";
 import { z } from "zod";
-import { getArtifactContent } from "@/hooks/use-graph/utils";
+import { getArtifactContent } from "../../../hooks/use-graph/utils";
 import {
   isArtifactCodeContent,
   isArtifactMarkdownContent,
-} from "@/lib/artifact_content_types";
+} from "../../../lib/artifact_content_types";
 
 export const rewriteArtifact = async (
   state: typeof OpenCanvasGraphAnnotation.State,

src/agent/open-canvas/nodes/rewriteArtifactTheme.ts

@@ -10,8 +10,8 @@ import {
 import { ensureStoreInConfig, formatReflections } from "../../utils";
 import { ArtifactV3, Reflections } from "../../../types";
 import { LangGraphRunnableConfig } from "@langchain/langgraph";
-import { getArtifactContent } from "@/hooks/use-graph/utils";
-import { isArtifactMarkdownContent } from "@/lib/artifact_content_types";
+import { getArtifactContent } from "../../../hooks/use-graph/utils";
+import { isArtifactMarkdownContent } from "../../../lib/artifact_content_types";
 
 export const rewriteArtifactTheme = async (
   state: typeof OpenCanvasGraphAnnotation.State,

src/agent/open-canvas/nodes/rewriteCodeArtifactTheme.ts

@@ -7,8 +7,8 @@ import {
   PORT_LANGUAGE_CODE_ARTIFACT_PROMPT,
 } from "../prompts";
 import { ArtifactCodeV3, ArtifactV3 } from "../../../types";
-import { isArtifactCodeContent } from "@/lib/artifact_content_types";
-import { getArtifactContent } from "@/hooks/use-graph/utils";
+import { isArtifactCodeContent } from "../../../lib/artifact_content_types";
+import { getArtifactContent } from "../../../hooks/use-graph/utils";
 
 export const rewriteCodeArtifactTheme = async (
   state: typeof OpenCanvasGraphAnnotation.State

src/agent/open-canvas/nodes/updateArtifact.ts

@@ -4,8 +4,8 @@ import { UPDATE_HIGHLIGHTED_ARTIFACT_PROMPT } from "../prompts";
 import { ensureStoreInConfig, formatReflections } from "../../utils";
 import { ArtifactCodeV3, ArtifactV3, Reflections } from "../../../types";
 import { LangGraphRunnableConfig } from "@langchain/langgraph";
-import { getArtifactContent } from "@/hooks/use-graph/utils";
-import { isArtifactCodeContent } from "@/lib/artifact_content_types";
+import { getArtifactContent } from "../../../hooks/use-graph/utils";
+import { isArtifactCodeContent } from "../../../lib/artifact_content_types";
 
 /**
  * Update an existing artifact based on the user's query.

src/agent/open-canvas/nodes/updateHighlightedText.ts

@@ -1,8 +1,8 @@
 import { ChatOpenAI } from "@langchain/openai";
 import { OpenCanvasGraphAnnotation, OpenCanvasGraphReturnType } from "../state";
 import { ArtifactMarkdownV3 } from "../../../types";
-import { getArtifactContent } from "@/hooks/use-graph/utils";
-import { isArtifactMarkdownContent } from "@/lib/artifact_content_types";
+import { getArtifactContent } from "../../../hooks/use-graph/utils";
+import { isArtifactMarkdownContent } from "../../../lib/artifact_content_types";
 
 const PROMPT = `You are an expert AI writing assistant, tasked with rewriting some text a user has selected. The selected text is nested inside a larger 'block'. You should always respond with ONLY the updated text block in accordance with the user's request.
 You should always respond with the full markdown text block, as it will simply replace the existing block in the artifact.

src/agent/reflection/index.ts

@@ -9,8 +9,8 @@ import { ArtifactCodeV3, ArtifactMarkdownV3, Reflections } from "../../types";
 import { REFLECT_SYSTEM_PROMPT, REFLECT_USER_PROMPT } from "./prompts";
 import { z } from "zod";
 import { ensureStoreInConfig, formatReflections } from "../utils";
-import { getArtifactContent } from "@/hooks/use-graph/utils";
-import { isArtifactMarkdownContent } from "@/lib/artifact_content_types";
+import { getArtifactContent } from "../../hooks/use-graph/utils";
+import { isArtifactMarkdownContent } from "../../lib/artifact_content_types";
 
 export const reflect = async (
   state: typeof ReflectionGraphAnnotation.State,

src/components/Canvas.tsx

@@ -54,6 +54,7 @@ export function Canvas(props: CanvasProps) {
     setUpdateRenderedArtifactRequired,
     isArtifactSaved,
     firstTokenReceived,
+    selectedBlocks,
   } = useGraph({
     userId: props.user.id,
     threadId,
@@ -200,6 +201,7 @@ export function Canvas(props: CanvasProps) {
             artifact={artifact}
             setArtifact={setArtifact}
             setSelectedBlocks={setSelectedBlocks}
+            selectedBlocks={selectedBlocks}
             assistantId={assistantId}
             handleGetReflections={getReflections}
             handleDeleteReflections={deleteReflections}

src/components/artifacts/ArtifactRenderer.tsx

@@ -56,6 +56,7 @@ export interface ArtifactRendererProps {
   reflections: (Reflections & { updatedAt: Date }) | undefined;
   handleDeleteReflections: () => Promise<boolean>;
   handleGetReflections: () => Promise<void>;
+  selectedBlocks: TextHighlight | undefined;
   setSelectedBlocks: Dispatch<SetStateAction<TextHighlight | undefined>>;
   isStreaming: boolean;
   updateRenderedArtifactRequired: boolean;
@@ -273,6 +274,13 @@ export function ArtifactRenderer(props: ArtifactRendererProps) {
     }
   }, [isSelectionActive, selectionBox]);
 
+  useEffect(() => {
+    if (!!props.selectedBlocks && !isSelectionActive) {
+      // Selection is not active but selected blocks are present. Clear them.
+      props.setSelectedBlocks(undefined);
+    }
+  }, [props.selectedBlocks, isSelectionActive]);
+
   let currentArtifactContent: ArtifactCodeV3 | ArtifactMarkdownV3 | undefined =
     undefined;
   try {
@@ -505,15 +513,24 @@ export function ArtifactRenderer(props: ArtifactRendererProps) {
         )}
       </div>
       <CustomQuickActions
+        isTextSelected={isSelectionActive || props.selectedBlocks !== undefined}
         userId={props.userId}
         assistantId={props.assistantId}
         streamMessage={props.streamMessage}
       />
       {currentArtifactContent.type === "text" ? (
-        <ActionsToolbar streamMessage={props.streamMessage} />
+        <ActionsToolbar
+          isTextSelected={
+            isSelectionActive || props.selectedBlocks !== undefined
+          }
+          streamMessage={props.streamMessage}
+        />
       ) : null}
       {currentArtifactContent.type === "code" ? (
         <CodeToolBar
+          isTextSelected={
+            isSelectionActive || props.selectedBlocks !== undefined
+          }
           language={
             currentArtifactContent.language as ProgrammingLanguageOptions
           }

src/components/artifacts/actions_toolbar/code/index.tsx

@@ -1,11 +1,3 @@
-/**
- * Add comments
- * Add logs
- * Fix bugs
- * Port to a lang
- * Code review (p1)
- */
-
 import { useEffect, useRef, useState } from "react";
 import { MessageCircleCode, Code, ScrollText, Bug, BookA } from "lucide-react";
 import { cn } from "@/lib/utils";
@@ -14,7 +6,11 @@ import { TooltipIconButton } from "@/components/ui/assistant-ui/tooltip-icon-but
 import { PortToLanguageOptions } from "./PortToLanguage";
 import { ProgrammingLanguageOptions } from "@/types";
 
-type SharedComponentProps = CodeToolbarProps & { handleClose: () => void };
+type SharedComponentProps = {
+  handleClose: () => void;
+  language: ProgrammingLanguageOptions;
+  streamMessage: (input: GraphInput) => Promise<void>;
+};
 
 type ToolbarOption = {
   id: string;
@@ -24,6 +20,7 @@ type ToolbarOption = {
 };
 
 export interface CodeToolbarProps {
+  isTextSelected: boolean;
   language: ProgrammingLanguageOptions;
   streamMessage: (input: GraphInput) => Promise<void>;
 }
@@ -81,6 +78,7 @@ export function CodeToolBar(props: CodeToolbarProps) {
 
   const toggleExpand = (event: React.MouseEvent) => {
     event.stopPropagation();
+    if (props.isTextSelected) return;
     setIsExpanded(!isExpanded);
     setActiveOption(null);
   };
@@ -151,9 +149,16 @@ export function CodeToolBar(props: CodeToolbarProps) {
         </div>
       ) : (
         <TooltipIconButton
-          tooltip="Code tools"
+          tooltip={
+            props.isTextSelected
+              ? "Quick actions disabled while text is selected"
+              : "Code tools"
+          }
           variant="outline"
-          className="transition-colors w-[48px] h-[48px] p-0 rounded-xl"
+          className={cn(
+            "transition-colors w-[48px] h-[48px] p-0 rounded-xl",
+            props.isTextSelected ? "cursor-default" : "cursor-pointer"
+          )}
           delayDuration={400}
         >
           <Code className="w-[26px] h-[26px]" />

src/components/artifacts/actions_toolbar/custom/index.tsx

@@ -23,17 +23,20 @@ import { cn } from "@/lib/utils";
 import { useToast } from "@/hooks/use-toast";
 
 export interface CustomQuickActionsProps {
+  isTextSelected: boolean;
   assistantId: string | undefined;
   userId: string;
   streamMessage: (input: GraphInput) => Promise<void>;
 }
 
 const DropdownMenuItemWithDelete = ({
+  disabled,
   title,
   onDelete,
   onEdit,
   onClick,
 }: {
+  disabled: boolean;
   title: string;
   onDelete: () => Promise<void>;
   onEdit: () => void;
@@ -47,10 +50,15 @@ const DropdownMenuItemWithDelete = ({
       onMouseEnter={() => setIsHovering(true)}
       onMouseLeave={() => setIsHovering(false)}
     >
-      <DropdownMenuItem onSelect={onClick} className="w-full truncate">
+      <DropdownMenuItem
+        disabled={disabled}
+        onSelect={onClick}
+        className="w-full truncate"
+      >
         {title}
       </DropdownMenuItem>
       <TooltipIconButton
+        disabled={disabled}
         tooltip="Edit action"
         variant="ghost"
         onClick={onEdit}
@@ -59,6 +67,7 @@ const DropdownMenuItemWithDelete = ({
         <Pencil className="text-[#575757] hover:text-black transition-colors ease-in" />
       </TooltipIconButton>
       <TooltipIconButton
+        disabled={disabled}
         tooltip="Delete action"
         variant="ghost"
         onClick={onDelete}
@@ -146,12 +155,25 @@ export function CustomQuickActions(props: CustomQuickActionsProps) {
   };
 
   return (
-    <DropdownMenu open={open} onOpenChange={setOpen}>
+    <DropdownMenu
+      open={open}
+      onOpenChange={(o) => {
+        if (props.isTextSelected) return;
+        setOpen(o);
+      }}
+    >
       <DropdownMenuTrigger className="fixed bottom-4 right-20" asChild>
         <TooltipIconButton
-          tooltip="Custom quick actions"
+          tooltip={
+            props.isTextSelected
+              ? "Quick actions disabled while text is selected"
+              : "Custom quick actions"
+          }
           variant="outline"
-          className="transition-colors w-[48px] h-[48px] p-0 rounded-xl"
+          className={cn(
+            "transition-colors w-[48px] h-[48px] p-0 rounded-xl",
+            props.isTextSelected ? "cursor-default" : "cursor-pointer"
+          )}
           delayDuration={400}
         >
           <WandSparkles className="w-[26px] h-[26px]" />
@@ -174,6 +196,7 @@ export function CustomQuickActions(props: CustomQuickActionsProps) {
             {customQuickActions.map((action) => (
               <DropdownMenuItemWithDelete
                 key={action.id}
+                disabled={props.isTextSelected}
                 onDelete={async () => await handleDelete(action.id)}
                 title={action.title}
                 onClick={async () => await handleQuickActionClick(action.id)}
@@ -184,6 +207,7 @@ export function CustomQuickActions(props: CustomQuickActionsProps) {
         )}
         <DropdownMenuSeparator />
         <DropdownMenuItem
+          disabled={props.isTextSelected}
           onSelect={handleNewActionClick}
           className="flex items-center justify-start gap-1"
         >

src/components/artifacts/actions_toolbar/text/index.tsx

@@ -8,7 +8,10 @@ import { GraphInput } from "@/hooks/use-graph/useGraph";
 import { TooltipIconButton } from "@/components/ui/assistant-ui/tooltip-icon-button";
 import { MagicPencilSVG } from "@/components/icons/magic_pencil";
 
-type SharedComponentProps = ActionsToolbarProps & { handleClose: () => void };
+type SharedComponentProps = {
+  handleClose: () => void;
+  streamMessage: (input: GraphInput) => Promise<void>;
+};
 
 type ToolbarOption = {
   id: string;
@@ -18,6 +21,7 @@ type ToolbarOption = {
 };
 
 export interface ActionsToolbarProps {
+  isTextSelected: boolean;
   streamMessage: (input: GraphInput) => Promise<void>;
 }
 
@@ -74,6 +78,7 @@ export function ActionsToolbar(props: ActionsToolbarProps) {
 
   const toggleExpand = (event: React.MouseEvent) => {
     event.stopPropagation();
+    if (props.isTextSelected) return;
     setIsExpanded(!isExpanded);
     setActiveOption(null);
   };
@@ -134,9 +139,16 @@ export function ActionsToolbar(props: ActionsToolbarProps) {
         </div>
       ) : (
         <TooltipIconButton
-          tooltip="Writing tools"
+          tooltip={
+            props.isTextSelected
+              ? "Quick actions disabled while text is selected"
+              : "Writing tools"
+          }
           variant="outline"
-          className="transition-colors w-[48px] h-[48px] p-0 rounded-xl"
+          className={cn(
+            "transition-colors w-[48px] h-[48px] p-0 rounded-xl",
+            props.isTextSelected ? "cursor-default" : "cursor-pointer"
+          )}
           delayDuration={400}
         >
           <MagicPencilSVG className="w-[26px] h-[26px]" />

src/constants.ts

@@ -1,5 +1,5 @@
 export const LANGGRAPH_API_URL =
-  process.env.LANGGRAPH_API_URL ?? "http://localhost:65336";
+  process.env.LANGGRAPH_API_URL ?? "http://localhost:53974";
 // v2 is tied to the 'open-canvas-prod' deployment.
 export const ASSISTANT_ID_COOKIE = "oc_assistant_id_v2";
 // export const ASSISTANT_ID_COOKIE = "oc_assistant_id";