From ca13a444512e009ab6b8a40ca91718422fdbf503 Mon Sep 17 00:00:00 2001
From: nicholas-codecov <nicholas.deschenes@sentry.io>
Date: Wed, 8 Jan 2025 11:44:04 -0400
Subject: [PATCH 1/3] tidy up imports

---
 src/services/toast/ErrorToast/ErrorToast.test.tsx     | 2 +-
 src/services/toast/ErrorToast/ErrorToast.tsx          | 4 +---
 src/services/toast/ErrorToast/index.ts                | 1 -
 src/services/toast/GenericToast/GenericToast.test.tsx | 2 +-
 src/services/toast/GenericToast/GenericToast.tsx      | 4 +---
 src/services/toast/GenericToast/index.ts              | 1 -
 6 files changed, 4 insertions(+), 10 deletions(-)
 delete mode 100644 src/services/toast/ErrorToast/index.ts
 delete mode 100644 src/services/toast/GenericToast/index.ts

diff --git a/src/services/toast/ErrorToast/ErrorToast.test.tsx b/src/services/toast/ErrorToast/ErrorToast.test.tsx
index 62e5299896..04620d1460 100644
--- a/src/services/toast/ErrorToast/ErrorToast.test.tsx
+++ b/src/services/toast/ErrorToast/ErrorToast.test.tsx
@@ -1,6 +1,6 @@
 import { render, screen } from '@testing-library/react'
 
-import ErrorToast from './ErrorToast'
+import { ErrorToast } from './ErrorToast'
 
 describe('ErrorToast', () => {
   it('renders the title', () => {
diff --git a/src/services/toast/ErrorToast/ErrorToast.tsx b/src/services/toast/ErrorToast/ErrorToast.tsx
index 9d68ca3f05..2fb167b693 100644
--- a/src/services/toast/ErrorToast/ErrorToast.tsx
+++ b/src/services/toast/ErrorToast/ErrorToast.tsx
@@ -1,10 +1,8 @@
 import type { ToastProps } from '../renderToast'
 
-const ErrorToast: React.FC<ToastProps> = ({ title, content }) => (
+export const ErrorToast: React.FC<ToastProps> = ({ title, content }) => (
   <div className="min-w-[300px] bg-ds-gray-secondary p-4">
     <h3 className="text-base font-semibold">&#9940; {title}</h3>
     <p className="whitespace-pre-line text-sm">{content}</p>
   </div>
 )
-
-export default ErrorToast
diff --git a/src/services/toast/ErrorToast/index.ts b/src/services/toast/ErrorToast/index.ts
deleted file mode 100644
index f0d4645ada..0000000000
--- a/src/services/toast/ErrorToast/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from './ErrorToast'
diff --git a/src/services/toast/GenericToast/GenericToast.test.tsx b/src/services/toast/GenericToast/GenericToast.test.tsx
index 6661d0fcd2..2a6f882814 100644
--- a/src/services/toast/GenericToast/GenericToast.test.tsx
+++ b/src/services/toast/GenericToast/GenericToast.test.tsx
@@ -1,6 +1,6 @@
 import { render, screen } from '@testing-library/react'
 
-import GenericToast from './GenericToast'
+import { GenericToast } from './GenericToast'
 
 describe('GenericToast', () => {
   it('renders the title', () => {
diff --git a/src/services/toast/GenericToast/GenericToast.tsx b/src/services/toast/GenericToast/GenericToast.tsx
index 14237a66f1..89cdb7bf13 100644
--- a/src/services/toast/GenericToast/GenericToast.tsx
+++ b/src/services/toast/GenericToast/GenericToast.tsx
@@ -1,10 +1,8 @@
 import type { ToastProps } from '../renderToast'
 
-const GenericToast: React.FC<ToastProps> = ({ title, content }) => (
+export const GenericToast: React.FC<ToastProps> = ({ title, content }) => (
   <div className="min-w-[300px] bg-ds-gray-secondary p-4">
     <h3 className="text-base font-semibold">&#127881; {title}</h3>
     <p className="whitespace-pre-line text-sm">{content}</p>
   </div>
 )
-
-export default GenericToast
diff --git a/src/services/toast/GenericToast/index.ts b/src/services/toast/GenericToast/index.ts
deleted file mode 100644
index 4491c355a2..0000000000
--- a/src/services/toast/GenericToast/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from './GenericToast'

From ce53011d6e957fe05e862385f85d3a85f5120786 Mon Sep 17 00:00:00 2001
From: nicholas-codecov <nicholas.deschenes@sentry.io>
Date: Wed, 8 Jan 2025 11:48:43 -0400
Subject: [PATCH 2/3] add in success toast

---
 .../toast/SuccessToast/SuccessToast.test.tsx  | 20 +++++++++++++++++++
 .../toast/SuccessToast/SuccessToast.tsx       |  8 ++++++++
 2 files changed, 28 insertions(+)
 create mode 100644 src/services/toast/SuccessToast/SuccessToast.test.tsx
 create mode 100644 src/services/toast/SuccessToast/SuccessToast.tsx

diff --git a/src/services/toast/SuccessToast/SuccessToast.test.tsx b/src/services/toast/SuccessToast/SuccessToast.test.tsx
new file mode 100644
index 0000000000..aeeae056ff
--- /dev/null
+++ b/src/services/toast/SuccessToast/SuccessToast.test.tsx
@@ -0,0 +1,20 @@
+import { render, screen } from '@testing-library/react'
+
+import { SuccessToast } from './SuccessToast'
+
+describe('SuccessToast', () => {
+  it('renders the title', () => {
+    render(<SuccessToast title="Success Title" content="Success Content" />)
+
+    const title = screen.getByRole('heading', { name: /Success Title/ })
+    expect(title).toBeInTheDocument()
+    expect(title).toHaveClass('font-semibold')
+  })
+
+  it('renders the content', () => {
+    render(<SuccessToast title="Success Title" content="Success Content" />)
+
+    const content = screen.getByText(/Success Content/)
+    expect(content).toBeInTheDocument()
+  })
+})
diff --git a/src/services/toast/SuccessToast/SuccessToast.tsx b/src/services/toast/SuccessToast/SuccessToast.tsx
new file mode 100644
index 0000000000..7646ded3e6
--- /dev/null
+++ b/src/services/toast/SuccessToast/SuccessToast.tsx
@@ -0,0 +1,8 @@
+import type { ToastProps } from '../renderToast'
+
+export const SuccessToast: React.FC<ToastProps> = ({ title, content }) => (
+  <div className="min-w-[300px] bg-ds-gray-secondary p-4">
+    <h3 className="text-base font-semibold">&#x2705; {title}</h3>
+    <p className="whitespace-pre-line text-sm">{content}</p>
+  </div>
+)

From 957b29150a4ff4915d1994c9d3e617458e14ee70 Mon Sep 17 00:00:00 2001
From: nicholas-codecov <nicholas.deschenes@sentry.io>
Date: Wed, 8 Jan 2025 11:49:15 -0400
Subject: [PATCH 3/3] add in tests for success toast

---
 src/services/toast/renderToast.test.tsx | 40 +++++++++++++++++++++++++
 src/services/toast/renderToast.tsx      | 10 +++++--
 2 files changed, 47 insertions(+), 3 deletions(-)

diff --git a/src/services/toast/renderToast.test.tsx b/src/services/toast/renderToast.test.tsx
index 3b05cc6386..57410debe9 100644
--- a/src/services/toast/renderToast.test.tsx
+++ b/src/services/toast/renderToast.test.tsx
@@ -152,4 +152,44 @@ describe('renderToast', () => {
       })
     })
   })
+
+  describe('triggering success toast', () => {
+    describe('with options and type passed', () => {
+      it('renders toast', async () => {
+        const { user } = setup()
+
+        render(<TestComponent type="success" options={{ duration: 5000 }} />)
+
+        const button = screen.getByRole('button', { name: 'click me' })
+        expect(button).toBeInTheDocument()
+        await user.click(button)
+
+        const title = screen.getByRole('heading', { name: /Cool title/ })
+        expect(title).toBeInTheDocument()
+
+        const clearToasts = screen.getByRole('button', { name: 'clear toasts' })
+        expect(clearToasts).toBeInTheDocument()
+        await user.click(clearToasts)
+      })
+    })
+
+    describe('no options are passed', () => {
+      it('renders toast', async () => {
+        const { user } = setup()
+
+        render(<TestComponent type="success" />)
+
+        const button = screen.getByRole('button', { name: 'click me' })
+        expect(button).toBeInTheDocument()
+        await user.click(button)
+
+        const title = screen.getByRole('heading', { name: /Cool title/ })
+        expect(title).toBeInTheDocument()
+
+        const clearToasts = screen.getByRole('button', { name: 'clear toasts' })
+        expect(clearToasts).toBeInTheDocument()
+        await user.click(clearToasts)
+      })
+    })
+  })
 })
diff --git a/src/services/toast/renderToast.tsx b/src/services/toast/renderToast.tsx
index e95cdbfea8..05569a8b48 100644
--- a/src/services/toast/renderToast.tsx
+++ b/src/services/toast/renderToast.tsx
@@ -1,7 +1,8 @@
 import { toast, type ToastOptions } from 'react-hot-toast'
 
-import ErrorToast from './ErrorToast'
-import GenericToast from './GenericToast'
+import { ErrorToast } from './ErrorToast/ErrorToast'
+import { GenericToast } from './GenericToast/GenericToast'
+import { SuccessToast } from './SuccessToast/SuccessToast'
 
 const TOAST_DURATION = 4000
 
@@ -10,7 +11,7 @@ export interface ToastProps {
   content: string
 }
 
-export type ToastTypes = 'generic' | 'error'
+export type ToastTypes = 'generic' | 'error' | 'success'
 
 export interface ToastArgs {
   title: string
@@ -31,6 +32,9 @@ export const renderToast = ({
     case 'error':
       component = <ErrorToast title={title} content={content} />
       break
+    case 'success':
+      component = <SuccessToast title={title} content={content} />
+      break
     default:
       component = <GenericToast title={title} content={content} />
   }