48 lines
1.7 KiB
Svelte
48 lines
1.7 KiB
Svelte
<script>
|
|
import { browser } from '$app/environment';
|
|
import { store } from '$lib/v2/globalStore.svelte.js';
|
|
import ListPage from '$lib/v2/snippets/ListPage.svelte';
|
|
import { Button, Separator } from 'bits-ui';
|
|
import IconPlugConnectedX from '~icons/tabler/plug-connected-x';
|
|
|
|
let { data, form } = $props();
|
|
|
|
store.pageTitle = 'My active sessions';
|
|
|
|
$effect(() => {
|
|
if (form?.success && browser) {
|
|
window.location.reload();
|
|
}
|
|
});
|
|
</script>
|
|
|
|
<ListPage>
|
|
<div class="flex flex-col gap-10 sm:mx-auto sm:w-4/5">
|
|
{#each data.sessions as session}
|
|
<div
|
|
class="flex flex-col gap-5 w-full rounded-xl sm:rounded-2xl border border-neutral-600
|
|
px-6 py-5 sm:px-10 sm:py-8 bg-neutral-950 shadow-xl text-neutral-500 text-sm text-justify"
|
|
>
|
|
<p>User-Agent: <span class="text-neutral-200 font-semibold">{session.userAgent}</span></p>
|
|
<p>IP Address: <span class="text-neutral-200 font-semibold">{session.ip}</span></p>
|
|
<Separator.Root class="bg-neutral-600 h-px w-full"></Separator.Root>
|
|
<div class="flex items-center justify-end gap-5 text-xs sm:text-sm">
|
|
<p>Don't recognize this?</p>
|
|
<form method="POST" action="?/delete">
|
|
<input type="hidden" name="id" value={session.publicId} />
|
|
<Button.Root
|
|
class="flex items-center justify-center gap-2 bg-neutral-100 text-neutral-950 rounded-full px-4 p-2
|
|
border border-white cursor-pointer transition-all ease-in-out duration-300
|
|
hover:scale-95 hover:bg-neutral-400"
|
|
>
|
|
End session
|
|
<IconPlugConnectedX />
|
|
</Button.Root>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
{/each}
|
|
<div class="h-10"></div>
|
|
</div>
|
|
</ListPage>
|