forgejo-notifications/src/routes/Search.svelte
2023-09-19 19:58:46 +05:30

75 lines
1.3 KiB
Svelte

<script>
import { user, api, notification, organisations, index } from "./store.js";
let index_val;
index.subscribe((value) => {
index_val = value;
});
let search = "";
let results = [];
const findDocuments = () => {
let trimmed = search.trim();
results = index_val.search(trimmed);
if (results.length > 0) {
enableClearResults = true;
}
};
let enableClearResults = false;
const clearResults = () => {
$: results = [];
console.log("cleared");
enableClearResults = false;
};
</script>
<input
type="search"
id="search"
placeholder="Search"
bind:value={search}
on:keydown={findDocuments}
/>
{#if enableClearResults}
<button on:click={clearResults}>Clear</button>
{/if}
<ol>
<h2>Search Results</h2>
{#each results as r}
<a href={r.id}>
<li>
<p>{r.content}</p>
{r.id}
<div>
{#each r.itemType as i}
<span class="type">{i}</span>
{/each}
</div>
</li></a
>
{/each}
</ol>
<style>
.type {
background-color: grey;
padding: 2px;
margin: 1px;
}
a {
display: block;
text-decoration: none !important;
color: black !important;
border-bottom: 1px solid grey;
}
a:hover {
background-color: lightgrey;
}
</style>