diff --git a/frontend/src/Metamaps/GlobalUI/Notifications.js b/frontend/src/Metamaps/GlobalUI/Notifications.js index fef31602..29908695 100644 --- a/frontend/src/Metamaps/GlobalUI/Notifications.js +++ b/frontend/src/Metamaps/GlobalUI/Notifications.js @@ -1,3 +1,4 @@ +/* global $ */ import GlobalUI from './index' const Notifications = { diff --git a/frontend/src/components/App/NotificationBox.js b/frontend/src/components/App/NotificationBox.js index 3df31e7c..f5f0b801 100644 --- a/frontend/src/components/App/NotificationBox.js +++ b/frontend/src/components/App/NotificationBox.js @@ -6,7 +6,6 @@ import Notification from '../Notification' import Loading from '../Loading' class NotificationBox extends Component { - static propTypes = { notifications: PropTypes.array, fetchNotifications: PropTypes.func.isRequired, diff --git a/frontend/src/components/Loading.js b/frontend/src/components/Loading.js index 018806af..66382978 100644 --- a/frontend/src/components/Loading.js +++ b/frontend/src/components/Loading.js @@ -3,31 +3,31 @@ import PropTypes from 'prop-types' // based on https://www.npmjs.com/package/react-loading-animation -const loading_style = { - position: 'relative', - margin: '0 auto', - width: '30px', - height: '30px', +const loadingStyle = { + position: 'relative', + margin: '0 auto', + width: '30px', + height: '30px' } -const svg_style = { - animation: 'rotate 2s linear infinite', - height: '100%', - transformOrigin: 'center center', - width: '100%', - position: 'absolute', - top: 0, - bottom: 0, - left: 0, - right: 0, - margin: 'auto' +const svgStyle = { + animation: 'rotate 2s linear infinite', + height: '100%', + transformOrigin: 'center center', + width: '100%', + position: 'absolute', + top: 0, + bottom: 0, + left: 0, + right: 0, + margin: 'auto' } -const circle_style = { - strokeDasharray: '1,200', - strokeDashoffset: '0', - animation: 'dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite', - strokeLinecap: 'round' +const circleStyle = { + strokeDasharray: '1,200', + strokeDashoffset: '0', + animation: 'dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite', + strokeLinecap: 'round' } const animation = `@keyframes rotate { @@ -59,34 +59,34 @@ const animation = `@keyframes rotate { }` class Loading extends React.Component { - static propTypes = { - style: PropTypes.object, - width: PropTypes.string, - height: PropTypes.string, - margin: PropTypes.string - } + static propTypes = { + style: PropTypes.object, + width: PropTypes.string, + height: PropTypes.string, + margin: PropTypes.string + } - static defaultProps = { - style: {}, - width: '30px', - height: '30px', - margin: '0 auto' - } + static defaultProps = { + style: {}, + width: '30px', + height: '30px', + margin: '0 auto' + } - render () { - let { width, height, margin, style } = this.props + render() { + let { width, height, margin, style } = this.props - loading_style.width = width - loading_style.height = height - loading_style.margin = margin + loadingStyle.width = width + loadingStyle.height = height + loadingStyle.margin = margin - return
+ return
- - + +
- } + } } export default Loading diff --git a/frontend/src/components/Notification.js b/frontend/src/components/Notification.js index 05da2cc6..22237aaa 100644 --- a/frontend/src/components/Notification.js +++ b/frontend/src/components/Notification.js @@ -3,7 +3,6 @@ import PropTypes from 'prop-types' import outdent from 'outdent' class Notification extends Component { - static propTypes = { markAsRead: PropTypes.func, markAsUnread: PropTypes.func, @@ -32,7 +31,7 @@ class Notification extends Component { let map, topic, topic1, topic2 let result = `
${notification.actor.name}
` - switch(notification.type) { + switch (notification.type) { case 'ACCESS_APPROVED': map = notification.data.map result += outdent`granted your request to edit map @@ -77,8 +76,8 @@ class Notification extends Component { getDate = () => { const { notification: {created_at} } = this.props - const months = ['Jan','Feb','Mar','Apr','May','Jun', - 'Jul','Aug','Sep','Oct','Nov','Dec'] + const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', + 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'] const created = new Date(created_at) return `${months[created.getMonth()]} ${created.getDate()}` }