mirror of
https://github.com/dograh-hq/dograh.git
synced 2026-06-22 08:38:13 +02:00
chore: rename deploy/embed widget section to add to website
This commit is contained in:
parent
0282eb3225
commit
81a363b06e
9 changed files with 49 additions and 22 deletions
|
|
@ -1,4 +1,4 @@
|
|||
import { Check, Copy, Loader2, Mic, Plus, Rocket, Trash2 } from "lucide-react";
|
||||
import { Check, Copy, ExternalLink, Loader2, Mic, Plus, Rocket, Trash2 } from "lucide-react";
|
||||
import { useCallback, useEffect, useState } from "react";
|
||||
|
||||
import {
|
||||
|
|
@ -25,6 +25,7 @@ import {
|
|||
} from "@/components/ui/select";
|
||||
import { Separator } from "@/components/ui/separator";
|
||||
import { Switch } from "@/components/ui/switch";
|
||||
import { WIDGET_MODE_DOCUMENTATION_URLS } from "@/constants/documentation";
|
||||
|
||||
interface EmbedDialogProps {
|
||||
open: boolean;
|
||||
|
|
@ -177,12 +178,23 @@ export function EmbedDialog({
|
|||
<Dialog open={open} onOpenChange={onOpenChange}>
|
||||
<DialogContent className="sm:max-w-4xl w-full max-h-[90vh] overflow-y-auto">
|
||||
<DialogHeader>
|
||||
<DialogTitle className="flex items-center gap-2">
|
||||
<Rocket className="h-5 w-5" />
|
||||
Deploy Workflow
|
||||
</DialogTitle>
|
||||
<div className="flex items-center justify-between">
|
||||
<DialogTitle className="flex items-center gap-2">
|
||||
<Rocket className="h-5 w-5" />
|
||||
Configure Widget
|
||||
</DialogTitle>
|
||||
<a
|
||||
href={WIDGET_MODE_DOCUMENTATION_URLS[embedMode]}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="flex items-center gap-1 text-sm text-muted-foreground hover:text-foreground transition-colors pr-6"
|
||||
>
|
||||
Docs
|
||||
<ExternalLink className="h-3.5 w-3.5" />
|
||||
</a>
|
||||
</div>
|
||||
<DialogDescription>
|
||||
Embed "{workflowName}" on any website with a simple script tag
|
||||
Add "{workflowName}" to any website with a simple script tag.
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
|
||||
|
|
@ -542,8 +554,8 @@ document.getElementById('talk-btn').addEventListener('click', () => {
|
|||
</Button>
|
||||
</div>
|
||||
|
||||
{/* Embed Script (shows after saving) */}
|
||||
{embedToken && embedToken.is_active && (
|
||||
{/* Embed Script (shows after saving; placeholder before) */}
|
||||
{embedToken && embedToken.is_active ? (
|
||||
<>
|
||||
<Separator />
|
||||
<div className="space-y-3">
|
||||
|
|
@ -578,6 +590,16 @@ document.getElementById('talk-btn').addEventListener('click', () => {
|
|||
</p>
|
||||
</div>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<Separator />
|
||||
<div className="space-y-3">
|
||||
<Label className="text-muted-foreground">Embed Code</Label>
|
||||
<div className="rounded-lg border border-dashed bg-muted/30 px-4 py-8 text-center text-sm text-muted-foreground">
|
||||
Click <span className="font-medium">Save Configurations</span> to generate your embed script.
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -79,7 +79,7 @@ const NAV_ITEMS = [
|
|||
{ id: "dictionary", label: "Dictionary", icon: BookA },
|
||||
{ id: "voicemail", label: "Voicemail Detection", icon: PhoneOff },
|
||||
{ id: "recordings", label: "Recordings", icon: Mic },
|
||||
{ id: "deployment", label: "Deployment", icon: Rocket },
|
||||
{ id: "deployment", label: "Add to Website", icon: Rocket },
|
||||
{ id: "report", label: "Report", icon: FileDown },
|
||||
{ id: "identity", label: "Agent UUID", icon: Fingerprint },
|
||||
];
|
||||
|
|
@ -1294,17 +1294,16 @@ function WorkflowSettingsInner({
|
|||
<CardHeader>
|
||||
<CardTitle className="flex items-center gap-2 text-base">
|
||||
<Rocket className="h-4 w-4" />
|
||||
Deployment
|
||||
Add to Website
|
||||
</CardTitle>
|
||||
<CardDescription>
|
||||
Generate and manage the embed configuration to deploy this workflow on external
|
||||
websites.{" "}
|
||||
Configure a widget to add this voice agent to your website.{" "}
|
||||
<a href={SETTINGS_DOCUMENTATION_URLS.deployment} target="_blank" rel="noopener noreferrer" className="inline-flex items-center gap-0.5 underline">Learn more <ExternalLink className="h-3 w-3" /></a>
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
<CardFooter className="border-t pt-6">
|
||||
<Button variant="outline" onClick={() => setIsEmbedDialogOpen(true)}>
|
||||
Configure Embed
|
||||
Configure Widget
|
||||
</Button>
|
||||
</CardFooter>
|
||||
</Card>
|
||||
|
|
|
|||
|
|
@ -24,7 +24,13 @@ export const SETTINGS_DOCUMENTATION_URLS: Record<string, string> = {
|
|||
templateVariables: `${DOCS_BASE}/voice-agent/template-variables`,
|
||||
|
||||
recordings: `${DOCS_BASE}/voice-agent/pre-recorded-audio`,
|
||||
deployment: `${DOCS_BASE}/deployment/web-widget`,
|
||||
deployment: `${DOCS_BASE}/voice-agent/add-to-website`,
|
||||
};
|
||||
|
||||
export const WIDGET_MODE_DOCUMENTATION_URLS: Record<"floating" | "inline" | "headless", string> = {
|
||||
floating: `${DOCS_BASE}/voice-agent/add-to-website#floating-widget`,
|
||||
inline: `${DOCS_BASE}/voice-agent/add-to-website#inline-component`,
|
||||
headless: `${DOCS_BASE}/voice-agent/add-to-website#headless-mode`,
|
||||
};
|
||||
|
||||
export const TOOL_DOCUMENTATION_URLS: Record<string, string> = {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue