From dcbe056be08cde3a63d91bd854ec92eceb1d9b40 Mon Sep 17 00:00:00 2001 From: sk337 Date: Wed, 24 Jan 2024 12:12:09 -0800 Subject: [PATCH] add profiles --- src/Leaderboard.jsx | 2 - src/Profile.jsx | 92 +++++++++++++++++++++++++++++++++++++ src/components/usercard.jsx | 28 +++-------- src/index.jsx | 9 +++- src/utils/jsutils.js | 19 ++++++++ src/utils/login.js | 6 +++ 6 files changed, 132 insertions(+), 24 deletions(-) create mode 100644 src/Profile.jsx diff --git a/src/Leaderboard.jsx b/src/Leaderboard.jsx index 28438da..88ef83f 100644 --- a/src/Leaderboard.jsx +++ b/src/Leaderboard.jsx @@ -109,8 +109,6 @@ export default function Leaderboard() { if (ud.error) { console.log("Error: ", ud.error); } else { - let image= await import(`../vendor/swordbattle.io/client/public/assets/game/player/${id2skin(ud.account.skins.equipped).bodyFileName.split(".")[0]}.png`) - ud["image"] = image.default; setProfiles(profiles =>[...profiles, ud]); } })}> diff --git a/src/Profile.jsx b/src/Profile.jsx new file mode 100644 index 0000000..133377b --- /dev/null +++ b/src/Profile.jsx @@ -0,0 +1,92 @@ +import React, { useState, useEffect } from "react"; +import Nav from "@/components/nav"; +import { getPubInfo } from "@/utils/login"; +import { + Avatar, + AvatarFallback, + AvatarImage, +} from "@/components/ui/avatar"; +import { + Card, + CardContent, + CardDescription, + CardFooter, + CardHeader, + CardTitle, +} from "@/components/ui/card"; + +import { dateParse } from "@/utils/jsutils"; + +export default function Profile() { + const urlData = new URL("https://"+window.location.hash.replace("#", "q/s")) + console.log(urlData) + if (!urlData.searchParams.get("user")) { + return ( +
+
+ ); + } + + const [user, setUser] = useState(false); + + useEffect(() => { + const fetchUser = async () => { + const data = await getPubInfo(urlData.searchParams.get("user")); + setUser(data); + }; + fetchUser(); + }, []); + + + if (user && !user.error) { + return ( +
+
+ ); + } else if(user.error){ + return ( +

not found

+ ) + } else { + return ( +
+

Loading...

+

+
+ ); + } +} \ No newline at end of file diff --git a/src/components/usercard.jsx b/src/components/usercard.jsx index 2135fb7..3d31e6c 100644 --- a/src/components/usercard.jsx +++ b/src/components/usercard.jsx @@ -6,27 +6,10 @@ import { } from "@/components/ui/hover-card"; import { CalendarDays } from "lucide-react"; import { Skeleton } from "@/components/ui/skeleton"; -import { id2skin } from "@/utils/jsutils"; +import { id2skin, dateParse } from "@/utils/jsutils"; export default function UserCard({ user, children }) { - function dateparse(){ - let date = new Date(user.account.created_at).toString().split(" "); - let monthMap= { - "Jan": "January", - "Feb": "February", - "Mar": "March", - "Apr": "April", - "May": "May", - "Jun": "June", - "Jul": "July", - "Aug": "August", - "Sep": "September", - "Oct": "October", - "Nov": "November", - "Dec": "December" - } - return `${monthMap[date[1]]} ${date[2]} ${date[3]}`; - } + if (user == "empty") { return ( @@ -53,14 +36,17 @@ export default function UserCard({ user, children }) { VC
-

@{user.account.username}

+ { + window.location.hash = `#profile?user=${encodeURIComponent(user.account.username)}`; + window.location.reload(); + }}>@{user.account.username}

If Gautam adds bios it will go here

{" "} - Joined {dateparse()} + Joined {dateParse(user.account.created_at)}
diff --git a/src/index.jsx b/src/index.jsx index 9e3fafe..a7c7e35 100644 --- a/src/index.jsx +++ b/src/index.jsx @@ -3,16 +3,23 @@ import ReactDOM from "react-dom/client"; import App from "@/App"; import "@/App.css"; import Leaderboard from "@/Leaderboard"; +import Profile from "@/Profile"; const root = ReactDOM.createRoot(document.getElementById("root")); console.log(window.location.hash.toLowerCase()); -if (window.location.hash.toLowerCase() == "#leaderboard") { +if (window.location.hash.toLowerCase().startsWith("#leaderboard")) { root.render( ); +} else if (window.location.hash.toLowerCase().startsWith("#profile")) { + root.render( + + + + ); } else { root.render( diff --git a/src/utils/jsutils.js b/src/utils/jsutils.js index efd3d96..920e765 100644 --- a/src/utils/jsutils.js +++ b/src/utils/jsutils.js @@ -35,3 +35,22 @@ export function id2skin(id) { } } } + +export function dateParse(dates){ + let date = new Date(dates).toString().split(" "); + let monthMap= { + "Jan": "January", + "Feb": "February", + "Mar": "March", + "Apr": "April", + "May": "May", + "Jun": "June", + "Jul": "July", + "Aug": "August", + "Sep": "September", + "Oct": "October", + "Nov": "November", + "Dec": "December" + } + return `${monthMap[date[1]]} ${date[2]} ${date[3]}`; +} diff --git a/src/utils/login.js b/src/utils/login.js index d49ec7a..63af7be 100644 --- a/src/utils/login.js +++ b/src/utils/login.js @@ -1,5 +1,7 @@ const ApiUrl = "https://sb-api-fb48ef34a197.herokuapp.com/"; +import {id2skin} from "./jsutils" + export async function checkLogin(){ if (window.localStorage.getItem("token") !== null) { let account = await fetch(ApiUrl + "auth/account", { @@ -50,5 +52,9 @@ export async function getPubInfo(username){ method: "POST", }); const data = await pub.json(); + if (!data.hasOwnProperty("error")) { + let image= await import(`../../vendor/swordbattle.io/client/public/assets/game/player/${id2skin(data.account.skins.equipped).bodyFileName.split(".")[0]}.png`) + data["image"] = image.default; + } return data; } \ No newline at end of file