Fixed: Calendar Items Show on Correct Day

frontend/src/Calendar/Agenda/Agenda.js

@@ -13,14 +13,14 @@ function Agenda(props) {
     <div className={styles.agenda}>
       {
         items.map((item, index) => {
-          const momentDate = moment(item.airDateUtc);
+          const momentDate = moment(item.inCinemas);
           const showDate = index === 0 ||
-            !moment(items[index - 1].airDateUtc).isSame(momentDate, 'day');
+            !moment(items[index - 1].inCinemas).isSame(momentDate, 'day');
 
           return (
             <AgendaEventConnector
               key={item.id}
-              episodeId={item.id}
+              movieId={item.id}
               showDate={showDate}
               {...item}
             />

frontend/src/Calendar/Agenda/AgendaEvent.css

@@ -30,8 +30,7 @@
   border: none !important;
 }
 
-.seriesTitle,
+.movieTitle {
-.episodeTitle {
   @add-mixin truncate;
 
   flex: 0 1 300px;

frontend/src/Calendar/Agenda/AgendaEvent.js

@@ -78,7 +78,7 @@ class AgendaEvent extends Component {
               colorImpairedMode && 'colorImpaired'
             )}
           >
-            <div className={styles.seriesTitle}>
+            <div className={styles.movieTitle}>
               <MovieTitleLink
                 titleSlug={titleSlug}
                 title={title}

frontend/src/Calendar/Agenda/AgendaEventConnector.js

@@ -13,10 +13,10 @@ function createMapStateToProps() {
     createMovieFileSelector(),
     createQueueItemSelector(),
     createUISettingsSelector(),
-    (calendarOptions, series, episodeFile, queueItem, uiSettings) => {
+    (calendarOptions, movie, movieFile, queueItem, uiSettings) => {
       return {
-        series,
+        movie,
-        episodeFile,
+        movieFile,
         queueItem,
         ...calendarOptions,
         timeFormat: uiSettings.timeFormat,

frontend/src/Calendar/CalendarConnector.js

@@ -76,15 +76,15 @@ class CalendarConnector extends Component {
     } = this.props;
 
     if (hasDifferentItems(prevProps.items, items)) {
-      const episodeIds = selectUniqueIds(items, 'id');
+      const movieIds = selectUniqueIds(items, 'id');
-      const episodeFileIds = selectUniqueIds(items, 'episodeFileId');
+      const movieFileIds = selectUniqueIds(items, 'movieFileId');
 
       if (items.length) {
-        this.props.fetchQueueDetails({ episodeIds });
+        this.props.fetchQueueDetails({ movieIds });
       }
 
-      if (episodeFileIds.length) {
+      if (movieFileIds.length) {
-        this.props.fetchMovieFiles({ episodeFileIds });
+        this.props.fetchMovieFiles({ movieFileIds });
       }
     }
 

frontend/src/Calendar/CalendarPage.js

@@ -60,11 +60,11 @@ class CalendarPage extends Component {
 
   onSearchMissingPress = () => {
     const {
-      missingEpisodeIds,
+      missingMovieIds,
       onSearchMissingPress
     } = this.props;
 
-    onSearchMissingPress(missingEpisodeIds);
+    onSearchMissingPress(missingMovieIds);
   }
 
   //
@@ -75,7 +75,7 @@ class CalendarPage extends Component {
       selectedFilterKey,
       filters,
       hasMovie,
-      missingEpisodeIds,
+      missingMovieIds,
       isSearchingForMissing,
       useCurrentPage,
       onFilterSelect
@@ -102,7 +102,7 @@ class CalendarPage extends Component {
             <PageToolbarButton
               label="Search for Missing"
               iconName={icons.SEARCH}
-              isDisabled={!missingEpisodeIds.length}
+              isDisabled={!missingMovieIds.length}
               isSpinning={isSearchingForMissing}
               onPress={this.onSearchMissingPress}
             />
@@ -167,7 +167,7 @@ CalendarPage.propTypes = {
   selectedFilterKey: PropTypes.string.isRequired,
   filters: PropTypes.arrayOf(PropTypes.object).isRequired,
   hasMovie: PropTypes.bool.isRequired,
-  missingEpisodeIds: PropTypes.arrayOf(PropTypes.number).isRequired,
+  missingMovieIds: PropTypes.arrayOf(PropTypes.number).isRequired,
   isSearchingForMissing: PropTypes.bool.isRequired,
   useCurrentPage: PropTypes.bool.isRequired,
   onSearchMissingPress: PropTypes.func.isRequired,

frontend/src/Calendar/CalendarPageConnector.js

@@ -10,24 +10,24 @@ import createUISettingsSelector from 'Store/Selectors/createUISettingsSelector';
 import createCommandsSelector from 'Store/Selectors/createCommandsSelector';
 import CalendarPage from './CalendarPage';
 
-function createMissingEpisodeIdsSelector() {
+function createMissingMovieIdsSelector() {
   return createSelector(
     (state) => state.calendar.start,
     (state) => state.calendar.end,
     (state) => state.calendar.items,
     (state) => state.queue.details.items,
-    (start, end, episodes, queueDetails) => {
+    (start, end, movies, queueDetails) => {
-      return episodes.reduce((acc, episode) => {
+      return movies.reduce((acc, movie) => {
-        const airDateUtc = episode.airDateUtc;
+        const inCinemas = movie.inCinemas;
 
         if (
-          !episode.episodeFileId &&
+          !movie.movieFileId &&
-          moment(airDateUtc).isAfter(start) &&
+          moment(inCinemas).isAfter(start) &&
-          moment(airDateUtc).isBefore(end) &&
+          moment(inCinemas).isBefore(end) &&
-          isBefore(episode.airDateUtc) &&
+          isBefore(movie.inCinemas) &&
-          !queueDetails.some((details) => !!details.episode && details.episode.id === episode.id)
+          !queueDetails.some((details) => !!details.movie && details.movie.id === movie.id)
         ) {
-          acc.push(episode.id);
+          acc.push(movie.id);
         }
 
         return acc;
@@ -58,14 +58,14 @@ function createMapStateToProps() {
     (state) => state.calendar.filters,
     createMovieCountSelector(),
     createUISettingsSelector(),
-    createMissingEpisodeIdsSelector(),
+    createMissingMovieIdsSelector(),
     createIsSearchingSelector(),
     (
       selectedFilterKey,
       filters,
       movieCount,
       uiSettings,
-      missingEpisodeIds,
+      missingMovieIds,
       isSearchingForMissing
     ) => {
       return {
@@ -73,7 +73,7 @@ function createMapStateToProps() {
         filters,
         colorImpairedMode: uiSettings.enableColorImpairedMode,
         hasMovie: !!movieCount,
-        missingEpisodeIds,
+        missingMovieIds,
         isSearchingForMissing
       };
     }
@@ -82,8 +82,8 @@ function createMapStateToProps() {
 
 function createMapDispatchToProps(dispatch, props) {
   return {
-    onSearchMissingPress(episodeIds) {
+    onSearchMissingPress(movieIds) {
-      dispatch(searchMissing({ episodeIds }));
+      dispatch(searchMissing({ movieIds }));
     },
 
     onDaysCountChange(dayCount) {

frontend/src/Calendar/Day/CalendarDay.js

@@ -4,7 +4,6 @@ import React from 'react';
 import classNames from 'classnames';
 import * as calendarViews from 'Calendar/calendarViews';
 import CalendarEventConnector from 'Calendar/Events/CalendarEventConnector';
-import CalendarEventGroupConnector from 'Calendar/Events/CalendarEventGroupConnector';
 import styles from './CalendarDay.css';
 
 function CalendarDay(props) {
@@ -37,20 +36,10 @@ function CalendarDay(props) {
       <div>
         {
           events.map((event) => {
-            if (event.isGroup) {
-              return (
-                <CalendarEventGroupConnector
-                  key={event.seriesId}
-                  {...event}
-                  onEventModalOpenToggle={onEventModalOpenToggle}
-                />
-              );
-            }
-
             return (
               <CalendarEventConnector
                 key={event.id}
-                episodeId={event.id}
+                movieId={event.id}
                 {...event}
                 onEventModalOpenToggle={onEventModalOpenToggle}
               />

frontend/src/Calendar/Day/CalendarDayConnector.js

@@ -9,10 +9,10 @@ import CalendarDay from './CalendarDay';
 function sort(items) {
   return _.sortBy(items, (item) => {
     if (item.isGroup) {
-      return moment(item.events[0].airDateUtc).unix();
+      return moment(item.events[0].inCinemas).unix();
     }
 
-    return moment(item.airDateUtc).unix();
+    return moment(item.inCinemas).unix();
   });
 }
 
@@ -20,39 +20,13 @@ function createCalendarEventsConnector() {
   return createSelector(
     (state, { date }) => date,
     (state) => state.calendar.items,
-    (state) => state.calendar.options.collapseMultipleEpisodes,
+    (date, items) => {
-    (date, items, collapseMultipleEpisodes) => {
       const filtered = _.filter(items, (item) => {
-        return moment(date).isSame(moment(item.airDateUtc), 'day');
+        return moment(date).isSame(moment(item.inCinemas), 'day');
       });
 
-      if (!collapseMultipleEpisodes) {
       return sort(filtered);
     }
-
-      const groupedObject = _.groupBy(filtered, (item) => `${item.seriesId}-${item.seasonNumber}`);
-      const grouped = [];
-
-      Object.keys(groupedObject).forEach((key) => {
-        const events = groupedObject[key];
-
-        if (events.length === 1) {
-          grouped.push(events[0]);
-        } else {
-          grouped.push({
-            isGroup: true,
-            seriesId: events[0].seriesId,
-            seasonNumber: events[0].seasonNumber,
-            episodeIds: events.map((event) => event.id),
-            events: _.sortBy(events, (item) => moment(item.airDateUtc).unix())
-          });
-        }
-      });
-
-      const sorted = sort(grouped);
-
-      return sorted;
-    }
   );
 }
 

frontend/src/Calendar/Legend/Legend.js

@@ -52,13 +52,13 @@ function Legend(props) {
       <div>
         <LegendItem
           status="unaired"
-          tooltip="Episode hasn't aired yet"
+          tooltip="Movie hasn't aired yet"
           colorImpairedMode={colorImpairedMode}
         />
 
         <LegendItem
           status="unmonitored"
-          tooltip="Episode is unmonitored"
+          tooltip="Movie is unmonitored"
           colorImpairedMode={colorImpairedMode}
         />
       </div>
@@ -66,13 +66,13 @@ function Legend(props) {
       <div>
         <LegendItem
           status="downloading"
-          tooltip="Episode is currently downloading"
+          tooltip="Movie is currently downloading"
           colorImpairedMode={colorImpairedMode}
         />
 
         <LegendItem
           status="downloaded"
-          tooltip="Episode was downloaded and sorted"
+          tooltip="Movie was downloaded and sorted"
           colorImpairedMode={colorImpairedMode}
         />
       </div>