Skip to content

Instantly share code, notes, and snippets.

@matmalkowski
Created March 28, 2019 13:54
Show Gist options
  • Save matmalkowski/458ff6ebe43ed6bee9649a6198d38d47 to your computer and use it in GitHub Desktop.
Save matmalkowski/458ff6ebe43ed6bee9649a6198d38d47 to your computer and use it in GitHub Desktop.
import * as React from 'react'
import { format, differenceInYears, differenceInMonths } from 'date-fns'
import { H5 } from '../../elements'
interface Props {
start: Date
end: Date
current?: boolean
}
const Duration: React.FC<Props> = props => {
const { start, end, current } = props
const years = differenceInYears(end, start)
const months = differenceInMonths(end, start) % 12
return (
<H5>
{format(start, 'MMMM YYYY')} - {current ? 'now ' : format(end, 'MMMM YYYY ')}
<i>
( {years > 0 && `${years} yr`} {months > 0 && `${months} mo`} )
</i>
</H5>
)
}
export default Duration
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment