Update src/app/signup/page.tsx

src/app/credits/page.tsx

@@ -0,0 +1,131 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+import ContactText from '@/components/sections/contact/ContactText';
+import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
+
+export const metadata = {
+  title: 'VortexAI | Purchase Credits',
+  description: 'Top up your VortexAI account with credit packs for on-demand AI video generation.',
+};
+
+export default function CreditsPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="expand-hover"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="rounded"
+        contentWidth="smallMedium"
+        sizing="large"
+        background="noiseDiagonalGradient"
+        cardStyle="glass-depth"
+        primaryButtonStyle="gradient"
+        secondaryButtonStyle="glass"
+        headingFontWeight="medium"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleFullscreen
+            navItems={[
+              { name: "Home", id: "/" },
+              { name: "Features", id: "/#features" },
+              { name: "Subscriptions", id: "/subscriptions" },
+              { name: "Credits", id: "/credits" },
+              { name: "Testimonials", id: "/#testimonials" },
+              { name: "FAQ", id: "/#faq" },
+              { name: "Contact", id: "/#contact" }
+            ]}
+            brandName="VortexAI"
+            bottomLeftText="Global AI Community"
+            bottomRightText="support@vortexai.com"
+          />
+        </div>
+
+        <div id="credits" data-section="credits">
+          <PricingCardNine
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={false}
+            title="Flexible Credit Packs"
+            description="Top up your account with credits for on-demand video generation. The more you buy, the more you save!"
+            plans={[
+              {
+                id: "credit-pack-100",                title: "100 Credits",                price: "$10",                period: "one-time",                features: [
+                  "Perfect for small projects",                  "No expiration date",                  "Standard video generation"
+                ],
+                button: { text: "Buy Now", href: "/signup" }
+              },
+              {
+                id: "credit-pack-500",                title: "500 Credits",                price: "$40",                period: "one-time",                features: [
+                  "Save 20%",                  "Ideal for regular use",                  "Access to HD generation"
+                ],
+                button: { text: "Buy Now", href: "/signup" }
+              },
+              {
+                id: "credit-pack-1000",                title: "1000 Credits",                price: "$70",                period: "one-time",                features: [
+                  "Save 30%",                  "Best value for power users",                  "Access to 4K Ultra HD generation"
+                ],
+                button: { text: "Buy Now", href: "/signup" }
+              }
+            ]}
+          />
+        </div>
+
+        <div id="contact" data-section="contact">
+          <ContactText
+            useInvertedBackground={false}
+            background={{ variant: "sparkles-gradient" }}
+            text="Have questions about credits or subscriptions?"
+            buttons={[
+              { text: "Contact Support", href: "/#contact" }
+            ]}
+          />
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterBaseCard
+            logoText="VortexAI"
+            columns={[
+              {
+                title: "Product",                items: [
+                  { label: "Features", href: "/#features" },
+                  { label: "Subscriptions", href: "/subscriptions" },
+                  { label: "Credits", href: "/credits" },
+                  { label: "Dashboard", href: "/dashboard" },
+                  { label: "Login", href: "/login" }
+                ]
+              },
+              {
+                title: "Company",                items: [
+                  { label: "About Us", href: "/#about" },
+                  { label: "Careers", href: "#" },
+                  { label: "Blog", href: "#" },
+                  { label: "Contact", href: "/#contact" }
+                ]
+              },
+              {
+                title: "Resources",                items: [
+                  { label: "Help Center", href: "#" },
+                  { label: "API Docs", href: "#" },
+                  { label: "Community", href: "#" },
+                  { label: "Support", href: "#" }
+                ]
+              },
+              {
+                title: "Legal",                items: [
+                  { label: "Privacy Policy", href: "#" },
+                  { label: "Terms of Service", href: "#" },
+                  { label: "Cookie Policy", href: "#" }
+                ]
+              }
+            ]}
+            copyrightText="© 2024 VortexAI. All rights reserved."
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -308,4 +308,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/subscriptions/page.tsx

@@ -0,0 +1,131 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+import ContactText from '@/components/sections/contact/ContactText';
+import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
+
+export const metadata = {
+  title: 'VortexAI | Subscription Plans',
+  description: 'Explore VortexAI\'s monthly subscription plans with different credit limits and premium features.',
+};
+
+export default function SubscriptionsPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="expand-hover"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="rounded"
+        contentWidth="smallMedium"
+        sizing="large"
+        background="noiseDiagonalGradient"
+        cardStyle="glass-depth"
+        primaryButtonStyle="gradient"
+        secondaryButtonStyle="glass"
+        headingFontWeight="medium"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleFullscreen
+            navItems={[
+              { name: "Home", id: "/" },
+              { name: "Features", id: "/#features" },
+              { name: "Subscriptions", id: "/subscriptions" },
+              { name: "Credits", id: "/credits" },
+              { name: "Testimonials", id: "/#testimonials" },
+              { name: "FAQ", id: "/#faq" },
+              { name: "Contact", id: "/#contact" }
+            ]}
+            brandName="VortexAI"
+            bottomLeftText="Global AI Community"
+            bottomRightText="support@vortexai.com"
+          />
+        </div>
+
+        <div id="subscriptions" data-section="subscriptions">
+          <PricingCardTwo
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={false}
+            title="Choose Your Subscription Plan"
+            description="Unlock continuous creativity with our monthly subscription plans, offering generous credit allowances and exclusive features."
+            plans={[
+              {
+                id: "starter",                badge: "Free Trial",                price: "$0",                subtitle: "Perfect for trying out the platform",                buttons: [{ text: "Start Free", href: "/signup" }],
+                features: [
+                  "5 Credits/month",                  "Basic video generation",                  "Standard definition",                  "Community support"
+                ]
+              },
+              {
+                id: "pro",                badge: "Most Popular",                price: "$29/month",                subtitle: "For serious creators and professionals",                buttons: [{ text: "Get Pro", href: "/signup" }],
+                features: [
+                  "500 Credits/month",                  "All advanced features",                  "High definition",                  "Priority support",                  "Community Prompt Library access"
+                ]
+              },
+              {
+                id: "unlimited",                badge: "Ultimate Value",                price: "$99/month",                subtitle: "Unleash limitless creativity",                buttons: [{ text: "Go Unlimited", href: "/signup" }],
+                features: [
+                  "Unlimited Credits",                  "All advanced features",                  "4K Ultra HD",                  "24/7 Premium support",                  "Exclusive Style Library"
+                ]
+              }
+            ]}
+          />
+        </div>
+
+        <div id="contact" data-section="contact">
+          <ContactText
+            useInvertedBackground={false}
+            background={{ variant: "sparkles-gradient" }}
+            text="Have questions about our subscription plans?"
+            buttons={[
+              { text: "Contact Sales", href: "/#contact" }
+            ]}
+          />
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterBaseCard
+            logoText="VortexAI"
+            columns={[
+              {
+                title: "Product",                items: [
+                  { label: "Features", href: "/#features" },
+                  { label: "Subscriptions", href: "/subscriptions" },
+                  { label: "Credits", href: "/credits" },
+                  { label: "Dashboard", href: "/dashboard" },
+                  { label: "Login", href: "/login" }
+                ]
+              },
+              {
+                title: "Company",                items: [
+                  { label: "About Us", href: "/#about" },
+                  { label: "Careers", href: "#" },
+                  { label: "Blog", href: "#" },
+                  { label: "Contact", href: "/#contact" }
+                ]
+              },
+              {
+                title: "Resources",                items: [
+                  { label: "Help Center", href: "#" },
+                  { label: "API Docs", href: "#" },
+                  { label: "Community", href: "#" },
+                  { label: "Support", href: "#" }
+                ]
+              },
+              {
+                title: "Legal",                items: [
+                  { label: "Privacy Policy", href: "#" },
+                  { label: "Terms of Service", href: "#" },
+                  { label: "Cookie Policy", href: "#" }
+                ]
+              }
+            ]}
+            copyrightText="© 2024 VortexAI. All rights reserved."
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/middleware.ts

@@ -0,0 +1,35 @@
+import { NextResponse } from 'next/server';
+import type { NextRequest } from 'next/server';
+
+// This is a placeholder for actual authentication logic.
+// In a real app, you'd check for a session token, JWT, etc.
+const isAuthenticatedAdmin = (req: NextRequest) => {
+  // For demonstration: Assume an admin is authenticated if a specific cookie exists.
+  // In a real application, this would involve checking a secure session or token.
+  const adminCookie = req.cookies.get('adminAuthToken');
+  return adminCookie && adminCookie.value === 'true'; // Placeholder logic
+};
+
+export function middleware(req: NextRequest) {
+  const { pathname } = req.nextUrl;
+
+  // Protect all /admin routes except /admin/login
+  if (pathname.startsWith('/admin') && pathname !== '/admin/login') {
+    if (!isAuthenticatedAdmin(req)) {
+      const loginUrl = new URL('/admin/login', req.url);
+      return NextResponse.redirect(loginUrl);
+    }
+  }
+
+  // If trying to access /admin/login but already authenticated, redirect to /admin
+  if (pathname === '/admin/login' && isAuthenticatedAdmin(req)) {
+    const adminDashboardUrl = new URL('/admin', req.url);
+    return NextResponse.redirect(adminDashboardUrl);
+  }
+
+  return NextResponse.next();
+}
+
+export const config = {
+  matcher: ['/admin/:path*'], // Apply middleware to all paths under /admin
+};