Browse Source

ref(bug reports): remove archive functionality, resolve only (#58829)

On the details, the buttons can look like:
<img width="737" alt="SCR-20231026-jlww"
src="https://github.com/getsentry/sentry/assets/56095982/b523f820-ddea-4cd0-85e3-ae0257270777">

or
<img width="733" alt="SCR-20231026-jlon"
src="https://github.com/getsentry/sentry/assets/56095982/26fafca4-7996-4a4d-981f-442c87b31d94">


On the list, there's a dropdown for mark read/unread but only one button
for resolve/unresolve:


<img width="411" alt="SCR-20231026-jpyw"
src="https://github.com/getsentry/sentry/assets/56095982/e131a69f-5998-4552-81be-574819b4045b">
Michelle Zhang 1 year ago
parent
commit
52bc1a4434

+ 2 - 2
static/app/components/feedback/decodeMailbox.ts

@@ -1,6 +1,6 @@
 import {decodeScalar} from 'sentry/utils/queryString';
 
-type Mailbox = 'unresolved' | 'resolved' | 'archived';
+type Mailbox = 'unresolved' | 'resolved';
 
 export default function decodeMailbox(
   value: string | string[] | undefined | null
@@ -9,7 +9,7 @@ export default function decodeMailbox(
     case 'resolved':
       return 'resolved';
     case 'archived':
-      return 'archived';
+      return 'resolved';
     default:
       return 'unresolved';
   }

+ 16 - 64
static/app/components/feedback/feedbackItem/feedbackItem.tsx

@@ -1,9 +1,9 @@
 import {Fragment, useEffect} from 'react';
 import styled from '@emotion/styled';
 
+import Button from 'sentry/components/actions/button';
 import ProjectAvatar from 'sentry/components/avatar/projectAvatar';
 import {CopyToClipboardButton} from 'sentry/components/copyToClipboardButton';
-import {DropdownMenu} from 'sentry/components/dropdownMenu';
 import ErrorBoundary from 'sentry/components/errorBoundary';
 import Section from 'sentry/components/feedback/feedbackItem/feedbackItemSection';
 import FeedbackItemUsername from 'sentry/components/feedback/feedbackItem/feedbackItemUsername';
@@ -16,7 +16,7 @@ import ObjectInspector from 'sentry/components/objectInspector';
 import PanelItem from 'sentry/components/panels/panelItem';
 import {Flex} from 'sentry/components/profiling/flex';
 import TextCopyInput from 'sentry/components/textCopyInput';
-import {IconEllipsis, IconJson, IconLink} from 'sentry/icons';
+import {IconJson, IconLink} from 'sentry/icons';
 import {t} from 'sentry/locale';
 import {space} from 'sentry/styles/space';
 import {Event, GroupStatus} from 'sentry/types';
@@ -92,72 +92,24 @@ export default function FeedbackItem({
               <FeedbackViewers feedbackItem={feedbackItem} />
             </ErrorBoundary>
             <ErrorBoundary mini>
-              <DropdownMenu
-                position="bottom-end"
-                triggerLabel={
-                  feedbackItem.status === GroupStatus.IGNORED
-                    ? t('Archived')
-                    : feedbackItem.status === GroupStatus.RESOLVED
-                    ? t('Resolved')
-                    : t('Unresolved')
-                }
-                triggerProps={{
-                  'aria-label': t('Resolve or Archive Menu'),
-                  showChevron: true,
-                  size: 'xs',
+              <Button
+                onClick={() => {
+                  feedbackItem.status === 'resolved'
+                    ? resolve(GroupStatus.UNRESOLVED)
+                    : resolve(GroupStatus.RESOLVED);
                 }}
-                items={[
-                  {
-                    key: 'resolve',
-                    label:
-                      feedbackItem.status === GroupStatus.RESOLVED
-                        ? t('Unresolve')
-                        : t('Resolve'),
-                    onAction: () =>
-                      resolve(
-                        feedbackItem.status === GroupStatus.RESOLVED
-                          ? GroupStatus.UNRESOLVED
-                          : GroupStatus.RESOLVED
-                      ),
-                  },
-                  {
-                    key: 'archive',
-                    label:
-                      feedbackItem.status === GroupStatus.IGNORED
-                        ? t('Unarchive')
-                        : t('Archive'),
-                    onAction: () =>
-                      resolve(
-                        feedbackItem.status === GroupStatus.IGNORED
-                          ? GroupStatus.UNRESOLVED
-                          : GroupStatus.IGNORED
-                      ),
-                  },
-                ]}
-              />
+              >
+                {feedbackItem.status === 'resolved' ? t('Unresolve') : t('Resolve')}
+              </Button>
             </ErrorBoundary>
             <ErrorBoundary mini>
-              <DropdownMenu
-                position="bottom-end"
-                triggerProps={{
-                  'aria-label': t('Read Menu'),
-                  icon: <IconEllipsis size="xs" />,
-                  showChevron: false,
-                  size: 'xs',
+              <Button
+                onClick={() => {
+                  feedbackItem.hasSeen ? markAsRead(false) : markAsRead(true);
                 }}
-                items={[
-                  {
-                    key: 'mark read',
-                    label: t('Mark as read'),
-                    onAction: () => markAsRead(true),
-                  },
-                  {
-                    key: 'mark unread',
-                    label: t('Mark as unread'),
-                    onAction: () => markAsRead(false),
-                  },
-                ]}
-              />
+              >
+                {feedbackItem.hasSeen ? t('Mark Unread') : t('Mark Read')}
+              </Button>
             </ErrorBoundary>
           </Flex>
         </Flex>

+ 7 - 26
static/app/components/feedback/list/feedbackListHeader.tsx

@@ -1,5 +1,6 @@
 import styled from '@emotion/styled';
 
+import Button from 'sentry/components/actions/button';
 import Checkbox from 'sentry/components/checkbox';
 import {DropdownMenu} from 'sentry/components/dropdownMenu';
 import ErrorBoundary from 'sentry/components/errorBoundary';
@@ -7,7 +8,7 @@ import decodeMailbox from 'sentry/components/feedback/decodeMailbox';
 import MailboxPicker from 'sentry/components/feedback/list/mailboxPicker';
 import PanelItem from 'sentry/components/panels/panelItem';
 import {Flex} from 'sentry/components/profiling/flex';
-import {IconEllipsis} from 'sentry/icons';
+import {IconEllipsis} from 'sentry/icons/iconEllipsis';
 import {t, tct} from 'sentry/locale';
 import {space} from 'sentry/styles/space';
 import useLocationQuery from 'sentry/utils/url/useLocationQuery';
@@ -35,7 +36,7 @@ export default function FeedbackListHeader({checked, toggleChecked}: Props) {
         }}
       />
       {checked.length ? (
-        <HasSelection checked={checked} />
+        <HasSelection checked={checked} mailbox={mailbox} />
       ) : (
         <MailboxPicker value={mailbox} onChange={setMailbox} />
       )}
@@ -43,7 +44,7 @@ export default function FeedbackListHeader({checked, toggleChecked}: Props) {
   );
 }
 
-function HasSelection({checked}) {
+function HasSelection({checked, mailbox}) {
   return (
     <Flex gap={space(1)} align="center" justify="space-between" style={{flexGrow: 1}}>
       <span>
@@ -51,27 +52,7 @@ function HasSelection({checked}) {
       </span>
       <Flex gap={space(1)} justify="flex-end">
         <ErrorBoundary mini>
-          <DropdownMenu
-            position="bottom-end"
-            triggerLabel="Unresolved"
-            triggerProps={{
-              'aria-label': t('Resolve or Archive Menu'),
-              showChevron: true,
-              size: 'xs',
-            }}
-            items={[
-              {
-                key: 'resolve',
-                label: t('Resolve'),
-                onAction: () => {},
-              },
-              {
-                key: 'archive',
-                label: t('Archive'),
-                onAction: () => {},
-              },
-            ]}
-          />
+          <Button>{mailbox === 'resolved' ? t('Unresolve') : t('Resolve')}</Button>
         </ErrorBoundary>
         <ErrorBoundary mini>
           <DropdownMenu
@@ -85,12 +66,12 @@ function HasSelection({checked}) {
             items={[
               {
                 key: 'mark read',
-                label: t('Mark as read'),
+                label: t('Mark Read'),
                 onAction: () => {},
               },
               {
                 key: 'mark unread',
-                label: t('Mark as unread'),
+                label: t('Mark Unread'),
                 onAction: () => {},
               },
             ]}

+ 0 - 1
static/app/components/feedback/list/mailboxPicker.tsx

@@ -21,7 +21,6 @@ export default function MailboxPicker({onChange, value}: Props) {
       >
         <SegmentedControl.Item key="unresolved">{t('Inbox')}</SegmentedControl.Item>
         <SegmentedControl.Item key="resolved">{t('Resolved')}</SegmentedControl.Item>
-        <SegmentedControl.Item key="archived">{t('Archived')}</SegmentedControl.Item>
       </SegmentedControl>
     </Flex>
   );