update project to use date range

This commit is contained in:
Ryan Polley
2020-11-09 15:59:24 -06:00
parent d4816291b4
commit 81ad16ae8a
2 changed files with 43 additions and 22 deletions

View File

@ -52,8 +52,16 @@ const ProjectModal = () => {
<Input <Input
type="date" type="date"
label={t('shared.forms.date')} label={t('shared.forms.startDate')}
{...getFieldProps(formik, schema, 'date')} placeholder="6th August 208"
{...getFieldProps(formik, schema, 'startDate')}
/>
<Input
type="date"
label={t('shared.forms.endDate')}
placeholder="6th August 208"
{...getFieldProps(formik, schema, 'endDate')}
/> />
<Input <Input

View File

@ -1,30 +1,43 @@
import React, { memo, useContext } from 'react'; import React, { memo, useContext } from 'react';
import { useTranslation } from 'react-i18next';
import ReactMarkdown from 'react-markdown'; import ReactMarkdown from 'react-markdown';
import PageContext from '../../../contexts/PageContext'; import PageContext from '../../../contexts/PageContext';
import { formatDate, safetyCheck } from '../../../utils'; import { formatDateRange, safetyCheck } from '../../../utils';
const ProjectItem = ({ item, language }) => ( const ProjectItem = ({ item, language }) => {
<div> const { t } = useTranslation();
<div className="flex justify-between items-center"> return (
<div className="flex flex-col text-left mr-2"> <div>
<h6 className="font-semibold">{item.title}</h6> <div className="flex justify-between items-center">
{item.link && ( <div className="flex flex-col text-left mr-2">
<a href={item.link} className="text-xs"> <h6 className="font-semibold">{item.title}</h6>
{item.link} {item.link && (
</a> <a href={item.link} className="text-xs">
)} {item.link}
</a>
)}
</div>
{(item.startDate || item.date) && (
<h6 className="text-xs font-medium text-right">
(
{formatDateRange(
{
startDate: item.startDate? item.startDate : item.date,
endDate: item.endDate,
language,
},
t,
)}
)
</h6>
)}
</div> </div>
{item.date && ( {item.summary && (
<h6 className="text-xs font-medium text-right"> <ReactMarkdown className="markdown mt-2 text-sm" source={item.summary} />
{formatDate({ date: item.date, language })}
</h6>
)} )}
</div> </div>
{item.summary && ( );
<ReactMarkdown className="markdown mt-2 text-sm" source={item.summary} /> };
)}
</div>
);
const ProjectsA = () => { const ProjectsA = () => {
const { data, heading: Heading } = useContext(PageContext); const { data, heading: Heading } = useContext(PageContext);