Add filter explicit spotify (#76)

* Refactor Spotify data storage to exclude explicit content * Refactor Spotify API authentication and response handling * Update font file reference in base layout
afnizarnur · May 5, 2024 · 2876ec3 · 2876ec3
1 parent 1740aed
commit 2876ec3
Show file tree

Hide file tree

Showing 4 changed files with 39 additions and 26 deletions.
diff --git a/src/assets/fonts/Mona-Sans.woff2 b/src/assets/fonts/Mona-Sans.woff2
diff --git a/src/assets/scripts/modules/spotify.js b/src/assets/scripts/modules/spotify.js
@@ -16,10 +16,12 @@ class SpotifyFetcher {
 				const url = data.url
 				this.updateParagraph(songTitle, artistName, url)
 
-				localStorage.setItem(
-					"spotifyData",
-					JSON.stringify({ songTitle, artistName, url })
-				)
+				if (songTitle !== "Explicit Content") {
+					localStorage.setItem(
+						"spotifyData",
+						JSON.stringify({ songTitle, artistName, url })
+					)
+				}
 			})
 
 			.catch((error) => {

diff --git a/src/functions/spotify.js b/src/functions/spotify.js
@@ -2,28 +2,29 @@ const axios = require("axios")
 const dotenv = require("dotenv")
 dotenv.config()
 
-exports.handler = async (event, context) => {
-	const refreshToken = process.env.SPOTIFY_REFRESH_TOKEN
-	const auth = Buffer.from(
-		`${process.env.SPOTIFY_CLIENT_ID}:${process.env.SPOTIFY_CLIENT_SECRET}`
-	).toString("base64")
-	const tokenEndpoint = "https://accounts.spotify.com/api/token"
-	const playerEndpoint =
-		"https://api.spotify.com/v1/me/player/recently-played"
-
-	const options = {
-		method: "POST",
-		headers: {
-			Authorization: `Basic ${auth}`,
-			"Content-Type": "application/x-www-form-urlencoded"
-		},
-		data: `grant_type=refresh_token&refresh_token=${refreshToken}&redirect_uri=${encodeURI(
-			process.env.URL,
-			+"/.netlify/functions/callback"
-		)}`
-	}
+let nonExplicitSongData = null
 
+exports.handler = async (event, context) => {
 	try {
+		const refreshToken = process.env.SPOTIFY_REFRESH_TOKEN
+		const auth = Buffer.from(
+			`${process.env.SPOTIFY_CLIENT_ID}:${process.env.SPOTIFY_CLIENT_SECRET}`
+		).toString("base64")
+		const tokenEndpoint = "https://accounts.spotify.com/api/token"
+		const playerEndpoint =
+			"https://api.spotify.com/v1/me/player/recently-played"
+
+		const options = {
+			method: "POST",
+			headers: {
+				Authorization: `Basic ${auth}`,
+				"Content-Type": "application/x-www-form-urlencoded"
+			},
+			data: `grant_type=refresh_token&refresh_token=${refreshToken}&redirect_uri=${encodeURI(
+				process.env.URL + "/.netlify/functions/callback"
+			)}`
+		}
+
 		const {
 			data: { access_token: accessToken }
 		} = await axios(tokenEndpoint, options)
@@ -34,6 +35,14 @@ exports.handler = async (event, context) => {
 			}
 		})
 
+		const isExplicit = response.data.items[0].track.explicit
+
+		if (isExplicit && !nonExplicitSongData) {
+			return {
+				statusCode: 204
+			}
+		}
+
 		const {
 			artists: artistsArray,
 			name,
@@ -45,9 +54,11 @@ exports.handler = async (event, context) => {
 		}))
 		const url = urls.spotify
 
+		nonExplicitSongData = { artists, name, url }
+
 		return {
 			statusCode: 200,
-			body: JSON.stringify({ artists, name, url })
+			body: JSON.stringify(nonExplicitSongData)
 		}
 	} catch (err) {
 		if (process.env.ELEVENTY_ENV === "development") {

diff --git a/src/layouts/base.njk b/src/layouts/base.njk
@@ -27,7 +27,7 @@
         {% include "meta.njk" %}
         <link
             rel="preload"
-            href="{{ '/assets/fonts/Mona-Sans.woff2' | url }}"
+            href="{{ '/assets/fonts/Aksen-Condensed-SemiBold.woff2' | url }}"
             as="font"
             type="font/woff2"
             crossorigin