73 lines
1.7 KiB
TypeScript
73 lines
1.7 KiB
TypeScript
import React from 'react';
|
||
import moment from 'moment';
|
||
import classnames from 'classnames';
|
||
import { Tag } from 'antd';
|
||
import { Link } from 'react-router-dom';
|
||
import UnitDisplay from 'components/UnitDisplay';
|
||
import { RFP } from 'types';
|
||
import './RFPItem.less';
|
||
|
||
interface Props {
|
||
rfp: RFP;
|
||
isSmall?: boolean;
|
||
}
|
||
|
||
export default class RFPItem extends React.Component<Props> {
|
||
render() {
|
||
const { rfp, isSmall } = this.props;
|
||
const {
|
||
urlId,
|
||
title,
|
||
brief,
|
||
acceptedProposals,
|
||
dateOpened,
|
||
dateCloses,
|
||
dateClosed,
|
||
bounty,
|
||
matching,
|
||
} = rfp;
|
||
const closeDate = dateCloses || dateClosed;
|
||
|
||
const tags = [];
|
||
if (!isSmall) {
|
||
if (bounty) {
|
||
tags.push(
|
||
<Tag key="bounty" color="#CF8A00">
|
||
<UnitDisplay value={bounty} symbol="ZEC" /> bounty
|
||
</Tag>,
|
||
);
|
||
}
|
||
if (matching) {
|
||
tags.push(
|
||
<Tag key="matching" color="#1890ff">
|
||
x2 matching
|
||
</Tag>,
|
||
);
|
||
}
|
||
}
|
||
|
||
return (
|
||
<Link
|
||
className={classnames('RFPItem', isSmall && 'is-small')}
|
||
to={`/requests/${urlId}`}
|
||
>
|
||
<h3 className="RFPItem-title">
|
||
{title}
|
||
{tags}
|
||
</h3>
|
||
<p className="RFPItem-brief">{brief}</p>
|
||
|
||
<div className="RFPItem-details">
|
||
<div className="RFPItem-details-detail">
|
||
{moment(dateOpened * 1000).format('LL')}
|
||
{closeDate && <> – {moment(closeDate * 1000).format('LL')}</>}
|
||
</div>
|
||
<div className="RFPItem-details-detail">
|
||
{acceptedProposals.length} proposals approved
|
||
</div>
|
||
</div>
|
||
</Link>
|
||
);
|
||
}
|
||
}
|