fix(home): get the correct channel activities count

AXeL-dev · Oct 15, 2022 · 6f1effd · 6f1effd
1 parent de32a0e
commit 6f1effd
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 7 deletions.
diff --git a/src/providers/ChannelVideosProvider.tsx b/src/providers/ChannelVideosProvider.tsx
@@ -13,7 +13,7 @@ import {
 import { GetChannelVideosResponse } from 'store/services/youtube';
 import { Channel, Video, HomeView } from 'types';
 
-export interface ChannelData extends GetChannelVideosResponse {
+export interface ChannelData extends Omit<GetChannelVideosResponse, 'count'> {
   channel: Channel;
 }
 

diff --git a/src/store/services/youtube/endpoints.ts b/src/store/services/youtube/endpoints.ts
@@ -34,6 +34,7 @@ type GetChannelActivitiesArgs = {
 
 type GetChannelActivitiesResponse = {
   items: ChannelActivities[];
+  count: number;
   total: number;
 };
 
@@ -56,7 +57,9 @@ export interface PersistVideosOptions {
   flags?: VideoFlags;
 }
 
-export type GetChannelVideosResponse = GetVideosByIdResponse;
+export type GetChannelVideosResponse = GetVideosByIdResponse & {
+  count: number;
+};
 
 const queries = {
   // Channel search query
@@ -129,6 +132,7 @@ const queries = {
         .map((item) => ({
           videoId: item.contentDetails.upload.videoId,
         })),
+      count: response.items.length,
       total: response.pageInfo.totalResults,
     }),
   },
@@ -234,21 +238,24 @@ export const extendedApi = youtubeApi.injectEndpoints({
             return {
               data: {
                 items: [],
+                count: 0,
                 total: 0,
               },
             };
           }
           return { error: activities.error as FetchBaseQueryError };
         }
-        const { items, total } = queries.getChannelActivities.transformResponse(
-          activities.data as Response,
-        );
+        const { items, count, total } =
+          queries.getChannelActivities.transformResponse(
+            activities.data as Response,
+          );
         // Fetch channel videos
         const ids = items.map(({ videoId }) => videoId);
         if (ids.length === 0) {
           return {
             data: {
               items: [],
+              count: 0,
               total: 0,
             },
           };
@@ -276,6 +283,7 @@ export const extendedApi = youtubeApi.injectEndpoints({
         return {
           data: {
             ...videosData,
+            count,
             total,
           },
         };

diff --git a/src/ui/components/pages/Home/ChannelRenderer/ChannelRenderer.tsx b/src/ui/components/pages/Home/ChannelRenderer/ChannelRenderer.tsx
@@ -8,6 +8,7 @@ export interface ChannelRendererProps {
   view: HomeView;
   channel: Channel;
   videos: Video[];
+  count?: number;
   total: number;
   isLoading: boolean;
   itemsPerRow: number;
@@ -17,10 +18,12 @@ export interface ChannelRendererProps {
 }
 
 function ChannelRenderer(props: ChannelRendererProps) {
-  const { channel, videos, total, isLoading, maxResults, ...rest } = props;
+  const { channel, videos, count, total, isLoading, maxResults, ...rest } =
+    props;
+  const videosCount = count || videos.length;
   const hasVideos = isLoading || videos.length > 0;
   const hasMore =
-    videos.length > 0 && videos.length >= maxResults && total > maxResults;
+    videosCount > 0 && videosCount >= maxResults && total > maxResults;
 
   return hasVideos ? (
     <Box

diff --git a/src/ui/components/pages/Home/ChannelRenderer/DefaultRenderer.tsx b/src/ui/components/pages/Home/ChannelRenderer/DefaultRenderer.tsx
@@ -48,6 +48,7 @@ function DefaultRenderer(props: DefaultRendererProps) {
     },
   );
   const videos = (data?.items || []).filter(filter);
+  const count = data?.count || 0;
   const total = data?.total || 0;
 
   const handleLoadMore = () => {
@@ -72,6 +73,7 @@ function DefaultRenderer(props: DefaultRendererProps) {
       view={view}
       channel={channel}
       videos={videos}
+      count={count}
       total={total}
       isLoading={isLoading || isFetching}
       itemsPerRow={itemsPerRow}