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 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 103 | // This is the root component for #notification-page
import React from 'react'
import ListView from './Notification/ListView'
import Pager from './Notification/Pager'
import Crowi from 'client/util/Crowi'
import { Notification } from 'client/types/crowi'
interface Props {
crowi: Crowi
}
interface State {
notifications: []
loaded: boolean
hasPrev: boolean
hasNext: boolean
}
export default class NotificationPage extends React.Component<Props, State> {
limit: number
offset: number
constructor(props: Props) {
super(props)
this.limit = 16
this.offset = 0
this.state = {
notifications: [],
loaded: false,
hasPrev: false,
hasNext: false,
}
}
componentDidMount() {
this.getNotifications()
}
async handleNotificationOnClick(notification: Notification) {
try {
await this.props.crowi.apiPost('/notification.open', { id: notification._id })
// jump to target page
window.location.href = notification.target.path
} catch (err) {
// TODO: error handling
}
}
async getNotifications() {
try {
const { notifications, hasPrev, hasNext } = await this.props.crowi.apiGet('/notification.list', {
limit: this.limit,
offset: this.offset,
})
this.setState({
notifications,
loaded: true,
hasPrev,
hasNext,
})
} catch (err) {
// TODO error handling
}
}
handleNextClick() {
this.offset = this.offset + this.limit
this.getNotifications()
}
handlePrevClick() {
this.offset = this.offset - this.limit
if (this.offset < 0) {
this.offset = 0
}
this.getNotifications()
}
render() {
return (
<div>
<Pager
hasPrev={this.state.hasPrev}
hasNext={this.state.hasNext}
handlePrevClick={this.handlePrevClick.bind(this)}
handleNextClick={this.handleNextClick.bind(this)}
/>
<ListView loaded={this.state.loaded} notifications={this.state.notifications} notificationClickHandler={this.handleNotificationOnClick.bind(this)} />
<Pager
hasPrev={this.state.hasPrev}
hasNext={this.state.hasNext}
handlePrevClick={this.handlePrevClick.bind(this)}
handleNextClick={this.handleNextClick.bind(this)}
/>
</div>
)
}
}
|