first commit

components/WholesalePricing.tsx

@@ -0,0 +1,167 @@
+'use client'
+
+import { useState, useEffect } from 'react'
+import { Badge } from '@/components/ui/badge'
+import { Card, CardContent } from '@/components/ui/card'
+import { Gift, ShoppingCart, Users, TrendingDown } from 'lucide-react'
+import { useSession } from 'next-auth/react'
+
+interface WholesalePricingProps {
+  productId: string
+  originalPrice: number
+  quantity: number
+}
+
+interface PricingData {
+  originalPrice: number
+  finalPrice: number
+  discount: number
+  discountPercentage: number
+  isWholesalePrice: boolean
+}
+
+export default function WholesalePricing({ 
+  productId, 
+  originalPrice, 
+  quantity 
+}: WholesalePricingProps) {
+  const { data: session } = useSession()
+  const [pricingData, setPricingData] = useState<PricingData | null>(null)
+  const [isWholesaler, setIsWholesaler] = useState(false)
+  const [loading, setLoading] = useState(false)
+
+  useEffect(() => {
+    const fetchPricing = async () => {
+      if (!session?.user) return
+
+      setLoading(true)
+      try {
+        const response = await fetch('/api/pricing/wholesale', {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+          },
+          body: JSON.stringify({
+            productId,
+            quantity
+          }),
+        })
+
+        const data = await response.json()
+
+        if (data.success) {
+          setPricingData(data.pricing)
+          setIsWholesaler(data.isWholesaler)
+        }
+      } catch (error) {
+        console.error('Failed to fetch pricing:', error)
+      } finally {
+        setLoading(false)
+      }
+    }
+
+    if (session?.user && productId && quantity > 0) {
+      fetchPricing()
+    }
+  }, [session, productId, quantity])
+
+  // Don't show if user is not logged in
+  if (!session?.user) {
+    return null
+  }
+
+  // Show wholesaler benefits if user is wholesaler
+  if (isWholesaler) {
+    return (
+      <div className="space-y-3">
+        <Badge className="bg-blue-100 text-blue-800 px-3 py-1">
+          <Users className="h-4 w-4 mr-1" />
+          Wholesaler Account
+        </Badge>
+
+        {pricingData && quantity >= 10 && (
+          <Card className="border-green-200 bg-green-50">
+            <CardContent className="p-4">
+              <div className="flex items-center justify-between">
+                <div className="flex items-center space-x-2">
+                  <Gift className="h-5 w-5 text-green-600" />
+                  <span className="font-medium text-green-800">
+                    Wholesale Discount Applied!
+                  </span>
+                </div>
+                <Badge className="bg-green-100 text-green-800">
+                  25% OFF
+                </Badge>
+              </div>
+              <div className="mt-2 space-y-1">
+                <div className="flex justify-between text-sm">
+                  <span>Original Price:</span>
+                  <span className="line-through text-gray-500">
+                    ₹{pricingData.originalPrice.toLocaleString()}
+                  </span>
+                </div>
+                <div className="flex justify-between text-sm font-medium">
+                  <span>Wholesale Price:</span>
+                  <span className="text-green-600">
+                    ₹{pricingData.finalPrice.toLocaleString()}
+                  </span>
+                </div>
+                <div className="flex justify-between text-sm">
+                  <span>You Save:</span>
+                  <span className="text-green-600">
+                    ₹{pricingData.discount.toLocaleString()}
+                  </span>
+                </div>
+              </div>
+            </CardContent>
+          </Card>
+        )}
+
+        {quantity < 10 && (
+          <Card className="border-yellow-200 bg-yellow-50">
+            <CardContent className="p-4">
+              <div className="flex items-center space-x-2">
+                <ShoppingCart className="h-5 w-5 text-yellow-600" />
+                <span className="font-medium text-yellow-800">
+                  Add {10 - quantity} more items for 25% wholesale discount
+                </span>
+              </div>
+              <p className="text-sm text-yellow-700 mt-1">
+                Minimum 10 items required for bulk pricing
+              </p>
+            </CardContent>
+          </Card>
+        )}
+      </div>
+    )
+  }
+
+  // Show wholesaler invitation if user is not a wholesaler
+  return (
+    <Card className="border-blue-200 bg-blue-50">
+      <CardContent className="p-4">
+        <div className="flex items-center space-x-2 mb-2">
+          <TrendingDown className="h-5 w-5 text-blue-600" />
+          <span className="font-medium text-blue-800">
+            Want Wholesale Prices?
+          </span>
+        </div>
+        <p className="text-sm text-blue-700 mb-3">
+          Join our wholesaler program and get 25% off on bulk orders!
+        </p>
+        <div className="space-y-1 text-xs text-blue-600">
+          <div>• 25% discount on orders of 10+ items</div>
+          <div>• Dedicated account manager</div>
+          <div>• Priority support</div>
+          <div>• Flexible payment terms</div>
+        </div>
+        <a 
+          href="/wholesaler" 
+          className="inline-block mt-3 text-sm font-medium text-blue-600 hover:text-blue-800"
+        >
+          Register as Wholesaler →
+        </a>
+      </CardContent>
+    </Card>
+  )
+}