feat(tools): read-only tool detail, create lands on the new tool, drop dead wand prompt API

- Viewers without edit rights could not open a custom tool at all, while the
  equivalent skill and custom-block surfaces both offer a read-only view. The
  detail page now takes `readOnly`: editors inert, no Save/Discard/Delete, no
  Generate. Creating still requires edit rights.
- Creating a tool bounced back to the list while creating a skill lands on the
  new skill. Tools now do the same. The upsert returns the workspace's whole
  tool list (newest first) rather than just the new row, so the id is matched
  by title instead of by index — the same trap that produced the skill-create
  navigation bug.
- Remove `openPrompt`/`closePrompt` from useWand. `closePrompt`'s last callers
  went away with the custom-tool-modal extraction and `openPrompt` had none
  before it; nothing reads `isPromptVisible` any more either.

Author: waleedlatif1

apps/sim/app/workspace/[workspaceId]/components/custom-tool-editor/custom-tool-code-field.tsx

@@ -42,6 +42,8 @@ interface CustomToolCodeFieldProps {
    * tag autocomplete is not offered.
    */
   blockId?: string
+  /** Renders the editor inert for viewers without edit rights. */
+  disabled?: boolean
 }
 
 interface TriggerState {
@@ -81,6 +83,7 @@ export function CustomToolCodeField({
   schemaParameters,
   workspaceId,
   blockId,
+  disabled = false,
 }: CustomToolCodeFieldProps) {
   const codeEditorRef = useRef<HTMLDivElement>(null)
   const schemaParamItemRefs = useRef<Map<number, HTMLElement> | null>(null)
@@ -95,7 +98,7 @@ export function CustomToolCodeField({
   const [dropdownPosition, setDropdownPosition] = useState({ top: 0, left: 0 })
   const [schemaParamSelectedIndex, setSchemaParamSelectedIndex] = useState(0)
 
-  const busy = generation.isLoading || generation.isStreaming
+  const busy = disabled || generation.isLoading || generation.isStreaming
   const resolvedMinHeight = schemaParameters.length > 0 ? '380px' : '420px'
 
   /** Generation writes bypass `handleChange`, so close any open menu here instead. */

apps/sim/app/workspace/[workspaceId]/components/custom-tool-editor/custom-tool-schema-field.tsx

@@ -9,6 +9,8 @@ interface CustomToolSchemaFieldProps {
   onChange: (value: string) => void
   error: boolean
   generation: ReturnType<typeof useSchemaGeneration>
+  /** Renders the editor inert for viewers without edit rights. */
+  disabled?: boolean
 }
 
 /**
@@ -21,8 +23,9 @@ export function CustomToolSchemaField({
   onChange,
   error,
   generation,
+  disabled = false,
 }: CustomToolSchemaFieldProps) {
-  const busy = generation.isLoading || generation.isStreaming
+  const busy = disabled || generation.isLoading || generation.isStreaming
 
   return (
     <CodeEditor

apps/sim/app/workspace/[workspaceId]/settings/components/custom-tools/components/custom-tool-detail/custom-tool-detail.tsx

@@ -37,7 +37,11 @@ interface CustomToolDetailProps {
   workspaceId: string
   /** `null` on the create flow, which starts from an empty draft. */
   tool: CustomToolDefinition | null
+  /** Viewers without edit rights get the same page with every control inert. */
+  readOnly?: boolean
   onBack: () => void
+  /** Lands the caller on the tool it just created, matching the skill create flow. */
+  onCreated?: (toolId: string) => void
 }
 
 /**
@@ -46,7 +50,13 @@ interface CustomToolDetailProps {
  * stacked (no tabs — the page has room for both). Uses the same fields as the
  * canvas modal so the two surfaces never drift.
  */
-export function CustomToolDetail({ workspaceId, tool, onBack }: CustomToolDetailProps) {
+export function CustomToolDetail({
+  workspaceId,
+  tool,
+  readOnly = false,
+  onBack,
+  onCreated,
+}: CustomToolDetailProps) {
   const isEditing = !!tool
 
   const createTool = useCreateCustomTool()
@@ -153,11 +163,15 @@ export function CustomToolDetail({ workspaceId, tool, onBack }: CustomToolDetail
         setSeededSchema(jsonSchema)
         setSeededCode(functionCode)
       } else {
-        await createTool.mutateAsync({
+        const created = await createTool.mutateAsync({
           workspaceId,
           tool: { title, schema, code: functionCode },
         })
-        onBack()
+        // The upsert responds with the workspace's whole tool list (newest
+        // first), not just the new row — match by title rather than index.
+        const createdId = created.find((t) => t.title === title)?.id
+        if (createdId) onCreated?.(createdId)
+        else onBack()
       }
     } catch (error) {
       logger.error('Failed to save custom tool', error)
@@ -209,16 +223,18 @@ export function CustomToolDetail({ workspaceId, tool, onBack }: CustomToolDetail
           'Define the JSON schema your agents call, and the code that runs.'
         }
         actions={[
-          ...(isEditing
-            ? saveDiscardActions({
-                dirty,
-                saving,
-                onSave: handleSave,
-                onDiscard: handleDiscard,
-                saveDisabled: !isSchemaValid || streaming,
-              })
-            : createToolActions),
-          ...(tool
+          ...(readOnly
+            ? []
+            : isEditing
+              ? saveDiscardActions({
+                  dirty,
+                  saving,
+                  onSave: handleSave,
+                  onDiscard: handleDiscard,
+                  saveDisabled: !isSchemaValid || streaming,
+                })
+              : createToolActions),
+          ...(tool && !readOnly
             ? [
                 {
                   text: deleteTool.isPending ? 'Deleting...' : 'Delete',
@@ -237,11 +253,13 @@ export function CustomToolDetail({ workspaceId, tool, onBack }: CustomToolDetail
               schemaError ? <FieldErrorText>{schemaError}</FieldErrorText> : undefined
             }
             action={
-              <GeneratePromptControl
-                isLoading={schemaGeneration.isLoading}
-                isStreaming={schemaGeneration.isStreaming}
-                onSubmit={(prompt) => schemaGeneration.generateStream({ prompt })}
-              />
+              readOnly ? undefined : (
+                <GeneratePromptControl
+                  isLoading={schemaGeneration.isLoading}
+                  isStreaming={schemaGeneration.isStreaming}
+                  onSubmit={(prompt) => schemaGeneration.generateStream({ prompt })}
+                />
+              )
             }
           >
             <CustomToolSchemaField
@@ -259,11 +277,13 @@ export function CustomToolDetail({ workspaceId, tool, onBack }: CustomToolDetail
             label='Code'
             headerAccessory={codeError ? <FieldErrorText>{codeError}</FieldErrorText> : undefined}
             action={
-              <GeneratePromptControl
-                isLoading={codeGeneration.isLoading}
-                isStreaming={codeGeneration.isStreaming}
-                onSubmit={(prompt) => codeGeneration.generateStream({ prompt })}
-              />
+              readOnly ? undefined : (
+                <GeneratePromptControl
+                  isLoading={codeGeneration.isLoading}
+                  isStreaming={codeGeneration.isStreaming}
+                  onSubmit={(prompt) => codeGeneration.generateStream({ prompt })}
+                />
+              )
             }
           >
             <CustomToolCodeField

apps/sim/app/workspace/[workspaceId]/settings/components/custom-tools/custom-tools.tsx

@@ -1,7 +1,6 @@
 'use client'
 
 import { useState } from 'react'
-import { cn } from '@sim/emcn'
 import { getErrorMessage } from '@sim/utils/errors'
 import { ArrowRight, Plus, Wrench } from 'lucide-react'
 import { useParams } from 'next/navigation'
@@ -76,13 +75,18 @@ export function CustomTools() {
    */
   if (selectedToolId !== null && (isLoading || workspacePermissions.isLoading)) return null
 
-  if (canEdit && (isCreating || selectedTool)) {
+  if ((isCreating && canEdit) || selectedTool) {
     return (
       <CustomToolDetail
         key={isCreating ? 'new' : selectedTool?.id}
         workspaceId={workspaceId}
         tool={isCreating ? null : (selectedTool ?? null)}
+        readOnly={!canEdit}
         onBack={closeDetail}
+        onCreated={(toolId) => {
+          setIsCreating(false)
+          void setSelectedToolId(toolId)
+        }}
       />
     )
   }
@@ -114,19 +118,13 @@ export function CustomTools() {
               key={tool.id}
               type='button'
               onClick={() => void setSelectedToolId(tool.id)}
-              className={cn(
-                'w-full rounded-lg p-2 text-left transition-colors',
-                canEdit ? 'cursor-pointer hover-hover:bg-[var(--surface-active)]' : 'cursor-default'
-              )}
-              disabled={!canEdit}
+              className='w-full cursor-pointer rounded-lg p-2 text-left transition-colors hover-hover:bg-[var(--surface-active)]'
             >
               <SettingsResourceRow
                 icon={<Wrench />}
                 title={tool.title || 'Unnamed Tool'}
                 description={tool.schema?.function?.description || undefined}
-                trailing={
-                  canEdit ? <ArrowRight className='size-4 text-[var(--text-icon)]' /> : undefined
-                }
+                trailing={<ArrowRight className='size-4 text-[var(--text-icon)]' />}
               />
             </button>
           ))}

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/hooks/use-wand.ts

@@ -136,17 +136,6 @@ export function useWand({
     setError(null)
   }, [])
 
-  const openPrompt = useCallback(() => {
-    setIsPromptVisible(true)
-    setPromptInputValue('')
-  }, [])
-
-  const closePrompt = useCallback(() => {
-    if (isLoading) return
-    setIsPromptVisible(false)
-    setPromptInputValue('')
-  }, [isLoading])
-
   const generateStream = useCallback(
     async ({ prompt }: { prompt: string }) => {
       if (!prompt) {
@@ -294,8 +283,6 @@ export function useWand({
     generateStream,
     showPromptInline,
     hidePromptInline,
-    openPrompt,
-    closePrompt,
     updatePromptValue,
     cancelGeneration,
   }