AeThex-Corporation/aethex-forge
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

completionId: cgen-73436182f1f24a2ea006514b70d0f8f8

Browse source 
cgen-73436182f1f24a2ea006514b70d0f8f8
This commit is contained in:
Builder.io 2025-11-06 19:40:08 +00:00
parent 0e2b5c7f56
commit d89067bb67
1 changed files with 17 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

33
client/components/PageTransition.tsx
View file

@ -1,33 +1,34 @@
import { useEffect, useState } from "react";
import { useLocation } from "react-router-dom";
import LoadingScreen from "./LoadingScreen";
interface PageTransitionProps {
children: React.ReactNode;
}
const getArmGlowColor = (pathname: string): string => {
const getArmMessage = (pathname: string): string => {
if (pathname.includes("/labs") || pathname.includes("/research")) {
return "rgba(251, 191, 36, 0.15)";
return "Initializing Research Module...";
}
if (pathname.includes("/game-development")) {
return "rgba(34, 197, 94, 0.15)";
return "Booting GameForge Engine...";
}
if (pathname.includes("/consulting")) {
return "rgba(59, 130, 246, 0.15)";
return "Engaging Corp Systems...";
}
if (pathname.includes("/community")) {
return "rgba(239, 68, 68, 0.15)";
return "Connecting Foundation Network...";
}
if (pathname.includes("/dev-link")) {
return "rgba(6, 182, 212, 0.15)";
return "Loading Dev-Link Platform...";
}
return "rgba(255, 255, 255, 0)";
return "Initializing AeThex OS...";
};
export default function PageTransition({ children }: PageTransitionProps) {
const [visible, setVisible] = useState(false);
const location = useLocation();
const glowColor = getArmGlowColor(location.pathname);
const message = getArmMessage(location.pathname);
useEffect(() => {
setVisible(false);
@ -36,13 +37,13 @@ export default function PageTransition({ children }: PageTransitionProps) {
}, [location.pathname]);
return (
<div
className={`transition-opacity duration-300 ease-out transform-gpu will-change-[opacity] ${visible ? "opacity-100" : "opacity-0"}`}
style={{
boxShadow: visible ? `inset 0 0 80px ${glowColor}` : "none",
}}
>
{children}
</div>
<>
{!visible && <LoadingScreen message={message} variant="overlay" />}
<div
className={`transition-opacity duration-300 ease-out transform-gpu will-change-[opacity] ${visible ? "opacity-100" : "opacity-0"}`}
>
{children}
</div>
</>
);
}