fix(media-unit-stats): handle not yet released media (#48)

hoangvu12 · Feb 3, 2024 · dd6b258 · dd6b258
1 parent 54665be
commit dd6b258
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 5 deletions.
diff --git a/src/gql/gql.ts b/src/gql/gql.ts
@@ -87,7 +87,7 @@ const documents = {
     types.CardMediaFragmentDoc,
   '\n  fragment CharacterCard on CharacterEdge {\n    node {\n      id\n      name {\n        userPreferred\n      }\n      image {\n        large\n      }\n    }\n    role\n  }\n':
     types.CharacterCardFragmentDoc,
-  '\n  fragment MediaUnitStatsMedia on Media {\n    type\n    episodes\n    chapters\n    mediaListEntry {\n      progress\n    }\n    nextAiringEpisode {\n      episode\n    }\n  }\n':
+  '\n  fragment MediaUnitStatsMedia on Media {\n    type\n    episodes\n    chapters\n    mediaListEntry {\n      progress\n    }\n    nextAiringEpisode {\n      episode\n    }\n    status\n  }\n':
     types.MediaUnitStatsMediaFragmentDoc,
   '\n  fragment StaffCard on StaffEdge {\n    node {\n      id\n      name {\n        userPreferred\n      }\n      image {\n        large\n      }\n    }\n    role\n  }\n':
     types.StaffCardFragmentDoc,
@@ -333,8 +333,8 @@ export function graphql(
  * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
 export function graphql(
-  source: '\n  fragment MediaUnitStatsMedia on Media {\n    type\n    episodes\n    chapters\n    mediaListEntry {\n      progress\n    }\n    nextAiringEpisode {\n      episode\n    }\n  }\n'
-): (typeof documents)['\n  fragment MediaUnitStatsMedia on Media {\n    type\n    episodes\n    chapters\n    mediaListEntry {\n      progress\n    }\n    nextAiringEpisode {\n      episode\n    }\n  }\n'];
+  source: '\n  fragment MediaUnitStatsMedia on Media {\n    type\n    episodes\n    chapters\n    mediaListEntry {\n      progress\n    }\n    nextAiringEpisode {\n      episode\n    }\n    status\n  }\n'
+): (typeof documents)['\n  fragment MediaUnitStatsMedia on Media {\n    type\n    episodes\n    chapters\n    mediaListEntry {\n      progress\n    }\n    nextAiringEpisode {\n      episode\n    }\n    status\n  }\n'];
 /**
  * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */

diff --git a/src/gql/graphql.ts b/src/gql/graphql.ts
@@ -5402,6 +5402,7 @@ export type MediaUnitStatsMediaFragment = {
   type?: MediaType | null;
   episodes?: number | null;
   chapters?: number | null;
+  status?: MediaStatus | null;
   mediaListEntry?: {
     __typename?: 'MediaList';
     progress?: number | null;
@@ -5456,6 +5457,7 @@ export const MediaUnitStatsMediaFragmentDoc = {
               ],
             },
           },
+          { kind: 'Field', name: { kind: 'Name', value: 'status' } },
         ],
       },
     },
@@ -5539,6 +5541,7 @@ export const WatchCardFragmentDoc = {
               ],
             },
           },
+          { kind: 'Field', name: { kind: 'Name', value: 'status' } },
         ],
       },
     },
@@ -6027,6 +6030,7 @@ export const CardMediaFragmentDoc = {
               ],
             },
           },
+          { kind: 'Field', name: { kind: 'Name', value: 'status' } },
         ],
       },
     },
@@ -6095,6 +6099,7 @@ export const RelationListMediaFragmentDoc = {
               ],
             },
           },
+          { kind: 'Field', name: { kind: 'Name', value: 'status' } },
         ],
       },
     },
@@ -6213,6 +6218,7 @@ export const RecommendationListMediaFragmentDoc = {
               ],
             },
           },
+          { kind: 'Field', name: { kind: 'Name', value: 'status' } },
         ],
       },
     },
@@ -6801,6 +6807,7 @@ export const InfoScreenMediaFragmentDoc = {
               ],
             },
           },
+          { kind: 'Field', name: { kind: 'Name', value: 'status' } },
         ],
       },
     },
@@ -7615,6 +7622,7 @@ export const SearchLayoutContainerFragmentDoc = {
               ],
             },
           },
+          { kind: 'Field', name: { kind: 'Name', value: 'status' } },
         ],
       },
     },
@@ -7771,6 +7779,7 @@ export const BannerCardMediaFragmentDoc = {
               ],
             },
           },
+          { kind: 'Field', name: { kind: 'Name', value: 'status' } },
         ],
       },
     },
@@ -7931,6 +7940,7 @@ export const WatchedListDocument = {
               ],
             },
           },
+          { kind: 'Field', name: { kind: 'Name', value: 'status' } },
         ],
       },
     },
@@ -8261,6 +8271,7 @@ export const AuthWatchedListDocument = {
               ],
             },
           },
+          { kind: 'Field', name: { kind: 'Name', value: 'status' } },
         ],
       },
     },
@@ -9050,6 +9061,7 @@ export const AiringScheduleDocument = {
               ],
             },
           },
+          { kind: 'Field', name: { kind: 'Name', value: 'status' } },
         ],
       },
     },
@@ -9241,6 +9253,7 @@ export const PopularThisSeasonDocument = {
               ],
             },
           },
+          { kind: 'Field', name: { kind: 'Name', value: 'status' } },
         ],
       },
     },
@@ -9435,6 +9448,7 @@ export const UpcomingNextSeasonDocument = {
               ],
             },
           },
+          { kind: 'Field', name: { kind: 'Name', value: 'status' } },
         ],
       },
     },
@@ -9742,6 +9756,7 @@ export const InfoDetailsScreenDocument = {
               ],
             },
           },
+          { kind: 'Field', name: { kind: 'Name', value: 'status' } },
         ],
       },
     },
@@ -12299,6 +12314,7 @@ export const MediaDocument = {
               ],
             },
           },
+          { kind: 'Field', name: { kind: 'Name', value: 'status' } },
         ],
       },
     },
@@ -12505,6 +12521,7 @@ export const BannerCardDocument = {
               ],
             },
           },
+          { kind: 'Field', name: { kind: 'Name', value: 'status' } },
         ],
       },
     },

diff --git a/src/ui/media-unit-stats.tsx b/src/ui/media-unit-stats.tsx
@@ -3,7 +3,7 @@ import { twMerge } from 'tailwind-merge';
 
 import type { FragmentType } from '@/gql';
 import { graphql, useFragment } from '@/gql';
-import { MediaType } from '@/gql/graphql';
+import { MediaStatus, MediaType } from '@/gql/graphql';
 
 import type { TextProps } from './core';
 import { Text } from './core';
@@ -19,6 +19,7 @@ export const MediaUnitStatsFragment = graphql(`
     nextAiringEpisode {
       episode
     }
+    status
   }
 `);
 
@@ -61,7 +62,12 @@ const MediaUnitStats: React.FC<
 
       <Text variant="sm" weight="normal" className="text-gray-300">
         {media.mediaListEntry?.progress && ' | '}
-        {releasedEpisode ?? totalMediaUnit} {'| '}
+
+        {media.status === MediaStatus.Finished
+          ? totalMediaUnit
+          : releasedEpisode ?? '??'}
+
+        {' | '}
       </Text>
 
       {totalMediaUnit ? (