mirror of
https://github.com/appwrite/console.git
synced 2026-06-06 19:27:48 +00:00
few more tables
This commit is contained in:
Harsh Mahajan
@@ -49,57 +49,59 @@
|
||||
expanded={databasesScreen && !insideSideSheet}
|
||||
slotSpacing={databasesScreen && !insideSideSheet}>
|
||||
{#if logs.total}
|
||||
<Table.Root {columns} let:root>
|
||||
<svelte:fragment slot="header" let:root>
|
||||
<Table.Header.Cell column="user" {root}>User</Table.Header.Cell>
|
||||
<Table.Header.Cell column="event" {root}>Event</Table.Header.Cell>
|
||||
<Table.Header.Cell column="location" {root}>Location</Table.Header.Cell>
|
||||
<Table.Header.Cell column="ip" {root}>IP</Table.Header.Cell>
|
||||
<Table.Header.Cell column="date" {root}>Date</Table.Header.Cell>
|
||||
</svelte:fragment>
|
||||
{#each logs.logs as log}
|
||||
<Table.Row.Base {root}>
|
||||
<Table.Cell column="user" {root}>
|
||||
<Layout.Stack direction="row" alignItems="center">
|
||||
{#if log.userEmail}
|
||||
{#if log.userName}
|
||||
<AvatarInitials size="xs" name={log.userName} />
|
||||
<Trim>{log.userName}</Trim>
|
||||
<div class="responsive-table">
|
||||
<Table.Root {columns} let:root>
|
||||
<svelte:fragment slot="header" let:root>
|
||||
<Table.Header.Cell column="user" {root}>User</Table.Header.Cell>
|
||||
<Table.Header.Cell column="event" {root}>Event</Table.Header.Cell>
|
||||
<Table.Header.Cell column="location" {root}>Location</Table.Header.Cell>
|
||||
<Table.Header.Cell column="ip" {root}>IP</Table.Header.Cell>
|
||||
<Table.Header.Cell column="date" {root}>Date</Table.Header.Cell>
|
||||
</svelte:fragment>
|
||||
{#each logs.logs as log}
|
||||
<Table.Row.Base {root}>
|
||||
<Table.Cell column="user" {root}>
|
||||
<Layout.Stack direction="row" alignItems="center">
|
||||
{#if log.userEmail}
|
||||
{#if log.userName}
|
||||
<AvatarInitials size="xs" name={log.userName} />
|
||||
<Trim>{log.userName}</Trim>
|
||||
{:else}
|
||||
<AvatarInitials size="xs" name={log.userEmail} />
|
||||
<Trim>{log.userEmail}</Trim>
|
||||
{/if}
|
||||
{:else}
|
||||
<AvatarInitials size="xs" name={log.userEmail} />
|
||||
<Trim>{log.userEmail}</Trim>
|
||||
<div class="avatar is-size-small">
|
||||
<span class="icon-anonymous" aria-hidden="true"></span>
|
||||
</div>
|
||||
<span class="text u-trim">{log.userName ?? 'Anonymous'}</span>
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
</Table.Cell>
|
||||
|
||||
<Table.Cell column="event" {root}>
|
||||
{log.event}
|
||||
</Table.Cell>
|
||||
|
||||
<Table.Cell column="location" {root}>
|
||||
{#if log.countryCode !== '--'}
|
||||
{log.countryName}
|
||||
{:else}
|
||||
<div class="avatar is-size-small">
|
||||
<span class="icon-anonymous" aria-hidden="true"></span>
|
||||
</div>
|
||||
<span class="text u-trim">{log.userName ?? 'Anonymous'}</span>
|
||||
Unknown
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
</Table.Cell>
|
||||
</Table.Cell>
|
||||
|
||||
<Table.Cell column="event" {root}>
|
||||
{log.event}
|
||||
</Table.Cell>
|
||||
<Table.Cell column="ip" {root}>
|
||||
<InteractiveText variant="copy" text={log.ip} isVisible />
|
||||
</Table.Cell>
|
||||
|
||||
<Table.Cell column="location" {root}>
|
||||
{#if log.countryCode !== '--'}
|
||||
{log.countryName}
|
||||
{:else}
|
||||
Unknown
|
||||
{/if}
|
||||
</Table.Cell>
|
||||
|
||||
<Table.Cell column="ip" {root}>
|
||||
<InteractiveText variant="copy" text={log.ip} isVisible />
|
||||
</Table.Cell>
|
||||
|
||||
<Table.Cell column="date" {root}>
|
||||
<DualTimeView time={log.time} showDatetime />
|
||||
</Table.Cell>
|
||||
</Table.Row.Base>
|
||||
{/each}
|
||||
</Table.Root>
|
||||
<Table.Cell column="date" {root}>
|
||||
<DualTimeView time={log.time} showDatetime />
|
||||
</Table.Cell>
|
||||
</Table.Row.Base>
|
||||
{/each}
|
||||
</Table.Root>
|
||||
</div>
|
||||
|
||||
<PaginationWithLimit
|
||||
{limit}
|
||||
@@ -126,3 +128,12 @@
|
||||
</Card.Base>
|
||||
{/if}
|
||||
</Container>
|
||||
|
||||
<style>
|
||||
.responsive-table {
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
scrollbar-width: thin;
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -95,70 +95,84 @@
|
||||
<Typography.Title>Sessions</Typography.Title>
|
||||
<Button secondary on:click={logoutAll}>Sign out all sessions</Button>
|
||||
</Layout.Stack>
|
||||
|
||||
<Table.Root
|
||||
let:root
|
||||
columns={[
|
||||
{ id: 'client', width: { min: 450 } },
|
||||
{ id: 'location', width: { min: 200 } },
|
||||
{ id: 'ip', width: { min: 330 } },
|
||||
{ id: 'actions', width: 100 }
|
||||
]}>
|
||||
<svelte:fragment slot="header" let:root>
|
||||
<Table.Header.Cell column="client" {root}>Client</Table.Header.Cell>
|
||||
<Table.Header.Cell column="location" {root}>Location</Table.Header.Cell>
|
||||
<Table.Header.Cell column="ip" {root}>IP</Table.Header.Cell>
|
||||
<Table.Header.Cell column="actions" {root} />
|
||||
</svelte:fragment>
|
||||
{#each data.sessions.sessions as session}
|
||||
{@const browser = getBrowser(session.clientCode)}
|
||||
<Table.Row.Base {root}>
|
||||
<Table.Cell column="client" {root}>
|
||||
<Layout.Stack direction="row" alignItems="center">
|
||||
{#if session.clientName}
|
||||
<div class="avatar is-size-small">
|
||||
{#if browser}
|
||||
<img
|
||||
height="20"
|
||||
width="20"
|
||||
src={getBrowser(session.clientCode).toString()}
|
||||
alt={session.clientName} />
|
||||
{:else}
|
||||
<Icon icon={IconGlobeAlt} size="s" />
|
||||
{/if}
|
||||
<div class="responsive-table">
|
||||
<Table.Root
|
||||
let:root
|
||||
columns={[
|
||||
{ id: 'client', width: { min: 450 } },
|
||||
{ id: 'location', width: { min: 200 } },
|
||||
{ id: 'ip', width: { min: 330 } },
|
||||
{ id: 'actions', width: 100 }
|
||||
]}>
|
||||
<svelte:fragment slot="header" let:root>
|
||||
<Table.Header.Cell column="client" {root}>Client</Table.Header.Cell>
|
||||
<Table.Header.Cell column="location" {root}>Location</Table.Header.Cell>
|
||||
<Table.Header.Cell column="ip" {root}>IP</Table.Header.Cell>
|
||||
<Table.Header.Cell column="actions" {root} />
|
||||
</svelte:fragment>
|
||||
{#each data.sessions.sessions as session}
|
||||
{@const browser = getBrowser(session.clientCode)}
|
||||
<Table.Row.Base {root}>
|
||||
<Table.Cell column="client" {root}>
|
||||
<Layout.Stack direction="row" alignItems="center">
|
||||
{#if session.clientName}
|
||||
<div class="avatar is-size-small">
|
||||
{#if browser}
|
||||
<img
|
||||
height="20"
|
||||
width="20"
|
||||
src={getBrowser(session.clientCode).toString()}
|
||||
alt={session.clientName} />
|
||||
{:else}
|
||||
<Icon icon={IconGlobeAlt} size="s" />
|
||||
{/if}
|
||||
</div>
|
||||
<Trim>
|
||||
{session.clientName}
|
||||
{session.clientVersion}
|
||||
on {session.osName}
|
||||
{session.osVersion}
|
||||
</Trim>
|
||||
{:else}
|
||||
<span class="avatar is-color-empty"></span>
|
||||
<p class="text u-trim">Unknown</p>
|
||||
{/if}
|
||||
<div class="is-only-desktop">
|
||||
<Badge variant="secondary" content={session.provider} />
|
||||
</div>
|
||||
<Trim>
|
||||
{session.clientName}
|
||||
{session.clientVersion}
|
||||
on {session.osName}
|
||||
{session.osVersion}
|
||||
</Trim>
|
||||
{#if session.current}
|
||||
<Badge
|
||||
type="success"
|
||||
variant="secondary"
|
||||
content="current session" />
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
</Table.Cell>
|
||||
<Table.Cell column="location" {root}>
|
||||
{#if session.countryCode !== '--'}
|
||||
{session.countryName}
|
||||
{:else}
|
||||
<span class="avatar is-color-empty"></span>
|
||||
<p class="text u-trim">Unknown</p>
|
||||
Unknown
|
||||
{/if}
|
||||
<div class="is-only-desktop">
|
||||
<Badge variant="secondary" content={session.provider} />
|
||||
</div>
|
||||
{#if session.current}
|
||||
<Badge type="success" variant="secondary" content="current session" />
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
</Table.Cell>
|
||||
<Table.Cell column="location" {root}>
|
||||
{#if session.countryCode !== '--'}
|
||||
{session.countryName}
|
||||
{:else}
|
||||
Unknown
|
||||
{/if}
|
||||
</Table.Cell>
|
||||
<Table.Cell column="ip" {root}>
|
||||
<InteractiveText variant="copy" text={session.ip} isVisible />
|
||||
</Table.Cell>
|
||||
<Table.Cell column="actions" {root}>
|
||||
<Button size="xs" secondary on:click={() => logout(session)}>Sign out</Button>
|
||||
</Table.Cell>
|
||||
</Table.Row.Base>
|
||||
{/each}
|
||||
</Table.Root>
|
||||
</Table.Cell>
|
||||
<Table.Cell column="ip" {root}>
|
||||
<InteractiveText variant="copy" text={session.ip} isVisible />
|
||||
</Table.Cell>
|
||||
<Table.Cell column="actions" {root}>
|
||||
<Button size="xs" secondary on:click={() => logout(session)}
|
||||
>Sign out</Button>
|
||||
</Table.Cell>
|
||||
</Table.Row.Base>
|
||||
{/each}
|
||||
</Table.Root>
|
||||
</div>
|
||||
</Container>
|
||||
|
||||
<style>
|
||||
.responsive-table {
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
scrollbar-width: thin;
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user