SpotifyControls: Add context menu icons
This commit is contained in:
parent
f2ef96a420
commit
c062f9bdeb
@ -16,6 +16,8 @@
|
||||
* along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
import "./iconStyles.css";
|
||||
|
||||
import { classes } from "@utils/misc";
|
||||
import type { PropsWithChildren } from "react";
|
||||
|
||||
@ -81,3 +83,34 @@ export function CopyIcon(props: IconProps) {
|
||||
</Icon>
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Discord's open external icon, as seen in the user profile connections
|
||||
*/
|
||||
export function OpenExternalIcon(props: IconProps) {
|
||||
return (
|
||||
<Icon
|
||||
{...props}
|
||||
className={classes(props.className, "vc-open-external-icon")}
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<polygon
|
||||
fill="currentColor"
|
||||
fill-rule="nonzero"
|
||||
points="13 20 11 20 11 8 5.5 13.5 4.08 12.08 12 4.16 19.92 12.08 18.5 13.5 13 8"
|
||||
/>
|
||||
</Icon>
|
||||
);
|
||||
}
|
||||
|
||||
export function ImageIcon(props: IconProps) {
|
||||
return (
|
||||
<Icon
|
||||
{...props}
|
||||
className={classes(props.className, "vc-image-icon")}
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path fill="currentColor" d="M21,19V5c0,-1.1 -0.9,-2 -2,-2H5c-1.1,0 -2,0.9 -2,2v14c0,1.1 0.9,2 2,2h14c1.1,0 2,-0.9 2,-2zM8.5,13.5l2.5,3.01L14.5,12l4.5,6H5l3.5,-4.5z" />
|
||||
</Icon>
|
||||
);
|
||||
}
|
||||
|
3
src/components/iconStyles.css
Normal file
3
src/components/iconStyles.css
Normal file
@ -0,0 +1,3 @@
|
||||
.vc-open-external-icon {
|
||||
transform: rotate(45deg);
|
||||
}
|
@ -20,6 +20,7 @@ import "./spotifyStyles.css";
|
||||
|
||||
import ErrorBoundary from "@components/ErrorBoundary";
|
||||
import { Flex } from "@components/Flex";
|
||||
import { ImageIcon, LinkIcon, OpenExternalIcon } from "@components/Icons";
|
||||
import { Link } from "@components/Link";
|
||||
import { debounce } from "@utils/debounce";
|
||||
import { classes, copyWithToast } from "@utils/misc";
|
||||
@ -88,12 +89,14 @@ function CopyContextMenu({ name, path }: { name: string; path: string; }) {
|
||||
id={copyId}
|
||||
label={`Copy ${name} Link`}
|
||||
action={() => copyWithToast("https://open.spotify.com" + path)}
|
||||
icon={LinkIcon}
|
||||
/>
|
||||
<Menu.MenuItem
|
||||
key={openId}
|
||||
id={openId}
|
||||
label={`Open ${name} in Spotify`}
|
||||
action={() => SpotifyStore.openExternal(path)}
|
||||
icon={OpenExternalIcon}
|
||||
/>
|
||||
</Menu.Menu>
|
||||
);
|
||||
@ -221,6 +224,7 @@ function AlbumContextMenu({ track }: { track: Track; }) {
|
||||
id="open-album"
|
||||
label="Open Album"
|
||||
action={() => SpotifyStore.openExternal(`/album/${track.album.id}`)}
|
||||
icon={OpenExternalIcon}
|
||||
/>
|
||||
<Menu.MenuItem
|
||||
key="view-cover"
|
||||
@ -228,6 +232,7 @@ function AlbumContextMenu({ track }: { track: Track; }) {
|
||||
label="View Album Cover"
|
||||
// trolley
|
||||
action={() => (Vencord.Plugins.plugins.ViewIcons as any).openImage(track.album.image.url)}
|
||||
icon={ImageIcon}
|
||||
/>
|
||||
<Menu.MenuControlItem
|
||||
id="spotify-volume"
|
||||
|
Loading…
Reference in New Issue
Block a user