52 lines
1.4 KiB
JavaScript
52 lines
1.4 KiB
JavaScript
|
import { format } from "date-fns";
|
||
|
|
import {
|
||
|
|
Badge,
|
||
|
|
Box, HStack, Pressable,
|
||
|
|
Spacer, Text
|
||
|
|
} from "native-base";
|
||
|
|
import PropTypes from 'prop-types';
|
||
|
|
|
||
|
|
import React from 'react';
|
||
|
|
|
||
|
|
export const CommentCard = ({ date, comment }) => {
|
||
|
|
const dateFormated = format(new Date(date), "dd LL yyyy")
|
||
|
|
return (
|
||
|
|
<Pressable
|
||
|
|
rounded="8"
|
||
|
|
overflow="hidden"
|
||
|
|
borderWidth="1"
|
||
|
|
borderColor="coolGray.300"
|
||
|
|
maxW="96"
|
||
|
|
shadow="3"
|
||
|
|
bg="coolGray.100"
|
||
|
|
p="5"
|
||
|
|
marginTop="4"
|
||
|
|
>
|
||
|
|
<Box>
|
||
|
|
<HStack alignItems="center">
|
||
|
|
<Badge colorScheme="darkBlue" _text={{
|
||
|
|
color: "white"
|
||
|
|
}} variant="solid" rounded="4">
|
||
|
|
Comunicado
|
||
|
|
</Badge>
|
||
|
|
<Spacer />
|
||
|
|
<Text fontSize={10} color="coolGray.800">
|
||
|
|
{dateFormated}
|
||
|
|
</Text>
|
||
|
|
</HStack>
|
||
|
|
<Text color="coolGray.800" mt="3" fontWeight="medium" fontSize="xl">
|
||
|
|
Administrador de Comunidad
|
||
|
|
</Text>
|
||
|
|
<Text mt="2" fontSize="sm" color="coolGray.700">
|
||
|
|
{comment}
|
||
|
|
</Text>
|
||
|
|
</Box>
|
||
|
|
</Pressable>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
CommentCard.propTypes = {
|
||
|
|
date: PropTypes.string.isRequired,
|
||
|
|
comment: PropTypes.string.isRequired,
|
||
|
|
}
|