Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 | 1x 2x 2x 2x 1x | import React from 'react'
import * as PropTypes from 'prop-types'
import * as generalConstants from 'common/utils/general.constants'
import * as generalUtils from 'common/utils/general.utils'
import './CompanyCard.scss'
import CompanyCardBackground from './companyCardBackground.png'
const CompanyCard = ({ translate, event, children }) => {
const accessibleDate = generalUtils.accessibleFormattedDate(event.eventStartTime)
const date = generalUtils.formattedDate(event.eventStartTime)
return (
<div className="companyCard">
<div
className="companyCard__header"
style={{ backgroundImage: `url(${CompanyCardBackground})` }}
>
<div className="companyCard__header--row">
<div className="companyCard__header--title" title={translate('Event name')}>
{event.name}
</div>
<div className="companyCard__header--date" aria-label={accessibleDate}>
{date}
</div>
</div>
<div className="companyCard__header--row">
<address className="companyCard__header--address">{event.address}</address>
<div className="companyCard__header--directions">
<a
target="_blank"
rel="noopener noreferrer"
href={generalConstants.MAPS_URL(event.address)}
>
{translate('Get directions')}
</a>
</div>
</div>
</div>
<div className="companyCard__content">{children}</div>
</div>
)
}
CompanyCard.defaultProps = {
children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired,
translate: (value) => value,
event: PropTypes.shape({
name: PropTypes.string,
address: PropTypes.string,
eventStartTime: PropTypes.number,
}),
}
export default CompanyCard
|