Merge pull request #8 from stifskere/dev

feat: spotify status and github rating

package.json

@@ -12,17 +12,20 @@
     "@types/react-syntax-highlighter": "^15.5.13",
     "date-fns": "^3.3.1",
     "next": "^14.2.3",
+    "querystring": "^0.2.1",
     "react": "^18",
     "react-dom": "^18",
     "react-icons": "^5.0.1",
     "react-syntax-highlighter": "^15.5.0",
-    "sharp": "^0.33.2"
+    "sharp": "^0.33.2",
+    "ws": "^8.17.0"
   },
   "devDependencies": {
     "@babel/plugin-transform-class-static-block": "^7.23.4",
     "@types/node": "^20",
     "@types/react": "^18",
     "@types/react-dom": "^18",
+    "@types/ws": "^8.5.10",
     "babel-plugin-jsx-control-statements": "^4.1.2",
     "eslint": "^8",
     "eslint-config-next": "14.1.0",

src/app/github/gists/route.ts

@@ -1,6 +1,5 @@
 import {NextResponse} from "next/server";
 import {githubRequestInit} from "@/app/github/github-constants";
-import {GithubCompiledGist, GithubGist} from "@/app/github/github-types";
 
 export const revalidate = 3600;
 

src/app/github/github-types.d.ts

@@ -1,5 +1,28 @@
 
-export interface GithubRepositoryFromSource {
+declare interface GithubProfile {
+	login: string;
+	repos_url: string;
+	public_repos: number;
+	public_gists: number;
+	followers: number;
+	following: number;
+}
+
+declare interface GithubRating {
+	username: string;
+	contributions: number;
+	followers: number;
+	stars: number;
+	forks: number;
+	significantRepos: number;
+}
+
+declare interface GithubRatingWithMark extends GithubRating {
+	mark: string;
+	position: number;
+}
+
+declare interface GithubRepositoryFromSource {
 	name: string;
 	full_name: string;
 	description: string;
@@ -11,21 +34,22 @@ export interface GithubRepositoryFromSource {
 	url: string;
 
 	fork: boolean;
+	forks_count: number;
 	parent?: GithubRepositoryFromSource;
 
 	commits_url: string;
 	commit_count: number;
 }
 
-export type GithubRepository = Omit<
+declare type GithubRepository = Omit<
 	GithubRepositoryFromSource,
 	"commits_url" |
 	"forks_url" |
 	"fork_repo" |
 	"fork"
 >;
 
-export interface GithubGist {
+declare interface GithubGist {
 	html_url: string;
 	files: { [key: string]: GithubGistFile }
 	public: boolean
@@ -38,7 +62,7 @@ interface GithubGistFile {
 	raw_url: string;
 }
 
-export interface GithubCompiledGist {
+declare interface GithubCompiledGist {
 	filename: string;
 	language: string;
 	cut_string: string;

src/app/github/rating/route.ts

@@ -0,0 +1,65 @@
+import {NextResponse} from "next/server";
+import {githubRequestInit} from "@/app/github/github-constants";
+
+export async function GET(): Promise<NextResponse<GithubRatingWithMark>> {
+	const profile: GithubProfile = await fetch(
+		"https://api.github.com/users/stifskere",
+		githubRequestInit
+	).then(r => r.json());
+
+	const repos: GithubRepositoryFromSource[] = await fetch(
+		profile.repos_url,
+		githubRequestInit
+	).then(r => r.json());
+
+	let stars: number = 0,
+		forks: number = 0,
+		significantRepos: number = 0;
+
+	for (const repo of repos) {
+		stars += repo.stargazers_count;
+		forks += repo.forks_count;
+		if (repo.stargazers_count > 10)
+			significantRepos++;
+	}
+
+	return NextResponse.json(getMark({
+		username: profile.login,
+		contributions: profile.public_repos,
+		followers: profile.followers,
+		stars,
+		forks,
+		significantRepos,
+	}));
+
+	function getMark(data: GithubRating): GithubRatingWithMark {
+		let mark: string = 'C-';
+		let position: number = 0;
+
+		if (data.contributions > 1000 && data.significantRepos > 5 && data.stars > 500 && data.followers > 500) {
+			mark = 'A+';
+			position = 6;
+		} else if (data.contributions > 500 && data.significantRepos > 3 && data.stars > 200 && data.followers > 200) {
+			mark = 'A';
+			position = 5;
+		} else if (data.contributions > 200 && data.significantRepos > 1 && data.stars > 100 && data.followers > 100) {
+			mark = 'B+';
+			position = 4;
+		} else if (data.contributions > 100 && data.significantRepos > 1 && data.stars > 50 && data.followers > 50) {
+			mark = 'B';
+			position = 3;
+		} else if (data.contributions > 50 && data.stars > 20 && data.followers > 20) {
+			mark = 'C+';
+			position = 2;
+		} else if (data.contributions > 20 && data.stars > 10 && data.followers > 10) {
+			mark = 'C';
+			position = 1;
+		}
+
+		return {
+			...data,
+			mark,
+			position
+		};
+	}
+}

src/app/page.css

@@ -35,6 +35,26 @@ body {
     }
 }
 
+
+.box-loading {
+    color: white;
+
+    display: flex;
+    flex-direction: column;
+
+    align-items: center;
+    justify-content: center;
+
+    font-size: 1.3em;
+
+    gap: 15px;
+}
+
+.box-loading > svg {
+    font-size: 35px;
+}
+
+
 /*title section*/
 .title {
     color: white;
@@ -94,7 +114,7 @@ body {
     }
 }
 
-.presentation-container {
+.presentation > div {
     position: absolute;
 
     top: 50%;
@@ -106,6 +126,14 @@ body {
 
     flex-direction: column;
 
+    gap: 20px;
+}
+
+.presentation-container {
+    display: flex;
+
+    flex-direction: column;
+
     gap: 30px;
 
     color: white;
@@ -144,7 +172,28 @@ body {
     flex-wrap: wrap;
 }
 
-/*projects section*/
+.presentation-boxes {
+    display: flex;
+
+    width: 100%;
+
+    gap: 20px;
+
+    @media (orientation: portrait) {
+        flex-direction: column;
+    }
+}
+
+.presentation-boxes > * {
+    width: 50%;
+    height: 20vh;
+
+    @media (orientation: portrait) {
+        width: 100%;
+    }
+}
+
+    /*projects section*/
 .projects {
     position: relative;