Skip to content

feat: marketplace incremental search with debounced live results#210

Merged
ryota-murakami merged 4 commits into
mainfrom
feat/marketplace-incremental-search
Jun 13, 2026
Merged

feat: marketplace incremental search with debounced live results#210
ryota-murakami merged 4 commits into
mainfrom
feat/marketplace-incremental-search

Conversation

@ryota-murakami

@ryota-murakami ryota-murakami commented Jun 13, 2026

Copy link
Copy Markdown
Contributor

What

Button-less incremental search for the Marketplace tab. Each keystroke fires a debounced skills find; results stream into the panel with no submit button.

Changes

  • useDebouncedCallback hook ({ run, cancel }) — debounces the callback, fired from onChange, per the repo's no-effect lint rules
  • MarketplaceSearch — incremental search; Search↔Loader2 icon morph; clearing the box returns to the leaderboard
  • marketplaceSlice — latest-wins guard drops out-of-order concurrent CLI responses; clearSearchResults now resets both status and error so a failed query's banner can't outlive the box
  • SkillsMarketplace — no-flash refine (keeps prior results visible while re-searching)
  • SEARCH_DEBOUNCE_MS = 300ms

Tests

  • slice: latest-wins (out-of-order resolve, stale failure), clear-mid-search, stranded-error-banner regression
  • debounce primitive: final-call-only burst, cancel drops pending
  • composed browser test: single search after a burst, clear→leaderboard, cancel-on-clear
  • pnpm validate green (lint / 1421 tests / typecheck / dead-code)

Also folds in two small doc commits from the same session (CLAUDE.md /ship framing, DESIGN.md empty-state + form-chrome rules).

Note: no version bump — releases are owned by /electron-release.

🤖 Generated with Claude Code

Summary by CodeRabbit

リリースノート

  • New Features

    • マーケットプレイス検索がリアルタイム検索に対応しました。検索ボタンやEnterキーを押さずに、入力中に自動的に検索結果が更新されるようになります。
  • Bug Fixes

    • 検索中のスピナー表示と検索結果の状態管理を改善し、意図しない重複表示を防ぎました。
  • Documentation

    • 検索入力フィールドのUI設計指針を追加し、空状態の表示ルールを明確化しました。

ryota-murakami and others added 4 commits June 14, 2026 00:13
The '/ship is for code commits/PRs only' phrase implied every main commit must route through /ship. Drop it so per-fix atomic commits can land directly; the /electron-release version-bump ownership rule stays intact.
…ance

Wrap-up of the /design-review audit of the marketplace search surface. Rule B (Empty States) codifies why a zero-result search stays one quiet line — an expected miss is not a failure — while icon+heading is reserved for real errors. Rule A (Inputs) plus a Polish Backlog entry log the native type=search blue × as an accepted low-priority, palette-matched-chrome item rather than a fix-on-sight violation.
Button-less search that fires a debounced `skills find` on each keystroke.

- useDebouncedCallback hook ({run, cancel}) — debounce the callback, not the
  value, per the repo's no-effect lint rules
- MarketplaceSearch: incremental search wired through onChange; Search<->Loader2
  icon morph; clears back to the leaderboard on empty
- marketplaceSlice: latest-wins guard drops out-of-order CLI responses;
  clearSearchResults resets both status and error so a failed query's banner
  cannot outlive the box
- SkillsMarketplace: no-flash refine (keeps prior results while re-searching)
- SEARCH_DEBOUNCE_MS constant (300ms)
- Tests: slice latest-wins/clear paths, debounce primitive, composed search

Co-Authored-By: Claude <noreply@anthropic.com>
@vercel

vercel Bot commented Jun 13, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
skills-desktop Ready Ready Preview, Comment Jun 13, 2026 4:22pm

Request Review

@coderabbitai

coderabbitai Bot commented Jun 13, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: ASSERTIVE

Plan: Pro Plus

Run ID: 72560deb-8301-485c-9dc7-9e8dd939dcde

📥 Commits

Reviewing files that changed from the base of the PR and between c4ba65c and 2aa8d7f.

📒 Files selected for processing (10)
  • CLAUDE.md
  • DESIGN.md
  • src/renderer/src/components/marketplace/MarketplaceSearch.browser.test.tsx
  • src/renderer/src/components/marketplace/MarketplaceSearch.tsx
  • src/renderer/src/components/marketplace/SkillsMarketplace.tsx
  • src/renderer/src/hooks/useDebouncedCallback.browser.test.tsx
  • src/renderer/src/hooks/useDebouncedCallback.ts
  • src/renderer/src/redux/slices/marketplaceSlice.test.ts
  • src/renderer/src/redux/slices/marketplaceSlice.ts
  • src/shared/constants.ts

Walkthrough

マーケットプレイス検索をボタン/Enter駆動から、入力変更のたびにデバウンス済みのリモート検索を自動実行する方式へ移行。新フックuseDebouncedCallbackでタイマー制御し、Redux側では並行検索の競合を「最新クエリのみ採用」で防止します。テストと設計ドキュメントを整備。

Changes

インクリメンタル検索のデバウンス化

Layer / File(s) Summary
デバウンス基盤
src/shared/constants.ts, src/renderer/src/hooks/useDebouncedCallback.ts, src/renderer/src/hooks/useDebouncedCallback.browser.test.tsx
useDebouncedCallbackフックを追加し、複数回のrun()呼び出しを300ms静穏期間でまとめて最後の引数1回実行。cancel()で予約破棄、アンマウント時も自動破棄。burst・cancel・遅延テストで検証。
マーケットプレイス検索UI
src/renderer/src/components/marketplace/MarketplaceSearch.tsx, src/renderer/src/components/marketplace/MarketplaceSearch.browser.test.tsx
入力onChange時にデバウンスしてsetMarketplaceSearchQuerysearchSkillsを同時ディスパッチ。ボタン/Enter処理を削除。左アイコンを検索中はスピナー表示。Reduxモック含むブラウザテストで、入力バースト→最終クエリのみ検索、クリア→状態リセット、キャンセル→検索なしを検証。
Redux状態管理と競合対策
src/renderer/src/redux/slices/marketplaceSlice.ts, src/renderer/src/redux/slices/marketplaceSlice.test.ts
clearSearchResultsはstatus/errorもリセット。searchSkills.fulfilled/.rejectedaction.meta.arg vs state.searchQuery比較を追加し、古いクエリの結果/エラーが最新状態を上書きしないようガード。並行検索・遅延レスポンス・クリア中の状態遷移を複数テストケースで検証。
UI表示条件調整
src/renderer/src/components/marketplace/SkillsMarketplace.tsx
検索中スピナー表示をisSearching && searchResults.length === 0に限定。再検索中に既存結果がUIに残るように。
設計・ドキュメント更新
DESIGN.md, CLAUDE.md
type="search"のネイティブクリア操作を--muted-foregroundパレットで統一するUI方針、Empty States(想定内は静か、致命的失敗は厚み)の見分けルール、検索入力への共有ルール適用を記載。リリースノート/ship制約を更新。

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed タイトルはマーケットプレイス検索のデバウンス付きインクリメンタル検索実装という主要変更を明確に要約し、変更セット全体と一致している。
Docstring Coverage ✅ Passed Docstring coverage is 100.00% which is sufficient. The required threshold is 80.00%.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch feat/marketplace-incremental-search

Comment @coderabbitai help to get the list of available commands and usage tips.

@codecov-commenter

Copy link
Copy Markdown

Codecov Report

❌ Patch coverage is 93.10345% with 2 lines in your changes missing coverage. Please review.
✅ Project coverage is 67.15%. Comparing base (c4ba65c) to head (2aa8d7f).

Files with missing lines Patch % Lines
...r/src/components/marketplace/MarketplaceSearch.tsx 90.00% 0 Missing and 1 partial ⚠️
...r/src/components/marketplace/SkillsMarketplace.tsx 0.00% 1 Missing ⚠️
Additional details and impacted files
@@            Coverage Diff             @@
##             main     #210      +/-   ##
==========================================
+ Coverage   66.75%   67.15%   +0.39%     
==========================================
  Files         198      199       +1     
  Lines        6146     6165      +19     
  Branches     1388     1390       +2     
==========================================
+ Hits         4103     4140      +37     
+ Misses       1623     1603      -20     
- Partials      420      422       +2     
Flag Coverage Δ
unittests 67.15% <93.10%> (+0.39%) ⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@ryota-murakami ryota-murakami merged commit 6ebb865 into main Jun 13, 2026
11 checks passed
@ryota-murakami ryota-murakami deleted the feat/marketplace-incremental-search branch June 13, 2026 16:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants