ToastStack: no toast cleanup

[rafarubim]

Summary

Shoreline uses a static-global-variable approach to keep toast state, but does not provide a way to clean current toasts.

The react-hot-toast library does provide a way to dismiss toasts programatically, but Shoreline does not reexport it.

The lack of this important feature currently makes us unable to cleanup any test code that uses the ToastStack component. Example:

// If it was possible, cleanup code would be here
// beforeEach(() => {
//   toast.remove()
// })

it('Shows toast after button is pressed', async () => {
  const user = userEvent.setup()
  render(
    <ToastStack>
      <button onClick={() => toast.success('Success!')}>Show toast</button>
    </ToastStack>
  )

  const button = screen.getByRole('button', { name: 'Show toast' })
  await user.click(button)
  await waitFor(() => {
    expect(screen.queryByText('Success!')).toBeVisible()
  })
})

it('Does not show toast from previous test LOL', async () => {
  render(
    <ToastStack /> // ToastStack component uses a static global variable to store toast state.
    // Therefore, this renders the "Success!" from the previous test
    // (which is bad and there's no way to run cleanup code)
  )

  // This test fails because "Success" is actually visible
  expect(screen.queryByText('Success!')).not.toBeInTheDocument()
})

Expected behavior

No response

Current behavior

No response

Reproducible Example

No response

Suggested solution

No response

Additional context

No response

Package

@vtex/shoreline

Packages version

No response

Browser

No response

Package Manager

yarn