- Introduced `PageSeo` component for managing page metadata for social sharing. - Created Open Graph image templates using SVG and static fonts for better visual representation. - Implemented service alert management with functions to check active alerts and format route numbers. - Added utility functions for generating and watching alert validity. - Developed a script to generate Open Graph images dynamically based on page content. - Included tests for service alert functionalities to ensure correctness and reliability.
52 lines
1.7 KiB
TypeScript
52 lines
1.7 KiB
TypeScript
import { PageSeo } from '@/components/pageSeo/pageSeo';
|
|
import styles from '@/modules/contribute/contribute.module.scss';
|
|
import { GooglePlayButton } from '@/components/googlePlayButton';
|
|
import { TelegramCardButton } from '@/components/telegramCardButton';
|
|
import { GithubCardButton } from '@/components/githubCardButton';
|
|
import { Card } from '@/components/card';
|
|
import { Footer } from '@/components/footer';
|
|
import clsx from 'clsx';
|
|
import useLocale from '@/utils/useLocale';
|
|
import { locales } from '@/modules/contribute/locales';
|
|
import { ShareCard } from '@/modules/contribute/shareCard';
|
|
import { Fragment } from 'react';
|
|
import { Header } from '@/modules/contribute/header';
|
|
import { AddCityCard } from '@/modules/contribute/addCityCard/addCityCard';
|
|
|
|
export default function ContributePage() {
|
|
const t = useLocale(locales);
|
|
|
|
return (
|
|
<Fragment>
|
|
<PageSeo page="contribute" />
|
|
<Header />
|
|
<main className={styles.main}>
|
|
<AddCityCard />
|
|
<ShareCard />
|
|
<div className={styles.stores}>
|
|
<Card
|
|
className={clsx(styles.card, styles.reviewCard)}
|
|
title={t('reviewTitle')}
|
|
subtitle={t('reviewDescription')}
|
|
classes={{ content: styles.reviewCardContent }}
|
|
>
|
|
<div className={styles.googlePlayButtonWrapper}>
|
|
<GooglePlayButton
|
|
className={styles.googlePlayButton}
|
|
disableGlass
|
|
/>
|
|
</div>
|
|
</Card>
|
|
<div className={styles.additionalStores}>
|
|
<TelegramCardButton />
|
|
</div>
|
|
<div className={styles.additionalStores}>
|
|
<GithubCardButton />
|
|
</div>
|
|
</div>
|
|
</main>
|
|
<Footer />
|
|
</Fragment>
|
|
);
|
|
}
|