From b37e4e604f54d61612325f7fd8857d8b82ed7f16 Mon Sep 17 00:00:00 2001
From: "google-labs-jules[bot]"
<161369871+google-labs-jules[bot]@users.noreply.github.com>
Date: Wed, 24 Jun 2026 19:55:23 +0000
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20Palette:=20[UX=20improvement]=20?=
=?UTF-8?q?Improve=20search=20field=20UX=20and=20filter=20logic=20on=20pro?=
=?UTF-8?q?file=20page?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
Co-authored-by: yeboster <23556525+yeboster@users.noreply.github.com>
---
.Jules/palette.md | 3 +++
src/routes/profile/+page.svelte | 16 ++++++++++------
2 files changed, 13 insertions(+), 6 deletions(-)
diff --git a/.Jules/palette.md b/.Jules/palette.md
index d6d129bc..a5d2a04d 100644
--- a/.Jules/palette.md
+++ b/.Jules/palette.md
@@ -2,3 +2,6 @@
**Learning:** Async buttons that handle errors often fail to reset their error state on subsequent attempts. This leads to a confusing UX where a successful retry still displays the error icon, making the user believe the action failed again.
**Action:** Always ensure that error flags (e.g., `hasError`) are reset at the _start_ of the async operation, not just set in the `catch` block.
+## 2024-10-25 - Conditionally Rendered Trailing Icons in Textfields
+**Learning:** Conditionally rendering just the icon inside a trailing icon slot still leaves the trailing icon button focusable and taking up space when empty.
+**Action:** Ensure the entire trailing icon fragment/element is conditionally rendered and the `withTrailingIcon` property is bound to the same condition.
diff --git a/src/routes/profile/+page.svelte b/src/routes/profile/+page.svelte
index 7f290736..eedb8406 100644
--- a/src/routes/profile/+page.svelte
+++ b/src/routes/profile/+page.svelte
@@ -17,6 +17,8 @@
$: if (search !== '') {
domainsFiltered = domains.filter((domain) => isFuzzyMatch(domain.name, search));
+ } else {
+ domainsFiltered = domains;
}
walletAddress.subscribe(async (address) => {
@@ -55,14 +57,16 @@
label="Search"
bind:value={search}
variant="outlined"
- withTrailingIcon
+ withTrailingIcon={search !== ''}
>
-
-
-
-
-
+ {#if search !== ''}
+
+
+
+
+
+ {/if}