Github/screenshot-to-code
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add disable when generating instruction

Browse Source
This commit is contained in:
clean99 2023-11-24 10:13:36 +08:00
parent 2df5d55c1c
commit 90f26de4d3
1 changed files with 7 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/src/App.tsx
View File

@ -211,7 +211,8 @@ function App() {
{IS_RUNNING_ON_CLOUD && !settings.openAiApiKey && <OnboardingNote />} {IS_RUNNING_ON_CLOUD && !settings.openAiApiKey && <OnboardingNote />}
{(appState === AppState.CODING || {(appState === AppState.CODING ||
appState === AppState.CODE_READY) && ( appState === AppState.CODE_READY ||
appState === AppState.INSTRUCTION_GENERATING) && (
<> <>
{/* Show code preview only when coding */} {/* Show code preview only when coding */}
{appState === AppState.CODING && ( {appState === AppState.CODING && (
@ -229,13 +230,14 @@ function App() {
</div> </div>
)} )}
{appState === AppState.CODE_READY && ( {(appState === AppState.CODE_READY || appState === AppState.INSTRUCTION_GENERATING) && (
<div> <div>
<div className="grid w-full gap-2"> <div className="grid w-full gap-2">
<Textarea <Textarea
placeholder="Tell the AI what to change..." placeholder="Tell the AI what to change..."
onChange={(e) => setUpdateInstruction(e.target.value)} onChange={(e) => setUpdateInstruction(e.target.value)}
value={updateInstruction} value={updateInstruction}
disabled={appState === AppState.INSTRUCTION_GENERATING}
/> />
<div className="flex justify-between items-center gap-x-2"> <div className="flex justify-between items-center gap-x-2">
<div className="font-500 text-xs text-slate-700"> <div className="font-500 text-xs text-slate-700">
@ -244,15 +246,17 @@ function App() {
<Switch <Switch
checked={shouldIncludeResultImage} checked={shouldIncludeResultImage}
onCheckedChange={setShouldIncludeResultImage} onCheckedChange={setShouldIncludeResultImage}
disabled={appState === AppState.INSTRUCTION_GENERATING}
/> />
</div> </div>
<Button <Button
onClick={instructionGenerate} onClick={instructionGenerate}
className="flex items-center gap-x-2" className="flex items-center gap-x-2"
disabled={appState === AppState.INSTRUCTION_GENERATING}
> >
Generate Instruction Generate Instruction
</Button> </Button>
<Button onClick={doUpdate}>Update</Button> <Button onClick={doUpdate} disabled={appState === AppState.INSTRUCTION_GENERATING}>Update</Button>
</div> </div>
<div className="flex items-center gap-x-2 mt-2"> <div className="flex items-center gap-x-2 mt-2">
<Button <Button