Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Modernize redux: eventSlice #266

Merged
merged 7 commits into from
Feb 16, 2024
Merged

Modernize redux: eventSlice #266

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
50553aa
Fix addNotification([...]) typing
Arnei Dec 19, 2023
4819aa5
Move aclsTableMap into its own file
Arnei Dec 21, 2023
351eff8
Move eventsTableMap into its own file
Arnei Dec 21, 2023
ac3473f
Modernize redux: eventSlice
Arnei Jan 10, 2024
1d3efa1
Add typing for event result
Arnei Feb 13, 2024
9ea13e8
Fix event table crashing when changing columns
Arnei Feb 14, 2024
6fdff30
Fix table filters in event table
Arnei Feb 14, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
95 changes: 0 additions & 95 deletions app/src/actions/eventActions.ts
View file
Open in desktop

This file was deleted.

56 changes: 23 additions & 33 deletions app/src/components/events/Events.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,7 @@ import DeleteEventsModal from "./partials/modals/DeleteEventsModal";
import StartTaskModal from "./partials/modals/StartTaskModal";
import EditScheduledEventsModal from "./partials/modals/EditScheduledEventsModal";
import EditMetadataEventsModal from "./partials/modals/EditMetadataEventsModal";
import { eventsTemplateMap } from "../../configs/tableConfigs/eventsTableConfig";
import { fetchEventMetadata, fetchEvents } from "../../thunks/eventThunks";
import { eventsTemplateMap } from "../../configs/tableConfigs/eventsTableMap";
import {
loadEventsIntoTable,
loadSeriesIntoTable,
Expand All @@ -23,8 +22,7 @@ import { fetchSeries } from "../../thunks/seriesThunks";
import { fetchFilters, fetchStats } from "../../thunks/tableFilterThunks";
import {
getTotalEvents,
isFetchingAssetUploadOptions,
isLoading,
isFetchingAssetUploadOptions as getIsFetchingAssetUploadOptions,
isShowActions,
} from "../../selectors/eventSelectors";
import { editTextFilter } from "../../actions/tableFilterActions";
Expand All @@ -34,11 +32,16 @@ import Header from "../Header";
import Footer from "../Footer";
import { getUserInformation } from "../../selectors/userInfoSelectors";
import { hasAccess } from "../../utils/utils";
import { showActions } from "../../actions/eventActions";
import { GlobalHotKeys } from "react-hotkeys";
import { availableHotkeys } from "../../configs/hotkeysConfig";
import { getCurrentFilterResource } from "../../selectors/tableFilterSelectors";
import { fetchAssetUploadOptions } from "../../thunks/assetsThunks";
import { useAppDispatch, useAppSelector } from "../../store";
import {
fetchEventMetadata,
fetchEvents,
setShowActions,
} from "../../slices/eventSlice";

// References for detecting a click outside of the container of the dropdown menu
const containerAction = React.createRef();
Expand All @@ -47,14 +50,8 @@ const containerAction = React.createRef();
* This component renders the table view of events
*/
const Events = ({
// @ts-expect-error TS(7031): Binding element 'loadingEvents' implicitly has an ... Remove this comment to see the full error message
loadingEvents,
// @ts-expect-error TS(7031): Binding element 'loadingEventsIntoTable' implicitl... Remove this comment to see the full error message
loadingEventsIntoTable,
// @ts-expect-error TS(7031): Binding element 'events' implicitly has an 'any' t... Remove this comment to see the full error message
events,
// @ts-expect-error TS(7031): Binding element 'showActions' implicitly has an 'a... Remove this comment to see the full error message
showActions,
// @ts-expect-error TS(7031): Binding element 'loadingSeries' implicitly has an ... Remove this comment to see the full error message
loadingSeries,
// @ts-expect-error TS(7031): Binding element 'loadingSeriesIntoTable' implicitl... Remove this comment to see the full error message
Expand All @@ -63,24 +60,17 @@ const Events = ({
loadingFilters,
// @ts-expect-error TS(7031): Binding element 'loadingStats' implicitly has an '... Remove this comment to see the full error message
loadingStats,
// @ts-expect-error TS(7031): Binding element 'loadingEventMetadata' implicitly ... Remove this comment to see the full error message
loadingEventMetadata,
// @ts-expect-error TS(7031): Binding element 'resetTextFilter' implicitly has a... Remove this comment to see the full error message
resetTextFilter,
// @ts-expect-error TS(7031): Binding element 'fetchAssetUploadOptions' implicit... Remove this comment to see the full error message
fetchAssetUploadOptions,
// @ts-expect-error TS(7031): Binding element 'resetOffset' implicitly has an 'a... Remove this comment to see the full error message
resetOffset,
// @ts-expect-error TS(7031): Binding element 'setShowActions' implicitly has an... Remove this comment to see the full error message
setShowActions,
// @ts-expect-error TS(7031): Binding element 'user' implicitly has an 'any' typ... Remove this comment to see the full error message
user,
// @ts-expect-error TS(7031): Binding element 'isFetchingAssetUploadOptions' imp... Remove this comment to see the full error message
isFetchingAssetUploadOptions,
// @ts-expect-error TS(7031): Binding element 'currentFilterType' implicitly has... Remove this comment to see the full error message
currentFilterType,
}) => {
const { t } = useTranslation();
const dispatch = useAppDispatch();
const [displayActionMenu, setActionMenu] = useState(false);
const [displayNavigation, setNavigation] = useState(false);
const [displayNewEventModal, setNewEventModal] = useState(false);
Expand All @@ -94,14 +84,23 @@ const Events = ({
false
);

const showActions = useAppSelector(state => isShowActions(state));
const events = useAppSelector(state => getTotalEvents(state));
const isFetchingAssetUploadOptions = useAppSelector(state => getIsFetchingAssetUploadOptions(state));

let location = useLocation();

// TODO: Get rid of the wrappers when modernizing redux is done
const fetchEventsWrapper = () => {
dispatch(fetchEvents())
}

const loadEvents = async () => {
// Fetching stats from server
loadingStats();

// Fetching events from server
await loadingEvents();
// await dispatch(fetchEvents());

// Load events into table
loadingEventsIntoTable();
Expand All @@ -126,7 +125,7 @@ const Events = ({
resetTextFilter();

// disable actions button
setShowActions(false);
dispatch(setShowActions(false));

// Load events on mount
loadEvents().then((r) => console.info(r));
Expand Down Expand Up @@ -167,8 +166,8 @@ const Events = ({
};

const showNewEventModal = async () => {
await loadingEventMetadata();
await fetchAssetUploadOptions();
await dispatch(fetchEventMetadata());
await dispatch(fetchAssetUploadOptions());

setNewEventModal(true);
};
Expand Down Expand Up @@ -325,7 +324,7 @@ const Events = ({

{/* Include filters component*/}
<TableFilters
loadResource={loadingEvents}
loadResource={fetchEventsWrapper}
loadResourceIntoTable={loadingEventsIntoTable}
resource={"events"}
/>
Expand All @@ -345,30 +344,21 @@ const Events = ({
// Getting state data out of redux store
// @ts-expect-error TS(7006): Parameter 'state' implicitly has an 'any' type.
const mapStateToProps = (state) => ({
events: getTotalEvents(state),
showActions: isShowActions(state),
user: getUserInformation(state),
currentFilterType: getCurrentFilterResource(state),
isLoadingEvents: isLoading(state),
isFetchingAssetUploadOptions: isFetchingAssetUploadOptions(state),
});

// Mapping actions to dispatch
// @ts-expect-error TS(7006): Parameter 'dispatch' implicitly has an 'any' type.
const mapDispatchToProps = (dispatch) => ({
loadingEvents: () => dispatch(fetchEvents()),
loadingEventsIntoTable: () => dispatch(loadEventsIntoTable()),
loadingSeries: () => dispatch(fetchSeries()),
loadingSeriesIntoTable: () => dispatch(loadSeriesIntoTable()),
// @ts-expect-error TS(7006): Parameter 'resource' implicitly has an 'any' type.
loadingFilters: (resource) => dispatch(fetchFilters(resource)),
loadingStats: () => dispatch(fetchStats()),
loadingEventMetadata: () => dispatch(fetchEventMetadata()),
resetTextFilter: () => dispatch(editTextFilter("")),
resetOffset: () => dispatch(setOffset(0)),
// @ts-expect-error TS(7006): Parameter 'isShowing' implicitly has an 'any' type... Remove this comment to see the full error message
setShowActions: (isShowing) => dispatch(showActions(isShowing)),
fetchAssetUploadOptions: () => dispatch(fetchAssetUploadOptions()),
});

export default connect(mapStateToProps, mapDispatchToProps)(Events);
9 changes: 4 additions & 5 deletions app/src/components/events/Series.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,6 @@ import {
loadEventsIntoTable,
loadSeriesIntoTable,
} from "../../thunks/tableThunks";
import { fetchEvents } from "../../thunks/eventThunks";
import { fetchFilters, fetchStats } from "../../thunks/tableFilterThunks";
import { getTotalSeries, isShowActions } from "../../selectors/seriesSeletctor";
import { editTextFilter } from "../../actions/tableFilterActions";
Expand All @@ -33,6 +32,8 @@ import { showActions } from "../../actions/seriesActions";
import { availableHotkeys } from "../../configs/hotkeysConfig";
import { GlobalHotKeys } from "react-hotkeys";
import { getCurrentFilterResource } from "../../selectors/tableFilterSelectors";
import { useAppDispatch } from "../../store";
import { fetchEvents } from "../../slices/eventSlice";

// References for detecting a click outside of the container of the dropdown menu
const containerAction = React.createRef();
Expand All @@ -47,8 +48,6 @@ const Series = ({
loadingSeries,
// @ts-expect-error TS(7031): Binding element 'loadingSeriesIntoTable' implicitl... Remove this comment to see the full error message
loadingSeriesIntoTable,
// @ts-expect-error TS(7031): Binding element 'loadingEvents' implicitly has an ... Remove this comment to see the full error message
loadingEvents,
// @ts-expect-error TS(7031): Binding element 'loadingEventsIntoTable' implicitl... Remove this comment to see the full error message
loadingEventsIntoTable,
// @ts-expect-error TS(7031): Binding element 'series' implicitly has an 'any' t... Remove this comment to see the full error message
Expand All @@ -73,6 +72,7 @@ const Series = ({
currentFilterType,
}) => {
const { t } = useTranslation();
const dispatch = useAppDispatch();
const [displayActionMenu, setActionMenu] = useState(false);
const [displayNavigation, setNavigation] = useState(false);
const [displayNewSeriesModal, setNewSeriesModal] = useState(false);
Expand All @@ -88,7 +88,7 @@ const Series = ({
loadingStats();

// Fetching events from server
loadingEvents();
dispatch(fetchEvents());

// Load events into table
loadingEventsIntoTable();
Expand Down Expand Up @@ -284,7 +284,6 @@ const mapStateToProps = (state) => ({
const mapDispatchToProps = (dispatch) => ({
loadingSeries: () => dispatch(fetchSeries()),
loadingSeriesIntoTable: () => dispatch(loadSeriesIntoTable()),
loadingEvents: () => dispatch(fetchEvents()),
loadingEventsIntoTable: () => dispatch(loadEventsIntoTable()),
// @ts-expect-error TS(7006): Parameter 'resource' implicitly has an 'any' type.
loadingFilters: (resource) => dispatch(fetchFilters(resource)),
Expand Down
10 changes: 4 additions & 6 deletions app/src/components/events/partials/EventActionCell.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import React, { useState } from "react";
import { useTranslation } from "react-i18next";
import ConfirmModal from "../../shared/ConfirmModal";
import { deleteEvent } from "../../../thunks/eventThunks";
import { connect } from "react-redux";
import EventDetailsModal from "./modals/EventDetailsModal";
import EmbeddingCodeModal from "./modals/EmbeddingCodeModal";
Expand All @@ -15,15 +14,15 @@ import {
fetchSeriesDetailsMetadata,
fetchSeriesDetailsTheme,
} from "../../../thunks/seriesDetailsThunks";
import { useAppDispatch } from "../../../store";
import { deleteEvent } from "../../../slices/eventSlice";

/**
* This component renders the action cells of events in the table view
*/
const EventActionCell = ({
// @ts-expect-error TS(7031): Binding element 'row' implicitly has an 'any' type... Remove this comment to see the full error message
row,
// @ts-expect-error TS(7031): Binding element 'deleteEvent' implicitly has an 'a... Remove this comment to see the full error message
deleteEvent,
// @ts-expect-error TS(7031): Binding element 'fetchSeriesDetailsMetadata' impli... Remove this comment to see the full error message
fetchSeriesDetailsMetadata,
// @ts-expect-error TS(7031): Binding element 'fetchSeriesDetailsAcls' implicitl... Remove this comment to see the full error message
Expand All @@ -38,6 +37,7 @@ const EventActionCell = ({
user,
}) => {
const { t } = useTranslation();
const dispatch = useAppDispatch();

const [displayDeleteConfirmation, setDeleteConfirmation] = useState(false);
const [displayEventDetailsModal, setEventDetailsModal] = useState(false);
Expand All @@ -51,7 +51,7 @@ const EventActionCell = ({

// @ts-expect-error TS(7006): Parameter 'id' implicitly has an 'any' type.
const deletingEvent = (id) => {
deleteEvent(id);
dispatch(deleteEvent(id));
};

const hideEmbeddingCodeModal = () => {
Expand Down Expand Up @@ -252,8 +252,6 @@ const mapStateToProps = (state) => ({
// Mapping actions to dispatch
// @ts-expect-error TS(7006): Parameter 'dispatch' implicitly has an 'any' type.
const mapDispatchToProps = (dispatch) => ({
// @ts-expect-error TS(7006): Parameter 'id' implicitly has an 'any' type.
deleteEvent: (id) => dispatch(deleteEvent(id)),
// @ts-expect-error TS(7006): Parameter 'id' implicitly has an 'any' type.
fetchSeriesDetailsMetadata: (id) => dispatch(fetchSeriesDetailsMetadata(id)),
// @ts-expect-error TS(7006): Parameter 'id' implicitly has an 'any' type.
Expand Down
Loading
Loading