dorkbutt/vencord
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

SpotifyControls: add copy song/artist/album name options

Browse source
This commit is contained in:
Vendicated 2025-09-08 02:51:04 +02:00
parent efecbae75b
commit b225f2ec6c
No known key found for this signature in database
GPG key ID: 315C51BB0D6C5434
1 changed files with 21 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

45
src/plugins/spotifyControls/PlayerComponent.tsx
View file

@ -21,7 +21,7 @@ import "./spotifyStyles.css";
import { Settings } from "@api/Settings"; import { Settings } from "@api/Settings";
import { classNameFactory } from "@api/Styles"; import { classNameFactory } from "@api/Styles";
import { Flex } from "@components/Flex"; import { Flex } from "@components/Flex";
import { ImageIcon, LinkIcon, OpenExternalIcon } from "@components/Icons"; import { CopyIcon, ImageIcon, LinkIcon, OpenExternalIcon } from "@components/Icons";
import { debounce } from "@shared/debounce"; import { debounce } from "@shared/debounce";
import { openImageModal } from "@utils/discord"; import { openImageModal } from "@utils/discord";
import { classes, copyWithToast } from "@utils/misc"; import { classes, copyWithToast } from "@utils/misc";
@ -76,27 +76,28 @@ function Button(props: React.ButtonHTMLAttributes<HTMLButtonElement>) {
); );
} }
function CopyContextMenu({ name, path }: { name: string; path: string; }) { function CopyContextMenu({ name, type, path }: { type: string; name: string; path: string; }) {
const copyId = `spotify-copy-${name}`;
const openId = `spotify-open-${name}`;
return ( return (
<Menu.Menu <Menu.Menu
navId={`spotify-${name}-menu`} navId="vc-spotify-menu"
onClose={() => FluxDispatcher.dispatch({ type: "CONTEXT_MENU_CLOSE" })} onClose={ContextMenuApi.closeContextMenu}
aria-label={`Spotify ${name} Menu`} aria-label={`Spotify ${type} Menu`}
> >
<Menu.MenuItem <Menu.MenuItem
key={copyId} id="vc-spotify-copy-name"
id={copyId} label={`Copy ${type} Name`}
label={`Copy ${name} Link`} action={() => copyWithToast(name)}
icon={CopyIcon}
/>
<Menu.MenuItem
id="vc-spotify-copy-link"
label={`Copy ${type} Link`}
action={() => copyWithToast("https://open.spotify.com" + path)} action={() => copyWithToast("https://open.spotify.com" + path)}
icon={LinkIcon} icon={LinkIcon}
/> />
<Menu.MenuItem <Menu.MenuItem
key={openId} id="vc-spotify-open"
id={openId} label={`Open ${type} in Spotify`}
label={`Open ${name} in Spotify`}
action={() => SpotifyStore.openExternal(path)} action={() => SpotifyStore.openExternal(path)}
icon={OpenExternalIcon} icon={OpenExternalIcon}
/> />
@ -104,11 +105,6 @@ function CopyContextMenu({ name, path }: { name: string; path: string; }) {
); );
} }
function makeContextMenu(name: string, path: string) {
return (e: React.MouseEvent<HTMLElement, MouseEvent>) =>
ContextMenuApi.openContextMenu(e, () => <CopyContextMenu name={name} path={path} />);
}
function Controls() { function Controls() {
const [isPlaying, shuffle, repeat] = useStateFromStores( const [isPlaying, shuffle, repeat] = useStateFromStores(
[SpotifyStore], [SpotifyStore],
@ -259,13 +255,14 @@ function AlbumContextMenu({ track }: { track: Track; }) {
); );
} }
function makeLinkProps(name: string, condition: unknown, path: string) { function makeLinkProps(type: "Song" | "Artist" | "Album", condition: unknown, name: string, path: string) {
if (!condition) return {}; if (!condition) return {};
return { return {
role: "link", role: "link",
onClick: () => SpotifyStore.openExternal(path), onClick: () => SpotifyStore.openExternal(path),
onContextMenu: makeContextMenu(name, path) onContextMenu: e =>
ContextMenuApi.openContextMenu(e, () => <CopyContextMenu type={type} name={name} path={path} />)
} satisfies React.HTMLAttributes<HTMLElement>; } satisfies React.HTMLAttributes<HTMLElement>;
} }
@ -306,7 +303,7 @@ function Info({ track }: { track: Track; }) {
id={cl("song-title")} id={cl("song-title")}
className={cl("ellipoverflow")} className={cl("ellipoverflow")}
title={track.name} title={track.name}
{...makeLinkProps("Song", track.id, `/track/${track.id}`)} {...makeLinkProps("Song", track.id, track.name, `/track/${track.id}`)}
> >
{track.name} {track.name}
</Forms.FormText> </Forms.FormText>
@ -319,7 +316,7 @@ function Info({ track }: { track: Track; }) {
className={cl("artist")} className={cl("artist")}
style={{ fontSize: "inherit" }} style={{ fontSize: "inherit" }}
title={a.name} title={a.name}
{...makeLinkProps("Artist", a.id, `/artist/${a.id}`)} {...makeLinkProps("Artist", a.id, a.name, `/artist/${a.id}`)}
> >
{a.name} {a.name}
</span> </span>
@ -336,7 +333,7 @@ function Info({ track }: { track: Track; }) {
className={cl("album")} className={cl("album")}
style={{ fontSize: "inherit" }} style={{ fontSize: "inherit" }}
title={track.album.name} title={track.album.name}
{...makeLinkProps("Album", track.album.id, `/album/${track.album.id}`)} {...makeLinkProps("Album", track.album.id, track.album.name, `/album/${track.album.id}`)}
> >
{track.album.name} {track.album.name}
</span> </span>