apunkt/rowboat
1
0
Fork 0
mirror of https://github.com/rowboatlabs/rowboat.git synced 2026-07-12 21:02:17 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Update publish and deploy dropdowns in the topbar

Browse source
This commit is contained in:
akhisud3195 2025-08-19 23:23:14 +05:30
parent 883e23a115
commit a6167ee12e
1 changed files with 55 additions and 38 deletions
Download patch file Download diff file Expand all files Collapse all files

93
apps/rowboat/app/projects/[projectId]/workflow/components/TopBar.tsx
View file

@ -1,7 +1,7 @@
"use client"; "use client";
import React from "react"; import React from "react";
import { Button, Dropdown, DropdownItem, DropdownMenu, DropdownTrigger, Spinner, Tooltip, Input } from "@heroui/react"; import { Button, Dropdown, DropdownItem, DropdownMenu, DropdownTrigger, Spinner, Tooltip, Input } from "@heroui/react";
import { RadioIcon, RedoIcon, UndoIcon, RocketIcon, PenLine, AlertTriangle, DownloadIcon, SettingsIcon, ChevronDownIcon, ZapIcon, Clock } from "lucide-react"; import { RadioIcon, RedoIcon, UndoIcon, RocketIcon, PenLine, AlertTriangle, DownloadIcon, SettingsIcon, ChevronDownIcon, ZapIcon, Clock, Plug } from "lucide-react";
import { useParams, useRouter } from "next/navigation"; import { useParams, useRouter } from "next/navigation";
interface TopBarProps { interface TopBarProps {
@ -105,7 +105,7 @@ export function TopBar({
<div className="text-green-500">Copied to clipboard</div> <div className="text-green-500">Copied to clipboard</div>
</div>} </div>}
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
{isLive && <div className="flex items-center gap-2"> {isLive && <div className="flex items-center gap-2 absolute left-1/2 transform -translate-x-1/2">
<div className="bg-amber-50 dark:bg-amber-900/20 text-amber-700 dark:text-amber-400 px-3 py-1.5 rounded-md text-sm font-medium flex items-center gap-2"> <div className="bg-amber-50 dark:bg-amber-900/20 text-amber-700 dark:text-amber-400 px-3 py-1.5 rounded-md text-sm font-medium flex items-center gap-2">
<AlertTriangle size={16} /> <AlertTriangle size={16} />
This version is locked. Changes applied will not be reflected. This version is locked. Changes applied will not be reflected.
@ -133,43 +133,59 @@ export function TopBar({
{/* Deploy CTA - always visible */} {/* Deploy CTA - always visible */}
<div className="flex"> <div className="flex">
<Button {isLive ? (
variant="solid" <Dropdown>
size="md" <DropdownTrigger>
onPress={onPublishWorkflow} <Button
className="gap-2 px-4 bg-green-600 hover:bg-green-700 text-white font-semibold text-sm rounded-r-none" variant="solid"
startContent={<RocketIcon size={16} />} size="md"
data-tour-target="deploy" className="gap-2 px-4 bg-indigo-600 hover:bg-indigo-700 text-white font-semibold text-sm"
> startContent={<Plug size={16} />}
Deploy >
</Button> Use Assistant
<Dropdown> <ChevronDownIcon size={14} />
<DropdownTrigger> </Button>
</DropdownTrigger>
<DropdownMenu aria-label="Assistant access options">
<DropdownItem
key="api-sdk"
startContent={<SettingsIcon size={16} />}
onPress={() => { if (projectId) { router.push(`/projects/${projectId}/config`); } }}
>
API & SDK Settings
</DropdownItem>
<DropdownItem
key="manage-triggers"
startContent={<ZapIcon size={16} />}
onPress={() => { if (projectId) { router.push(`/projects/${projectId}/manage-triggers`); } }}
>
Manage Triggers
</DropdownItem>
</DropdownMenu>
</Dropdown>
) : (
<>
<Button <Button
variant="solid" variant="solid"
size="md" size="md"
className="min-w-0 px-2 bg-green-600 hover:bg-green-700 border-l-1 border-green-500 text-white font-semibold text-sm rounded-l-none" onPress={onPublishWorkflow}
className="gap-2 px-4 bg-green-600 hover:bg-green-700 text-white font-semibold text-sm rounded-r-none"
startContent={<RocketIcon size={16} />}
data-tour-target="deploy"
> >
<ChevronDownIcon size={14} /> Publish
</Button> </Button>
</DropdownTrigger> <Dropdown>
<DropdownMenu aria-label="Deploy actions"> <DropdownTrigger>
<DropdownItem <Button
key="settings" variant="solid"
startContent={<SettingsIcon size={16} />} size="md"
onPress={() => { if (projectId) { router.push(`/projects/${projectId}/config`); } }} className="min-w-0 px-2 bg-green-600 hover:bg-green-700 border-l-1 border-green-500 text-white font-semibold text-sm rounded-l-none"
> >
API & SDK settings <ChevronDownIcon size={14} />
</DropdownItem> </Button>
<DropdownItem </DropdownTrigger>
key="manage-triggers" <DropdownMenu aria-label="Deploy actions">
startContent={<ZapIcon size={16} />}
onPress={() => { if (projectId) { router.push(`/projects/${projectId}/manage-triggers`); } }}
>
Manage triggers
</DropdownItem>
{!isLive ? (
<>
<DropdownItem <DropdownItem
key="view-live" key="view-live"
startContent={<RadioIcon size={16} />} startContent={<RadioIcon size={16} />}
@ -185,10 +201,10 @@ export function TopBar({
> >
Reset to live version Reset to live version
</DropdownItem> </DropdownItem>
</> </DropdownMenu>
) : null} </Dropdown>
</DropdownMenu> </>
</Dropdown> )}
</div> </div>
{isLive && <div className="flex items-center gap-2"> {isLive && <div className="flex items-center gap-2">
@ -197,6 +213,7 @@ export function TopBar({
size="md" size="md"
onPress={() => onChangeMode('draft')} onPress={() => onChangeMode('draft')}
className="gap-2 px-4 bg-gray-600 hover:bg-gray-700 text-white font-semibold text-sm" className="gap-2 px-4 bg-gray-600 hover:bg-gray-700 text-white font-semibold text-sm"
startContent={<PenLine size={16} />}
> >
Switch to draft Switch to draft
</Button> </Button>