@titas_mallick/wedding-site-gen 1.0.0

package/app/invitation/maker/page.js

@@ -0,0 +1,168 @@
+"use client";
+
+import { useEffect, useState } from "react";
+import AddGuestModal from "./guestAdder";
+import GuestTable from "./guestShower";
+import Dash from "./dashboard";
+import RSVPViewer from "./rsvpViewer";
+import Auth from "./auth";
+import firebaseApp from "@/config/firebase";
+import {
+  getFirestore,
+  doc,
+  addDoc,
+  collection,
+  onSnapshot,
+  setDoc,
+  deleteDoc,
+  serverTimestamp,
+  query,
+  orderBy,
+} from "firebase/firestore";
+import { addToast } from "@heroui/react";
+import { fontCursive } from "@/config/fonts";
+
+const InvitationMaker = () => {
+  const [user, setUser] = useState(null);
+  const [guests, setGuests] = useState([]);
+  const [isModalOpen, setIsModalOpen] = useState(false);
+  const [editingGuest, setEditingGuest] = useState(null);
+
+  const db = getFirestore(firebaseApp());
+
+  useEffect(() => {
+    if (!user) return;
+
+    // const invitationRef = collection(db, "invitation");
+    const q = query(collection(db, "invitation"), orderBy("createdAt", "desc"));
+
+    const unsubscribe = onSnapshot(q, (snapshot) => {
+      const guests = snapshot.docs.map((doc) => ({
+        id: doc.id,
+        ...doc.data(),
+      }));
+      setGuests(guests);
+    });
+
+    return () => unsubscribe(); // cleanup on unmount
+  }, [db, user]);
+
+  const handleAddGuest = async (guestData) => {
+    console.log("Saving Guest:", guestData);
+    const cleanedData = {
+      ...guestData,
+      invitedGuests: Number(guestData.invitedGuests), // ensure number type
+      createdAt: serverTimestamp(),
+    };
+
+    try {
+      if (guestData.id) {
+        // Update existing guest by doc ID with merge
+        const guestRef = doc(db, "invitation", guestData.id);
+        await setDoc(guestRef, cleanedData, { merge: true });
+        console.log("🔁 Guest updated in Firestore");
+        addToast({
+          title: "Guest Updated",
+          description: "Guest details have been updated successfully.",
+          color: "success",
+          variant: "solid",
+          radius: "lg",
+          closeIcon: true,
+          timeout: 2000,
+        });
+      } else {
+        // Add new guest
+        await addDoc(collection(db, "invitation"), cleanedData);
+        console.log("✅ Guest added to Firestore");
+        addToast({
+          title: "Guest Added",
+          description: "Guest has been added successfully.",
+          color: "success",
+          variant: "solid",
+          radius: "lg",
+          closeIcon: true,
+          timeout: 2000,
+        });
+      }
+    } catch (error) {
+      console.error("❌ Error saving guest:", error);
+      addToast({
+        title: "Error",
+        description: "An error occurred while saving the guest.",
+        color: "danger",
+        variant: "solid",
+        radius: "lg",
+        closeIcon: true,
+        timeout: 2000,
+      });
+    }
+
+    setIsModalOpen(false);
+    setEditingGuest(null);
+  };
+
+  const handleDeleteGuest = async (guestToDelete) => {
+    try {
+      const guestRef = doc(db, "invitation", guestToDelete.id);
+      await deleteDoc(guestRef);
+      console.log("🗑️ Guest deleted from Firestore");
+      addToast({
+        title: "Guest deleted",
+        description: "Guest has been deleted successfully.",
+        color: "danger",
+        variant: "solid",
+        radius: "lg",
+        closeIcon: true,
+        timeout: 2000,
+      });
+    } catch (error) {
+      console.error("❌ Error deleting guest:", error);
+    }
+  };
+
+  const handleEditClick = (guest) => {
+    setEditingGuest(guest);
+    setIsModalOpen(true);
+  };
+
+  const handleAddClick = () => {
+    setEditingGuest(null);
+    setIsModalOpen(true);
+  };
+
+  return (
+    <>
+      <h1
+        className={`${fontCursive.className} text-center text-5xl leading-snug bg-cover bg-center bg-no-repeat pt-2 pb-10`}
+      >
+        Guest Management System
+      </h1>
+      <Auth userSet={setUser} />
+      {guests && <Dash guests={guests} />}
+      {user && guests && (
+        <div className="mt-10 px-4">
+          <RSVPViewer guests={guests} />
+        </div>
+      )}
+      {user && (
+        <AddGuestModal
+          isOpen={isModalOpen}
+          onClose={() => setIsModalOpen(false)}
+          onAdd={handleAddGuest}
+          existingGuest={editingGuest}
+        />
+      )}
+      <br />
+      {guests && user && (
+        <GuestTable
+          guests={guests}
+          onEdit={handleEditClick}
+          onDelete={handleDeleteGuest}
+          onAdd={handleAddClick}
+        />
+      )}
+    </>
+  );
+};
+
+export default InvitationMaker;

package/app/invitation/maker/rsvpViewer.js

@@ -0,0 +1,122 @@
+"use client";
+
+import { useState, useEffect } from "react";
+import {
+  Table,
+  TableHeader,
+  TableColumn,
+  TableBody,
+  TableRow,
+  TableCell,
+  Chip,
+  User,
+  Tooltip,
+} from "@heroui/react";
+import { 
+  getFirestore, 
+  collection, 
+  onSnapshot, 
+  query, 
+  orderBy 
+} from "firebase/firestore";
+import firebaseApp from "@/config/firebase";
+import { fontMono } from "@/config/fonts";
+
+const db = getFirestore(firebaseApp());
+
+export default function RSVPViewer({ guests }) {
+  const [rsvps, setRsvps] = useState([]);
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    const q = query(collection(db, "rsvps"), orderBy("timestamp", "desc"));
+    const unsubscribe = onSnapshot(q, (snapshot) => {
+      const rsvpData = snapshot.docs.map((doc) => {
+        const data = doc.data();
+        // Match with the master guest list to get more details (side, relation)
+        const masterGuest = guests.find(g => g.id === data.guestId);
+        return {
+          id: doc.id,
+          ...data,
+          familySide: masterGuest?.familySide || "Unknown",
+          relation: masterGuest?.relation || "Guest",
+        };
+      });
+      setRsvps(rsvpData);
+      setLoading(false);
+    });
+
+    return () => unsubscribe();
+  }, [guests]);
+
+  const columns = [
+    { name: "GUEST", uid: "guest" },
+    { name: "ATTENDING", uid: "attending" },
+    { name: "FOOD", uid: "food" },
+    { name: "GUESTS", uid: "count" },
+    { name: "NOTE", uid: "note" },
+  ];
+
+  return (
+    <div className="space-y-4">
+      <div className="flex items-center justify-between px-2">
+        <h2 className="text-2xl font-bold text-default-800 dark:text-white">Live RSVP Responses</h2>
+        <Chip variant="flat" color="secondary" size="sm" className={fontMono.className}>
+          Total: {rsvps.length}
+        </Chip>
+      </div>
+
+      <Table aria-label="RSVP Response Table" shadow="sm" className="bg-white dark:bg-zinc-900/50">
+        <TableHeader columns={columns}>
+          {(column) => (
+            <TableColumn key={column.uid} className="bg-default-50 dark:bg-zinc-800 font-bold">
+              {column.name}
+            </TableColumn>
+          )}
+        </TableHeader>
+        <TableBody items={rsvps} emptyContent={"No RSVPs received yet."} isLoading={loading}>
+          {(item) => (
+            <TableRow key={item.id} className="border-b border-default-100 last:border-none">
+              <TableCell>
+                <User
+                  name={item.guestName}
+                  description={`${item.familySide === "bride" ? "Bride's" : "Groom's"} ${item.relation}`}
+                  avatarProps={{
+                    size: "sm",
+                    className: item.familySide === "bride" ? "bg-wedding-pink-100 text-wedding-pink-600" : "bg-wedding-gold-100 text-wedding-gold-600",
+                    name: item.guestName.charAt(0)
+                  }}
+                />
+              </TableCell>
+              <TableCell>
+                <Chip
+                  color={item.attending === "yes" ? "success" : "danger"}
+                  variant="flat"
+                  size="sm"
+                  className="font-bold uppercase"
+                >
+                  {item.attending === "yes" ? "Attending" : "Declined"}
+                </Chip>
+              </TableCell>
+              <TableCell>
+                <Chip color={item.food === "veg" ? "success" : "warning"} variant="dot" size="sm">
+                  {item.food === "veg" ? "Vegetarian" : "Non-Veg"}
+                </Chip>
+              </TableCell>
+              <TableCell>
+                <span className="font-mono font-bold text-lg">{item.guests}</span>
+              </TableCell>
+              <TableCell>
+                <Tooltip content={item.note || "No special note"}>
+                  <p className="text-xs text-default-500 truncate max-w-[150px] italic">
+                    {item.note || "—"}
+                  </p>
+                </Tooltip>
+              </TableCell>
+            </TableRow>
+          )}
+        </TableBody>
+      </Table>
+    </div>
+  );
+}

package/app/layout.tsx

@@ -0,0 +1,98 @@
+import "@/styles/globals.css";
+import { Metadata, Viewport } from "next";
+import clsx from "clsx";
+
+import { Providers } from "./providers";
+
+import { siteConfig } from "@/config/site";
+import { fontSans, fontMono, fontCursive } from "@/config/fonts"; // include all fonts
+import { Navbar } from "@/components/navbar";
+import { Footer } from "@/components/footer";
+import { Analytics } from "@vercel/analytics/next";
+import ConciergeBot from "@/components/ConciergeBot";
+
+export const metadata: Metadata = {
+  metadataBase: new URL("https://www.titas-sukanya-for.life/"),
+
+  title: {
+    default: siteConfig.name,
+    template: `%s - ${siteConfig.name}`,
+  },
+  description: siteConfig.description,
+  keywords: ["Wedding", "Titas", "Sukanya", "Marriage", "Celebration", "Event"],
+  authors: [
+    {
+      name: "Titas Mallick",
+      url: "https://www.titas-sukanya-for.life",
+    },
+  ],
+  creator: "Titas Mallick",
+  icons: {
+    icon: "/love-birds.png",
+  },
+  openGraph: {
+    type: "website",
+    locale: "en_US",
+    url: "https://www.titas-sukanya-for.life/",
+    title: siteConfig.name,
+    description: siteConfig.description,
+    siteName: siteConfig.name,
+    images: [
+      {
+        url: "/pw/020.jpg",
+        width: 1200,
+        height: 630,
+        alt: "Titas & Sukanya Wedding",
+      },
+    ],
+  },
+  twitter: {
+    card: "summary_large_image",
+    title: siteConfig.name,
+    description: siteConfig.description,
+    images: ["/pw/020.jpg"],
+    creator: "@titas",
+  },
+};
+
+export const viewport: Viewport = {
+  themeColor: [
+    { media: "(prefers-color-scheme: light)", color: "white" },
+    { media: "(prefers-color-scheme: dark)", color: "black" },
+  ],
+};
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <html
+      suppressHydrationWarning
+      className={clsx(
+        fontSans.variable,
+        fontMono.variable,
+        fontCursive.variable,
+      )}
+      lang="en"
+    >
+      <head />
+      <body
+        className={clsx("min-h-screen bg-background font-sans antialiased")}
+      >
+        <Providers themeProps={{ attribute: "class", defaultTheme: "light" }}>
+          <div className="relative flex flex-col h-screen">
+            <Navbar />
+            <main className="container mx-auto max-w-7xl pt-16 px-6 flex-grow">
+              {children}
+            </main>
+            <Footer />
+            <Analytics />
+            <ConciergeBot />
+          </div>
+        </Providers>
+      </body>
+    </html>
+  );
+}

package/app/mark-the-dates/layout.tsx

@@ -0,0 +1,7 @@
+export default function MarkTheDatesLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return <section className="w-full">{children}</section>;
+}

package/app/mark-the-dates/page.tsx

@@ -0,0 +1,196 @@
+"use client";
+
+import { motion } from "framer-motion";
+import { Card, CardBody, Image, Chip } from "@heroui/react";
+import { useEffect, useState } from "react";
+
+import { fontCursive, fontSans, fontMono } from "@/config/fonts";
+import { HeartFilledIcon, CalendarIcon } from "@/components/icons";
+
+const importantDates = [
+  {
+    title: "The Proposal",
+    date: "15th March 2025",
+    note: "The day Titas finally asked Sukanya out with a ring.",
+    image: "/Images/19.jpg",
+  },
+  {
+    title: "The Patipatra",
+    date: "18th April 2025",
+    note: "Our families came up with a holy date.",
+    image: "/Images/Patipatra.jpeg",
+  },
+  {
+    title: "Our Engagement",
+    date: "23rd November 2025",
+    note: "A promise sealed with love and laughter.",
+    image: "/Images/22.jpg",
+  },
+  {
+    title: "Wedding Bells",
+    date: "23rd January 2026",
+    note: "Two souls, one journey begins.",
+    image: "/Images/21.jpg",
+  },
+  {
+    title: "Reception",
+    date: "25th January 2026",
+    note: "Celebrating our union with friends and family.",
+    image: "/Images/20.jpg",
+  },
+];
+
+export default function DatesPage() {
+  const [now, setNow] = useState<Date | null>(null);
+
+  useEffect(() => {
+    setNow(new Date());
+  }, []);
+
+  const parseDate = (dateStr: string) => {
+    const cleaned = dateStr.replace(/(\d+)(st|nd|rd|th)/, "$1");
+
+    return new Date(cleaned);
+  };
+
+  return (
+    <div className="min-h-screen pb-20 pt-10 px-4">
+      {/* Header */}
+      <section className="max-w-4xl mx-auto text-center mb-20">
+        <motion.div
+          animate={{ opacity: 1, y: 0 }}
+          initial={{ opacity: 0, y: -20 }}
+          transition={{ duration: 0.8 }}
+        >
+          <span className="inline-block px-3 py-1 rounded-full bg-wedding-pink-50 dark:bg-wedding-pink-900/30 text-wedding-pink-600 dark:text-wedding-pink-300 text-xs font-bold tracking-widest uppercase mb-6 border border-wedding-pink-100 dark:border-wedding-pink-800">
+            Our Journey
+          </span>
+          <h1
+            className={`${fontCursive.className} py-2 text-5xl md:text-7xl bg-gradient-to-r from-wedding-pink-600 to-wedding-gold-600 dark:from-wedding-pink-400 dark:to-wedding-gold-400 bg-clip-text text-transparent mb-6 leading-normal`}
+          >
+            Mark the Dates
+          </h1>
+          <p className="text-default-500 dark:text-default-400 max-w-xl mx-auto italic">
+            &quot;Every moment led us here. From the first proposal to the final
+            vows, follow the milestones of our love story.&quot;
+          </p>
+        </motion.div>
+      </section>
+
+      {/* Timeline Grid */}
+      <div className="max-w-5xl mx-auto relative">
+        {/* Timeline Line (Center - Desktop only) */}
+        <div className="absolute left-1/2 top-0 bottom-0 w-0.5 bg-gradient-to-b from-wedding-pink-200 via-wedding-gold-200 to-transparent -translate-x-1/2 hidden md:block opacity-30" />
+
+        <div className="flex flex-col gap-12 md:gap-24">
+          {importantDates.map((item, index) => {
+            const eventDate = parseDate(item.date);
+            const isPast = now ? now > eventDate : false;
+            const isLeft = index % 2 === 0;
+
+            return (
+              <motion.div
+                key={index}
+                className={`flex flex-col ${isLeft ? "md:flex-row" : "md:flex-row-reverse"} items-center gap-8 md:gap-0`}
+                initial={{ opacity: 0, x: isLeft ? -50 : 50 }}
+                transition={{ duration: 0.7, ease: "easeOut" }}
+                viewport={{ once: true, margin: "-100px" }}
+                whileInView={{ opacity: 1, x: 0 }}
+              >
+                {/* Content Side */}
+                <div
+                  className={`w-full md:w-1/2 ${isLeft ? "md:pr-16 md:text-right" : "md:pl-16 md:text-left"}`}
+                >
+                  <div
+                    className={`flex flex-col ${isLeft ? "md:items-end" : "md:items-start"} items-center space-y-3`}
+                  >
+                    <div className="flex items-center gap-2">
+                      {isPast && (
+                        <Chip
+                          className="bg-green-50 dark:bg-green-900/20 text-green-600 dark:text-green-400 border-green-100 dark:border-green-800/30"
+                          color="success"
+                          size="sm"
+                          variant="flat"
+                        >
+                          Completed
+                        </Chip>
+                      )}
+                      <p
+                        className={`${fontMono.className} text-wedding-pink-500 font-bold tracking-tighter text-sm`}
+                      >
+                        {item.date}
+                      </p>
+                    </div>
+
+                    <h3
+                      className={`${fontSans.className} text-2xl md:text-3xl font-bold text-default-900`}
+                    >
+                      {item.title}
+                    </h3>
+
+                    <p className="text-default-500 dark:text-default-400 text-sm md:text-base leading-relaxed max-w-sm">
+                      {item.note}
+                    </p>
+                  </div>
+                </div>
+
+                {/* Center Icon (Desktop only) */}
+                <div className="absolute left-1/2 -translate-x-1/2 w-10 h-10 rounded-full bg-white dark:bg-zinc-900 border-4 border-wedding-pink-100 dark:border-wedding-pink-900 hidden md:flex items-center justify-center z-10 shadow-lg">
+                  {isPast ? (
+                    <HeartFilledIcon className="w-4 h-4 text-wedding-pink-500" />
+                  ) : (
+                    <CalendarIcon className="w-4 h-4 text-wedding-gold-500" />
+                  )}
+                </div>
+
+                {/* Image Side */}
+                <div
+                  className={`w-full md:w-1/2 ${isLeft ? "md:pl-16" : "md:pr-16"}`}
+                >
+                  <motion.div
+                    className="w-full"
+                    transition={{ type: "spring", stiffness: 300 }}
+                    whileHover={{ scale: 1.02 }}
+                  >
+                    <Card
+                      className={`overflow-hidden border-none shadow-xl aspect-[4/5] w-full ${isPast ? "opacity-90" : ""}`}
+                    >
+                      <CardBody className="p-0 h-full w-full overflow-hidden relative">
+                        <Image
+                          removeWrapper
+                          alt={item.title}
+                          className="z-0 w-full h-full object-cover hover:scale-105 transition-transform duration-700 block"
+                          height="100%"
+                          radius="none"
+                          src={item.image}
+                          width="100%"
+                        />
+                      </CardBody>
+                    </Card>
+                  </motion.div>
+                </div>
+              </motion.div>
+            );
+          })}
+        </div>
+      </div>
+
+      {/* Bottom Call to Action */}
+      <motion.div
+        className="mt-32 text-center"
+        initial={{ opacity: 0 }}
+        whileInView={{ opacity: 1 }}
+      >
+        <div className="inline-block p-[2px] rounded-full bg-gradient-to-r from-wedding-pink-500 to-wedding-gold-500 mb-6">
+          <div className="bg-white dark:bg-zinc-900 px-8 py-3 rounded-full">
+            <p
+              className={`${fontCursive.className} text-3xl bg-gradient-to-r from-wedding-pink-600 to-wedding-gold-600 dark:from-wedding-pink-400 dark:to-wedding-gold-400 bg-clip-text text-transparent`}
+            >
+              Counting down the days...
+            </p>
+          </div>
+        </div>
+      </motion.div>
+    </div>
+  );
+}

package/app/memories/layout.tsx

@@ -0,0 +1,7 @@
+export default function MemoriesLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return <div className="w-full">{children}</div>;
+}

package/app/memories/page.tsx

@@ -0,0 +1,29 @@
+"use client";
+
+import { fontCursive } from "@/config/fonts";
+import Gallery from "@/components/Gallery";
+
+export default function MemoriesPage() {
+  return (
+    <div className="w-full min-h-screen pb-20">
+      <section className="relative py-16 md:py-24 text-center px-4 overflow-hidden">
+        {/* Decorative Background */}
+        <div className="absolute top-0 left-1/2 -translate-x-1/2 w-[600px] h-[400px] bg-wedding-pink-100/40 dark:bg-wedding-pink-900/10 rounded-full blur-[100px] pointer-events-none" />
+
+        <div className="relative z-10">
+          <h1
+            className={`${fontCursive.className} text-5xl md:text-7xl lg:text-8xl bg-gradient-to-r from-wedding-pink-600 to-wedding-gold-600 bg-clip-text text-transparent mb-6 py-4 leading-normal`}
+          >
+            Days of Future Past
+          </h1>
+          <p className="text-default-500 dark:text-gray-300 text-lg md:text-xl max-w-2xl mx-auto italic">
+            &quot;Frames that echo where we began, rather than where we
+            stand.&quot;
+          </p>
+        </div>
+      </section>
+
+      <Gallery />
+    </div>
+  );
+}

package/app/page.tsx

@@ -0,0 +1,5 @@
+import Herohome from "@/components/hero";
+
+export default function Home() {
+  return <Herohome />;
+}

package/app/providers.tsx

@@ -0,0 +1,33 @@
+"use client";
+
+import type { ThemeProviderProps } from "next-themes";
+
+import * as React from "react";
+import { HeroUIProvider } from "@heroui/system";
+import { useRouter } from "next/navigation";
+import { ThemeProvider as NextThemesProvider } from "next-themes";
+import { ToastProvider } from "@heroui/react";
+
+export interface ProvidersProps {
+  children: React.ReactNode;
+  themeProps?: ThemeProviderProps;
+}
+
+declare module "@react-types/shared" {
+  interface RouterConfig {
+    routerOptions: NonNullable<
+      Parameters<ReturnType<typeof useRouter>["push"]>[1]
+    >;
+  }
+}
+
+export function Providers({ children, themeProps }: ProvidersProps) {
+  const router = useRouter();
+
+  return (
+    <HeroUIProvider navigate={router.push}>
+      <ToastProvider />
+      <NextThemesProvider {...themeProps}>{children}</NextThemesProvider>
+    </HeroUIProvider>
+  );
+}

package/app/sagun/layout.tsx

@@ -0,0 +1,7 @@
+export default function SagunLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return <div className="w-full">{children}</div>;
+}