better album dates

This commit is contained in:
Kendall Garner 2024-08-25 19:52:44 -07:00
parent 8c929d0dc3
commit 9923c021fa
No known key found for this signature in database
GPG key ID: 18D2767419676C87
7 changed files with 52 additions and 13 deletions

View file

@ -1,5 +1,6 @@
import { Group, Stack } from '@mantine/core';
import { forwardRef, Fragment, Ref } from 'react';
import { Group, Stack } from '@mantine/core';
import { useTranslation } from 'react-i18next';
import { generatePath, useParams } from 'react-router';
import { Link } from 'react-router-dom';
import { LibraryItem, ServerType } from '/@/renderer/api/types';
@ -9,7 +10,7 @@ import { LibraryHeader, useSetRating } from '/@/renderer/features/shared';
import { useContainerQuery } from '/@/renderer/hooks';
import { AppRoute } from '/@/renderer/router/routes';
import { useCurrentServer } from '/@/renderer/store';
import { formatDurationString } from '/@/renderer/utils';
import { formatDateAbsolute, formatDurationString } from '/@/renderer/utils';
interface AlbumDetailHeaderProps {
background: string;
@ -21,26 +22,42 @@ export const AlbumDetailHeader = forwardRef(
const server = useCurrentServer();
const detailQuery = useAlbumDetail({ query: { id: albumId }, serverId: server?.id });
const cq = useContainerQuery();
const { t } = useTranslation();
const originalDifferentFromRelease =
detailQuery.data?.originalDate &&
detailQuery.data.originalDate !== detailQuery.data.releaseDate;
const releasePrefix = originalDifferentFromRelease
? t('page.albumDetail.released', { postProcess: 'sentenceCase' })
: '♫';
const metadataItems = [
{
id: 'releaseYear',
secondary: false,
value: detailQuery?.data?.releaseYear,
id: 'releaseDate',
value:
detailQuery?.data?.releaseDate &&
`${releasePrefix} ${formatDateAbsolute(detailQuery?.data?.releaseDate)}`,
},
{
id: 'songCount',
secondary: false,
value: `${detailQuery?.data?.songCount} songs`,
},
{
id: 'duration',
secondary: false,
value:
detailQuery?.data?.duration && formatDurationString(detailQuery.data.duration),
},
];
if (originalDifferentFromRelease) {
const formatted = `${formatDateAbsolute(detailQuery!.data!.originalDate)}`;
metadataItems.splice(0, 0, {
id: 'originalDate',
value: formatted,
});
}
const updateRatingMutation = useSetRating({});
const handleUpdateRating = (rating: number) => {
@ -71,7 +88,7 @@ export const AlbumDetailHeader = forwardRef(
{metadataItems.map((item, index) => (
<Fragment key={`item-${item.id}-${index}`}>
{index > 0 && <Text $noSelect></Text>}
<Text $secondary={item.secondary}>{item.value}</Text>
<Text>{item.value}</Text>
</Fragment>
))}
{showRating && (