Skip to content

feat(instantsearch): add React custom widgets, middleware, SSR (3/4)#24

Merged
NatanTechofNY merged 4 commits into
feat/instantsearch-source-of-truthfrom
feat/instantsearch-react-advanced
Jun 10, 2026
Merged

feat(instantsearch): add React custom widgets, middleware, SSR (3/4)#24
NatanTechofNY merged 4 commits into
feat/instantsearch-source-of-truthfrom
feat/instantsearch-react-advanced

Conversation

@vascobettencourt

@vascobettencourt vascobettencourt commented May 18, 2026

Copy link
Copy Markdown
Member

What does this skill do?

Adds three React library-level references that cover surfaces the Source-of-truth check on its own can't fully bridge — they involve enough nuance and trade-offs that a baked structural skeleton earns its keep.

This is part 3 of 4. Stacks on #23 (which stacks on #22). Review #22 and #23 first; this PR's diff now contains only its own changes.

What's in this PR

  • New references/react/custom-widgets.md — when widget + classNames + transformItems is enough, when to reach for useConnector / useXxx, the renderState contract, common pitfalls (stale state in handlers, re-render storms, lost A11y, duplicate connector instances). Includes a "do you actually need this?" walkthrough so the agent doesn't reach for hooks reflexively.
  • New references/react/middleware.md — middleware contract (subscribe, started, unsubscribe, onStateChange), legitimate uses (custom analytics, non-URL state sync), and what middleware should NOT do (URL sync, default refinements — both belong in routing / <Configure>).
  • New references/react/ssr.md — App Router via <InstantSearchNext> (no extra helpers needed) vs Pages Router / non-Next React via getServerState + <InstantSearchSSRProvider>. Explicit guidance against doubling up.
  • SKILL.md: adds Custom widgets, Middleware, SSR rows to the library-level references table.
  • references/react/{technology-rules,anti-patterns,glossary}.md: adds the cross-references / rule pointers that source-of-truth.md's self-contained PR feat(instantsearch): add Source-of-truth check workflow step (1/4) #22 deliberately omitted; they only make sense once these three files exist.
  • evals/evals.json: adds eval 8 (Pages Router SSR) and eval 9 (custom chip widget via useRefinementList).

Checklist

Behavioral test

Evals 8 and 9 were exercised via fresh subagents. Eval 8 (Pages Router SSR) hit 8/8: getServerState from react-instantsearch/server, <InstantSearchSSRProvider>, renderToString from react-dom/server, module-scope searchClient, routing upgraded for server-side URL resolution, no <InstantSearchNext>. Eval 9 (custom widget) hit 6/6: walked the "do you actually need this?" gates, used useRefinementList (correctly preferred over raw useConnector), called refine(item.value), added explicit ARIA, considered transformItems first.

Adds the canonical widget tree (SearchBox, Configure, Hits, Pagination,
Stats, NoResultsBoundary), the refinements catalog (RefinementList,
HierarchicalMenu, RangeInput, ToggleRefinement, CurrentRefinements,
ClearRefinements), sort via SortBy with replicas, and multi-index
guidance. The pattern reference points reviewers at types and live docs
for prop-level details rather than baking them in. Adds evals 6 and 7
covering the full results page and a searchable refinement list with
active-filter chips.

Stacks on feat/instantsearch-source-of-truth.
@sarahdayan

Copy link
Copy Markdown
Member

@vascobettencourt This PR seems to contain the work from #23, unlike what the description suggests (sibling, based off #22). Can we rebase so the review is only on those changes, or do you want to rebase onto #23 to clean the diff?

vascobettencourt added a commit that referenced this pull request May 20, 2026
Three duplications tightened, all per Sarah's review:

- features.md: collapsed five "read .d.ts" / "wire props from types"
  mentions down to a single intro reference to the Source-of-truth
  check. The intro on line 5 is the canonical pointer; the rest are
  rephrased to drop the rule restatement.
- features.md: removed "Do not combine both" from the
  Pagination-vs-InfiniteHits prose. The dedicated entry already lives
  in anti-patterns.md; the checklist's "(or InfiniteHits, not both)"
  is enough of a reminder.
- anti-patterns.md: removed the "Forgetting routing={true}" and
  "Forgetting insights={true}" rows. Both are already covered by
  PR #22's Always rules and the features checklist; the anti-patterns
  rows were the redundant copy.

Forward-references to ../custom-widgets.md and ../ssr.md (PR #24)
left in place per Sarah's "non-blocking, fine if 2 -> 3 ships in
order" note.

Co-authored-by: Cursor <cursoragent@cursor.com>
@vascobettencourt vascobettencourt force-pushed the feat/instantsearch-react-advanced branch from 2d46652 to cf25f16 Compare May 20, 2026 21:28
vascobettencourt added a commit that referenced this pull request May 20, 2026
Three duplications tightened, all per Sarah's review:

- features.md: collapsed five "read .d.ts" / "wire props from types"
  mentions down to a single intro reference to the Source-of-truth
  check. The intro on line 5 is the canonical pointer; the rest are
  rephrased to drop the rule restatement.
- features.md: removed "Do not combine both" from the
  Pagination-vs-InfiniteHits prose. The dedicated entry already lives
  in anti-patterns.md; the checklist's "(or InfiniteHits, not both)"
  is enough of a reminder.
- anti-patterns.md: removed the "Forgetting routing={true}" and
  "Forgetting insights={true}" rows. Both are already covered by
  PR #22's Always rules and the features checklist; the anti-patterns
  rows were the redundant copy.

Forward-references to ../custom-widgets.md and ../ssr.md (PR #24)
left in place per Sarah's "non-blocking, fine if 2 -> 3 ships in
order" note.
Three duplications tightened, all per Sarah's review:

- features.md: collapsed five "read .d.ts" / "wire props from types"
  mentions down to a single intro reference to the Source-of-truth
  check. The intro on line 5 is the canonical pointer; the rest are
  rephrased to drop the rule restatement.
- features.md: removed "Do not combine both" from the
  Pagination-vs-InfiniteHits prose. The dedicated entry already lives
  in anti-patterns.md; the checklist's "(or InfiniteHits, not both)"
  is enough of a reminder.
- anti-patterns.md: removed the "Forgetting routing={true}" and
  "Forgetting insights={true}" rows. Both are already covered by
  PR #22's Always rules and the features checklist; the anti-patterns
  rows were the redundant copy.

Forward-references to ../custom-widgets.md and ../ssr.md (PR #24)
left in place per Sarah's "non-blocking, fine if 2 -> 3 ships in
order" note.
vascobettencourt added a commit that referenced this pull request May 20, 2026
Three duplications tightened, all per Sarah's review:

- features.md: collapsed five "read .d.ts" / "wire props from types"
  mentions down to a single intro reference to the Source-of-truth
  check. The intro on line 5 is the canonical pointer; the rest are
  rephrased to drop the rule restatement.
- features.md: removed "Do not combine both" from the
  Pagination-vs-InfiniteHits prose. The dedicated entry already lives
  in anti-patterns.md; the checklist's "(or InfiniteHits, not both)"
  is enough of a reminder.
- anti-patterns.md: removed the "Forgetting routing={true}" and
  "Forgetting insights={true}" rows. Both are already covered by
  PR #22's Always rules and the features checklist; the anti-patterns
  rows were the redundant copy.

Forward-references to ../custom-widgets.md and ../ssr.md (PR #24)
left in place per Sarah's "non-blocking, fine if 2 -> 3 ships in
order" note.
@vascobettencourt vascobettencourt force-pushed the feat/instantsearch-react-advanced branch from cf25f16 to 267e553 Compare May 20, 2026 21:31
…nces

Adds three library-level references that close the gaps the
Source-of-truth check on its own can't fully bridge:

- custom-widgets.md: when widget + classNames suffices vs when to reach
  for useConnector / useXxx, the renderState contract, common pitfalls
  (stale state, re-render storms, lost A11y).
- middleware.md: contract (subscribe / started / unsubscribe /
  onStateChange), legitimate uses, and what middleware should NOT be
  used for (URL sync, default refinements).
- ssr.md: App Router via InstantSearchNext (no extra helpers needed)
  vs Pages Router / non-Next React via getServerState +
  InstantSearchSSRProvider, with explicit guidance against mixing them.

Adds evals 8 (Pages Router SSR) and 9 (custom chip widget via
useRefinementList).

Stacks on feat/instantsearch-source-of-truth.
@vascobettencourt vascobettencourt force-pushed the feat/instantsearch-source-of-truth branch from 8eb583d to 9b69b3d Compare May 20, 2026 21:34
@vascobettencourt vascobettencourt force-pushed the feat/instantsearch-react-advanced branch from 267e553 to 33dffde Compare May 20, 2026 21:34
@vascobettencourt vascobettencourt changed the base branch from feat/instantsearch-source-of-truth to feat/instantsearch-search-results-page May 20, 2026 21:37
@vascobettencourt

vascobettencourt commented May 20, 2026

Copy link
Copy Markdown
Member Author

@sarahdayan good catch, thank you

Base automatically changed from feat/instantsearch-search-results-page to feat/instantsearch-source-of-truth June 10, 2026 18:36
@NatanTechofNY NatanTechofNY merged commit 5431525 into feat/instantsearch-source-of-truth Jun 10, 2026
@NatanTechofNY NatanTechofNY deleted the feat/instantsearch-react-advanced branch June 10, 2026 18:37
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.

3 participants