aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authoreug-vs <eug-vs@keemail.me>2020-10-09 20:51:00 +0300
committereug-vs <eug-vs@keemail.me>2020-10-09 20:51:00 +0300
commit7605be6c77393ed98e179c27f3bc3915afb95f5c (patch)
treee18fb51338a2efbfd521456e4d77184e43fc891f
parentfcaddcd6ad8607d05279acdb87675de6180ac1cb (diff)
downloadwhich-ui-7605be6c77393ed98e179c27f3bc3915afb95f5c.tar.gz
feat: create DateString component
-rw-r--r--src/components/DateString/DateString.tsx22
-rw-r--r--src/components/PollCard/PollCard.tsx12
2 files changed, 24 insertions, 10 deletions
diff --git a/src/components/DateString/DateString.tsx b/src/components/DateString/DateString.tsx
new file mode 100644
index 0000000..e31b52e
--- /dev/null
+++ b/src/components/DateString/DateString.tsx
@@ -0,0 +1,22 @@
+import React from 'react';
+
+interface PropTypes {
+ value: Date | string;
+}
+
+const DATE_FORMAT = {
+ month: 'long',
+ day: 'numeric',
+ year: 'numeric',
+ hour: '2-digit',
+ minute: '2-digit'
+};
+
+const DateString: React.FC<PropTypes> = ({ value }) => {
+ const date = new Date(value);
+ const formatted = date.toLocaleString('default', DATE_FORMAT);
+
+ return <>{formatted}</>;
+};
+
+export default DateString;
diff --git a/src/components/PollCard/PollCard.tsx b/src/components/PollCard/PollCard.tsx
index a06bad8..7094d88 100644
--- a/src/components/PollCard/PollCard.tsx
+++ b/src/components/PollCard/PollCard.tsx
@@ -6,6 +6,7 @@ import { useSnackbar } from 'notistack';
import PercentageBar from './PercentageBar';
import UserStrip from '../UserStrip/UserStrip';
+import DateString from '../DateString/DateString';
import BackgroundImage from '../Image/BackgroundImage';
import { post } from '../../requests';
import { useAuth } from '../../hooks/useAuth';
@@ -15,14 +16,6 @@ interface PropTypes {
setPoll: (poll: Poll) => void;
}
-const DATE_FORMAT = {
- month: 'long',
- day: 'numeric',
- year: 'numeric',
- hour: '2-digit',
- minute: '2-digit'
-};
-
const useStyles = makeStyles(theme => ({
media: {
display: 'flex',
@@ -55,7 +48,6 @@ const PollCard: React.FC<PropTypes> = React.memo(({ poll, setPoll }) => {
const { author, contents: { left, right }, vote } = poll;
const { enqueueSnackbar } = useSnackbar();
const { isAuthenticated } = useAuth();
- const date: string = new Date(poll.createdAt).toLocaleString('default', DATE_FORMAT);
const handleVote = (which: Which) => () => {
if (!isAuthenticated) {
@@ -97,7 +89,7 @@ const PollCard: React.FC<PropTypes> = React.memo(({ poll, setPoll }) => {
return (
<Card elevation={3}>
- <UserStrip user={author} info={date} />
+ <UserStrip user={author} info={<DateString value={poll.createdAt} />} />
{poll.description && (
<Typography className={classes.description}>
{poll.description}