first commit

.eslintrc.json

@@ -0,0 +1,3 @@
+{
+  "extends": "next/core-web-vitals"
+}

.gitignore

@@ -0,0 +1,37 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+.yarn/install-state.gz
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+.env.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

README.md

@@ -0,0 +1,36 @@
+This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
+
+## Getting Started
+
+First, run the development server:
+
+```bash
+npm run dev
+# or
+yarn dev
+# or
+pnpm dev
+# or
+bun dev
+```
+
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+
+You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
+
+This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
+
+## Learn More
+
+To learn more about Next.js, take a look at the following resources:
+
+- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
+- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+
+You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
+
+## Deploy on Vercel
+
+The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
+
+Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.

actions/get-billboard.tsx

@@ -0,0 +1,11 @@
+import { Billboard } from "@/types";
+
+const URL = `${process.env.NEXT_PUBLIC_SERVER_URL}/billboards`;
+
+const getBillboard = async (id: string): Promise<Billboard> => {
+  const res = await fetch(`${URL}/${id}`);
+
+  return res.json();
+};
+
+export default getBillboard;

actions/get-cart.tsx

@@ -0,0 +1,11 @@
+import { Cart } from "@/types";
+
+const URL = `${process.env.NEXT_PUBLIC_SERVER_URL}/cart/get`;
+
+const getCart = async (id: string): Promise<Cart> => {
+  const res = await fetch(`${URL}/${id}`);
+
+  return res.json();
+};
+
+export default getCart;

actions/get-categories.tsx

@@ -0,0 +1,11 @@
+import { Category } from "@/types";
+
+const URL = `${process.env.NEXT_PUBLIC_API_URL}/categories`;
+
+const getCategories = async (): Promise<Category> => {
+  const res = await fetch(URL);
+
+  return res.json();
+};
+
+export default getCategories;

actions/get-category.tsx

@@ -0,0 +1,11 @@
+import { IndiviualCategory } from "@/types";
+
+const URL = `${process.env.NEXT_PUBLIC_SERVER_URL}/categories`;
+
+const getCategory = async (id: string): Promise<IndiviualCategory> => {
+  const res = await fetch(`${URL}/${id}`);
+
+  return res.json();
+};
+
+export default getCategory;

actions/get-colors.tsx

@@ -0,0 +1,11 @@
+import { Color } from "@/types";
+
+const URL = `${process.env.NEXT_PUBLIC_API_URL}/colors`;
+
+const getColors = async (): Promise<Color> => {
+  const res = await fetch(URL);
+
+  return res.json();
+};
+
+export default getColors;

actions/get-product.tsx

@@ -0,0 +1,11 @@
+import { IndiviualProduct } from "@/types";
+
+const URL = `${process.env.NEXT_PUBLIC_SERVER_URL}/products`;
+
+const getProduct = async (id: string): Promise<IndiviualProduct> => {
+  const res = await fetch(`${URL}/${id}`);
+
+  return res.json();
+};
+
+export default getProduct;

actions/get-products.tsx

@@ -0,0 +1,29 @@
+import { Product } from "@/types";
+import qs from "query-string";
+
+interface Query {
+  colorId?: string;
+  sizeId?: string;
+  categoryId?: string;
+  isFeatured?: boolean;
+}
+
+const URL = `${process.env.NEXT_PUBLIC_API_URL}/products`;
+
+const getProducts = async (query: Query): Promise<Product> => {
+  const url = qs.stringifyUrl({
+    url: URL,
+    query: {
+      colorId: query.colorId,
+      sizeId: query.sizeId,
+      categoryId: query.categoryId,
+      isFeatured: query.isFeatured,
+    },
+  });
+
+  const res = await fetch(url);
+
+  return res.json();
+};
+
+export default getProducts;

actions/get-sizes.tsx

@@ -0,0 +1,11 @@
+import { Size } from "@/types";
+
+const URL = `${process.env.NEXT_PUBLIC_API_URL}/sizes`;
+
+const getSizes = async (): Promise<Size> => {
+  const res = await fetch(URL);
+
+  return res.json();
+};
+
+export default getSizes;

app/(auth)/sign-in/components/auth-form.tsx

@@ -0,0 +1,119 @@
+"use client";
+import Input from "@/components/ui/input";
+import z from "zod";
+import { SubmitHandler, useForm } from "react-hook-form";
+import { useEffect, useState } from "react";
+import Button from "@/components/button";
+import Link from "next/link";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useUser } from "@/zustand/user";
+import axios from "axios";
+import toast from "react-hot-toast";
+import { useRouter } from "next/navigation";
+import FetchUser from "@/components/fetch-user";
+
+axios.defaults.baseURL = process.env.NEXT_PUBLIC_SERVER_URL;
+axios.defaults.withCredentials = true;
+
+const AuthForm = () => {
+  const [isLoading, setIsLoading] = useState(false);
+  const { user, setUser } = useUser();
+  const router = useRouter();
+
+  useEffect(() => {
+    if (user) {
+      console.log(user);
+      router.push("/");
+    }
+  }, [user, router]);
+
+  const formSchema = z.object({
+    phone: z
+      .string()
+      .trim()
+      .min(1, "Phone number is required")
+      .regex(/^\d+$/, "Mobile number must contain only digits")
+      .length(10, "Phone number must be exactly 10 digits"),
+    password: z.string().min(1, "Password is required").trim(),
+  });
+
+  type FormValues = z.infer<typeof formSchema>;
+
+  const {
+    handleSubmit,
+    register,
+    formState: { errors },
+    clearErrors,
+  } = useForm<FormValues>({
+    defaultValues: {
+      phone: undefined,
+      password: undefined,
+    },
+    resolver: zodResolver(formSchema),
+    mode: "onSubmit",
+  });
+
+  const onSubmit: SubmitHandler<FormValues> = (data: FormValues) => {
+    setIsLoading(true);
+    console.log(data);
+    axios
+      .post(`/customers/login`, data)
+      .then((res) => {
+        console.log(res.data);
+        toast.success(res.data.message);
+        setUser(res.data.customer);
+        router.back();
+      })
+      .catch((err) => {
+        console.log(err);
+        toast.error(err.response.data.message);
+      })
+      .finally(() => {
+        setIsLoading(false);
+      });
+  };
+
+  return (
+    <>
+      <div className="flex flex-col p-5 bg-white rounded-lg shadow-lg max-w-lg w-full">
+        <form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
+          <Input
+            id="phone"
+            type="text"
+            label="Phone Number"
+            required={true}
+            register={register}
+            errors={errors}
+            disabled={isLoading}
+            placeholder="Enter your phone number"
+            onChange={() => clearErrors("phone")}
+          />
+          <Input
+            id="password"
+            type="text"
+            label="Password"
+            required={true}
+            register={register}
+            errors={errors}
+            disabled={isLoading}
+            placeholder="Enter your password"
+            onChange={() => clearErrors("password")}
+          />
+
+          <Button type="submit" fullWidth disabled={isLoading}>
+            Login
+          </Button>
+        </form>
+        <p className="text-gray-900 font-medium mt-4 text-lg text-center">
+          New Here?
+          <Link href="/sign-up" className="underline ml-1">
+            Create An Account
+          </Link>
+        </p>
+      </div>
+      <FetchUser />
+    </>
+  );
+};
+
+export default AuthForm;

app/(auth)/sign-in/page.tsx

@@ -0,0 +1,43 @@
+import FetchUser from "@/components/fetch-user";
+import AuthForm from "./components/auth-form";
+import { Metadata } from "next";
+
+export const metadata: Metadata = {
+  title: "Sign In | Fashion Fusion",
+  description:
+    "Sign in to your Fashion Fusion account. Access your personalized shopping experience, view your orders, and explore exclusive offers.",
+  robots: {
+    index: false,
+    follow: false,
+  },
+  openGraph: {
+    title: "Sign In | Fashion Fusion",
+    description:
+      "Sign in to your Fashion Fusion account. Access your personalized shopping experience, view your orders, and explore exclusive offers.",
+    images: ["/logo.png"],
+  },
+  twitter: {
+    card: "summary_large_image",
+    title: "Sign In | Fashion Fusion",
+    description:
+      "Sign in to your Fashion Fusion account. Access your personalized shopping experience, view your orders, and explore exclusive offers.",
+    images: ["/logo.png"],
+  },
+};
+
+const Login = () => {
+  return (
+    <>
+      <div className="min-h-screen bg-gray-100 flex flex-col gap-6 items-center justify-center">
+        <div className="logo"></div>
+        <h1 className="text-3xl sm:text-4xl font-bold text-center text-gray-900 tracking-tight">
+          Sign Into Your Account
+        </h1>
+        <AuthForm />
+      </div>
+      <FetchUser />
+    </>
+  );
+};
+
+export default Login;