diff --git a/.babelrc b/.babelrc
index 731eeb175..4f187e61f 100644
--- a/.babelrc
+++ b/.babelrc
@@ -14,6 +14,6 @@
"plugins": [
"@babel/plugin-transform-react-inline-elements"
]
- }
+ }
}
}
diff --git a/package.json b/package.json
index dab2191f4..f123387ba 100644
--- a/package.json
+++ b/package.json
@@ -26,12 +26,12 @@
},
"dependencies": {
"@babel/plugin-transform-react-inline-elements": "^7.0.0",
- "@fortawesome/fontawesome": "^1.1.8",
- "@fortawesome/fontawesome-free-brands": "^5.0.13",
- "@fortawesome/fontawesome-free-regular": "^5.0.13",
- "@fortawesome/fontawesome-free-solid": "^5.0.13",
- "@fortawesome/fontawesome-svg-core": "^1.2.0",
- "@fortawesome/react-fontawesome": "^0.1.0",
+ "@fortawesome/fontawesome-free": "^5.8.2",
+ "@fortawesome/fontawesome-svg-core": "^1.2.18",
+ "@fortawesome/free-brands-svg-icons": "^5.8.2",
+ "@fortawesome/free-regular-svg-icons": "^5.8.2",
+ "@fortawesome/free-solid-svg-icons": "^5.8.2",
+ "@fortawesome/react-fontawesome": "^0.1.4",
"@iktakahiro/markdown-it-katex": "^3.0.3",
"admin-lte": "2.3.11",
"ajv": "5.5.1",
diff --git a/src/components/SystemMessages/MessagesList/MessagesList.js b/src/components/SystemMessages/MessagesList/MessagesList.js
index b538a58d3..3da9c56f3 100644
--- a/src/components/SystemMessages/MessagesList/MessagesList.js
+++ b/src/components/SystemMessages/MessagesList/MessagesList.js
@@ -1,7 +1,6 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { injectIntl, intlShape, FormattedMessage } from 'react-intl';
-import { Alert } from 'react-bootstrap';
import { defaultMemoize } from 'reselect';
import SortableTable, { SortableTableColumnDescriptor } from '../../widgets/SortableTable';
@@ -10,6 +9,7 @@ import DateTime from '../../widgets/DateTime';
import { roleLabels, rolePriorities } from '../../helpers/usersRoles';
import UsersNameContainer from '../../../containers/UsersNameContainer';
import FilterSystemMessagesForm from '../../forms/FilterSystemMessagesForm/FilterSystemMessagesForm';
+import { TypedMessageIcon } from '../../icons';
import styles from './MessagesList.less';
@@ -78,8 +78,7 @@ class MessagesList extends Component {
'type',
,
{
- comparator: ({ type: t1 }, { type: t2 }) => t1.localeCompare(t2, locale),
- cellRenderer: type => type && ,
+ cellRenderer: type => type && ,
className: 'text-center valign-middle',
}
),
diff --git a/src/components/SystemMessages/MessagesList/MessagesList.less b/src/components/SystemMessages/MessagesList/MessagesList.less
index 0d279f7cc..e66c4ced1 100644
--- a/src/components/SystemMessages/MessagesList/MessagesList.less
+++ b/src/components/SystemMessages/MessagesList/MessagesList.less
@@ -2,14 +2,14 @@
margin: 0px;
padding: 0px;
height: 16px;
- width: 16px;
- display: inline-block;
+ width: 16px;
+ display: inline-block;
}
.textPreview {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
- max-width: 20vw;
- vertical-align: middle !important;
+ max-width: 20vw;
+ vertical-align: middle !important;
}
diff --git a/src/components/forms/EditSystemMessageForm/EditSystemMessageForm.js b/src/components/forms/EditSystemMessageForm/EditSystemMessageForm.js
index afe40d0f6..c91a77856 100644
--- a/src/components/forms/EditSystemMessageForm/EditSystemMessageForm.js
+++ b/src/components/forms/EditSystemMessageForm/EditSystemMessageForm.js
@@ -45,7 +45,7 @@ const EditSystemMessageForm = ({
{createNew ? (
-
+
) : (
)}
diff --git a/src/components/icons/index.js b/src/components/icons/index.js
index 1de47bc2e..ef280a068 100644
--- a/src/components/icons/index.js
+++ b/src/components/icons/index.js
@@ -6,6 +6,8 @@ import Icon from './Icon';
* Icons with meta-names
*/
+const defaultMessageIcon = ['far', 'envelope'];
+
export const AddIcon = props => ;
export const AdressIcon = props => ;
export const ArchiveGroupIcon = ({ archived = false, ...props }) => (
@@ -33,7 +35,7 @@ export const InfoIcon = props => ;
export const LoadingIcon = props => ;
export const LocalIcon = props => ;
export const LockIcon = props => ;
-export const MailIcon = props => ;
+export const MailIcon = props => ;
export const NeedFixingIcon = props => ;
export const PipelineIcon = props => ;
export const RefreshIcon = props => ;
@@ -62,6 +64,17 @@ export const SuperadminIcon = props => ;
export const SupervisorIcon = props => ;
export const SupervisorStudentIcon = props => ;
export const TransferIcon = props => ;
+
+const messageIconTypes = {
+ success: ['far', 'check-circle'],
+ info: 'info-circle',
+ danger: 'radiation',
+ warning: 'exclamation-triangle',
+};
+export const TypedMessageIcon = ({ type, ...props }) => (
+
+);
+
export const UnlockIcon = props => ;
export const UploadIcon = props => ;
export const UserIcon = props => ;
diff --git a/src/components/widgets/HeaderNotificationsDropdown/headerNotificationDropdown.less b/src/components/widgets/HeaderNotificationsDropdown/headerNotificationDropdown.less
index d4962f2eb..415889461 100644
--- a/src/components/widgets/HeaderNotificationsDropdown/headerNotificationDropdown.less
+++ b/src/components/widgets/HeaderNotificationsDropdown/headerNotificationDropdown.less
@@ -1,4 +1,5 @@
.dropdownMenu {
width: 42vw !important;
min-width: 400px !important;
+ box-shadow: 8px 8px 16px #999 !important;
}
diff --git a/src/components/widgets/HeaderSystemMessagesDropdown/HeaderSystemMessagesDropdown.js b/src/components/widgets/HeaderSystemMessagesDropdown/HeaderSystemMessagesDropdown.js
index d16622f38..4ac991d82 100644
--- a/src/components/widgets/HeaderSystemMessagesDropdown/HeaderSystemMessagesDropdown.js
+++ b/src/components/widgets/HeaderSystemMessagesDropdown/HeaderSystemMessagesDropdown.js
@@ -2,13 +2,15 @@ import React from 'react';
import PropTypes from 'prop-types';
import { FormattedMessage, intlShape, injectIntl } from 'react-intl';
import classnames from 'classnames';
-import { Label, Alert } from 'react-bootstrap';
+import { Label, Table } from 'react-bootstrap';
-import Icon from '../../icons';
+import UsersNameContainer from '../../../containers/UsersNameContainer';
+import Icon, { TypedMessageIcon } from '../../icons';
import Markdown from '../Markdown';
import { getLocalizedText } from '../../../helpers/localizedData';
import styles from './HeaderSystemMessagesDropdown.less';
+import DateTime from '../DateTime';
const preventClickPropagation = ev => ev.stopPropagation();
@@ -26,19 +28,43 @@ const HeaderSystemMessagesDropdown = ({ isOpen, toggleOpen, systemMessages, intl
-
-
+
+
+
-
- {systemMessages.map((message, idx) => (
-
-
-
- ))}
+ -
+
+
+ {systemMessages.map((message, idx) => (
+
+
+
+ |
+
+
+
+
+
+
+
+ |
+
+ ))}
+
+
+
diff --git a/src/components/widgets/HeaderSystemMessagesDropdown/HeaderSystemMessagesDropdown.less b/src/components/widgets/HeaderSystemMessagesDropdown/HeaderSystemMessagesDropdown.less
index eb6a2ec04..66c54b002 100644
--- a/src/components/widgets/HeaderSystemMessagesDropdown/HeaderSystemMessagesDropdown.less
+++ b/src/components/widgets/HeaderSystemMessagesDropdown/HeaderSystemMessagesDropdown.less
@@ -1,10 +1,16 @@
.dropdownMenu {
width: 70vw !important;
min-width: 400px !important;
+ box-shadow: 8px 8px 16px #999 !important;
}
.messageList {
- max-height: calc(100vh - 100px) !important;
+ max-height: calc(100vh - 100px) !important;
+}
+
+.messageList small {
+ margin-top: -5px;
+ font-size: 75%;
}
.messageAlert {
diff --git a/src/containers/App/App.js b/src/containers/App/App.js
index 33ffbdac0..625a47d4d 100644
--- a/src/containers/App/App.js
+++ b/src/containers/App/App.js
@@ -13,11 +13,10 @@ import { fetchManyGroupsStatus } from '../../redux/selectors/groups';
import { logout, refresh, selectInstance } from '../../redux/modules/auth';
import { getJsData, resourceStatus } from '../../redux/helpers/resourceManager';
-// import fontawesome from '@fortawesome/fontawesome';
import { library } from '@fortawesome/fontawesome-svg-core';
-import regularIcons from '@fortawesome/fontawesome-free-regular';
-import solidIcons from '@fortawesome/fontawesome-free-solid';
-import brandIcons from '@fortawesome/fontawesome-free-brands';
+import { far as regularIcons } from '@fortawesome/free-regular-svg-icons';
+import { fas as solidIcons } from '@fortawesome/free-solid-svg-icons';
+import { fab as brandIcons } from '@fortawesome/free-brands-svg-icons';
import { LoadingIcon } from '../../components/icons';
diff --git a/views/index.ejs b/views/index.ejs
index 81f2fde9e..b6509ed85 100644
--- a/views/index.ejs
+++ b/views/index.ejs
@@ -3,9 +3,9 @@
>
- <%- head.title.toString() %>
- <%- head.meta.toString() %>
- <%- head.link.toString() %>
+ <%- head.title.toString() %>
+ <%- head.meta.toString() %>
+ <%- head.link.toString() %>