diff --git a/src/pages/home.tsx b/src/pages/home.tsx
index 1852a9c01..450f350de 100644
--- a/src/pages/home.tsx
+++ b/src/pages/home.tsx
@@ -1,8 +1,13 @@
import axios from 'axios';
+import { useEffect, useState } from 'react';
import DashboardCard from 'components/DashboardCard';
import PerformanceGraph from 'components/Graphs/PerformanceGraph';
import { useDocumentTitle } from 'usehooks-ts';
import { round } from 'utils/util';
+import { useUserInfo } from 'data/UserInfo';
+import { LodestoneContext } from 'data/LodestoneContext';
+import { useContext } from 'react';
+import Spinner from 'components/DashboardLayout/Spinner';
type CpuUsageReply = {
cpu_speed: number;
@@ -32,22 +37,45 @@ const getRamUsage = async (): Promise<[number, number]> => {
};
const Home = () => {
+ const { token } = useContext(LodestoneContext);
+ const { isLoading, isError, data: user } = useUserInfo();
+
useDocumentTitle('Home - Lodestone');
+
+ const [loading, setLoading] = useState(true);
+
+ useEffect(() => {
+ //give time for user to load
+ setTimeout(() => {
+ setLoading(false);
+ }, 1000);
+ }, []);
+
+ if (loading && isLoading) {
+ return
;
+ }
+
return (
// used to possibly center the content
-
+
{/* main content container */}
- Home
+ {`Welcome, ${
+ token && !isLoading && !isError && user
+ ? `${user.username}`
+ : 'Guest'
+ }!`}
-
Display some general information here maybe
+
+ {' '}
+ Select or create an instance to continue.
+
- Performance
-