TheArchive/zitadel
1
0
Fork 0
mirror of https://github.com/zitadel/zitadel.git synced 2025-12-12 13:52:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

sessions typing

Browse Source
This commit is contained in:
Max Peintner
2023-05-24 23:00:55 +02:00
parent 5e19841bc1
commit 2c5821ca9a
1 changed files with 51 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

98
apps/login/app/(login)/accounts/page.tsx
View File

@@ -31,57 +31,61 @@ export default async function Page() {
<div className="flex flex-col w-full space-y-2">
{sessions ? (
sessions.map((session: any, index: number) => {
const validPassword = session.factors.password?.verifiedAt;
return (
<Link
key={"session-" + index}
href={
validPassword
? `/signedin?` +
new URLSearchParams({
loginName: session.factors.user.loginName,
})
: `/password?` +
new URLSearchParams({
loginName: session.factors.user.loginName,
})
}
className="group flex flex-row items-center bg-background-light-400 dark:bg-background-dark-400 border border-divider-light hover:shadow-lg dark:hover:bg-white/10 py-2 px-4 rounded-md transition-all"
>
<div className="pr-4">
<Avatar
size="small"
loginName={session.factors.user.loginName}
name={session.factors.user.displayName}
/>
</div>
sessions
.filter((session) => session?.factors?.user?.loginName)
.map((session, index) => {
const validPassword = session?.factors?.password?.verifiedAt;
return (
<Link
key={"session-" + index}
href={
validPassword
? `/signedin?` +
new URLSearchParams({
loginName: session.factors?.user?.loginName as string,
})
: `/password?` +
new URLSearchParams({
loginName: session.factors?.user?.loginName as string,
})
}
className="group flex flex-row items-center bg-background-light-400 dark:bg-background-dark-400 border border-divider-light hover:shadow-lg dark:hover:bg-white/10 py-2 px-4 rounded-md transition-all"
>
<div className="pr-4">
<Avatar
size="small"
loginName={session.factors?.user?.loginName as string}
name={session.factors?.user?.displayName ?? ""}
/>
</div>
<div className="flex flex-col">
<span className="">{session.factors.user.displayName}</span>
<span className="text-xs opacity-80">
{session.factors.user.loginName}
</span>
{validPassword && (
<span className="text-xs opacity-80">
{moment(new Date(validPassword)).fromNow()}
<div className="flex flex-col">
<span className="">
{session.factors?.user?.displayName}
</span>
)}
</div>
<span className="text-xs opacity-80">
{session.factors?.user?.loginName}
</span>
{validPassword && (
<span className="text-xs opacity-80">
{moment(new Date(validPassword)).fromNow()}
</span>
)}
</div>
<span className="flex-grow"></span>
<div className="relative flex flex-row items-center">
{validPassword ? (
<div className="absolute h-2 w-2 bg-green-500 rounded-full mx-2 transform right-0 group-hover:right-6 transition-all"></div>
) : (
<div className="absolute h-2 w-2 bg-red-500 rounded-full mx-2 transform right-0 group-hover:right-6 transition-all"></div>
)}
<span className="flex-grow"></span>
<div className="relative flex flex-row items-center">
{validPassword ? (
<div className="absolute h-2 w-2 bg-green-500 rounded-full mx-2 transform right-0 group-hover:right-6 transition-all"></div>
) : (
<div className="absolute h-2 w-2 bg-red-500 rounded-full mx-2 transform right-0 group-hover:right-6 transition-all"></div>
)}
<XCircleIcon className="hidden group-hover:block h-5 w-5 transition-all opacity-50 hover:opacity-100" />
</div>
</Link>
);
})
<XCircleIcon className="hidden group-hover:block h-5 w-5 transition-all opacity-50 hover:opacity-100" />
</div>
</Link>
);
})
) : (
<Alert>No Sessions available!</Alert>
)}