feat(admin): Improve admin search dropdowns - #121498
Conversation
Replace the hand-rolled debounce search with typed React Query and the core Select component. Results now use fzf ordering, region-aware organization queries, and useful user details instead of the old bare rows. Co-Authored-By: Codex <noreply@openai.com>
![sentry[bot]](https://avatars.githubusercontent.com/in/12637?s=60&v=4){kind=small}
| onChange={option => { | ||
| if (option.kind === 'query') { | ||
| onSearch?.(option.query); | ||
| } else { | ||
| onSelectResult(option.result); | ||
| } | ||
| }} |
There was a problem hiding this comment.
Bug: The onChange handler in DebounceSearch does not check for a null option before accessing option.kind, which can cause a runtime error in edge cases where react-select passes null.
Severity: LOW
Suggested Fix
Add a null check at the beginning of the onChange handler to guard against a null option. For example: onChange={option => { if (!option) return; ... }}.
Prompt for AI Agent
Review the code at the location below. A potential bug has been identified by an AI
agent. Verify if this is a real issue. If it is, propose a fix; if not, explain why it's
not valid.
Location: static/gsAdmin/components/debounceSearch.tsx#L149-L155
Potential issue: The `onChange` handler for the `DebounceSearch` component receives an
`option` argument. According to the `react-select` library's API, this `option` can be
`null` in certain edge cases, such as when the menu closes without a selection. The
current implementation accesses `option.kind` without first checking if `option` is
`null`. This will lead to a `TypeError: Cannot read properties of null (reading
'kind')`, causing a runtime error and crashing the component. While the current UI
configuration makes this less likely to be triggered by direct user action, the risk
remains due to the component's lifecycle and internal state transitions.
Also affects:
actionNodeList.tsxdataConditionNodeList.tsx
Did we get this right? 👍 / 👎 to inform future reviews.
github-actions
Bot
added
the
Scope: Frontend
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
There was a problem hiding this comment.
Cursor Bugbot has reviewed your changes and found 2 potential issues.
❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.
Reviewed by Cursor Bugbot for commit 7c3404d. Configure here.
| inputValue={inputValue} | ||
| isLoading={isLoading} | ||
| isSearchable | ||
| openMenuOnClick={false} |
There was a problem hiding this comment.
Dropdown cannot reopen after closing with text
Low Severity
Because onInputChange only reacts to input-change, the typed query stays in the field after the menu closes, but openMenuOnClick={false} means clicking or focusing the field again won't re-show the results. The user sees their query with no results and has to edit the text or press an arrow key to bring the list back.
Additional Locations (1)
Reviewed by Cursor Bugbot for commit 7c3404d. Configure here.
| } satisfies SearchOption<TResult>, | ||
| ...resultOptions, | ||
| ] | ||
| : resultOptions; |
There was a problem hiding this comment.
Empty query offers a blank search option
Low Severity
The synthetic search option is built unconditionally whenever onSearch is provided, including when normalizedInput is empty. After a user clears the field the menu stays open and shows a Search ... for "" entry that navigates to the list route with an empty query.
Reviewed by Cursor Bugbot for commit 7c3404d. Configure here.
1 participant
replaces gsAdmin's hand-rolled debounced search with Select and React Query and Select
organization search now respects the selected region and member ordering. user results show enough identity and account status to actually distinguish people.
arrow keys and enter work now
before
after