Implement Create Dish Form Page on Vendor Dashboard

alimento-nextjs/.env.example

@@ -1 +1,22 @@
-DATABASE_URL="your mongodb url"
+# Database URL for MongoDB connection
+# Format: "mongodb+srv://<username>:<password>@<cluster-url>/<database-name>"
+DATABASE_URL="your_mongodb_connection_string_here"
+
+# SMTP Configuration for Email Services
+# Replace with your SMTP provider's details if not using Gmail.
+SMTP_HOST="smtp.gmail.com"                    # SMTP server host
+SMTP_PORT=587                                  # SMTP server port (587 for TLS)
+SMTP_SECURE=false                              # Use false for TLS/STARTTLS, true for SSL
+SMTP_USER="[email protected]"             # Email address to send from
+SMTP_PASS="your_smtp_password_here"            # SMTP password or app-specific password for Gmail
+
+# NextAuth Configuration
+# NEXTAUTH_URL: Set to your app's URL for production; use http://localhost:3000 for local development.
+NEXTAUTH_URL="http://localhost:3000"           # Base URL for NextAuth authentication
+NEXTAUTH_SECRET="your_nextauth_secret_here"    # Secret used to sign NextAuth tokens
+
+# Cloudinary Configuration for Image Uploads
+# Replace these with your Cloudinary account details for image uploads.
+NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME="your_cloud_name_here"   # Cloudinary cloud name
+NEXT_PUBLIC_CLOUDINARY_CLOUD_PRESET="your_upload_preset"   # Cloudinary upload preset
+

alimento-nextjs/actions/dish/dishCREATE.ts

@@ -10,13 +10,15 @@ export async function createDish({
   category,
   tags,
   vendorId,
+  images,
 }: {
   name: string;
-  description?: string;
+  description: string;
   price: number;
   category: Category;
   tags: Tag[];
   vendorId: string;
+  images: string[]
 }): Promise<{ success: boolean; error?: string; data?: Dish }> {
   try {
     const newDish = await prismadb.dish.create({
@@ -27,6 +29,9 @@ export async function createDish({
         category,
         tags,
         vendorId,
+        images: {
+          create: images.map(url => ({ url })), // Assuming you're passing URLs
+        },
       },
     });
     return { success: true, data: newDish };

alimento-nextjs/app/api/testing/dish/route.ts

@@ -1,20 +1,19 @@
 
 import { createDish } from "@/actions/dish/dishCREATE";
 import { getAllDishes } from "@/actions/dish/dishGETALL";
-import { Category, Tag } from "@prisma/client";
 import { NextResponse } from "next/server";
 
 // POST route: Creates a new dish
 export async function POST(req: Request) {
   try {
     const body = await req.json();
-    const { name, description, price, category, tags, vendorId } = body;
+    const { name, description, price, category, tags, vendorId ,images} = body;
 
-    if (!name || !price || !category || !vendorId) {
+    if (!name || !price || !category || !vendorId || !images) {
       return new NextResponse("Name, price, category, and vendor ID are required!", { status: 400 });
     }
 
-    const resp = await createDish({ name, description, price, category, tags, vendorId });
+    const resp = await createDish({ name, description, price, category, tags, vendorId, images });
 
     if (!resp.success) {
       return new NextResponse(resp.error || "Failed to create dish", { status: 500 });
@@ -30,7 +29,6 @@ export async function POST(req: Request) {
 // GET route: Retrieves all dishes with optional filtering
 export async function GET(req: Request) {
   try {
-    const url = new URL(req.url);
 
     const resp = await getAllDishes({});
 

alimento-nextjs/app/layout.tsx

@@ -1,8 +1,6 @@
 import type { Metadata } from "next";
 import "./globals.css";
 import { Providers } from "@/lib/providers";
-import Navbar from "@/components/common/navbar";
-import Footer from "@/components/common/footer";
 
 
 export const metadata: Metadata = {

alimento-nextjs/app/vendor/[vendorId]/components/dishesPage.tsx

@@ -0,0 +1,52 @@
+import React from 'react';
+import { Button } from '@/components/ui/button'; // Import the Shadcn Button component
+import Link from 'next/link';
+import { DishWithImages } from '../page';
+import DishCard from '@/components/vendor/dishCard';
+
+const DishesPage = async ({
+  vendorId,
+  Dishes,
+}: {
+  vendorId: string
+  Dishes: DishWithImages[];
+}) => {
+
+  return (
+    <div className="min-h-screen p-8 flex flex-col gap-10 bg-gray-50">
+      <div className="flex flex-col gap-5 lg:gap-0 md:flex-row justify-between mb-4 p-5 bg-gray-200 items-center rounded-xl">
+        <h1 className="text-4xl font-bold text-center">Your Dishes</h1>
+
+        <Link href={`/vendor/${vendorId}/createDish`} ><Button className="md:ml-auto">Add New Dish</Button></Link>
+      </div>
+
+      <div className="flex justify-center mb-4">
+        <input
+          type="text"
+          placeholder="Search Dishes..."
+          //   value={searchTerm}
+          //   onChange={(e) => setSearchTerm(e.target.value)}
+          className="p-3 border rounded-full border-gray-300 w-full md:w-1/2" // Adjusted width to make it centered
+        />
+      </div>
+
+      <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6">
+        {Dishes.map((Dish, index) => (
+          <DishCard
+            key={index}
+            vendorId={vendorId}
+            DishId={Dish.id}
+            name={Dish.name}
+            price={Dish.price}
+            description={Dish.description}
+            category={Dish.category}
+            tags={Dish.tags}
+            images={Dish.images} 
+          />
+        ))}
+      </div>
+    </div>
+  );
+};
+
+export default DishesPage;