Where do you want to save this very nice tune?
+-
+- 
+-
+-
+-
+- {this.props.track.name}
+-
+-
+- {Messages.USER_ACTIVITY_LISTENING_ARTISTS.format({
+- artists: this.props.track.artists,
+- artistsHook: t => t
+- })}
+-
+-
+-
+- {!this.props.loaded
+- ?
+-
+-
+- {playlist.name}
+-
+-
+- {playlist.tracksLoaded
+- ? `${Object.keys(playlist.tracks).length} tracks`
+- : Messages.DEFAULT_INPUT_PLACEHOLDER}
+-
+-
+- {playlist.tracksLoaded
+- ? (
+-
+- )
+- : (
+-
+- This item is already in this playlist. Do you want to add it anyway?
+-
+- this.setState({ hover: true })}
+- onMouseLeave={() => this.setState({ hover: false })}
+- >
+- {this.renderFromBase(isPremium)}
+- {isPremium && this.renderExtraControls()}
+- this.setState({ seeking })}
+- onDurationOverflow={() => {
+- const playerState = playerStore.getPlayerState();
+- playerStoreActions.updatePlayerState({
+- ...playerState,
+- playing: false
+- });
+- }}
+- />
+-
+- );
+- }
+-
+- renderFromBase (isPremium) {
+- const { avatar, avatarWrapper } = getModule([ 'container', 'usernameContainer' ], false);
+-
+- return {
+- ...this.props.base,
+- props: {
+- ...this.props.base.props,
+- onMouseEnter: () => void 0,
+- onMouseLeave: () => void 0,
+- onContextMenu: e => contextMenu.openContextMenu(e, () => React.createElement(ContextMenu)),
+- className: `${this.props.base.props.className || ''}`,
+- children: [
+- (
+- {
+- const protocol = getModule([ 'isProtocolRegistered', '_dispatchToken' ], false).isProtocolRegistered();
+- shell.openExternal(protocol ? this.props.currentTrack.uri : this.props.currentTrack.urls.track);
+- }}
+- >
+-
+- {(props) => (
+- 
+- )}
+-
+-
+- ),
+- (
+-
+- {hasCoolFeatures && this.renderAddToLibrary()}
+- {this.renderShuffle()}
+- {this.renderRepeat()}
+- {hasCoolFeatures && this.renderAddToPlaylist()}
+-
+- );
+- }
+-
+- renderAddToLibrary () {
+- switch (this.props.currentLibraryState) {
+- case playerStore.LibraryState.LOCAL_SONG:
+- return this.renderButton(() => Messages.SPOTIFY_CANT_LIKE_LOCAL, 'heart', () =>
+- SpotifyAPI.removeSong(this.props.currentTrack.id), false, 'active');
+- case playerStore.LibraryState.IN_LIBRARY:
+- return this.renderButton(() => Messages.SPOTIFY_REMOVE_LIKED_SONGS, 'heart', () =>
+- SpotifyAPI.removeSong(this.props.currentTrack.id), false, 'active');
+- case playerStore.LibraryState.NOT_IN_LIBRARY:
+- return this.renderButton(() => Messages.SPOTIFY_ADD_LIKED_SONGS, 'heart-regular', () =>
+- SpotifyAPI.addSong(this.props.currentTrack.id));
+- default:
+- return this.renderButton(() => Messages.DEFAULT_INPUT_PLACEHOLDER, 'heart', () => void 0, true);
+- }
+- }
+-
+- renderShuffle () {
+- if (!this.props.playerState.canShuffle) {
+- return this.renderButton(() => 'Cannot shuffle right now', 'random', () => void 0, true);
+- }
+- const { shuffle } = this.props.playerState;
+- return this.renderButton(() => 'Shuffle', 'random', () =>
+- SpotifyAPI.setShuffleState(!shuffle), false, shuffle ? 'active' : '');
+- }
+-
+- renderRepeat () {
+- if (!this.props.playerState.canRepeat && !this.props.playerState.canRepeatOne) {
+- return this.renderButton(() => 'Cannot repeat right now', 'sync', () => void 0, true);
+- }
+-
+- switch (this.props.playerState.repeat) {
+- case playerStore.RepeatState.NO_REPEAT:
+- return this.renderButton(() => 'Repeat', 'sync', () => this.handleSetRepeat(), false);
+- case playerStore.RepeatState.REPEAT_CONTEXT:
+- return this.renderButton(() => 'Repeat Track', 'sync', () => this.handleSetRepeat(), false, 'active');
+- case playerStore.RepeatState.REPEAT_TRACK:
+- return this.renderButton(() => 'No Repeat', 'undo', () => this.handleSetRepeat(), false, 'active');
+- }
+- }
+-
+- renderAddToPlaylist () {
+- return this.renderButton(() => 'Save to Playlist', 'plus-circle', () => this.handleAddToPlaylist());
+- }
+-
+- renderButton (tooltipText, icon, onClick, disabled, className) {
+- return {
+- ...this.props.base.props.children[1].props.children[0],
+- props: {
+- ...this.props.base.props.children[1].props.children[0].props,
+- icon: () => React.createElement(FontAwesome, {
+- className,
+- icon
+- }),
+- tooltipText: tooltipText(),
+- disabled,
+- onClick
+- }
+- };
+- }
+-
+- renderInfoPremium () {
+- return {
+- ...this.props.base.props.children[1].props.children[0],
+- props: {
+- ...this.props.base.props.children[1].props.children[0].props,
+- tooltipText: 'Not seeing controls?',
+- icon: () => React.createElement(Icon, {
+- name: 'Info',
+- width: 20,
+- height: 20,
+- style: { color: 'var(--interactive-normal)' }
+- }),
+- onClick: () => openModal(() => React.createElement(PayUp))
+- }
+- };
+- }
+-
+- handleSetRepeat () {
+- const possibleStates = [
+- playerStore.RepeatState.NO_REPEAT,
+- this.props.playerState.canRepeat && playerStore.RepeatState.REPEAT_CONTEXT,
+- this.props.playerState.canRepeatOne && playerStore.RepeatState.REPEAT_TRACK
+- ].filter(Boolean);
+- const currentIndex = possibleStates.indexOf(this.props.playerState.repeat);
+- const nextState = possibleStates[(currentIndex + 1) % possibleStates.length];
+- switch (nextState) {
+- case playerStore.RepeatState.NO_REPEAT:
+- SpotifyAPI.setRepeatState('off');
+- break;
+- case playerStore.RepeatState.REPEAT_CONTEXT:
+- SpotifyAPI.setRepeatState('context');
+- break;
+- case playerStore.RepeatState.REPEAT_TRACK:
+- SpotifyAPI.setRepeatState('track');
+- break;
+- }
+- }
+-
+- handleAddToPlaylist () {
+- openModal(() => React.createElement(AddToPlaylist, { track: this.props.currentTrack }));
+- }
+-}
+-
+-module.exports = Flux.connectStores(
+- [ playerStore, powercord.api.settings.store ],
+- (props) => ({
+- ...playerStore.getStore(),
+- ...powercord.api.settings._fluxProps(props.entityID)
+- })
+-)(Modal);
+diff --git a/src/Powercord/plugins/pc-spotify/components/PayUp.jsx b/src/Powercord/plugins/pc-spotify/components/PayUp.jsx
+deleted file mode 100644
+index c5af79a..0000000
+--- a/src/Powercord/plugins/pc-spotify/components/PayUp.jsx
++++ /dev/null
+@@ -1,47 +0,0 @@
+-const { React, getModule, constants: { SpotifyEndpoints }, i18n: { Messages } } = require('powercord/webpack');
+-const { FormTitle, Button } = require('powercord/components');
+-const { Modal } = require('powercord/components/modal');
+-const { close: closeModal } = require('powercord/modal');
+-
+-module.exports = React.memo(
+- () => {
+- const { size16 } = getModule([ 'size16' ], false);
+- const { marginBottom20 } = getModule([ 'marginBottom20' ], false);
+-
+- return (
+-
+- To control your Spotify playback we use Spotify's "Connect Web" API, which is unfortunately locked to
+- Spotify Premium users. In order for you to control Spotify's playback you'll need to get a Premium
+- subscription.
+-
+-
+- If you do happen to have a Spotify Premium subscription but you're still not seeing the buttons show up,
+- it might happen that Spotify is reporting inaccurate data about your Premium status and alters the
+- availability of the buttons. Try changing the playback in any way (play, pause, change track, ...) to
+- trigger and update and let us get accurate data from Spotify.
+-
+-
+- If this still did not fix it, make sure you're not in a private session as we've received a few reports
+- saying this causes your Premium subscription status to not be properly sent to us. Also make sure you do
+- have your Spotify account linked to your Discord account (You can tell Discord to not show it on your
+- profile and not show the song you're listening to in your status, if you don't want to)
+-
+-
+-
+- );
+- }
+-}
+-
+-module.exports = SeekBar;
+diff --git a/src/Powercord/plugins/pc-spotify/components/Settings.jsx b/src/Powercord/plugins/pc-spotify/components/Settings.jsx
+deleted file mode 100644
+index 94ceb55..0000000
+--- a/src/Powercord/plugins/pc-spotify/components/Settings.jsx
++++ /dev/null
+@@ -1,35 +0,0 @@
+-const { React } = require('powercord/webpack');
+-const { SwitchItem } = require('powercord/components/settings');
+-
+-module.exports = React.memo(
+- ({ getSetting, toggleSetting, patch }) => (
+-
+-
+- {formatTime(progress)}
+-
+-
+- {formatTime(this.props.duration)}
+-
+-
+- this.startSeek(e)}>
+-
+-
+-
+-
+- toggleSetting('squareCovers')}
+- >
+- Squared covers
+-
+-
+- toggleSetting('showControls')}
+- >
+- Show advanced controls
+-
+-
+- {
+- patch(getSetting('noAutoPause', true));
+- toggleSetting('noAutoPause');
+- }}
+- >
+- No auto pause
+-
+-
+- )
+-);
+diff --git a/src/Powercord/plugins/pc-spotify/components/ShareModal.jsx b/src/Powercord/plugins/pc-spotify/components/ShareModal.jsx
+deleted file mode 100644
+index dbbfd8b..0000000
+--- a/src/Powercord/plugins/pc-spotify/components/ShareModal.jsx
++++ /dev/null
+@@ -1,65 +0,0 @@
+-const { React, messages, channels } = require('powercord/webpack');
+-const { FormTitle, Text } = require('powercord/components');
+-const { Modal } = require('powercord/components/modal');
+-const { close: closeModal } = require('powercord/modal');
+-const { SPOTIFY_DEFAULT_IMAGE } = require('../constants');
+-
+-class Track extends React.PureComponent {
+- handleClick (item) {
+- return messages.sendMessage(
+- channels.getChannelId(),
+- { content: item.external_urls.spotify }
+- ).then(() => closeModal());
+- }
+-
+- render () {
+- const image = this.props.item.album.images[0]
+- ? this.handleClick(this.props.item)}>
+- {image}
+- {this.props.item.name}
+-
+- );
+- }
+-}
+-
+-module.exports = class ShareModal extends React.PureComponent {
+- constructor () {
+- super();
+-
+- this.state = {
+- tracks: []
+- };
+- }
+-
+- async componentDidMount () {
+- this.setState({ tracks: await this.props.tracks.items });
+- }
+-
+- render () {
+- const { tracks } = this.state;
+- const trackList = [];
+- tracks.forEach(track => {
+- trackList.push(