OverviewTab.tsx 2.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455
  1. import { useParams } from 'common'
  2. import Link from 'next/link'
  3. import { Button } from 'ui'
  4. import { Admonition } from 'ui-patterns'
  5. import { IntegrationOverviewTab } from '../Integration/IntegrationOverviewTab'
  6. import { IntegrationOverviewTabV2 } from '../Integration/IntegrationOverviewTabV2'
  7. import { useIsMarketplaceEnabled } from '@/components/interfaces/App/FeaturePreview/FeaturePreviewContext'
  8. import { useDatabaseExtensionsQuery } from '@/data/database-extensions/database-extensions-query'
  9. import { useQueuesExposePostgrestStatusQuery } from '@/data/database-queues/database-queues-expose-postgrest-status-query'
  10. import { useSelectedProjectQuery } from '@/hooks/misc/useSelectedProject'
  11. const QueuesAdmonition = () => {
  12. const { ref } = useParams()
  13. const { data: project } = useSelectedProjectQuery()
  14. const { data: extensions = [] } = useDatabaseExtensionsQuery({
  15. projectRef: project?.ref,
  16. connectionString: project?.connectionString,
  17. })
  18. const isQueuesInstalled = !!extensions.find((x) => x.name === 'pgmq')?.installed_version
  19. return (
  20. <Admonition
  21. type="default"
  22. title="Queues can be managed via any Briven client library or PostgREST endpoints"
  23. >
  24. <p>
  25. You may choose to toggle the exposure of Queues through Data APIs via the queues settings
  26. </p>
  27. {isQueuesInstalled && (
  28. <Button asChild type="default" className="mt-2">
  29. <Link href={`/project/${ref}/integrations/queues/settings`}>Manage queues settings</Link>
  30. </Button>
  31. )}
  32. </Admonition>
  33. )
  34. }
  35. export const QueuesOverviewTab = () => {
  36. const { data: project } = useSelectedProjectQuery()
  37. const isMarketplaceEnabled = useIsMarketplaceEnabled()
  38. const { data: isExposed } = useQueuesExposePostgrestStatusQuery({
  39. projectRef: project?.ref,
  40. connectionString: project?.connectionString,
  41. })
  42. if (isMarketplaceEnabled) {
  43. return <IntegrationOverviewTabV2>{!isExposed && <QueuesAdmonition />}</IntegrationOverviewTabV2>
  44. } else {
  45. return <IntegrationOverviewTab actions={!isExposed ? <QueuesAdmonition /> : null} />
  46. }
  47. }