[ui] exact hits in search
parent
1cb5ab45d0
commit
bcb73ec439
|
@ -6,7 +6,6 @@
|
||||||
import Spinner from "../components/utils/Spinner.svelte";
|
import Spinner from "../components/utils/Spinner.svelte";
|
||||||
import UpEntryDisplay from "../components/display/UpEntry.svelte";
|
import UpEntryDisplay from "../components/display/UpEntry.svelte";
|
||||||
import UpObjectDisplay from "../components/display/UpObject.svelte";
|
import UpObjectDisplay from "../components/display/UpObject.svelte";
|
||||||
import { useResolve } from "svelte-navigator";
|
|
||||||
import UpObjectCard from "../components/display/UpObjectCard.svelte";
|
import UpObjectCard from "../components/display/UpObjectCard.svelte";
|
||||||
export let query: string;
|
export let query: string;
|
||||||
|
|
||||||
|
@ -29,6 +28,7 @@
|
||||||
);
|
);
|
||||||
|
|
||||||
async function getObjects(entries: UpEntry[]): Promise<string[]> {
|
async function getObjects(entries: UpEntry[]): Promise<string[]> {
|
||||||
|
exactHits.length = 0;
|
||||||
const labelled = entries
|
const labelled = entries
|
||||||
.filter((e) => e.attribute == "LBL")
|
.filter((e) => e.attribute == "LBL")
|
||||||
.map((e) => e.entity);
|
.map((e) => e.entity);
|
||||||
|
@ -40,9 +40,20 @@
|
||||||
});
|
});
|
||||||
return labelled.concat(await Promise.all(aliased));
|
return labelled.concat(await Promise.all(aliased));
|
||||||
}
|
}
|
||||||
$: objects = getObjects($result?.entries || []);
|
|
||||||
|
|
||||||
$: exact = [];
|
$: objects = getObjects($result?.entries || []);
|
||||||
|
let exactHits = [];
|
||||||
|
|
||||||
|
function onResolved(address: string, ids: string[]) {
|
||||||
|
console.log({ address, ids });
|
||||||
|
|
||||||
|
if (ids.some((id) => id.toLowerCase() === query.toLowerCase())) {
|
||||||
|
if (!exactHits.includes(address)) {
|
||||||
|
exactHits.push(address);
|
||||||
|
exactHits = exactHits;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
|
@ -50,10 +61,17 @@
|
||||||
{#if $result}
|
{#if $result}
|
||||||
<section class="exact">
|
<section class="exact">
|
||||||
<h2>Exact</h2>
|
<h2>Exact</h2>
|
||||||
{#if exact.length}
|
{#if exactHits.length}
|
||||||
exakt
|
<ul>
|
||||||
|
{#each exactHits as address}
|
||||||
|
<li>
|
||||||
|
<UpObjectCard {address} --width="100%" --height="100%" />
|
||||||
|
</li>
|
||||||
|
{/each}
|
||||||
|
</ul>
|
||||||
{:else}
|
{:else}
|
||||||
Create?
|
<div class="create">Create?</div>
|
||||||
|
<div class="create" />
|
||||||
{/if}
|
{/if}
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
@ -65,7 +83,10 @@
|
||||||
<ul>
|
<ul>
|
||||||
{#each objects as address}
|
{#each objects as address}
|
||||||
<li>
|
<li>
|
||||||
<UpObjectCard {address} --width="100%" --height="100%" />
|
<UpObjectDisplay
|
||||||
|
{address}
|
||||||
|
on:resolved={(ids) => onResolved(address, ids.detail)}
|
||||||
|
/>
|
||||||
</li>
|
</li>
|
||||||
{/each}
|
{/each}
|
||||||
</ul>
|
</ul>
|
||||||
|
@ -107,12 +128,12 @@
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.objects {
|
.exact {
|
||||||
ul {
|
ul {
|
||||||
display: grid;
|
display: flex;
|
||||||
grid-template-columns: repeat(4, 1fr);
|
|
||||||
gap: 1rem;
|
gap: 1rem;
|
||||||
justify-items: center;
|
justify-content: center;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
|
||||||
margin: 0 1rem;
|
margin: 0 1rem;
|
||||||
}
|
}
|
||||||
|
@ -121,6 +142,17 @@
|
||||||
width: 14rem;
|
width: 14rem;
|
||||||
height: 8rem;
|
height: 8rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.create {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.objects {
|
||||||
|
li {
|
||||||
|
margin: 0.5em auto;
|
||||||
|
max-width: 66em;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.raw {
|
.raw {
|
||||||
|
|
Loading…
Reference in New Issue