53 lines
1.2 KiB
TypeScript
53 lines
1.2 KiB
TypeScript
import { ArrowRight } from "@tamagui/lucide-icons";
|
|
import { Href, Link } from "expo-router";
|
|
import { GetProps, Paragraph, XStack, styled } from "tamagui";
|
|
|
|
import { Text } from "@/ui/components/typography";
|
|
|
|
const SectionContainer = styled(XStack, {
|
|
alignItems: "center",
|
|
justifyContent: "space-between",
|
|
paddingVertical: "$2",
|
|
width: "100%",
|
|
});
|
|
|
|
type ScreenSectionProps = GetProps<typeof SectionContainer> & {
|
|
title: string;
|
|
forwardLink?: Href;
|
|
};
|
|
|
|
type ScreenSectionLinkProps = {
|
|
href: Href;
|
|
};
|
|
|
|
const ScreenSectionLink = ({ href }: ScreenSectionLinkProps) => (
|
|
<Link asChild href={href} push>
|
|
<XStack alignItems="center" gap="2">
|
|
<Paragraph color="$accent5" fontWeight={500}>
|
|
Voir tout
|
|
</Paragraph>
|
|
<ArrowRight color="$accent5" />
|
|
</XStack>
|
|
</Link>
|
|
);
|
|
|
|
export const ScreenSection = (props: ScreenSectionProps) => {
|
|
const { title, forwardLink, ...rest } = props;
|
|
|
|
return (
|
|
<SectionContainer {...rest}>
|
|
<Text
|
|
color="$color"
|
|
flexShrink={1}
|
|
fontSize="$6"
|
|
fontWeight="bold"
|
|
marginRight="$2"
|
|
numberOfLines={1}
|
|
>
|
|
{title}
|
|
</Text>
|
|
{forwardLink && <ScreenSectionLink href={forwardLink} />}
|
|
</SectionContainer>
|
|
);
|
|
};
|