Merge pull request #4 from canopas/update-readme

Update readme

README.md

@@ -1,25 +1,75 @@
-<img src="./media/cta_banner.png"/>
+<a href="https://canopas.com/contact" target="_blank"><img src="./media/cta_banner.png"/></a>
 
 # Bite Space – Your Ultimate Culinary Companion!
 
-Bite Space is a web application designed to help users discover new restaurants and cuisines, explore menus, and find their next favorite dish. Whether you're a foodie looking for your next culinary adventure or a restaurant owner seeking to expand your reach, FoodFinder has you covered.
+Bite space is a platform, where users can discover new restaurants and cuisines, explore menus, and find their next favorite dish. Whether you're a foodie looking for your next culinary adventure or a restaurant owner seeking to expand your reach, Bite Space has you covered.
 
 <a href="https://bitespace.in" target="_blank"><img src="./media/logo.png"/></a>
 
 ## Welcome to the Bite Space
 
-A food web app for food lovers which is built in nextjs to discover popular foods and restaurants/cafes near you or where you want.
+A food web app for food lovers which is built in Next.js to discover popular foods and restaurants/cafés near you or where you want.
 
-🍔 Explore Culinary Delights: Dive into a world of flavors with our curated collection of dishes. Discover local favorites, international delights, and recipes that cater to every palate.
+🍔 <b>Explore Culinary Delights:</b> Dive into a world of flavors with our curated collection of dishes. Discover local favorites, international delights, and recipes that cater to every palate.
 
-📸 Visual Feast: Immerse yourself in a visual journey with stunning images of mouthwatering dishes. Every photo tells a story, inviting you to savor the artistry behind each culinary creation.
+📸 <b>Visual Feast:</b> Immerse yourself in a visual journey with stunning images of mouthwatering dishes. Every photo tells a story, inviting you to savor the artistry behind each culinary creation.
 
-🌐 Personalized Recommendations: Tailored to your taste! Receive personalized food recommendations based on your preferences, previous selections, and trending dishes in your area.
+🍴 <b>Browse by Categories:</b> Users can explore all available categories, making it easy to find specific types of cuisine or dishes they're interested in.
 
-🍳 Recipe Hub: From kitchen novices to seasoned chefs, our Recipe Hub offers a variety of easy-to-follow recipes. Experiment with diverse cuisines and elevate your cooking skills.
+🌮 <b>Browse Restaurants by Cuisines:</b> Users can browse restaurants categorized by cuisines, making it convenient to explore different culinary traditions.
 
-🏆 Community & Reviews: Join a vibrant community of food enthusiasts. Share your culinary experiences, leave reviews, and connect with like-minded individuals who share your passion for food.
+📋 <b>Restaurant Menus:</b> Users have access to detailed restaurant menus, allowing them to peruse dishes and make informed decisions before dining out.
 
-📍 Local Insights: Get to know the heart and soul of local eateries. Explore restaurant profiles, learn about chefs, and discover the unique stories behind each culinary gem.
+🤝 <b>Partner with Us:</b> Restaurant and café owners can easily partner with us to showcase their establishments and reach a wider audience of food enthusiasts.
 
-📅 Events & Festivals: Stay in the loop with upcoming food-related events, festivals, and happenings in your area. Never miss a chance to experience the latest in the culinary world.
+📢 <b>About Us:</b> Learn more about Bite Space and its mission on our About Us page.
+
+🌙 <b>Dark Mode:</b> Enjoy a visually comfortable experience with our dark mode feature, perfect for nighttime browsing or reducing eye strain.
+
+We're actively working on Bite Space 🚧 and have exciting plans for future features, <br />
+Stay tuned for these upcoming features to further enhance your Bite Space experience!
+
+## Technologies Used
+
+<b>Next.js:</b> A React framework for building server-side rendered and statically generated applications.
+
+<b>Tailwind CSS:</b> A utility-first CSS framework for rapidly building custom designs.
+
+<b>Supabase:</b> An open-source alternative to Firebase, providing backend services such as authentication, real-time database, and more.
+
+## Project Structure
+The project is divided into two main parts:
+
+### Website
+The website folder contains all the files related to the user-facing portion of the application. For more information on setting up and running the website, refer to the website [README](./website/README.md) file.
+
+<img src="./media/website.gif"/>
+
+### Admin Panel
+The admin panel folder houses all the files for managing restaurant data and accounts. For detailed instructions on setting up and using the admin panel, refer to the admin panel [README](./admin/README.md) file.
+
+<img src="./media/admin_panel.gif" />
+
+## Contributing
+We welcome contributions from the community. To contribute to this project, please follow these guidelines:
+
+- Fork the repository.
+- Create a new branch for your feature or bug fix.
+- Make your changes and commit them.
+- Push your changes to your fork.
+- Submit a pull request with a clear description of your changes.
+- Please ensure your code follows the project's coding standards and includes appropriate documentation.
+
+## Creating Issues
+
+Found a bug or have a suggestion for improvement? We'd love to hear from you! Please create an issue on our [GitHub repository](https://github.com/canopas/bite-space/issues) and provide as much detail as possible. Your feedback helps us make Bite Space better for everyone!
+
+## Credits
+
+Bite Space is owned and maintained by the [Canopas team](https://canopas.com/). You can reach out to them on GitHub at [canopas](https://github.com/canopas) for questions or need support. You can follow them on Twitter at [@canopassoftware](https://twitter.com/canopassoftware) for more updates. If you are interested in building web apps or designing products, please let us know. We'd love to hear from you!
+
+<a href="https://canopas.com/contact" target="_blank"><img src="./media/cta_button.png" width="300" /></a>
+
+## License
+
+This project is licensed under the [MIT](./LICENSE).

admin/.env.example

@@ -0,0 +1,12 @@
+NEXT_PUBLIC_ADMIN_BASE_URL="Your Admin Panel URL"
+NEXT_PUBLIC_SUPABASE_URL="Your Supabase Project URL"
+NEXT_PUBLIC_SUPABASE_ANON_KEY="Your Supabase Project anon API key"
+NEXT_PUBLIC_JWT_SECRET="A Random Key to Encrypt/Decrypt JWT Token"
+NEXT_PUBLIC_CRYPTO_SECRET="A Random Key to Encrypt/Decrypt Password"
+NEXT_PUBLIC_AWS_REGION="Your AWS Account Region"
+NEXT_PUBLIC_AWS_ACCESS_KEY_ID="Your AWS Account Access Key"
+NEXT_PUBLIC_AWS_SECRET_ACCESS_KEY="Your AWS Account Secret Access Key"
+NEXT_PUBLIC_MAIL_SENDER="Your Mail Sender Email Id"
+NEXT_PUBLIC_SUPABASE_STORAGE_URL="Your Supabase Storage URL"
+NEXT_PUBLIC_SUPABASE_USER="Your Supabase User Email for Auth"
+NEXT_PUBLIC_SUPABASE_USER_PWD="Your Supabase User Password for Auth"

admin/README.md

@@ -1,40 +1,39 @@
-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).
+# Bite Space Admin Panel
 
-## Getting Started
+Welcome to the Bite Space Admin Panel! This is the part of our application where restaurant owners can manage their data, including categories, menus, dishes, and account information.
+
+<img src="../media/admin_panel.gif" />
+
+## Features
 
-First, run the development server:
+🔐 <b>Sign In, Sign Up, and Forgot Password:</b> Users can securely sign in to their accounts, register for new accounts, and reset forgotten passwords, ensuring a smooth and secure user experience.
 
-```bash
-npm run dev
-# or
-yarn dev
-# or
-pnpm dev
-# or
-bun dev
-```
+📁 <b>Manage Categories:</b> Organize your menu items by managing categories, making it easy for users to navigate.
 
-Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+🍽️ <b>Manage Menus:</b> Add, edit, or remove menu items to keep your restaurant's menu up-to-date.
 
-You can start editing the page by modifying `pages/index.tsx`. The page auto-updates as you edit the file.
+🥘 <b>Manage Dishes:</b> Control the details of each dish, including descriptions, prices, and availability.
 
-[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.ts`.
+👤 <b>Manage Account Information:</b> Update your restaurant's contact information and other account details.
+
+👥 <b>Invite Staff and Members:</b> Grant access to your team members and staff to manage dishes, media, and other account-related tasks.
+
+## Getting Started
 
-The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
+To get started with the Bite Space admin panel, follow these steps:
 
-This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
+- <b>Clone the Repository:</b> Clone this repository to your local machine using `git clone <repo>`.
 
-## Learn More
+- <b>Navigate to Admin Folder:</b> Enter the admin folder using `cd admin`.
 
-To learn more about Next.js, take a look at the following resources:
+- <b>Install Dependencies:</b> Install dependencies by running `npm install`.
 
-- [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.
+- <b>Set Environment Variables:</b> Set up environment variables for Supabase. You can find the necessary variables in the `.env.example` file. Rename it to `.env.local` and fill in the required values.
 
-You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
+- <b>Run the Application:</b> Start the application by running `npm run dev`.
 
-## Deploy on Vercel
+- <b>Access the Admin Panel:</b> Open your browser and go to `http://localhost:3000` to access the Bite Space admin panel.
 
-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.
+## Support
 
-Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
+If you encounter any issues or have any questions regarding the Bite Space admin panel, feel free to reach out to us at GitHub [canopas](https://github.com/canopas) or [@canopassoftware](https://twitter.com/canopassoftware), we're here to help!

website/.env.example

@@ -0,0 +1,2 @@
+NEXT_PUBLIC_SUPABASE_URL="Your Supabase Project URL"
+NEXT_PUBLIC_SUPABASE_ANON_KEY="Your Supabase Project anon API key"

website/README.md

@@ -1,40 +1,41 @@
-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).
+# Bite Space Website
 
-## Getting Started
+Welcome to Bite Space! This is the user-facing part of our application, where users can explore restaurants, cuisines, and menus.
+
+<img src="../media/website.gif"/>
+
+## Features
+
+🏠 <b>Home Page:</b> Our home page welcomes users with default categories, popular food items, and trending restaurants and cuisines, providing a glimpse into the diverse culinary landscape available.
 
-First, run the development server:
+🍴 <b>Browse by Categories:</b> Users can explore all available categories, making it easy to find specific types of cuisine or dishes they're interested in.
 
-```bash
-npm run dev
-# or
-yarn dev
-# or
-pnpm dev
-# or
-bun dev
-```
+🌮 <b>Browse Restaurants by Cuisines:</b> Users can browse restaurants categorized by cuisines, making it convenient to explore different culinary traditions.
 
-Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+📋 <b>Restaurant Menus:</b> Users have access to detailed restaurant menus, allowing them to peruse dishes and make informed decisions before dining out.
 
-You can start editing the page by modifying `pages/index.tsx`. The page auto-updates as you edit the file.
+🤝 <b>Partner with Us:</b> Restaurant and café owners can easily partner with us to showcase their establishments and reach a wider audience of food enthusiasts.
 
-[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.ts`.
+📢 <b>About Us:</b> Learn more about Bite Space and its mission on our About Us page.
+
+🌙 <b>Dark Mode:</b> Enjoy a visually comfortable experience with our dark mode feature, perfect for nighttime browsing or reducing eye strain.
+
+## Getting Started
 
-The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
+To get started with the Bite Space website, follow these steps:
 
-This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
+- <b>Clone the Repository:</b> Clone this repository to your local machine using `git clone <repo>`.
 
-## Learn More
+- <b>Navigate to Website Folder:</b> Enter the website folder using `cd website`.
 
-To learn more about Next.js, take a look at the following resources:
+- <b>Install Dependencies:</b> Install dependencies by running `npm install`.
 
-- [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.
+- <b>Set Environment Variables:</b> Set up environment variables for Supabase. You can find the necessary variables in the `.env.example` file. Rename it to `.env.local` and fill in the required values.
 
-You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
+- <b>Run the Application:</b> Start the application by running `npm run dev`.
 
-## Deploy on Vercel
+- <b>Access the Website:</b> Open your browser and go to `http://localhost:3000` to access the Bite Space website.
 
-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.
+## Support
 
-Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
+If you encounter any issues or have any questions regarding the Bite Space website, feel free to reach out to us at GitHub [canopas](https://github.com/canopas) or [@canopassoftware](https://twitter.com/canopassoftware), we're here to help!

website/components/ItemCard/SingleItem.tsx

@@ -2,11 +2,21 @@ import { ItemProps } from "@/types/card-item";
 import Image from "next/image";
 
 const SingleItem = ({ item }: { item: ItemProps }) => {
-  const { id, name, tags, image, video, price, rating, restaurants } = item;
+  const {
+    id,
+    name,
+    description,
+    tags,
+    image,
+    video,
+    price,
+    rating,
+    restaurants,
+  } = item;
   return (
     <>
       <div
-        className="wow fadeInUp relative flex h-full flex-col overflow-hidden rounded-xl bg-gradient-to-r from-white to-black shadow-one"
+        className="wow fadeInUp relative flex h-full flex-col overflow-hidden rounded-xl bg-gradient-to-r from-white to-black shadow-one bg-cover"
         style={{ backgroundImage: `url(${image})` }}
         data-wow-delay=".1s"
       >
@@ -35,22 +45,19 @@ const SingleItem = ({ item }: { item: ItemProps }) => {
           )}
         </div>
         <div
-          className={`flex-auto bg-black bg-opacity-70 p-5 text-white ${
+          className={`flex-auto bg-black bg-opacity-70 p-5 ${
             video ? "z-[1]" : ""
           }`}
         >
-          <div className="mb-4">
-            <div className="dark:text-whit block text-xl font-bold">{name}</div>
-            <p className="text-sm">{tags ? tags.join(", ") : " "}</p>
-          </div>
-          <div className="mb-4 flex justify-between border-b border-white border-opacity-20 pb-4 text-base font-medium">
-            <div className="flex gap-5">
-              <p>⭐ {rating}</p>
+          <div className="mb-4 border-b border-gray-300 border-opacity-20 pb-4 text-gray-200 dark:text-gray-300">
+            <div className="mb-3 flex justify-between text-lg font-bold">
+              <p>{name}</p>
+              <p>₹{price}</p>
             </div>
-            <div className="text-lg font-bold text-white/70">₹{price}</div>
+            <p className="text-xs">{description}</p>
           </div>
-          <div className="">
-            <div className="text-xl font-bold hover:text-primary dark:hover:text-primary sm:text-2xl">
+          <div className="text-white flex flex-col gap-2">
+            <div className="text-xl font-bold sm:text-2xl">
               {restaurants.name}
             </div>
             <p className="text-sm">{restaurants.address}</p>

website/components/ItemCard/index.tsx

@@ -17,7 +17,7 @@ const ItemCard = () => {
       try {
         const { data: dishesData, error } = await supabase
           .from("dishes")
-          .select("menu_id, name, price, images, video, tags")
+          .select("menu_id, name, description, price, images, video, tags")
           .range(0, 8);
 
         if (error) throw error;
@@ -26,7 +26,7 @@ const ItemCard = () => {
           dishesData.map(async (dish) => {
             const { data: menuData, error: menuError } = await supabase
               .from("menus")
-              .select("*, restaurants(id, name, address)")
+              .select("id, restaurant_id, restaurants(id, name, address)")
               .eq("id", dish.menu_id)
               .single();
 
@@ -65,7 +65,7 @@ const ItemCard = () => {
           <div className="grid grid-cols-1 gap-x-8 gap-y-10 md:grid-cols-2 md:gap-x-6 lg:gap-x-8 xl:grid-cols-3">
             {itemData.map((item: any) => (
               <div key={"item-card-" + item.id}>
-                <InView triggerOnce>
+                <InView triggerOnce className="animated-fade-y">
                   {({ inView, ref, entry }) => (
                     <Link
                       ref={ref}

website/components/YouMayLike/index.tsx

@@ -27,15 +27,10 @@ const YouMayLike = () => {
         const { data, error } = await supabase
           .from("restaurants")
           .select()
-          .range(0, 4);
+          .range(0, 3);
 
         if (error) throw error;
 
-        data.map((item) => {
-          item.rating = 4.3;
-          item.reviews = 150;
-        });
-
         setRestaurantsData(data);
       } catch (error) {
         console.error("Error while fetching restaurants data: ", error);
@@ -107,18 +102,6 @@ const YouMayLike = () => {
                             <p className="text-sm text-gray-200 sm:text-base">
                               {item.address}
                             </p>
-                            <div className="flex items-center justify-between font-extrabold">
-                              <p className="">
-                                {item.reviews}{" "}
-                                <span className="text-sm font-normal text-gray-200">
-                                  {" "}
-                                  Reviews
-                                </span>
-                              </p>
-                              <p className="rounded-full px-4 sm:py-2">
-                                ⭐ {item.rating}
-                              </p>
-                            </div>
                           </div>
                         </div>
                       </Link>