Let's Build a Full Stack Dev T-Shirt E-commerce Website with Next.js 14

formatPrice.ts

const formatPrice = (amount: number) => {
  return new Intl.NumberFormat("en-US", {
    style: "currency",
    currency: "USD",
  }).format(amount / 100);
};

export default formatPrice;

index.ts

export const mainLinks = [
  {
    route: "/",
    label: "Home",
  },
  {
    route: "/shop",
    label: "Shop",
  },
  {
    route: "/contact",
    label: "Contact",
  },
  {
    route: "/",
    label: "About",
  },
];


export const userLinks = [
  {
    route: "/dashboard",
    label: "Orders",
  },
  {
    route: "/wishlist",
    label: "Wishlist",
  },
];

route.ts

import bcrypt from "bcrypt";
import NextAuth, { AuthOptions } from "next-auth";
import CredentialsProvider from "next-auth/providers/credentials";
import { PrismaAdapter } from "@auth/prisma-adapter";
import prisma from "@/lib/prismadb";

export const authOptions: AuthOptions = {
  adapter: PrismaAdapter(prisma) as any,
  providers: [
    CredentialsProvider({
      name: 'credentials',
      credentials: {
        email: { label: 'email', type: 'text' },
        password: { label: 'password', type: 'password' }
      },
      async authorize(credentials) {
        if (!credentials?.email || !credentials?.password) {
          throw new Error('Invalid credentials');
        }

        const user = await prisma.user.findUnique({
          where: {
            email: credentials.email
          }
        });

        if (!user || !user?.hashedPassword) {
          throw new Error('Invalid credentials');
        }

        const isCorrectPassword = await bcrypt.compare(
          credentials.password,
          user.hashedPassword
        );

        if (!isCorrectPassword) {
          throw new Error('Invalid credentials');
        }

        return user;
      }
    })
  ],
  
  pages: {
    signIn: "/sign-in",
  },
  
  session: {
    strategy: "jwt",
  },
  
  secret: process.env.NEXTAUTH_SECRET,
};

const handler = NextAuth(authOptions);

export { handler as GET, handler as POST };

useWishlistStore.tsx

import { create } from "zustand";
import { persist } from "zustand/middleware";
import { ProductType } from "@/types/ProductTypes";

type WishlistState = {
  wishList: ProductType[];
  addToWishlist: (item: ProductType) => void;
  removeFromWishlist: (item: ProductType) => void;
};

export const useWishlistStore = create<WishlistState>()(
  persist(
    (set) => ({
      // INITIAL VALUES
      wishList: [],
     

      // SETTING THE STATE

// Function to add an item to the wishlist
addToWishlist: (item) =>
  set((state) => {
    // Check if the item is already in the wishlist
    const existingItem = state.wishList.find((wishItem) => wishItem.id === item.id);

    if (existingItem) {
      // If the item is already in the wishlist, update its quantity to 1
      const updatedWishList = state.wishList.map((wishItem) => {
        if (wishItem.id === item.id) {
          return { ...wishItem, quantity: 1 };
        }
        return wishItem;
      });

      // Return the updated wishlist
      return { wishList: updatedWishList };
    } else {
      // If the item is not in the wishlist, add it with a quantity of 1
      return { wishList: [...state.wishList, { ...item, quantity: 1 }] };
    }
  }),

      removeFromWishlist: (item) =>
        set((state) => {
          const existingItem = state.wishList.find((wishItem) => wishItem.id === item.id);
          if (existingItem && existingItem.quantity! > 1) {
            const updatedWishList = state.wishList.map((wishItem) => {
              if (wishItem.id === item.id) {
                return { ...wishItem, quantity: wishItem.quantity! - 1 };
              }
              return wishItem;
            });
            return { wishList: updatedWishList };
          } else {
            const filteredWishList = state.wishList.filter((wishItem) => wishItem.id !== item.id);
            return { wishList: filteredWishList };
          }
        }),
    }),
    { name: "wishlist-store" }
  )
);