mirror of
https://github.com/rowboatlabs/rowboat.git
synced 2026-05-09 23:32:37 +02:00
Clean up draft and live workflow switching options
This commit is contained in:
parent
6b49872154
commit
813da0ec81
1 changed files with 89 additions and 99 deletions
|
|
@ -935,6 +935,13 @@ export function WorkflowEditor({
|
||||||
}
|
}
|
||||||
}, [projectId]);
|
}, [projectId]);
|
||||||
|
|
||||||
|
// Hide copilot when switching to live mode
|
||||||
|
useEffect(() => {
|
||||||
|
if (isLive) {
|
||||||
|
setShowCopilot(false);
|
||||||
|
}
|
||||||
|
}, [isLive]);
|
||||||
|
|
||||||
// Reset initial state when user interacts with copilot or opens other menus
|
// Reset initial state when user interacts with copilot or opens other menus
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (state.present.selection !== null) {
|
if (state.present.selection !== null) {
|
||||||
|
|
@ -1225,13 +1232,13 @@ export function WorkflowEditor({
|
||||||
onChange={handleProjectNameChange}
|
onChange={handleProjectNameChange}
|
||||||
error={projectNameError}
|
error={projectNameError}
|
||||||
placeholder="Project name..."
|
placeholder="Project name..."
|
||||||
className="text-lg font-semibold"
|
className="text-lg font-semibold !min-h-[24px] !py-0.5 !border !border-gray-200 dark:!border-gray-700 !rounded-lg"
|
||||||
|
inline={true}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="h-6 w-px bg-gray-300 dark:bg-gray-600"></div>
|
<div className="h-6 w-px bg-gray-300 dark:bg-gray-600"></div>
|
||||||
|
|
||||||
<WorkflowIcon size={16} />
|
|
||||||
<div className="flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
{state.present.publishing && <Spinner size="sm" />}
|
{state.present.publishing && <Spinner size="sm" />}
|
||||||
{isLive && <div className="bg-green-100 dark:bg-green-900/30 text-green-700 dark:text-green-400 px-3 py-1.5 rounded-md text-sm font-medium flex items-center gap-2">
|
{isLive && <div className="bg-green-100 dark:bg-green-900/30 text-green-700 dark:text-green-400 px-3 py-1.5 rounded-md text-sm font-medium flex items-center gap-2">
|
||||||
|
|
@ -1242,35 +1249,7 @@ export function WorkflowEditor({
|
||||||
<PenLine size={16} />
|
<PenLine size={16} />
|
||||||
Draft workflow
|
Draft workflow
|
||||||
</div>}
|
</div>}
|
||||||
{/* Hamburger menu for workflow version switching */}
|
|
||||||
<Dropdown>
|
|
||||||
<DropdownTrigger>
|
|
||||||
<button
|
|
||||||
className="p-1.5 text-gray-600 hover:text-gray-800 dark:text-gray-400 dark:hover:text-gray-200 transition-colors"
|
|
||||||
aria-label="Workflow version menu"
|
|
||||||
type="button"
|
|
||||||
>
|
|
||||||
<HamburgerIcon size={16} />
|
|
||||||
</button>
|
|
||||||
</DropdownTrigger>
|
|
||||||
<DropdownMenu aria-label="Workflow version options">
|
|
||||||
<DropdownItem
|
|
||||||
key="switch-version"
|
|
||||||
onClick={() => onChangeMode(isLive ? 'draft' : 'live')}
|
|
||||||
>
|
|
||||||
{isLive ? "View Draft workflow" : "View Live workflow"}
|
|
||||||
</DropdownItem>
|
|
||||||
{!isLive ? (
|
|
||||||
<DropdownItem
|
|
||||||
key="revert-to-live"
|
|
||||||
onClick={handleRevertToLive}
|
|
||||||
className="text-red-600 dark:text-red-400"
|
|
||||||
>
|
|
||||||
Revert to Live workflow
|
|
||||||
</DropdownItem>
|
|
||||||
) : null}
|
|
||||||
</DropdownMenu>
|
|
||||||
</Dropdown>
|
|
||||||
{/* Download JSON icon button, with tooltip, to the left of the menu */}
|
{/* Download JSON icon button, with tooltip, to the left of the menu */}
|
||||||
<Tooltip content="Download Assistant JSON">
|
<Tooltip content="Download Assistant JSON">
|
||||||
<button
|
<button
|
||||||
|
|
@ -1291,18 +1270,10 @@ export function WorkflowEditor({
|
||||||
{isLive && <div className="flex items-center gap-2">
|
{isLive && <div className="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">
|
<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. You cannot make changes. Changes applied through copilot will<b>not</b>be reflected.
|
This version is locked. Changes applied will not be reflected.
|
||||||
</div>
|
</div>
|
||||||
<Button
|
|
||||||
variant="solid"
|
|
||||||
size="md"
|
|
||||||
onPress={() => setShowCopilot(!showCopilot)}
|
|
||||||
className="gap-2 px-4 bg-indigo-600 hover:bg-indigo-700 text-white font-semibold text-sm"
|
|
||||||
startContent={showCopilot ? null : <Sparkles size={16} />}
|
|
||||||
>
|
|
||||||
{showCopilot ? "Hide Skipper" : "Skipper"}
|
|
||||||
</Button>
|
|
||||||
</div>}
|
</div>}
|
||||||
|
|
||||||
{!isLive && <>
|
{!isLive && <>
|
||||||
<button
|
<button
|
||||||
className="p-1 text-gray-400 hover:text-black hover:cursor-pointer"
|
className="p-1 text-gray-400 hover:text-black hover:cursor-pointer"
|
||||||
|
|
@ -1320,6 +1291,9 @@ export function WorkflowEditor({
|
||||||
>
|
>
|
||||||
<RedoIcon size={16} />
|
<RedoIcon size={16} />
|
||||||
</button>
|
</button>
|
||||||
|
</>}
|
||||||
|
|
||||||
|
{/* Deploy CTA - always visible */}
|
||||||
<div className="flex">
|
<div className="flex">
|
||||||
<Button
|
<Button
|
||||||
variant="solid"
|
variant="solid"
|
||||||
|
|
@ -1347,21 +1321,7 @@ export function WorkflowEditor({
|
||||||
startContent={<SettingsIcon size={16} />}
|
startContent={<SettingsIcon size={16} />}
|
||||||
onPress={onSettingsModalOpen}
|
onPress={onSettingsModalOpen}
|
||||||
>
|
>
|
||||||
API & SDK
|
API & SDK settings
|
||||||
</DropdownItem>
|
|
||||||
<DropdownItem
|
|
||||||
key="phone"
|
|
||||||
startContent={<PhoneIcon size={16} />}
|
|
||||||
onPress={onPhoneModalOpen}
|
|
||||||
>
|
|
||||||
Phone
|
|
||||||
</DropdownItem>
|
|
||||||
<DropdownItem
|
|
||||||
key="chat-widget"
|
|
||||||
startContent={<MessageCircleIcon size={16} />}
|
|
||||||
onPress={onChatWidgetModalOpen}
|
|
||||||
>
|
|
||||||
Chat widget
|
|
||||||
</DropdownItem>
|
</DropdownItem>
|
||||||
<DropdownItem
|
<DropdownItem
|
||||||
key="manage-triggers"
|
key="manage-triggers"
|
||||||
|
|
@ -1370,10 +1330,41 @@ export function WorkflowEditor({
|
||||||
>
|
>
|
||||||
Manage triggers
|
Manage triggers
|
||||||
</DropdownItem>
|
</DropdownItem>
|
||||||
|
{!isLive ? (
|
||||||
|
<>
|
||||||
|
<DropdownItem
|
||||||
|
key="view-live"
|
||||||
|
startContent={<RadioIcon size={16} />}
|
||||||
|
onPress={() => onChangeMode('live')}
|
||||||
|
>
|
||||||
|
View live version
|
||||||
|
</DropdownItem>
|
||||||
|
<DropdownItem
|
||||||
|
key="reset-to-live"
|
||||||
|
startContent={<AlertTriangle size={16} />}
|
||||||
|
onPress={handleRevertToLive}
|
||||||
|
className="text-red-600 dark:text-red-400"
|
||||||
|
>
|
||||||
|
Reset to live version
|
||||||
|
</DropdownItem>
|
||||||
|
</>
|
||||||
|
) : null}
|
||||||
</DropdownMenu>
|
</DropdownMenu>
|
||||||
</Dropdown>
|
</Dropdown>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
{isLive && <div className="flex items-center gap-2">
|
||||||
<Button
|
<Button
|
||||||
|
variant="solid"
|
||||||
|
size="md"
|
||||||
|
onPress={() => onChangeMode('draft')}
|
||||||
|
className="gap-2 px-4 bg-gray-600 hover:bg-gray-700 text-white font-semibold text-sm"
|
||||||
|
>
|
||||||
|
Switch to draft
|
||||||
|
</Button>
|
||||||
|
</div>}
|
||||||
|
|
||||||
|
{!isLive && <Button
|
||||||
variant="solid"
|
variant="solid"
|
||||||
size="md"
|
size="md"
|
||||||
onPress={() => setShowCopilot(!showCopilot)}
|
onPress={() => setShowCopilot(!showCopilot)}
|
||||||
|
|
@ -1381,8 +1372,7 @@ export function WorkflowEditor({
|
||||||
startContent={showCopilot ? null : <Sparkles size={16} />}
|
startContent={showCopilot ? null : <Sparkles size={16} />}
|
||||||
>
|
>
|
||||||
{showCopilot ? "Hide Skipper" : "Skipper"}
|
{showCopilot ? "Hide Skipper" : "Skipper"}
|
||||||
</Button>
|
</Button>}
|
||||||
</>}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<ResizablePanelGroup direction="horizontal" className="grow flex overflow-auto gap-1">
|
<ResizablePanelGroup direction="horizontal" className="grow flex overflow-auto gap-1">
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue