|
2 | 2 |
|
3 | 3 | import { createElement, useEffect, useMemo, useState } from 'react' |
4 | 4 | import { createLogger } from '@sim/logger' |
5 | | -import { AlertTriangle, Plus, RefreshCw, Search, Share2, Trash2 } from 'lucide-react' |
| 5 | +import { AlertTriangle, Check, Copy, Plus, RefreshCw, Search, Share2, Trash2 } from 'lucide-react' |
6 | 6 | import { useParams } from 'next/navigation' |
7 | 7 | import { |
8 | 8 | Badge, |
@@ -185,6 +185,7 @@ export function CredentialsManager() { |
185 | 185 | const [selectedDescriptionDraft, setSelectedDescriptionDraft] = useState('') |
186 | 186 | const [selectedDisplayNameDraft, setSelectedDisplayNameDraft] = useState('') |
187 | 187 | const [showCreateOAuthRequiredModal, setShowCreateOAuthRequiredModal] = useState(false) |
| 188 | + const [copyIdSuccess, setCopyIdSuccess] = useState(false) |
188 | 189 | const { data: session } = useSession() |
189 | 190 | const currentUserId = session?.user?.id || '' |
190 | 191 |
|
@@ -1103,7 +1104,29 @@ export function CredentialsManager() { |
1103 | 1104 | {selectedCredential.type === 'oauth' ? ( |
1104 | 1105 | <div className='flex flex-col gap-[10px]'> |
1105 | 1106 | <div> |
1106 | | - <Label htmlFor='credential-display-name'>Display Name</Label> |
| 1107 | + <div className='flex items-center gap-[6px]'> |
| 1108 | + <Label htmlFor='credential-display-name'>Display Name</Label> |
| 1109 | + <Tooltip.Root> |
| 1110 | + <Tooltip.Trigger asChild> |
| 1111 | + <Button |
| 1112 | + variant='ghost' |
| 1113 | + className='h-[20px] w-[20px] p-0' |
| 1114 | + onClick={() => { |
| 1115 | + navigator.clipboard.writeText(selectedCredential.id) |
| 1116 | + setCopyIdSuccess(true) |
| 1117 | + setTimeout(() => setCopyIdSuccess(false), 2000) |
| 1118 | + }} |
| 1119 | + > |
| 1120 | + {copyIdSuccess ? ( |
| 1121 | + <Check className='h-[11px] w-[11px]' /> |
| 1122 | + ) : ( |
| 1123 | + <Copy className='h-[11px] w-[11px]' /> |
| 1124 | + )} |
| 1125 | + </Button> |
| 1126 | + </Tooltip.Trigger> |
| 1127 | + <Tooltip.Content>Copy credential ID</Tooltip.Content> |
| 1128 | + </Tooltip.Root> |
| 1129 | + </div> |
1107 | 1130 | <Input |
1108 | 1131 | id='credential-display-name' |
1109 | 1132 | value={selectedDisplayNameDraft} |
|
0 commit comments