github/sim
1
0
Fork 0
mirror of https://github.com/simstudioai/sim.git synced 2026-01-10 23:48:09 -05:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): fixed placeholder on custom tool modal, changed icon for code generator

Browse Source
This commit is contained in:
Waleed Latif
2025-04-13 15:56:22 -07:00
parent 0ec14af36f
commit 4cebb45032
3 changed files with 14 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
sim/app/w/[id]/components/workflow-block/components/sub-block/components/code.tsx
View File

@@ -1,6 +1,6 @@
import { useEffect, useRef, useState } from 'react'
import type { ReactElement } from 'react'
import { SparklesIcon } from 'lucide-react'
import { Wand2 } from 'lucide-react'
import { highlight, languages } from 'prismjs'
import 'prismjs/components/prism-javascript'
import 'prismjs/themes/prism.css'
@@ -304,9 +304,9 @@ export function Code({
onClick={isPromptVisible ? hidePromptInline : showPromptInline}
disabled={isAiLoading || isAiStreaming}
aria-label="Generate code with AI"
className="h-8 w-8 text-muted-foreground hover:text-foreground"
className="h-8 w-8 rounded-full bg-muted/80 hover:bg-muted shadow-sm hover:shadow text-muted-foreground hover:text-primary transition-all duration-200 border border-transparent hover:border-primary/20"
>
<SparklesIcon className="h-4 w-4" />
<Wand2 className="h-4 w-4" />
</Button>
)}

8
sim/app/w/[id]/components/workflow-block/components/sub-block/components/tool-input/components/code-editor/code-editor.tsx
View File

@@ -181,12 +181,12 @@ export function CodeEditor({
}}
>
{code.length === 0 && placeholder && (
<div
className="absolute top-[12px] text-muted-foreground/50 select-none pointer-events-none"
style={{ left: `calc(${gutterWidth} + 12px)` }}
<pre
className="absolute top-[12px] text-muted-foreground/50 select-none pointer-events-none whitespace-pre-wrap overflow-visible"
style={{ left: `calc(${gutterWidth} + 12px)`, fontFamily: 'inherit', margin: 0 }}
>
{placeholder}
</div>
</pre>
)}
<Editor

14
sim/app/w/[id]/components/workflow-block/components/sub-block/components/tool-input/components/custom-tool-modal/custom-tool-modal.tsx
View File

@@ -1,5 +1,5 @@
import { useEffect, useMemo, useRef, useState } from 'react'
import { Code, FileJson, SparklesIcon, X } from 'lucide-react'
import { Code, FileJson, Wand2, X } from 'lucide-react'
import { Button } from '@/components/ui/button'
import {
Dialog,
@@ -528,7 +528,7 @@ export function CustomToolModal({
<Button
variant="ghost"
size="icon"
className="h-5 w-5 p-0 text-muted-foreground hover:text-foreground"
className="h-5 w-5 p-0 rounded-full bg-muted/80 hover:bg-muted shadow-sm hover:shadow text-muted-foreground hover:text-primary transition-all duration-200 border border-transparent hover:border-primary/20"
onClick={() => {
logger.debug('Schema AI button clicked')
logger.debug(
@@ -542,7 +542,7 @@ export function CustomToolModal({
disabled={schemaGeneration.isLoading || schemaGeneration.isStreaming}
aria-label="Generate schema with AI"
>
<SparklesIcon className="h-3 w-3" />
<Wand2 className="h-3 w-3" />
</Button>
</div>
{schemaError &&
@@ -571,7 +571,7 @@ export function CustomToolModal({
}
}
}`}
minHeight="340px"
minHeight="360px"
className={cn(
schemaError && !schemaGeneration.isStreaming ? 'border-red-500' : '',
(schemaGeneration.isLoading || schemaGeneration.isStreaming) &&
@@ -598,7 +598,7 @@ export function CustomToolModal({
<Button
variant="ghost"
size="icon"
className="h-5 w-5 p-0 text-muted-foreground hover:text-foreground"
className="h-5 w-5 p-0 rounded-full bg-muted/80 hover:bg-muted shadow-sm hover:shadow text-muted-foreground hover:text-primary transition-all duration-200 border border-transparent hover:border-primary/20"
onClick={() => {
logger.debug('Code AI button clicked')
logger.debug(
@@ -612,7 +612,7 @@ export function CustomToolModal({
disabled={codeGeneration.isLoading || codeGeneration.isStreaming}
aria-label="Generate code with AI"
>
<SparklesIcon className="h-3 w-3" />
<Wand2 className="h-3 w-3" />
</Button>
</div>
{codeError &&
@@ -626,7 +626,7 @@ export function CustomToolModal({
onChange={handleFunctionCodeChange}
language="javascript"
placeholder={`// This code will be executed when the tool is called. You can use environment variables with {{VARIABLE_NAME}}.`}
minHeight="340px"
minHeight="360px"
className={cn(
codeError && !codeGeneration.isStreaming ? 'border-red-500' : '',
(codeGeneration.isLoading || codeGeneration.isStreaming) &&