From 17bf019a82777e1a2061f4c32813b024ad7eab61 Mon Sep 17 00:00:00 2001
From: Elshad Toklayev <fatehmemmedli5@gmail.com>
Date: Sun, 31 May 2026 21:16:45 +0300
Subject: [PATCH] fix(web): remove UI controls that imply unimplemented
 features
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Several screens rendered decorative filter controls that were never wired to
the API, and one hero metric was mislabeled:

- Top artists: the 7d/30d/90d/1y period pills were non-interactive and the
  underlying query is all-time. Replace them with a single "All time" label.
- History: the "source" filter pills did nothing (fetchHistory only takes a
  page number). Remove them.
- Overview: the "Minutes listened · 30d" tile is the sum of the top 3 artists
  and is all-time, not 30d. Relabel it "top artists" and reword the hero copy
  to "across your top artists".
- Overview: drop the unsupported "180M tracks indexed" capability sub-label;
  the catalog holds ~170K tracks.
---
 apps/web/src/app/(app)/me/history/page.tsx     | 18 ++----------------
 apps/web/src/app/(app)/me/page.tsx             |  6 +++---
 .../app/(app)/me/stats/top-artists/page.tsx    | 14 +++-----------
 3 files changed, 8 insertions(+), 30 deletions(-)

diff --git a/apps/web/src/app/(app)/me/history/page.tsx b/apps/web/src/app/(app)/me/history/page.tsx
index 5af9227..7d7f6b6 100644
--- a/apps/web/src/app/(app)/me/history/page.tsx
+++ b/apps/web/src/app/(app)/me/history/page.tsx
@@ -2,7 +2,7 @@ import { Clock3 } from 'lucide-react';
 import { cookies } from 'next/headers';
 import { HistoryExportButton, HistoryInfiniteList } from '@/components/history';
 import { SectionContent } from '@/components/section';
-import { P2GlassPanel, P2PageHero, P2Pill } from '@/components/p2';
+import { P2GlassPanel, P2PageHero } from '@/components/p2';
 import { fetchHistory } from '@/lib/history/api';
 
 export const metadata = {
@@ -11,13 +11,6 @@ export const metadata = {
 
 export const dynamic = 'force-dynamic';
 
-const SOURCE_FILTERS = [
-  { id: 'all', label: 'All sources', active: true },
-  { id: 'preview', label: 'From a preview' },
-  { id: 'playlist', label: 'From a playlist' },
-  { id: 'album', label: 'From an album' },
-];
-
 export default async function HistoryPage() {
   const cookieStore = await cookies();
   const cookieHeader = cookieStore.toString();
@@ -33,14 +26,7 @@ export default async function HistoryPage() {
         actions={<HistoryExportButton />}
       />
       <SectionContent className="space-y-6">
-        <div className="flex flex-wrap items-center justify-between gap-3">
-          <div className="flex flex-wrap items-center gap-2">
-            {SOURCE_FILTERS.map((filter) => (
-              <P2Pill key={filter.id} tone={filter.active ? 'section' : 'outline'}>
-                {filter.label}
-              </P2Pill>
-            ))}
-          </div>
+        <div className="flex flex-wrap items-center justify-end gap-3">
           <span className="font-mono text-[11px] text-fg-muted tabular-nums">
             last {Math.min(initial.limit, initial.total)} of {initial.total.toLocaleString()} events
           </span>
diff --git a/apps/web/src/app/(app)/me/page.tsx b/apps/web/src/app/(app)/me/page.tsx
index a668b05..7e597bb 100644
--- a/apps/web/src/app/(app)/me/page.tsx
+++ b/apps/web/src/app/(app)/me/page.tsx
@@ -38,7 +38,7 @@ export const dynamic = 'force-dynamic';
 
 const CAPABILITY_TILES = [
   { href: '/catalog/tracks', icon: Headphones, label: 'Play previews', sub: '30-second previews' },
-  { href: '/catalog', icon: Search, label: 'Browse catalog', sub: '180M tracks indexed' },
+  { href: '/catalog', icon: Search, label: 'Browse catalog', sub: 'Fuzzy catalog search' },
   {
     href: '/me/playlists',
     icon: ListMusic,
@@ -252,7 +252,7 @@ export default async function OverviewPage() {
         }
         description={
           totalPlays > 0
-            ? `${totalPlays.toLocaleString()} plays and ${minutesListened.toLocaleString()} minutes captured from your real listening history. Jump back in below.`
+            ? `${totalPlays.toLocaleString()} plays and ${minutesListened.toLocaleString()} minutes across your top artists. Jump back in below.`
             : 'Your listening cockpit: play previews, build history, inspect trends, and jump into playlists.'
         }
         actions={
@@ -282,7 +282,7 @@ export default async function OverviewPage() {
             <div className="relative grid h-full gap-0 lg:grid-cols-[1fr_1.05fr]">
               <div className="p-5 sm:p-6">
                 <p className="font-mono text-[11px] font-bold tracking-[0.16em] text-section-accent uppercase">
-                  Minutes listened · 30d
+                  Minutes listened · top artists
                 </p>
                 <div className="mt-2 flex items-baseline gap-2">
                   <span className="text-4xl font-extrabold leading-none tracking-[-0.03em] text-fg-strong tabular-nums">
diff --git a/apps/web/src/app/(app)/me/stats/top-artists/page.tsx b/apps/web/src/app/(app)/me/stats/top-artists/page.tsx
index 8548c31..d2ef78c 100644
--- a/apps/web/src/app/(app)/me/stats/top-artists/page.tsx
+++ b/apps/web/src/app/(app)/me/stats/top-artists/page.tsx
@@ -93,17 +93,9 @@ export default async function TopArtistsPage() {
         title="Who's owning the hours."
         description={`Ranked across ${totalPlays.toLocaleString()} plays and ${totalMinutes.toFixed(0)} minutes from your real listening history.`}
         actions={
-          <div className="flex flex-wrap items-center gap-2">
-            {(['7d', '30d', '90d', '1y'] as const).map((period) => (
-              <P2Pill
-                key={period}
-                tone={period === '30d' ? 'on-block' : 'outline'}
-                className="text-white/90"
-              >
-                {period}
-              </P2Pill>
-            ))}
-          </div>
+          <P2Pill tone="on-block" className="text-white/90">
+            All time
+          </P2Pill>
         }
       />