diff --git a/app/src/actions/notificationActions.js b/app/src/actions/notificationActions.js index 8e55ba67ff..19d6181f20 100644 --- a/app/src/actions/notificationActions.js +++ b/app/src/actions/notificationActions.js @@ -22,6 +22,11 @@ export const createNotification = (notification) => ({ payload: { notification, id: nextNotificationId++ }, }); +export const createNotificationWithId = (notification, id) => ({ + type: CREATE_NOTIFICATION, + payload: { notification, id: id }, +}); + export const removeNotification = (id) => ({ type: REMOVE_NOTIFICATION, payload: { id }, diff --git a/app/src/components/shared/Notifications.js b/app/src/components/shared/Notifications.js index 4fce6ff08c..6ea26bb7eb 100644 --- a/app/src/components/shared/Notifications.js +++ b/app/src/components/shared/Notifications.js @@ -34,7 +34,7 @@ const Notifications = ({ onClick={() => closeNotification(notification.id)} className="button-like-anchor fa fa-times close" /> -
{t(notification.message)}
+{t(notification.message, notification.parameter)}
); diff --git a/app/src/i18n/org/opencastproject/adminui/languages/lang-en_US.json b/app/src/i18n/org/opencastproject/adminui/languages/lang-en_US.json index 501c245789..72440e73b9 100644 --- a/app/src/i18n/org/opencastproject/adminui/languages/lang-en_US.json +++ b/app/src/i18n/org/opencastproject/adminui/languages/lang-en_US.json @@ -161,7 +161,7 @@ "SERIES_ADDED": "The series has been created", "SERIES_NOT_SAVED": "The series could not be saved", "EVENTS_CREATED": "The event has been created", - "EVENTS_UPLOAD_STARTED": "The event is being uploaded…", + "EVENTS_UPLOAD_STARTED": "The event is being uploaded… {{ progress }}%", "EVENTS_NOT_CREATED": "The event could not be created", "EVENTS_UPDATED_ALL": "All events have been successfully updated", "EVENTS_NOT_UPDATED": "The event could not be saved", diff --git a/app/src/reducers/notificationReducers.js b/app/src/reducers/notificationReducers.js index d89b15b35a..9717c7575b 100644 --- a/app/src/reducers/notificationReducers.js +++ b/app/src/reducers/notificationReducers.js @@ -45,6 +45,21 @@ export const notifications = (state = initialState, action) => { switch (type) { case CREATE_NOTIFICATION: { const { notification, id } = payload; + if (state.notifications.filter(e => e.id === id).length > 0) { + console.log("Notification with id: " + id + " already exists.") + return { + ...state, + notifications: state.notifications.map((oldNotification) => { + if (oldNotification.id === id) { + return { + id: id, + ...notification, + }; + } + return oldNotification; + }), + }; + } return { ...state, notifications: [ diff --git a/app/src/selectors/notificationSelector.js b/app/src/selectors/notificationSelector.js index 098b6f438f..1dc45c7280 100644 --- a/app/src/selectors/notificationSelector.js +++ b/app/src/selectors/notificationSelector.js @@ -4,8 +4,9 @@ export const getNotifications = (state) => state.notifications.notifications; export const getGlobalPositions = (state) => state.notifications.notificationPositionGlobal; -export const getNotificationById = (id) => - createSelector(getNotifications, (notifications) => +export const getNotificationById = createSelector( + getNotifications, + (notifications, id) => notifications.filter((notification) => notification.id === id) ); diff --git a/app/src/thunks/eventThunks.js b/app/src/thunks/eventThunks.js index 47be707222..1deac8809a 100644 --- a/app/src/thunks/eventThunks.js +++ b/app/src/thunks/eventThunks.js @@ -25,12 +25,13 @@ import { weekdays, WORKFLOW_UPLOAD_ASSETS_NON_TRACK, } from "../configs/modalConfig"; -import { addNotification } from "./notificationThunks"; +import { addNotification, addNotificationWithId } from "./notificationThunks"; import { getAssetUploadOptions, getSchedulingEditedEvents, } from "../selectors/eventSelectors"; import { fetchSeriesOptions } from "./seriesThunks"; +import { removeNotification } from "../actions/notificationActions"; // fetch events from server export const fetchEvents = () => async (dispatch, getState) => { @@ -438,13 +439,22 @@ export const postNewEvent = (values, metadataInfo, extendedMetadata) => async ( }) ); - // Todo: process bar notification + // Process bar notification + var config = { + onUploadProgress: function(progressEvent) { + var percentCompleted = (progressEvent.loaded * 100) / progressEvent.total; + dispatch(addNotificationWithId(-42000, "success", "EVENTS_UPLOAD_STARTED", -1, { "progress": percentCompleted.toFixed(2) } )) + if (percentCompleted >= 100) { + dispatch(removeNotification(-42000)) + } + }, + headers: { + "Content-Type": "multipart/form-data", + }, + }; + axios - .post("/admin-ng/event/new", formData, { - headers: { - "Content-Type": "multipart/form-data", - }, - }) + .post("/admin-ng/event/new", formData, config) .then((response) => { console.info(response); dispatch(addNotification("success", "EVENTS_CREATED")); diff --git a/app/src/thunks/notificationThunks.js b/app/src/thunks/notificationThunks.js index 0adeda6781..3f0ce985b4 100644 --- a/app/src/thunks/notificationThunks.js +++ b/app/src/thunks/notificationThunks.js @@ -1,5 +1,6 @@ import { createNotification, + createNotificationWithId, removeNotification, } from "../actions/notificationActions"; import { getLastAddedNotification } from "../selectors/notificationSelector"; @@ -9,7 +10,7 @@ import { ADMIN_NOTIFICATION_DURATION_WARNING, } from "../configs/generalConfig"; -export const addNotification = (type, key, duration, parameter, context) => ( +export const addNotification = (type, key, duration, parameter, context, id) => ( dispatch, getState ) => { @@ -49,7 +50,12 @@ export const addNotification = (type, key, duration, parameter, context) => ( hidden: false, context: context, }; - dispatch(createNotification(notification)); + var dispatchedNotification; + if (!id) { + dispatchedNotification = dispatch(createNotification(notification)); + } else { + dispatchedNotification = dispatch(createNotificationWithId(notification, id)); + } // Get newly created notification and its id let latestNotification = getLastAddedNotification(getState()); @@ -65,4 +71,13 @@ export const addNotification = (type, key, duration, parameter, context) => ( latestNotification.duration ); } + + return dispatchedNotification.payload.id; }; + +export const addNotificationWithId = (id, type, key, duration, parameter, context) => ( + dispatch, + getState +) => { + dispatch(addNotification(type, key, duration, parameter, context, id)) +} \ No newline at end of file