V2.0.5

aniplaynow · Feb 15, 2024 · e3e24d2 · e3e24d2
1 parent 286c75a
commit e3e24d2
Show file tree

Hide file tree

Showing 18 changed files with 448 additions and 302 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -32,6 +32,7 @@
     "react-dom": "^18",
     "react-draggable": "^4.4.6",
     "react-icons": "^4.12.0",
+    "react-loading-skeleton": "^3.4.0",
     "react-use-draggable-scroll": "^0.4.7",
     "sonner": "^1.4.0",
     "tailwindcss-animate": "^1.0.7"

diff --git a/src/app/anime/info/[...infoid]/page.js b/src/app/anime/info/[...infoid]/page.js
@@ -25,10 +25,10 @@ import Animecards from '@/components/CardComponent/Animecards'
 export async function generateMetadata({ params }) {
   const id = params.infoid[0];
   const data = await AnimeInfoAnilist(id);
-  
+
   return {
     title: data?.title?.english || data?.title?.romaji || 'Loading...',
-    description: data?.description.slice(0,180),
+    description: data?.description.slice(0, 180),
     openGraph: {
       title: data?.title?.english || data?.title?.romaji,
       images: [data?.coverImage?.extraLarge],
@@ -37,27 +37,29 @@ export async function generateMetadata({ params }) {
     twitter: {
       card: "summary",
       title: data?.title?.english || data?.title?.romaji,
-      description: data?.description?.slice(0,180),
+      description: data?.description?.slice(0, 180),
     },
   }
 }
 
-async function AnimeDetails({params}) {
+async function AnimeDetails({ params }) {
   const id = params.infoid[0];
   const data = await AnimeInfoAnilist(id);
   // const episodeData = await getEpisodes(id,data?.status,false);
-  
+
   return (
     <div className="">
-      <Navbarcomponent/>
-      <div className='h-[460px] sm:h-[500px] '>
-      <AnimeDetailsTop data={data}/>
-      </div>
-      <AnimeDetailsBottom data={data}/>
-      <Episodesection data={data} id={id}/>
-      <div className="recommendationglobal">
-      <Animecards data={data?.recommendations?.nodes} cardid={"Recommendations"}/>
+      <Navbarcomponent />
+      <div className='h-[500px] '>
+        <AnimeDetailsTop data={data} />
       </div>
+      <AnimeDetailsBottom data={data} />
+      <Episodesection data={data} id={id} />
+      {data?.recommendations?.nodes?.length > 0 && (
+        <div className="recommendationglobal">
+          <Animecards data={data.recommendations.nodes} cardid={"Recommendations"} />
+        </div>
+      )}
     </div>
   )
 }

diff --git a/src/app/layout.js b/src/app/layout.js
@@ -7,8 +7,7 @@ import GoToTop from '@/components/GoToTop';
 import localFont from 'next/font/local';
 import Footer from '@/components/Footer';
 import Script from "next/script";
-import { getServerSession } from 'next-auth';
-import { authOptions } from './api/auth/[...nextauth]/route';
+import { getAuthSession } from './api/auth/[...nextauth]/route';
 import { Toaster } from 'sonner'
 
 const inter = Inter({ subsets: ['latin'] })
@@ -71,7 +70,7 @@ export const metadata = {
 
 
 export default async function RootLayout({ children }) {
-  const session = await getServerSession(authOptions);
+  const session = await getAuthSession();
 
   return (
     <html lang="en" className='dark text-foreground bg-background'>

diff --git a/src/app/providers.js b/src/app/providers.js
@@ -1,34 +1,55 @@
 "use client";
 
+import React from "react";
 import { NextUIProvider } from "@nextui-org/react";
 import { DataProvider } from "@/context/DataContext";
 import { SessionProvider } from "next-auth/react";
 import { MotionDiv } from "@/utils/MotionDiv";
 import { usePathname } from "next/navigation";
 import { AppProgressBar as ProgressBar } from "next-nprogress-bar";
+import "react-loading-skeleton/dist/skeleton.css";
+import { SkeletonTheme } from "react-loading-skeleton";
+import { toast } from 'sonner'
 
 export function Providers({ children, session }) {
   const pathname = usePathname();
 
+  React.useEffect(() => {
+    // Only run this effect in the browser
+    if (typeof window !== 'undefined') {
+      // Check if the toast has already been shown
+      const hasToastShown = sessionStorage.getItem('toastShown');
+
+      if (!hasToastShown && session?.user) {
+        // Display the toast
+        toast.success(`Welcome Back, ${session.user.name}! You are currently logged in. Enjoy your time with us.`);
+        // Set the flag in sessionStorage
+        sessionStorage.setItem('toastShown', 'true');
+      }
+    }
+  }, [session]);
+
   return (
     <NextUIProvider>
       <SessionProvider session={session}>
-        <DataProvider>
-          <MotionDiv
-            key={pathname}
-            initial={{ x: 0, opacity: 0 }}
-            animate={{ x: 0, opacity: 1 }}
-            transition={{ duration: 0.5 }}
-          >
-            <ProgressBar
-              height="3px"
-              color="#CA1313"
-              options={{ showSpinner: true }}
+        <SkeletonTheme baseColor="#18181b" highlightColor="#1e1e24" borderRadius={"0.5rem"}>
+          <DataProvider>
+            <MotionDiv
+              key={pathname}
+              initial={{ x: 0, opacity: 0 }}
+              animate={{ x: 0, opacity: 1 }}
+              transition={{ duration: 0.5 }}
+            >
+              <ProgressBar
+                height="3px"
+                color="#CA1313"
+                options={{ showSpinner: true }}
               // shallowRouting // by enabling this progressbar does not show on query params change
-            />
-            {children}
-          </MotionDiv>
-        </DataProvider>
+              />
+              {children}
+            </MotionDiv>
+          </DataProvider>
+        </SkeletonTheme>
       </SessionProvider>
     </NextUIProvider>
   );