Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Chore: Refactor internals #28

Merged
merged 17 commits into from
Dec 29, 2023
Merged

Conversation

huntabyte
Copy link
Collaborator

These changes close #24 and from what I can tell #13 (not able to reproduce anymore with the provided example) and fixes a couple memory leaks with the prior implementation.

This PR refactors this project to leverage existing Svelte capabilities like stores, rather than implementing a custom observer. By doing so, the internals have been greatly simplified. We no longer need to rely on dispatches between the <Toast /> and <Toaster /> to keep state in sync, as this can be done by subscribing to the toasts and heights stores within each of the components.

The original sonner added props to add classes to the individual elements within the toast, which are passed via the ToastOptions, so those have been added to this project as well.

Vitest has been setup for unit testing the components. Only a couple tests have been added, but the pieces are in place to add more comprehensive tests that don't take 10 years to run (looking at you Playwright).

There shouldn't be any breaking changes to the public facing APIs, as the same methods and options are exposed, but we've added some additional functionality in the form of the (optional) additional classes property of ToastOptions.

changesets has been added along with a CI and release pipeline to make release notes and releases in general more seamless. Feel free to reach out on Discord if you'd like me to give you a more detailed rundown of how these work, but here's a quick guide to getting it setup:

  1. Give appropriate permissions to GitHub actions within this projects settings
    CleanShot 2023-12-28 at 23 37 28@2x
  2. Add an NPM token with access to publish svelte-sonner to your repo's secrets called NPM_TOKEN
  3. Add the changesets bot to your GitHub account
  4. Enjoy :)

Copy link

vercel bot commented Dec 29, 2023

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
svelte-sonner ❌ Failed (Inspect) Dec 29, 2023 4:33pm

.changeset/config.json Outdated Show resolved Hide resolved
package.json Outdated Show resolved Hide resolved
package.json Outdated Show resolved Hide resolved
@wobsoriano
Copy link
Owner

wobsoriano commented Dec 29, 2023

Thank you for this! I plan to review it over the weekend. These improvements look fantastic.

I ported this project straight from the React component as part of my Svelte learning journey. Excited to learn even more through your contribution!

Co-authored-by: CokaKoala <31664583+AdrianGonz97@users.noreply.github.com>
Co-authored-by: CokaKoala <31664583+AdrianGonz97@users.noreply.github.com>
Co-authored-by: CokaKoala <31664583+AdrianGonz97@users.noreply.github.com>
Copy link
Owner

@wobsoriano wobsoriano left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Love the use of svelte stores instead of making our own observers. Everything looks good so far. I have no major requests so I'm ready to merge.

@wobsoriano wobsoriano merged commit 2d165f4 into wobsoriano:main Dec 29, 2023
3 of 7 checks passed
@wobsoriano
Copy link
Owner

I had to manually release this one as I forgot to reinstall deps (since we updated vite version).

https://github.com/wobsoriano/svelte-sonner/actions/runs/7358434671/job/20031785729

@robinbraemer
Copy link

@huntabyte do you plan to add sonner toast to shadcn/ui-svelte? I’m hoping to see the new shadcn components ported to svelte. Awesome work everyone!

@AyushSehrawat
Copy link

@huntabyte do you plan to add sonner toast to shadcn/ui-svelte? I’m hoping to see the new shadcn components ported to svelte. Awesome work everyone!

Yup it's coming to shadcn soon!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Adding multiple toasts in the same event loop breaks layout
5 participants