fix: input defocus on market and transactions page

This commit is contained in:
Face 2025-05-31 13:55:56 +03:00
parent bb7062987b
commit 0e68eb8c42
2 changed files with 27 additions and 5 deletions

View file

@ -135,10 +135,19 @@
function performSearch() { function performSearch() {
currentPage = 1; currentPage = 1;
updateURL();
fetchMarketData(); fetchMarketData();
} }
function updateSearchUrl() {
updateURL();
}
function handleSearchKeydown(event: KeyboardEvent) {
if (event.key === 'Enter') {
updateSearchUrl();
}
}
$effect(() => { $effect(() => {
if (searchQuery !== previousSearchQueryForEffect) { if (searchQuery !== previousSearchQueryForEffect) {
debouncedSearch(); debouncedSearch();
@ -253,6 +262,8 @@
bind:value={searchQuery} bind:value={searchQuery}
placeholder="Search coins by name or symbol..." placeholder="Search coins by name or symbol..."
class="pl-10 pr-4" class="pl-10 pr-4"
onblur={updateSearchUrl}
onkeydown={handleSearchKeydown}
/> />
</div> </div>
@ -434,8 +445,8 @@
<div class="flex items-center gap-3"> <div class="flex items-center gap-3">
<CoinIcon icon={coin.icon} symbol={coin.symbol} size={8} /> <CoinIcon icon={coin.icon} symbol={coin.symbol} size={8} />
<div> <div>
<h3 class="text-lg font-semibold leading-tight truncate">{coin.name}</h3> <h3 class="truncate text-lg font-semibold leading-tight">{coin.name}</h3>
<p class="text-muted-foreground text-sm truncate">*{coin.symbol}</p> <p class="text-muted-foreground truncate text-sm">*{coin.symbol}</p>
</div> </div>
</div> </div>
<div class="text-right"> <div class="text-right">

View file

@ -122,10 +122,19 @@
function performSearch() { function performSearch() {
currentPage = 1; currentPage = 1;
updateURL();
fetchTransactions(); fetchTransactions();
} }
function updateSearchUrl() {
updateURL();
}
function handleSearchKeydown(event: KeyboardEvent) {
if (event.key === 'Enter') {
updateSearchUrl();
}
}
$effect(() => { $effect(() => {
if (searchQuery !== previousSearchQueryForEffect) { if (searchQuery !== previousSearchQueryForEffect) {
debouncedSearch(); debouncedSearch();
@ -271,6 +280,8 @@
bind:value={searchQuery} bind:value={searchQuery}
placeholder="Search by coin name or symbol..." placeholder="Search by coin name or symbol..."
class="pl-10 pr-4" class="pl-10 pr-4"
onblur={updateSearchUrl}
onkeydown={handleSearchKeydown}
/> />
</div> </div>