/
DailyDocketEditLinks.jsx
102 lines (90 loc) · 3.27 KB
/
DailyDocketEditLinks.jsx
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
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
import React from 'react';
import PropTypes from 'prop-types';
import moment from 'moment';
import { css } from 'glamor';
import _ from 'lodash';
import Link from '@department-of-veterans-affairs/caseflow-frontend-toolkit/components/Link';
import Button from '../../../components/Button';
import { CrossIcon } from '../../../components/icons/fontAwesome/CrossIcon';
import { PencilIcon } from '../../../components/icons/PencilIcon';
import { LockIcon } from '../../../components/icons/LockIcon';
const EditHearingDayLink = ({ docketId, history }) => (
<Button
{...css({ marginLeft: '30px' })}
linkStyling
onClick={() => history.push(`/schedule/docket/${docketId}/edit`)}
>
<span {...css({ position: 'absolute' })}><PencilIcon size={25} /></span>
<span {...css({ marginRight: '5px', marginLeft: '20px' })} >
Edit Hearing Day
</span>
</Button>
);
EditHearingDayLink.propTypes = {
history: PropTypes.object,
docketId: PropTypes.string.isRequired
};
const LockHearingLink = ({ dailyDocket, onDisplayLockModal }) => (
<Button linkStyling onClick={onDisplayLockModal}>
<span {...css({ position: 'absolute',
'& > svg > g > g': { fill: '#0071bc' } })}>
<LockIcon />
</span>
<span {...css({ marginRight: '5px',
marginLeft: '16px' })}>
{dailyDocket.lock ? 'Unlock Hearing Day' : 'Lock Hearing Day'}
</span>
</Button>
);
LockHearingLink.propTypes = {
dailyDocket: PropTypes.shape({
lock: PropTypes.bool
}),
onDisplayLockModal: PropTypes.func.isRequired
};
const RemoveHearingDayLink = ({ onClickRemoveHearingDay }) => (
<Button
linkStyling
onClick={onClickRemoveHearingDay} >
<CrossIcon /><span{...css({ marginLeft: '3px' })}>Remove Hearing Day</span>
</Button>
);
RemoveHearingDayLink.propTypes = {
onClickRemoveHearingDay: PropTypes.func.isRequired
};
export default class DailyDocketEditLinks extends React.Component {
render() {
const { dailyDocket, onDisplayLockModal, hearings, onClickRemoveHearingDay, user } = this.props;
return <React.Fragment>
<h1>Daily Docket ({moment(dailyDocket.scheduledFor).format('ddd M/DD/YYYY')})</h1>
<br />
<div {...css({
marginTop: '-35px',
marginBottom: '25px'
})}>
<Link linkStyling to="/schedule" >< Back to schedule</Link>
{user.userCanAssignHearingSchedule &&
<span>
<EditHearingDayLink {...this.props} docketId={dailyDocket?.id} />
<LockHearingLink dailyDocket={dailyDocket} onDisplayLockModal={onDisplayLockModal} />
</span>}
{(_.isEmpty(hearings) && user.userCanBuildHearingSchedule) &&
<RemoveHearingDayLink onClickRemoveHearingDay={onClickRemoveHearingDay} />}
{dailyDocket.notes &&
<span {...css({ marginTop: '15px' })}>
<br /><strong>Notes: </strong><br />{dailyDocket.notes}
</span>}
</div>
</React.Fragment>;
}
}
DailyDocketEditLinks.propTypes = {
dailyDocket: PropTypes.object.isRequired,
hearings: PropTypes.arrayOf(PropTypes.object).isRequired,
openModal: PropTypes.func.isRequired,
onDisplayLockModal: PropTypes.func.isRequired,
onClickRemoveHearingDay: PropTypes.func.isRequired,
user: PropTypes.object.isRequired
};