function MainComponent() { const { data: user, loading } = useUser(); const [searchQuery, setSearchQuery] = useState(""); const [language, setLanguage] = useState("ru"); // Load language preference on component mount useEffect(()=>{ const savedLanguage = localStorage.getItem("language") || "ru"; setLanguage(savedLanguage); }, []); // Handle language change const changeLanguage = (lang)=>{ setLanguage(lang); localStorage.setItem("language", lang); }; // Translations const translations = { ru: { search: "Поиск услуг...", login: "Войти", bodyguard: "Телохранитель", bodyguardDesc: "Профессиональная защита", driver: "Водитель", driverDesc: "Безопасные поездки", sos: "SOS", sosDesc: "Экстренная помощь", stories: "Истории", team: "Команда Securix", about: "О нас", protection: "Ваша защита", recommendations: "Важные рекомендации" }, kz: { search: "Қызметтерді іздеу...", login: "Кіру", bodyguard: "Қорғаушы", bodyguardDesc: "Кәсіби қорғау", driver: "Жүргізуші", driverDesc: "Қауіпсіз сапарлар", sos: "SOS", sosDesc: "Жедел көмек", stories: "Тарихтар", team: "Securix командасы", about: "Біз туралы", protection: "Сіздің қорғанысыңыз", recommendations: "Маңызды ұсыныстар" } }; const t = translations[language]; const services = [ { id: 1, title: t.bodyguard, description: t.bodyguardDesc, icon: /*#__PURE__*/ React.createElement("i", { className: "fa-solid fa-shield text-white text-2xl", __source: { fileName: "", lineNumber: 59, columnNumber: 13 }, __self: this }), link: `/bodyguard?lang=${language}`, bgColor: "bg-gradient-to-br from-[#FFB74B] to-[#FFA000]" }, { id: 2, title: t.driver, description: t.driverDesc, icon: /*#__PURE__*/ React.createElement("i", { className: "fa-solid fa-car text-white text-2xl", __source: { fileName: "", lineNumber: 67, columnNumber: 13 }, __self: this }), link: `/driver?lang=${language}`, bgColor: "bg-gradient-to-br from-[#FFB74B] to-[#FFA000]" }, { id: 3, title: t.sos, description: t.sosDesc, icon: /*#__PURE__*/ React.createElement("i", { className: "fa-solid fa-bell text-white text-2xl", __source: { fileName: "", lineNumber: 75, columnNumber: 13 }, __self: this }), link: `/sos?lang=${language}`, bgColor: "bg-gradient-to-br from-red-600 to-red-700" } ]; const stories = [ { id: 1, title: t.team, subtitle: t.about, bgColor: "bg-gradient-to-br from-blue-900 via-green-700 to-green-600", link: `/about?lang=${language}` }, { id: 2, title: t.protection, bgColor: "bg-gradient-to-br from-green-600 to-green-700", link: `/protection?lang=${language}` }, { id: 3, title: t.recommendations, bgColor: "bg-gradient-to-br from-purple-600 to-purple-700", link: `/safety-tips?lang=${language}` } ]; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#121212] text-white", __source: { fileName: "", lineNumber: 104, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "fixed top-0 left-0 right-0 bg-[#1A1A1A] shadow-lg z-50", __source: { fileName: "", lineNumber: 106, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center px-6 py-4", __source: { fileName: "", lineNumber: 107, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 108, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "https://ucarecdn.com/6f7a2398-7f38-433b-a238-6fb7ac2ab4ba/-/format/auto/", alt: "Securix Logo", className: "w-8 h-8 object-contain", __source: { fileName: "", lineNumber: 109, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-3", __source: { fileName: "", lineNumber: 116, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex gap-2", __source: { fileName: "", lineNumber: 117, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>changeLanguage("kz"), className: `text-2xl transition-opacity ${language === "kz" ? "ring-2 ring-[#FFB74B] rounded-lg opacity-100 px-1" : "opacity-60 hover:opacity-100"}`, __source: { fileName: "", lineNumber: 118, columnNumber: 15 }, __self: this }, "🇰🇿"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>changeLanguage("ru"), className: `text-2xl transition-opacity ${language === "ru" ? "ring-2 ring-[#FFB74B] rounded-lg opacity-100 px-1" : "opacity-60 hover:opacity-100"}`, __source: { fileName: "", lineNumber: 128, columnNumber: 15 }, __self: this }, "🇷🇺")), loading ? /*#__PURE__*/ React.createElement("div", { className: "w-8 h-8 bg-gray-700 animate-pulse rounded-full", __source: { fileName: "", lineNumber: 141, columnNumber: 15 }, __self: this }) : user ? /*#__PURE__*/ React.createElement("a", { href: `/profile?lang=${language}`, className: "flex items-center", __source: { fileName: "", lineNumber: 143, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-8 h-8 rounded-full bg-[#FFB74B] overflow-hidden", __source: { fileName: "", lineNumber: 147, columnNumber: 17 }, __self: this }, user.image ? /*#__PURE__*/ React.createElement("img", { src: user.image, alt: "Profile", className: "w-full h-full object-cover", __source: { fileName: "", lineNumber: 149, columnNumber: 21 }, __self: this }) : /*#__PURE__*/ React.createElement("div", { className: "w-full h-full flex items-center justify-center text-black font-medium", __source: { fileName: "", lineNumber: 155, columnNumber: 21 }, __self: this }, user.name ? user.name[0].toUpperCase() : "U"))) : /*#__PURE__*/ React.createElement("a", { href: `/account/signin?callbackUrl=${encodeURIComponent(window.location.pathname + window.location.search)}`, className: "text-white font-medium flex items-center", __source: { fileName: "", lineNumber: 162, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa-solid fa-user-circle text-xl mr-2", __source: { fileName: "", lineNumber: 166, columnNumber: 17 }, __self: this }), t.login))), /*#__PURE__*/ React.createElement("div", { className: "px-6 pb-6", __source: { fileName: "", lineNumber: 174, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 175, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", placeholder: t.search, value: searchQuery, onChange: (e)=>setSearchQuery(e.target.value), className: "w-full bg-[#2A2A2A] text-white rounded-full py-3 px-5 pl-11 focus:outline-none focus:ring-2 focus:ring-[#FFB74B] placeholder-gray-400", __source: { fileName: "", lineNumber: 176, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("i", { className: "fa-solid fa-search absolute left-4 top-1/2 transform -translate-y-1/2 text-gray-400", __source: { fileName: "", lineNumber: 183, columnNumber: 13 }, __self: this })))), /*#__PURE__*/ React.createElement("main", { className: "pt-40 pb-24", __source: { fileName: "", lineNumber: 188, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "px-6", __source: { fileName: "", lineNumber: 190, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col space-y-4", __source: { fileName: "", lineNumber: 191, columnNumber: 11 }, __self: this }, services.map((service)=>/*#__PURE__*/ React.createElement("a", { href: service.link, key: service.id, className: "relative flex flex-row bg-[#1A1A1A] rounded-xl overflow-hidden transform transition-all duration-300 hover:scale-[1.02] hover:shadow-xl", __source: { fileName: "", lineNumber: 193, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `w-20 h-20 ${service.bgColor} flex items-center justify-center shrink-0`, __source: { fileName: "", lineNumber: 198, columnNumber: 17 }, __self: this }, service.icon), /*#__PURE__*/ React.createElement("div", { className: "flex-1 px-5 flex flex-col justify-center min-h-[80px]", __source: { fileName: "", lineNumber: 203, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-medium text-white", __source: { fileName: "", lineNumber: 204, columnNumber: 19 }, __self: this }, service.title), /*#__PURE__*/ React.createElement("p", { className: "text-sm text-gray-400 mt-1", __source: { fileName: "", lineNumber: 207, columnNumber: 19 }, __self: this }, service.description)), /*#__PURE__*/ React.createElement("div", { className: "flex items-center pr-5", __source: { fileName: "", lineNumber: 211, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa-solid fa-chevron-right text-gray-400", __source: { fileName: "", lineNumber: 212, columnNumber: 19 }, __self: this }))))), /*#__PURE__*/ React.createElement("div", { className: "mt-12", __source: { fileName: "", lineNumber: 219, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-medium mb-6 text-white", __source: { fileName: "", lineNumber: 220, columnNumber: 13 }, __self: this }, t.stories), /*#__PURE__*/ React.createElement("div", { className: "flex overflow-x-auto space-x-4 pb-5 hide-scrollbar", __source: { fileName: "", lineNumber: 221, columnNumber: 13 }, __self: this }, stories.map((story)=>/*#__PURE__*/ React.createElement("div", { key: story.id, className: "flex-none w-[280px]", __source: { fileName: "", lineNumber: 223, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: story.link, className: `${story.bgColor} rounded-xl overflow-hidden h-[200px] relative p-6 flex flex-col justify-center block transform transition-all duration-300 hover:scale-[1.02] hover:shadow-xl`, __source: { fileName: "", lineNumber: 224, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-1 flex items-center justify-center", __source: { fileName: "", lineNumber: 228, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-white font-medium text-xl text-center leading-tight", __source: { fileName: "", lineNumber: 229, columnNumber: 23 }, __self: this }, story.title)))))))), /*#__PURE__*/ React.createElement("a", { href: "https://wa.me/77476378185", target: "_blank", rel: "noopener noreferrer", className: "fixed right-6 bottom-24 bg-[#FFB74B] w-14 h-14 rounded-full flex items-center justify-center shadow-lg z-40 transition-transform hover:scale-110", __source: { fileName: "", lineNumber: 241, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa-solid fa-comments text-white text-xl", __source: { fileName: "", lineNumber: 247, columnNumber: 11 }, __self: this }))), /*#__PURE__*/ React.createElement("nav", { className: "fixed bottom-0 w-full bg-[#1A1A1A] border-t border-gray-800", __source: { fileName: "", lineNumber: 252, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-around px-6 py-4", __source: { fileName: "", lineNumber: 253, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "text-[#FFB74B]", __source: { fileName: "", lineNumber: 254, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa-solid fa-house text-2xl", __source: { fileName: "", lineNumber: 255, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("a", { href: `/profile?lang=${language}`, className: "text-gray-400 hover:text-white transition-colors", __source: { fileName: "", lineNumber: 257, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa-solid fa-circle-user text-2xl", __source: { fileName: "", lineNumber: 261, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("a", { href: `/bookings?lang=${language}`, className: "text-gray-400 hover:text-white transition-colors", __source: { fileName: "", lineNumber: 263, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa-solid fa-calendar-check text-2xl", __source: { fileName: "", lineNumber: 267, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("a", { href: `/support?lang=${language}`, className: "text-gray-400 hover:text-white transition-colors", __source: { fileName: "", lineNumber: 269, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa-solid fa-headset text-2xl", __source: { fileName: "", lineNumber: 273, columnNumber: 13 }, __self: this })))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 278, columnNumber: 7 }, __self: this }, ` .hide-scrollbar::-webkit-scrollbar { display: none; } .hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; } `)); }