diff --git a/components/about.jsx b/components/about.jsx index 76de20e..46db61e 100644 --- a/components/about.jsx +++ b/components/about.jsx @@ -2,7 +2,6 @@ import { LanguagesKnownCategory, description1, description2 } from "config"; import { AboutStyle } from "./about.style"; function about() { - // console.log(LanguagesKnown); return (
diff --git a/components/discord-activity.jsx b/components/discord-activity.jsx index 46be694..04c6280 100644 --- a/components/discord-activity.jsx +++ b/components/discord-activity.jsx @@ -2,6 +2,7 @@ import React, { useEffect, useState } from "react"; import { DicordActivityStyle } from "./discord-activity.style"; import { useLanyard } from "react-use-lanyard"; import { discord_id } from "config"; +import DiscordParser from "../libs/discord-parser" /*
{!loading && JSON.stringify(status, null, 4)}
; */ @@ -11,10 +12,11 @@ const customStatus = [ "Sleeping", "Studying", ]; -const statusPicker = () => { - return customStatus[Math.floor(Math.random() * customStatus.length)]; -}; + export default function DiscordActivity() { + const statusPicker = () => { + return customStatus[Math.floor(Math.random() * customStatus.length)]; + }; const { loading, status } = useLanyard({ userId: discord_id, socket: true, @@ -37,9 +39,16 @@ export default function DiscordActivity() { seconds )} elapsed`; }; - const baseURL = "https://cdn.discordapp.com/app-assets/"; const [currentTs, setCurrentTs] = useState(Date.now()); + const [parsedStatus, setParsedStatus] = useState(null); + + useEffect(() => { + if(!loading){ + setParsedStatus(DiscordParser(status)); + } + }, [status, loading]) + useEffect(() => { let interval = setInterval(() => { if (!loading) { @@ -47,257 +56,44 @@ export default function DiscordActivity() { let timeElapsed = convertMsToHM( currentTs - new Date(status?.activities[1]?.timestamps.start) ); - // console.log(timeElapsed); setTime(timeElapsed); } - // console.log("Intervcal"); }, 1000); return () => { clearInterval(interval); }; }, [currentTs, loading]); + if ( - !loading && - (status.discord_status === "online" || - status.discord_status === "idle" || - status.discord_status === "dnd") && - status.activities.length - ) { - if (status.activities[0].id === "custom" && status.activities.length == 1) { - return ( - -
-
- -
-
- -
-
-
-
- - {status?.discord_user.username + - "#" + - status?.discord_user.discriminator} - -
-
- is {status?.discord_status} -
-
- {status?.activities[0].state} -
-
-
-
- ); - } else { - if (status.activities[1]?.name === "Spotify") { - return ( - - {!loading && ( - <> -
-
- {} -
-
- { - - } -
-
-
-
- {status.activities[1] && status.activities[1].name} -
-
- {status.activities[1] && status.activities[1].details} -
-
- {status.activities[1] && status.activities[1].state - ? status.activities[1].state - : null} -
-
-
- {status?.activities[1]?.timestamps?.start && time} -
-
- - )} -
- ); - } - // else if (status.activities[0]) { - // return ( - // - // {!loading && ( - // <> - //
- //
- // {status.activities[0] && ( - // - // )} - //
- //
- // {status.activities[0] && ( - // - // )} - //
- //
- //
- //
- // {status.activities[0].name} - //
- //
- // {status.activities[0].details} - //
- //
- // {status.activities[0].state - // ? status.activities[0].state - // : null} - //
- //
- //
- // {status?.activities[0]?.timestamps?.start && time} - //
- //
- // - // )} - //
- // ); - // } - else { - return ( - - {!loading && ( - <> -
-
- {status.activities[1] && ( - - )} -
-
- {status.activities[1] && ( - - )} -
-
-
-
- {status.activities[1] && status.activities[1].name} -
-
- {status.activities[1] && status.activities[1].details} -
-
- {status.activities[1] && status.activities[1].state - ? status.activities[1].state - : null} -
-
-
- {status?.activities[1]?.timestamps?.start && time} -
-
- - )} -
- ); - } - } - } else if ( - !loading && - status.activities.length === 0 && - (status.discord_status === "online" || - status.discord_status === "idle" || - status.discord_status === "dnd") + !loading && parsedStatus ) { return (
- +
- +
- - {status?.discord_user.username + - "#" + - status?.discord_user.discriminator} - + {parsedStatus.discord.username + "#" + parsedStatus.discord.discriminator}
- is Online -
-
- {status?.activities[0]?.state} + {parsedStatus.activity.details}

-
{}
+
+ {parsedStatus.activity.state} +
+ {/*
00:00:00 elapsed
*/}
); - } else { + } + else { let restData = { username: "Bravo68-DF_Techs", public_flags: 64, diff --git a/components/footer.jsx b/components/footer.jsx index 2eb58af..6e596a6 100644 --- a/components/footer.jsx +++ b/components/footer.jsx @@ -1,9 +1,17 @@ import React from "react"; import FooterStyle from "./footer.style"; import { name } from "config"; +import Status from "./status"; function footer() { - return Build By {name}; + return +
+ Build By {name} +
+
+ +
+
; } export default footer; diff --git a/components/footer.style.jsx b/components/footer.style.jsx index e155251..e98021d 100644 --- a/components/footer.style.jsx +++ b/components/footer.style.jsx @@ -9,6 +9,17 @@ export default styled.div` background: var(--color1); display: flex; justify-content: center; - align-items: center; - font-size: 1.2rem; + .main-footer { + display: flex; + justify-content: center; + align-items: center; + font-size: 1.2rem; + .api-status { + justify-content: right; + align-items: right; + font-size: 1.2rem; + padding-bottom: 20px; + } + + } `; diff --git a/components/skillCard.jsx b/components/skillCard.jsx index 372c70a..9a98b61 100644 --- a/components/skillCard.jsx +++ b/components/skillCard.jsx @@ -2,7 +2,6 @@ import React from "react"; import SkillCardStyle from "./skillCard.styled"; function SkillCard({ title, children, image, bannerImage, url }) { - // console.log(image); return (
diff --git a/components/status.jsx b/components/status.jsx index e69de29..7849b9e 100644 --- a/components/status.jsx +++ b/components/status.jsx @@ -0,0 +1,35 @@ +import React, { useEffect, useState } from "react"; +import axios from "handlers/axios"; +import Box from "@mui/material/Box"; +import LinearProgress from "@mui/material/LinearProgress"; + +export default function Status() { + const [status, setStatus] = useState({}); + const [loading, setLoading] = useState(true); + + async function requestStatus() { + await axios.get("/health/health").then((res) => { + setStatus(res.data); + setLoading(false); + }); + } + + useEffect(() => { + requestStatus(); + }, [loading]); + + if (loading) { + return ( + + + Requesting Live API data... + + ); + } else { + return ( +
+ {(status.status)} +
+ ); + } +} \ No newline at end of file diff --git a/components/toots.jsx b/components/toots.jsx index dc056b2..d1ad363 100644 --- a/components/toots.jsx +++ b/components/toots.jsx @@ -21,7 +21,7 @@ function Toots () { useEffect(() => { requestAPIS(); - }, [loading, APISDK]); + }, [loading]); let image = skills?.logo?.masto; if (loading) { return ( @@ -34,8 +34,6 @@ function Toots () { ); } else { - - console.log(skills.data); return ( <> diff --git a/libs/discord-parser.js b/libs/discord-parser.js new file mode 100644 index 0000000..99b1d0c --- /dev/null +++ b/libs/discord-parser.js @@ -0,0 +1,90 @@ +export default function parse(data) { + const output = {}; + const act = []; + + const PrirorityActivityType = ['Coding', 'Listening to Spotify', 'Playing', 'Custom Status', 'Streaming', 'Watching', 'Competing', 'Unknown']; + + output.discord = { + id: data.discord_user.id, + username: data.discord_user.username, + discriminator: data.discord_user.discriminator, + avatar_url: "https://cdn.discordapp.com/avatars/" + data.discord_user.id + "/" + data.discord_user.avatar + ".png", + avatar_decoration_url: "https://cdn.discordapp.com/avatar-decoration-presets/" + data.discord_user.avatar_decoration + ".png" + } + + output.kv = data.kv; + + if (data.listening_to_spotify) { + output.spotify = { + album: data.spotify.album, + artist: data.spotify.artist, + song: data.spotify.song, + album_art_url: data.spotify.album_art_url, + timestamps: data.spotify.timestamps, + track_id: data.spotify.track_id + } + } + + for(const activity of data.activities) { + if(activity.name.includes("Visual Studio Code")){ + act.push({ + prirority_id: PrirorityActivityType.indexOf('Coding'), + ...activity + }); + } + else if(activity.name.includes("Spotify")){ + act.push({ + prirority_id: PrirorityActivityType.indexOf('Listening to Spotify'), + ...activity + }); + } + else if(activity.name.includes("Custom Status")){ + act.push({ + prirority_id: PrirorityActivityType.indexOf('Custom Status'), + ...activity + }); + output.custom_status = { + state: activity.state, + emoji: { + name: activity.emoji?.name, + id: activity.emoji?.id, + animated: activity.emoji?.animated, + emoji_url: "https://cdn.discordapp.com/emojis/" + activity.emoji?.id + ".webp?size=44&quality=lossless" + } + + }; + } + else { + act.push({ + prirority_id: PrirorityActivityType.indexOf('Unknown'), + ...activity + }); + break; + } + } + + act.sort((a, b) => a.prirority_id - b.prirority_id); + + output.activity = act[0]; + + if(output.activity.prirority_id == 1){ + output.activity.assets = { + large_image : output.spotify.album_art_url, + small_image : "/images/brandlogos/SpotifyLogo.png" + } + } + else if(output.activity.prirority_id == 3){ + output.activity.assets = { + large_image : "/images/anime-profile-pic.png", + small_image : output.custom_status.emoji.emoji_url, + } + } + else { + output.activity.assets = { + large_image : "https://cdn.discordapp.com/app-assets/"+output.activity.application_id+"/"+output.activity.assets.large_image+".png", + small_image : "https://cdn.discordapp.com/app-assets/"+output.activity.application_id+"/"+output.activity.assets.small_image+".png", + } + } + + return output; +} \ No newline at end of file diff --git a/public/images/brandlogos/SpotifyLogo.png b/public/images/brandlogos/SpotifyLogo.png new file mode 100644 index 0000000..e8aab70 Binary files /dev/null and b/public/images/brandlogos/SpotifyLogo.png differ