13 changed files with 9 additions and 694 deletions

No files matched your search

@@ -107,7 +107,7 @@ export default function OmnichannelMarginPage() {
// Filters
const [search, setSearch] = useState('');
const [channelFilter, setChannelFilter] = useState<'all' | 'shopee' | 'lazada' | 'tiktok'>('all');
const [dateFilter, setDateFilter] = useState<DateFilterState>({ period: 'this_month' });
const [dateFilter, setDateFilter] = useState<DateFilterState>({ period: 'all' });
const [sortBy, setSortBy] = useState('revenue_desc');
const fetchData = async () => {
+1 -1
View File
@@ -295,7 +295,7 @@ export const profitabilityRoute = new Elysia({ prefix: "/profitability" })
.get("/omnichannel", async ({ query }) => {
const search = (query.search || "").trim().toLowerCase();
const channel = (query.channel || "all").trim().toLowerCase();
const dateRange = resolveDateRange(query.period || "this_month", query.startDate, query.endDate);
const dateRange = resolveDateRange(query.period, query.startDate, query.endDate);
// 1. Fetch mapped marketplace products with master variants & BOM
const mpProducts = await prisma.marketplaceProduct.findMany({
@@ -7,11 +7,7 @@ import i18n from '../lib/i18n';
import { useCartStore } from '../store/cartStore';
import { useWishlistStore } from '../store/wishlistStore';
import { useAuthStore } from '../store/authStore';
import { useCookieConsentStore } from '../store/cookieConsentStore';
import { DEFAULT_LOCALE, SUPPORTED_LOCALES } from '../lib/locales';
import CookieBanner from './cookie/CookieBanner';
import CookiePreferencesModal from './cookie/CookiePreferencesModal';
import ScriptManager from './cookie/ScriptManager';
export default function ClientProviders({ children }: { children: ReactNode }) {
useEffect(() => {
@@ -29,17 +25,13 @@ export default function ClientProviders({ children }: { children: ReactNode }) {
void useCartStore.persist.rehydrate()
void useWishlistStore.persist.rehydrate()
void useAuthStore.persist.rehydrate()
void useCookieConsentStore.persist.rehydrate()
}, [])
return (
<>
<ScriptManager />
<ScrollToTop />
{children}
<CartDrawer />
<CookieBanner />
<CookiePreferencesModal />
</>
);
}
-8
View File
@@ -15,7 +15,6 @@ import {
import { useTranslation } from 'react-i18next'
import { resolveLocalized } from '../lib/localization'
import { useLang } from '../hooks/useLang'
import { useCookieConsentStore } from '../store/cookieConsentStore'
interface FooterProps {
categories?: Category[]
@@ -155,13 +154,6 @@ export default function Footer({
</h4>
<div className="site-footer-column-links flex flex-col space-y-2 text-muted-text">
{supportMenu.map((item) => <Link key={item.id} href={item.url} className="ui-footer-link">{translateMenuLabel(item)}</Link>)}
<button
type="button"
onClick={() => useCookieConsentStore.getState().openPreferences()}
className="text-left ui-footer-link hover:underline transition-colors cursor-pointer text-xs"
>
{t('cookie.settings', 'การตั้งค่าคุกกี้')}
</button>
</div>
<div className="pt-4">
<p className="text-[10px] uppercase tracking-widest text-muted-text">
@@ -1,78 +0,0 @@
"use client";
import { useCookieConsentStore } from '../../store/cookieConsentStore';
import { useTranslation } from 'react-i18next';
import { Cookie, Settings2, ShieldCheck } from 'lucide-react';
export default function CookieBanner() {
const { t } = useTranslation();
const { record, isHydrated, acceptAll, rejectAll, openPreferences } = useCookieConsentStore();
// Do not render on server or before rehydration, or if user has already made a choice
if (!isHydrated || record.hasResponded) {
return null;
}
return (
<aside
aria-label={t('cookie.bannerTitle', 'การตั้งค่าคุกกี้และความเป็นส่วนตัว')}
className="fixed bottom-0 inset-x-0 z-50 p-4 sm:p-6 pointer-events-none animate-in fade-in slide-in-from-bottom-6 duration-500"
>
<div className="max-w-5xl mx-auto pointer-events-auto bg-surface-card/95 backdrop-blur-md border border-border-color shadow-2xl rounded-2xl p-5 sm:p-6 text-text-main transition-all">
<div className="flex flex-col md:flex-row items-start md:items-center justify-between gap-5">
{/* Icon & Description */}
<div className="flex items-start gap-3.5 flex-1 pr-0 md:pr-4">
<div className="p-2.5 rounded-xl bg-brand-cool/60 text-brand-primary shrink-0 mt-0.5">
<Cookie className="w-5 h-5" />
</div>
<div className="space-y-1">
<div className="flex items-center gap-2">
<h3 className="font-semibold text-sm sm:text-base text-text-main tracking-wide">
{t('cookie.bannerTitle', 'เราให้ความสำคัญกับความเป็นส่วนตัวของคุณ')}
</h3>
<span className="inline-flex items-center gap-1 text-[11px] font-medium px-2 py-0.5 rounded-full bg-brand-cool/50 text-muted-text">
<ShieldCheck className="w-3 h-3 text-brand-primary" />
PDPA Compliant
</span>
</div>
<p className="text-xs sm:text-sm text-muted-text leading-relaxed">
{t(
'cookie.bannerDesc',
'เราใช้คุกกี้เพื่อเพิ่มประสิทธิภาพ ประสบการณ์ที่ดีในการใช้งานเว็บไซต์ และเพื่อการวิเคราะห์ปรับปรุงบริการ ท่านสามารถเลือกตั้งค่าความยินยอมตามประเภทคุกกี้ได้'
)}
</p>
</div>
</div>
{/* Action Buttons */}
<div className="flex flex-wrap sm:flex-nowrap items-center gap-2.5 w-full md:w-auto shrink-0">
<button
type="button"
onClick={openPreferences}
className="flex-1 sm:flex-none inline-flex items-center justify-center gap-1.5 px-3.5 py-2 text-xs sm:text-sm font-medium rounded-lg text-muted-text hover:text-text-main hover:bg-surface-muted transition-colors border border-transparent"
>
<Settings2 className="w-3.5 h-3.5" />
<span>{t('cookie.btnCustomize', 'ตั้งค่าคุกกี้')}</span>
</button>
<button
type="button"
onClick={rejectAll}
className="flex-1 sm:flex-none px-4 py-2 text-xs sm:text-sm font-medium rounded-lg border border-border-color text-text-main hover:bg-surface-muted hover:border-text-main/20 transition-all text-center"
>
{t('cookie.btnRejectAll', 'ปฏิเสธทั้งหมด')}
</button>
<button
type="button"
onClick={acceptAll}
className="w-full sm:w-auto px-5 py-2 text-xs sm:text-sm font-semibold rounded-lg bg-brand-primary text-white hover:bg-brand-primary-hover shadow-sm hover:shadow transition-all text-center tracking-wide"
>
{t('cookie.btnAcceptAll', 'ยอมรับทั้งหมด')}
</button>
</div>
</div>
</div>
</aside>
);
}
@@ -1,225 +0,0 @@
"use client";
import { useState, useEffect } from 'react';
import { useCookieConsentStore, type CookiePreferences } from '../../store/cookieConsentStore';
import { useTranslation } from 'react-i18next';
import { X, ShieldCheck, BarChart3, Target, Lock, Check } from 'lucide-react';
export default function CookiePreferencesModal() {
const { t } = useTranslation();
const {
record,
isPreferencesOpen,
closePreferences,
savePreferences,
acceptAll,
rejectAll,
} = useCookieConsentStore();
// Local state for interactive toggling inside the modal
const [localPrefs, setLocalPrefs] = useState<CookiePreferences>({
necessary: true,
analytics: false,
marketing: false,
});
// Sync local state when modal opens
useEffect(() => {
if (isPreferencesOpen) {
setLocalPrefs({
necessary: true,
analytics: Boolean(record.preferences.analytics),
marketing: Boolean(record.preferences.marketing),
});
}
}, [isPreferencesOpen, record.preferences]);
// Handle ESC key to close
useEffect(() => {
if (!isPreferencesOpen) return;
const handleKeyDown = (e: KeyboardEvent) => {
if (e.key === 'Escape') closePreferences();
};
window.addEventListener('keydown', handleKeyDown);
return () => window.removeEventListener('keydown', handleKeyDown);
}, [isPreferencesOpen, closePreferences]);
if (!isPreferencesOpen) return null;
const handleSave = () => {
savePreferences(localPrefs);
};
return (
<div
role="dialog"
aria-modal="true"
aria-labelledby="cookie-modal-title"
className="fixed inset-0 z-50 flex items-center justify-center p-4 sm:p-6 bg-black/50 backdrop-blur-sm animate-in fade-in duration-200"
>
<div
className="w-full max-w-2xl bg-surface-card rounded-2xl shadow-2xl border border-border-color overflow-hidden flex flex-col max-h-[90vh] animate-in zoom-in-95 duration-200"
onClick={(e) => e.stopPropagation()}
>
{/* Header */}
<div className="flex items-center justify-between px-6 py-4 border-b border-border-color bg-surface-nav-rest">
<div className="flex items-center gap-2.5">
<div className="p-2 rounded-lg bg-brand-cool/70 text-brand-primary">
<ShieldCheck className="w-5 h-5" />
</div>
<div>
<h2 id="cookie-modal-title" className="text-base sm:text-lg font-bold text-text-main">
{t('cookie.prefTitle', 'ศูนย์การตั้งค่าความเป็นส่วนตัว (Cookie Preferences)')}
</h2>
<p className="text-xs text-muted-text">
{t('cookie.prefSubtitle', 'จัดการความยินยอมในการจัดเก็บและใช้งานคุกกี้ตาม พ.ร.บ. คุ้มครองข้อมูลส่วนบุคคล (PDPA)')}
</p>
</div>
</div>
<button
type="button"
onClick={closePreferences}
className="p-2 text-muted-text hover:text-text-main rounded-lg hover:bg-surface-muted transition-colors"
aria-label="Close"
>
<X className="w-5 h-5" />
</button>
</div>
{/* Body / Cookie Categories */}
<div className="p-6 space-y-4 overflow-y-auto divide-y divide-border-color/60">
{/* 1. Necessary Cookies */}
<div className="pt-2 first:pt-0">
<div className="flex items-start justify-between gap-4">
<div className="flex items-start gap-3 flex-1">
<div className="p-2 rounded-md bg-surface-muted text-muted-text mt-0.5">
<Lock className="w-4 h-4" />
</div>
<div>
<div className="flex items-center gap-2">
<h4 className="text-sm font-semibold text-text-main">
{t('cookie.catNecessaryTitle', 'คุกกี้ที่จำเป็นอย่างยิ่ง (Strictly Necessary)')}
</h4>
<span className="text-[10px] font-medium px-2 py-0.5 rounded-full bg-emerald-50 text-emerald-700 border border-emerald-200">
{t('cookie.alwaysActive', 'เปิดใช้งานเสมอ')}
</span>
</div>
<p className="text-xs text-muted-text mt-1 leading-relaxed">
{t(
'cookie.catNecessaryDesc',
'คุกกี้เหล่านี้มีความจำเป็นต่อการทำงานพื้นฐานของเว็บไซต์ เช่น การเข้าสู่ระบบ ความปลอดภัย การจดจำสินค้าในตะกร้า และการตั้งค่าภาษา เว็บไซต์ไม่สามารถทำงานได้อย่างถูกต้องหากไม่มีคุกกี้เหล่านี้'
)}
</p>
</div>
</div>
<div className="relative inline-flex items-center cursor-not-allowed opacity-80 shrink-0">
<input
type="checkbox"
checked={true}
disabled
className="sr-only peer"
/>
<div className="w-11 h-6 bg-brand-primary rounded-full peer-checked:after:translate-x-full after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:rounded-full after:h-5 after:w-5 after:transition-all"></div>
</div>
</div>
</div>
{/* 2. Analytics Cookies */}
<div className="pt-4">
<div className="flex items-start justify-between gap-4">
<div className="flex items-start gap-3 flex-1">
<div className="p-2 rounded-md bg-brand-cool/50 text-brand-primary mt-0.5">
<BarChart3 className="w-4 h-4" />
</div>
<div>
<h4 className="text-sm font-semibold text-text-main">
{t('cookie.catAnalyticsTitle', 'คุกกี้เพื่อการวิเคราะห์และวัดผล (Analytics & Performance)')}
</h4>
<p className="text-xs text-muted-text mt-1 leading-relaxed">
{t(
'cookie.catAnalyticsDesc',
'ช่วยให้เราทราบสถิติการเข้าชม พฤติกรรมหน้าเว็บยอดนิยม และเส้นทางการใช้งานของผู้ใช้ เพื่อนำข้อมูลไปปรับปรุงประสิทธิภาพและบริการ (เช่น Google Analytics 4) ข้อมูลจะถูกจัดเก็บแบบไม่ระบุตัวตนโดยตรง'
)}
</p>
</div>
</div>
<label className="relative inline-flex items-center cursor-pointer shrink-0">
<input
type="checkbox"
checked={localPrefs.analytics}
onChange={(e) =>
setLocalPrefs((prev) => ({ ...prev, analytics: e.target.checked }))
}
className="sr-only peer"
/>
<div className="w-11 h-6 bg-border-color peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-brand-primary"></div>
</label>
</div>
</div>
{/* 3. Marketing Cookies */}
<div className="pt-4">
<div className="flex items-start justify-between gap-4">
<div className="flex items-start gap-3 flex-1">
<div className="p-2 rounded-md bg-brand-cool/50 text-brand-primary mt-0.5">
<Target className="w-4 h-4" />
</div>
<div>
<h4 className="text-sm font-semibold text-text-main">
{t('cookie.catMarketingTitle', 'คุกกี้เพื่อการตลาดและโฆษณา (Marketing & Targeting)')}
</h4>
<p className="text-xs text-muted-text mt-1 leading-relaxed">
{t(
'cookie.catMarketingDesc',
'ใช้เพื่อนำเสนอโปรโมชัน โฆษณา และเนื้อหาที่สอดคล้องกับความสนใจของท่านผ่านแพลตฟอร์มพันธมิตร (เช่น Meta Pixel, TikTok Pixel, Google Ads) รวมถึงวัดประสิทธิผลของแคมเปญ'
)}
</p>
</div>
</div>
<label className="relative inline-flex items-center cursor-pointer shrink-0">
<input
type="checkbox"
checked={localPrefs.marketing}
onChange={(e) =>
setLocalPrefs((prev) => ({ ...prev, marketing: e.target.checked }))
}
className="sr-only peer"
/>
<div className="w-11 h-6 bg-border-color peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-brand-primary"></div>
</label>
</div>
</div>
</div>
{/* Footer / Buttons */}
<div className="flex flex-col-reverse sm:flex-row items-center justify-between gap-3 p-4 sm:p-5 border-t border-border-color bg-surface-nav-rest">
<button
type="button"
onClick={rejectAll}
className="w-full sm:w-auto px-4 py-2 text-xs sm:text-sm font-medium rounded-lg text-muted-text hover:text-text-main hover:bg-surface-muted transition-colors text-center"
>
{t('cookie.btnRejectAll', 'ปฏิเสธทั้งหมด')}
</button>
<div className="flex items-center gap-2.5 w-full sm:w-auto">
<button
type="button"
onClick={handleSave}
className="flex-1 sm:flex-none inline-flex items-center justify-center gap-1.5 px-4 py-2 text-xs sm:text-sm font-medium rounded-lg border border-border-color text-text-main hover:bg-surface-muted hover:border-text-main/20 transition-all text-center"
>
<Check className="w-4 h-4 text-brand-primary" />
<span>{t('cookie.btnSavePreferences', 'บันทึกการตั้งค่า')}</span>
</button>
<button
type="button"
onClick={acceptAll}
className="flex-1 sm:flex-none px-5 py-2 text-xs sm:text-sm font-semibold rounded-lg bg-brand-primary text-white hover:bg-brand-primary-hover shadow-sm transition-all text-center"
>
{t('cookie.btnAcceptAll', 'ยอมรับทั้งหมด')}
</button>
</div>
</div>
</div>
</div>
);
}
@@ -1,170 +0,0 @@
"use client";
import { useEffect, useRef } from 'react';
import { useCookieConsentStore } from '../../store/cookieConsentStore';
declare global {
interface Window {
dataLayer?: any[];
gtag?: (...args: any[]) => void;
fbq?: any;
_fbq?: any;
ttq?: any;
}
}
export default function ScriptManager() {
const { record, isHydrated } = useCookieConsentStore();
const consentInitializedRef = useRef(false);
const gaInjectedRef = useRef(false);
const metaInjectedRef = useRef(false);
const tiktokInjectedRef = useRef(false);
// 1. Initialize Google Consent Mode v2 Defaults
useEffect(() => {
if (typeof window === 'undefined' || consentInitializedRef.current) return;
consentInitializedRef.current = true;
window.dataLayer = window.dataLayer || [];
if (!window.gtag) {
window.gtag = function () {
window.dataLayer?.push(arguments);
};
}
// Default to 'denied' as required by GDPR/PDPA prior to user choice
window.gtag('consent', 'default', {
analytics_storage: 'denied',
ad_storage: 'denied',
ad_user_data: 'denied',
ad_personalization: 'denied',
});
}, []);
// 2. Sync consent updates whenever state changes
useEffect(() => {
if (!isHydrated || typeof window === 'undefined') return;
const { preferences, hasResponded } = record;
if (window.gtag) {
window.gtag('consent', 'update', {
analytics_storage: hasResponded && preferences.analytics ? 'granted' : 'denied',
ad_storage: hasResponded && preferences.marketing ? 'granted' : 'denied',
ad_user_data: hasResponded && preferences.marketing ? 'granted' : 'denied',
ad_personalization: hasResponded && preferences.marketing ? 'granted' : 'denied',
});
}
// Dispatch custom browser event for any other custom tags/scripts
window.dispatchEvent(
new CustomEvent('homaroma:consent-change', {
detail: {
hasResponded,
preferences,
},
})
);
// 3. Inject GA4 dynamically if enabled and configured
const gaId = process.env.NEXT_PUBLIC_GA_MEASUREMENT_ID;
if (gaId && hasResponded && preferences.analytics && !gaInjectedRef.current) {
gaInjectedRef.current = true;
const script = document.createElement('script');
script.src = `https://www.googletagmanager.com/gtag/js?id=${gaId}`;
script.async = true;
document.head.appendChild(script);
window.gtag?.('js', new Date());
window.gtag?.('config', gaId, {
anonymize_ip: true,
});
}
// 4. Inject Meta Pixel dynamically if enabled and configured
const metaPixelId = process.env.NEXT_PUBLIC_META_PIXEL_ID;
if (metaPixelId && hasResponded && preferences.marketing && !metaInjectedRef.current) {
metaInjectedRef.current = true;
(function (f: any, b: any, e: any, v: any, n?: any, t?: any, s?: any) {
if (f.fbq) return;
n = f.fbq = function () {
n.callMethod ? n.callMethod.apply(n, arguments) : n.queue.push(arguments);
};
if (!f._fbq) f._fbq = n;
n.push = n;
n.loaded = true;
n.version = '2.0';
n.queue = [];
t = b.createElement(e);
t.async = true;
t.src = v;
s = b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t, s);
})(window, document, 'script', 'https://connect.facebook.net/en_US/fbevents.js');
window.fbq('init', metaPixelId);
window.fbq('track', 'PageView');
}
// 5. Inject TikTok Pixel dynamically if enabled and configured
const tiktokPixelId = process.env.NEXT_PUBLIC_TIKTOK_PIXEL_ID;
if (tiktokPixelId && hasResponded && preferences.marketing && !tiktokInjectedRef.current) {
tiktokInjectedRef.current = true;
(function (w: any, d: any, t: any) {
w.TiktokAnalyticsObject = t;
const ttq = (w[t] = w[t] || []);
ttq.methods = [
'page',
'track',
'identify',
'instances',
'debug',
'on',
'off',
'once',
'ready',
'alias',
'group',
'enableCookie',
'disableCookie',
];
ttq.setAndDefer = function (t: any, e: any) {
t[e] = function () {
t.push([e].concat(Array.prototype.slice.call(arguments, 0)));
};
};
for (let i = 0; i < ttq.methods.length; i++) {
ttq.setAndDefer(ttq, ttq.methods[i]);
}
ttq.instance = function (t: any) {
const e = ttq._i[t] || [];
for (let n = 0; n < ttq.methods.length; n++) {
ttq.setAndDefer(e, ttq.methods[n]);
}
return e;
};
ttq.load = function (e: any, n: any) {
const i = 'https://analytics.tiktok.com/i18n/pixel/events.js';
ttq._i = ttq._i || {};
ttq._i[e] = [];
ttq._i[e]._u = i;
ttq._t = ttq._t || {};
ttq._t[e] = +new Date();
ttq._o = ttq._o || {};
ttq._o[e] = n || {};
const o = d.createElement('script');
o.type = 'text/javascript';
o.async = true;
o.src = `${i}?sdkid=${e}&lib=${t}`;
const a = d.getElementsByTagName('script')[0];
a.parentNode.insertBefore(o, a);
};
})(window, document, 'ttq');
window.ttq?.load(tiktokPixelId);
window.ttq?.page();
}
}, [record, isHydrated]);
return null;
}
+7 -7
View File
@@ -11,13 +11,13 @@ export type TranslationSchema = typeof thTranslation
const translations: Record<string, TranslationSchema> = {
th: thTranslation,
en: enTranslation as unknown as TranslationSchema,
ja: jaTranslation as unknown as TranslationSchema,
zh: zhTranslation as unknown as TranslationSchema,
vi: viTranslation as unknown as TranslationSchema,
ko: koTranslation as unknown as TranslationSchema,
lo: loTranslation as unknown as TranslationSchema,
it: itTranslation as unknown as TranslationSchema,
en: enTranslation as TranslationSchema,
ja: jaTranslation as TranslationSchema,
zh: zhTranslation as TranslationSchema,
vi: viTranslation as TranslationSchema,
ko: koTranslation as TranslationSchema,
lo: loTranslation as TranslationSchema,
it: itTranslation as TranslationSchema,
}
export function getServerTranslations(lang = 'th'): TranslationSchema {
@@ -216,24 +216,6 @@
"notFound": "Unable to verify order details",
"networkError": "Connection error. Please try again."
}
},
"cookie": {
"settings": "Cookie Preferences",
"bannerTitle": "We value your privacy",
"bannerDesc": "We use cookies to improve your browsing experience, provide personalized content, and analyze our website traffic in accordance with privacy laws. You can choose to accept all cookies or manage your preferences.",
"btnCustomize": "Preferences",
"btnRejectAll": "Reject Non-Essential",
"btnAcceptAll": "Accept All",
"btnSavePreferences": "Save Preferences",
"prefTitle": "Privacy & Cookie Preferences",
"prefSubtitle": "Manage your consent for cookie storage and data processing under privacy regulations (PDPA & GDPR)",
"alwaysActive": "Always Active",
"catNecessaryTitle": "Strictly Necessary Cookies",
"catNecessaryDesc": "These cookies are essential for the website to function properly, enabling basic functions like navigation, cart checkout, and access to secure areas. The website cannot function properly without these cookies.",
"catAnalyticsTitle": "Analytics & Performance Cookies",
"catAnalyticsDesc": "These cookies allow us to count visits and traffic sources so we can measure and improve the performance of our site (e.g., Google Analytics 4). All information is aggregated and anonymous.",
"catMarketingTitle": "Marketing & Targeting Cookies",
"catMarketingDesc": "These cookies may be set through our site by our advertising partners (e.g., Meta Pixel, TikTok Pixel, Google Ads) to build a profile of your interests and show you relevant adverts on other sites."
}
}
@@ -237,24 +237,6 @@
"notFound": "注文情報を確認できませんでした",
"networkError": "接続エラーが発生しました。もう一度お試しください。"
}
},
"cookie": {
"settings": "クッキー設定",
"bannerTitle": "お客様のプライバシーを尊重します",
"bannerDesc": "当ウェブサイトでは、利便性の向上、利用状況の分析、パーソナライズされた広告の提供のためにクッキーを使用しています。同意設定はいつでも変更できます。",
"btnCustomize": "設定",
"btnRejectAll": "必須以外を拒否",
"btnAcceptAll": "すべて同意",
"btnSavePreferences": "設定を保存",
"prefTitle": "プライバシーおよびクッキー設定",
"prefSubtitle": "個人情報保護法(PDPA/GDPR)に基づくクッキーの保存およびデータ利用の同意管理",
"alwaysActive": "常に有効",
"catNecessaryTitle": "必須クッキー (Strictly Necessary)",
"catNecessaryDesc": "ウェブサイトの基本的な機能(ログイン、セキュリティ、カート、言語設定など)に不可欠なクッキーです。このクッキーを無効にすることはできません。",
"catAnalyticsTitle": "分析・パフォーマンスクッキー (Analytics)",
"catAnalyticsDesc": "訪問者数やトラフィックソースを計測し、サイトのパフォーマンスを向上させるためのクッキーです(Google Analyticsなど)。",
"catMarketingTitle": "マーケティング・ターゲティングクッキー (Marketing)",
"catMarketingDesc": "お客様の興味関心に基づいた関連性の高い広告やプロモーションを配信するために使用されます(Meta Pixel、TikTok Pixelなど)。"
}
}
@@ -216,24 +216,6 @@
"notFound": "ไม่สามารถยืนยันข้อมูลคำสั่งซื้อได้",
"networkError": "เกิดข้อผิดพลาดในการเชื่อมต่อ กรุณาลองใหม่อีกครั้ง"
}
},
"cookie": {
"settings": "การตั้งค่าคุกกี้",
"bannerTitle": "เราให้ความสำคัญกับความเป็นส่วนตัวของคุณ",
"bannerDesc": "เราใช้คุกกี้เพื่อเพิ่มประสิทธิภาพ ประสบการณ์ที่ดีในการใช้งานเว็บไซต์ และเพื่อการวิเคราะห์ปรับปรุงบริการ ท่านสามารถเลือกตั้งค่าความยินยอมตามประเภทคุกกี้ได้",
"btnCustomize": "ตั้งค่าคุกกี้",
"btnRejectAll": "ปฏิเสธทั้งหมด",
"btnAcceptAll": "ยอมรับทั้งหมด",
"btnSavePreferences": "บันทึกการตั้งค่า",
"prefTitle": "ศูนย์การตั้งค่าความเป็นส่วนตัว",
"prefSubtitle": "จัดการความยินยอมในการจัดเก็บและใช้งานคุกกี้ตาม พ.ร.บ. คุ้มครองข้อมูลส่วนบุคคล (PDPA)",
"alwaysActive": "เปิดใช้งานเสมอ",
"catNecessaryTitle": "คุกกี้ที่จำเป็นอย่างยิ่ง (Strictly Necessary)",
"catNecessaryDesc": "คุกกี้เหล่านี้มีความจำเป็นต่อการทำงานพื้นฐานของเว็บไซต์ เช่น การเข้าสู่ระบบ ความปลอดภัย การจดจำสินค้าในตะกร้า และการตั้งค่าภาษา เว็บไซต์ไม่สามารถทำงานได้อย่างถูกต้องหากไม่มีคุกกี้เหล่านี้",
"catAnalyticsTitle": "คุกกี้เพื่อการวิเคราะห์และวัดผล (Analytics & Performance)",
"catAnalyticsDesc": "ช่วยให้เราทราบสถิติการเข้าชม พฤติกรรมหน้าเว็บยอดนิยม และเส้นทางการใช้งานของผู้ใช้ เพื่อนำข้อมูลไปปรับปรุงประสิทธิภาพและบริการ (เช่น Google Analytics 4) ข้อมูลจะถูกจัดเก็บแบบไม่ระบุตัวตนโดยตรง",
"catMarketingTitle": "คุกกี้เพื่อการตลาดและโฆษณา (Marketing & Targeting)",
"catMarketingDesc": "ใช้เพื่อนำเสนอโปรโมชัน โฆษณา และเนื้อหาที่สอดคล้องกับความสนใจของท่านผ่านแพลตฟอร์มพันธมิตร (เช่น Meta Pixel, TikTok Pixel, Google Ads) รวมถึงวัดประสิทธิผลของแคมเปญ"
}
}
@@ -237,24 +237,6 @@
"notFound": "无法验证订单信息",
"networkError": "网络连接错误,请稍后重试。"
}
},
"cookie": {
"settings": "Cookie 设置",
"bannerTitle": "我们重视您的隐私",
"bannerDesc": "我们使用 Cookie 来改善您的浏览体验、提供个性化内容以及根据隐私法规分析网站流量。您可以选择接受所有 Cookie 或自定义您的偏好设置。",
"btnCustomize": "偏好设置",
"btnRejectAll": "拒绝非必要",
"btnAcceptAll": "接受全部",
"btnSavePreferences": "保存设置",
"prefTitle": "隐私与 Cookie 偏好中心",
"prefSubtitle": "根据个人数据保护法规 (PDPA/GDPR) 管理 Cookie 存储及数据使用授权",
"alwaysActive": "始终启用",
"catNecessaryTitle": "必要 Cookie (Strictly Necessary)",
"catNecessaryDesc": "这些 Cookie 是网站运行所必需的,用于支持登录、安全性、购物车和语言设置等基本功能。网站无法在缺少此类 Cookie 的情况下正常运行。",
"catAnalyticsTitle": "分析与性能 Cookie (Analytics)",
"catAnalyticsDesc": "帮助我们统计访问量和流量来源,以评估并改善网站性能(例如 Google Analytics 4)。数据为匿名统计。",
"catMarketingTitle": "营销与广告 Cookie (Marketing)",
"catMarketingDesc": "由广告合作伙伴设置(例如 Meta Pixel、TikTok Pixel、Google Ads),用于构建您的兴趣画像并向您推送相关广告。"
}
}
@@ -1,124 +0,0 @@
import { create } from 'zustand';
import { persist } from 'zustand/middleware';
export const CURRENT_CONSENT_VERSION = '1.0';
export interface CookiePreferences {
necessary: boolean;
analytics: boolean;
marketing: boolean;
}
export interface CookieConsentRecord {
hasResponded: boolean;
version: string;
timestamp: string | null;
preferences: CookiePreferences;
}
interface CookieConsentState {
record: CookieConsentRecord;
isPreferencesOpen: boolean;
isHydrated: boolean;
// Actions
setHydrated: (hydrated: boolean) => void;
openPreferences: () => void;
closePreferences: () => void;
acceptAll: () => void;
rejectAll: () => void;
savePreferences: (preferences: Partial<CookiePreferences>) => void;
resetConsent: () => void;
}
const DEFAULT_RECORD: CookieConsentRecord = {
hasResponded: false,
version: CURRENT_CONSENT_VERSION,
timestamp: null,
preferences: {
necessary: true,
analytics: false,
marketing: false,
},
};
export const useCookieConsentStore = create<CookieConsentState>()(
persist(
(set) => ({
record: DEFAULT_RECORD,
isPreferencesOpen: false,
isHydrated: false,
setHydrated: (hydrated: boolean) => set({ isHydrated: hydrated }),
openPreferences: () => set({ isPreferencesOpen: true }),
closePreferences: () => set({ isPreferencesOpen: false }),
acceptAll: () => {
const now = new Date().toISOString();
set({
record: {
hasResponded: true,
version: CURRENT_CONSENT_VERSION,
timestamp: now,
preferences: {
necessary: true,
analytics: true,
marketing: true,
},
},
isPreferencesOpen: false,
});
},
rejectAll: () => {
const now = new Date().toISOString();
set({
record: {
hasResponded: true,
version: CURRENT_CONSENT_VERSION,
timestamp: now,
preferences: {
necessary: true,
analytics: false,
marketing: false,
},
},
isPreferencesOpen: false,
});
},
savePreferences: (userPrefs: Partial<CookiePreferences>) => {
const now = new Date().toISOString();
set((state) => ({
record: {
hasResponded: true,
version: CURRENT_CONSENT_VERSION,
timestamp: now,
preferences: {
necessary: true,
analytics: Boolean(userPrefs.analytics),
marketing: Boolean(userPrefs.marketing),
},
},
isPreferencesOpen: false,
}));
},
resetConsent: () => {
set({
record: DEFAULT_RECORD,
isPreferencesOpen: false,
});
},
}),
{
name: 'homaroma-cookie-consent',
partialize: (state) => ({ record: state.record }),
skipHydration: true,
onRehydrateStorage: () => (state) => {
state?.setHydrated(true);
},
}
)
);