createIntegrationButton.tsx 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  1. import {openCreateNewIntegrationModal} from 'sentry/actionCreators/modal';
  2. import Access from 'sentry/components/acl/access';
  3. import {Button} from 'sentry/components/button';
  4. import {t} from 'sentry/locale';
  5. import type {Organization} from 'sentry/types/organization';
  6. import type {IntegrationView} from 'sentry/utils/analytics/integrations';
  7. import {PlatformEvents} from 'sentry/utils/analytics/integrations/platformAnalyticsEvents';
  8. import {trackIntegrationAnalytics} from 'sentry/utils/integrationUtil';
  9. import withOrganization from 'sentry/utils/withOrganization';
  10. type CreateIntegrationButtonProps = {
  11. analyticsView: IntegrationView['view'];
  12. organization: Organization;
  13. };
  14. /**
  15. * Button to open the modal to create a new public/internal integration (Sentry App)
  16. */
  17. function CreateIntegrationButton({
  18. organization,
  19. analyticsView,
  20. }: CreateIntegrationButtonProps) {
  21. const permissionTooltipText = t(
  22. 'Manager or Owner permissions are required to create a new integration'
  23. );
  24. return (
  25. <Access access={['org:write']}>
  26. {({hasAccess}) => (
  27. <Button
  28. size="sm"
  29. priority="primary"
  30. disabled={!hasAccess}
  31. title={!hasAccess ? permissionTooltipText : undefined}
  32. onClick={() => {
  33. openCreateNewIntegrationModal({organization});
  34. trackIntegrationAnalytics(PlatformEvents.OPEN_CREATE_MODAL, {
  35. organization,
  36. view: analyticsView,
  37. });
  38. }}
  39. >
  40. {t('Create New Integration')}
  41. </Button>
  42. )}
  43. </Access>
  44. );
  45. }
  46. export default withOrganization(CreateIntegrationButton);