From 1f7f8e358859d56ec63ccc39484b609b4a511773 Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Thu, 4 May 2023 15:44:22 +0700
Subject: fix loader

---
 src/pages/_app.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/pages/_app.jsx')

diff --git a/src/pages/_app.jsx b/src/pages/_app.jsx
index 3c93d27f..eff5c506 100644
--- a/src/pages/_app.jsx
+++ b/src/pages/_app.jsx
@@ -44,7 +44,7 @@ function MyApp({ Component, pageProps }) {
   return (
     <>
       {animateLoader && (
-        <div className='w-screen h-screen z-[500] flex justify-center items-center backdrop-blur'>
+        <div className='fixed w-screen h-screen z-[500] flex justify-center items-center backdrop-blur'>
           <LogoSpinner />
         </div>
       )}
-- 
cgit v1.2.3


From 5176b20ba78ff69845267e5633778e325a04b47c Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Thu, 4 May 2023 15:49:46 +0700
Subject: fixing loader

---
 src/pages/_app.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/pages/_app.jsx')

diff --git a/src/pages/_app.jsx b/src/pages/_app.jsx
index eff5c506..c8d76153 100644
--- a/src/pages/_app.jsx
+++ b/src/pages/_app.jsx
@@ -44,7 +44,7 @@ function MyApp({ Component, pageProps }) {
   return (
     <>
       {animateLoader && (
-        <div className='fixed w-screen h-screen z-[500] flex justify-center items-center backdrop-blur'>
+        <div className='fixed w-screen h-screen z-[500] flex justify-center items-center'>
           <LogoSpinner />
         </div>
       )}
-- 
cgit v1.2.3


From 32e1f2ee577f227f6535782cb3c17867a9b4365c Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Thu, 4 May 2023 15:53:46 +0700
Subject: fix loader

---
 src/pages/_app.jsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'src/pages/_app.jsx')

diff --git a/src/pages/_app.jsx b/src/pages/_app.jsx
index c8d76153..e04106c1 100644
--- a/src/pages/_app.jsx
+++ b/src/pages/_app.jsx
@@ -43,8 +43,8 @@ function MyApp({ Component, pageProps }) {
 
   return (
     <>
-      {animateLoader && (
-        <div className='fixed w-screen h-screen z-[500] flex justify-center items-center'>
+      {!animateLoader && (
+        <div className='fixed w-screen h-screen z-[500] bg-white flex justify-center items-center'>
           <LogoSpinner />
         </div>
       )}
-- 
cgit v1.2.3


From 9e69219b805d45414c41f8cb2c74fc642ba5bc75 Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Thu, 4 May 2023 15:53:57 +0700
Subject: fix loader

---
 src/pages/_app.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/pages/_app.jsx')

diff --git a/src/pages/_app.jsx b/src/pages/_app.jsx
index e04106c1..2ab028bd 100644
--- a/src/pages/_app.jsx
+++ b/src/pages/_app.jsx
@@ -43,7 +43,7 @@ function MyApp({ Component, pageProps }) {
 
   return (
     <>
-      {!animateLoader && (
+      {animateLoader && (
         <div className='fixed w-screen h-screen z-[500] bg-white flex justify-center items-center'>
           <LogoSpinner />
         </div>
-- 
cgit v1.2.3


From ded7c0e4bb72e3309716559a69f4f11e1e3c2302 Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Thu, 4 May 2023 16:44:14 +0700
Subject: fixing loader

---
 src/pages/_app.jsx | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

(limited to 'src/pages/_app.jsx')

diff --git a/src/pages/_app.jsx b/src/pages/_app.jsx
index 2ab028bd..beacb122 100644
--- a/src/pages/_app.jsx
+++ b/src/pages/_app.jsx
@@ -17,12 +17,15 @@ function MyApp({ Component, pageProps }) {
   const [animateLoader, setAnimateLoader] = useState(false)
 
   useEffect(() => {
-    Router.events.on('routeChangeStart', () => setAnimateLoader(true))
-    Router.events.on('routeChangeComplete', () => setAnimateLoader(false))
+    const handleRouteChangeStart = () => setAnimateLoader(true)
+    const handleRouteChangeComplete = () => setAnimateLoader(false)
+
+    Router.events.on('routeChangeStart', handleRouteChangeStart)
+    Router.events.on('routeChangeComplete', handleRouteChangeComplete)
 
     return () => {
-      Router.events.off('routeChangeStart', () => setAnimateLoader(true))
-      Router.events.off('routeChangeComplete', () => setAnimateLoader(false))
+      Router.events.off('routeChangeStart', handleRouteChangeStart)
+      Router.events.off('routeChangeComplete', handleRouteChangeComplete)
     }
   }, [])
 
-- 
cgit v1.2.3


From d994eda7bdb06805a6dc24240d2c7db034d1fc77 Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Fri, 5 May 2023 16:10:35 +0700
Subject: add loader animation

---
 src/pages/_app.jsx | 24 ++++++++++++++++++------
 1 file changed, 18 insertions(+), 6 deletions(-)

(limited to 'src/pages/_app.jsx')

diff --git a/src/pages/_app.jsx b/src/pages/_app.jsx
index beacb122..2d74d8b7 100644
--- a/src/pages/_app.jsx
+++ b/src/pages/_app.jsx
@@ -1,7 +1,7 @@
 import '../styles/globals.css'
 import NextProgress from 'next-progress'
 import { useRouter, Router } from 'next/router'
-import { AnimatePresence } from 'framer-motion'
+import { AnimatePresence, motion } from 'framer-motion'
 import { Toaster } from 'react-hot-toast'
 import { QueryClient, QueryClientProvider } from 'react-query'
 import useDevice from '@/core/hooks/useDevice'
@@ -22,10 +22,12 @@ function MyApp({ Component, pageProps }) {
 
     Router.events.on('routeChangeStart', handleRouteChangeStart)
     Router.events.on('routeChangeComplete', handleRouteChangeComplete)
+    Router.events.on('routeChangeError', handleRouteChangeComplete)
 
     return () => {
       Router.events.off('routeChangeStart', handleRouteChangeStart)
       Router.events.off('routeChangeComplete', handleRouteChangeComplete)
+      Router.events.off('routeChangeError', handleRouteChangeComplete)
     }
   }, [])
 
@@ -46,11 +48,21 @@ function MyApp({ Component, pageProps }) {
 
   return (
     <>
-      {animateLoader && (
-        <div className='fixed w-screen h-screen z-[500] bg-white flex justify-center items-center'>
-          <LogoSpinner />
-        </div>
-      )}
+      <AnimatePresence>
+        {animateLoader && (
+          <motion.div
+            initial={{ opacity: 0 }}
+            animate={{ opacity: 1 }}
+            exit={{ opacity: 0 }}
+            transition={{
+              duration: 0.1
+            }}
+            className='fixed w-screen h-screen z-[500] bg-white flex justify-center items-center'
+          >
+            <LogoSpinner />
+          </motion.div>
+        )}
+      </AnimatePresence>
       <Toaster
         position='top-center'
         containerStyle={toasterStyle}
-- 
cgit v1.2.3