chore: task example filtering UX improvements. (#630)

huntabyte · Jan 10, 2024 · 20b0d03 · 20b0d03 · vercel · Jan 10, 2024
1 parent 92e465d
commit 20b0d03
Showing 1 changed file with 5 additions and 2 deletions.
diff --git a/apps/www/src/routes/examples/tasks/(components)/data-table-toolbar.svelte b/apps/www/src/routes/examples/tasks/(components)/data-table-toolbar.svelte
@@ -27,15 +27,17 @@
 		}>;
 	} = pluginStates.colFilter;
 
-	$: showReset = Object.values($filterValues).some((v) => v.length > 0);
+	$: showReset = Object.values({ ...$filterValues, $filterValue }).some(
+		(v) => v.length > 0
+	);
 </script>
 
 <div class="flex items-center justify-between">
 	<div class="flex flex-1 items-center space-x-2">
 		<Input
 			placeholder="Filter tasks..."
 			class="h-8 w-[150px] lg:w-[250px]"
-			type="text"
+			type="search"
 			bind:value={$filterValue}
 		/>
 
@@ -52,6 +54,7 @@
 		{#if showReset}
 			<Button
 				on:click={() => {
+					$filterValue = "";
 					$filterValues.status = [];
 					$filterValues.priority = [];
 				}}