diff --git a/src/App.tsx b/src/App.tsx index ac3aa1e..4aa38d7 100755 --- a/src/App.tsx +++ b/src/App.tsx @@ -4,12 +4,6 @@ import { AuthProvider, useAuth } from "@/context/AuthContext"; import Navbar from "@/components/Navbar"; import AboutPage from "@/pages/AboutPage"; import ProjectsPage from "@/pages/ProjectsPage"; -// import APCSPPage from "@/pages/APCSPPage"; -// import LoginPage from "@/pages/LoginPage"; -// import SystemPage from "@/pages/SystemPage"; -// import SystemStatus from "@/components/SystemStatus"; -// import SwitchNotification from "@/components/SwitchNotification"; -// import ProtectedRoute from "@/components/ProtectedRoute"; import FoxGame from "@/games/fox-adventure/components/FoxGame"; import ThemeToggle from "@/components/ThemeToggle"; import EndOSBootAnimation from "@/components/EndOSBootAnimation"; @@ -18,290 +12,190 @@ import "@/styles/protofox-theme.css"; // EndOS animation control const useEndOSAnimation = () => { - const [bootComplete, setBootComplete] = useState(false); - // Using underscore prefix to indicate intentionally unused variable - const [skipBoot, _setSkipBoot] = useState(() => { - // Check for URL parameter that allows skipping the boot animation - const urlParams = new URLSearchParams(window.location.search); - const skipParam = urlParams.get("skipBoot"); + const [bootComplete, setBootComplete] = useState(false); + const [skipBoot] = useState(() => { + const urlParams = new URLSearchParams(window.location.search); + const skipParam = urlParams.get("skipBoot"); + const sessionSeen = + sessionStorage.getItem("endos-boot-complete") === "true"; - // Also check if user has already seen the animation in this session - const sessionSeen = - sessionStorage.getItem("endos-boot-complete") === "true"; + return skipParam === "true" || sessionSeen; + }); - return skipParam === "true" || sessionSeen; - }); + const handleBootComplete = () => { + setBootComplete(true); + sessionStorage.setItem("endos-boot-complete", "true"); + }; - // Handle boot animation completion - const handleBootComplete = () => { - setBootComplete(true); - sessionStorage.setItem("endos-boot-complete", "true"); - }; - - return { bootComplete, skipBoot, handleBootComplete }; + return { bootComplete, skipBoot, handleBootComplete }; }; // AuthChecker component to access auth context inside the router const AuthChecker = ({ children }: { children: React.ReactNode }) => { - const auth = useAuth(); - const [isStatusVisible, setIsStatusVisible] = useState(false); - // Using underscore prefix for all unused state variables - const [_showNotification, setShowNotification] = useState(false); - const [_notificationType, setNotificationType] = useState< - "switch" | "warning" | "notice" - >("switch"); - const [_notificationMessage, setNotificationMessage] = useState(""); - const [_selectedAlter, setSelectedAlter] = useState(""); + const auth = useAuth(); + const [isStatusVisible, setIsStatusVisible] = useState(false); - // Toggle system status floating panel - const toggleStatus = () => { - setIsStatusVisible((prev) => !prev); - }; + const toggleStatus = () => { + setIsStatusVisible((prev) => !prev); + }; - // Simulate random switches for demo purposes - useEffect(() => { - if (!auth.isAuthenticated) return; + return ( + <> + {children} - // Every 5-15 minutes, show a switch notification - const randomInterval = - Math.floor(Math.random() * (15 - 5 + 1) + 5) * 60 * 1000; - const interval = setInterval(() => { - // 70% chance of switch, 20% chance of notice, 10% chance of warning - const rand = Math.random(); - - if (rand < 0.7) { - setNotificationType("switch"); - setSelectedAlter(""); // Random alter will be selected - } else if (rand < 0.9) { - setNotificationType("notice"); - setNotificationMessage("System communication active"); - } else { - setNotificationType("warning"); - setNotificationMessage("System experiencing stress"); - } - - setShowNotification(true); - }, randomInterval); - - return () => clearInterval(interval); - }, [auth.isAuthenticated]); - - return ( - <> - {children} - - {/* Floating System Status for authenticated users */} - {auth.isAuthenticated && ( - <> -
-
- - {isStatusVisible - ? "Hide System Status" - : "System Status"} - -
- {/* */} -
- - {/* System Notifications */} - {/* setShowNotification(false)} - alterName={selectedAlter} - type={notificationType} - message={notificationMessage} - autoClose - autoCloseDelay={5000} - /> */} - - )} - - ); + {auth.isAuthenticated && ( +
+
+ + {isStatusVisible ? "Hide System Status" : "System Status"} + +
+
+ )} + + ); }; const App = () => { - const [isGameActive, setIsGameActive] = useState(false); - const [_showInitialSwitchDemo, setShowInitialSwitchDemo] = useState(false); - const { bootComplete, skipBoot, handleBootComplete } = useEndOSAnimation(); + const [isGameActive, setIsGameActive] = useState(false); + const { bootComplete, skipBoot, handleBootComplete } = useEndOSAnimation(); - // Demo the switch notification after a delay - useEffect(() => { - const timer = setTimeout(() => { - setShowInitialSwitchDemo(true); + useEffect(() => { + // Konami code sequence + const konamiCode = [ + "ArrowUp", + "ArrowUp", + "ArrowDown", + "ArrowDown", + "ArrowLeft", + "ArrowRight", + "ArrowLeft", + "ArrowRight", + "b", + "a", + ]; + let index = 0; - // Hide after 5 seconds - setTimeout(() => { - setShowInitialSwitchDemo(false); - }, 5000); - }, 10000); + const handleKeydown = (event: KeyboardEvent) => { + if (event.key === konamiCode[index]) { + index++; - return () => clearTimeout(timer); - }, []); + if (index === konamiCode.length) { + setIsGameActive(true); + console.log("Konami code activated!"); + } + } else { + index = 0; + } + }; - useEffect(() => { - // Konami code sequence - const konamiCode = [ - "ArrowUp", - "ArrowUp", - "ArrowDown", - "ArrowDown", - "ArrowLeft", - "ArrowRight", - "ArrowLeft", - "ArrowRight", - "b", - "a", - ]; - let index = 0; + window.addEventListener("keydown", handleKeydown); - const handleKeydown = (event: KeyboardEvent) => { - // Check if the pressed key matches the next key in the sequence - if (event.key === konamiCode[index]) { - index++; + return () => window.removeEventListener("keydown", handleKeydown); + }, []); - // If the entire sequence is completed - if (index === konamiCode.length) { - setIsGameActive(true); - // Optional: Play a sound or show a notification - console.log("Konami code activated!"); - } - } else { - // Reset if a wrong key is pressed - index = 0; - } - }; + return ( + + {/* EndOS Boot Animation */} + {!skipBoot && !bootComplete && ( + + )} - window.addEventListener("keydown", handleKeydown); - - // Clean up the event listener on component unmount - return () => window.removeEventListener("keydown", handleKeydown); - }, []); - - return ( - - {/* EndOS Boot Animation */} - {!skipBoot && !bootComplete && ( - - )} - - {/* Main Application - Only visible after boot animation completes */} + {/* Main Application - Only visible after boot animation completes */} +
+ +
- - -
- {/* Background Logo */} -
-
- Background Logo -
-
+ {/* Background Logo */} +
+
+ Background Logo +
+
- {/* Main Content */} -
- + {/* Main Content */} +
+ - {/* Theme Toggle */} -
- -
+ {/* Theme Toggle */} +
+ +
-
- - } - /> - } - /> - {/* } /> */} - {/* } /> - - - - } - /> */} - -

- 404: Page Not Found -

-

- This fox couldn't find - what you're looking for. -

-
- } - /> - - - - {/* Footer */} -
-

- © 2023 - {new Date().getFullYear()}{" "} - EndofTimee. All rights reserved. -

-
- - Try the Konami code: ↑↑↓↓←→←→BA - -
- v0.9.5 -
-
-
-
- - {/* Fox Game Overlay - Activated by Konami Code */} - {isGameActive && ( - <> - - - - )} +
+ + } /> + } /> + +

+ 404: Page Not Found +

+

+ This fox couldn't find what you're looking for. +

- - + } + /> + + + + {/* Footer */} +
+

+ © 2023 - {new Date().getFullYear()} EndofTimee. All rights + reserved. +

+
+ + Try the Konami code: ↑↑↓↓←→←→BA + +
+ v0.9.5 +
+
+
+
+ + {/* Fox Game Overlay - Activated by Konami Code */} + {isGameActive && ( + <> + + + + )}
- - ); + + + + + ); }; export default App; diff --git a/src/components/EndOSBootAnimation.tsx b/src/components/EndOSBootAnimation.tsx index 1e5d01c..e62aafa 100755 --- a/src/components/EndOSBootAnimation.tsx +++ b/src/components/EndOSBootAnimation.tsx @@ -1,269 +1,221 @@ -import React, { useState, useEffect } from "react"; +import React, { useState, useEffect, useCallback } from "react"; import "@/styles/EndOSBootAnimation.css"; interface EndOSBootAnimationProps { - // Using underscores to mark unused props to avoid TypeScript errors - _customLogo?: string; - _customColors?: { - primary?: string; - secondary?: string; - fox?: string; - }; - onComplete?: () => void; - skipAnimation?: boolean; + onComplete?: () => void; + skipAnimation?: boolean; } const EndOSBootAnimation: React.FC = ({ - onComplete, - skipAnimation = false, - // Rename with underscores to indicate variables are intentionally unused - _customLogo, - _customColors, + onComplete, + skipAnimation = false, }) => { - const [active, setActive] = useState(true); - const [bootStage, setBootStage] = useState(0); - const [showLogo, setShowLogo] = useState(false); - const [bootComplete, setBootComplete] = useState(false); + const [active, setActive] = useState(true); + const [bootStage, setBootStage] = useState(0); + const [showLogo, setShowLogo] = useState(false); + const [bootComplete, setBootComplete] = useState(false); - // Boot sequence timing - useEffect(() => { - if (skipAnimation) { - handleAnimationComplete(); - return; - } + const handleAnimationComplete = useCallback(() => { + setActive(false); + if (onComplete) { + onComplete(); + } + }, [onComplete]); - // Initialize boot sequence with proper timing to prevent overlap - const bootSequence = [ - { stage: 1, delay: 1500 }, // Initial screen flicker - { stage: 2, delay: 3000 }, // BIOS check (longer time to read) - { stage: 3, delay: 3500 }, // System scan (longer for progress bar) - { stage: 4, delay: 3500 }, // Loading modules (allow time for animation) - { stage: 5, delay: 3500 }, // Fox protocols (allow time to read traits) - { stage: 6, delay: 3000 }, // Show logo (allow time to appreciate) - { stage: 7, delay: 3000 }, // Final activation (longer read time) - { stage: 8, delay: 2000 }, // Fade out - ]; + // Boot sequence timing + useEffect(() => { + if (skipAnimation) { + handleAnimationComplete(); + return; + } - let timeout: any; // Using any instead of NodeJS.Timeout - let currentIndex = 0; + // Initialize boot sequence with proper timing to prevent overlap + const bootSequence = [ + { stage: 1, delay: 1500 }, // Initial screen flicker + { stage: 2, delay: 3000 }, // BIOS check (longer time to read) + { stage: 3, delay: 3500 }, // System scan (longer for progress bar) + { stage: 4, delay: 3500 }, // Loading modules (allow time for animation) + { stage: 5, delay: 3500 }, // Fox protocols (allow time to read traits) + { stage: 6, delay: 3000 }, // Show logo (allow time to appreciate) + { stage: 7, delay: 3000 }, // Final activation (longer read time) + { stage: 8, delay: 2000 }, // Fade out + ]; - const runNextStage = () => { - if (currentIndex < bootSequence.length) { - const { stage, delay } = bootSequence[currentIndex]; + let timeout: ReturnType; + let currentIndex = 0; - // Clean transition - clear ALL previous stages to prevent any background visibility - document.querySelectorAll(".boot-stage").forEach((el) => { - el.classList.remove("active"); - }); + const runNextStage = () => { + if (currentIndex < bootSequence.length) { + const { stage, delay } = bootSequence[currentIndex]; - // Reset content visibility - document.querySelectorAll(".boot-content").forEach((el) => { - el.classList.remove("active"); - }); + // Clean transition - clear ALL previous stages to prevent any background visibility + document.querySelectorAll(".boot-stage").forEach((el) => { + el.classList.remove("active"); + }); - // Short delay to allow for transition - setTimeout(() => { - // First ensure boot content is visible - document.querySelectorAll(".boot-content").forEach((el) => { - el.classList.add("active"); - }); + // Reset content visibility + document.querySelectorAll(".boot-content").forEach((el) => { + el.classList.remove("active"); + }); - // Then activate the correct stage - setBootStage(stage); + // Short delay to allow for transition + setTimeout(() => { + // First ensure boot content is visible + document.querySelectorAll(".boot-content").forEach((el) => { + el.classList.add("active"); + }); - if (stage === 6) { - setShowLogo(true); - } else if (stage === 7) { - setBootComplete(true); - } - }, 300); + // Then activate the correct stage + setBootStage(stage); - currentIndex++; - timeout = setTimeout(runNextStage, delay); - } else { - handleAnimationComplete(); - } - }; + if (stage === 6) { + setShowLogo(true); + } else if (stage === 7) { + setBootComplete(true); + } + }, 300); - // Start the sequence - timeout = setTimeout(runNextStage, 500); - - return () => { - if (timeout) clearTimeout(timeout); - }; - }, [skipAnimation]); - - const handleAnimationComplete = () => { - setActive(false); - if (onComplete) { - onComplete(); - } - }; - - // Skip button click handler - const handleSkip = () => { + currentIndex++; + timeout = setTimeout(runNextStage, delay); + } else { handleAnimationComplete(); + } }; - if (!active) return null; + // Start the sequence + timeout = setTimeout(runNextStage, 500); - return ( -
- {/* Accessibility */} -
- Website loading. EndOS boot sequence in progress. -
+ return () => { + if (timeout) clearTimeout(timeout); + }; + }, [skipAnimation, handleAnimationComplete]); -
+ // Skip button click handler + const handleSkip = () => { + handleAnimationComplete(); + }; -
-
-
+ if (!active) return null; -
-
-
+ return ( +
+ {/* Accessibility */} +
+ Website loading. EndOS boot sequence in progress. +
- {/* Boot Sequence Content */} -
- {/* BIOS Check */} -
-
END_OS BIOS v2.5
-
- Initializing hardware... -
-
- CPU: ProtoCore i9 @ 4.7GHz -
-
- Memory: 16GB NeuralRAM -
-
- Checking system integrity... OK -
-
- Starting boot sequence... -
-
+
- {/* System Scan */} -
-
SYSTEM SCAN
-
-
-
-
- Checking vital systems... -
-
- Initializing neural pathways... -
-
- Activating sensory modules... -
-
- All systems nominal -
-
+
+
+
- {/* Module Loading */} -
-
- LOADING CORE MODULES -
-
-
-
-
- ProtogenCore -
-
-
-
-
NeuralNet
-
-
-
-
- VisorDisplay -
-
-
-
-
FoxTraits
-
-
-
+
+
+
- {/* Fox Protocol */} -
-
- ACTIVATING FOX PROTOCOLS -
-
- Fluffy tail module: Online -
-
- Fox ears: Calibrated -
-
- Cuteness factor: Nonexistent -
-
- Mischief subroutines: Loaded -
-
- ProtoFox integration: Complete -
-
- - {/* Logo Display */} -
-
- End - OS -
-
- ProtoFox Operating System -
-
- - {/* System Ready */} -
-
SYSTEM ACTIVATED
-
- Welcome back, ProtoFox -
-
- EndOS v1.0 is fully operational -
-
-
-
-
- - {/* Skip button - More prominent and always visible */} - +
END_OS BIOS v2.5
+
Initializing hardware...
+
CPU: ProtoCore i9 @ 4.7GHz
+
Memory: 16GB NeuralRAM
+
+ Checking system integrity... OK +
+
Starting boot sequence...
+
+ + {/* System Scan */} +
+
SYSTEM SCAN
+
+
+
+
Checking vital systems...
+
Initializing neural pathways...
+
Activating sensory modules...
+
All systems nominal
+
+ + {/* Module Loading */} +
+
LOADING CORE MODULES
+
+
+
+
ProtogenCore
+
+
+
+
NeuralNet
+
+
+
+
VisorDisplay
+
+
+
+
FoxTraits
+
+
+
+ + {/* Fox Protocol */} +
+
ACTIVATING FOX PROTOCOLS
+
Fluffy tail module: Online
+
Fox ears: Calibrated
+
Cuteness factor: Nonexistent
+
Mischief subroutines: Loaded
+
ProtoFox integration: Complete
+
+ + {/* Logo Display */} +
+
+ End + OS +
+
ProtoFox Operating System
+
+ + {/* System Ready */} +
+
SYSTEM ACTIVATED
+
Welcome back, ProtoFox
+
+ EndOS v1.0 is fully operational +
+
+
- ); +
+ + {/* Skip button - More prominent and always visible */} + + + ); }; export default EndOSBootAnimation; diff --git a/src/context/AuthContext.tsx b/src/context/AuthContext.tsx index 3ecaeaf..6016ed5 100755 --- a/src/context/AuthContext.tsx +++ b/src/context/AuthContext.tsx @@ -1,177 +1,175 @@ import { - createContext, - useContext, - useState, - ReactNode, - useEffect, + createContext, + useContext, + useState, + ReactNode, + useEffect, } from "react"; interface SystemMember { - id: string; - name: string; - role: string; - color?: string; + id: string; + name: string; + role: string; + color?: string; } interface SystemState { - safetyLevel: "safe" | "unsafe" | "sorta-safe" | "unknown"; - mentalState: - | "ok" - | "bad" - | "very-bad" - | "panic" - | "spiraling" - | "unstable" - | "delusional"; - frontingStatus: "single" | "co-fronting" | "switching" | "unknown"; - currentFronters: SystemMember[]; + safetyLevel: "safe" | "unsafe" | "sorta-safe" | "unknown"; + mentalState: + | "ok" + | "bad" + | "very-bad" + | "panic" + | "spiraling" + | "unstable" + | "delusional"; + frontingStatus: "single" | "co-fronting" | "switching" | "unknown"; + currentFronters: SystemMember[]; } interface AuthContextType { - isAuthenticated: boolean; - username: string | null; - systemState: SystemState | null; - login: (username: string, password: string) => Promise; - logout: () => void; - updateSystemState: (newState: Partial) => void; + isAuthenticated: boolean; + username: string | null; + systemState: SystemState | null; + login: (username: string, password: string) => Promise; + logout: () => void; + updateSystemState: (newState: Partial) => void; } // System members data const systemMembers: SystemMember[] = [ - { id: "1", name: "Aurora", role: "Host", color: "#9d4edd" }, - { id: "2", name: "Alex", role: "Younger", color: "#4ea8de" }, - { id: "3", name: "Psy", role: "Protector", color: "#5e548e" }, - { id: "4", name: "Xander", role: "Caretaker", color: "#219ebc" }, - { id: "5", name: "Unknown", role: "Fragment", color: "#6c757d" }, - { id: "6", name: "The thing", role: "Persecutor", color: "#e63946" }, - { id: "7", name: "Unknown 2", role: "Fragment", color: "#6c757d" }, + { id: "1", name: "Aurora", role: "Host", color: "#9d4edd" }, + { id: "2", name: "Alex", role: "Younger", color: "#4ea8de" }, + { id: "3", name: "Psy", role: "Protector", color: "#5e548e" }, + { id: "4", name: "Xander", role: "Caretaker", color: "#219ebc" }, + { id: "5", name: "Unknown", role: "Fragment", color: "#6c757d" }, + { id: "6", name: "The thing", role: "Persecutor", color: "#e63946" }, + { id: "7", name: "Unknown 2", role: "Fragment", color: "#6c757d" }, ]; // Creating the context with a default value of null const AuthContext = createContext(null); export const AuthProvider = ({ children }: { children: ReactNode }) => { - // Initialize authentication state from localStorage if available - const [isAuthenticated, setIsAuthenticated] = useState(() => { - const stored = localStorage.getItem("isAuthenticated"); - return stored === "true"; - }); + // Initialize authentication state from localStorage if available + const [isAuthenticated, setIsAuthenticated] = useState(() => { + const stored = localStorage.getItem("isAuthenticated"); + return stored === "true"; + }); - const [username, setUsername] = useState(() => { - return localStorage.getItem("username"); - }); + const [username, setUsername] = useState(() => { + return localStorage.getItem("username"); + }); - // Initialize system state from localStorage or set defaults - const [systemState, setSystemState] = useState(() => { - const stored = localStorage.getItem("systemState"); - if (stored && isAuthenticated) { - return JSON.parse(stored); + // Initialize system state from localStorage or set defaults + const [systemState, setSystemState] = useState(() => { + const stored = localStorage.getItem("systemState"); + if (stored && isAuthenticated) { + return JSON.parse(stored); + } + return isAuthenticated + ? { + safetyLevel: "safe", + mentalState: "ok", + frontingStatus: "single", + currentFronters: [systemMembers[0]], // Default to Aurora as fronter } - return isAuthenticated - ? { - safetyLevel: "safe", - mentalState: "ok", - frontingStatus: "single", - currentFronters: [systemMembers[0]], // Default to Aurora as fronter - } - : null; - }); + : null; + }); - // Update localStorage when auth state changes - useEffect(() => { - localStorage.setItem("isAuthenticated", isAuthenticated.toString()); - if (username) { - localStorage.setItem("username", username); - } else { - localStorage.removeItem("username"); - } + // Sync auth state to localStorage + useEffect(() => { + localStorage.setItem("isAuthenticated", isAuthenticated.toString()); + if (username) { + localStorage.setItem("username", username); + } else { + localStorage.removeItem("username"); + } + }, [isAuthenticated, username]); - // If logged out, clear system state - if (!isAuthenticated) { - localStorage.removeItem("systemState"); - setSystemState(null); - } else if (systemState) { - localStorage.setItem("systemState", JSON.stringify(systemState)); - } - }, [isAuthenticated, username, systemState]); + // Sync system state to localStorage + useEffect(() => { + if (!isAuthenticated) { + localStorage.removeItem("systemState"); + } else if (systemState) { + localStorage.setItem("systemState", JSON.stringify(systemState)); + } + }, [isAuthenticated, systemState]); - const login = async (username: string, password: string) => { - // For security, add a slight delay to prevent rapid brute force attempts - await new Promise((resolve) => setTimeout(resolve, 800)); + const login = async (username: string, password: string) => { + // For security, add a slight delay to prevent rapid brute force attempts + await new Promise((resolve) => setTimeout(resolve, 800)); - // We use credential verification with multiple allowed passwords for different contexts - const validCredentials = [{ user: "system", pass: "." }]; + // We use credential verification with multiple allowed passwords for different contexts + const validCredentials = [{ user: "system", pass: "." }]; - const isValid = validCredentials.some( - (cred) => - cred.user === username.toLowerCase() && cred.pass === password, - ); - - if (isValid) { - setIsAuthenticated(true); - setUsername(username); - - // Initialize system state on login - const initialState: SystemState = { - safetyLevel: "safe", - mentalState: "ok", - frontingStatus: "single", - currentFronters: [systemMembers[0]], - }; - - setSystemState(initialState); - localStorage.setItem("systemState", JSON.stringify(initialState)); - - return true; - } - - return false; - }; - - const logout = () => { - // Add a short delay for better UX - setTimeout(() => { - setIsAuthenticated(false); - setUsername(null); - setSystemState(null); - - // Clear sensitive data from localStorage - localStorage.removeItem("systemState"); - }, 300); - }; - - const updateSystemState = (newState: Partial) => { - if (!systemState) return; - - const updatedState = { ...systemState, ...newState }; - setSystemState(updatedState); - localStorage.setItem("systemState", JSON.stringify(updatedState)); - }; - - // Construct the context value - const contextValue: AuthContextType = { - isAuthenticated, - username, - systemState, - login, - logout, - updateSystemState, - }; - - return ( - - {children} - + const isValid = validCredentials.some( + (cred) => cred.user === username.toLowerCase() && cred.pass === password, ); + + if (isValid) { + setIsAuthenticated(true); + setUsername(username); + + // Initialize system state on login + const initialState: SystemState = { + safetyLevel: "safe", + mentalState: "ok", + frontingStatus: "single", + currentFronters: [systemMembers[0]], + }; + + setSystemState(initialState); + localStorage.setItem("systemState", JSON.stringify(initialState)); + + return true; + } + + return false; + }; + + const logout = () => { + // Add a short delay for better UX + setTimeout(() => { + setIsAuthenticated(false); + setUsername(null); + setSystemState(null); + + // Clear sensitive data from localStorage + localStorage.removeItem("systemState"); + }, 300); + }; + + const updateSystemState = (newState: Partial) => { + if (!systemState) return; + + const updatedState = { ...systemState, ...newState }; + setSystemState(updatedState); + localStorage.setItem("systemState", JSON.stringify(updatedState)); + }; + + // Construct the context value + const contextValue: AuthContextType = { + isAuthenticated, + username, + systemState, + login, + logout, + updateSystemState, + }; + + return ( + {children} + ); }; // Custom hook for easier context consumption export const useAuth = () => { - const context = useContext(AuthContext); - if (!context) { - throw new Error("useAuth must be used within an AuthProvider"); - } - return context; + const context = useContext(AuthContext); + if (!context) { + throw new Error("useAuth must be used within an AuthProvider"); + } + return context; }; // Export system members data for use in other components diff --git a/src/pages/AboutPage.tsx b/src/pages/AboutPage.tsx index 3094bb3..49f0e85 100755 --- a/src/pages/AboutPage.tsx +++ b/src/pages/AboutPage.tsx @@ -1,71 +1,69 @@ import { Gamepad2, Code, Music } from "lucide-react"; -import { useState, useEffect } from "react"; import FoxCard from "@/components/FoxCard"; import MusicDisplay from "@/components/MusicDisplay"; -import { calculatePreciseAge } from "@/utils/dateUtils"; const AboutPage = () => { - // const [age, setAge] = useState(calculatePreciseAge(new Date("date"))); + // const [age, setAge] = useState(calculatePreciseAge(new Date("date"))); - // useEffect(() => { - // const interval = setInterval(() => { - // setAge(calculatePreciseAge(new Date("date"))); - // }, 50); + // useEffect(() => { + // const interval = setInterval(() => { + // setAge(calculatePreciseAge(new Date("date"))); + // }, 50); - // return () => clearInterval(interval); - // }, []); + // return () => clearInterval(interval); + // }, []); - return ( -
- -

About Me

-

- End • They/It/She • Programmer & Streamer -

- + return ( +
+ +

About Me

+

+ End • They/It/She • Programmer & Streamer +

+ -
- -
- -

Tech Interests

-
-
    -
  • Programming & Development
    • -
  • Robotics & Hardware
    • -
  • Cybersecurity
    • -
- +
+ +
+ +

Tech Interests

+
+
    +
  • Programming & Development
    • +
  • Robotics & Hardware
    • +
  • Cybersecurity
    • +
+ - -
- -

Streaming

-
-

- Find me on{" "} - - Twitch - {" "} - playing FiveM and other games! -

- + +
+ +

Streaming

+
+

+ Find me on{" "} + + Twitch + {" "} + playing FiveM and other games! +

+ - -
- -

Music

-
- - -
-
- ); + +
+ +

Music

+
+ + +
+
+ ); }; export default AboutPage; diff --git a/src/reportWebVitals.tsx b/src/reportWebVitals.tsx index fc94787..885e293 100755 --- a/src/reportWebVitals.tsx +++ b/src/reportWebVitals.tsx @@ -1,18 +1,20 @@ -const reportWebVitals = (onPerfEntry?: (metric: any) => void): void => { - if (onPerfEntry && typeof onPerfEntry === "function") { - import("web-vitals") - .then((vitals) => { - const { onCLS, onFID, onFCP, onLCP, onTTFB } = vitals; - onCLS(onPerfEntry); - onFID(onPerfEntry); - onFCP(onPerfEntry); - onLCP(onPerfEntry); - onTTFB(onPerfEntry); - }) - .catch((error) => { - console.error("Error loading web-vitals:", error); - }); - } +import type { Metric } from "web-vitals"; + +const reportWebVitals = (onPerfEntry?: (metric: Metric) => void): void => { + if (onPerfEntry && typeof onPerfEntry === "function") { + import("web-vitals") + .then((vitals) => { + const { onCLS, onFID, onFCP, onLCP, onTTFB } = vitals; + onCLS(onPerfEntry); + onFID(onPerfEntry); + onFCP(onPerfEntry); + onLCP(onPerfEntry); + onTTFB(onPerfEntry); + }) + .catch((error) => { + console.error("Error loading web-vitals:", error); + }); + } }; export default reportWebVitals;