From cc11cf91d78bb1c9b409e0ef79ee4a1be13475b4 Mon Sep 17 00:00:00 2001 From: sarthakKarode Date: Tue, 7 Oct 2025 01:04:35 +0530 Subject: [PATCH 1/3] feature: added skeleton --- src/app/page.tsx | 96 ++++++++++++++++++++++++++++++++++----- src/components/nav.tsx | 30 ++++++------ src/lib/supabaseclient.ts | 10 ++-- 3 files changed, 104 insertions(+), 32 deletions(-) diff --git a/src/app/page.tsx b/src/app/page.tsx index 3bb91ca..ceed4cb 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -54,20 +54,89 @@ export default function BackgroundBoxesDemo() { return (
{/* Loading Screen */} - {isLoading && ( -
-
- -

Loading...

+ {isLoading ? ( +
+ + + {/* Navbar Skeleton */} +
+
+
+
+
+
+
- )} - - + + {/* Hero Section Skeleton */} +
+
+
+
+
+
+
+
+
+
+ + {/* Scroll Section Skeleton */} +
+
+
+ + {/* 3 Steps Section Skeleton */} +
+
+
+ +
+ {[1, 2, 3].map((_, i) => ( +
+
+
+
+
+
+
+
+ ))} +
+
+ + {/* Testimonials Skeleton */} +
+
+
+ + {/* Footer Skeleton */} +
+
+
+
+
+ + ):( + <> + {/* Aurora as background */}
@@ -188,6 +257,9 @@ export default function BackgroundBoxesDemo() {
Copyright © {new Date().getFullYear()} asshelp All rights reserved.
+ + ) + }
); } \ No newline at end of file diff --git a/src/components/nav.tsx b/src/components/nav.tsx index a3725d5..1160933 100644 --- a/src/components/nav.tsx +++ b/src/components/nav.tsx @@ -13,7 +13,7 @@ import { import { useState, useEffect } from "react"; import { GitHubStarsButton } from '@/components/animate-ui/buttons/github-stars'; import { useRouter } from "next/navigation"; -import { supabase } from "@/lib/supabaseclient"; +// import { supabase } from "@/lib/supabaseclient"; export function NavbarDemo() { const navItems = [ @@ -35,20 +35,20 @@ export function NavbarDemo() { const [user, setUser] = useState(null); const router = useRouter(); - useEffect(() => { - const getUser = async () => { - const { data: { user } } = await supabase.auth.getUser(); - setUser(user); - }; - getUser(); - // Listen for auth state changes - const { data: listener } = supabase.auth.onAuthStateChange((_event, session) => { - setUser(session?.user ?? null); - }); - return () => { - listener?.subscription.unsubscribe(); - }; - }, []); + // useEffect(() => { + // const getUser = async () => { + // const { data: { user } } = await supabase.auth.getUser(); + // setUser(user); + // }; + // getUser(); + // // Listen for auth state changes + // const { data: listener } = supabase.auth.onAuthStateChange((_event, session) => { + // setUser(session?.user ?? null); + // }); + // return () => { + // listener?.subscription.unsubscribe(); + // }; + // }, []); return (
diff --git a/src/lib/supabaseclient.ts b/src/lib/supabaseclient.ts index 39f02ea..f458fff 100644 --- a/src/lib/supabaseclient.ts +++ b/src/lib/supabaseclient.ts @@ -1,7 +1,7 @@ -import { createClient } from '@supabase/supabase-js' +// import { createClient } from '@supabase/supabase-js' -// You can use environment variables for safety -const supabaseUrl = process.env.NEXT_PUBLIC_SUPABASE_URL as string -const supabaseAnonKey = process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY as string +// // You can use environment variables for safety +// const supabaseUrl = process.env.NEXT_PUBLIC_SUPABASE_URL as string +// const supabaseAnonKey = process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY as string -export const supabase = createClient(supabaseUrl, supabaseAnonKey) +// export const supabase = createClient(supabaseUrl, supabaseAnonKey) From e79cdcc8da8da3fa8e07d2665b055e39ee38afe8 Mon Sep 17 00:00:00 2001 From: sarthakKarode Date: Tue, 7 Oct 2025 01:12:26 +0530 Subject: [PATCH 2/3] fix: linting --- src/app/globals.css | 17 ++ src/app/page.tsx | 368 ++++++++++++++++++++------------------------ 2 files changed, 186 insertions(+), 199 deletions(-) diff --git a/src/app/globals.css b/src/app/globals.css index 063c788..6568b0e 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -157,4 +157,21 @@ body, margin: 0; padding: 0; +} + +@keyframes pulseGradient { + 0% { + background-color: #374151; /* gray-700 */ + } + 50% { + background-color: #475569; /* slate-600 */ + } + 100% { + background-color: #374151; /* gray-700 */ + } +} + +.skeleton-animation div[class*="bg-gray-700"], +.skeleton-animation div[class*="bg-gray-800"] { + animation: pulseGradient 2s ease-in-out infinite; } \ No newline at end of file diff --git a/src/app/page.tsx b/src/app/page.tsx index ceed4cb..d8b50a8 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,27 +1,18 @@ "use client"; import React, { useState, useEffect } from "react"; -import { Boxes } from "@/components/ui/background-boxes"; -import { cn } from "@/lib/utils"; -import Button2 from '@/components/button2'; -import { User, FileText, UploadCloud, CreditCard, Github } from 'lucide-react'; -import Upload from '@/components/upload'; +import { FileText, UploadCloud, CreditCard } from 'lucide-react'; import Aurora from '@/components/Backgrounds/Aurora'; -import { useRef } from 'react'; import { ContainerTextFlip } from "@/components/ui/container-text-flip"; import { ContainerScroll } from "@/components/ui/container-scroll-animation"; import TailwindConnectButton from "@/components/button"; -import { useRouter } from "next/navigation"; import TestimonialMarquee from "@/components/mwrap" import { NavbarDemo } from "@/components/nav"; -import { DotLottieReact } from '@lottiefiles/dotlottie-react'; - - +import Image from "next/image"; export default function BackgroundBoxesDemo() { const [scrollY, setScrollY] = useState(0); const [isLoading, setIsLoading] = useState(true); const [mounted, setMounted] = useState(false); - const router = useRouter(); useEffect(() => { setMounted(true); @@ -56,210 +47,189 @@ export default function BackgroundBoxesDemo() { {/* Loading Screen */} {isLoading ? (
- - {/* Navbar Skeleton */} -
-
-
-
-
-
+
+
+
+
+
+
+
+
-
-
- - {/* Hero Section Skeleton */} -
-
-
-
-
+ + {/* Hero Section Skeleton */} +
+
+
+
+
+
+
+
+
-
-
-
-
- - {/* Scroll Section Skeleton */} -
-
-
- - {/* 3 Steps Section Skeleton */} -
-
-
- -
- {[1, 2, 3].map((_, i) => ( -
-
-
-
-
-
+ + {/* Scroll Section Skeleton */} +
+
+
+ + {/* 3 Steps Section Skeleton */} +
+
+
+ +
+ {[1, 2, 3].map((_, i) => ( +
+
+
+
+
+
+
-
- ))} + ))} +
+
+ + {/* Testimonials Skeleton */} +
+
+
+ + {/* Footer Skeleton */} +
+
+
- - {/* Testimonials Skeleton */} -
-
-
- - {/* Footer Skeleton */} -
-
-
-
-
- ):( <> - + - {/* Aurora as background */} -
- -
- - {/* Main content centered - positioned fixed to stay in center */} -
- {/* Hero Section Layout Fix */} -
- {/* Button Row */} - - {/* Heading + Flip Row */} -
-

- Want help in -

- +
- {/* Description Row */} -
- Get professional assignment writing services from verified experts. 100% AI-free, plagiarism-free content. -
-
-
- -
-
- - {/* Spacer div to replace the br tags */} -
- - {/* ContainerScroll in normal document flow for scrolling */} -
- -

- - - - -

- - } - > - hero - - -
- {/* 3 Steps Section */} -
-
HOW IT WORKS
-

Just 3 steps to get started

-
- {/* Step 1 */} -
- - - -
-

1. Upload Your Data

-

Simply upload your data to our secure platform. We support various file formats and data types to ensure a seamless integration with your existing systems.

+ + {/* Main content centered - positioned fixed to stay in center */} +
+ {/* Hero Section Layout Fix */} +
+ {/* Button Row */} + + {/* Heading + Flip Row */} +
+

+ Want help in +

+ +
+ {/* Description Row */} +
+ Get professional assignment writing services from verified experts. 100% AI-free, plagiarism-free content. +
-
- {/* Step 2 */} -
- - - -
-

2. Click Start

-

Our advanced AI algorithms automatically process and analyze your data, extracting valuable insights and patterns that would be difficult to identify manually.

+
+
- {/* Step 3 */} -
- - - -
-

3. Get Actionable Insights

-

Receive clear, actionable insights and recommendations based on the AI analysis. Use these insights to make data-driven decisions and improve your business strategies.

-
+ + {/* Spacer div to replace the br tags */} +
+ + {/* ContainerScroll in normal document flow for scrolling */} +
+ +

+ + + + +

+ + } + > + hero + +
-
-
- {/* End 3 Steps Section */} - - {/* Made by and Copyright */} -
- -
Copyright © {new Date().getFullYear()} asshelp All rights reserved.
-
+ {/* 3 Steps Section */} +
+
HOW IT WORKS
+

Just 3 steps to get started

+
+ {/* Step 1 */} +
+ + + +
+

1. Upload Your Data

+

Simply upload your data to our secure platform. We support various file formats and data types to ensure a seamless integration with your existing systems.

+
+
+ {/* Step 2 */} +
+ + + +
+

2. Click Start

+

Our advanced AI algorithms automatically process and analyze your data, extracting valuable insights and patterns that would be difficult to identify manually.

+
+
+ {/* Step 3 */} +
+ + + +
+

3. Get Actionable Insights

+

Receive clear, actionable insights and recommendations based on the AI analysis. Use these insights to make data-driven decisions and improve your business strategies.

+
+
+
+
+ {/* End 3 Steps Section */} + + {/* Made by and Copyright */} +
+ +
Copyright © {new Date().getFullYear()} asshelp All rights reserved.
+
- ) - } + )}
); } \ No newline at end of file From 51af331775da5ba2785d215fbdaab8a1b6993573 Mon Sep 17 00:00:00 2001 From: sarthakKarode Date: Tue, 7 Oct 2025 13:11:06 +0530 Subject: [PATCH 3/3] fixed: changes according to qodo merge bot --- src/app/page.tsx | 63 +------------------ src/components/PageSkeleton.tsx | 21 +++++++ src/components/skeletons/FooterSkeleton.tsx | 8 +++ src/components/skeletons/HeroSkeleton.tsx | 14 +++++ src/components/skeletons/NavbarSkeleton.tsx | 13 ++++ .../skeletons/ScrollSectionSkeletion.tsx | 7 +++ src/components/skeletons/StepsSkeleton.tsx | 21 +++++++ .../skeletons/TestimonialsSkeleton.tsx | 7 +++ 8 files changed, 93 insertions(+), 61 deletions(-) create mode 100644 src/components/PageSkeleton.tsx create mode 100644 src/components/skeletons/FooterSkeleton.tsx create mode 100644 src/components/skeletons/HeroSkeleton.tsx create mode 100644 src/components/skeletons/NavbarSkeleton.tsx create mode 100644 src/components/skeletons/ScrollSectionSkeletion.tsx create mode 100644 src/components/skeletons/StepsSkeleton.tsx create mode 100644 src/components/skeletons/TestimonialsSkeleton.tsx diff --git a/src/app/page.tsx b/src/app/page.tsx index d8b50a8..ce11e8e 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -8,6 +8,7 @@ import TailwindConnectButton from "@/components/button"; import TestimonialMarquee from "@/components/mwrap" import { NavbarDemo } from "@/components/nav"; import Image from "next/image"; +import PageSkeleton from "@/components/PageSkeleton"; export default function BackgroundBoxesDemo() { const [scrollY, setScrollY] = useState(0); @@ -45,67 +46,7 @@ export default function BackgroundBoxesDemo() { return (
{/* Loading Screen */} - {isLoading ? ( -
- {/* Navbar Skeleton */} -
-
-
-
-
-
-
-
-
- - {/* Hero Section Skeleton */} -
-
-
-
-
-
-
-
-
-
- - {/* Scroll Section Skeleton */} -
-
-
- - {/* 3 Steps Section Skeleton */} -
-
-
- -
- {[1, 2, 3].map((_, i) => ( -
-
-
-
-
-
-
-
- ))} -
-
- - {/* Testimonials Skeleton */} -
-
-
- - {/* Footer Skeleton */} -
-
-
-
-
- ):( + {isLoading ? :( <> diff --git a/src/components/PageSkeleton.tsx b/src/components/PageSkeleton.tsx new file mode 100644 index 0000000..bccab57 --- /dev/null +++ b/src/components/PageSkeleton.tsx @@ -0,0 +1,21 @@ +import FooterSkeleton from "./skeletons/FooterSkeleton"; +import HeroSkeleton from "./skeletons/HeroSkeleton"; +import NavbarSkeleton from "./skeletons/NavbarSkeleton"; +import ScrollSectionSkeleton from "./skeletons/ScrollSectionSkeletion"; +import StepsSkeleton from "./skeletons/StepsSkeleton"; +import TestimonialsSkeleton from "./skeletons/TestimonialsSkeleton"; + +const PageSkeleton = () => { + return ( +
+ + + + + + +
+ ) +}; + +export default PageSkeleton; \ No newline at end of file diff --git a/src/components/skeletons/FooterSkeleton.tsx b/src/components/skeletons/FooterSkeleton.tsx new file mode 100644 index 0000000..3c25369 --- /dev/null +++ b/src/components/skeletons/FooterSkeleton.tsx @@ -0,0 +1,8 @@ +export default function FooterSkeleton () { + return ( +
+
+
+
+ ) +} \ No newline at end of file diff --git a/src/components/skeletons/HeroSkeleton.tsx b/src/components/skeletons/HeroSkeleton.tsx new file mode 100644 index 0000000..f666113 --- /dev/null +++ b/src/components/skeletons/HeroSkeleton.tsx @@ -0,0 +1,14 @@ +export default function HeroSkeleton () { + return ( +
+
+
+
+
+
+
+
+
+
+ ) +} \ No newline at end of file diff --git a/src/components/skeletons/NavbarSkeleton.tsx b/src/components/skeletons/NavbarSkeleton.tsx new file mode 100644 index 0000000..70deb8d --- /dev/null +++ b/src/components/skeletons/NavbarSkeleton.tsx @@ -0,0 +1,13 @@ +export default function NavbarSkeleton () { + return ( +
+
+
+
+
+
+
+
+
+ ) +} \ No newline at end of file diff --git a/src/components/skeletons/ScrollSectionSkeletion.tsx b/src/components/skeletons/ScrollSectionSkeletion.tsx new file mode 100644 index 0000000..3d186b9 --- /dev/null +++ b/src/components/skeletons/ScrollSectionSkeletion.tsx @@ -0,0 +1,7 @@ +export default function ScrollSectionSkeleton () { + return ( +
+
+
+ ) +} \ No newline at end of file diff --git a/src/components/skeletons/StepsSkeleton.tsx b/src/components/skeletons/StepsSkeleton.tsx new file mode 100644 index 0000000..96f7d0d --- /dev/null +++ b/src/components/skeletons/StepsSkeleton.tsx @@ -0,0 +1,21 @@ +export default function StepsSkeleton () { + return ( +
+
+
+ +
+ {[1, 2, 3].map((step) => ( +
+
+
+
+
+
+
+
+ ))} +
+
+ ) +} \ No newline at end of file diff --git a/src/components/skeletons/TestimonialsSkeleton.tsx b/src/components/skeletons/TestimonialsSkeleton.tsx new file mode 100644 index 0000000..1aa3f76 --- /dev/null +++ b/src/components/skeletons/TestimonialsSkeleton.tsx @@ -0,0 +1,7 @@ +export default function TestimonialsSkeleton () { + return ( +
+
+
+ ) +} \ No newline at end of file