-
Notifications
You must be signed in to change notification settings - Fork 18
/
storyListItemView.tsx
47 lines (43 loc) · 1.7 KB
/
storyListItemView.tsx
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
import * as classnames from 'classnames';
import * as React from 'react';
import { EventConst } from '../eventConst';
import { EpicLabel } from './epicLabel';
import { Story } from '../models/story';
import { StoryStatus } from '../models/storyStatus';
import { Router } from 'esp-js';
import { shouldUpdateMixin } from 'esp-js-react';
export interface StoryListItemViewProps {
story: Story;
router: Router;
}
@shouldUpdateMixin((nextProps: StoryListItemViewProps) => {
return {
isSelected: nextProps.story.isSelected,
name: nextProps.story.name,
description: nextProps.story.description,
sataus: nextProps.story.status,
epicName: nextProps.story.epic.name,
epicColour: nextProps.story.epic.colour
};
})
export class StoryListItemView extends React.Component<StoryListItemViewProps, {}> {
_publishEvent(eventName, event) {
this.props.router.publishEvent(this.props.story.modelId, eventName, event);
}
shouldComponentUpdate(nextProps, nextState) {
// return nextProps.story.isDirty; when https://github.com/esp/esp-js-react/issues/1 is implemented
return true;
}
render() {
let story = this.props.story;
let className = classnames('storyListItem', {'selectedItem': story.isSelected});
return (
<div className={className} onClick={() => {this._publishEvent(EventConst.STORY_SELECTED, {story});}}>
<label>Story:{story.name}</label>
<p>{story.description}</p>
<EpicLabel colour={story.epic.colour} displayText={story.epic.name}/>
{story.status === StoryStatus.DONE ? <label>Done</label> : null}
</div>
);
}
}