|
|
import styles from './shareCard.module.scss';
|
|
|
import { Card } from '@/components/card';
|
|
|
import clsx from 'clsx';
|
|
|
import useLocale, { LocalesMap } from '@/utils/useLocale';
|
|
|
import { CursorEffect } from '@/components/cursor';
|
|
|
|
|
|
const locales: LocalesMap = {
|
|
|
ru: {
|
|
|
appName: 'RideBus',
|
|
|
slogan: 'Приложение, которое поможет вам удобно смотреть расписание общественного транспорта',
|
|
|
title: 'Расскажите друзьям',
|
|
|
description:
|
|
|
'Мне очень важно, чтобы мои проекты приносили пользу. Если вы расскажете своим друзьям о своем опыте использования этого приложения и как оно помогло вам, я буду вам очень признателен.',
|
|
|
},
|
|
|
en: {
|
|
|
appName: 'RideBus',
|
|
|
slogan: 'An app that helps you conveniently view public transportation schedules',
|
|
|
title: 'Tell your friends',
|
|
|
description:
|
|
|
'It is very important to me that my projects bring benefits. If you tell your friends about your experience using this application and how it helped you, I will be very grateful to you.',
|
|
|
},
|
|
|
};
|
|
|
|
|
|
export function ShareCard() {
|
|
|
const t = useLocale(locales);
|
|
|
|
|
|
const ShareCard = (
|
|
|
<Card
|
|
|
className={clsx(styles.card)}
|
|
|
title={t('title')}
|
|
|
subtitle={t('description')}
|
|
|
backdropOnText
|
|
|
classes={{ subtitle: styles.description, content: styles.content }}
|
|
|
onClick={() => {
|
|
|
if (navigator.share) {
|
|
|
navigator
|
|
|
.share({
|
|
|
title: t('appName'),
|
|
|
text: t('slogan'),
|
|
|
url: 'https://ridebus.by/',
|
|
|
})
|
|
|
.then(() => {
|
|
|
console.log('Thanks for sharing!');
|
|
|
})
|
|
|
.catch(console.error);
|
|
|
}
|
|
|
}}
|
|
|
>
|
|
|
</Card>
|
|
|
);
|
|
|
if (typeof window !== 'undefined' && (navigator.share as any)) {
|
|
|
return (
|
|
|
<CursorEffect cursorPadding={8} cursorBorderRadius={36}>
|
|
|
{ShareCard}
|
|
|
</CursorEffect>
|
|
|
);
|
|
|
} else {
|
|
|
return ShareCard;
|
|
|
}
|
|
|
} |