From 1974f5cdb1a6c09187c0df7250e398b86954dfbc Mon Sep 17 00:00:00 2001 From: Timo Lins Date: Sun, 27 Dec 2020 10:18:07 +0100 Subject: [PATCH 01/10] Update README --- README.md | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index c14a733..312cb9c 100644 --- a/README.md +++ b/README.md @@ -18,6 +18,11 @@ Twitter +
+
+ Cooked by Timo Lins 👨‍🍳 +
+
## Features @@ -65,7 +70,3 @@ const App = () => { ## Documentation Find the full API reference on [official documentation](https://react-hot-toast.com/docs). - -## Credits - -**react-hot-toast** was cooked by [Timo Lins](https://timo.sh) 👨‍🍳 From d58446bc5b5816b9c52a35383f2431005b5fa7dc Mon Sep 17 00:00:00 2001 From: YJ Ang Date: Wed, 30 Dec 2020 12:15:26 +0800 Subject: [PATCH 02/10] Fix auto-remove not working in toast.dismiss() --- src/core/toast.ts | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/src/core/toast.ts b/src/core/toast.ts index 7941edb..bfc6799 100644 --- a/src/core/toast.ts +++ b/src/core/toast.ts @@ -46,8 +46,16 @@ toast.error = createHandler('error'); toast.success = createHandler('success'); toast.loading = createHandler('loading'); -toast.dismiss = (toastId?: string) => +toast.dismiss = (toastId?: string) => { dispatch({ type: ActionType.DISMISS_TOAST, toastId }); + setTimeout(() => { + dispatch({ + type: ActionType.REMOVE_TOAST, + toastId, + }); + }, 1000); +}; + toast.remove = (toastId?: string) => dispatch({ type: ActionType.REMOVE_TOAST, toastId }); From 254a0bb6c29e316ac4abcb19ce317d5db84f0634 Mon Sep 17 00:00:00 2001 From: YJ Ang Date: Wed, 6 Jan 2021 09:08:15 +0800 Subject: [PATCH 03/10] Refactor the duplicate dismiss function --- src/core/toast.ts | 12 ++---------- src/core/use-toaster.ts | 18 +++--------------- src/core/utils.ts | 15 +++++++++++++++ 3 files changed, 20 insertions(+), 25 deletions(-) diff --git a/src/core/toast.ts b/src/core/toast.ts index bfc6799..c8ecef8 100644 --- a/src/core/toast.ts +++ b/src/core/toast.ts @@ -7,7 +7,7 @@ import { ValueOrFunction, resolveValueOrFunction, } from './types'; -import { genId } from './utils'; +import { genId, dismissToast } from './utils'; import { dispatch, ActionType } from './store'; type Message = ValueOrFunction; @@ -46,15 +46,7 @@ toast.error = createHandler('error'); toast.success = createHandler('success'); toast.loading = createHandler('loading'); -toast.dismiss = (toastId?: string) => { - dispatch({ type: ActionType.DISMISS_TOAST, toastId }); - setTimeout(() => { - dispatch({ - type: ActionType.REMOVE_TOAST, - toastId, - }); - }, 1000); -}; +toast.dismiss = (toastId?: string) => dismissToast(toastId); toast.remove = (toastId?: string) => dispatch({ type: ActionType.REMOVE_TOAST, toastId }); diff --git a/src/core/use-toaster.ts b/src/core/use-toaster.ts index 1d19d26..1313c06 100644 --- a/src/core/use-toaster.ts +++ b/src/core/use-toaster.ts @@ -1,6 +1,7 @@ import { useEffect, useMemo } from 'react'; import { dispatch, ActionType, useStore } from './store'; import { DefaultToastOptions } from './types'; +import { dismissToast } from './utils'; export const useToaster = (toastOptions?: DefaultToastOptions) => { const { toasts, pausedAt } = useStore(toastOptions); @@ -16,26 +17,13 @@ export const useToaster = (toastOptions?: DefaultToastOptions) => { const durationLeft = (t.duration || 0) + t.pauseDuration - (now - t.createdAt); - const dismiss = () => { - dispatch({ - type: ActionType.DISMISS_TOAST, - toastId: t.id, - }); - setTimeout(() => { - dispatch({ - type: ActionType.REMOVE_TOAST, - toastId: t.id, - }); - }, 1000); - }; - if (durationLeft < 0) { if (t.visible) { - dismiss(); + dismissToast(t.id); } return; } - return setTimeout(dismiss, durationLeft); + return setTimeout(() => dismissToast(t.id), durationLeft); }); return () => { diff --git a/src/core/utils.ts b/src/core/utils.ts index fdaca37..4e9d177 100644 --- a/src/core/utils.ts +++ b/src/core/utils.ts @@ -1,6 +1,21 @@ +import { dispatch, ActionType } from './store'; + export const genId = (() => { let count = 0; return () => { return (++count).toString(); }; })(); + +export const dismissToast = (toastId?: string) => { + dispatch({ + type: ActionType.DISMISS_TOAST, + toastId, + }); + setTimeout(() => { + dispatch({ + type: ActionType.REMOVE_TOAST, + toastId, + }); + }, 1000); +}; From 4a4760dcefb840ec5ea689aa3ed59dbf5ad64fe4 Mon Sep 17 00:00:00 2001 From: Timo Lins Date: Wed, 6 Jan 2021 10:34:00 +0100 Subject: [PATCH 04/10] Move dismiss logic back to `toast` - Use `toast.dismiss()` inside th `useToaster` auto-dimiss logic --- src/core/toast.ts | 15 +++++++++++++-- src/core/use-toaster.ts | 6 +++--- src/core/utils.ts | 15 --------------- 3 files changed, 16 insertions(+), 20 deletions(-) diff --git a/src/core/toast.ts b/src/core/toast.ts index c8ecef8..9b84eed 100644 --- a/src/core/toast.ts +++ b/src/core/toast.ts @@ -7,7 +7,7 @@ import { ValueOrFunction, resolveValueOrFunction, } from './types'; -import { genId, dismissToast } from './utils'; +import { genId } from './utils'; import { dispatch, ActionType } from './store'; type Message = ValueOrFunction; @@ -46,7 +46,18 @@ toast.error = createHandler('error'); toast.success = createHandler('success'); toast.loading = createHandler('loading'); -toast.dismiss = (toastId?: string) => dismissToast(toastId); +toast.dismiss = (toastId?: string) => { + dispatch({ + type: ActionType.DISMISS_TOAST, + toastId, + }); + setTimeout(() => { + dispatch({ + type: ActionType.REMOVE_TOAST, + toastId, + }); + }, 1000); +}; toast.remove = (toastId?: string) => dispatch({ type: ActionType.REMOVE_TOAST, toastId }); diff --git a/src/core/use-toaster.ts b/src/core/use-toaster.ts index 1313c06..9534c85 100644 --- a/src/core/use-toaster.ts +++ b/src/core/use-toaster.ts @@ -1,7 +1,7 @@ import { useEffect, useMemo } from 'react'; import { dispatch, ActionType, useStore } from './store'; +import { toast } from './toast'; import { DefaultToastOptions } from './types'; -import { dismissToast } from './utils'; export const useToaster = (toastOptions?: DefaultToastOptions) => { const { toasts, pausedAt } = useStore(toastOptions); @@ -19,11 +19,11 @@ export const useToaster = (toastOptions?: DefaultToastOptions) => { if (durationLeft < 0) { if (t.visible) { - dismissToast(t.id); + toast.dismiss(t.id); } return; } - return setTimeout(() => dismissToast(t.id), durationLeft); + return setTimeout(() => toast.dismiss(t.id), durationLeft); }); return () => { diff --git a/src/core/utils.ts b/src/core/utils.ts index 4e9d177..fdaca37 100644 --- a/src/core/utils.ts +++ b/src/core/utils.ts @@ -1,21 +1,6 @@ -import { dispatch, ActionType } from './store'; - export const genId = (() => { let count = 0; return () => { return (++count).toString(); }; })(); - -export const dismissToast = (toastId?: string) => { - dispatch({ - type: ActionType.DISMISS_TOAST, - toastId, - }); - setTimeout(() => { - dispatch({ - type: ActionType.REMOVE_TOAST, - toastId, - }); - }, 1000); -}; From 9f0891a663bf25ec3c1dfe32eaf0ff22a48cb4ed Mon Sep 17 00:00:00 2001 From: Timo Lins Date: Wed, 6 Jan 2021 10:40:23 +0100 Subject: [PATCH 05/10] Remove unused action type --- src/core/store.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/core/store.ts b/src/core/store.ts index c6f09f1..1639fdd 100644 --- a/src/core/store.ts +++ b/src/core/store.ts @@ -9,7 +9,6 @@ export enum ActionType { UPSERT_TOAST, DISMISS_TOAST, REMOVE_TOAST, - TOAST, START_PAUSE, END_PAUSE, } From de70389d265ff12752c2af8120a2d4befae3293e Mon Sep 17 00:00:00 2001 From: Timo Lins Date: Wed, 13 Jan 2021 13:20:10 +0100 Subject: [PATCH 06/10] Add Splitbee badge to website --- site/components/sections/footer.tsx | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/site/components/sections/footer.tsx b/site/components/sections/footer.tsx index c277e5c..f45eefd 100644 --- a/site/components/sections/footer.tsx +++ b/site/components/sections/footer.tsx @@ -28,6 +28,14 @@ export function Footer() { +
+ + Splitbee Analytics + +
); } From ddf51223036ad7bff68ccd04f0f1c055a0f44f8f Mon Sep 17 00:00:00 2001 From: Timo Lins Date: Fri, 15 Jan 2021 19:30:51 +0100 Subject: [PATCH 07/10] Enable Splitbee cookie-less mode --- site/pages/_app.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/site/pages/_app.tsx b/site/pages/_app.tsx index 7fe051e..0a11ebc 100644 --- a/site/pages/_app.tsx +++ b/site/pages/_app.tsx @@ -28,7 +28,7 @@ function MyApp({ Component, pageProps }) { return ( <> - + From d7c441c309e977e5594391cc5ef9483702583fce Mon Sep 17 00:00:00 2001 From: Timo Lins Date: Mon, 18 Jan 2021 20:31:46 +0100 Subject: [PATCH 08/10] Fix typo in toast example --- site/components/sections/toast-example.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/site/components/sections/toast-example.tsx b/site/components/sections/toast-example.tsx index 6e31c97..4ac4478 100644 --- a/site/components/sections/toast-example.tsx +++ b/site/components/sections/toast-example.tsx @@ -34,7 +34,7 @@ const examples: Array<{ saveSettings(settings), { loading: 'Saving...', - success: Settings saved!,, + success: Settings saved!, error: Could not save., } );`, From bcd52dbf930eb77f21559ddffac50610000744bc Mon Sep 17 00:00:00 2001 From: Timo Lins Date: Tue, 19 Jan 2021 18:26:50 +0100 Subject: [PATCH 09/10] Remove duplicate Splitbee call --- site/components/sections/toaster-example.tsx | 4 ---- 1 file changed, 4 deletions(-) diff --git a/site/components/sections/toaster-example.tsx b/site/components/sections/toaster-example.tsx index 74811a7..89d54eb 100644 --- a/site/components/sections/toaster-example.tsx +++ b/site/components/sections/toaster-example.tsx @@ -81,10 +81,6 @@ export const ToasterExample: React.FC<{ } ); - (window as any).splitbee?.track('Change Position', { - position: p, - }); - onPosition(p); }} > From a4526430e20fb547820896b523fe9f9eca1a3561 Mon Sep 17 00:00:00 2001 From: cristianbote Date: Thu, 21 Jan 2021 08:26:56 +0200 Subject: [PATCH 10/10] Wrap the getBoundingClientRect call in a setTimeout --- src/components/toast-bar.tsx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/components/toast-bar.tsx b/src/components/toast-bar.tsx index 335df70..91bffcf 100644 --- a/src/components/toast-bar.tsx +++ b/src/components/toast-bar.tsx @@ -101,8 +101,10 @@ export const ToastBar: React.FC = React.memo( ({ toast, position, ...props }) => { const ref = useCallback((el: HTMLElement | null) => { if (el) { - const boundingRect = el.getBoundingClientRect(); - props.onHeight(boundingRect.height); + setTimeout(() => { + const boundingRect = el.getBoundingClientRect(); + props.onHeight(boundingRect.height); + }); } }, []);