feat(issues): Unify issue activity streams

static/app/components/activity/item/index.tsx

@@ -12,7 +12,7 @@ import {ActivityAvatar} from './avatar';
 import type {ActivityBubbleProps} from './bubble';
 import {ActivityBubble} from './bubble';
 
-export type ActivityAuthorType = 'user' | 'system';
+type ActivityAuthorType = 'user' | 'system';
 
 interface ActivityItemProps {
   /**

static/app/views/issueDetails/streamline/sidebar/note.spec.tsx → static/app/components/activity/note/compact.spec.tsx

@@ -3,10 +3,10 @@ import {UserFixture} from 'sentry-fixture/user';
 
 import {render, screen, userEvent} from 'sentry-test/reactTestingLibrary';
 
+import {CompactNoteInput} from 'sentry/components/activity/note/compact';
 import {TeamStore} from 'sentry/stores/teamStore';
-import {StreamlinedNoteInput} from 'sentry/views/issueDetails/streamline/sidebar/note';
 
-describe('StreamlinedNoteInput', () => {
+describe('CompactNoteInput', () => {
   beforeEach(() => {
     TeamStore.reset();
     MockApiClient.addMockResponse({
@@ -17,7 +17,7 @@ describe('StreamlinedNoteInput', () => {
 
   it('can mention a member', async () => {
     const onCreate = jest.fn();
-    render(<StreamlinedNoteInput onCreate={onCreate} />);
+    render(<CompactNoteInput onCreate={onCreate} />);
     await userEvent.type(screen.getByRole('textbox', {name: 'Add a comment'}), '@foo');
     await userEvent.click(screen.getByRole('option', {name: 'Foo Bar'}));
     expect(screen.getByRole('textbox')).toHaveTextContent('@Foo Bar');
@@ -42,7 +42,7 @@ describe('StreamlinedNoteInput', () => {
     });
 
     const onCreate = jest.fn();
-    render(<StreamlinedNoteInput onCreate={onCreate} />);
+    render(<CompactNoteInput onCreate={onCreate} />);
     await userEvent.type(screen.getByRole('textbox', {name: 'Add a comment'}), '@nick');
     await userEvent.click(await screen.findByRole('option', {name: 'Nick Search'}));
 
@@ -56,7 +56,7 @@ describe('StreamlinedNoteInput', () => {
   it('can mention a team', async () => {
     TeamStore.loadInitialData([TeamFixture()]);
     const onCreate = jest.fn();
-    render(<StreamlinedNoteInput onCreate={onCreate} />);
+    render(<CompactNoteInput onCreate={onCreate} />);
     await userEvent.type(screen.getByRole('textbox', {name: 'Add a comment'}), '#team');
     await userEvent.click(screen.getByRole('option', {name: '# team -slug'}));
     expect(screen.getByRole('textbox')).toHaveTextContent('#team-slug');

static/app/views/issueDetails/streamline/sidebar/note.tsx → static/app/components/activity/note/compact.tsx

@@ -2,7 +2,7 @@ import {useCallback, useId, useState} from 'react';
 import type {MentionsInputProps} from 'react-mentions';
 import {Mention, MentionsInput} from 'react-mentions';
 import type {Theme} from '@emotion/react';
-import {useTheme} from '@emotion/react';
+import {css, useTheme} from '@emotion/react';
 import styled from '@emotion/styled';
 
 import {Button} from '@sentry/scraps/button';
@@ -37,7 +37,7 @@ type Props = {
   text?: string;
 };
 
-function StreamlinedNoteInput({
+export function CompactNoteInput({
   text,
   onCreate,
   onChange,
@@ -192,18 +192,16 @@ function StreamlinedNoteInput({
   );
 }
 
-export {StreamlinedNoteInput};
-
 const getNoteInputErrorStyles = (p: {theme: Theme; error?: string}) => {
   if (!p.error) {
     return '';
   }
 
-  return `
-  color: ${p.theme.tokens.content.danger};
-  margin: -1px;
-  border: 1px solid ${p.theme.tokens.content.danger};
-  border-radius: ${p.theme.radius.md};
+  return css`
+    color: ${p.theme.tokens.content.danger};
+    margin: -1px;
+    border: 1px solid ${p.theme.tokens.border.danger};
+    border-radius: ${p.theme.radius.md};
 
     &:before {
       display: block;
@@ -241,5 +239,5 @@ const NoteInputForm = styled('form')<{error?: string}>`
   width: 100%;
   transition: padding 0.2s ease-in-out;
 
-  ${p => getNoteInputErrorStyles(p)};
+  ${getNoteInputErrorStyles};
 `;

static/app/components/activity/note/inputWithStorage.tsx

@@ -2,11 +2,11 @@ import {useCallback, useMemo} from 'react';
 import * as Sentry from '@sentry/react';
 import debounce from 'lodash/debounce';
 
+import {CompactNoteInput} from 'sentry/components/activity/note/compact';
 import {NoteInput} from 'sentry/components/activity/note/input';
 import type {MentionChangeEvent} from 'sentry/components/activity/note/types';
 import type {NoteType} from 'sentry/types/alerts';
 import {localStorageWrapper} from 'sentry/utils/localStorage';
-import {StreamlinedNoteInput} from 'sentry/views/issueDetails/streamline/sidebar/note';
 
 type InputProps = React.ComponentProps<typeof NoteInput>;
 
@@ -135,7 +135,7 @@ function NoteInputWithStorage({
 
   if (variant === 'compact') {
     return (
-      <StreamlinedNoteInput
+      <CompactNoteInput
         text={value}
         onCreate={handleCreate}
         onChange={handleChange}