import React, { useState } from 'react';
import { Card, CardHeader, CardTitle, CardContent } from '@/components/ui/card';
import { Tabs, TabsList, TabsTrigger, TabsContent } from '@/components/ui/tabs';
import { Map, Navigation } from 'lucide-react';
const TampaAreaMap = () => {
const [selectedArea, setSelectedArea] = useState('wesley-chapel');
const [hoveredArea, setHoveredArea] = useState(null);
const areaData = {
'wesley-chapel': {
nombre: 'Wesley Chapel',
poblacionLatina: '25%',
precioPromedioVivienda: '$425,000',
escuelas: [
'Wesley Chapel High School',
'Wiregrass Ranch High School',
'John Long Middle School'
],
localesLatinos: [
'La Tienda Latina Wesley Chapel',
'Mi Pueblo Food Market',
'Bravo Supermarket'
],
entretenimiento: [
'The Grove Theater',
'Tampa Premium Outlets',
'AdventHealth Center Ice'
],
comunidades: [
'Seven Oaks (Desde $350k)',
'Meadow Pointe (Desde $400k)',
'Chapel Pines (Desde $450k)'
],
coords: {
path: "M280,100 L320,80 L350,100 L320,120 Z",
center: { x: 315, y: 100 }
}
},
'brandon': {
nombre: 'Brandon',
poblacionLatina: '30%',
precioPromedioVivienda: '$380,000',
escuelas: [
'Brandon High School',
'McLane Middle School',
'Yates Elementary'
],
localesLatinos: [
'La Típica Mexicana',
'Brandon Carnicería',
'El Rico Taco'
],
entretenimiento: [
'Brandon Mall',
'AMC The Regency 20',
'Topgolf Brandon'
],
comunidades: [
'Providence Lakes (Desde $300k)',
'Brandon Pointe (Desde $350k)',
'River Hills (Desde $400k)'
],
coords: {
path: "M240,180 L280,160 L310,180 L280,200 Z",
center: { x: 275, y: 180 }
}
},
'riverview': {
nombre: 'Riverview',
poblacionLatina: '28%',
precioPromedioVivienda: '$350,000',
escuelas: [
'Riverview High School',
'Rodgers Middle School',
'Riverview Elementary'
],
localesLatinos: [
'La Placita Mexicana',
'El Rinconcito Latino',
'Las Pupusas de Mi Tierra'
],
entretenimiento: [
'The Barn at Winthrop',
'Riverview 14 GDX',
'Bell Creek Nature Preserve'
],
comunidades: [
'South Fork (Desde $320k)',
'Summerville (Desde $340k)',
'Boyette Creek (Desde $380k)'
],
coords: {
path: "M200,220 L240,200 L270,220 L240,240 Z",
center: { x: 235, y: 220 }
}
},
'san-antonio': {
nombre: 'San Antonio',
poblacionLatina: '20%',
precioPromedioVivienda: '$340,000',
escuelas: [
'Saint Anthony School',
'Pasco Middle School',
'San Antonio Elementary'
],
localesLatinos: [
'El Ranchito Market',
'Taquería San José',
'La Botana Mexicana'
],
entretenimiento: [
'San Antonio City Park',
'Lake Jovita Golf Club',
'Saint Leo University'
],
comunidades: [
'Lake Jovita (Desde $300k)',
'San Antonio Estates (Desde $330k)',
'Hampton Hills (Desde $350k)'
],
coords: {
path: "M260,60 L300,40 L330,60 L300,80 Z",
center: { x: 295, y: 60 }
}
},
'zephyrhills': {
nombre: 'Zephyrhills',
poblacionLatina: '15%',
precioPromedioVivienda: '$280,000',
escuelas: [
'Zephyrhills High School',
'Raymond B. Stewart Middle',
'West Zephyrhills Elementary'
],
localesLatinos: [
'La Perla Market',
'Taquería El Ranchito',
'Mi Tierra Linda'
],
entretenimiento: [
'Skydive City',
'Zephyrhills Brewing Company',
'Main Street Zephyrhills'
],
comunidades: [
'Silver Oaks (Desde $250k)',
'Zephyr Lakes (Desde $270k)',
'The Villages at Zephyrhills (Desde $290k)'
],
coords: {
path: "M320,120 L360,100 L390,120 L360,140 Z",
center: { x: 355, y: 120 }
}
}
};
return (
Guía Interactiva del Área de Tampa
Mapa del Área
{Object.keys(areaData).map((area) => (
{areaData[area].nombre}
))}
{Object.keys(areaData).map((area) => (
{areaData[area].nombre}
Población Latina
{areaData[area].poblacionLatina}
Precio Promedio
{areaData[area].precioPromedioVivienda}
Escuelas Principales
{areaData[area].escuelas.map((escuela, idx) => (
- {escuela}
))}
Locales Latinos
{areaData[area].localesLatinos.map((local, idx) => (
- {local}
))}
Entretenimiento
{areaData[area].entretenimiento.map((lugar, idx) => (
- {lugar}
))}
Comunidades Destacadas
{areaData[area].comunidades.map((comunidad, idx) => (
- {comunidad}
))}
))}
);
};
export default TampaAreaMap;
