import { getTypingIndicators , getParticipants , getUserId , ChatBaseSelectorProps } from './baseSelectors' ; import { createSelector } from 'reselect' ; import { ChatParticipant } from '@azure/communication-chat' ; import { TypingIndicatorReceivedEvent } from '@azure/communication-signaling' ; import { toFlatCommunicationIdentifier } from '@internal/acs-ui-common' ; import { CommunicationParticipant } from '@internal/react-components' ; import { MINIMUM_TYPING_INTERVAL_IN_MILLISECONDS , PARTICIPANTS_THRESHOLD } from './utils/constants' ; import { ChatClientState } from '@internal/chat-stateful-client' ; const filterTypingIndicators = ( typingIndicators , userId ) : TypingIndicatorReceivedEvent [ ] => { const filteredTypingIndicators = [ ] ; const seen = new Set ( ) ; const date8SecondsAgo = new Date ( Date . now ( ) - MINIMUM_TYPING_INTERVAL_IN_MILLISECONDS ) ; for ( let i = typingIndicators . length - 1 ; i >= 0 ; i -- ) { const typingIndicator = typingIndicators [ i ] ; if ( toFlatCommunicationIdentifier ( typingIndicator . sender ) === userId ) { continue ; } if ( typingIndicator . receivedOn < date8SecondsAgo ) { continue ; } if ( seen . has ( toFlatCommunicationIdentifier ( typingIndicator . sender ) ) ) { continue ; } seen . add ( toFlatCommunicationIdentifier ( typingIndicator . sender ) ) ; filteredTypingIndicators . push ( typingIndicator ) ; } return filteredTypingIndicators ; } ; const convertSdkTypingIndicatorsToCommunicationParticipants = ( typingIndicators , participants ) : CommunicationParticipant [ ] => { return typingIndicators . map ( ( typingIndicator ) => ( { userId : toFlatCommunicationIdentifier ( typingIndicator . sender ) , displayName : participants [ toFlatCommunicationIdentifier ( typingIndicator . sender ) ] ?. displayName } ) ) ; } ; /**
 * Selector type for  TypingIndicator component.
 *
 *  public export type TypingIndicatorSelector = ( state : ChatClientState , props : ChatBaseSelectorProps ) => { typingUsers : CommunicationParticipant [ ] ; } ; /**
 * Selector for  TypingIndicator component.
 *
 *  public export const typingIndicatorSelector = createSelector ( [ getTypingIndicators , getParticipants , getUserId ] , ( typingIndicators , participants , userId ) => { if ( Object . values ( participants ) . length >= PARTICIPANTS_THRESHOLD ) { return { typingUsers : [ ] } ; } const filteredTypingIndicators = filterTypingIndicators ( typingIndicators , userId ) ; const typingUsers = convertSdkTypingIndicatorsToCommunicationParticipants ( filteredTypingIndicators , participants ) ; return { typingUsers } ; } ) ;