Add initial movie support

components.d.ts

@@ -13,6 +13,7 @@ declare module 'vue' {
     MediaFileStreamsSelector: typeof import('./src/components/MediaFileStreamsSelector.vue')['default']
     Player: typeof import('./src/components/Player.vue')['default']
     Recentcarousel: typeof import('./src/components/Recentcarousel.vue')['default']
+    RecentMovies: typeof import('./src/components/RecentMovies.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
     TVShowsSeasonExpansion: typeof import('./src/components/TVShowsSeasonExpansion.vue')['default']

schema.graphql

@@ -3,6 +3,7 @@ type Query {
     episodeById(id: ID): Episode
     seasonById(id: ID): Season
     showsRecentAdded: [Show!]
+    moviesRecentAdded: [Movie!]
     showById(id: ID): Show
 }
 
@@ -63,6 +64,16 @@ type Metadata {
     description: String
 }
 
+type Movie {
+    id: ID!
+    name: String!
+    releaseYear: Int!
+    images: [Image!]
+    metadata: [Metadata!]
+    watchStatus: [WatchStatus!]
+    mediaFile: [MediaFile!]
+}
+
 type PlayQueue {
     id: ID!
     currentItem: String

src/components/RecentMovies.vue

@@ -0,0 +1,62 @@
+<template>
+    <!-- Error -->
+    <v-alert v-if="error" type="error">{{ error }}</v-alert>
+
+    <!-- Loading-->
+    <v-slide-group v-if="fetching">
+        <v-slide-group-item v-for="i in 40" :key="i">
+            <v-skeleton-loader class="ma-3" height="340" type="image, list-item-two-line"
+                               width="200"></v-skeleton-loader>
+        </v-slide-group-item>
+    </v-slide-group>
+
+    <!-- Data-->
+    <v-slide-group v-else-if="data && data.moviesRecentAdded">
+        <v-slide-group-item v-for="show in data.moviesRecentAdded" :key="show.id">
+            <v-card :disabled="true" class="ma-3" width="200">
+                <Image :imageId="ImageUtilService.getCoverImageId(show.images!)" height="300px"></Image>
+                <v-card-title>{{
+                        MetadataUtilService.getMetadataFieldForLanguage('title', show.metadata, $t("iso-639-3"))
+                    }}
+                </v-card-title>
+                <v-card-subtitle>
+                    {{ show.releaseYear }}
+                </v-card-subtitle>
+            </v-card>
+        </v-slide-group-item>
+    </v-slide-group>
+
+    <!-- No result -->
+    <div v-else>{{ $t("index.no_shows_found") }}</div>
+</template>
+
+<script lang="ts" setup>
+import {useQuery} from '@urql/vue';
+import {graphql} from '@/generated-sources/gql';
+import ImageUtilService from "@/services/imageUtil.service";
+import MetadataUtilService from "@/services/metadataUtil.service";
+
+const {fetching, error, data} = useQuery({
+    requestPolicy: 'cache-and-network',
+    query: graphql(`
+        query moviesRecentAdded {
+          moviesRecentAdded {
+            id
+            name
+            releaseYear
+            metadata {
+              language
+              title
+              id
+              description
+            }
+            images {
+              language
+              id
+              type
+            }
+          }
+        }`
+    )
+});
+</script>

src/generated-sources/gql/fragment-masking.ts

@@ -20,25 +20,45 @@ export function useFragment<TType>(
   _documentNode: DocumentTypeDecoration<TType, any>,
   fragmentType: FragmentType<DocumentTypeDecoration<TType, any>>
 ): TType;
+// return nullable if `fragmentType` is undefined
+export function useFragment<TType>(
+  _documentNode: DocumentTypeDecoration<TType, any>,
+  fragmentType: FragmentType<DocumentTypeDecoration<TType, any>> | undefined
+): TType | undefined;
 // return nullable if `fragmentType` is nullable
+export function useFragment<TType>(
+  _documentNode: DocumentTypeDecoration<TType, any>,
+  fragmentType: FragmentType<DocumentTypeDecoration<TType, any>> | null
+): TType | null;
+// return nullable if `fragmentType` is nullable or undefined
 export function useFragment<TType>(
   _documentNode: DocumentTypeDecoration<TType, any>,
   fragmentType: FragmentType<DocumentTypeDecoration<TType, any>> | null | undefined
 ): TType | null | undefined;
 // return array of non-nullable if `fragmentType` is array of non-nullable
+export function useFragment<TType>(
+  _documentNode: DocumentTypeDecoration<TType, any>,
+  fragmentType: Array<FragmentType<DocumentTypeDecoration<TType, any>>>
+): Array<TType>;
+// return array of nullable if `fragmentType` is array of nullable
+export function useFragment<TType>(
+  _documentNode: DocumentTypeDecoration<TType, any>,
+  fragmentType: Array<FragmentType<DocumentTypeDecoration<TType, any>>> | null | undefined
+): Array<TType> | null | undefined;
+// return readonly array of non-nullable if `fragmentType` is array of non-nullable
 export function useFragment<TType>(
   _documentNode: DocumentTypeDecoration<TType, any>,
   fragmentType: ReadonlyArray<FragmentType<DocumentTypeDecoration<TType, any>>>
 ): ReadonlyArray<TType>;
-// return array of nullable if `fragmentType` is array of nullable
+// return readonly array of nullable if `fragmentType` is array of nullable
 export function useFragment<TType>(
   _documentNode: DocumentTypeDecoration<TType, any>,
   fragmentType: ReadonlyArray<FragmentType<DocumentTypeDecoration<TType, any>>> | null | undefined
 ): ReadonlyArray<TType> | null | undefined;
 export function useFragment<TType>(
   _documentNode: DocumentTypeDecoration<TType, any>,
-  fragmentType: FragmentType<DocumentTypeDecoration<TType, any>> | ReadonlyArray<FragmentType<DocumentTypeDecoration<TType, any>>> | null | undefined
-): TType | ReadonlyArray<TType> | null | undefined {
+  fragmentType: FragmentType<DocumentTypeDecoration<TType, any>> | Array<FragmentType<DocumentTypeDecoration<TType, any>>> | ReadonlyArray<FragmentType<DocumentTypeDecoration<TType, any>>> | null | undefined
+): TType | Array<TType> | ReadonlyArray<TType> | null | undefined {
   return fragmentType as any;
 }
 

src/generated-sources/gql/gql.ts

@@ -19,6 +19,7 @@ const documents = {
     "\n        mutation startTranscoding($playQueueId: ID!, $mediaFileId: ID!, $startTimeInSeconds: Int!, $audioId: ID, $subtitleId: ID) {\n            startTranscoding(playQueueId: $playQueueId, mediaFileId: $mediaFileId, startTimeInSeconds: $startTimeInSeconds, audioId: $audioId, subtitleId: $subtitleId)\n        }": types.StartTranscodingDocument,
     "\n        mutation readyTranscoding($id: ID!) {\n            readyTranscoding(id: $id)\n        }": types.ReadyTranscodingDocument,
     "\n        mutation stopTranscoding($id: ID!) {\n        stopTranscoding(id: $id)\n        }": types.StopTranscodingDocument,
+    "\n        query moviesRecentAdded {\n          moviesRecentAdded {\n            id\n            name\n            releaseYear\n            metadata {\n              language\n              title\n              id\n              description\n            }\n            images {\n              language\n              id\n              type\n            }\n          }\n        }": types.MoviesRecentAddedDocument,
     "\n        query episodesRecentWatched {\n          episodesRecentWatched {\n            id\n            show {\n              id\n              metadata {\n                language\n                title\n              }\n              images {\n                language\n                id\n                type\n              }\n            }\n            season {\n              number\n            }\n            number\n            metadata {\n              language\n              title\n              id\n              description\n            }\n            images {\n              language\n              id\n              type\n            }\n          }\n        }": types.EpisodesRecentWatchedDocument,
     "\n        query showByIdSeasons($id: ID!) {\n          showById(id: $id) {\n            seasons {\n              id\n              number\n            }\n          }\n        }": types.ShowByIdSeasonsDocument,
     "\n        query showsRecentAdded {\n          showsRecentAdded {\n            id\n            releaseYear\n            name\n            images {\n              type\n              id\n            }\n                episodes {\n              number\n            }\n            metadata {\n              description\n              title\n              language\n            }\n          }\n        }": types.ShowsRecentAddedDocument,
@@ -64,6 +65,10 @@ export function graphql(source: "\n        mutation readyTranscoding($id: ID!) {
  * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
 export function graphql(source: "\n        mutation stopTranscoding($id: ID!) {\n        stopTranscoding(id: $id)\n        }"): (typeof documents)["\n        mutation stopTranscoding($id: ID!) {\n        stopTranscoding(id: $id)\n        }"];
+/**
+ * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
+ */
+export function graphql(source: "\n        query moviesRecentAdded {\n          moviesRecentAdded {\n            id\n            name\n            releaseYear\n            metadata {\n              language\n              title\n              id\n              description\n            }\n            images {\n              language\n              id\n              type\n            }\n          }\n        }"): (typeof documents)["\n        query moviesRecentAdded {\n          moviesRecentAdded {\n            id\n            name\n            releaseYear\n            metadata {\n              language\n              title\n              id\n              description\n            }\n            images {\n              language\n              id\n              type\n            }\n          }\n        }"];
 /**
  * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */