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 | import React from 'react' import styled from 'styled-components' import Notification from '../Notification/Notification' import NullNotification from '../Notification/NullNotification' import Icon from '../Common/Icon' import { DropdownMenu as Menu, DropdownItem } from 'reactstrap' import { Notification as NotificationType } from 'client/types/crowi' const StyledDropdownMenu = styled(Menu)` width: 400px; font-size: small; ` const Loader = styled.li` padding: 8px 0; text-align: center; ` const NotificationList = styled.ul` margin: 0; padding: 0; ` const SeeAll = styled.a` display: block; text-align: center; ` interface Props { loaded: boolean notifications: NotificationType[] notificationClickHandler: Function } export default class DropdownMenu extends React.Component<Props> { render() { const { loaded, notifications, notificationClickHandler } = this.props return ( <StyledDropdownMenu right> <NotificationList> {!loaded ? ( <Loader> <Icon name="loading" spin /> </Loader> ) : notifications.length <= 0 ? ( <NullNotification /> ) : ( notifications.map(notification => <Notification key={notification._id} notification={notification} onClick={notificationClickHandler} />) )} </NotificationList> <DropdownItem divider /> <SeeAll href="/me/notifications">See All</SeeAll> </StyledDropdownMenu> ) } } |