dennii/Termix
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases 22 Wiki Activity

Improve auth page

Browse Source
This commit is contained in:
LukeGus
2025-08-27 16:07:11 -05:00
parent 0c5216933a
commit b046aedcee
4 changed files with 78 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files

80
src/ui/Homepage/Homepage.tsx
View File

@@ -72,76 +72,82 @@ export function Homepage({
return (
<div
className={`w-full min-h-svh grid place-items-center relative transition-[padding-top] duration-200 ease-linear ${
className={`w-full min-h-svh relative transition-[padding-top] duration-200 ease-linear ${
isTopbarOpen ? 'pt-[66px]' : 'pt-2'
}`}>
<div className="flex flex-row items-center justify-center gap-8 relative z-[10000]">
<HomepageAuth
setLoggedIn={setLoggedIn}
setIsAdmin={setIsAdmin}
setUsername={setUsername}
setUserId={setUserId}
loggedIn={loggedIn}
authLoading={authLoading}
dbError={dbError}
setDbError={setDbError}
onAuthSuccess={onAuthSuccess}
/>
<div className="flex flex-row items-center justify-center gap-8">
{loggedIn && (
<div className="flex flex-col items-center gap-4 w-[350px]">
{!loggedIn ? (
<div className="absolute top-[66px] left-0 w-full h-[calc(100%-66px)] flex items-center justify-center">
<HomepageAuth
setLoggedIn={setLoggedIn}
setIsAdmin={setIsAdmin}
setUsername={setUsername}
setUserId={setUserId}
loggedIn={loggedIn}
authLoading={authLoading}
dbError={dbError}
setDbError={setDbError}
onAuthSuccess={onAuthSuccess}
/>
</div>
) : (
<div className="absolute top-[66px] left-0 w-full h-[calc(100%-66px)] flex items-center justify-center">
<div className="flex flex-row items-center justify-center gap-8 relative z-[10000]">
<div className="flex flex-col items-center gap-6 w-[400px]">
<div
className="my-2 text-center bg-muted/50 border-2 border-[#303032] rounded-lg p-4 w-full">
<h3 className="text-lg font-semibold mb-2">Logged in!</h3>
<p className="text-muted-foreground">
className="text-center bg-[#18181b] border-2 border-[#303032] rounded-lg p-6 w-full shadow-lg">
<h3 className="text-xl font-bold mb-3 text-white">Logged in!</h3>
<p className="text-gray-300 leading-relaxed">
You are logged in! Use the sidebar to access all available tools. To get started,
create an SSH Host in the SSH Manager tab. Once created, you can connect to that
host using the other apps in the sidebar.
</p>
</div>
<div className="flex flex-row items-center gap-2">
<div className="flex flex-row items-center gap-3">
<Button
variant="link"
className="text-sm"
variant="outline"
size="sm"
className="text-sm border-[#303032] text-gray-300 hover:text-white hover:bg-[#18181b] transition-colors"
onClick={() => window.open('https://github.com/LukeGus/Termix', '_blank')}
>
GitHub
</Button>
<div className="w-px h-4 bg-border"></div>
<div className="w-px h-4 bg-[#303032]"></div>
<Button
variant="link"
className="text-sm"
variant="outline"
size="sm"
className="text-sm border-[#303032] text-gray-300 hover:text-white hover:bg-[#18181b] transition-colors"
onClick={() => window.open('https://github.com/LukeGus/Termix/issues/new', '_blank')}
>
Feedback
</Button>
<div className="w-px h-4 bg-border"></div>
<div className="w-px h-4 bg-[#303032]"></div>
<Button
variant="link"
className="text-sm"
variant="outline"
size="sm"
className="text-sm border-[#303032] text-gray-300 hover:text-white hover:bg-[#18181b] transition-colors"
onClick={() => window.open('https://discord.com/invite/jVQGdvHDrf', '_blank')}
>
Discord
</Button>
<div className="w-px h-4 bg-border"></div>
<div className="w-px h-4 bg-[#303032]"></div>
<Button
variant="link"
className="text-sm"
variant="outline"
size="sm"
className="text-sm border-[#303032] text-gray-300 hover:text-white hover:bg-[#18181b] transition-colors"
onClick={() => window.open('https://github.com/sponsors/LukeGus', '_blank')}
>
Donate
</Button>
</div>
</div>
)}
<HomepageUpdateLog
loggedIn={loggedIn}
/>
<HomepageUpdateLog
loggedIn={loggedIn}
/>
</div>
</div>
</div>
)}
<HomepageAlertManager
userId={userId}