gabehf/Koito
1
0
Fork 0
mirror of https://github.com/gabehf/Koito.git synced 2026-03-17 19:26:36 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix rewind page

Browse source
This commit is contained in:
Gabe Farrell 2026-01-16 00:56:55 -05:00
parent 46e216ebf5
commit 6e7e7a87cc
3 changed files with 16 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

6
client/api/api.ts
View file

@ -462,9 +462,9 @@ type NowPlaying = {
}; };
type RewindStats = { type RewindStats = {
title: string; title: string;
top_artists: Artist[]; top_artists: Ranked<Artist>[];
top_albums: Album[]; top_albums: Ranked<Album>[];
top_tracks: Track[]; top_tracks: Ranked<Track>[];
minutes_listened: number; minutes_listened: number;
avg_minutes_listened_per_day: number; avg_minutes_listened_per_day: number;
plays: number; plays: number;

6
client/app/components/rewind/Rewind.tsx
View file

@ -8,9 +8,9 @@ interface Props {
} }
export default function Rewind(props: Props) { export default function Rewind(props: Props) {
const artistimg = props.stats.top_artists[0]?.image; const artistimg = props.stats.top_artists[0]?.item.image;
const albumimg = props.stats.top_albums[0]?.image; const albumimg = props.stats.top_albums[0]?.item.image;
const trackimg = props.stats.top_tracks[0]?.image; const trackimg = props.stats.top_tracks[0]?.item.image;
if ( if (
!props.stats.top_artists[0] || !props.stats.top_artists[0] ||
!props.stats.top_albums[0] || !props.stats.top_albums[0] ||

18
client/app/components/rewind/RewindTopItem.tsx
View file

@ -1,7 +1,9 @@
import type { Ranked } from "api/api";
type TopItemProps<T> = { type TopItemProps<T> = {
title: string; title: string;
imageSrc: string; imageSrc: string;
items: T[]; items: Ranked<T>[];
getLabel: (item: T) => string; getLabel: (item: T) => string;
includeTime?: boolean; includeTime?: boolean;
}; };
@ -28,23 +30,23 @@ export function RewindTopItem<
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<div className="flex flex-col items-start mb-2"> <div className="flex flex-col items-start mb-2">
<h2>{getLabel(top)}</h2> <h2>{getLabel(top.item)}</h2>
<span className="text-(--color-fg-tertiary) -mt-3 text-sm"> <span className="text-(--color-fg-tertiary) -mt-3 text-sm">
{`${top.listen_count} plays`} {`${top.item.listen_count} plays`}
{includeTime {includeTime
? ` (${Math.floor(top.time_listened / 60)} minutes)` ? ` (${Math.floor(top.item.time_listened / 60)} minutes)`
: ``} : ``}
</span> </span>
</div> </div>
</div> </div>
{rest.map((e) => ( {rest.map((e) => (
<div key={e.id} className="text-sm"> <div key={e.item.id} className="text-sm">
{getLabel(e)} {getLabel(e.item)}
<span className="text-(--color-fg-tertiary)"> <span className="text-(--color-fg-tertiary)">
{` - ${e.listen_count} plays`} {` - ${e.item.listen_count} plays`}
{includeTime {includeTime
? ` (${Math.floor(e.time_listened / 60)} minutes)` ? ` (${Math.floor(e.item.time_listened / 60)} minutes)`
: ``} : ``}
</span> </span>
</div> </div>