konnosApiUrl.tsx53 lines · main
| 1 | import { Link } from 'lucide-react' |
| 2 | import { toast } from 'sonner' |
| 3 | import { Badge, copyToClipboard } from 'ui' |
| 4 | import { |
| 5 | useRegisterCommands, |
| 6 | useResetCommandMenu, |
| 7 | useSetCommandMenuOpen, |
| 8 | } from 'ui-patterns/CommandMenu' |
| 9 | |
| 10 | import { COMMAND_MENU_SECTIONS } from './CommandMenu.utils' |
| 11 | import { orderCommandSectionsByPriority } from './ordering' |
| 12 | import { useProjectSettingsV2Query } from '@/data/config/project-settings-v2-query' |
| 13 | import { useSelectedProjectQuery } from '@/hooks/misc/useSelectedProject' |
| 14 | |
| 15 | export function useApiUrlCommand() { |
| 16 | const setIsOpen = useSetCommandMenuOpen() |
| 17 | const resetCommandMenu = useResetCommandMenu() |
| 18 | |
| 19 | const { data: project } = useSelectedProjectQuery() |
| 20 | const { data: settings } = useProjectSettingsV2Query( |
| 21 | { projectRef: project?.ref }, |
| 22 | { enabled: !!project } |
| 23 | ) |
| 24 | |
| 25 | const protocol = settings?.app_config?.protocol ?? 'https' |
| 26 | const endpoint = settings?.app_config?.endpoint |
| 27 | const apiUrl = endpoint ? `${protocol}://${endpoint}` : undefined |
| 28 | |
| 29 | useRegisterCommands( |
| 30 | COMMAND_MENU_SECTIONS.ACTIONS, |
| 31 | [ |
| 32 | { |
| 33 | id: 'api-url', |
| 34 | name: 'Copy API URL', |
| 35 | action: () => { |
| 36 | copyToClipboard(apiUrl ?? '', () => { |
| 37 | toast.success('API URL copied to clipboard') |
| 38 | }) |
| 39 | setIsOpen(false) |
| 40 | resetCommandMenu() |
| 41 | }, |
| 42 | icon: () => <Link />, |
| 43 | badge: () => <Badge>Project: {project?.name}</Badge>, |
| 44 | }, |
| 45 | ], |
| 46 | { |
| 47 | enabled: !!project, |
| 48 | deps: [apiUrl, project], |
| 49 | orderSection: orderCommandSectionsByPriority, |
| 50 | sectionMeta: { priority: 3 }, |
| 51 | } |
| 52 | ) |
| 53 | } |