Skip to content

Replace Chosen.js with TomSelect for member lookup#2564

Closed
mroderick wants to merge 3 commits intocodebar:masterfrom
mroderick:feature/tom-select-member-search-final
Closed

Replace Chosen.js with TomSelect for member lookup#2564
mroderick wants to merge 3 commits intocodebar:masterfrom
mroderick:feature/tom-select-member-search-final

Conversation

@mroderick
Copy link
Copy Markdown
Collaborator

Why

Chosen.js is unmaintained (last release 2014) and doesn't support remote data sources. Loading 28,000 members into a dropdown is impractical and causes performance issues.

TomSelect is actively maintained and supports remote search out of the box.

What Changed

  • Added /admin/members/search endpoint for remote member lookup (searches by name/email, min 3 chars, max 50 results)
  • Integrated TomSelect loaded from CDN (avoided SassC incompatibility with modern CSS)
  • Updated member lookup dropdown to use remote search with 300ms debounce

How to Verify

  1. Start the server locally: bundle exec rails server
  2. Make yourself an admin: bundle exec rails c then Member.first.add_role(:admin)
  3. Visit http://localhost:3000/admin/members
  4. In the member lookup dropdown, try these searches:
    • jane - returns members with Jane in their name
    • @example.com - returns members with example.com emails
    • Type at least 3 characters to trigger search

Suggested Searches (based on dev database)

Try searching for common patterns:

  • First names: jane, john, mary
  • Email domains: @example.com
  • Partial names: robe for Robertson

All tests passing (6 controller + 2 feature).

- Add search action to Admin::MembersController
- Search by name or email with ILIKE query
- Return JSON with id, name, surname, email, full_name
- Limit results to 50
- Require minimum 3 characters for search
- Remove @members = Member.all from index (loaded dynamically)
- Add TomSelect to admin members index page (loaded from CDN)
- Search triggers after 3+ characters with 300ms debounce
- Display member name and email in dropdown options
- Update 'View Profile' link on member selection
- Initialize TomSelect before Chosen to avoid conflicts
- Exclude member_lookup_id from Chosen initialization
@mroderick
Copy link
Copy Markdown
Collaborator Author

Closing in favor of #2562

@mroderick mroderick closed this Apr 11, 2026
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.

1 participant