From a35d859c84eeb2b47b31854006a92aaeb4ac19d8 Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Thu, 25 Jun 2020 18:45:01 +0300
Subject: feat: add date subheader to poll

---
 src/components/PollCard/PollCard.tsx | 10 ++++++++++
 1 file changed, 10 insertions(+)

(limited to 'src/components/PollCard/PollCard.tsx')

diff --git a/src/components/PollCard/PollCard.tsx b/src/components/PollCard/PollCard.tsx
index 40f5fd7..7096150 100644
--- a/src/components/PollCard/PollCard.tsx
+++ b/src/components/PollCard/PollCard.tsx
@@ -17,6 +17,14 @@ interface PropTypes {
   navigate: (prefix: string, id: string) => void;
 }
 
+const DATE_FORMAT = {
+  month: 'long',
+  day: 'numeric',
+  year: 'numeric',
+  hour: '2-digit',
+  minute: '2-digit',
+};
+
 const useStyles = makeStyles(theme => ({
   root: {
     maxWidth: theme.spacing(75),
@@ -50,6 +58,7 @@ const PollCard: React.FC<PropTypes> = ({ initialPoll, navigate }) => {
   const [poll, setPoll] = useState<Poll>(initialPoll);
   const classes = useStyles();
   const { author, contents: { left, right }, userChoice } = poll;
+  const date: String = new Date(poll.createdAt).toLocaleString('default', DATE_FORMAT);
 
   const handleNavigate = () => {
     navigate('profile', poll.author._id);
@@ -88,6 +97,7 @@ const PollCard: React.FC<PropTypes> = ({ initialPoll, navigate }) => {
           />
         )}
         title={author.username}
+        subheader={date}
       />
       <div className={classes.imagesBlock}>
         <CardActionArea onDoubleClick={handleLeft}>
-- 
cgit v1.2.3

