apunkt/rowboat
1
0
Fork 0
mirror of https://github.com/rowboatlabs/rowboat.git synced 2026-05-25 18:55:19 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix import json related glitches

Browse source
This commit is contained in:
akhisud3195 2025-07-21 13:41:51 +05:30
parent 2551b34b26
commit a29169a6db
1 changed files with 75 additions and 68 deletions
Download patch file Download diff file Expand all files Collapse all files

45
apps/rowboat/app/projects/select/components/create-project.tsx
View file

@ -317,7 +317,7 @@ export function CreateProject({ defaultName, onOpenProjectPane, isProjectPaneOpe
>
{/* Main Section: What do you want to build? and Import JSON */}
<div className="flex flex-col gap-6">
<div className="flex w-full items-center justify-between">
<div className="flex w-full items-center">
<label className={largeSectionHeaderStyles}>
✏️ What do you want to build?
</label>
@ -335,8 +335,8 @@ export function CreateProject({ defaultName, onOpenProjectPane, isProjectPaneOpe
{/* If a file is imported, show filename, cross button, and create button. Otherwise, show compose box. */}
{importedJson ? (
<div className="flex flex-col items-start gap-4">
<div className="flex items-center gap-2 bg-transparent border border-gray-300 dark:border-gray-700 rounded-full px-3 py-1.5 shadow-sm">
<Upload size={16} className="text-indigo-500 dark:text-indigo-400 mr-1" />
<div className="flex items-center gap-2">
<div className="flex items-center bg-transparent border border-gray-300 dark:border-gray-700 rounded-full px-3 h-8 shadow-sm">
<span className="text-sm font-medium text-gray-900 dark:text-gray-100 truncate max-w-[160px]">{importedFilename}</span>
<button
type="button"
@ -347,6 +347,7 @@ export function CreateProject({ defaultName, onOpenProjectPane, isProjectPaneOpe
<X size={16} />
</button>
</div>
</div>
<Button
type="submit"
variant="primary"
@ -357,7 +358,9 @@ export function CreateProject({ defaultName, onOpenProjectPane, isProjectPaneOpe
</Button>
</div>
) : (
<div className="relative group">
<>
<div className="relative group flex flex-col">
<div className="relative">
<Textarea
value={customPrompt}
onChange={(e) => {
@ -371,35 +374,24 @@ export function CreateProject({ defaultName, onOpenProjectPane, isProjectPaneOpe
"text-gray-900 dark:text-gray-100",
promptError && "border-red-500 focus:ring-red-500/20",
!customPrompt && emptyTextareaStyles,
"pr-12 pb-10" // space for send button and import pill
"pr-14" // more space for send button
)}
style={{ minHeight: "120px" }}
autoFocus
autoResize
required
onKeyDown={(e) => {
if (e.key === 'Enter' && !importedJson && !e.shiftKey) {
if (e.key === 'Enter' && !e.shiftKey && !importedJson) {
e.preventDefault();
handleSubmit();
}
}}
/>
{/* Import Assistant JSON pill inside textarea */}
<div className="absolute left-3 bottom-3 flex items-center">
<button
type="button"
onClick={handleImportJsonClick}
className="flex items-center gap-1 text-xs font-medium text-gray-700 dark:text-gray-200 focus:outline-none"
>
<Upload size={14} className="text-indigo-500 dark:text-indigo-400" />
Import JSON instead
</button>
</div>
<div className="absolute right-3 bottom-3 z-10">
<button
type="submit"
disabled={importLoading || !customPrompt.trim()}
className={clsx(
"absolute right-3 bottom-3",
"rounded-full p-2",
customPrompt.trim()
? "bg-indigo-50 hover:bg-indigo-100 text-indigo-700 dark:bg-indigo-900/50 dark:hover:bg-indigo-800/60 dark:text-indigo-300"
@ -409,12 +401,27 @@ export function CreateProject({ defaultName, onOpenProjectPane, isProjectPaneOpe
>
<Send size={18} />
</button>
</div>
</div>
{promptError && (
<p className="text-sm text-red-500 mt-2">
<p className="text-sm text-red-500 m-0 mt-2">
{promptError}
</p>
)}
</div>
{/* Import JSON button always below the main input, left-aligned, when no file is selected */}
<div className="mt-2">
<Button
variant="secondary"
size="sm"
onClick={handleImportJsonClick}
type="button"
startContent={<Upload size={16} />}
>
Import JSON
</Button>
</div>
</>
)}
</div>
</div>