From 2341b61f594261927b3c972990769c21ffde1cb0 Mon Sep 17 00:00:00 2001 From: Arnei Date: Tue, 25 Jun 2024 13:35:44 +0200 Subject: [PATCH 1/4] Respect publication channels listprovider more While we were already getting information on publications from the respective listprovider for the event details, we were not putting all of it to use, for example ordering. Also, the event table did not have access to this information at all. This should fix that. --- .../EventDetailsPublicationTab.tsx | 2 +- .../events/partials/PublishedCell.tsx | 9 ++- src/slices/eventDetailsSlice.ts | 74 +++++++------------ src/slices/eventSlice.ts | 30 +++----- src/thunks/assetsThunks.ts | 69 +++++++++++++++++ 5 files changed, 112 insertions(+), 72 deletions(-) diff --git a/src/components/events/partials/ModalTabsAndPages/EventDetailsPublicationTab.tsx b/src/components/events/partials/ModalTabsAndPages/EventDetailsPublicationTab.tsx index 2132cc2a44..28698f42af 100644 --- a/src/components/events/partials/ModalTabsAndPages/EventDetailsPublicationTab.tsx +++ b/src/components/events/partials/ModalTabsAndPages/EventDetailsPublicationTab.tsx @@ -60,7 +60,7 @@ const EventDetailsPublicationTab = ({ )}
- {t(publication.name)} + {publication.label ? t(publication.label) : t(publication.name)} {publication.description && (

{publication.description} diff --git a/src/components/events/partials/PublishedCell.tsx b/src/components/events/partials/PublishedCell.tsx index 3ba60a64b8..0b4c647e37 100644 --- a/src/components/events/partials/PublishedCell.tsx +++ b/src/components/events/partials/PublishedCell.tsx @@ -1,5 +1,6 @@ import React, { useEffect, useState } from "react"; import { useTranslation } from "react-i18next"; +import { Publication } from "../../../slices/eventDetailsSlice"; // References for detecting a click outside of the container of the popup listing publications of an event const containerPublications = React.createRef(); @@ -48,8 +49,8 @@ const PublishCell = ({

{/* Show a list item for each publication of an event that isn't hidden*/} {/* @ts-expect-error TS(7006): Parameter 'publication' implicitly has an 'any' ty... Remove this comment to see the full error message */} - {row.publications.map((publication, key) => - !publication.hiding ? ( + {row.publications.map((publication: Publication, key) => + !publication.hide ? ( // Check if publications is enabled and choose icon according publication.enabled ? ( - {t(publication.name)} + {publication.label ? t(publication.label) : t(publication.name)} ) : ( ) ) : null diff --git a/src/slices/eventDetailsSlice.ts b/src/slices/eventDetailsSlice.ts index bdde6074a4..27f482ca4e 100644 --- a/src/slices/eventDetailsSlice.ts +++ b/src/slices/eventDetailsSlice.ts @@ -29,6 +29,7 @@ import { Workflow as WorkflowDefinitions} from "./workflowSlice"; import { RootState } from '../store'; import { Statistics, fetchStatistics, fetchStatisticsValueUpdate } from './statisticsSlice'; import { Ace, TransformedAcl, TransformedAcls } from './aclDetailsSlice'; +import { enrichPublications } from '../thunks/assetsThunks'; type MetadataField = { id: string, @@ -102,6 +103,18 @@ export type UploadAssetOption = { displayOrder: number, } +export type Publication = { + enabled: boolean, + icon?: string, + id: string, + label?: string, + hide?: boolean, + name: string, // translation key + order: number, + url: string, + description?: string, +} + type EventDetailsState = { statusMetadata: 'uninitialized' | 'loading' | 'succeeded' | 'failed', errorMetadata: SerializedError | null, @@ -340,15 +353,7 @@ type EventDetailsState = { timestamp: string, // date title: string, }, - publications: { - enabled: boolean, - icon?: string, - id: string, - name: string, // translation key - order: number, - url: string, - description?: string, - }[], + publications: Publication[], statistics: Statistics[], hasStatisticsError: boolean, } @@ -870,49 +875,20 @@ export const fetchComments = createAsyncThunk('eventDetails/fetchComments', asyn return { comments, commentReasons } }); -export const fetchEventPublications = createAsyncThunk('eventDetails/fetchEventPublications', async (eventId: string) => { +export const fetchEventPublications = createAsyncThunk('eventDetails/fetchEventPublications', async (eventId: string, { dispatch }) => { let data = await axios.get(`/admin-ng/event/${eventId}/publications.json`); - let publications = await data.data; - - // get information about possible publication channels - data = await axios.get("/admin-ng/resources/PUBLICATION.CHANNELS.json"); - - let publicationChannels = await data.data; - - let now = new Date(); - - // fill publication objects with additional information -// @ts-expect-error TS(7006): Parameter 'publication' implicitly has an 'any' ty... Remove this comment to see the full error message - publications.publications.forEach((publication) => { - publication.enabled = !( - publication.id === "engage-live" && - (now < new Date(publications["start-date"]) || - now > new Date(publications["end-date"])) - ); - - if (publicationChannels[publication.id]) { - let channel = JSON.parse(publicationChannels[publication.id]); - - if (channel.label) { - publication.label = channel.label; - } - if (channel.icon) { - publication.icon = channel.icon; - } - if (channel.hide) { - publication.hide = channel.hide; - } - if (channel.description) { - publication.description = channel.description; - } - if (channel.order) { - publication.order = channel.order; - } - } - }); + let publications: { + publications: { + id: string, + name: string, + url: string, + }[], + "start-date": string, + "end-date": string, + } = await data.data; - return publications.publications; + return await dispatch(enrichPublications(publications)).unwrap(); }); export const saveComment = createAsyncThunk('eventDetails/saveComment', async (params: { diff --git a/src/slices/eventSlice.ts b/src/slices/eventSlice.ts index 75785a0a72..bcce650578 100644 --- a/src/slices/eventSlice.ts +++ b/src/slices/eventSlice.ts @@ -1,4 +1,4 @@ -import { PayloadAction, SerializedError, createAsyncThunk, createSlice } from '@reduxjs/toolkit' +import { PayloadAction, SerializedError, createAsyncThunk, createSlice, unwrapResult } from '@reduxjs/toolkit' import { eventsTableConfig } from "../configs/tableConfigs/eventsTableConfig"; import axios, { AxiosProgressEvent } from 'axios'; import moment from "moment-timezone"; @@ -23,9 +23,10 @@ import { import { getAssetUploadOptions, getSchedulingEditedEvents } from '../selectors/eventSelectors'; import { fetchSeriesOptions } from "./seriesSlice"; import { AppDispatch, RootState } from '../store'; -import { fetchAssetUploadOptions } from '../thunks/assetsThunks'; +import { enrichPublications, fetchAssetUploadOptions } from '../thunks/assetsThunks'; import { TransformedAcls } from './aclDetailsSlice'; import { TableConfig } from '../configs/tableConfigs/aclsTableConfig'; +import { Publication } from './eventDetailsSlice'; /** * This file contains redux reducer for actions affecting the state of events @@ -71,13 +72,7 @@ export type Event = { managedAcl: string, needs_cutting: boolean, presenters: string[], - publications: { - enabled: boolean, - hiding: boolean, - id: string, - name: string, - url: string, - }[], + publications: Publication[], selected?: boolean, series?: { id: string, title: string } source: string, @@ -219,7 +214,7 @@ const initialState: EventState = { }; // fetch events from server -export const fetchEvents = createAsyncThunk('events/fetchEvents', async (_, { getState }) => { +export const fetchEvents = createAsyncThunk('events/fetchEvents', async (_, { dispatch, getState }) => { const state = getState() as RootState; let params: { limit: any, offset: number, getComments?: boolean }= getURLParams(state); @@ -244,16 +239,15 @@ export const fetchEvents = createAsyncThunk('events/fetchEvents', async (_, { ge ...response.results[i], date: response.results[i].start_date, }; - // insert enabled and hiding property of publications, if result has publications + // insert enabled and hide property of publications, if result has publications let result = response.results[i]; if (!!result.publications && result.publications.length > 0) { - let transformedPublications = []; - for (let j = 0; result.publications.length > j; j++) { - transformedPublications.push({ - ...result.publications[j], - enabled: true, - hiding: false, - }); + let transformedPublications: Publication[] = []; + try { + const resultAction = await dispatch(enrichPublications({ publications: result.publications })); + transformedPublications = unwrapResult(resultAction); + } catch (rejectedValueOrSerializedError) { + console.error(rejectedValueOrSerializedError) } response.results[i] = { ...response.results[i], diff --git a/src/thunks/assetsThunks.ts b/src/thunks/assetsThunks.ts index fcbe20793c..98fc60f668 100644 --- a/src/thunks/assetsThunks.ts +++ b/src/thunks/assetsThunks.ts @@ -3,6 +3,7 @@ import { getAssetUploadOptions } from "../selectors/eventSelectors"; import { createAsyncThunk } from "@reduxjs/toolkit"; import { RootState } from "../store"; import { UploadAssetOption } from "../slices/eventSlice"; +import { Publication } from "../slices/eventDetailsSlice"; // thunks for assets, especially for getting asset options @@ -55,3 +56,71 @@ export const fetchAssetUploadOptions = createAsyncThunk('assets/fetchAssetUpload return { workflow, newAssetUploadOptions }; } }); + +/** + * Adds information from the publication list provider to publications. + * The additional info is used for rendering purposes + */ +export const enrichPublications = createAsyncThunk('assets/fetchAssetUploadOptionsAsyncThunk', async ( + publications: { + publications: { + id: string, + name: string, + url: string, + }[], + "start-date"?: string, + "end-date"?: string, + }, +) => { + // get information about possible publication channels + let data = await axios.get("/admin-ng/resources/PUBLICATION.CHANNELS.json"); + + let publicationChannels: { [key: string]: string } = await data.data; + + let now = new Date(); + let combinedPublications: Publication[] = []; + + // fill publication objects with additional information + publications.publications.forEach((publication) => { + let newPublication: Publication = { + enabled: true, + id: publication.id, + name: publication.name, + order: 0, + url: publication.url, + }; + newPublication.enabled = (publications["start-date"] && publications["end-date"]) ? + !( + publication.id === "engage-live" && + (now < new Date(publications["start-date"]) || + now > new Date(publications["end-date"])) + ) + : + true; + + if (publicationChannels[publication.id]) { + let channel = JSON.parse(publicationChannels[publication.id]); + + if (channel.label) { + newPublication.label = channel.label; + } + if (channel.icon) { + newPublication.icon = channel.icon; + } + if (channel.hide) { + newPublication.hide = channel.hide; + } + if (channel.description) { + newPublication.description = channel.description; + } + if (channel.order) { + newPublication.order = channel.order; + } + } + combinedPublications.push(newPublication); + }); + + combinedPublications = combinedPublications.sort(({order: a}, {order:b}) => a - b); + + return combinedPublications; +}); \ No newline at end of file From 87083af428d7a1842c5d8d80d2f6cd75298472c8 Mon Sep 17 00:00:00 2001 From: Arnei Date: Fri, 9 Aug 2024 14:38:57 +0200 Subject: [PATCH 2/4] Fix variable name --- src/components/events/partials/PublishedCell.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/events/partials/PublishedCell.tsx b/src/components/events/partials/PublishedCell.tsx index 5b457e5710..23cca59e8e 100644 --- a/src/components/events/partials/PublishedCell.tsx +++ b/src/components/events/partials/PublishedCell.tsx @@ -40,7 +40,7 @@ const PublishCell = ({ const onlyEngage = row.publications.length === 1 && row.publications[0].enabled - && !row.publications[0].hiding + && !row.publications[0].hide && row.publications[0].id === 'engage-player'; return ( From ab59256fd8d52c03147953c26d5e300b0f66c08c Mon Sep 17 00:00:00 2001 From: Arnei Date: Fri, 17 Jan 2025 13:50:19 +0100 Subject: [PATCH 3/4] Remove unexpected tab character --- src/slices/eventDetailsSlice.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/slices/eventDetailsSlice.ts b/src/slices/eventDetailsSlice.ts index f728b981e4..2ce4a68e41 100644 --- a/src/slices/eventDetailsSlice.ts +++ b/src/slices/eventDetailsSlice.ts @@ -118,7 +118,7 @@ export type Publication = { id: string, label?: string, hide?: boolean, - name: string, // translation key + name: string, // translation key order: number, url: string, description?: string, From cfff798eb9a7b785c8dee21be983466c38ae6557 Mon Sep 17 00:00:00 2001 From: Arnei Date: Mon, 27 Jan 2025 12:18:09 +0100 Subject: [PATCH 4/4] Fix thunk naming --- src/thunks/assetsThunks.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/thunks/assetsThunks.ts b/src/thunks/assetsThunks.ts index 21895554ea..180108b8ab 100644 --- a/src/thunks/assetsThunks.ts +++ b/src/thunks/assetsThunks.ts @@ -60,7 +60,7 @@ export const fetchAssetUploadOptions = createAppAsyncThunk('assets/fetchAssetUpl * Adds information from the publication list provider to publications. * The additional info is used for rendering purposes */ -export const enrichPublications = createAppAsyncThunk('assets/fetchAssetUploadOptionsAsyncThunk', async ( +export const enrichPublications = createAppAsyncThunk('assets/enrichPublications', async ( publications: { publications: { id: string,