Merge branch 'dvjsharma:master' into master

README.md

@@ -85,13 +85,53 @@ Ensure that `Node.js` and `MySQL` are installed on your machine.
 
 4. **Create a configuration file:**
 
-    Create a file named `config.env` in the server folder and simply copy the content of `.env.example` into it.
+    1.   Create a file named `config.env` in the server folder and simply copy the content of `.env.example` into it.
+
+
+    2.   Replace `user` and `password` from `DATABASE_URL="mysql://user:password@localhost:3306/drawn2shoe" ` with your  credential of mysql in the `.env` file.
 
-5. **Setting up the Database:**
+
+<!-- 5. **Setting up the Database:**
 
     Open XAMPP (or any other SQL Db service) and start the Apache and MySQL services. Find and import the database from [here](https://drive.google.com/file/d/1qShqZpEGcdhVmZ7zzAar-tBwhPFomNWW/view?usp=sharing). Make sure to name it as `drawn2shoe`.
 
-    <i>NOTE: if you have custom configuration for XAMPP, don't forget to change Db config in `server/data/database.js`</i>
+    <i>NOTE: if you have custom configuration for XAMPP, don't forget to change Db config in `server/data/database.js`</i> -->
+
+5. **Setting up Prisma:**
+
+    - Install Prisma CLI globally:
+
+      ```bash
+      npm install -g prisma
+      ```
+
+    - Follow the interactive prompts to set up Prisma with your database.
+
+    - To generate Prisma client:
+
+      ```bash
+      cd ../server
+      npx prisma generate
+      ```
+
+    - To migrate the database:
+
+      ```bash
+      cd ../server
+      npx prisma migrate dev --name init
+      ```
+
+    - To seed the database :
+
+      To populate initial datasets in the database:
+
+      ```bash
+      cd ../server
+      node prisma/seed.js
+      ```
+
+
+    - Follow the interactive prompts to set up Prisma with your database.
 
 6. **Running the Frontend:**
 

client/src/components/Cart-Card/index.jsx

@@ -1,50 +1,56 @@
-const Cartcard = (props) => {
+import React from "react";
+
+const Cartcard = ({ productId, productImage, shoename, shoeSize, quantity, price, onIncrease, onDecrease, onRemove }) => {
     return (
         <>
-            <div
-                className="justify-between mb-6 rounded-lg bg-white p-6 shadow-md sm:flex sm:justify-start"
-
-            >
+            <div className="justify-between mb-6 rounded-lg bg-white p-6 shadow-md sm:flex sm:justify-start">
                 <img
-                    src={props.productImage}
+                    src={productImage}
                     alt="product-image"
                     className="w-full rounded-lg sm:w-40"
                 />
                 <div className="sm:ml-4 sm:flex sm:w-full sm:justify-between">
                     <div className="mt-5 sm:mt-0">
                         <h2 className="text-lg font-bold text-gray-900">
-                            {props.shoename}
+                            {shoename}
                         </h2>
                         <p className="mt-1 text-xs text-gray-700">
-                            {props.shoeSize}
+                            Size: {shoeSize}
                         </p>
                     </div>
                     <div className="mt-4 flex justify-between sm:space-y-6 sm:mt-0 sm:block sm:space-x-6">
                         <div className="flex items-center border-gray-100">
-                            <span className="cursor-pointer rounded-l bg-gray-100 py-1 px-3.5 duration-100 hover:bg-blue-500 hover:text-blue-50">
+                            <span
+                                className="cursor-pointer rounded-l bg-gray-100 py-1 px-3.5 duration-100 hover:bg-blue-500 hover:text-blue-50"
+                                onClick={() => onDecrease(productId)}
+                            >
                                 {" "}
                                 -{" "}
                             </span>
                             <input
                                 className="h-8 w-8 border bg-white text-center text-xs outline-none"
                                 type="number"
-                                defaultValue={props.quantity}
-                                min="1"
+                                value={quantity}
+                                readOnly
                             />
-                            <span className="cursor-pointer rounded-r bg-gray-100 py-1 px-3 duration-100 hover:bg-blue-500 hover:text-blue-50">
+                            <span
+                                className="cursor-pointer rounded-r bg-gray-100 py-1 px-3 duration-100 hover:bg-blue-500 hover:text-blue-50"
+                                onClick={() => onIncrease(productId)}
+                            >
                                 {" "}
                                 +{" "}
                             </span>
                         </div>
                         <div className="flex items-center space-x-4">
-                            <p className="text-sm">{props.price}</p>
+                            <p className="text-sm">Price: {price}</p>
                             <svg
                                 xmlns="http://www.w3.org/2000/svg"
                                 fill="none"
                                 viewBox="0 0 24 24"
                                 strokeWidth="1.5"
                                 stroke="currentColor"
                                 className="h-5 w-5 cursor-pointer duration-150 hover:text-red-500"
+                                onClick={() => onRemove(productId)}
                             >
                                 <path
                                     strokeLinecap="round"

client/src/components/Guide/guide.jsx

@@ -58,7 +58,7 @@ const Guide = () => {
             </div>
             <div className="mt-[40px] shadow-[2px_4px_35px_4px_rgba(0,0,0,0.10)] rounded-full">
                 <Link to="/customize">
-                    <button className="inline-block bg-black text-white rounded-full border-2 border-black px-5 py-3 text-[25px] font-medium leading-normal transition duration-150 ease-in-out hover:bg-white hover:text-black focus:border-neutral-800 focus:text-neutral-800 focus:outline-none focus:ring-0 active:border-neutral-900 active:text-neutral-900 max-lg:text-[14px] hover:border-black">
+                    <button className="inline-block bg-black text-white rounded-full border-2 border-black px-5 py-3 text-[25px] font-medium leading-normal transition duration-150 ease-in-out hover:bg-white hover:text-black focus:bg-white focus:border-neutral-800 focus:text-neutral-800 focus:outline-none focus:ring-0 active:border-neutral-900 active:text-neutral-900 max-lg:text-[14px] hover:border-black">
                         Customize Now!
                     </button>
                 </Link>

client/src/components/Home-banner/HomeBanner.jsx

@@ -27,7 +27,7 @@ const HomeBanner = () => {
                         </div>
                         <div>
                             <Link to="/categories">
-                                <button className="inline-block bg-black  rounded-full border-2 border-neutral-800 px-6 pb-[6px] pt-2 text-[16px] font-medium leading-normal text-white transition duration-150 ease-in-out hover:border-neutral-800 hover:bg-white hover:text-black focus:border-neutral-800 focus:text-neutral-800 focus:outline-none focus:ring-0 active:border-neutral-900 active:text-neutral-900 max-lg:text-[14px]">
+                                <button className="inline-block bg-black rounded-full border-2 border-neutral-800 px-6 pb-[6px] pt-2 text-[16px] font-medium leading-normal text-white transition duration-150 ease-in-out hover:border-neutral-800 hover:bg-white hover:text-black focus:bg-white focus:border-neutral-800 focus:text-neutral-800 focus:outline-none focus:ring-0 active:border-neutral-900 active:text-neutral-900 max-lg:text-[14px]">
                                     Explore
                                 </button>
                             </Link>

client/src/components/Home-retailers/index.jsx

@@ -10,7 +10,7 @@ const Home_retailers_comp = () => {
             <div className="text-[50px]">Join us today!</div>
             <div className="flex gap-4">
                 <Link to="/retailer">
-                    <button className="inline-block bg-black text-white rounded-full border-2 border-black px-4 pb-[6px] pt-2 text-[16px] font-medium leading-normal transition duration-150 ease-in-out hover:border-white hover:bg-white hover:text-black focus:border-neutral-800 focus:text-neutral-800 focus:outline-none focus:ring-0 active:border-neutral-900 active:text-neutral-900 max-lg:text-[14px]">
+                    <button className="inline-block bg-black text-white rounded-full border-2 border-black px-4 pb-[6px] pt-2 text-[16px] font-medium leading-normal transition duration-150 ease-in-out hover:border-white hover:bg-white hover:text-black focus:bg-white focus:border-neutral-800 focus:text-neutral-800 focus:outline-none focus:ring-0 active:border-neutral-900 active:text-neutral-900 max-lg:text-[14px]">
                         Get started now
                     </button>
                 </Link>

client/src/components/Navbar/navbar.jsx

@@ -204,7 +204,7 @@ const Navbar = () => {
                             </Link>
                             <Link to="signup">
                                 {" "}
-                                <button className="inline-block bg-black  rounded-full border-2 border-neutral-800 px-6 pb-[6px] pt-2 text-[12px] font-medium uppercase leading-normal text-white transition duration-150 ease-in-out hover:border-neutral-800 hover:bg-white hover:text-black focus:border-neutral-800 focus:text-neutral-800 focus:outline-none focus:ring-0 active:border-neutral-900 active:text-neutral-900 ">
+                                <button className="inline-block bg-black  rounded-full border-2 border-neutral-800 px-6 pb-[6px] pt-2 text-[12px] font-medium uppercase leading-normal text-white transition duration-150 ease-in-out hover:border-neutral-800 hover:bg-white hover:text-black focus:bg-white focus:border-neutral-800 focus:text-neutral-800 focus:outline-none focus:ring-0 active:border-neutral-900 active:text-neutral-900 ">
                                     SignUp
                                 </button>{" "}
                             </Link>