Files
BarevClub/apps/landing/app/[locale]/live/page.tsx
T

123 lines
5.1 KiB
TypeScript

import '../../variants.css';
import '../../home.css';
import { createT, formatAmd, isLocale, LOCALES, type Locale } from '@barev/i18n';
import type { Viewport } from 'next';
import { notFound } from 'next/navigation';
import { BotLink, BotLinkProvider } from '../../../components/client';
import { AudienceSwitch, ClubPlans, HomeFooter, homeMetadata } from '../../../components/home';
import { ClubJsonLd } from '../../../components/seo';
import { VariantHeader } from '../../../components/variant';
import { getCatalog } from '../../../lib/data';
export const revalidate = 300;
export const dynamicParams = false;
export function generateStaticParams() {
return LOCALES.map((locale) => ({ locale }));
}
export function generateMetadata({ params }: { params: Promise<{ locale: string }> }) {
return homeMetadata(params, '/live');
}
export const viewport: Viewport = { themeColor: '#4A1028' };
/**
* Прайс по подписке: клининг можно заказать сразу, трансфер — со скидкой Elite, документы — «от N ֏»,
* остальное пока «скоро».
*/
const ITEMS = [
{ key: 'cleaning', value: 'order' },
{ key: 'repair', value: 'soon' },
{ key: 'transfer', value: 'pct' },
{ key: 'tours', value: 'soon' },
{ key: 'docs', value: 'from' },
{ key: 'lang', value: 'soon' },
{ key: 'career', value: 'soon' },
{ key: 'partners', value: 'soon' },
] as const;
/** Версия главной «Уже живу в Армении»: что даёт подписка — скидки по направлениям и тарифы */
export default async function Live({ params }: { params: Promise<{ locale: string }> }) {
const { locale: raw } = await params;
if (!isLocale(raw)) notFound();
const locale: Locale = raw;
const t = createT(locale);
const catalog = await getCatalog();
return (
<BotLinkProvider locale={locale} bot={catalog.botUsername}>
<div className="v2">
<ClubJsonLd locale={locale} path="/live" bot={catalog.botUsername} plusPrice={catalog.barevPlus.monthlyPrice} offer={catalog.offer} />
<div className="v-wrap">
<VariantHeader locale={locale} path="/live" className="vh--dark" logoColor="#F6C3D3" />
<AudienceSwitch locale={locale} current="live" />
<section className="v2-hero">
<div className="v2-word" aria-hidden="true">
Barev
</div>
<ul className="v2-hello" aria-hidden="true">
{t('landing.v2.hello')
.split('\n')
.map((h) => (
<li key={h}>{h}</li>
))}
</ul>
<div className="v2-hero__text">
<h1 className="v2-title">{t('landing.live.title')}</h1>
<div className="h-hero__side">
<p className="v2-sub">{t('landing.live.sub')}</p>
<div className="h-actions">
<BotLink className="bc-btn h-cta">{t('landing.live.cta')}</BotLink>
<a href="#plans" className="bc-btn h-cta-ghost">
{t('landing.live.ctaPlans')}
</a>
</div>
</div>
</div>
</section>
<section id="discounts" className="h-price" aria-labelledby="discounts-title">
<div className="h-section-head">
<h2 id="discounts-title">{t('landing.live.listTitle')}</h2>
<p>{t('landing.live.listNote', { pct: catalog.offer.plusMaxPct })}</p>
</div>
<ul className="h-price__list">
{ITEMS.map((it) => (
<li key={it.key} className="h-price__row" data-kind={it.value}>
<b className="h-price__name">{t(`landing.live.${it.key}`)}</b>
<span className="h-price__dots" aria-hidden="true" />
{it.value === 'order' ? (
<a href={`/${locale}/clean`} className="bc-btn h-price__order">
{t('landing.live.orderNow')}
</a>
) : (
<span className="h-price__value">
{it.value === 'pct'
? t('landing.live.upTo', { pct: catalog.offer.eliteMaxPct })
: it.value === 'from'
? t('landing.live.docsFrom', { price: formatAmd(locale, catalog.offer.docsFrom) })
: t('common.soon')}
</span>
)}
<small className="h-price__hint">{t(`landing.live.${it.key}Hint`)}</small>
</li>
))}
</ul>
</section>
<ClubPlans locale={locale} plusPrice={catalog.barevPlus.monthlyPrice} offer={catalog.offer} />
<section className="v2-final">
<div>
<h2>{t('landing.live.finalTitle')}</h2>
<p>{t('landing.live.finalText')}</p>
</div>
<BotLink className="bc-btn v2-final__cta">{t('landing.live.cta')}</BotLink>
</section>
<HomeFooter locale={locale} />
</div>
</div>
</BotLinkProvider>
);
}