feat(project): auto refetch media item

when it is event media item
jwplayer · Jun 1, 2023 · b62300f · b62300f
1 parent 30d65c1
commit b62300f
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 12 deletions.
diff --git a/src/hooks/useMedia.ts b/src/hooks/useMedia.ts
@@ -2,11 +2,19 @@ import { UseBaseQueryResult, useQuery } from 'react-query';
 
 import { getMediaById } from '#src/services/api.service';
 import type { PlaylistItem } from '#types/playlist';
+import { isScheduledOrLiveMedia } from '#src/utils/liveEvent';
 
 export type UseMediaResult<TData = PlaylistItem, TError = unknown> = UseBaseQueryResult<TData, TError>;
 
 export default function useMedia(mediaId: string, enabled: boolean = true): UseMediaResult {
   return useQuery(['media', mediaId], () => getMediaById(mediaId), {
     enabled: !!mediaId && enabled,
+    refetchInterval: (data, _) => {
+      if (!data) return false;
+
+      const autoRefetch = isScheduledOrLiveMedia(data);
+
+      return autoRefetch ? 1000 * 30 : false;
+    },
   });
 }
diff --git a/src/hooks/usePlaylist.ts b/src/hooks/usePlaylist.ts
@@ -5,6 +5,7 @@ import type { GetPlaylistParams } from '#types/playlist';
 import { getPlaylistById } from '#src/services/api.service';
 import { queryClient } from '#src/containers/QueryProvider/QueryProvider';
 import { isScheduledOrLiveMedia } from '#src/utils/liveEvent';
+import { isTruthyCustomParamValue } from '#src/utils/common';
 
 const placeholderData = generatePlaylistPlaceholder(30);
 
@@ -29,15 +30,9 @@ export default function usePlaylist(playlistId?: string, params: GetPlaylistPara
     refetchInterval: (data, _) => {
       if (!data) return false;
 
-      let shouldRefetchPlaylist = data.refetch;
+      const autoRefetch = isTruthyCustomParamValue(data.refetch) || data.playlist.some(isScheduledOrLiveMedia);
 
-      for (const media of data.playlist) {
-        if (shouldRefetchPlaylist) break;
-
-        shouldRefetchPlaylist = isScheduledOrLiveMedia(media);
-      }
-
-      return shouldRefetchPlaylist ? 1000 * 30 : false;
+      return autoRefetch ? 1000 * 30 : false;
     },
     retry: false,
   });

diff --git a/src/utils/formatting.ts b/src/utils/formatting.ts
@@ -132,12 +132,13 @@ export const formatVideoSchedule = (locale: string, scheduledStart?: Date, sched
     return formatLocalizedDateTime(scheduledStart, locale, ' • ');
   }
 
-  return `${formatLocalizedDateTime(scheduledStart, locale, ' • ')} - ${formatLocalizedTime(scheduledEnd, 'locale')}`;
+  return `${formatLocalizedDateTime(scheduledStart, locale, ' • ')} - ${formatLocalizedTime(scheduledEnd, locale)}`;
 };
 
-const formatLocalizedDate = (date: Date, locale: string) => new Intl.DateTimeFormat(locale, { day: 'numeric', month: 'long', year: 'numeric' }).format(date);
+export const formatLocalizedDate = (date: Date, locale: string) =>
+  new Intl.DateTimeFormat(locale, { day: 'numeric', month: 'long', year: 'numeric' }).format(date);
 
-const formatLocalizedTime = (date: Date, locale: string) => new Intl.DateTimeFormat(locale, { hour: 'numeric', minute: 'numeric' }).format(date);
+export const formatLocalizedTime = (date: Date, locale: string) => new Intl.DateTimeFormat(locale, { hour: 'numeric', minute: 'numeric' }).format(date);
 
-const formatLocalizedDateTime = (date: Date, locale: string, separator = ' ') =>
+export const formatLocalizedDateTime = (date: Date, locale: string, separator = ' ') =>
   `${formatLocalizedDate(date, locale)}${separator}${formatLocalizedTime(date, locale)}`;