Reduce
This commit is contained in:
parent
d9b227fb85
commit
0f020d83d2
4 changed files with 0 additions and 90 deletions
|
@ -1,30 +0,0 @@
|
|||
import React from 'react';
|
||||
import { getSpotifyLoginUrl, isLoggedIn, removeAccessToken } from '../utils/spotifyAuth.js';
|
||||
|
||||
const LoginButton = () => {
|
||||
const loggedIn = isLoggedIn();
|
||||
|
||||
const handleLogout = () => {
|
||||
removeAccessToken();
|
||||
window.location.reload(); // Refresh to update UI
|
||||
};
|
||||
|
||||
if (loggedIn) {
|
||||
return (
|
||||
<div className="login-status">
|
||||
<span>✓ Connected to Spotify</span>
|
||||
<button onClick={handleLogout} className="logout-btn">
|
||||
Logout
|
||||
</button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<a href={getSpotifyLoginUrl()}>
|
||||
<button className="spotify-login-btn">Login with Spotify</button>
|
||||
</a>
|
||||
);
|
||||
};
|
||||
|
||||
export default LoginButton;
|
|
@ -3,6 +3,3 @@ export const RADIOSTATION_URL = "http://localhost:8080/api";
|
|||
export const CREATE_RADIOSTATION_ENDPOINT = "/radio-stations";
|
||||
export const LIST_RADIOSTATIONS_ENDPOINT = "/radio-stations";
|
||||
export const ADD_CLIENT_ENDPOINT = "/clients/connect";
|
||||
|
||||
export const SPOTIFY_PREMIUM_TOKEN =
|
||||
"BQCEnWrYVdmta4Eekdkewazun99IuocRAyPEbwPSrHuGYgZYg7JGlXG2BLmRL6fwjzPJkrmHiqlTLSn1yqR36awA9Rv4n9dwvTBv1DjAitsuzaEVg7PtYdbUHXqP2HJJ4dDDvTtvUfWIBDY_Afa7WgY1cyRbl-p4VobNHXUR9N3Ye1qBTgH3RZ5ziIbIoNWe_JrxYvcedkvr23zXUVabOyahTgt_YdmnCWt2Iu8XT8sjhSyc8tOCqbs_KqE-Qe1WSPUCrGS8";
|
||||
|
|
|
@ -1,13 +1,10 @@
|
|||
import { useParams } from "react-router-dom";
|
||||
import React, { useState, useEffect } from "react";
|
||||
import AddSongModal from "./AddSongModal";
|
||||
import LoginButton from "../components/LoginButton";
|
||||
import { addClientToStation } from "../utils/AddClientToStation";
|
||||
|
||||
function StationPage() {
|
||||
const { stationID } = useParams();
|
||||
const [clientToken, setClientToken] = useState("");
|
||||
const [isModalOpen, setIsModalOpen] = useState(false);
|
||||
const [accessDenied, setAccessDenied] = useState(true);
|
||||
|
||||
const [userName, setUserName] = useState("");
|
||||
|
@ -36,14 +33,6 @@ function StationPage() {
|
|||
|
||||
const recommendedSongs = [];
|
||||
|
||||
const openModal = () => {
|
||||
setIsModalOpen(true);
|
||||
};
|
||||
|
||||
const closeModal = () => {
|
||||
setIsModalOpen(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="station-page">
|
||||
<div className="animated-background">
|
||||
|
@ -56,15 +45,11 @@ function StationPage() {
|
|||
<header className="station-header">
|
||||
<h1>Serena Station</h1>
|
||||
<p className="station-subtitle">Collaborative Music Experience</p>
|
||||
<LoginButton />
|
||||
</header>
|
||||
|
||||
<div className="songs-section">
|
||||
<div className="section-header">
|
||||
<h2>Song Queue</h2>
|
||||
<button className="add-song-btn" onClick={openModal}>
|
||||
Add Song
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className="songs-list">
|
||||
|
@ -86,8 +71,6 @@ function StationPage() {
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{isModalOpen && <AddSongModal onClose={closeModal} />}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -1,40 +0,0 @@
|
|||
const CLIENT_ID = 'e1274b6593674771bea12d8366c7978b';
|
||||
const REDIRECT_URI = 'http://localhost:3000/callback';
|
||||
const SCOPES = [
|
||||
'user-read-private',
|
||||
'user-read-email',
|
||||
'playlist-read-private',
|
||||
'user-library-read',
|
||||
];
|
||||
|
||||
export const getSpotifyLoginUrl = () => {
|
||||
const scope = SCOPES.join('%20');
|
||||
return `https://accounts.spotify.com/authorize?client_id=${CLIENT_ID}&response_type=token&redirect_uri=${encodeURIComponent(
|
||||
REDIRECT_URI
|
||||
)}&scope=${scope}`;
|
||||
};
|
||||
|
||||
export const getAccessTokenFromUrl = () => {
|
||||
const hash = window.location.hash;
|
||||
if (hash) {
|
||||
const params = new URLSearchParams(hash.substring(1));
|
||||
return params.get('access_token');
|
||||
}
|
||||
return null;
|
||||
};
|
||||
|
||||
export const storeAccessToken = (token) => {
|
||||
localStorage.setItem('spotify_access_token', token);
|
||||
};
|
||||
|
||||
export const getAccessToken = () => {
|
||||
return localStorage.getItem('spotify_access_token');
|
||||
};
|
||||
|
||||
export const removeAccessToken = () => {
|
||||
localStorage.removeItem('spotify_access_token');
|
||||
};
|
||||
|
||||
export const isLoggedIn = () => {
|
||||
return !!getAccessToken();
|
||||
};
|
Loading…
Add table
Add a link
Reference in a new issue