Skip to content

[NO TICKET] Add shebangs for commands & refactor serach modal component#233

Merged
TylerAdamMartinez merged 4 commits intostagingfrom
TAM-NO-TICKET-ADD-SHEBANGS
Apr 1, 2026
Merged

[NO TICKET] Add shebangs for commands & refactor serach modal component#233
TylerAdamMartinez merged 4 commits intostagingfrom
TAM-NO-TICKET-ADD-SHEBANGS

Conversation

@TylerAdamMartinez
Copy link
Copy Markdown
Contributor

@TylerAdamMartinez TylerAdamMartinez commented Mar 31, 2026

Why

This PR addresses the following problem/context:

  • The SearchModal component had grown too large and difficult to maintain
  • Mixed concerns between UI, state management, and search logic
  • Lack of clear separation between search modes (default, commands, games, docs)
  • Limited extensibility for adding new commands or search behaviors

How

Implementation summary - the following was changed/added/removed:

  • Extracted core logic into useSearchModalState hook
    • Centralizes parsing, filtering, navigation, and state handling
  • Split UI into modular components:
    • CommandResults, GameResults, DocsResults, DefaultResults
    • RecentSearches, EmptyState
  • Implemented local docs search (docsSearch.ts)
    • Uses import.meta.glob to load markdown files
    • Parses frontmatter and content
    • Adds scoring-based relevance ranking (title > path > content)
  • Added command parsing utilities (searchModal.ts)
    • Supports !, !games, !docs, and partial matches
    • Handles filtering and grouping logic
  • Refactored SearchModal into a presentation layer using the new hook + components
  • Extracted reusable markdown rendering into MarkdownPage.
  • Updated tests:
    • Added command filtering coverage
    • Added local docs search + navigation tests
  • Improved UX:
    • Command suggestions when typing !
    • Keyboard support (Enter selects first result)
    • Disabled backend calls for command/docs modes

Notes

Any special considerations, workarounds, or follow-up work to note?

  • Docs search is fully client-side and depends on import.meta.glob
  • Markdown files must be in a bundle-accessible directory (/public/content)
  • Search scoring is heuristic-based and may need tuning as docs grow
  • useSearchModalState is now the central abstraction for search behavior
  • Command system is easily extensible via COMMANDS
  • Potential follow-ups:
    • Add fuzzy search (e.g., Fuse.js) 🙏 (NOTE: I WANT THIS SO BADLY)
    • Improve keyboard navigation (arrow keys)

@TylerAdamMartinez TylerAdamMartinez requested review from jeremyzilar and removed request for jirhiker March 31, 2026 17:43
@TylerAdamMartinez TylerAdamMartinez self-assigned this Mar 31, 2026
@TylerAdamMartinez TylerAdamMartinez added the enhancement New feature or request label Mar 31, 2026
@github-actions
Copy link
Copy Markdown

github-actions bot commented Mar 31, 2026

Preview Deployment

Preview URL: $PREVIEW_URL

Note: This preview uses the staging API endpoints and has auth disabled for testing.

TylerAdamMartinez
TylerAdamMartinez commented Mar 31, 2026
View reviewed changes
src/components/Search/CommandResults.tsx
Copy link
Copy Markdown
Contributor Author

@TylerAdamMartinez TylerAdamMartinez Mar 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Broke up the Modal Results into their respective components in the Search folder.

src/hooks/useSearchModalState.ts
Copy link
Copy Markdown
Contributor Author

@TylerAdamMartinez TylerAdamMartinez Mar 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Move the normalization, shebang, and querying logic here.

src/utils/docsSearch.ts
frontmatter: FrontMatter
}

const docModules = import.meta.glob('../../public/content/**/*.md', {
Copy link
Copy Markdown
Contributor Author

@TylerAdamMartinez TylerAdamMartinez Mar 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This 🤞 should work in staging...

Copy link
Copy Markdown
Contributor Author

@TylerAdamMartinez TylerAdamMartinez Mar 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It works on this preview: https://preview-tam-no-ticket-add-shebangs-ocotillo-95715287188.us-central1.run.app

src/utils/searchModal.ts
Copy link
Copy Markdown
Contributor Author

@TylerAdamMartinez TylerAdamMartinez Mar 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If y'all have any better suggestions for a utility filename for this, I'm all ears.

src/components/SearchModal.tsx
Copy link
Copy Markdown
Contributor Author

@TylerAdamMartinez TylerAdamMartinez Mar 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Slim and only really handles the UI view as it should.

@TylerAdamMartinez
Copy link
Copy Markdown
Contributor Author

TylerAdamMartinez commented Mar 31, 2026

Grabacion.de.pantalla.2026-03-31.a.la.s.12.49.09.mov

@jeremyzilar any thoughts?

@github-actions
Copy link
Copy Markdown

github-actions bot commented Mar 31, 2026

Preview Deployment

Preview URL: $PREVIEW_URL

Note: This preview uses the staging API endpoints and has auth disabled for testing.

@jirhiker
Copy link
Copy Markdown
Member

jirhiker commented Mar 31, 2026

search for docs is a super nice addition. The games were supposed to be more secretive but I do like the current behavior 👏

@TylerAdamMartinez TylerAdamMartinez merged commit b32c8ff into staging Apr 1, 2026
2 of 4 checks passed
@TylerAdamMartinez TylerAdamMartinez deleted the TAM-NO-TICKET-ADD-SHEBANGS branch April 1, 2026 04:42
@github-actions
Copy link
Copy Markdown

github-actions bot commented Apr 1, 2026

Preview Deployment

Preview URL: $PREVIEW_URL

Note: This preview uses the staging API endpoints and has auth disabled for testing.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@jirhiker jirhiker jirhiker approved these changes

@jeremyzilar jeremyzilar Awaiting requested review from jeremyzilar

Assignees

@TylerAdamMartinez TylerAdamMartinez

Labels

enhancement New feature or request

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

2 participants

@TylerAdamMartinez @jirhiker