fancy spotofy songs

.github/workflows/update_songs.yml

@@ -1,10 +1,13 @@
 name: Update Utils Folder
 
 on:
+    schedule:
+        - cron: "0 0 1/10 * *"
     push:
         branches: master
         paths:
             - "spotify/data.py"
+    workflow_dispatch:
 
 jobs:
     update-and-commit:
@@ -28,7 +31,7 @@ jobs:
             - name: Run index.py to update utils folder
               env:
                   SPOTIFY_CLIENT_ID: ${{ secrets.SPOTIFY_CLIENT_ID }}
-                  SPOTIFY_SECRET: ${{ secrets.SPOTIFY_SECRET }}
+                  SPOTIFY_CLIENT_SECRET: ${{ secrets.SPOTIFY_SECRET }}
               run: python spotify/index.py
 
             - name: Commit model

.prettierrc

@@ -6,7 +6,7 @@
 	"bracketSpacing": true,
 	"useTabs": true,
 	"arrowParens": "avoid",
-	"printWidth": 150,
+	"printWidth": 120,
 	"proseWrap": "never",
 	"endOfLine": "lf",
 	"bracketSameLine": true

public/readmes/skills.md

@@ -1,12 +1,12 @@
 # 💻 Skills & Expertise
 
 | Programming Languages | Software Development Frameworks | Machine Learning Libraries | Database Management | Cloud & DevOps Tools |
-| :-------------------: | :-----------------------------: | :------------------------: | :-----------------: | :------------------: |
-| JavaScript/TypeScript |            React.js             |         TensorFlow         |        MySQL        |         AWS          |
-|        Python         |             Next.js             |         MediaPipe          |       MongoDB       |         GCP          |
-|         Java          |            Redux.js             |           NumPy            |      DynamoDB       |        Docker        |
-|         OCaml         |             Nuxt.js             |           Pandas           |       SQLite        |      Kubernetes      |
-|          C++          |             Node.js             |          Convokit          |       Prisma        |        Heroku        |
-|           C           |           Express.js            |        Pomegranate         |       GraphQL       |       Netlify        |
-|         Shell         |             Flutter             |        Scikit-learn        |        Redis        |        Vercel        |
-|        MATLAB         |       React-Native (Expo)       |           OpenCV           |        Realm        |        Okteto        |
+| :-: | :-: | :-: | :-: | :-: |
+| JavaScript/TypeScript | React.js | TensorFlow | MySQL | AWS |
+| Python | Next.js | MediaPipe | MongoDB | GCP |
+| Java | Redux.js | NumPy | DynamoDB | Docker |
+| OCaml | Nuxt.js | Pandas | SQLite | Kubernetes |
+| C++ | Node.js | Convokit | Prisma | Heroku |
+| C | Express.js | Pomegranate | GraphQL | Netlify |
+| Shell | Flutter | Scikit-learn | Redis | Vercel |
+| MATLAB | React-Native (Expo) | OpenCV | Realm | Okteto |

spotify/index.py

@@ -1,21 +1,19 @@
 import os
 import json
-from dotenv import load_dotenv
+from dotenv import load_dotenv, find_dotenv
 import spotipy
 from spotipy.oauth2 import SpotifyClientCredentials
 from data import songs
 
-load_dotenv()
+load_dotenv(find_dotenv(), override=True)
 
 spotify_client = os.environ.get("SPOTIFY_CLIENT_ID")
-spotify_secret = os.environ.get("SPOTIFY_SECRET")
+spotify_secret = os.environ.get("SPOTIPY_CLIENT_SECRET")
 
-client_credentials_manager = SpotifyClientCredentials(
-    client_id=spotify_client, client_secret=spotify_secret
-)
-sp = spotipy.Spotify(client_credentials_manager=client_credentials_manager)
+manager = SpotifyClientCredentials(spotify_client, spotify_secret)
+sp = spotipy.Spotify(client_credentials_manager=manager)
 
-WEBSITE_PUBLIC_SONGS_PATH = "src/utils/"
+WEBSITE_PUBLIC_SONGS_PATH = os.environ.get("WEBSITE_PUBLIC_SONGS_PATH")
 
 
 def get_track_info(track_id):
@@ -45,6 +43,25 @@ def main():
     """
     song_ids = set()
     resp = []
+    for limit in range(0, 1000, 50):
+        playlist = sp.playlist_items(
+            "https://open.spotify.com/playlist/32kj5oTYUpIJwW240Z1jli?si=dbb184186b034109",
+            limit=50,
+            offset=limit,
+        )
+        for liked_song in playlist["items"]:
+            try:
+                track_info = {
+                    "image": liked_song["track"]["album"]["images"][0]["url"],
+                    "name": liked_song["track"]["name"],
+                    "id": liked_song["track"]["id"],
+                    "artist": liked_song["track"]["artists"][0]["name"],
+                }
+                song_ids.add(liked_song["track"]["id"])
+                resp.append(track_info)
+            except:
+                continue
+
     for song in songs:
         if song.split("/")[-1].split("?")[0] in song_ids:
             continue

src/app/api/graphql/route.ts

@@ -40,7 +40,10 @@ const handler = startServerAndCreateNextHandler(apolloServer, {
 	context: async (req: Request) => {
 		if (req.method === "POST") {
 			const reqCookies = cookies().getAll();
-			const cookieName = process.env.NEXT_PUBLIC_VERCEL_ENV === "development" ? "next-auth.session-token" : "__Secure-next-auth.session-token";
+			const cookieName =
+				process.env.NEXT_PUBLIC_VERCEL_ENV === "development"
+					? "next-auth.session-token"
+					: "__Secure-next-auth.session-token";
 			const token = reqCookies.find(cookie => cookie.name === cookieName)?.value;
 			const mutation = headers().get("Mutation") === "true";
 			if (mutation) {

src/app/close-friends/(home)/page.tsx

@@ -14,7 +14,12 @@ const accessLevels = (session: any) => {
 	return "close-friends";
 };
 
-const getData = async (searchTerm: string = "", sortKey: string = "createdAt", filterKey: string = "all", tagFilterKeys: string[] = []) => {
+const getData = async (
+	searchTerm: string = "",
+	sortKey: string = "createdAt",
+	filterKey: string = "all",
+	tagFilterKeys: string[] = []
+) => {
 	const session = await getServerSession();
 	const access = accessLevels(session);
 	const client = getClient();

src/app/close-friends/admin/page.tsx

@@ -7,7 +7,12 @@ import { GET_CONTENTS } from "@/graphql/client/queries";
 
 export const dynamic = "force-dynamic";
 
-const getData = async (searchTerm: string = "", sortKey: string = "createdAt", filterKey: string = "all", tagFilterKeys: string[] = []) => {
+const getData = async (
+	searchTerm: string = "",
+	sortKey: string = "createdAt",
+	filterKey: string = "all",
+	tagFilterKeys: string[] = []
+) => {
 	const client = getClient();
 	const { data } = await client.query({ query: GET_CONTENTS, variables: { access: "private" } });
 	const fuseOptions = {

src/app/close-friends/sitemap.ts

@@ -40,7 +40,9 @@ function calculatePriority(createdAt: string, updatedAt: string, currentTime: Da
 export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
 	console.log("Generating sitemap...");
 	const data: Content[] = await getData();
-	const sorted = [...data].sort((a: any, b: any) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime());
+	const sorted = [...data].sort(
+		(a: any, b: any) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime()
+	);
 	const currentDate = new Date();
 	const sitemap: MetadataRoute.Sitemap = sorted.map((item: any) => ({
 		url: `${BASE_URL}/${item.__typename.toLowerCase()}/${item.id}`,

src/app/globals.css

@@ -1,14 +1,21 @@
 :root {
 	--max-width: 1100px;
 	--border-radius: 12px;
-	--font-mono: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Segoe UI Mono", "Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Source Code Pro",
-		"Fira Mono", "Droid Sans Mono", "Courier New", monospace;
+	--font-mono: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Segoe UI Mono", "Roboto Mono", "Oxygen Mono",
+		"Ubuntu Monospace", "Source Code Pro", "Fira Mono", "Droid Sans Mono", "Courier New", monospace;
 
 	--foreground-rgb: 0, 0, 0;
 	--background-start-rgb: 214, 219, 220;
 	--background-end-rgb: 255, 255, 255;
 
-	--primary-glow: conic-gradient(from 180deg at 50% 50%, #16abff33 0deg, #0885ff33 55deg, #54d6ff33 120deg, #0071ff33 160deg, transparent 360deg);
+	--primary-glow: conic-gradient(
+		from 180deg at 50% 50%,
+		#16abff33 0deg,
+		#0885ff33 55deg,
+		#54d6ff33 120deg,
+		#0071ff33 160deg,
+		transparent 360deg
+	);
 	--secondary-glow: radial-gradient(rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
 
 	--tile-start-rgb: 239, 245, 249;
@@ -28,7 +35,12 @@
 		--background-end-rgb: 0, 0, 0;
 
 		--primary-glow: radial-gradient(rgba(1, 65, 255, 0.4), rgba(1, 65, 255, 0));
-		--secondary-glow: linear-gradient(to bottom right, rgba(1, 65, 255, 0), rgba(1, 65, 255, 0), rgba(1, 65, 255, 0.3));
+		--secondary-glow: linear-gradient(
+			to bottom right,
+			rgba(1, 65, 255, 0),
+			rgba(1, 65, 255, 0),
+			rgba(1, 65, 255, 0.3)
+		);
 
 		--tile-start-rgb: 2, 13, 46;
 		--tile-end-rgb: 2, 5, 19;

src/app/login/page.tsx

@@ -8,7 +8,9 @@ import { FaGlobeAmericas } from "react-icons/fa";
 
 export default function Login() {
 	const handleLogin = async () => {
-		await signIn("google", { callbackUrl: process.env.NEXT_PUBLIC_VERCEL_ENV !== "production" ? "/close-friends" : "/" });
+		await signIn("google", {
+			callbackUrl: process.env.NEXT_PUBLIC_VERCEL_ENV !== "production" ? "/close-friends" : "/"
+		});
 	};
 
 	return (
@@ -48,7 +50,12 @@ export default function Login() {
 				</Box>
 			</AppBar>
 			<Box sx={{ mb: 4, mt: 4, overflow: "hidden", width: 400, height: 248, position: "relative" }}>
-				<Image src="/images/login-background.png" fill alt="logo" style={{ borderRadius: 2, border: "1px solid white" }} />
+				<Image
+					src="/images/login-background.png"
+					fill
+					alt="logo"
+					style={{ borderRadius: 2, border: "1px solid white" }}
+				/>
 			</Box>
 			<Typography variant="h5">Welcome back</Typography>
 			<Typography variant="h6" sx={{ mb: 2, color: "#95a5a6" }}>

src/components/CloseFriends/Admin/Blogs/BlogEditor.tsx

@@ -88,14 +88,20 @@ export default function BlogEditor({ blog }: { blog: any }) {
 	};
 
 	const handleSubmit = async () => {
-		if (blogUpdate?.image === undefined) blogUpdate["image"] = `${process.env.NEXT_PUBLIC_PRODUCTION_URL}/images/default.jpg`;
+		if (blogUpdate?.image === undefined)
+			blogUpdate["image"] = `${process.env.NEXT_PUBLIC_PRODUCTION_URL}/images/default.jpg`;
 		const requiredFields = ["title", "details", "access", "image", "tags", "keywords"];
 		if (!blogUpdate) {
 			setFormError("Please fill in the form with valid data.");
 			return;
 		}
 		const validationErrors = requiredFields.map(field => {
-			if (blogUpdate[field] === undefined || blogUpdate[field] === null || blogUpdate[field] === "" || blogUpdate[field]?.length === 0) {
+			if (
+				blogUpdate[field] === undefined ||
+				blogUpdate[field] === null ||
+				blogUpdate[field] === "" ||
+				blogUpdate[field]?.length === 0
+			) {
 				setFormError(`Please fill in the '${field}' with valid data.`);
 				setTimeout(() => setFormError(null), 5000);
 				return true;
@@ -146,7 +152,9 @@ export default function BlogEditor({ blog }: { blog: any }) {
 				</Alert>
 			</Box>
 			<FormControl fullWidth sx={{ display: "flex", flexDirection: "column", gap: 2 }}>
-				<Backdrop sx={{ color: "#fff", zIndex: theme => theme.zIndex.drawer + 1 }} open={clientLoading || creating || updating}>
+				<Backdrop
+					sx={{ color: "#fff", zIndex: theme => theme.zIndex.drawer + 1 }}
+					open={clientLoading || creating || updating}>
 					<CircularProgress color="inherit" />
 				</Backdrop>
 				<Typography variant="h4" gutterBottom>
@@ -240,7 +248,14 @@ export default function BlogEditor({ blog }: { blog: any }) {
 												/>
 											))
 										}
-										renderInput={params => <TextField {...params} variant="outlined" label="Tags" placeholder="Add tags" />}
+										renderInput={params => (
+											<TextField
+												{...params}
+												variant="outlined"
+												label="Tags"
+												placeholder="Add tags"
+											/>
+										)}
 										onChange={(event, newValue) => setBlogUpdate({ ...blogUpdate, tags: newValue })}
 									/>
 									<Autocomplete
@@ -261,9 +276,16 @@ export default function BlogEditor({ blog }: { blog: any }) {
 											))
 										}
 										renderInput={params => (
-											<TextField {...params} variant="outlined" label="Keywords" placeholder="Add keywords" />
+											<TextField
+												{...params}
+												variant="outlined"
+												label="Keywords"
+												placeholder="Add keywords"
+											/>
 										)}
-										onChange={(event, newValue) => setBlogUpdate({ ...blogUpdate, keywords: newValue })}
+										onChange={(event, newValue) =>
+											setBlogUpdate({ ...blogUpdate, keywords: newValue })
+										}
 									/>
 								</Box>
 							</Box>
@@ -274,7 +296,11 @@ export default function BlogEditor({ blog }: { blog: any }) {
 				<Typography variant="h6" gutterBottom>
 					Edit Blog Content
 				</Typography>
-				<Editor defaultValue={blog?.htmlContent || "Start typing here..."} onChange={setContent} editor={editor} />
+				<Editor
+					defaultValue={blog?.htmlContent || "Start typing here..."}
+					onChange={setContent}
+					editor={editor}
+				/>
 				<Button onClick={handleSubmit} variant="contained" color="primary" sx={{ mt: 2 }}>
 					Save Blog
 				</Button>

src/components/CloseFriends/Admin/Videos/VideoEditor.tsx

@@ -199,7 +199,14 @@ export default function VideoEditor({ video }: { video: any }) {
 								}}
 								freeSolo
 								renderTags={(value, getTagProps) =>
-									value.map((option, index) => <Chip variant="outlined" label={option} {...getTagProps({ index })} key={index} />)
+									value.map((option, index) => (
+										<Chip
+											variant="outlined"
+											label={option}
+											{...getTagProps({ index })}
+											key={index}
+										/>
+									))
 								}
 								renderInput={params => <TextField {...params} label="Tags" variant="outlined" />}
 							/>
@@ -214,7 +221,14 @@ export default function VideoEditor({ video }: { video: any }) {
 								}}
 								freeSolo
 								renderTags={(value, getTagProps) =>
-									value.map((option, index) => <Chip variant="outlined" label={option} {...getTagProps({ index })} key={index} />)
+									value.map((option, index) => (
+										<Chip
+											variant="outlined"
+											label={option}
+											{...getTagProps({ index })}
+											key={index}
+										/>
+									))
 								}
 								renderInput={params => <TextField {...params} label="Keywords" variant="outlined" />}
 							/>

src/components/CloseFriends/Layout/ContentDisplay.tsx

@@ -44,11 +44,23 @@ export default function ContentDisplay({
 						borderBottom: "2px solid rgba(219, 9, 20, 1)",
 						boxShadow: "none"
 					}}>
-					<Filters searchTerm={searchTerm} sortKey={sortKey} filterKey={filterKey} tagFilterKeys={tagFilterKeys} url={homeURL} />
+					<Filters
+						searchTerm={searchTerm}
+						sortKey={sortKey}
+						filterKey={filterKey}
+						tagFilterKeys={tagFilterKeys}
+						url={homeURL}
+					/>
 				</AppBar>
 			) : (
 				<Box sx={{ mt: 1, mb: 3 }}>
-					<Filters searchTerm={searchTerm} sortKey={sortKey} filterKey={filterKey} tagFilterKeys={tagFilterKeys} url={adminURL} />
+					<Filters
+						searchTerm={searchTerm}
+						sortKey={sortKey}
+						filterKey={filterKey}
+						tagFilterKeys={tagFilterKeys}
+						url={adminURL}
+					/>
 				</Box>
 			)}
 			<Typography variant="h5" sx={{ mb: 1, mt: 0, pt: 0 }}>

src/components/CloseFriends/Layout/Filters.tsx

@@ -44,7 +44,8 @@ export default function Filters({ searchTerm, sortKey, filterKey, tagFilterKeys,
 		if (searchTermState !== "" && searchTermState !== null) URL.set("searchTerm", searchTermState);
 		if (sortKeyState !== "createdAt" && sortKeyState !== null) URL.set("sortKey", sortKeyState);
 		if (filterKeyState !== "all" && filterKeyState !== null) URL.set("filterKey", filterKeyState);
-		if (tagFilterKeysState.length !== 0 && tagFilterKeysState !== null) URL.set("tagFilterKeys", tagFilterKeysState?.join(","));
+		if (tagFilterKeysState.length !== 0 && tagFilterKeysState !== null)
+			URL.set("tagFilterKeys", tagFilterKeysState?.join(","));
 		startTransition(() => {
 			router.replace(`${url}?${URL.toString()}`);
 		});
@@ -72,7 +73,11 @@ export default function Filters({ searchTerm, sortKey, filterKey, tagFilterKeys,
 			</FormControl>
 			<FormControl fullWidth size="small" sx={{ flex: "1 1 auto", maxHeight: "30px" }}>
 				<InputLabel id="category-label">Filter By Category</InputLabel>
-				<Select labelId="category-label" value={filterKeyState} label="Filter By Category" onChange={onFilterChange}>
+				<Select
+					labelId="category-label"
+					value={filterKeyState}
+					label="Filter By Category"
+					onChange={onFilterChange}>
 					<MenuItem value="all">All</MenuItem>
 					<MenuItem value="blog">Blog</MenuItem>
 					<MenuItem value="video">Video</MenuItem>
@@ -85,7 +90,9 @@ export default function Filters({ searchTerm, sortKey, filterKey, tagFilterKeys,
 					value={tagFilterKeysState}
 					label="Filter By Tags"
 					onChange={(event: SelectChangeEvent<string | string[]>) =>
-						setTagFilterKeysState(Array.isArray(event.target.value) ? event.target.value : [event.target.value])
+						setTagFilterKeysState(
+							Array.isArray(event.target.value) ? event.target.value : [event.target.value]
+						)
 					}
 					input={<OutlinedInput label="Filter By Tags" />}
 					renderValue={selected => (