[enhancement]: allow copying/opening path in song modal

This commit is contained in:
Kendall Garner 2024-04-06 16:13:09 -07:00
parent c1345802aa
commit 2c17458fdf
No known key found for this signature in database
GPG key ID: 18D2767419676C87
5 changed files with 94 additions and 1 deletions

View file

@ -9,6 +9,7 @@ import { formatSizeString } from '/@/renderer/utils/format-size-string';
import { replaceURLWithHTMLLinks } from '/@/renderer/utils/linkify';
import { Rating, Spoiler } from '/@/renderer/components';
import { sanitize } from '/@/renderer/utils/sanitize';
import { SongPath } from '/@/renderer/features/item-details/components/song-path';
export type ItemDetailsModalProps = {
item: Album | AlbumArtist | Song;
@ -156,7 +157,7 @@ const AlbumArtistPropertyMapping: ItemDetailRow<AlbumArtist>[] = [
const SongPropertyMapping: ItemDetailRow<Song>[] = [
{ key: 'name', label: 'common.title' },
{ key: 'path', label: 'common.path' },
{ key: 'path', label: 'common.path', render: SongPath },
{ label: 'entity.albumArtist_one', render: formatArtists },
{ key: 'album', label: 'entity.album_one' },
{ key: 'discNumber', label: 'common.disc' },

View file

@ -0,0 +1,67 @@
import { ActionIcon, CopyButton, Group } from '@mantine/core';
import isElectron from 'is-electron';
import { useTranslation } from 'react-i18next';
import { RiCheckFill, RiClipboardFill, RiExternalLinkFill } from 'react-icons/ri';
import { Tooltip, toast } from '/@/renderer/components';
import styled from 'styled-components';
const util = isElectron() ? window.electron.utils : null;
export type SongPathProps = {
path: string | null;
};
const PathText = styled.div`
user-select: all;
`;
export const SongPath = ({ path }: SongPathProps) => {
const { t } = useTranslation();
if (!path) return null;
return (
<Group>
<CopyButton
timeout={2000}
value={path}
>
{({ copied, copy }) => (
<Tooltip
withinPortal
label={t(
copied ? 'page.itemDetail.copiedPath' : 'page.itemDetail.copyPath',
{ postProcess: 'sentenceCase' },
)}
>
<ActionIcon onClick={copy}>
{copied ? <RiCheckFill /> : <RiClipboardFill />}
</ActionIcon>
</Tooltip>
)}
</CopyButton>
{util && (
<Tooltip
withinPortal
label={t('page.itemDetail.openFile', { postProcess: 'sentenceCase' })}
>
<ActionIcon>
<RiExternalLinkFill
onClick={() => {
util.openItem(path).catch((error) => {
toast.error({
message: (error as Error).message,
title: t('error.openError', {
postProcess: 'sentenceCase',
}),
});
});
}}
/>
</ActionIcon>
</Tooltip>
)}
<PathText>{path}</PathText>
</Group>
);
};