From 12cbd73e7f775179e42b500a2b3bdb0e7f32e3d1 Mon Sep 17 00:00:00 2001 From: Vendicated Date: Thu, 30 Mar 2023 01:29:34 +0200 Subject: [PATCH] SpotifyControls: Add right click menus to title/album/artists --- .../spotifyControls/PlayerComponent.tsx | 36 ++++++++++++++++++- src/plugins/spotifyControls/SpotifyStore.ts | 7 +++- src/plugins/spotifyControls/index.tsx | 5 +++ 3 files changed, 46 insertions(+), 2 deletions(-) diff --git a/src/plugins/spotifyControls/PlayerComponent.tsx b/src/plugins/spotifyControls/PlayerComponent.tsx index 439ecc249..3276be17b 100644 --- a/src/plugins/spotifyControls/PlayerComponent.tsx +++ b/src/plugins/spotifyControls/PlayerComponent.tsx @@ -22,7 +22,7 @@ import ErrorBoundary from "@components/ErrorBoundary"; import { Flex } from "@components/Flex"; import { Link } from "@components/Link"; import { debounce } from "@utils/debounce"; -import { classes, LazyComponent } from "@utils/misc"; +import { classes, copyWithToast, LazyComponent } from "@utils/misc"; import { filters, find } from "@webpack"; import { ContextMenu, FluxDispatcher, Forms, Menu, React, useEffect, useState, useStateFromStores } from "@webpack/common"; @@ -74,6 +74,37 @@ function Button(props: React.ButtonHTMLAttributes) { ); } +function CopyContextMenu({ name, path }: { name: string; path: string; }) { + const copyId = `spotify-copy-${name}`; + const openId = `spotify-open-${name}`; + + return ( + FluxDispatcher.dispatch({ type: "CONTEXT_MENU_CLOSE" })} + aria-label={`Spotify ${name} Menu`} + > + copyWithToast("https://open.spotify.com" + path)} + /> + SpotifyStore.openExternal(path)} + /> + + ); +} + +function makeContextMenu(name: string, path: string) { + return (e: React.MouseEvent) => + ContextMenu.open(e, () => ); +} + function Controls() { const [isPlaying, shuffle, repeat] = useStateFromStores( [SpotifyStore], @@ -263,6 +294,7 @@ function Info({ track }: { track: Track; }) { onClick={track.id ? () => { SpotifyStore.openExternal(`/track/${track.id}`); } : void 0} + onContextMenu={track.id ? makeContextMenu("Song", `/track/${track.id}`) : void 0} > {track.name} @@ -277,6 +309,7 @@ function Info({ track }: { track: Track; }) { href={`https://open.spotify.com/artist/${a.id}`} style={{ fontSize: "inherit" }} title={a.name} + onContextMenu={makeContextMenu("Artist", `/artist/${a.id}`)} > {a.name} @@ -295,6 +328,7 @@ function Info({ track }: { track: Track; }) { disabled={!track.album.id} style={{ fontSize: "inherit" }} title={track.album.name} + onContextMenu={makeContextMenu("Album", `/album/${track.album.id}`)} > {track.album.name} diff --git a/src/plugins/spotifyControls/SpotifyStore.ts b/src/plugins/spotifyControls/SpotifyStore.ts index ceac57707..723bc4cf8 100644 --- a/src/plugins/spotifyControls/SpotifyStore.ts +++ b/src/plugins/spotifyControls/SpotifyStore.ts @@ -16,6 +16,7 @@ * along with this program. If not, see . */ +import { Settings } from "@api/settings"; import IpcEvents from "@utils/IpcEvents"; import { proxyLazy } from "@utils/proxyLazy"; import { findByPropsLazy } from "@webpack"; @@ -89,7 +90,11 @@ export const SpotifyStore = proxyLazy(() => { public isSettingPosition = false; public openExternal(path: string) { - VencordNative.ipc.invoke(IpcEvents.OPEN_EXTERNAL, "https://open.spotify.com" + path); + const url = Settings.plugins.SpotifyControls.useSpotifyUris + ? "spotify:" + path.replaceAll("/", (_, idx) => idx === 0 ? "" : ":") + : "https://open.spotify.com" + path; + + VencordNative.ipc.invoke(IpcEvents.OPEN_EXTERNAL, url); } // Need to keep track of this manually diff --git a/src/plugins/spotifyControls/index.tsx b/src/plugins/spotifyControls/index.tsx index 5d82998df..ce1bf6759 100644 --- a/src/plugins/spotifyControls/index.tsx +++ b/src/plugins/spotifyControls/index.tsx @@ -47,6 +47,11 @@ export default definePlugin({ default: false, onChange: v => toggleHoverControls(v) }, + useSpotifyUris: { + type: OptionType.BOOLEAN, + description: "Open Spotify URIs instead of Spotify URLs. Will only work if you have Spotify installed and might not work on all platforms", + default: false + } }, patches: [ {