Compare commits

..

No commits in common. "master" and "bugfix/1-fix-on-search-handler" have entirely different histories.

5 changed files with 9 additions and 33 deletions

15
.vscode/launch.json vendored
View File

@ -1,15 +0,0 @@
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "Launch Chrome",
"url": "http://localhost:3000",
"webRoot": "${workspaceFolder}"
}
]
}

2
package-lock.json generated
View File

@ -13,7 +13,7 @@
"@testing-library/user-event": "^13.5.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-scripts": "^5.0.1",
"react-scripts": "5.0.1",
"web-vitals": "^2.1.4"
}
},

View File

@ -8,7 +8,7 @@
"@testing-library/user-event": "^13.5.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-scripts": "^5.0.1",
"react-scripts": "5.0.1",
"web-vitals": "^2.1.4"
},
"scripts": {

View File

@ -15,23 +15,14 @@ class SearchBar extends React.Component {
handleTermChange = (event) => {
this.setState({ term: event.target.value });
};
handleKeyDown = event => {
if (event.key === "Enter"){
this.search()
}
}
render() {
return (
<div className="SearchBar">
<input
placeholder="Enter A Song, Album, or Artist"
onChange={this.handleTermChange}
onKeyDown={this.handleKeyDown}
/>
<button className="SearchButton" onClick={this.search}>
SEARCH
</button>
<button className="SearchButton">SEARCH</button>
</div>
);
}

View File

@ -1,6 +1,5 @@
const clientId = "c39c93bbf05745fb986d1e566004eb31";
// Hosted on https://jammingcademy.surge.sh/, but save playlist does not work
const redirectUri = "http://localhost:3000";
const redirectUri = "http://localhost:3000/";
let accessToken = "";
export const Spotify = {
@ -23,7 +22,8 @@ export const Spotify = {
window.history.pushState("Access Token", null, "/");
return accessToken;
} else {
const accessUrl = `https://accounts.spotify.com/authorize?client_id=${clientId}&response_type=token&scope=playlist-modify-public&redirect_uri=${redirectUri}`;
const accessUrl = `https://accounts.spotify.com/authorize?client_id=${clientId}&response_type=
token&scope=playlist-modify-public&redirect_uri=${redirectUri}`;
window.location = accessUrl;
}
},
@ -54,13 +54,13 @@ export const Spotify = {
if (!name || !trackUris.length) {
return;
}
const accessToken = Spotify.getAccessToken();
const accessToken = Spotify.getAccessToken;
const headers = { Authorization: `Bearer ${accessToken}` };
let userId;
return fetch(`https://api.spotify.com/v1/me`, { headers: headers })
.then((response) => response.json())
.then((jsonResponse) => {
userId = jsonResponse.id;
userId = jsonResponse.Id;
return fetch(`https://api.spotify.com/v1/users/${userId}/playlists`, {
headers: headers,
method: "POST",
@ -68,7 +68,7 @@ export const Spotify = {
})
.then((response) => response.json())
.then((jsonResponse) => {
const playlistId = jsonResponse.id;
const playlistId = jsonResponse.Id;
return fetch(
`https:/api.spotify.com/v1/users/${userId}/playlists/${playlistId}/tracks`,
{