styling changes and config changes

api/queries/functions/images.ts

@@ -2,11 +2,12 @@ import { Api } from "@jellyfin/sdk/lib/api"
 import { ImageType } from "@jellyfin/sdk/lib/generated-client/models"
 import { getImageApi } from "@jellyfin/sdk/lib/utils/api"
 
-export function fetchItemImage(api: Api, itemId: string, imageType?: ImageType) {
+export function fetchItemImage(api: Api, itemId: string, imageType?: ImageType, width?: number) {
 
         return getImageApi(api)
         .getItemImage({
             imageType: imageType ? imageType : ImageType.Primary,
-            itemId
+            itemId,
+            width: width
         })
 }

api/queries/functions/recents.ts

@@ -1,6 +1,7 @@
 import { Api } from "@jellyfin/sdk/lib/api";
 import { BaseItemDto, BaseItemKind, ItemSortBy, SortOrder } from "@jellyfin/sdk/lib/generated-client/models";
 import { getItemsApi } from "@jellyfin/sdk/lib/utils/api/items-api";
+import { queryConfig } from "../query.config";
 
 export function fetchRecentlyPlayed(api: Api, libraryId: string): Promise<BaseItemDto[]> {
 
@@ -12,7 +13,7 @@ export function fetchRecentlyPlayed(api: Api, libraryId: string): Promise<BaseIt
             includeItemTypes: [
                 BaseItemKind.Audio
             ],
-            limit: 100,
+            limit: queryConfig.limits.recents,
             parentId: libraryId, 
             recursive: true,
             sortBy: [ 

api/queries/image.ts

@@ -2,8 +2,9 @@ import { useQuery } from "@tanstack/react-query";
 import { QueryKeys } from "../../enums/query-keys";
 import { Api } from "@jellyfin/sdk";
 import { fetchItemImage } from "./functions/images";
+import { ImageType } from "@jellyfin/sdk/lib/generated-client/models";
 
-export const useItemImage = (api: Api, itemId: string) => useQuery({
-    queryKey: [QueryKeys.ItemImage, api, itemId],
-    queryFn: ({ queryKey }) => fetchItemImage(queryKey[1] as Api, queryKey[2] as string)
+export const useItemImage = (api: Api, itemId: string, imageType?: ImageType, width?: number) => useQuery({
+    queryKey: [QueryKeys.ItemImage, api, itemId, imageType, width],
+    queryFn: ({ queryKey }) => fetchItemImage(queryKey[1] as Api, queryKey[2] as string, imageType, width)
 });

api/queries/query.config.ts

@@ -0,0 +1,6 @@
+
+export const queryConfig = {
+    limits: {
+        recents: 50
+    }
+}