Move components into a src folder. Added mock data endpoint

pages/_app.js

@@ -6,7 +6,6 @@ import Config from '../config.json';
 
 import '../styles/globals.css'
 
-
 function MyApp({ Component, pageProps }) {
   return (
     // 2. Use at the root of your app

pages/api/beatsaver/art/[hash].js

@@ -6,7 +6,7 @@ import fetch from 'node-fetch';
 const cacheDir = process.cwd() + path.sep + "cache";
 if (!fs.existsSync(cacheDir)) {
     fs.mkdirSync(cacheDir);
-    console.log("Created cache directory")
+    console.log("Created cache directory");
 }
 
 export default async function handler(req, res) {
@@ -18,14 +18,14 @@ export default async function handler(req, res) {
     if (!exists) {
         const data = await fetch(`https://eu.cdn.beatsaver.com/${mapHash}.${ext}`);
         let buffer = await data.buffer();
-        buffer = await sharp(buffer).resize(150, 150).toBuffer()
+        buffer = await sharp(buffer).resize(150, 150).toBuffer();
         fs.writeFileSync(imagePath, buffer);
-        res.setHeader('Content-Type', 'image/' + ext)
+        res.setHeader('Content-Type', 'image/' + ext);
         res.send(buffer);
-        console.log("Song Cache - Added song \"" + mapHash + "\"")
+        console.log("Song Cache - Added song \"" + mapHash + "\"");
         return;
     }
     const buffer = fs.readFileSync(imagePath);
-    res.setHeader('Content-Type', 'image/jpg' + ext)
+    res.setHeader('Content-Type', 'image/jpg' + ext);
     res.send(buffer);
 }

pages/api/beatsaver/map.js

@@ -1,11 +1,11 @@
-import Utils from '../../../utils/utils'
+import Utils from '../../../utils/utils';
 
 export default async function handler(req, res) {
     const mapHash = req.query.hash;
 
     const mapData = await Utils.getMapData(mapHash.replace("custom_level_", ""));
     if (mapData === undefined) { // Check if a map hash was provided
-        return res.json({ error: true, message: "Unknown map" })
+        return res.json({ error: true, message: "Unknown map" });
     }
     const data = { // The maps data from the provided map hash
         bsr: mapData.id,

pages/api/mockdata.js

@@ -0,0 +1,9 @@
+export default async function handler(req, res) {
+    res.json({
+        "avatar": "https://avatars.akamai.steamstatic.com/4322d8d20cb6dbdd1d891b4efa9952a9679c9a76_full.jpg",
+        "country": "GB",
+        "pp": 0,
+        "rank": 0,
+        "countryRank": 0,
+    });
+}

pages/index.js

@@ -1,14 +1,11 @@
 import {Component} from 'react'
-import Avatar from '../components/Avatar';
+import Avatar from '../src/components/Avatar';
-import PlayerStats from '../components/PlayerStats';
+import PlayerStats from '../src/components/PlayerStats';
-import ScoreStats from '../components/ScoreStats';
+import ScoreStats from '../src/components/ScoreStats';
+import SongInfo from "../src/components/SongInfo";
 
 import Config from '../config.json';
-import SongInfo from "../components/SongInfo";
+import Utils from '../src/utils/utils';
-
-// Why do u have to proxy requests... it's so dumb LOL
-const SCORESABER_API_URL = Config.proxy_url + "/https://scoresaber.com/api/player/%s/full";
-const BEATLEADER_API_URL = Config.proxy_url + "/https://api.beatleader.xyz/player/%s";
 
 export default class Home extends Component {
 
@@ -142,8 +139,8 @@ export default class Home extends Component {
 	 * @param {string} id The steam id of the player
 	 * @returns 
 	 */
-	async updateData(id) {
+	async updateData(id) { 
-		const data = await fetch(this.state.websiteType == "ScoreSaber" ? SCORESABER_API_URL.replace("%s", id) : BEATLEADER_API_URL.replace("%s", id), {
+		const data = await fetch(new Utils().getWebsiteApi(id == "test" ? "Test" : this.state.websiteType).ApiUrl.replace("%s", id), {
 			mode: 'cors'
 		});
 		const json = await data.json();
@@ -195,15 +192,15 @@ export default class Home extends Component {
 	resetData(visible) {
 		console.log("Exiting level, resetting data.")
 		this.setState({
-			"leftHand": {
+			leftHand: {
-				"averageCut": [15.00],
+				averageCut: [15.00],
-				"averagePreSwing": [70.00],
+				averagePreSwing: [70.00],
-				"averagePostSwing": [30.00],
+				averagePostSwing: [30.00],
 			},
-			"rightHand": {
+			rightHand: {
-				"averageCut": [15.00],
+				averageCut: [15.00],
-				"averagePreSwing": [70.00],
+				averagePreSwing: [70.00],
-				"averagePostSwing": [30.00],
+				averagePostSwing: [30.00],
 			},
 			songInfo: undefined,
 			beatSaverData: undefined,

src/consts/WebsiteType.js

@@ -0,0 +1,15 @@
+import Config from '../../config.json';
+
+const WebsiteTypes = {
+    ScoreSaber: {
+        ApiUrl: Config.proxy_url + "/https://scoresaber.com/api/player/%s/full"
+    },
+    BeatLeader: {
+        ApiUrl: Config.proxy_url + "/https://api.beatleader.xyz/player/%s"
+    },
+    Test: {
+        ApiUrl: "/api/mockdata"
+    }
+}
+
+export default WebsiteTypes

src/utils/utils.js

@@ -0,0 +1,15 @@
+import WebsiteTypes from "../consts/WebsiteType";
+
+export default class Utils {
+    constructor() {};
+
+    /**
+     * Returns the information for the given website type.
+     * 
+     * @param {String} website 
+     * @returns The website type's information.
+     */
+    getWebsiteApi(website) {
+        return WebsiteTypes[website]
+    }
+}