40 lines
1.6 KiB
TypeScript
40 lines
1.6 KiB
TypeScript
import { Box, Flex, Text } from "@mantine/core";
|
|
import { IconChevronLeft, IconChevronRight } from "@tabler/icons-react";
|
|
import classes from './RequestsButton.module.css'
|
|
|
|
interface RequestsButtonProps {
|
|
count: number;
|
|
onClick?: () => void;
|
|
mode: 'all' | 'requests';
|
|
}
|
|
|
|
export function RequestsButton(props : RequestsButtonProps) {
|
|
return (
|
|
<>
|
|
{props.mode == 'all' && <>
|
|
<Box pl={'sm'} pb={'xs'} pr={'xs'} onClick={props.onClick} className={classes.btn}>
|
|
<Flex align={'center'} justify={'space-between'} onClick={() => {}}>
|
|
<Text fz={12} c={'blue'} fw={'bold'} ta={'center'}>
|
|
Requests +{props.count}
|
|
</Text>
|
|
<Flex align={'center'} gap={'sm'}>
|
|
<IconChevronRight size={14} stroke={1.5} />
|
|
</Flex>
|
|
</Flex>
|
|
</Box>
|
|
</>}
|
|
{props.mode == 'requests' && <>
|
|
<Box pl={'sm'} pb={'xs'} pr={'xs'} onClick={props.onClick} className={classes.btn}>
|
|
<Flex align={'center'} justify={'space-between'} onClick={() => {}}>
|
|
<Text fz={12} c={'red'} fw={'bold'} ta={'center'}>
|
|
Back to all chats
|
|
</Text>
|
|
<Flex align={'center'} gap={'sm'}>
|
|
<IconChevronLeft size={14} stroke={1.5} />
|
|
</Flex>
|
|
</Flex>
|
|
</Box>
|
|
</>}
|
|
</>
|
|
)
|
|
} |