improve compose box size and button ui

This commit is contained in:
ramnique 2025-01-23 12:00:55 +05:30
parent f739d85cb7
commit 64287bd576
2 changed files with 9 additions and 10 deletions

View file

@ -1,6 +1,7 @@
'use client'; 'use client';
import { Button, Spinner, Textarea } from "@nextui-org/react"; import { Button, Spinner, Textarea } from "@nextui-org/react";
import { CornerDownLeftIcon } from "lucide-react";
import { useRef, useState, useEffect } from "react"; import { useRef, useState, useEffect } from "react";
import { apiV1 } from "rowboat-shared"; import { apiV1 } from "rowboat-shared";
import { z } from "zod"; import { z } from "zod";
@ -48,22 +49,20 @@ export function ComposeBox({
variant="bordered" variant="bordered"
placeholder="Enter message..." placeholder="Enter message..."
minRows={minRows} minRows={minRows}
maxRows={5} maxRows={15}
value={input} value={input}
onValueChange={setInput} onValueChange={setInput}
onKeyDown={handleInputKeyDown} onKeyDown={handleInputKeyDown}
disabled={disabled} disabled={disabled}
className="w-full" className="w-full"
endContent={<Button endContent={<Button
size="sm"
isIconOnly isIconOnly
disabled={disabled} disabled={disabled}
onClick={handleInput} onClick={handleInput}
className="bg-gray-100" className="bg-gray-100"
> >
{!loading && <svg className="w-6 h-6" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"> <CornerDownLeftIcon size={16} />
<path stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1" d="M12 6v13m0-13 4 4m-4-4-4 4" />
</svg>}
{loading && <Spinner size="sm" />}
</Button>} </Button>}
/>; />;
} }

View file

@ -10,6 +10,7 @@ import clsx from "clsx";
import { Action as WorkflowDispatch } from "./workflow_editor"; import { Action as WorkflowDispatch } from "./workflow_editor";
import MarkdownContent from "@/app/lib/components/markdown-content"; import MarkdownContent from "@/app/lib/components/markdown-content";
import { CopyAsJsonButton } from "../playground/copy-as-json-button"; import { CopyAsJsonButton } from "../playground/copy-as-json-button";
import { CornerDownLeftIcon, SendIcon } from "lucide-react";
const CopilotContext = createContext<{ const CopilotContext = createContext<{
@ -77,19 +78,18 @@ function ComposeBox({
variant="bordered" variant="bordered"
placeholder="Enter message..." placeholder="Enter message..."
minRows={3} minRows={3}
maxRows={5} maxRows={15}
value={input} value={input}
onValueChange={setInput} onValueChange={setInput}
onKeyDown={handleInputKeyDown} onKeyDown={handleInputKeyDown}
className="w-full" className="w-full"
endContent={<Button endContent={<Button
size="sm"
isIconOnly isIconOnly
onClick={handleInput} onClick={handleInput}
className="bg-gray-100" className="bg-gray-100"
> >
<svg className="w-6 h-6" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"> <CornerDownLeftIcon size={16} />
<path stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1" d="M12 6v13m0-13 4 4m-4-4-4 4" />
</svg>
</Button>} </Button>}
/> />
} }