feat: Implement detailed coffee shop profiles with address, phone, website, and image, displayed in an updated drawer component.

src/app/page.tsx

@@ -6,15 +6,105 @@ import Navbar from "~/components/Navbar";
 import Drawer from "~/components/Drawer";
 
 const COFFEE_SHOPS = [
-  { id: 1, name: "Amami Kitchen", description: "Italian espresso & fresh food.", lat: 40.9547, lng: -76.8841 },
+  {
-  { id: 2, name: "Culture Coffee", description: "Specialty brews & matcha.", lat: 40.9660, lng: -76.8820 },
+    id: 1,
-  { id: 3, name: "Bucknell 7th St Cafe", description: "Campus favorite.", lat: 40.9547, lng: -76.8837 },
+    name: "Amami Kitchen",
-  { id: 4, name: "Tastecraft Cafe", description: "Roastery & French macarons.", lat: 40.9635, lng: -76.8885 },
+    description: "A beloved culinary spot offering a blend of high-quality Italian espresso and American coffee bar options, alongside mouthwatering baked goods and paninis.",
-  { id: 5, name: "Paris Bakery", description: "Authentic pastries & coffee.", lat: 40.9645, lng: -76.8845 },
+    lat: 40.9547,
-  { id: 6, name: "CycleUp Coffee", description: "Cycling themed cafe.", lat: 40.9640, lng: -76.8860 },
+    lng: -76.8841,
-  { id: 7, name: "Cornerstone Kitchen", description: "Fresh eats at Miller Center.", lat: 40.9610, lng: -76.8970 },
+    address: "103 S 6th St, Lewisburg, PA 17837",
-  { id: 8, name: "Gram's Eatery", description: "Homestyle breakfast & coffee.", lat: 40.9642, lng: -76.8837 },
+    phone: "(570) 490-7857",
-  { id: 9, name: "DC Coffee", description: "Gourmet coffee & atmosphere.", lat: 40.9650, lng: -76.8825 },
+    website: "https://www.amamiespresso.com",
+    image: "https://images.unsplash.com/photo-1554118811-1e0d58224f24?q=80&w=1000&auto=format&fit=crop"
+  },
+  {
+    id: 2,
+    name: "Culture Coffee",
+    description: "A modern coffee shop focusing on unique brewing methods for specialty coffee and traditional techniques for matcha. Known for its 'Red Velvet Latte' and croissants.",
+    lat: 40.9660,
+    lng: -76.8820,
+    address: "216 St. John St, Lewisburg, PA 17837",
+    phone: "(570) 601-7903",
+    website: "https://www.instagram.com/culturecoffeee_",
+    image: "https://images.unsplash.com/photo-1509042239860-f550ce710b93?q=80&w=1000&auto=format&fit=crop"
+  },
+  {
+    id: 3,
+    name: "Bucknell 7th St Cafe",
+    description: "Bucknell's ultimate on-campus dessert and coffee shop. A cozy spot for students and visitors to enjoy milkshakes, ice cream, and specialty espresso drinks.",
+    lat: 40.9547,
+    lng: -76.8837,
+    address: "420 S 7th St, Lewisburg, PA 17837",
+    phone: "(570) 577-1240",
+    website: "https://www.bucknell.edu/life-bucknell/dining-services/places-eat",
+    image: "https://images.unsplash.com/photo-1559925393-8be0ec4767c8?q=80&w=1000&auto=format&fit=crop"
+  },
+  {
+    id: 4,
+    name: "Tastecraft Cafe",
+    description: "Downtown cafe known for its in-house roasted coffee and over 20 flavors of French macarons. A perfect spot to relax with a fresh brew and a sweet treat.",
+    lat: 40.9635,
+    lng: -76.8885,
+    address: "512 Market St, Lewisburg, PA 17837",
+    phone: "(570) 768-5340",
+    website: "https://www.tastecraftcafe.com",
+    image: "https://images.unsplash.com/photo-1556742049-0cfed4f7a07d?q=80&w=1000&auto=format&fit=crop"
+  },
+  {
+    id: 5,
+    name: "Paris Bakery",
+    description: "Authentic French bakery offering legendary croissants, pain au chocolat, and artisanal breads. Experience a taste of France in the heart of Lewisburg.",
+    lat: 40.9645,
+    lng: -76.8845,
+    address: "335 Market St, Lewisburg, PA 17837",
+    phone: "(570) 884-2138",
+    website: "https://parisbakery.cafe",
+    image: "https://images.unsplash.com/photo-1509440159596-0249088772ff?q=80&w=1000&auto=format&fit=crop"
+  },
+  {
+    id: 6,
+    name: "CycleUp Coffee",
+    description: "A unique bike shop cafe serving as a community hub. Enjoy coffee, light bites, and bike services in a cozy, cycling-themed atmosphere.",
+    lat: 40.9640,
+    lng: -76.8860,
+    address: "429 Market St, Lewisburg, PA 17837",
+    phone: "(570) 413-1705",
+    website: "https://www.cycleupcafe.com",
+    image: "https://images.unsplash.com/photo-1521017432531-fbd92d768814?q=80&w=1000&auto=format&fit=crop"
+  },
+  {
+    id: 7,
+    name: "Cornerstone Kitchen",
+    description: "Located in the Miller Center, offering fresh, healthy, and delicious cafe food. A place to connect over real food and a shared table.",
+    lat: 40.9610,
+    lng: -76.8970,
+    address: "120 Hardwood Dr, Lewisburg, PA 17837",
+    phone: "(570) 556-4191",
+    website: "https://millercenterlewisburg.com/cornerstone-kitchen",
+    image: "https://images.unsplash.com/photo-1498837167922-ddd27525d352?q=80&w=1000&auto=format&fit=crop"
+  },
+  {
+    id: 8,
+    name: "Gram's Eatery",
+    description: "A local favorite for homestyle breakfast and brunch. Known for generous portions, locally sourced ingredients, and a welcoming atmosphere.",
+    lat: 40.9642,
+    lng: -76.8837,
+    address: "21 N 3rd St, Lewisburg, PA 17837",
+    phone: "(570) 522-0230",
+    website: "https://www.facebook.com/gramseaterylewisburg",
+    image: "https://images.unsplash.com/photo-1533777857889-4be7c70b33f7?q=80&w=1000&auto=format&fit=crop"
+  },
+  {
+    id: 9,
+    name: "DC Coffee",
+    description: "Charming cafe offering gourmet coffee, lattes, and a full breakfast and lunch menu. A cozy spot with a friendly, hometown feel.",
+    lat: 40.9650,
+    lng: -76.8825,
+    address: "235 Market St, Lewisburg, PA 17837",
+    phone: "(570) 966-6400",
+    website: "https://dccoffeeandteacafe.com",
+    image: "https://images.unsplash.com/photo-1497935586351-b67a49e012bf?q=80&w=1000&auto=format&fit=crop"
+  },
 ];
 
 export default function Home() {

src/components/Drawer.tsx

@@ -1,4 +1,4 @@
-import { X, MapPin, Coffee } from "lucide-react";
+import { X, MapPin, Coffee, Phone, Globe, ExternalLink } from "lucide-react";
 
 interface CoffeeShop {
     id: number;
@@ -6,6 +6,10 @@ interface CoffeeShop {
     description: string;
     lat: number;
     lng: number;
+    address: string;
+    phone: string;
+    website: string;
+    image: string;
 }
 
 interface DrawerProps {
@@ -21,46 +25,54 @@ export default function Drawer({ shop, onClose }: DrawerProps) {
         >
             {shop && (
                 <div className="flex flex-col h-full text-white">
-                    {/* Header Image Placeholder */}
+                    {/* Header Image */}
-                    <div className="h-64 bg-gradient-to-br from-[#8B4513] to-black relative flex items-center justify-center">
+                    <div className="h-64 relative">
-                        <Coffee className="w-24 h-24 text-white/20" />
+                        <img
+                            src={shop.image}
+                            alt={shop.name}
+                            className="w-full h-full object-cover"
+                        />
+                        <div className="absolute inset-0 bg-gradient-to-t from-black/90 to-transparent" />
                         <button
                             onClick={onClose}
-                            className="absolute top-4 right-4 p-2 bg-black/50 rounded-full hover:bg-black/70 transition-colors"
+                            className="absolute top-4 right-4 p-2 bg-black/50 rounded-full hover:bg-black/70 transition-colors backdrop-blur-md"
                         >
                             <X className="w-6 h-6 text-white" />
                         </button>
                     </div>
 
                     {/* Content */}
-                    <div className="p-8 flex-1 overflow-y-auto">
+                    <div className="p-8 flex-1 overflow-y-auto -mt-12 relative z-10">
-                        <h2 className="text-4xl font-bold font-serif mb-2 text-[#D2691E]">{shop.name}</h2>
+                        <h2 className="text-4xl font-bold font-serif mb-4 text-[#D2691E] leading-tight">{shop.name}</h2>
-                        <div className="flex items-center gap-2 text-gray-400 mb-6 font-sans text-sm">
+
-                            <MapPin className="w-4 h-4" />
+                        <div className="space-y-4 mb-8">
-                            <span>{shop.lat.toFixed(4)}, {shop.lng.toFixed(4)}</span>
+                            <div className="flex items-start gap-3 text-gray-300 font-sans text-sm">
+                                <MapPin className="w-5 h-5 text-[#8B4513] flex-shrink-0 mt-0.5" />
+                                <span>{shop.address}</span>
+                            </div>
+                            {shop.phone && (
+                                <div className="flex items-center gap-3 text-gray-300 font-sans text-sm">
+                                    <Phone className="w-5 h-5 text-[#8B4513] flex-shrink-0" />
+                                    <a href={`tel:${shop.phone}`} className="hover:text-white transition-colors">{shop.phone}</a>
+                                </div>
+                            )}
+                            {shop.website && (
+                                <div className="flex items-center gap-3 text-gray-300 font-sans text-sm">
+                                    <Globe className="w-5 h-5 text-[#8B4513] flex-shrink-0" />
+                                    <a href={shop.website} target="_blank" rel="noopener noreferrer" className="hover:text-white transition-colors flex items-center gap-1">
+                                        Visit Website <ExternalLink className="w-3 h-3" />
+                                    </a>
+                                </div>
+                            )}
                         </div>
 
                         <div className="space-y-6">
                             <div>
-                                <h3 className="text-lg font-semibold mb-2 text-gray-200">About</h3>
+                                <h3 className="text-lg font-semibold mb-2 text-gray-200 font-serif">About</h3>
                                 <p className="text-gray-300 leading-relaxed font-serif text-lg">
                                     {shop.description}
                                 </p>
                             </div>
-
-                            {/* Placeholder for more details */}
-                            <div className="pt-6 border-t border-white/10">
-                                <div className="grid grid-cols-2 gap-4">
-                                    <div className="bg-white/5 p-4 rounded-lg text-center">
-                                        <span className="block text-2xl mb-1">☕</span>
-                                        <span className="text-xs text-gray-400 uppercase tracking-wider">Coffee</span>
-                                    </div>
-                                    <div className="bg-white/5 p-4 rounded-lg text-center">
-                                        <span className="block text-2xl mb-1">🥐</span>
-                                        <span className="text-xs text-gray-400 uppercase tracking-wider">Pastries</span>
-                                    </div>
-                                </div>
-                            </div>
                         </div>
                     </div>
 
@@ -70,7 +82,7 @@ export default function Drawer({ shop, onClose }: DrawerProps) {
                             href={`https://www.google.com/maps/search/?api=1&query=${shop.lat},${shop.lng}`}
                             target="_blank"
                             rel="noopener noreferrer"
-                            className="flex items-center justify-center w-full py-4 bg-[#8B4513] hover:bg-[#A0522D] text-white font-bold rounded-xl transition-colors"
+                            className="flex items-center justify-center w-full py-4 bg-[#8B4513] hover:bg-[#A0522D] text-white font-bold rounded-xl transition-colors shadow-lg"
                         >
                             Get Directions
                         </a>

src/components/Map.tsx

@@ -13,6 +13,10 @@ interface CoffeeShop {
     description: string;
     lat: number;
     lng: number;
+    address: string;
+    phone: string;
+    website: string;
+    image: string;
 }
 
 interface MapProps {

src/components/MapLoader.tsx

@@ -13,6 +13,10 @@ interface CoffeeShop {
     description: string;
     lat: number;
     lng: number;
+    address: string;
+    phone: string;
+    website: string;
+    image: string;
 }
 
 interface MapLoaderProps {