From b8e71283a3d888d341297cdfeefa9d444020ed38 Mon Sep 17 00:00:00 2001
From: gsovereignty <gsovereignty@proton.me>
Date: Tue, 24 Sep 2024 18:18:00 +0800
Subject: [PATCH] problem: no example filters

---
 src/components/Filters.svelte | 7 +++++++
 src/views/Problems.svelte     | 3 ++-
 2 files changed, 9 insertions(+), 1 deletion(-)
 create mode 100644 src/components/Filters.svelte

diff --git a/src/components/Filters.svelte b/src/components/Filters.svelte
new file mode 100644
index 0000000..bbfe40c
--- /dev/null
+++ b/src/components/Filters.svelte
@@ -0,0 +1,7 @@
+<script lang="ts">
+	import { Badge } from '@/components/ui/badge';
+</script>
+
+<Badge variant="outline">actionable</Badge>
+<Badge variant="outline">in-progress</Badge>
+<Badge variant="outline">mine</Badge>
diff --git a/src/views/Problems.svelte b/src/views/Problems.svelte
index 1306b53..bafc331 100644
--- a/src/views/Problems.svelte
+++ b/src/views/Problems.svelte
@@ -9,6 +9,7 @@
 	import MailList from '../layouts/MailList.svelte';
 	import ProblemView from '../components/ProblemView.svelte';
 	import { Badge } from '@/components/ui/badge';
+	import Filters from '../components/Filters.svelte';
 
 	let problems: NDKEventStore<NDKEvent> | undefined;
 	onDestroy(() => {
@@ -25,7 +26,7 @@
 </script>
 
 <MailLayout>
-	<div slot="filters"><Badge variant="outline">sdf</Badge></div>
+	<div slot="filters"><Filters /></div>
 	<div slot="list">
 		<MailList items={$validProblems} bloom={false} bind:selected />
 	</div>