feat(v2): search platforms by slug, folder, category and family

Spinnich · Spinnich · commit 9e9cefac6e41 · 2026-08-06T12:48:00.000Z
The platforms index only matched the display name, so a platform you
know by its folder on disk, its slug, or its family stayed unreachable
unless you guessed the name RomM shows.

Match the term against the display name, slug, fs_slug, category and
family name. Category contributes both the raw stored value and the
prettified label, since the label is what the list column and the group
heading show while the raw value is what the app stores.

The placeholder now names the searchable fields, in the same style the
ROM search uses.
diff --git a/frontend/src/locales/bg_BG/platform.json b/frontend/src/locales/bg_BG/platform.json
@@ -62,6 +62,7 @@
   "reset-filters": "Нулирай филтрите",
   "rom-count": "{n} ROM | {n} ROM-а",
   "scan-platform": "Сканирай платформата",
+  "search-placeholder": "Търси по име, слъг, папка, категория…",
   "search-platform": "Търси платформа",
   "settings": "Настройки",
   "show": "Покажи",
diff --git a/frontend/src/locales/cs_CZ/platform.json b/frontend/src/locales/cs_CZ/platform.json
@@ -62,6 +62,7 @@
   "reset-filters": "Obnovit filtry",
   "rom-count": "{n} ROMů | {n} ROM | {n} ROMy | {n} ROMů",
   "scan-platform": "Skenovat platformu",
+  "search-placeholder": "Hledat podle názvu, slugu, složky, kategorie…",
   "search-platform": "Hledat platformu",
   "settings": "Nastavení",
   "show": "Zobrazit",
diff --git a/frontend/src/locales/de_DE/platform.json b/frontend/src/locales/de_DE/platform.json
@@ -62,6 +62,7 @@
   "reset-filters": "Filter zurücksetzen",
   "rom-count": "{n} ROM | {n} ROMs",
   "scan-platform": "Plattform scannen",
+  "search-placeholder": "Nach Name, Slug, Verzeichnis, Kategorie suchen…",
   "search-platform": "Plattform suchen",
   "settings": "Einstellungen",
   "show": "Anzeigen",
diff --git a/frontend/src/locales/en_GB/platform.json b/frontend/src/locales/en_GB/platform.json
@@ -62,6 +62,7 @@
   "reset-filters": "Reset filters",
   "rom-count": "{n} ROM | {n} ROMs",
   "scan-platform": "Scan platform",
+  "search-placeholder": "Search by name, slug, folder, category…",
   "search-platform": "Search platform",
   "settings": "Settings",
   "show": "Show",
diff --git a/frontend/src/locales/en_US/platform.json b/frontend/src/locales/en_US/platform.json
@@ -62,6 +62,7 @@
   "reset-filters": "Reset filters",
   "rom-count": "{n} ROM | {n} ROMs",
   "scan-platform": "Scan platform",
+  "search-placeholder": "Search by name, slug, folder, category…",
   "search-platform": "Search platform",
   "settings": "Settings",
   "show": "Show",
diff --git a/frontend/src/locales/es_ES/platform.json b/frontend/src/locales/es_ES/platform.json
@@ -62,6 +62,7 @@
   "reset-filters": "Restablecer filtros",
   "rom-count": "{n} ROM | {n} ROMs",
   "scan-platform": "Escanear plataforma",
+  "search-placeholder": "Buscar por nombre, slug, carpeta, categoría…",
   "search-platform": "Buscar plataforma",
   "settings": "Ajustes",
   "show": "Mostrar",
diff --git a/frontend/src/locales/fr_FR/platform.json b/frontend/src/locales/fr_FR/platform.json
@@ -62,6 +62,7 @@
   "reset-filters": "Réinitialiser les filtres",
   "rom-count": "{n} ROM | {n} ROMs",
   "scan-platform": "Analyser la plateforme",
+  "search-placeholder": "Rechercher par nom, slug, dossier, catégorie…",
   "search-platform": "Recherche dans la plateforme",
   "settings": "Paramètres",
   "show": "Afficher",
diff --git a/frontend/src/locales/hu_HU/platform.json b/frontend/src/locales/hu_HU/platform.json
@@ -62,6 +62,7 @@
   "reset-filters": "Szűrők visszaállítása",
   "rom-count": "{n} ROM | {n} ROM",
   "scan-platform": "Platform szkennelése",
+  "search-placeholder": "Keresés név, slug, mappa, kategória szerint…",
   "search-platform": "Platform keresése",
   "settings": "Beállítások",
   "show": "Megjelenítés",
diff --git a/frontend/src/locales/it_IT/platform.json b/frontend/src/locales/it_IT/platform.json
@@ -62,6 +62,7 @@
   "reset-filters": "Resetta filtri",
   "rom-count": "{n} ROM | {n} ROM",
   "scan-platform": "Scansiona piattaforma",
+  "search-placeholder": "Cerca per nome, slug, cartella, categoria…",
   "search-platform": "Cerca Piattafroma",
   "settings": "Impostazioni",
   "show": "Mostra",
diff --git a/frontend/src/locales/ja_JP/platform.json b/frontend/src/locales/ja_JP/platform.json
@@ -62,6 +62,7 @@
   "reset-filters": "フィルタをリセット",
   "rom-count": "{n}件のROM | {n}件のROM",
   "scan-platform": "プラットフォームをスキャン",
+  "search-placeholder": "名前、スラッグ、フォルダ、カテゴリで検索…",
   "search-platform": "プラットフォームを検索",
   "settings": "設定",
   "show": "表示",
diff --git a/frontend/src/locales/ko_KR/platform.json b/frontend/src/locales/ko_KR/platform.json
@@ -62,6 +62,7 @@
   "reset-filters": "필터 초기화",
   "rom-count": "{n}개 ROM | {n}개 ROM",
   "scan-platform": "플랫폼 스캔",
+  "search-placeholder": "이름, 슬러그, 폴더, 분류로 검색…",
   "search-platform": "플랫폼 검색",
   "settings": "설정",
   "show": "표시",
diff --git a/frontend/src/locales/pl_PL/platform.json b/frontend/src/locales/pl_PL/platform.json
@@ -62,6 +62,7 @@
   "reset-filters": "Zresetuj filtry",
   "rom-count": "{n} ROM | {n} ROM-y | {n} ROM-ów",
   "scan-platform": "Skanuj platformę",
+  "search-placeholder": "Szukaj po nazwie, slugu, folderze, kategorii…",
   "search-platform": "Szukaj platformy",
   "settings": "Ustawienia",
   "show": "Pokaż",
diff --git a/frontend/src/locales/pt_BR/platform.json b/frontend/src/locales/pt_BR/platform.json
@@ -62,6 +62,7 @@
   "reset-filters": "Redefinir filtros",
   "rom-count": "{n} ROM | {n} ROMs",
   "scan-platform": "Varrer plataforma",
+  "search-placeholder": "Buscar por nome, slug, pasta, categoria…",
   "search-platform": "Buscar plataforma",
   "settings": "Configurações",
   "show": "Mostrar",
diff --git a/frontend/src/locales/ro_RO/platform.json b/frontend/src/locales/ro_RO/platform.json
@@ -62,6 +62,7 @@
   "reset-filters": "Resetează filtrele",
   "rom-count": "{n} ROM | {n} ROM-uri",
   "scan-platform": "Scanează platforma",
+  "search-placeholder": "Caută după nume, slug, folder, categorie…",
   "search-platform": "Căutare în platformă",
   "settings": "Setări",
   "show": "Afișează",
diff --git a/frontend/src/locales/ru_RU/platform.json b/frontend/src/locales/ru_RU/platform.json
@@ -62,6 +62,7 @@
   "reset-filters": "Сбросить фильтры",
   "rom-count": "{n} ROM | {n} ROM-ов",
   "scan-platform": "Сканировать платформу",
+  "search-placeholder": "Поиск по названию, слагу, папке, категории…",
   "search-platform": "Поиск платформы",
   "settings": "Настройки",
   "show": "Показать",
diff --git a/frontend/src/locales/tr_TR/platform.json b/frontend/src/locales/tr_TR/platform.json
@@ -62,6 +62,7 @@
   "reset-filters": "Filtreleri sıfırla",
   "rom-count": "{n} ROM | {n} ROM",
   "scan-platform": "Platformu tara",
+  "search-placeholder": "Ad, slug, klasör, kategori ile ara…",
   "search-platform": "Platform ara",
   "settings": "Ayarlar",
   "show": "Göster",
diff --git a/frontend/src/locales/zh_CN/platform.json b/frontend/src/locales/zh_CN/platform.json
@@ -62,6 +62,7 @@
   "reset-filters": "重置筛选器",
   "rom-count": "{n} 个 ROM | {n} 个 ROM",
   "scan-platform": "扫描平台",
+  "search-placeholder": "按名称、Slug、文件夹、分类搜索…",
   "search-platform": "搜索平台",
   "settings": "设置",
   "show": "显示",
diff --git a/frontend/src/locales/zh_TW/platform.json b/frontend/src/locales/zh_TW/platform.json
@@ -62,6 +62,7 @@
   "reset-filters": "重置篩選器",
   "rom-count": "{n} 個 ROM | {n} 個 ROM",
   "scan-platform": "掃描平台",
+  "search-placeholder": "依名稱、網址關鍵字、資料夾、分類搜尋…",
   "search-platform": "搜尋平台",
   "settings": "設定",
   "show": "顯示",
diff --git a/frontend/src/v2/views/PlatformsIndex.test.ts b/frontend/src/v2/views/PlatformsIndex.test.ts
@@ -12,8 +12,9 @@ vi.mock("vue-i18n", () => ({
 
 // Plain object rather than a reactive route: every test sets the query
 // before mounting, which is when the view reads it.
-const { routeState } = vi.hoisted(() => ({
+const { routeState, searchState } = vi.hoisted(() => ({
   routeState: { query: {} as Record<string, string> },
+  searchState: { term: "" },
 }));
 
 vi.mock("vue-router", async (importOriginal) => ({
@@ -103,28 +104,35 @@ vi.mock("@/v2/composables/usePlatformPlayable", () => ({
 }));
 
 vi.mock("@/v2/composables/useTileSearchUrl", () => ({
-  useTileSearchUrl: () => ref(""),
+  useTileSearchUrl: () => ref(searchState.term),
 }));
 
 vi.mock("@/v2/composables/useWrapGridNav", () => ({
   useWrapGridNav: vi.fn(),
 }));
 
-function platform(id: number, displayName: string, romCount: number): Platform {
+function platform(
+  id: number,
+  displayName: string,
+  romCount: number,
+  overrides: Partial<Platform> = {},
+): Platform {
   return {
     id,
     display_name: displayName,
     name: displayName,
     slug: displayName.toLowerCase().replaceAll(" ", "-"),
     fs_slug: displayName.toLowerCase().replaceAll(" ", "-"),
     rom_count: romCount,
+    ...overrides,
   } as Platform;
 }
 
 describe("PlatformsIndex", () => {
   beforeEach(() => {
     setActivePinia(createPinia());
     routeState.query = {};
+    searchState.term = "";
   });
 
   it("hides empty platforms by default", () => {
@@ -158,4 +166,133 @@ describe("PlatformsIndex", () => {
 
     expect(wrapper.text()).toContain("platform.no-platforms-with-games");
   });
+
+  describe("search", () => {
+    function seed() {
+      storePlatforms().set([
+        platform(1, "PlayStation", 30, {
+          slug: "ps",
+          fs_slug: "psx",
+          category: "console",
+          family_name: "PlayStation",
+        }),
+        platform(2, "Nintendo 64", 12, {
+          slug: "n64",
+          fs_slug: "nintendo-64",
+          category: "console",
+          family_name: "Nintendo",
+        }),
+        platform(3, "Game Boy Advance", 5, {
+          slug: "gba",
+          fs_slug: "gba-roms",
+          category: "portable_console",
+          family_name: "Nintendo",
+        }),
+      ]);
+    }
+
+    it("matches on the display name", () => {
+      seed();
+      searchState.term = "advance";
+
+      const wrapper = mount(PlatformsIndex);
+
+      expect(wrapper.text()).toContain("Game Boy Advance 5");
+      expect(wrapper.text()).not.toContain("PlayStation 30");
+      expect(wrapper.text()).not.toContain("Nintendo 64 12");
+    });
+
+    it("matches on the slug", () => {
+      seed();
+      searchState.term = "n64";
+
+      const wrapper = mount(PlatformsIndex);
+
+      expect(wrapper.text()).toContain("Nintendo 64 12");
+      expect(wrapper.text()).not.toContain("PlayStation 30");
+      expect(wrapper.text()).not.toContain("Game Boy Advance 5");
+    });
+
+    it("matches on the folder name", () => {
+      seed();
+      searchState.term = "psx";
+
+      const wrapper = mount(PlatformsIndex);
+
+      expect(wrapper.text()).toContain("PlayStation 30");
+      expect(wrapper.text()).not.toContain("Nintendo 64 12");
+      expect(wrapper.text()).not.toContain("Game Boy Advance 5");
+    });
+
+    it("matches on the raw category", () => {
+      seed();
+      searchState.term = "portable_console";
+
+      const wrapper = mount(PlatformsIndex);
+
+      expect(wrapper.text()).toContain("Game Boy Advance 5");
+      expect(wrapper.text()).not.toContain("PlayStation 30");
+      expect(wrapper.text()).not.toContain("Nintendo 64 12");
+    });
+
+    // The category the user reads is the prettified label, so typing what
+    // the list column and the group heading show has to match too.
+    it("matches on the prettified category label", () => {
+      seed();
+      searchState.term = "portable console";
+
+      const wrapper = mount(PlatformsIndex);
+
+      expect(wrapper.text()).toContain("Game Boy Advance 5");
+      expect(wrapper.text()).not.toContain("PlayStation 30");
+      expect(wrapper.text()).not.toContain("Nintendo 64 12");
+    });
+
+    it("matches on the family name", () => {
+      seed();
+      searchState.term = "nintendo";
+
+      const wrapper = mount(PlatformsIndex);
+
+      expect(wrapper.text()).toContain("Game Boy Advance 5");
+      expect(wrapper.text()).toContain("Nintendo 64 12");
+      expect(wrapper.text()).not.toContain("PlayStation 30");
+    });
+
+    it("ignores case and surrounding whitespace", () => {
+      seed();
+      searchState.term = "  PSX  ";
+
+      const wrapper = mount(PlatformsIndex);
+
+      expect(wrapper.text()).toContain("PlayStation 30");
+      expect(wrapper.text()).not.toContain("Nintendo 64 12");
+    });
+
+    it("reports no results when nothing matches any field", () => {
+      seed();
+      searchState.term = "sega";
+
+      const wrapper = mount(PlatformsIndex);
+
+      expect(wrapper.text()).toContain("platform.no-platforms-search");
+      expect(wrapper.text()).not.toContain("PlayStation 30");
+    });
+
+    it("tolerates platforms with no category or family", () => {
+      storePlatforms().set([
+        platform(1, "Arcade", 7, {
+          slug: "arcade",
+          fs_slug: "arcade",
+          category: null,
+          family_name: null,
+        }),
+      ]);
+      searchState.term = "arcade";
+
+      const wrapper = mount(PlatformsIndex);
+
+      expect(wrapper.text()).toContain("Arcade 7");
+    });
+  });
 });
diff --git a/frontend/src/v2/views/PlatformsIndex.vue b/frontend/src/v2/views/PlatformsIndex.vue
@@ -277,11 +277,25 @@ onMounted(() => {
   }
 });
 
+// Fields a search term is matched against. Beyond the display name,
+// these are the identifiers a user already knows a platform by: the
+// slug used in URLs and provider ids, the folder it lives in on disk,
+// and the two group-by axes the list view exposes as columns. Category
+// contributes both the raw IGDB value and the prettified label, since
+// the label is what the UI shows ("Portable console") while the raw
+// value is what the rest of the app stores ("portable_console").
+function searchFields(p: Platform): string[] {
+  const fields = [p.display_name, p.slug, p.fs_slug];
+  if (p.category) fields.push(p.category, prettifyPlatformCategory(p.category));
+  if (p.family_name) fields.push(p.family_name);
+  return fields;
+}
+
 const filtered = computed<Platform[]>(() => {
   const term = searchTerm.value.trim().toLowerCase();
   if (!term) return visiblePlatforms.value;
   return visiblePlatforms.value.filter((p) =>
-    p.display_name.toLowerCase().includes(term),
+    searchFields(p).some((field) => field.toLowerCase().includes(term)),
   );
 });
 
@@ -479,7 +493,7 @@ const groupedBuckets = computed<Bucket[] | null>(() => {
         :group-by-items="platformGroupByItems"
         :segment-filters="segmentFilters"
         show-search
-        :search-placeholder="t('platform.search-platform')"
+        :search-placeholder="t('platform.search-placeholder')"
         @update:group-by="groupBy = $event"
         @update:layout="layout = $event"
         @update:sort-dir="gridSortDir = $event"
