Fixed: Queue and Calendar not loading

frontend/src/Activity/Queue/TimeleftCell.js

@@ -24,7 +24,11 @@ function TimeleftCell(props) {
   } = props;
 
   if (status === 'delay') {
-    const date = getRelativeDate(estimatedCompletionTime, shortDateFormat, showRelativeDates);
+    const date = getRelativeDate({
+      date: estimatedCompletionTime,
+      shortDateFormat,
+      showRelativeDates
+    });
     const time = formatTime(estimatedCompletionTime, timeFormat, { includeMinuteZero: true });
 
     return (
@@ -40,7 +44,11 @@ function TimeleftCell(props) {
   }
 
   if (status === 'downloadClientUnavailable') {
-    const date = getRelativeDate(estimatedCompletionTime, shortDateFormat, showRelativeDates);
+    const date = getRelativeDate({
+      date: estimatedCompletionTime,
+      shortDateFormat,
+      showRelativeDates
+    });
     const time = formatTime(estimatedCompletionTime, timeFormat, { includeMinuteZero: true });
 
     return (

frontend/src/Calendar/Day/DayOfWeek.js

@@ -28,7 +28,7 @@ class DayOfWeek extends Component {
     if (view === calendarViews.WEEK) {
       formatedDate = momentDate.format(calendarWeekColumnHeader);
     } else if (view === calendarViews.FORECAST) {
-      formatedDate = getRelativeDate(date, shortDateFormat, showRelativeDates);
+      formatedDate = getRelativeDate({ date, shortDateFormat, showRelativeDates });
     }
 
     return (

frontend/src/Components/Table/Cells/RelativeDateCell.js

@@ -40,7 +40,7 @@ class RelativeDateCell extends PureComponent {
         title={formatDateTime(date, longDateFormat, timeFormat, { includeSeconds, includeRelativeDay: !showRelativeDates })}
         {...otherProps}
       >
-        {getRelativeDate(date, shortDateFormat, showRelativeDates, { timeFormat, includeSeconds, includeTime, timeForToday: true })}
+        {getRelativeDate({ date, shortDateFormat, showRelativeDates, timeFormat, includeSeconds, includeTime, timeForToday: true })}
       </Component>
     );
   }

frontend/src/Series/Index/Overview/SeriesIndexOverviewInfo.tsx

@@ -138,7 +138,10 @@ function getInfoRowProps(
       }),
       iconName: icons.CALENDAR,
       label:
-        getRelativeDate(previousAiring, shortDateFormat, showRelativeDates, {
+        getRelativeDate({
+          date: previousAiring,
+          shortDateFormat,
+          showRelativeDates,
           timeFormat,
           timeForToday: true,
         }) ?? '',
@@ -156,7 +159,10 @@ function getInfoRowProps(
       }),
       iconName: icons.ADD,
       label:
-        getRelativeDate(added, shortDateFormat, showRelativeDates, {
+        getRelativeDate({
+          date: added,
+          shortDateFormat,
+          showRelativeDates,
           timeFormat,
           timeForToday: true,
         }) ?? '',
@@ -232,15 +238,13 @@ function SeriesIndexOverviewInfo(props: SeriesIndexOverviewInfoProps) {
         <SeriesIndexOverviewInfoRow
           title={formatDateTime(nextAiring, longDateFormat, timeFormat)}
           iconName={icons.SCHEDULED}
-          label={getRelativeDate(
+          label={getRelativeDate({
-            nextAiring,
+            date: nextAiring,
             shortDateFormat,
             showRelativeDates,
-            {
+            timeFormat,
-              timeFormat,
+            timeForToday: true,
-              timeForToday: true,
+          })}
-            }
-          )}
         />
       )}
 

frontend/src/Series/Index/Posters/SeriesIndexPoster.tsx

@@ -217,7 +217,10 @@ function SeriesIndexPoster(props: SeriesIndexPosterProps) {
             timeFormat
           )}`}
         >
-          {getRelativeDate(nextAiring, shortDateFormat, showRelativeDates, {
+          {getRelativeDate({
+            date: nextAiring,
+            shortDateFormat,
+            showRelativeDates,
             timeFormat,
             timeForToday: true,
           })}

frontend/src/Series/Index/Posters/SeriesIndexPosterInfo.tsx

@@ -80,7 +80,10 @@ function SeriesIndexPosterInfo(props: SeriesIndexPosterInfoProps) {
           timeFormat
         )}`}
       >
-        {getRelativeDate(previousAiring, shortDateFormat, showRelativeDates, {
+        {getRelativeDate({
+          date: previousAiring,
+          shortDateFormat,
+          showRelativeDates,
           timeFormat,
           timeForToday: true,
         })}
@@ -89,15 +92,13 @@ function SeriesIndexPosterInfo(props: SeriesIndexPosterInfoProps) {
   }
 
   if (sortKey === 'added' && added) {
-    const addedDate = getRelativeDate(
+    const addedDate = getRelativeDate({
-      added,
+      date: added,
       shortDateFormat,
       showRelativeDates,
-      {
+      timeFormat,
-        timeFormat,
+      timeForToday: false,
-        timeForToday: false,
+    });
-      }
-    );
 
     return (
       <div

frontend/src/Utilities/Date/getRelativeDate.js

@@ -1,49 +0,0 @@
-import moment from 'moment';
-import formatTime from 'Utilities/Date/formatTime';
-import isInNextWeek from 'Utilities/Date/isInNextWeek';
-import isToday from 'Utilities/Date/isToday';
-import isTomorrow from 'Utilities/Date/isTomorrow';
-import isYesterday from 'Utilities/Date/isYesterday';
-import translate from 'Utilities/String/translate';
-import formatDateTime from './formatDateTime';
-
-function getRelativeDate(date, shortDateFormat, showRelativeDates, { timeFormat, includeSeconds = false, timeForToday = false, includeTime = false } = {}) {
-  if (!date) {
-    return null;
-  }
-
-  const isTodayDate = isToday(date);
-  const time = formatTime(date, timeFormat, { includeMinuteZero: true, includeSeconds });
-
-  if (isTodayDate && timeForToday && timeFormat) {
-    return time;
-  }
-
-  if (!showRelativeDates) {
-    return moment(date).format(shortDateFormat);
-  }
-
-  if (isYesterday(date)) {
-    return includeTime ? translate('YesterdayAt', { time } ): translate('Yesterday');
-  }
-
-  if (isTodayDate) {
-    return includeTime ? translate('TodayAt', { time } ): translate('Today');
-  }
-
-  if (isTomorrow(date)) {
-    return includeTime ? translate('TomorrowAt', { time } ): translate('Tomorrow');
-  }
-
-  if (isInNextWeek(date)) {
-    const day = moment(date).format('dddd');
-
-    return includeTime ? translate('DayOfWeekAt', { day, time }) : day;
-  }
-
-  return includeTime ?
-    formatDateTime(date, shortDateFormat, timeFormat, { includeSeconds }) :
-    moment(date).format(shortDateFormat);
-}
-
-export default getRelativeDate;

frontend/src/Utilities/Date/getRelativeDate.tsx

@@ -0,0 +1,83 @@
+import moment from 'moment';
+import formatTime from 'Utilities/Date/formatTime';
+import isInNextWeek from 'Utilities/Date/isInNextWeek';
+import isToday from 'Utilities/Date/isToday';
+import isTomorrow from 'Utilities/Date/isTomorrow';
+import isYesterday from 'Utilities/Date/isYesterday';
+import translate from 'Utilities/String/translate';
+import formatDateTime from './formatDateTime';
+
+interface GetRelativeDateOptions {
+  date?: string;
+  shortDateFormat: string;
+  showRelativeDates: boolean;
+  timeFormat?: string;
+  includeSeconds?: boolean;
+  timeForToday?: boolean;
+  includeTime?: boolean;
+}
+
+function getRelativeDate({
+  date,
+  shortDateFormat,
+  showRelativeDates,
+  timeFormat,
+  includeSeconds = false,
+  timeForToday = false,
+  includeTime = false,
+}: GetRelativeDateOptions) {
+  if (!date) {
+    return null;
+  }
+
+  if (includeTime && !timeFormat) {
+    throw new Error(
+      "getRelativeDate: 'timeFormat' is required when 'includeTime' is true"
+    );
+  }
+
+  const isTodayDate = isToday(date);
+  const time =
+    includeTime && timeFormat
+      ? formatTime(date, timeFormat, {
+          includeMinuteZero: true,
+          includeSeconds,
+        })
+      : '';
+
+  if (isTodayDate && timeForToday && timeFormat) {
+    return time;
+  }
+
+  if (!showRelativeDates) {
+    return moment(date).format(shortDateFormat);
+  }
+
+  if (isYesterday(date)) {
+    return includeTime
+      ? translate('YesterdayAt', { time })
+      : translate('Yesterday');
+  }
+
+  if (isTodayDate) {
+    return includeTime ? translate('TodayAt', { time }) : translate('Today');
+  }
+
+  if (isTomorrow(date)) {
+    return includeTime
+      ? translate('TomorrowAt', { time })
+      : translate('Tomorrow');
+  }
+
+  if (isInNextWeek(date)) {
+    const day = moment(date).format('dddd');
+
+    return includeTime ? translate('DayOfWeekAt', { day, time }) : day;
+  }
+
+  return includeTime
+    ? formatDateTime(date, shortDateFormat, timeFormat, { includeSeconds })
+    : moment(date).format(shortDateFormat);
+}
+
+export default getRelativeDate;