[ui] use Table on Home view
This commit is contained in:
parent
604292d56d
commit
b02b6d7feb
2 changed files with 11 additions and 41 deletions
|
@ -12,11 +12,12 @@
|
|||
import Editable from "../utils/Editable.svelte";
|
||||
import { query } from "../../lib/entity";
|
||||
import { Readable, readable } from "svelte/store";
|
||||
import { defaultEntitySort } from "../../util/sort";
|
||||
import { defaultEntitySort, entityValueSort } from "../../util/sort";
|
||||
const dispatch = createEventDispatcher();
|
||||
|
||||
export let columns: string;
|
||||
export let header = true;
|
||||
export let orderByValue = false;
|
||||
|
||||
export let entries: UpEntry[];
|
||||
export let editable = false;
|
||||
|
@ -100,7 +101,9 @@
|
|||
}
|
||||
|
||||
function sortAttributes() {
|
||||
sortedAttributes = defaultEntitySort(entries, sortKeys);
|
||||
sortedAttributes = orderByValue
|
||||
? entityValueSort(entries, sortKeys)
|
||||
: defaultEntitySort(entries, sortKeys);
|
||||
}
|
||||
|
||||
$: {
|
||||
|
|
|
@ -5,6 +5,7 @@
|
|||
import UpObject from "../components/display/UpObject.svelte";
|
||||
import UpObjectCard from "../components/display/UpObjectCard.svelte";
|
||||
import Spinner from "../components/utils/Spinner.svelte";
|
||||
import Table from "../components/widgets/Table.svelte";
|
||||
import { query } from "../lib/entity";
|
||||
import { vaultInfo } from "../util/info";
|
||||
import { updateTitle } from "../util/title";
|
||||
|
@ -19,18 +20,10 @@
|
|||
})();
|
||||
|
||||
const { result: lastVisitedQuery } = query(`(matches ? "LAST_VISITED" ? )`);
|
||||
$: lastVisited = ($lastVisitedQuery?.entries || [])
|
||||
.filter((e) => e.value.t == "Number")
|
||||
.sort((a, b) => (b.value.c as number) - (a.value.c as number))
|
||||
.map((e) => [e.entity, e.value.c as number])
|
||||
.slice(0, 25) as [string, number][];
|
||||
$: lastVisited = ($lastVisitedQuery?.entries || []).slice(0, 25);
|
||||
|
||||
const { result: latestQuery } = query(`(matches ? "ADDED" ?)`);
|
||||
$: latest = ($latestQuery?.entries || [])
|
||||
.filter((e) => e.value.t == "Number")
|
||||
.sort((a, b) => (b.value.c as number) - (a.value.c as number))
|
||||
.map((e) => [e.entity, e.value.c as number])
|
||||
.slice(0, 25) as [string, number][];
|
||||
$: latest = ($latestQuery?.entries || []).slice(0, 25);
|
||||
|
||||
updateTitle("Home");
|
||||
</script>
|
||||
|
@ -63,16 +56,7 @@
|
|||
{#if $lastVisitedQuery == undefined}
|
||||
<Spinner centered />
|
||||
{:else}
|
||||
<table>
|
||||
{#each lastVisited as [address, visited]}
|
||||
<tr>
|
||||
<td class="timestamp"
|
||||
>{formatRelative(visited * 1000, new Date())}</td
|
||||
>
|
||||
<td class="object"><UpObject link {address} /></td>
|
||||
</tr>
|
||||
{/each}
|
||||
</table>
|
||||
<Table columns="value, entity" entries={lastVisited} orderByValue />
|
||||
{/if}
|
||||
</section>
|
||||
{/if}
|
||||
|
@ -83,16 +67,7 @@
|
|||
{#if $latestQuery == undefined}
|
||||
<Spinner centered />
|
||||
{:else}
|
||||
<table>
|
||||
{#each latest as [address, added]}
|
||||
<tr>
|
||||
<td class="timestamp"
|
||||
>{formatRelative(added * 1000, new Date())}</td
|
||||
>
|
||||
<td class="object"><UpObject link {address} /></td>
|
||||
</tr>
|
||||
{/each}
|
||||
</table>
|
||||
<Table columns="value, entity" entries={latest} orderByValue />
|
||||
{/if}
|
||||
</section>
|
||||
{/if}
|
||||
|
@ -118,15 +93,7 @@
|
|||
|
||||
.latest,
|
||||
.lastVisited {
|
||||
table {
|
||||
border-spacing: 1em 0.25em;
|
||||
}
|
||||
|
||||
.timestamp {
|
||||
opacity: 0.77;
|
||||
white-space: nowrap;
|
||||
text-align: center;
|
||||
}
|
||||
margin: 1rem;
|
||||
}
|
||||
|
||||
.roots {
|
||||
|
|
Loading…
Reference in a new issue