@griddo/ax 12.6.0 → 12.6.1

package/src/containers/Redirects/thunks.ts

@@ -0,0 +1,196 @@
+import { redirects } from "@ax/api";
+import { appActions } from "@ax/containers/App";
+import { handleRequest } from "@ax/helpers";
+import type { IRedirect, IRootState } from "@ax/types";
+
+import { createAsyncThunk } from "@reduxjs/toolkit";
+import type { Dispatch } from "redux";
+
+import { DEFAULT_PARAMS, ERROR_CODE } from "./constants";
+import type { IRedirectsState } from "./slice";
+import { setImports, setRedirects, setTotalImports, setTotalItems } from "./slice";
+
+/**
+ * Read and write side of UC-AX-manage-redirects, as createAsyncThunk.
+ *
+ * They keep calling `handleRequest` inside for the same reason the Languages pilot does:
+ * that helper owns the loading-flag and error-channel conventions of the whole codebase —
+ * see docs/RTK-MIGRATION.md §5.
+ *
+ * This area is where the **callback-as-thunk-argument** mine of §5 finally goes off.
+ * `addRedirect` used to take an `errorAction: () => void` that it called on a 409, and
+ * createAsyncThunk keeps its argument in `meta.arg` of every action it dispatches — a
+ * function there trips the `serializableCheck` that GlobalStore deliberately leaves on.
+ * So the 409 now comes back as **data** (`isOriginTaken`) and the screen decides what to
+ * open, which is where a decision about modals belonged in the first place.
+ *
+ * As with the other areas, the legacy `try/catch` whose body was `console.log(e)` is gone:
+ * createAsyncThunk turns a throw into a `rejected` action, so the failure is observable.
+ */
+const onError = (response: unknown, dispatch: Dispatch) => appActions.handleError(response)(dispatch);
+
+interface IMessageResponse {
+	data: { message?: string | string[] };
+}
+
+// The two bulk endpoints answer with one message per offending row, and the screen reports
+// the count instead of the messages. Same wording as before, verb apart.
+const onCountedError = (response: IMessageResponse, dispatch: Dispatch, verb: "delete" | "import") => {
+	const { message } = response.data;
+	const isMultiple = Array.isArray(message) && message.length > 1;
+	const msg = isMultiple ? `The ${verb} action failed due to ${message.length} errors.` : undefined;
+	appActions.handleError(response, isMultiple, msg)(dispatch);
+};
+
+// Every write reloads the list, and the filter it reloads with depends on scope: the loaded
+// site if there is one, otherwise whatever filter the caller passed. Kept as a pure helper
+// so each thunk dispatches the reload with its own correctly typed `dispatch`.
+const scopedFilter = (getState: () => unknown, filter?: string) => {
+	const { currentSiteInfo } = (getState() as IRootState).sites;
+	return currentSiteInfo?.id ? `&sites=${currentSiteInfo.id}` : filter;
+};
+
+export interface IRedirectsQuery {
+	page: number;
+	itemsPerPage: number;
+	pagination: boolean;
+	query?: string;
+	filterBy?: string;
+}
+
+interface IGetRedirectsArgs {
+	params: IRedirectsQuery;
+	filters?: string;
+}
+
+export const getRedirects = createAsyncThunk(
+	"redirects/getRedirects",
+	async ({ params, filters }: IGetRedirectsArgs, { dispatch }) => {
+		// Empties the list before asking, as before: the table blanks instead of showing the
+		// previous page underneath the spinner.
+		dispatch(setRedirects([]));
+
+		return handleRequest(
+			async () => redirects.getRedirects(params, filters),
+			{
+				handleSuccess: ({ items, totalItems }: { items: IRedirect[]; totalItems: number }) => {
+					dispatch(setRedirects(items));
+					dispatch(setTotalItems(totalItems));
+				},
+				handleError: (response: unknown) => onError(response, dispatch),
+			},
+			[appActions.setIsLoading],
+		)(dispatch);
+	},
+);
+
+interface IRedirectForm {
+	from: string;
+	to: string | number;
+}
+
+interface IAddRedirectArgs {
+	redirect: IRedirectForm;
+	force?: boolean;
+	filter?: string;
+}
+
+export interface IAddRedirectResult {
+	saved: boolean;
+	/** The `from` already has a redirect (409). Not a failure — the screen offers to overwrite. */
+	isOriginTaken: boolean;
+}
+
+export const addRedirect = createAsyncThunk(
+	"redirects/addRedirect",
+	async ({ redirect, force, filter }: IAddRedirectArgs, { dispatch, getState }): Promise<IAddRedirectResult> => {
+		let isOriginTaken = false;
+
+		const saved = await handleRequest(
+			async () => redirects.createRedirect(redirect, force),
+			{
+				handleSuccess: () =>
+					dispatch(getRedirects({ params: { ...DEFAULT_PARAMS }, filters: scopedFilter(getState, filter) })),
+				handleError: (response: { status: number }) => {
+					if (response.status === ERROR_CODE.isBeingUsed) {
+						isOriginTaken = true;
+						return;
+					}
+					onError(response, dispatch);
+				},
+			},
+			[],
+		)(dispatch);
+
+		return { saved, isOriginTaken };
+	},
+);
+
+interface IUpdateRedirectArgs {
+	redirect: IRedirectForm;
+	redirectID: number;
+	filter?: string;
+}
+
+export const updateRedirect = createAsyncThunk(
+	"redirects/updateRedirect",
+	async ({ redirect, redirectID, filter }: IUpdateRedirectArgs, { dispatch, getState }) =>
+		handleRequest(
+			async () => redirects.updateRedirect(redirect, redirectID),
+			{
+				handleSuccess: () =>
+					dispatch(getRedirects({ params: { ...DEFAULT_PARAMS }, filters: scopedFilter(getState, filter) })),
+				handleError: (response: unknown) => onError(response, dispatch),
+			},
+			[],
+		)(dispatch),
+);
+
+interface IDeleteRedirectArgs {
+	redirectID: number | number[];
+	filter?: string;
+}
+
+export const deleteRedirect = createAsyncThunk(
+	"redirects/deleteRedirect",
+	async ({ redirectID, filter }: IDeleteRedirectArgs, { dispatch, getState }) =>
+		handleRequest(
+			async () =>
+				Array.isArray(redirectID) ? redirects.deleteRedirectsBulk(redirectID) : redirects.deleteRedirect(redirectID),
+			{
+				handleSuccess: () =>
+					dispatch(getRedirects({ params: { ...DEFAULT_PARAMS }, filters: scopedFilter(getState, filter) })),
+				handleError: (response: IMessageResponse) => onCountedError(response, dispatch, "delete"),
+			},
+			[appActions.setIsSaving],
+		)(dispatch),
+);
+
+interface IImportRedirectsArgs {
+	rows: IRedirectForm[];
+	/** First phase: ask the backend to classify the rows without writing anything. */
+	check: boolean;
+}
+
+export const importRedirects = createAsyncThunk(
+	"redirects/importRedirects",
+	async ({ rows, check }: IImportRedirectsArgs, { dispatch }) =>
+		handleRequest(
+			async () => (check ? redirects.createRedirectsBulkCheck(rows) : redirects.createRedirectsBulk(rows)),
+			{
+				handleSuccess: (data: { total: number } & NonNullable<IRedirectsState["imports"]>) => {
+					if (check) {
+						const { total, error, existing, ok } = data;
+						dispatch(setImports({ error, existing, ok }));
+						dispatch(setTotalImports(total));
+						return;
+					}
+					// Reloads UNFILTERED, unlike every other write. Kept as-is: after importing a
+					// batch the user is shown the whole catalogue, not the current site's slice.
+					dispatch(getRedirects({ params: { ...DEFAULT_PARAMS } }));
+				},
+				handleError: (response: IMessageResponse) => onCountedError(response, dispatch, "import"),
+			},
+			[],
+		)(dispatch),
+);

package/src/containers/Settings/Languages/index.tsx

@@ -1,4 +1,16 @@
-import * as languagesActions from "./actions";
-import { languagesReducer } from "./reducer";
+import { resetForm, setForm, updateFormValue } from "./slice";
+import { createSiteLanguage, deleteSiteLanguage, updateSiteLanguage } from "./thunks";
 
-export { languagesActions, languagesReducer };
+const languagesActions = {
+	setForm,
+	updateFormValue,
+	resetForm,
+	createSiteLanguage,
+	updateSiteLanguage,
+	deleteSiteLanguage,
+};
+
+export { languagesActions };
+
+export type { ILanguageState } from "./slice";
+export { languagesInitialState, languagesReducer } from "./slice";

package/src/containers/Settings/Languages/slice.ts

@@ -0,0 +1,48 @@
+import type { ISiteLanguage } from "@ax/types";
+
+import { createSlice, type PayloadAction } from "@reduxjs/toolkit";
+
+/**
+ * First area migrated to Redux Toolkit (UC-AX-manage-languages).
+ *
+ * The slice holds ONLY the language panel's form. The list of a site's languages
+ * lives in `sites.currentSiteLanguages` and the loading flags in `app`, which is
+ * why this area is so small — see docs/RTK-MIGRATION.md and the use case notes.
+ *
+ * `updateFormValue` and `resetForm` used to be thunks that read `getState()` to
+ * merge onto the current form; as reducers they express the same thing directly,
+ * so the public shape (name + argument) is unchanged for callers.
+ */
+export interface ILanguageState {
+	form: ISiteLanguage;
+}
+
+export const initialState: ILanguageState = {
+	form: {
+		language: null,
+		path: "",
+		domain: null,
+		isDefault: false,
+	},
+};
+
+const languagesSlice = createSlice({
+	name: "languages",
+	initialState,
+	reducers: {
+		setForm(state, action: PayloadAction<ISiteLanguage>) {
+			state.form = action.payload;
+		},
+		updateFormValue(state, action: PayloadAction<Partial<ISiteLanguage>>) {
+			state.form = { ...state.form, ...action.payload };
+		},
+		resetForm(state) {
+			state.form = initialState.form;
+		},
+	},
+});
+
+export const { setForm, updateFormValue, resetForm } = languagesSlice.actions;
+
+export { initialState as languagesInitialState };
+export const languagesReducer = languagesSlice.reducer;

package/src/containers/Settings/Languages/thunks.ts

@@ -0,0 +1,83 @@
+import { languages } from "@ax/api";
+import { appActions } from "@ax/containers/App";
+import { sitesActions } from "@ax/containers/Sites";
+import { handleRequest } from "@ax/helpers";
+import type { ISiteLanguage } from "@ax/types";
+
+import { createAsyncThunk } from "@reduxjs/toolkit";
+import type { Dispatch } from "redux";
+
+/**
+ * Write side of UC-AX-manage-languages, as createAsyncThunk.
+ *
+ * They keep calling `handleRequest` inside: that helper is the codebase's
+ * hand-rolled createAsyncThunk (152 call-sites) and owns the loading-flag and
+ * error-channel conventions. Replacing it is a cross-cutting job, not this
+ * area's — see docs/RTK-MIGRATION.md §5.
+ *
+ * What does change: the legacy versions wrapped everything in a `try/catch` whose
+ * body was `console.log(e) // TODO: capturar error bien`, swallowing failures.
+ * createAsyncThunk turns a throw into a `rejected` action instead, so the failure
+ * is at least observable in devtools rather than lost.
+ *
+ * Reads live in `sitesActions.getSiteLanguages` (the list belongs to `sites`), so
+ * every write refreshes through it, exactly as before.
+ */
+// Called through the namespaces rather than destructured at module scope: a
+// destructured reference is frozen at import time and cannot be spied on, which
+// would make the refresh-after-write behaviour untestable.
+const refreshList = (siteID: number, dispatch: Dispatch) => sitesActions.getSiteLanguages(siteID)(dispatch);
+
+const onError = (response: unknown, dispatch: Dispatch) => appActions.handleError(response)(dispatch);
+
+interface ISiteLanguageArgs {
+	siteID: number;
+	data: ISiteLanguage;
+}
+
+interface IDeleteSiteLanguageArgs {
+	siteID: number;
+	languageID: number;
+}
+
+export const createSiteLanguage = createAsyncThunk(
+	"languages/createSiteLanguage",
+	async ({ siteID, data }: ISiteLanguageArgs, { dispatch }) =>
+		handleRequest(
+			async () => languages.createSiteLanguage(siteID, data),
+			{
+				handleSuccess: () => refreshList(siteID, dispatch),
+				handleError: (response: unknown) => onError(response, dispatch),
+			},
+			[appActions.setIsSaving],
+		)(dispatch),
+);
+
+export const updateSiteLanguage = createAsyncThunk(
+	"languages/updateSiteLanguage",
+	async ({ siteID, data }: ISiteLanguageArgs, { dispatch }) =>
+		handleRequest(
+			async () => languages.updateSiteLanguage(siteID, data),
+			{
+				handleSuccess: () => refreshList(siteID, dispatch),
+				handleError: (response: unknown) => onError(response, dispatch),
+			},
+			[appActions.setIsSaving],
+		)(dispatch),
+);
+
+export const deleteSiteLanguage = createAsyncThunk(
+	"languages/deleteSiteLanguage",
+	// setIsLoading, not setIsSaving — kept as-is to preserve behaviour: the list
+	// view only renders <Loading /> off app.isLoading, so deleting shows the
+	// spinner while adding/editing does not. Inconsistency noted in the use case.
+	async ({ siteID, languageID }: IDeleteSiteLanguageArgs, { dispatch }) =>
+		handleRequest(
+			async () => languages.deleteSiteLanguage(siteID, languageID),
+			{
+				handleSuccess: () => refreshList(siteID, dispatch),
+				handleError: (response: unknown) => onError(response, dispatch),
+			},
+			[appActions.setIsLoading],
+		)(dispatch),
+);

package/src/containers/Settings/Social/index.tsx

@@ -1,4 +1,12 @@
-import * as socialActions from "./actions";
-import { socialReducer } from "./reducer";
+import { setSocial } from "./slice";
+import { getSocial, saveSocial } from "./thunks";
 
-export { socialActions, socialReducer };
+const socialActions = {
+	setSocial,
+	getSocial,
+	saveSocial,
+};
+
+export { socialActions };
+
+export { socialInitialState, socialReducer } from "./slice";

package/src/containers/Settings/Social/slice.ts

@@ -0,0 +1,40 @@
+import type { ISocialState } from "@ax/types";
+
+import { createSlice, type PayloadAction } from "@reduxjs/toolkit";
+
+/**
+ * The `social` area holds one site's social profile URLs (and the two things filed
+ * alongside them, newsletter and podcast) as a flat `{ network: url }` map —
+ * UC-AX-configure-social-networks. No types, order or icons: the screen is a plain
+ * form of URL text fields saved in a single PUT, and the set of fields comes from the
+ * instance config plus a hardcoded list, not from the state.
+ *
+ * `ISocialState` stays in `@ax/types` rather than moving next to the slice as
+ * `ILanguageState` and `IAnalyticsState` did: seven preview components use it as a
+ * prop type, so it is a shared domain type that happens to also be this area's state.
+ *
+ * STAYS in redux-persist, against the rule of ADR 0002: six page-editor screens read
+ * `state.social` to feed the preview canvas and none of them fetches — only
+ * `sites.setSiteInfo` writes it outside this screen, and that does not re-run on a hard
+ * refresh. The persist was their loader. Leaves in waves 2-4 with those consumers.
+ */
+export const initialState: ISocialState = {};
+
+const socialSlice = createSlice({
+	name: "social",
+	initialState,
+	reducers: {
+		// REPLACES, it does not merge — the opposite of its `analytics` sibling. The
+		// legacy reducer returned `{ ...payload }` and the screen leans on it: since
+		// "removing" a network means emptying its field and saving, a key the server
+		// drops has to drop out of the store too.
+		setSocial(_state, action: PayloadAction<ISocialState>) {
+			return { ...action.payload };
+		},
+	},
+});
+
+export const { setSocial } = socialSlice.actions;
+
+export { initialState as socialInitialState };
+export const socialReducer = socialSlice.reducer;

package/src/containers/Settings/Social/thunks.ts

@@ -0,0 +1,68 @@
+import { social } from "@ax/api";
+import { appActions } from "@ax/containers/App";
+import { handleRequest } from "@ax/helpers";
+import type { IRootState, ISocialState } from "@ax/types";
+
+import { createAsyncThunk } from "@reduxjs/toolkit";
+import type { Dispatch } from "redux";
+
+import { setSocial } from "./slice";
+
+/**
+ * Read and write side of UC-AX-configure-social-networks, as createAsyncThunk.
+ *
+ * They keep calling `handleRequest` inside for the same reason the Languages pilot
+ * does: that helper owns the loading-flag and error-channel conventions of the whole
+ * codebase, and replacing it is a cross-cutting job — see docs/RTK-MIGRATION.md §5.
+ *
+ * Both keep reading the site from `sites.currentSiteInfo` instead of taking it as an
+ * argument, exactly as the legacy thunks did. This area has a single scope — whatever
+ * site is loaded — so there is nothing to make explicit the way Analytics had to with
+ * its global scope, and no call site pays the single-argument rule here.
+ *
+ * What does change: the legacy versions wrapped everything in a `try/catch` whose
+ * body was `console.log(e)`, swallowing failures. createAsyncThunk turns a throw into
+ * a `rejected` action instead, so the failure is observable.
+ */
+// Called through the namespace rather than destructured at module scope: a
+// destructured reference is frozen at import time and cannot be spied on.
+const onError = (response: unknown, dispatch: Dispatch) => appActions.handleError(response)(dispatch);
+
+// `currentSiteInfo` is typed `ISite | null`, which the legacy thunks never had to face
+// because they read it through an untyped `getState` — on a null site they built the
+// url off `undefined` and threw, and their `try/catch` swallowed it. The screen only
+// exists inside a loaded site, so the guard below is unreachable in practice; it is
+// there so the impossible case cannot turn into a request to `/site/undefined/socials`.
+const siteOf = (getState: () => unknown) => (getState() as IRootState).sites.currentSiteInfo;
+
+export const getSocial = createAsyncThunk<boolean, void>("social/getSocial", async (_arg, { dispatch, getState }) => {
+	const site = siteOf(getState);
+	if (!site) return false;
+
+	return handleRequest(
+		async () => social.getSocial(site.id),
+		{
+			handleSuccess: (data: ISocialState) => dispatch(setSocial(data)),
+			// No error channel on the read side, as before: the failure only reaches the
+			// console and the form is left empty. Wart documented in the use case.
+			handleError: () => console.log("Error en getSocial"),
+		},
+		[appActions.setIsLoading],
+	)(dispatch);
+});
+
+export const saveSocial = createAsyncThunk("social/saveSocial", async (form: ISocialState, { dispatch, getState }) => {
+	const site = siteOf(getState);
+	if (!site) return false;
+
+	return handleRequest(
+		// The whole map goes out in one PUT, emptied fields included — that is what
+		// makes clearing a field remove the network.
+		async () => social.updateSocial(site.id, form),
+		{
+			handleSuccess: (data: ISocialState) => dispatch(setSocial(data)),
+			handleError: (response: unknown) => onError(response, dispatch),
+		},
+		[appActions.setIsSaving],
+	)(dispatch);
+});

package/src/containers/Sites/actions.tsx

@@ -9,6 +9,7 @@ import { socialActions } from "@ax/containers/Settings/Social";
 import { structuredDataActions } from "@ax/containers/StructuredData";
 import { usersActions } from "@ax/containers/Users";
 import { getDefaultTheme, getThemeElements, handleRequest, isReqOk, sortBy } from "@ax/helpers";
+import type { AppDispatch } from "@ax/store";
 import type {
 	IGetGlobalPagesParams,
 	IGetSitePagesParams,
@@ -357,7 +358,7 @@ function setSiteInfo(currentSiteInfo: ISite): (dispatch: Dispatch, getState: ()
 
 			// get analytics
 			const analyticsResponse: any = await analytics.getAnalytics(currentSiteInfo.id);
-			if (isReqOk(socialResponse.status)) {
+			if (isReqOk(analyticsResponse.status)) {
 				dispatch(analyticsActions.setAnalytics(analyticsResponse.data));
 			} else {
 				console.log("Error en sites getAnalytics");
@@ -569,7 +570,10 @@ function resetSiteValues(siteID: number): (dispatch: Dispatch) => void {
 		resetMenuValues(dispatch);
 		dispatch(setCurrentSitePages([]));
 		dispatch(setTotalItems(0));
-		getAnalytics(siteID)(dispatch);
+		// `analytics` is already on RTK while `sites` is not (wave 3), so its thunk is
+		// dispatched, not invoked by hand: a createAsyncThunk expects the full
+		// (dispatch, getState, extra) triple. The cast is the seam between the two.
+		(dispatch as AppDispatch)(getAnalytics(siteID));
 		dispatch(setCurrentSearch(""));
 		dispatch(setThemeElements(null));
 	};

package/src/index.tsx

@@ -1,17 +1,18 @@
 import React from "react";
-import ReactDOM from "react-dom/client";
 import { Provider } from "react-redux";
+import { Router } from "react-router-dom";
+
+import ReactDOM from "react-dom/client";
 import { PersistGate } from "redux-persist/integration/react";
-import history from "./routes/history";
-import { ConnectedRouter } from "connected-react-router";
 
 import { GlobalStore } from "./GlobalStore";
 import App from "./modules/App";
+import history from "./routes/history";
 
 export class Main {
 	public static start(): void {
 		const globalStore = new GlobalStore();
-		const configStore = globalStore.configureStore(history);
+		const configStore = globalStore.configureStore();
 
 		const container = document.getElementById("root");
 		if (!container) throw new Error("Failed to find the root element");
@@ -19,11 +20,11 @@ export class Main {
 
 		root.render(
 			<Provider store={configStore.store}>
-				<ConnectedRouter history={history}>
+				<Router history={history}>
 					<PersistGate loading={undefined} persistor={configStore.persistor}>
 						<App />
 					</PersistGate>
-				</ConnectedRouter>
+				</Router>
 			</Provider>,
 		);
 	}

package/src/modules/ActivityLog/ItemLog/EventItem/index.tsx

@@ -1,6 +1,5 @@
 import type React from "react";
 import { useState } from "react";
-import { connect } from "react-redux";
 
 import { Avatar, RestoreModal, Tag, TruncatedTooltip } from "@ax/components";
 import { activityLogActions } from "@ax/containers/ActivityLog";
@@ -8,9 +7,9 @@ import { navigationActions } from "@ax/containers/Navigation";
 import { pageEditorActions } from "@ax/containers/PageEditor";
 import { structuredDataActions } from "@ax/containers/StructuredData";
 import { useModal } from "@ax/hooks";
-import type { IRootState } from "@ax/types";
+import { useAppDispatch, useAppSelector } from "@ax/store";
 
-import type { LogActivityDTO, LogContentDTO, LogContentTypeDTO } from "@griddo/api-types";
+import type { LogActivityDTO } from "@griddo/api-types";
 
 import { eventKey } from "../../constants";
 import DetailModal from "../../DetailModal";
@@ -19,9 +18,12 @@ import { getContentTypeSchemaVersion, getPageSchemaVersion } from "../../utils";
 import * as S from "./style";
 
 const EventItem = (props: IEventItemProps) => {
-	const { item, schemaVersion, restorePage, restoreNavigation, restoreStructuredData, goToLogContent, getLog } = props;
+	const { item, getLog } = props;
 	const { user, created, site, contentType, content, eventType } = item;
 
+	const dispatch = useAppDispatch();
+	const schemaVersion = useAppSelector((state) => state.structuredData.schemaVersion);
+
 	const { isOpen: isDetailOpen, toggleModal: toggleDetailModal } = useModal();
 	const { isOpen: isRestoreOpen, toggleModal: toggleRestoreModal } = useModal();
 	const [schemaChange, setSchemaChange] = useState(false);
@@ -32,14 +34,14 @@ const EventItem = (props: IEventItemProps) => {
 		switch (type) {
 			case eventKey.DELETED_PAGE:
 			case eventKey.DELETED_CONTENT_TYPE_PAGE:
-				return await restorePage(id);
+				return await dispatch(pageEditorActions.restorePage(id));
 			case eventKey.DELETED_HEADER:
-				return await restoreNavigation(id, "header");
+				return await dispatch(navigationActions.restoreNavigation(id, "header"));
 			case eventKey.DELETED_FOOTER:
-				return await restoreNavigation(id, "footer");
+				return await dispatch(navigationActions.restoreNavigation(id, "footer"));
 			case eventKey.DELETED_CATEGORY:
 			case eventKey.DELETED_CONTENT_TYPE:
-				return await restoreStructuredData(id);
+				return await dispatch(structuredDataActions.restoreStructuredDataContent(id));
 			default:
 				return false;
 		}
@@ -83,12 +85,12 @@ const EventItem = (props: IEventItemProps) => {
 	const handleClick = (e: React.MouseEvent<HTMLDivElement>) => {
 		e.stopPropagation();
 		const siteID = site?.id || null;
-		goToLogContent(contentType, content, siteID);
+		dispatch(activityLogActions.goToLogContent({ contentType, content, site: siteID }));
 	};
 
 	const handleKeyDown = () => {
 		const siteID = site?.id || null;
-		goToLogContent(contentType, content, siteID);
+		dispatch(activityLogActions.goToLogContent({ contentType, content, site: siteID }));
 	};
 
 	return (
@@ -152,23 +154,7 @@ const EventItem = (props: IEventItemProps) => {
 
 interface IEventItemProps {
 	item: LogActivityDTO;
-	schemaVersion: string;
-	restorePage(id: number): Promise<boolean>;
-	restoreNavigation(navID: number, type: string): Promise<boolean>;
-	restoreStructuredData(dataID: number): Promise<boolean>;
-	goToLogContent(contentType: LogContentTypeDTO | null, content: LogContentDTO | null, site: number | null): void;
 	getLog(): void;
 }
 
-const mapStateToProps = (state: IRootState) => ({
-	schemaVersion: state.structuredData.schemaVersion,
-});
-
-const mapDispatchToProps = {
-	restorePage: pageEditorActions.restorePage,
-	restoreNavigation: navigationActions.restoreNavigation,
-	restoreStructuredData: structuredDataActions.restoreStructuredDataContent,
-	goToLogContent: activityLogActions.goToLogContent,
-};
-
-export default connect(mapStateToProps, mapDispatchToProps)(EventItem);
+export default EventItem;