diff --git a/index.html b/index.html index 86fa92c..b4cf8c0 100644 --- a/index.html +++ b/index.html @@ -3,7 +3,7 @@ - Vite + React + Wine types app
diff --git a/public/vite.svg b/public/vite.svg deleted file mode 100644 index e7b8dfb..0000000 --- a/public/vite.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/components/WineButtons.jsx b/src/components/WineButtons.jsx index 9b67db0..10f6f8c 100644 --- a/src/components/WineButtons.jsx +++ b/src/components/WineButtons.jsx @@ -5,22 +5,28 @@ function WineButtons({ wineData }) { const [selectedCategory, setSelectedCategory] = useState(null); const [selectedSubCategory, setSelectedSubCategory] = useState(null); const [selectedFlavor, setSelectedFlavor] = useState(null); + const [selectedSubFlavor, setSelectedSubFlavor] = useState(null); const handleCategoryClick = (category) => { - console.log('Categoría seleccionada:', category); - console.log('Datos disponibles:', wineData[category]); setSelectedCategory(selectedCategory === category ? null : category); setSelectedSubCategory(null); setSelectedFlavor(null); + setSelectedSubFlavor(null); }; const handleSubCategoryClick = (subCategory) => { setSelectedSubCategory(selectedSubCategory === subCategory ? null : subCategory); setSelectedFlavor(null); + setSelectedSubFlavor(null); }; const handleFlavorClick = (flavor) => { setSelectedFlavor(selectedFlavor === flavor ? null : flavor); + setSelectedSubFlavor(null); + }; + + const handleSubFlavorClick = (subFlavor) => { + setSelectedSubFlavor(selectedSubFlavor === subFlavor ? null : subFlavor); }; const renderWineList = (wines) => { @@ -28,8 +34,8 @@ function WineButtons({ wineData }) {
{wines.map((wine) => (
+ border-[#D4B996] hover:border-[#722F37] transition-all duration-300 + text-center text-[#722F37] text-sm hover:-translate-y-0.5"> {wine}
))} @@ -37,44 +43,56 @@ function WineButtons({ wineData }) { ); }; + const renderSubFlavors = (data) => { + return Object.entries(data).map(([subFlavor, content]) => { + if (subFlavor === 'vinos') return null; + return ( +
+ + {selectedSubFlavor === subFlavor && content.vinos && renderWineList(content.vinos)} +
+ ); + }); + }; + const wineGroups = { left: ['Rose', 'Red'], - right: ['Sparkling', 'White', 'Fortified'], + right: ['Sparkling Wine', 'White', 'Fortified Wine'], }; return (
- {/* Grupo izquierdo */} + {/* Grupos izquierdo y derecho sin cambios */}
{wineGroups.left.map((category) => ( ))}
- {/* Contenido central */} + {/* Contenido central actualizado */}
{selectedCategory && (
- {console.log('Renderizando categoría:', selectedCategory)} - {console.log('Datos a renderizar:', wineData[selectedCategory])} - {wineData[selectedCategory] && Object.keys(wineData[selectedCategory]).map((subCategory) => ( + {Object.entries(wineData["Types of Wine"][selectedCategory]).map(([subCategory, subData]) => (
- {selectedSubCategory === subCategory && - wineData[selectedCategory][subCategory]?.vinos && ( + {selectedSubCategory === subCategory && (
- {console.log('Vinos a mostrar:', wineData[selectedCategory][subCategory].vinos)} - {renderWineList(wineData[selectedCategory][subCategory].vinos)} + {subData.vinos && renderWineList(subData.vinos)} + {Object.entries(subData).map(([flavor, flavorData]) => { + if (flavor === 'vinos') return null; + return ( +
+ + {selectedFlavor === flavor && ( +
+ {flavorData.vinos && renderWineList(flavorData.vinos)} + {renderSubFlavors(flavorData)} +
+ )} +
+ ); + })}
)}
@@ -105,17 +143,11 @@ function WineButtons({ wineData }) { diff --git a/src/vinos.jsx b/src/vinos.jsx index ad9916b..fe32889 100644 --- a/src/vinos.jsx +++ b/src/vinos.jsx @@ -1,112 +1,389 @@ export const vinos = { - "Rose": { - "Semi-Sweet Rose": { - vinos: [ - "Blush Wine", - "Garnacha Rosado", - "Rose d'Anjou", - "Pink Zinfandel", - "White Zinfandel", - "White Merlot" - ] - }, - "Dry Rose": { - "Savory / Meaty": { + "Types of Wine": { + "Rose": { + "Semi-Sweet Rose": { vinos: [ - "Bandol Rose", - "Cabernet Franc Rose", - "Syrah Rose", - "Cabernet Sauvignon Rose", - "Loire Rose" + "Blush Wine", + "Garnacha Rosado", + "Rosé d'Anjou", + "Vin Gris", + "White Zinfandel", + "White Merlot" ] }, - "Fruity / Floral": { - vinos: [ - "Pinot Noir Rose", - "Provence Rose", - "Sangiovese Rose", - "Tempranillo Rose" - ] + "Dry Rose": { + "Savory / Meaty": { + vinos: [ + "Bandol Rosé", + "Cabernet Franc Rosé", + "Syrah Rosé", + "Cabernet Sauvignon", + "Loire Rosé" + ] + }, + "Fruity / Floral": { + vinos: [ + "Pinot Noir Rosé", + "Grenache Rosé", + "Provence Rosé", + "Sangiovese Rosé", + "Tempranillo Rosé" + ] + } } - } - }, - "Red": { - "Fruity Red": { - vinos: [ - "Blaufränkisch", - "Zweigelt", - "Gamay" - ] - }, - "Sweet Red": { - vinos: [ - "Recioto Della Valpolicella", - "Occhio di Pernice", - "Some Bulk Wines" - ] - }, - "Savory Red": { - vinos: [ - "Ribera del Duero", - "Rioja Gran Reserva", - "Cahors", - "Rios", - "Aglianico", - "Piedmont" - ] - } - }, - "Sparkling Wine": { - "White Sparkling": { - vinos: [ - "Blanc de Noirs", - "Vintage Champagne", - "Prosecco" - ] }, - "Rose Sparkling": { - vinos: [ - "Rose Champagne", - "Sparkling Wine" - ] + "Sparkling Wine": { + "White Sparkling": { + "Semi-Sweet Floral": { + vinos: [ + "Champagne (extra dry)", + "Prosecco", + "Moscato", + "Vouvray (mousseux)" + ] + }, + "Dry Creamy Rich": { + vinos: [ + "Blanc de Noirs", + "Vintage Champagne", + "Blanc de Blancs", + "Vintage Franciacorta", + "Vintage Sparkling Wine" + ] + }, + "Sweet Apricots Rich": { + vinos: [ + "Moscato d'Asti", + "Spumante", + "Demi-Sec", + "Doux", + "Asti Spumante" + ] + }, + "Dry Light Citrus": { + vinos: [ + "Extra-Brut", + "Prosecco (Extra-Brut)", + "Blanc de Blancs", + "Sec", + "Cava", + "Brut Nature", + "Non-Vintage Champagne (Brut)" + ] + } + }, + "Rose Sparkling": { + "Semi-Sweet Strawberry Orange": { + vinos: [ + "Moscato Rosé", + "Brachetto d'Acqui Rosé", + "Cava Rosé" + ] + }, + "Dry Strawberry Light": { + vinos: [ + "Rosé Champagne", + "Rosé Sparkling Wine", + "Cava Brut Rosé" + ] + } + }, + "Red Sparkling": { + "Semi-Sweet Raspberry Cherry": { + vinos: [ + "Lambrusco", + "Brachetto d'Acqui" + ] + }, + "Sweet Blueberry Cherry": { + vinos: [ + "Lambrusco", + "Brachetto d'Acqui" + ] + }, + "Dry Raspberry Blueberry": { + vinos: [ + "Sparkling Shiraz", + "Lambrusco", + "Spumante", + "Cava Rosé" + ] + } + } }, - "Red Sparkling": { - vinos: [ - "Brut", - "Extra-Brut" - ] - } - }, - "White": { - "Dry White": { - vinos: [ - "Sauvignon Blanc", - "Vermentino", - "Grüner Veltliner", - "Cortese", - "Aligoté" - ] + "White": { + "Dry White": { + "Light Herbal Grassy": { + vinos: [ + "Sauvignon Blanc", + "Touraine", + "Sancerre", + "Fumé Blanc", + "Vinho Verde", + "Muscat (dry)" + ] + }, + "Rich Creamy Nutty": { + vinos: [ + "Chardonnay", + "Meursault", + "Montrachet", + "Soave", + "White Bordeaux", + "Sémillères", + "Viognier" + ] + }, + "Medium Perfume Floral": { + vinos: [ + "Torrontés", + "Moschofilero", + "Viognier", + "Gewürztraminer", + "Chenin Blanc", + "Malvasia" + ] + }, + "Light Citrus Lemon": { + vinos: [ + "Albariño", + "Grüner Veltliner", + "Unoaked Chardonnay", + "Vermentino", + "Pinot Grigio", + "Chablis" + ] + }, + "Light Grapefruit Floral": { + vinos: [ + "Verdejo", + "Vermentino", + "Moschofilero", + "Pinot Blanc", + "Greco di Tufo" + ] + } + }, + "Sweet White": { + "Off-Dry Apricots Peaches": { + vinos: [ + "Riesling (semi-sweet)", + "Gewürztraminer (semi-sweet)", + "Moscato", + "Riesling (Kabinett)" + ] + }, + "Rich Tropical Honey": { + vinos: [ + "Moscato (d'Asti)", + "Tokaji (3-6 Puttonyos)", + "Sauternes", + "Riesling (Auslese)", + "Riesling (Beerenauslese)", + "Malvasia", + "Chenin Blanc (Moelleux)" + ] + } + } }, - "Sweet White": { - vinos: [ - "Moscato", - "Riesling" - ] - } - }, - "Fortified Wine": { - "Nutty Fortified": { - vinos: [ - "Madeira", - "Marsala" - ] + "Red": { + "Fruity Red": { + "Tart Cherry Cranberry": { + vinos: [ + "Blaufränkisch", + "Zweigelt", + "Gamay" + ] + }, + "Strawberry Cherry": { + vinos: [ + "Counoise", + "Carignan", + "Grenache", + "Zinfandel", + "Primitivo" + ] + }, + "Blueberry Blackberry": { + "Round": { + vinos: [ + "Nero d'Avola", + "Merlot", + "Malbec", + "Syrah/Viognier", + "Touriga Nacional", + "Merlot", + "Lacrima di Morro" + ] + }, + "High Tannin": { + vinos: [ + "Mourvèdre", + "Petite Sirah", + "Petit Verdot", + "Touriga Nacional" + ] + } + }, + "Black Cherry Raspberry": { + "Round": { + vinos: [ + "Amarone", + "Merlot", + "Châteauneuf du Pape", + "Valpolicella" + ] + }, + "Spicy": { + vinos: [ + "Sangiovese", + "Cabernet", + "Priorat" + ] + }, + "High Tannin": { + vinos: [ + "Super Tuscan", + "Cabernet Sauvignon", + "Priorat", + "Tempranillo" + ] + } + } + }, + "Sweet Red": { + vinos: [ + "Recioto Della Valpolicella", + "Occhio di Pernice", + "Some Bulk Wines" + ] + }, + "Savory Red": { + "Smoke Tobacco Leather": { + "Rounds": { + vinos: [ + "Ribera del Duero", + "Graves", + "Pessac-Léognan", + "Carmènére", + "Priorat", + "Rioja Reserva & Gran Reserva" + ] + }, + "High Tannin": { + vinos: [ + "Taurasi", + "Cahors", + "Rioja", + "Aglianico" + ] + } + }, + "Truffle Forest": { + "Rounds": { + vinos: [ + "Bourgogne", + "Dolcetto", + "Côte Chalonnaise", + "Savoie" + ] + }, + "Spicy/Juicy": { + vinos: [ + "Barolo", + "Barbaresco" + ] + } + }, + "Black Pepper Gravel": { + "Rounds": { + vinos: [ + "Pomerol", + "St. Émilion", + "Fronsac", + "Côtes de Castillon", + "Médoc", + "St. Joseph", + "St. Julien" + ] + }, + "High Tannin": { + vinos: [ + "Haut-Médoc", + "Cahors", + "St. Estèphe", + "Pauillac", + "St. Julien" + ] + }, + "Spicy/Juicy": { + vinos: [ + "Bourgeuil", + "Barbera d'Alba", + "Barolo", + "Montepulciano", + "Chinon" + ] + } + }, + "Clay Cured Meats": { + "Round": { + vinos: [ + "Vacqueyras", + "Vinsobres", + "Madiran" + ] + }, + "High Tannin": { + vinos: [ + "Barbaresco", + "Barolo", + "Nebbiolo", + "Montefalco Rosso" + ] + } + } + } }, - "Red Fortified": { - vinos: [ - "Vintage Port", - "Ruby Port", - "LBV Port" - ] + "Fortified Wine": { + "Nutty Fortified": { + "Sweet": { + vinos: [ + "Moscatel-Moriles", + "Port Tawny", + "Vin Santo", + "Cream Sherry", + "Sherry (dry)", + "Moscatel de Setúbal" + ] + }, + "Dry (Semi-Sweet)": { + vinos: [ + "Oloroso Sherry", + "Fino Sherry", + "Madeira", + "Marsala", + "Amontillado Sherry" + ] + } + }, + "White Fortified": { + vinos: [ + "Muscat de Frontignan", + "Muscat de Beaumes de Venise", + "Muscat de Rivesaltes" + ] + }, + "Red Fortified": { + vinos: [ + "Vintage Port", + "Ruby Port", + "LBV Port", + "Banyuls", + "Maury", + "Rasteau" + ] + } } } };