⚡ Bolt: Add client-side caching to domain search

.jules/palette.md

@@ -1,3 +1,4 @@
 ## 2024-10-24 - Accessible Icon Props and Loading Button State
+
 **Learning:** Svelte wrapper components (like `Icon.svelte`) must spread `$$restProps` to allow passing accessibility attributes (e.g., `aria-label`) from parent components. Without this, icons remain inaccessible to screen readers. Also, persistent "Success" states on buttons can be confusing; auto-resetting them after a timeout improves clarity.
 **Action:** Always include `{...$$restProps}` in wrapper components and implement auto-reset logic for temporary success states in interactive elements.

dev.log

@@ -0,0 +1,97 @@
+yarn run v1.22.22
+$ vite dev
+
+  VITE v5.4.9  ready in 2589 ms
+
+  ➜  Local:   http://localhost:5173/
+  ➜  Network: use --host to expose
+9:05:34 PM [vite-plugin-svelte] /app/src/components/Icon.svelte:31:1 No scopable elements found in template. If you're using global styles in the style tag, you should move it into an external stylesheet file and import it in JS. See https://github.com/sveltejs/vite-plugin-svelte/blob/main/docs/faq.md#where-should-i-put-my-global-styles.
+DEPRECATION WARNING: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0.
+
+More info: https://sass-lang.com/d/legacy-js-api
+
+DEPRECATION WARNING: Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.
+
+More info and automated migrator: https://sass-lang.com/d/import
+
+  ╷
+1 │ @import './theme-overrides.scss';
+  │         ^^^^^^^^^^^^^^^^^^^^^^^^
+  ╵
+    src/styles/app.scss 1:9  root stylesheet
+
+DEPRECATION WARNING: Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.
+
+More info and automated migrator: https://sass-lang.com/d/import
+
+  ╷
+2 │ @import './mixins.scss';
+  │         ^^^^^^^^^^^^^^^
+  ╵
+    src/styles/app.scss 2:9  root stylesheet
+
+DEPRECATION WARNING: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0.
+
+More info: https://sass-lang.com/d/legacy-js-api
+
+9:05:35 PM [vite-plugin-svelte] /app/node_modules/@smui/snackbar/dist/Snackbar.svelte:16:2 A11y: Non-interactive element <div> should not be assigned mouse or keyboard event listeners.
+9:05:35 PM [vite-plugin-svelte] /app/node_modules/@smui/snackbar/dist/Snackbar.svelte:1:0 A11y: Non-interactive element <aside> should not be assigned mouse or keyboard event listeners.
+9:05:35 PM [vite-plugin-svelte] /app/node_modules/@smui/menu-surface/dist/MenuSurface.svelte:3:0 A11y: Non-interactive element <div> should not be assigned mouse or keyboard event listeners.
+DEPRECATION WARNING: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0.
+
+More info: https://sass-lang.com/d/legacy-js-api
+
+DEPRECATION WARNING: Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.
+
+More info and automated migrator: https://sass-lang.com/d/import
+
+  ╷
+1 │ @import './theme-overrides.scss';
+  │         ^^^^^^^^^^^^^^^^^^^^^^^^
+  ╵
+    src/styles/app.scss 1:9  root stylesheet
+
+DEPRECATION WARNING: Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.
+
+More info and automated migrator: https://sass-lang.com/d/import
+
+  ╷
+2 │ @import './mixins.scss';
+  │         ^^^^^^^^^^^^^^^
+  ╵
+    src/styles/app.scss 2:9  root stylesheet
+
+DEPRECATION WARNING: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0.
+
+More info: https://sass-lang.com/d/legacy-js-api
+
+9:05:40 PM [vite-plugin-svelte] /app/src/components/Icon.svelte:31:1 No scopable elements found in template. If you're using global styles in the style tag, you should move it into an external stylesheet file and import it in JS. See https://github.com/sveltejs/vite-plugin-svelte/blob/main/docs/faq.md#where-should-i-put-my-global-styles.
+DEPRECATION WARNING: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0.
+
+More info: https://sass-lang.com/d/legacy-js-api
+
+DEPRECATION WARNING: Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.
+
+More info and automated migrator: https://sass-lang.com/d/import
+
+  ╷
+1 │ @import './theme-overrides.scss';
+  │         ^^^^^^^^^^^^^^^^^^^^^^^^
+  ╵
+    src/styles/app.scss 1:9  root stylesheet
+
+DEPRECATION WARNING: Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.
+
+More info and automated migrator: https://sass-lang.com/d/import
+
+  ╷
+2 │ @import './mixins.scss';
+  │         ^^^^^^^^^^^^^^^
+  ╵
+    src/styles/app.scss 2:9  root stylesheet
+
+DEPRECATION WARNING: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0.
+
+More info: https://sass-lang.com/d/legacy-js-api
+
+Done in 54.29s.

src/routes/DomainSearch.svelte

@@ -17,6 +17,8 @@
 	let isLoading: boolean = false;
 	let debounceTimer: ReturnType<typeof setTimeout>;
 	let requestId = 0;
+	const searchCache = new Map<string, { result: DomainModel | null; timestamp: number }>();
+	const CACHE_TTL = 60_000;
 
 	$: errors = invalid ? validator.getErrors() : [];
 	$: invalid = domainName !== '' && !validator.validate(domainName, { raiseError: false });
@@ -40,13 +42,24 @@
 			return goto(url);
 		}
 
+		const normalizedName = domainName.toLocaleLowerCase();
+		const cached = searchCache.get(normalizedName);
+		if (cached && Date.now() - cached.timestamp < CACHE_TTL) {
+			requestId++;
+			domain = cached.result;
+			nameSearched = normalizedName;
+			isLoading = false;
+			return;
+		}
+
 		const currentRequestId = ++requestId;
-		nameSearched = domainName.toLocaleLowerCase();
+		nameSearched = normalizedName;
 		isLoading = true;
 
 		const result = await $metaNamesSdk.domainRepository.find(domainName);
 
 		if (currentRequestId === requestId) {
+			searchCache.set(normalizedName, { result, timestamp: Date.now() });
 			domain = result;
 			isLoading = false;
 		}

verify_cache.py

@@ -0,0 +1,56 @@
+from playwright.sync_api import sync_playwright
+
+def run():
+    with sync_playwright() as p:
+        browser = p.chromium.launch()
+        page = browser.new_page()
+
+        blockchain_requests = []
+        def handle_request(request):
+            if "partisiablockchain.com" in request.url:
+                print(f"BLOCKCHAIN REQUEST: {request.url}")
+                blockchain_requests.append(request.url)
+
+        page.on("request", handle_request)
+
+        print("Navigating to home page...")
+        page.goto("http://localhost:5173/")
+        page.wait_for_load_state("networkidle")
+
+        input_selector = "input[type='text']"
+        page.wait_for_selector(input_selector)
+
+        print("Typing 'bolt'...")
+        page.fill(input_selector, "bolt")
+
+        # Wait for debounce + network using Playwright method
+        page.wait_for_timeout(8000)
+
+        count_1 = len(blockchain_requests)
+        print(f"Blockchain requests after 1st type: {count_1}")
+
+        print("Clearing input...")
+        page.fill(input_selector, "")
+        page.wait_for_timeout(1000)
+
+        print("Typing 'bolt' again...")
+        page.fill(input_selector, "bolt")
+
+        # Wait for potential new requests
+        page.wait_for_timeout(5000)
+
+        count_2 = len(blockchain_requests)
+        print(f"Blockchain requests after 2nd type: {count_2}")
+
+        if count_1 > 0 and count_2 == count_1:
+             print("SUCCESS: Caching works! No new requests.")
+        elif count_1 == 0:
+             print("WARNING: No requests at all.")
+        else:
+             print(f"FAILURE: New requests detected. ({count_2 - count_1} new)")
+
+        page.screenshot(path="verification_success.png")
+        browser.close()
+
+if __name__ == "__main__":
+    run()