Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feat: Chat Search #16

Open
wants to merge 4 commits into
base: master
Choose a base branch
from

Conversation

UrbinCedric
Copy link

@UrbinCedric UrbinCedric commented Oct 25, 2023

Summary:

Description:

  • Implement search inside the Chat component using https://www.fusejs.io/
  • Ensure that the Search box is styled according to the existing color style
  • Search box should be triggered by CMD/CTRL + F, which means, you want to listen for the combination of these key presses
  • Search should be spawned / shown as a little overlay either horizontally and vertically centered, or somewhere in the bottom
  • When the search input is empty, show regular messages, otherwise, show the results.
  • If no results, ensure that a nice looking message is shown in the message list indicating that. You can either render it in the message list, or before the message list, as a separate node

! I don't know if we should update the results when a new message is received that matches the search... This is something we could implement if it is needed.

@UrbinCedric UrbinCedric requested a review from agjs as a code owner October 25, 2023 12:07
Copy link
Collaborator

@agjs agjs left a comment

Choose a reason for hiding this comment

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

And other comments from Twitch stream

useState<IMessage[]>(messages);
const messagesToRender = searchTerm.trim() ? filteredMessages : messages;

// This function is called whenever the search term changes in the SearchDialog
Copy link
Collaborator

Choose a reason for hiding this comment

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

The function name itself implies what this does, so no need for the comment.

const handleSearchChange = (newSearchTerm: string) => {
setSearchTerm(newSearchTerm);

// Fuse.js options; adjust as needed
Copy link
Collaborator

Choose a reason for hiding this comment

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

Unnecessary comment.

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.

Implement Search
2 participants