• mdn 참고

• 정규 표현식 만들기

  

  • g : 검색된거와 관련된 모든것들을 검색한다.
  • i : 대문자 소문자 가리지 않고 전부 검색한다.

//state
state = {
    messages: [],
    messagesRef: firebase.database().ref("messages"),
    messagesLoading: true,
    searchTerm: "",
    searchResults: [],
    searchLoading: false
}

//handleSearchMessages
handleSearchMessages = () => {
    const chatRoomMessages = [...this.state.messages];
    const regex = new RegExp(this.state.searchTerm, "gi");
    const searchResults = chatRoomMessages.reduce((acc, message) => {
      if (
        (message.content && message.content.match(regex)) ||
        message.user.name.match(regex)
      ) {
        acc.push(message)
      }
      return acc;
    }, [])
    this.setState({ searchResults })
  }

//handleSearchChange
handleSearchChange = event => {
    this.setState({
      searchTerm: event.target.value,
      searchLoading:true
    }, () => this.handleSearchMessages())
  }

//addMessageListeners
addMessageListeners = (chatRoomId) => {
    let messagesArray = [];
    this.state.messagesRef.child(chatRoomId).on("child_added", DataSnapshot => {
      messagesArray.push(DataSnapshot.val());
      this.setState({ messages: messagesArray, messagesLoading: false })
    })
  }

//state 추가
const { messages, searchTerm, searchResults } = this.state;

//serachTerm 추가 되었는지
{searchTerm ?
            this.renderMessages(searchResults)
            :
            this.renderMessages(messages)
          }