archive.tsx 5.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200
  1. import styled from '@emotion/styled';
  2. import {getIgnoreActions} from 'sentry/components/actions/ignore';
  3. import {Button} from 'sentry/components/button';
  4. import ButtonBar from 'sentry/components/buttonBar';
  5. import {openConfirmModal} from 'sentry/components/confirm';
  6. import {DropdownMenu, MenuItemProps} from 'sentry/components/dropdownMenu';
  7. import ExternalLink from 'sentry/components/links/externalLink';
  8. import {IconChevron} from 'sentry/icons';
  9. import {t, tct} from 'sentry/locale';
  10. import {GroupStatus, GroupStatusResolution, GroupSubstatus} from 'sentry/types';
  11. interface ArchiveActionProps {
  12. onUpdate: (params: GroupStatusResolution) => void;
  13. className?: string;
  14. confirmLabel?: string;
  15. confirmMessage?: () => React.ReactNode;
  16. disableArchiveUntilOccurrence?: boolean;
  17. disabled?: boolean;
  18. isArchived?: boolean;
  19. shouldConfirm?: boolean;
  20. size?: 'xs' | 'sm';
  21. }
  22. const ARCHIVE_UNTIL_ESCALATING: GroupStatusResolution = {
  23. status: GroupStatus.IGNORED,
  24. statusDetails: {},
  25. substatus: GroupSubstatus.ARCHIVED_UNTIL_ESCALATING,
  26. };
  27. const ARCHIVE_FOREVER: GroupStatusResolution = {
  28. status: GroupStatus.IGNORED,
  29. statusDetails: {},
  30. substatus: GroupSubstatus.ARCHIVED_FOREVER,
  31. };
  32. type GetArchiveActionsProps = Pick<
  33. ArchiveActionProps,
  34. 'shouldConfirm' | 'confirmMessage' | 'onUpdate' | 'confirmLabel'
  35. > & {
  36. disableArchiveUntilOccurrence?: boolean;
  37. };
  38. export function getArchiveActions({
  39. shouldConfirm,
  40. confirmLabel,
  41. confirmMessage,
  42. onUpdate,
  43. disableArchiveUntilOccurrence,
  44. }: GetArchiveActionsProps): {
  45. dropdownItems: MenuItemProps[];
  46. onArchive: (resolution: GroupStatusResolution) => void;
  47. } {
  48. // TODO(workflow): Replace ignore actions with more archive actions
  49. const {dropdownItems} = getIgnoreActions({
  50. confirmLabel,
  51. onUpdate,
  52. shouldConfirm,
  53. confirmMessage,
  54. });
  55. const onArchive = (resolution: GroupStatusResolution) => {
  56. if (shouldConfirm && confirmMessage) {
  57. openConfirmModal({
  58. onConfirm: () => onUpdate(resolution),
  59. message: confirmMessage(),
  60. confirmText: confirmLabel,
  61. });
  62. } else {
  63. onUpdate(resolution);
  64. }
  65. };
  66. return {
  67. onArchive,
  68. dropdownItems: [
  69. {
  70. key: 'untilEscalating',
  71. label: t('Until escalating'),
  72. details: t('When events exceed their weekly forecast'),
  73. onAction: () => onArchive(ARCHIVE_UNTIL_ESCALATING),
  74. },
  75. {
  76. key: 'forever',
  77. label: t('Forever'),
  78. onAction: () => onArchive(ARCHIVE_FOREVER),
  79. },
  80. ...dropdownItems.filter(item => {
  81. if (disableArchiveUntilOccurrence) {
  82. return item.key !== 'until-reoccur' && item.key !== 'until-affect';
  83. }
  84. return true;
  85. }),
  86. ],
  87. };
  88. }
  89. function ArchiveActions({
  90. size = 'xs',
  91. disabled,
  92. disableArchiveUntilOccurrence,
  93. className,
  94. shouldConfirm,
  95. confirmLabel,
  96. isArchived,
  97. confirmMessage,
  98. onUpdate,
  99. }: ArchiveActionProps) {
  100. if (isArchived) {
  101. return (
  102. <Button
  103. priority="primary"
  104. size="xs"
  105. title={t('Change status to unresolved')}
  106. onClick={() =>
  107. onUpdate({
  108. status: GroupStatus.UNRESOLVED,
  109. statusDetails: {},
  110. substatus: GroupSubstatus.ONGOING,
  111. })
  112. }
  113. aria-label={t('Unarchive')}
  114. />
  115. );
  116. }
  117. const {dropdownItems, onArchive} = getArchiveActions({
  118. confirmLabel,
  119. onUpdate,
  120. shouldConfirm,
  121. confirmMessage,
  122. disableArchiveUntilOccurrence,
  123. });
  124. return (
  125. <ButtonBar className={className} merged>
  126. <ArchiveButton
  127. size={size}
  128. tooltipProps={{delay: 1000, disabled, isHoverable: true}}
  129. title={tct(
  130. 'We’ll nag you with a notification if the issue gets worse. All archived issues can be found in the Archived tab. [docs:Read the docs]',
  131. {
  132. docs: (
  133. <ExternalLink href="https://docs.sentry.io/product/issues/states-triage/#archive" />
  134. ),
  135. }
  136. )}
  137. onClick={() => onArchive(ARCHIVE_UNTIL_ESCALATING)}
  138. disabled={disabled}
  139. >
  140. {t('Archive')}
  141. </ArchiveButton>
  142. <DropdownMenu
  143. minMenuWidth={270}
  144. size="sm"
  145. trigger={triggerProps => (
  146. <DropdownTrigger
  147. {...triggerProps}
  148. aria-label={t('Archive options')}
  149. size={size}
  150. icon={<IconChevron direction="down" size="xs" />}
  151. disabled={disabled}
  152. />
  153. )}
  154. menuTitle={
  155. <MenuWrapper>
  156. {t('Archive')}
  157. <StyledExternalLink href="https://docs.sentry.io/product/issues/states-triage/#archive">
  158. {t('Read the docs')}
  159. </StyledExternalLink>
  160. </MenuWrapper>
  161. }
  162. items={dropdownItems}
  163. isDisabled={disabled}
  164. />
  165. </ButtonBar>
  166. );
  167. }
  168. export default ArchiveActions;
  169. const ArchiveButton = styled(Button)`
  170. box-shadow: none;
  171. border-radius: ${p => p.theme.borderRadiusLeft};
  172. `;
  173. const DropdownTrigger = styled(Button)`
  174. box-shadow: none;
  175. border-radius: ${p => p.theme.borderRadiusRight};
  176. border-left: none;
  177. `;
  178. const MenuWrapper = styled('div')`
  179. display: flex;
  180. justify-content: space-between;
  181. align-items: center;
  182. `;
  183. const StyledExternalLink = styled(ExternalLink)`
  184. font-weight: normal;
  185. `;