Add AssistantIdentity component to AssistantPage for assistant ID display and copy functionality
- Introduce the AssistantIdentity component to show the current assistant ID and provide a copy-to-clipboard feature. - Update multiple sections of AssistantPage to include the AssistantIdentity component, enhancing user interaction with assistant IDs. - Ensure the component handles the display of the assistant ID and provides feedback when copied successfully.
This commit is contained in:
@@ -1146,6 +1146,7 @@ export function AssistantPage() {
|
|||||||
value={difyForm.name}
|
value={difyForm.name}
|
||||||
onChange={(value) => updateDifyForm("name", value)}
|
onChange={(value) => updateDifyForm("name", value)}
|
||||||
/>
|
/>
|
||||||
|
<AssistantIdentity assistantId={editingId} />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="flex shrink-0 gap-2">
|
<div className="flex shrink-0 gap-2">
|
||||||
@@ -1244,6 +1245,7 @@ export function AssistantPage() {
|
|||||||
value={fastGptForm.name}
|
value={fastGptForm.name}
|
||||||
onChange={(value) => updateFastGptForm("name", value)}
|
onChange={(value) => updateFastGptForm("name", value)}
|
||||||
/>
|
/>
|
||||||
|
<AssistantIdentity assistantId={editingId} />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="flex shrink-0 gap-2">
|
<div className="flex shrink-0 gap-2">
|
||||||
@@ -1348,6 +1350,7 @@ export function AssistantPage() {
|
|||||||
value={openCodeForm.name}
|
value={openCodeForm.name}
|
||||||
onChange={(value) => updateOpenCodeForm("name", value)}
|
onChange={(value) => updateOpenCodeForm("name", value)}
|
||||||
/>
|
/>
|
||||||
|
<AssistantIdentity assistantId={editingId} />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="flex shrink-0 gap-2">
|
<div className="flex shrink-0 gap-2">
|
||||||
@@ -1465,6 +1468,7 @@ export function AssistantPage() {
|
|||||||
value={form.name}
|
value={form.name}
|
||||||
onChange={(value) => updateForm("name", value)}
|
onChange={(value) => updateForm("name", value)}
|
||||||
/>
|
/>
|
||||||
|
<AssistantIdentity assistantId={editingId} />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="flex shrink-0 gap-2">
|
<div className="flex shrink-0 gap-2">
|
||||||
@@ -1879,6 +1883,37 @@ function EditorBackButton({ onClick }: { onClick: () => void }) {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function AssistantIdentity({ assistantId }: { assistantId: string | null }) {
|
||||||
|
const [copied, setCopied] = useState(false);
|
||||||
|
|
||||||
|
async function copyId() {
|
||||||
|
if (!assistantId) return;
|
||||||
|
await navigator.clipboard.writeText(assistantId);
|
||||||
|
setCopied(true);
|
||||||
|
window.setTimeout(() => setCopied(false), 1600);
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="ml-1 flex shrink-0 items-center rounded-full border border-hairline bg-canvas-soft pl-2.5 text-[11px] text-muted-foreground">
|
||||||
|
<span className="font-mono">
|
||||||
|
{assistantId ? `ID · ${assistantId}` : "ID · 保存后生成"}
|
||||||
|
</span>
|
||||||
|
{assistantId && (
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
onClick={() => void copyId()}
|
||||||
|
className="ml-1 flex h-7 w-7 items-center justify-center rounded-full text-muted-soft transition-colors hover:bg-surface-strong hover:text-foreground"
|
||||||
|
aria-label={copied ? "助手 ID 已复制" : "复制助手 ID"}
|
||||||
|
title={copied ? "已复制" : "复制 ID"}
|
||||||
|
>
|
||||||
|
{copied ? <Check size={13} /> : <Copy size={13} />}
|
||||||
|
</button>
|
||||||
|
)}
|
||||||
|
{!assistantId && <span className="h-7 w-2" aria-hidden />}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
function EditableTitle({
|
function EditableTitle({
|
||||||
value,
|
value,
|
||||||
onChange,
|
onChange,
|
||||||
|
|||||||
Reference in New Issue
Block a user