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

Add tooltips and change section headings

Browse source
This commit is contained in:
akhisud3195 2025-02-17 16:37:54 +05:30
parent b8ac0482fc
commit bfdc58fa40
5 changed files with 71 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

36
apps/rowboat/app/projects/[projectId]/playground/app.tsx
View file

@ -98,22 +98,26 @@ export function App({
}
return (
<Pane title="Chat" actions={[
<ActionButton
key="new-chat"
icon={<MessageSquarePlusIcon size={16} />}
onClick={handleNewChatButtonClick}
>
New chat
</ActionButton>,
<ActionButton
key="simulate"
icon={<PlayIcon size={16} />}
onClick={handleSimulateButtonClick}
>
Simulate
</ActionButton>,
]}>
<Pane
title="PLAYGROUND"
tooltip="Test your agents and see their responses in this interactive chat interface"
actions={[
<ActionButton
key="new-chat"
icon={<MessageSquarePlusIcon size={16} />}
onClick={handleNewChatButtonClick}
>
New chat
</ActionButton>,
<ActionButton
key="simulate"
icon={<PlayIcon size={16} />}
onClick={handleSimulateButtonClick}
>
Simulate
</ActionButton>,
]}
>
<div className="h-full overflow-auto">
{loadingChat && <div className="flex justify-center items-center h-full">
<Spinner />

33
apps/rowboat/app/projects/[projectId]/workflow/copilot.tsx
View file

@ -529,20 +529,25 @@ export function Copilot({
setResponseError: (error: string | null) => void;
}) {
return (
<Pane fancy title="Copilot" actions={[
<ActionButton
key="ask"
primary
icon={
<svg className="w-4 h-4" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
<path stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M5 12h14m-7 7V5" />
</svg>
}
onClick={onNewChat}
>
New
</ActionButton>
]}>
<Pane
fancy
title="COPILOT"
tooltip="Get AI assistance for creating and improving your multi-agent system"
actions={[
<ActionButton
key="ask"
primary
icon={
<svg className="w-4 h-4" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
<path stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M5 12h14m-7 7V5" />
</svg>
}
onClick={onNewChat}
>
New
</ActionButton>
]}
>
<App
projectId={projectId}
workflow={workflow}

5
apps/rowboat/app/projects/[projectId]/workflow/entity_list.tsx
View file

@ -105,7 +105,10 @@ export function EntityList({
}, [selectedEntity]);
return (
<Pane title="Index">
<Pane
title="WORKFLOW"
tooltip="Browse and manage your agents, tools, and prompts in this sidebar"
>
<div className="overflow-auto flex flex-col gap-1 justify-start">
{/* Agents Section */}
<SectionHeader title="Agents" onAdd={() => onAddAgent({})} />

28
apps/rowboat/app/projects/[projectId]/workflow/pane.tsx
View file

@ -1,26 +1,44 @@
import clsx from "clsx";
import { InfoIcon } from "lucide-react";
import { Tooltip } from "@nextui-org/react";
export function Pane({
title,
actions = null,
children,
fancy = false,
tooltip = null,
}: {
title: React.ReactNode;
actions?: React.ReactNode[] | null;
children: React.ReactNode;
fancy?: boolean;
tooltip?: string | null;
}) {
return <div className={clsx("h-full flex flex-col overflow-auto rounded-md p-1", {
"bg-gray-100": !fancy,
"bg-blue-100": fancy,
})}>
<div className="shrink-0 flex justify-between items-center gap-2 px-2 py-1 rounded-t-sm">
<div className={clsx("text-xs font-semibold uppercase", {
"text-gray-400": !fancy,
"text-blue-500": fancy,
})}>
{title}
<div className="flex items-center gap-1">
<div className={clsx("text-xs font-semibold uppercase", {
"text-gray-400": !fancy,
"text-blue-500": fancy,
})}>
{title}
</div>
{tooltip && (
<Tooltip
content={tooltip}
placement="right"
className="cursor-help"
>
<InfoIcon size={12} className={clsx({
"text-gray-400": !fancy,
"text-blue-500": fancy,
})} />
</Tooltip>
)}
</div>
{!actions && <div className="w-4 h-4" />}
{actions && <div className={clsx("rounded-md hover:text-gray-800 px-2 text-sm flex items-center gap-2", {

8
apps/rowboat/app/projects/[projectId]/workflow/workflow_editor.tsx
View file

@ -29,6 +29,8 @@ import { BackIcon, HamburgerIcon, WorkflowIcon } from "../../../lib/components/i
import { CopyIcon, Layers2Icon, RadioIcon, RedoIcon, Sparkles, UndoIcon } from "lucide-react";
import { EntityList } from "./entity_list";
import { CopilotMessage } from "../../../lib/types/copilot_types";
import { InfoIcon } from "lucide-react";
import { clsx } from "clsx";
enablePatches();
@ -760,7 +762,7 @@ export function WorkflowEditor({
</div>}
{!isLive && <>
<button
className="p-1 text-gray-400 hover:text-black"
className="p-1 text-gray-400 hover:text-black hover:cursor-pointer"
title="Undo"
disabled={state.currentIndex <= 0}
onClick={() => dispatch({ type: "undo" })}
@ -768,7 +770,7 @@ export function WorkflowEditor({
<UndoIcon size={16} />
</button>
<button
className="p-1 text-gray-400 hover:text-black"
className="p-1 text-gray-400 hover:text-black hover:cursor-pointer"
title="Redo"
disabled={state.currentIndex >= state.patches.length}
onClick={() => dispatch({ type: "redo" })}
@ -776,7 +778,7 @@ export function WorkflowEditor({
<RedoIcon size={16} />
</button>
<button
className="p-1 text-blue-600 hover:text-blue-800"
className="p-1 text-blue-600 hover:text-blue-800 hover:cursor-pointer"
title="Toggle Copilot"
onClick={() => setShowCopilot(!showCopilot)}
>