gabehf/Koito
1
0
Fork 0
mirror of https://github.com/gabehf/Koito.git synced 2026-04-22 20:11:50 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions

Added KOITO_DATE_FORMAT option to choose how the dates are displayed

Browse source
This commit is contained in:
joffrey-b 2026-04-21 11:17:47 +02:00
parent 0ec7b458cc
commit 61d5f2f5f0
10 changed files with 53 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

7
client/app/routes/MediaItems/Album.tsx
View file

@ -6,8 +6,9 @@ import LastPlays from "~/components/LastPlays";
import PeriodSelector from "~/components/PeriodSelector";
import MediaLayout from "./MediaLayout";
import ActivityGrid from "~/components/ActivityGrid";
import { timeListenedString } from "~/utils/utils";
import { timeListenedString, formatDate } from "~/utils/utils";
import InterestGraph from "~/components/InterestGraph";
import { useAppContext } from "~/providers/AppProvider";
export async function clientLoader({ params }: LoaderFunctionArgs) {
const res = await fetch(`/apis/web/v1/album?id=${params.id}`);
@ -21,6 +22,7 @@ export async function clientLoader({ params }: LoaderFunctionArgs) {
export default function Album() {
const album = useLoaderData() as Album;
const [period, setPeriod] = useState("week");
const { dateFormat } = useAppContext();
console.log(album);
@ -59,7 +61,7 @@ export default function Album() {
{album.first_listen > 0 && (
<p title={new Date(album.first_listen * 1000).toLocaleString()}>
Listening since{" "}
{new Date(album.first_listen * 1000).toLocaleDateString()}
{formatDate(new Date(album.first_listen * 1000), dateFormat)}
</p>
)}
</div>
@ -79,3 +81,4 @@ export default function Album() {
</MediaLayout>
);
}

7
client/app/routes/MediaItems/Artist.tsx
View file

@ -7,8 +7,9 @@ import PeriodSelector from "~/components/PeriodSelector";
import MediaLayout from "./MediaLayout";
import ArtistAlbums from "~/components/ArtistAlbums";
import ActivityGrid from "~/components/ActivityGrid";
import { timeListenedString } from "~/utils/utils";
import { timeListenedString, formatDate } from "~/utils/utils";
import InterestGraph from "~/components/InterestGraph";
import { useAppContext } from "~/providers/AppProvider";
export async function clientLoader({ params }: LoaderFunctionArgs) {
const res = await fetch(`/apis/web/v1/artist?id=${params.id}`);
@ -22,6 +23,7 @@ export async function clientLoader({ params }: LoaderFunctionArgs) {
export default function Artist() {
const artist = useLoaderData() as Artist;
const [period, setPeriod] = useState("week");
const { dateFormat } = useAppContext();
// remove canonical name from alias list
console.log(artist.aliases);
@ -65,7 +67,7 @@ export default function Artist() {
{artist.first_listen > 0 && (
<p title={new Date(artist.first_listen * 1000).toLocaleString()}>
Listening since{" "}
{new Date(artist.first_listen * 1000).toLocaleDateString()}
{formatDate(new Date(artist.first_listen * 1000), dateFormat)}
</p>
)}
</div>
@ -88,3 +90,4 @@ export default function Artist() {
</MediaLayout>
);
}

7
client/app/routes/MediaItems/Track.tsx
View file

@ -5,8 +5,9 @@ import LastPlays from "~/components/LastPlays";
import PeriodSelector from "~/components/PeriodSelector";
import MediaLayout from "./MediaLayout";
import ActivityGrid from "~/components/ActivityGrid";
import { timeListenedString } from "~/utils/utils";
import { timeListenedString, formatDate } from "~/utils/utils";
import InterestGraph from "~/components/InterestGraph";
import { useAppContext } from "~/providers/AppProvider";
export async function clientLoader({ params }: LoaderFunctionArgs) {
let res = await fetch(`/apis/web/v1/track?id=${params.id}`);
@ -27,6 +28,7 @@ export async function clientLoader({ params }: LoaderFunctionArgs) {
export default function Track() {
const { track, album } = useLoaderData();
const [period, setPeriod] = useState("week");
const { dateFormat } = useAppContext();
return (
<MediaLayout
@ -69,7 +71,7 @@ export default function Track() {
{track.first_listen > 0 && (
<p title={new Date(track.first_listen * 1000).toLocaleString()}>
Listening since{" "}
{new Date(track.first_listen * 1000).toLocaleDateString()}
{formatDate(new Date(track.first_listen * 1000), dateFormat)}
</p>
)}
</div>
@ -88,3 +90,4 @@ export default function Track() {
</MediaLayout>
);
}