fix: add useCallback hook to toast method

jeanverster · Jun 4, 2021 · ff0c604 · ff0c604
1 parent 110b9be
commit ff0c604
Showing 1 changed file with 18 additions and 15 deletions.
diff --git a/src/Context/index.tsx b/src/Context/index.tsx
@@ -48,21 +48,24 @@ const ToastProvider: React.FC<Omit<ToastContextType, 'toast'>> = ({
 }) => {
   const [toasts, setToasts] = React.useState<FullToastConfig[]>([])
 
-  const toast = (newToast: ToastConfig) => {
-    LayoutAnimation.configureNext(CustomLayoutConfig)
-    setToasts((prevToasts) => {
-      const toasts =
-        position === 'BOTTOM'
-          ? [...prevToasts, { index: prevToasts.length, id: uuid(), ...newToast }]
-          : [{ index: prevToasts.length, id: uuid(), ...newToast }, ...prevToasts]
-      if (maxToasts && prevToasts.length === maxToasts) {
-        position === 'BOTTOM' ? toasts.shift() : toasts.pop()
-        return toasts
-      } else {
-        return toasts
-      }
-    })
-  }
+  const toast = React.useCallback(
+    (newToast: ToastConfig) => {
+      LayoutAnimation.configureNext(CustomLayoutConfig)
+      setToasts((prevToasts) => {
+        const toasts =
+          position === 'BOTTOM'
+            ? [...prevToasts, { index: prevToasts.length, id: uuid(), ...newToast }]
+            : [{ index: prevToasts.length, id: uuid(), ...newToast }, ...prevToasts]
+        if (maxToasts && prevToasts.length === maxToasts) {
+          position === 'BOTTOM' ? toasts.shift() : toasts.pop()
+          return toasts
+        } else {
+          return toasts
+        }
+      })
+    },
+    [maxToasts]
+  )
 
   const hideToast = (id: string) => {
     LayoutAnimation.configureNext(CustomLayoutConfig)