pluginDeprecationAlert.tsx 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. import {Component, Fragment} from 'react';
  2. import styled from '@emotion/styled';
  3. import {Alert} from 'sentry/components/alert';
  4. import {Button} from 'sentry/components/button';
  5. import {t} from 'sentry/locale';
  6. import {Organization, PluginWithProjectList} from 'sentry/types';
  7. import {trackIntegrationAnalytics} from 'sentry/utils/integrationUtil';
  8. type Props = {
  9. organization: Organization;
  10. plugin: PluginWithProjectList;
  11. };
  12. type State = {};
  13. class PluginDeprecationAlert extends Component<Props, State> {
  14. render() {
  15. const {organization, plugin} = this.props;
  16. // Short-circuit if not deprecated.
  17. if (!plugin.deprecationDate) {
  18. return <Fragment />;
  19. }
  20. const resource = plugin.altIsSentryApp ? 'sentry-apps' : 'integrations';
  21. const upgradeUrl = `/settings/${organization.slug}/${resource}/${plugin.firstPartyAlternative}/`;
  22. const queryParams = `?${
  23. plugin.altIsSentryApp ? '' : 'tab=configurations&'
  24. }referrer=directory_upgrade_now`;
  25. return (
  26. <div>
  27. <Alert
  28. type="warning"
  29. showIcon
  30. trailingItems={
  31. <UpgradeNowButton
  32. href={`${upgradeUrl}${queryParams}`}
  33. size="xs"
  34. onClick={() =>
  35. trackIntegrationAnalytics('integrations.resolve_now_clicked', {
  36. integration_type: 'plugin',
  37. integration: plugin.slug,
  38. organization,
  39. })
  40. }
  41. >
  42. {t('Upgrade Now')}
  43. </UpgradeNowButton>
  44. }
  45. >
  46. {`This integration is being deprecated on ${plugin.deprecationDate}. Please upgrade to avoid any disruption.`}
  47. </Alert>
  48. </div>
  49. );
  50. }
  51. }
  52. const UpgradeNowButton = styled(Button)`
  53. color: ${p => p.theme.subText};
  54. float: right;
  55. `;
  56. export default PluginDeprecationAlert;