import { useMemo, useState } from "react";
import { motion } from "framer-motion";
import { Wrench, Users, Sparkles, Disc3, Palette, Zap, Gauge, CarFront, ChevronRight } from "lucide-react";
export default function LSCustomsSite() {
const [activeCategory, setActiveCategory] = useState("Tous");
const team = [
{ role: "Boss Garage", name: "Nom RP", desc: "Gestion générale, accueil clients et validation des builds." },
{ role: "Chef Mécano", name: "Nom RP", desc: "Réglages moteur, performance et optimisation piste / ville." },
{ role: "Carrossier", name: "Nom RP", desc: "Bodykits, peinture complète et finitions showroom." },
{ role: "Spécialiste Custom", name: "Nom RP", desc: "Jantes, néons, xénons et détails premium." },
];
const categories = [
{ icon: Sparkles, title: "Néons", items: ["Bleu glacier", "Rouge racing", "Violet premium", "Vert street"] },
{ icon: Disc3, title: "Jantes", items: ["Sport", "Tuner", "Luxury", "Offroad"] },
{ icon: Gauge, title: "Performance", items: ["Freins", "Moteur", "Transmission", "Turbo"] },
{ icon: CarFront, title: "Carrosserie", items: ["Pare-chocs", "Spoilers", "Capots", "Bas de caisse"] },
{ icon: Palette, title: "Peinture", items: ["Mat", "Métallisée", "Perlée", "Caméléon"] },
{ icon: Zap, title: "Xénon", items: ["Blanc", "Bleu", "Lime", "Rose"] },
];
const cars = [
{
model: "Comet S2",
speed: "280 Km/h",
seats: "2 Places",
weight: "500 Kg",
price: "500 000 $",
category: "Performance",
before: "Version stock, sobre et discrète.",
after: "Version LS Customs, jantes premium, xénon, néons et kit carrosserie.",
},
{
model: "Sultan RS",
speed: "295 Km/h",
seats: "4 Places",
weight: "650 Kg",
price: "430 000 $",
category: "Carrosserie",
before: "Configuration route classique.",
after: "Setup street racing avec turbo, spoiler, peinture perlée et jantes tuner.",
},
{
model: "Banshee 900R",
speed: "305 Km/h",
seats: "2 Places",
weight: "540 Kg",
price: "620 000 $",
category: "Peinture",
before: "Muscle car agressive d’origine.",
after: "Préparation complète performance + look showroom agressif.",
},
];
const filters = ["Tous", ...categories.map((c) => c.title)];
const filteredCategories = useMemo(() => {
if (activeCategory === "Tous") return categories;
return categories.filter((c) => c.title === activeCategory);
}, [activeCategory]);
return (
GTA RP • Garage Premium • Custom Showroom
{[
["Animation d’entrée", "Des blocs qui apparaissent avec fluidité."],
["Cartes interactives", "Hover dynamique pour une vibe premium."],
["Catalogue filtrable", "Navigation simple entre les options."],
["Avant / Après visuel", "Comparaison claire des transformations."],
].map(([title, desc]) => (
))}
Accéder au Discord
);
}
LS CUSTOMS
Le garage référence pour transformer vos véhicules sur votre serveur GTA RP. Présentation du garage, équipe, catalogues de customisation et showroom avant / après pour mettre en valeur vos builds les plus rares.
{[
["+50", "Builds showroom"],
["6", "Catégories custom"],
["24/7", "Accueil RP"],
].map(([value, label]) => (
))}
{value}
{label}
Feature
{title}
{desc}
Présentation
Le garage
Bloc idéal pour intégrer ton lien Discord, tes horaires RP, ton adresse et tes services.
{[
["Showroom", "Découvrez nos véhicules préparés et nos finitions haut de gamme."],
["Atelier Performance", "Boost moteur, transmission, freinage et réglages sur mesure."],
["Zone Custom", "Peinture, néons, xénons, jantes et carrosserie personnalisée."],
].map(([title, desc]) => (
))}
{title}
{desc}
Discord
Communauté LS Customs
Ajoute ici ton lien d’invitation, un résumé du garage et les infos utiles pour les clients RP.
• Commandes / rendez-vous
• Catalogue et annonces
• Recrutement du staff
L’équipe
Les membres du staff
{team.map((member, index) => (
))}
{member.role}
{member.name}
{member.desc}
Catalogues
Options de customisation
{filters.map((filter) => (
))}
{filteredCategories.map((category, index) => {
const Icon = category.icon;
return (
);
})}
{category.title}
{category.items.map((item) => (
{item}
))}
Avant / Après
Véhicules customisés
{cars.map((car, index) => (
))}
Avant
{car.before}
Après
{car.after}
{car.category}
{car.model}
🚙・Model du véhicule : {car.model}
⏲・{car.speed}
👤・{car.seats}
📦・{car.weight}
💵・{car.price}