boxons/components/useCases/timer/view/FinishContent.tsx

48 lines
1.0 KiB
TypeScript

import React from 'react';
import { Text, View } from '@/components/shared/Themed';
import styled from '@emotion/native';
import { useRouter } from 'expo-router';
import Button from '@/components/shared/Button';
import { HorizontalSpacer, VerticalSpacer } from '@/components/shared/Spacers';
import { i18n } from '@/app/i18n/i18n';
type FinishContentProps = {
handleStart: () => void;
};
const t = i18n.scoped('timer.finishContent');
export default function FinishContent({
handleStart
}: FinishContentProps) {
const router = useRouter();
return (
<>
<Time>{t('finish')}</Time>
<VerticalSpacer heightUnits={8} />
<Row>
<Button label={t('restart')} onPress={handleStart} />
<HorizontalSpacer widthUnits={3} />
<Button label={i18n.t('back')} onPress={() => router.push('/')} />
</Row>
</>
);
}
const Row = styled(View)(() => ({
flexDirection: 'row',
backgroundColor: 'black'
}));
const Time = styled(Text)(({ theme }) => ({
fontSize: 70,
fontWeight: 'bold',
color: theme.colors.white
}));