From d507432b9c0b6b33c589cbbb5cda08e650d9dd6c Mon Sep 17 00:00:00 2001
From: Johan Frick <johan.frick@gmail.com>
Date: Sat, 30 Sep 2023 13:55:14 +0200
Subject: [PATCH] feature: numberOfFavoritesToShow

---
 src/editor/advanced-editor.ts |  5 +++++
 src/sections/media-browser.ts | 36 ++++++++++++++++++++---------------
 src/types.ts                  |  1 +
 3 files changed, 27 insertions(+), 15 deletions(-)

diff --git a/src/editor/advanced-editor.ts b/src/editor/advanced-editor.ts
index 13657c26..0a8a989a 100644
--- a/src/editor/advanced-editor.ts
+++ b/src/editor/advanced-editor.ts
@@ -31,6 +31,11 @@ export const ADVANCED_SCHEMA = [
     type: 'string',
     name: 'topFavorites',
   },
+  {
+    type: 'integer',
+    name: 'numberOfFavoritesToShow',
+    valueMin: 1,
+  },
 ];
 
 class AdvancedEditor extends BaseEditor {
diff --git a/src/sections/media-browser.ts b/src/sections/media-browser.ts
index 3c5bf8e9..27ecd455 100755
--- a/src/sections/media-browser.ts
+++ b/src/sections/media-browser.ts
@@ -140,25 +140,31 @@ export class MediaBrowser extends LitElement {
       this.mediaPlayers,
       this.config.mediaBrowserTitlesToIgnore,
     );
-    allFavorites = allFavorites.sort((a, b) => {
-      const topFavorites = this.config.topFavorites ?? [];
-      const aIndex = indexOfWithoutSpecialChars(topFavorites, a.title);
-      const bIndex = indexOfWithoutSpecialChars(topFavorites, b.title);
-      if (aIndex > -1 && bIndex > -1) {
-        return aIndex - bIndex;
-      } else {
-        let result = bIndex - aIndex;
-        if (result === 0) {
-          result = a.title.localeCompare(b.title, 'en', { sensitivity: 'base' });
-        }
-        return result;
-      }
-    });
-    return [
+    allFavorites.sort((a, b) => this.sortOnTopFavoritesThenAlphabetically(a.title, b.title));
+    allFavorites = [
       ...(this.config.customSources?.[this.activePlayer.id]?.map(MediaBrowser.createSource) || []),
       ...(this.config.customSources?.all?.map(MediaBrowser.createSource) || []),
       ...allFavorites,
     ];
+    allFavorites = this.config.numberOfFavoritesToShow
+      ? allFavorites.slice(0, this.config.numberOfFavoritesToShow)
+      : allFavorites;
+    return allFavorites;
+  }
+
+  private sortOnTopFavoritesThenAlphabetically(a: string, b: string) {
+    const topFavorites = this.config.topFavorites ?? [];
+    const aIndex = indexOfWithoutSpecialChars(topFavorites, a);
+    const bIndex = indexOfWithoutSpecialChars(topFavorites, b);
+    if (aIndex > -1 && bIndex > -1) {
+      return aIndex - bIndex;
+    } else {
+      let result = bIndex - aIndex;
+      if (result === 0) {
+        result = a.localeCompare(b, 'en', { sensitivity: 'base' });
+      }
+      return result;
+    }
   }
 
   private static createSource(source: MediaPlayerItem) {
diff --git a/src/types.ts b/src/types.ts
index 9cb61e12..dff9b30f 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -41,6 +41,7 @@ export interface CardConfig extends LovelaceCardConfig {
   mediaBrowserItemsPerRow: number;
   mediaBrowserShowTitleForThumbnailIcons?: boolean;
   topFavorites?: string[];
+  numberOfFavoritesToShow?: number;
 }
 
 export interface MediaArtworkOverride {