75 lines
4.3 KiB
TypeScript
75 lines
4.3 KiB
TypeScript
'use client'
|
||
|
||
import { useMarketplacePreferences } from '@/components/MarketplaceShell'
|
||
import PricingClient from './PricingClient'
|
||
|
||
const copy = {
|
||
en: {
|
||
kicker: 'Pricing',
|
||
title: 'One platform, every fleet size.',
|
||
body: 'Start free for 14 days, then choose the plan that grows with your business. Switch plans or cancel at any time.',
|
||
faq: 'Frequently asked',
|
||
items: [
|
||
['Can I change plans later?', 'Yes. Upgrade or downgrade at any time — changes take effect on your next billing cycle.'],
|
||
['What counts as a vehicle?', 'Any vehicle record added to your fleet dashboard, active or not.'],
|
||
['Is there a setup fee?', 'No setup fee, ever. You only pay the monthly or annual subscription.'],
|
||
['How does the marketplace listing work?', 'All paid plans include a public marketplace listing on RentalDriveGo. Renters can discover your fleet and are redirected to your branded booking site.'],
|
||
],
|
||
},
|
||
fr: {
|
||
kicker: 'Tarifs',
|
||
title: 'Une seule plateforme pour toutes les tailles de flotte.',
|
||
body: 'Commencez gratuitement pendant 14 jours, puis choisissez la formule qui accompagne votre activité. Vous pouvez changer de formule ou annuler à tout moment.',
|
||
faq: 'Questions fréquentes',
|
||
items: [
|
||
['Puis-je changer de formule plus tard ?', 'Oui. Vous pouvez passer à une formule supérieure ou inférieure à tout moment. Les changements prennent effet au cycle de facturation suivant.'],
|
||
['Qu’est-ce qui compte comme véhicule ?', 'Tout véhicule ajouté à votre tableau de bord de flotte, qu’il soit actif ou non.'],
|
||
['Y a-t-il des frais d’installation ?', 'Aucun frais d’installation. Vous payez uniquement l’abonnement mensuel ou annuel.'],
|
||
['Comment fonctionne la visibilité marketplace ?', 'Toutes les formules payantes incluent une présence publique sur RentalDriveGo. Les clients découvrent votre flotte puis sont redirigés vers votre site de réservation.'],
|
||
],
|
||
},
|
||
ar: {
|
||
kicker: 'الأسعار',
|
||
title: 'منصة واحدة لكل أحجام الأساطيل.',
|
||
body: 'ابدأ مجاناً لمدة 14 يوماً، ثم اختر الخطة التي تناسب نمو نشاطك. يمكنك تغيير الخطة أو إلغاءها في أي وقت.',
|
||
faq: 'الأسئلة الشائعة',
|
||
items: [
|
||
['هل يمكنني تغيير الخطة لاحقاً؟', 'نعم. يمكنك الترقية أو التخفيض في أي وقت — وتدخل التغييرات حيز التنفيذ في دورة الفوترة التالية.'],
|
||
['ما الذي يُحتسب كسيارة؟', 'أي سجل سيارة تتم إضافته إلى لوحة الأسطول سواء كان نشطاً أم لا.'],
|
||
['هل توجد رسوم إعداد؟', 'لا توجد أي رسوم إعداد. أنت تدفع فقط قيمة الاشتراك الشهري أو السنوي.'],
|
||
['كيف تعمل قائمة السوق؟', 'كل الخطط المدفوعة تشمل الظهور العام على RentalDriveGo. يكتشف المستأجرون أسطولك ثم يتم تحويلهم إلى موقع الحجز الخاص بك.'],
|
||
],
|
||
},
|
||
} as const
|
||
|
||
export default function PricingPageContent() {
|
||
const { language } = useMarketplacePreferences()
|
||
const dict = copy[language]
|
||
|
||
return (
|
||
<main className="min-h-screen bg-[radial-gradient(circle_at_top,#fef3c7,transparent_30%),linear-gradient(180deg,#fafaf9,white)]">
|
||
<div className="shell py-20">
|
||
<div className="mx-auto max-w-2xl text-center">
|
||
<p className="text-sm font-semibold uppercase tracking-[0.24em] text-amber-700">{dict.kicker}</p>
|
||
<h1 className="mt-4 text-5xl font-black tracking-tight text-stone-900">{dict.title}</h1>
|
||
<p className="mt-5 text-lg leading-8 text-stone-600">{dict.body}</p>
|
||
</div>
|
||
|
||
<div className="mt-16">
|
||
<PricingClient />
|
||
</div>
|
||
|
||
<div className="mx-auto mt-24 max-w-3xl divide-y divide-stone-200">
|
||
<h2 className="pb-8 text-2xl font-bold text-stone-900">{dict.faq}</h2>
|
||
{dict.items.map(([q, a]) => (
|
||
<div key={q} className="py-6">
|
||
<p className="font-semibold text-stone-900">{q}</p>
|
||
<p className="mt-2 text-sm leading-6 text-stone-600">{a}</p>
|
||
</div>
|
||
))}
|
||
</div>
|
||
</div>
|
||
</main>
|
||
)
|
||
}
|