import { phoneTypes } from '@ringcentral-integration/commons/enums/phoneTypes' ; import { ContactModel } from '@ringcentral-integration/commons/interfaces/Contact.model' ; import background from '@ringcentral-integration/commons/lib/background' ; import { Module } from '@ringcentral-integration/commons/lib/di' ; import proxify from '@ringcentral-integration/commons/lib/proxy/proxify' ; import { action , RcUIModuleV2 , state , track , } from '@ringcentral-integration/core' ; import { ContactDetailsViewFunctionProps , ContactDetailsViewProps , } from '../../components/ContactDetailsView/ContactDetailsView.interface' ; import { Deps , GetUIFunctions , InitParams , RouteParams , } from './ContactDetailsUI.interface' ; import { ContactReadyState , contactReadyStates } from './contactReadyStates' ; import { formatContactPhoneNumber } from './helper' ; import { trackEvents } from './trackEvents' ; const DEFAULT_DIALER_ROUTE = '/dialer' ; const DEFAULT_COMPOSE_TEXT_ROUTE = '/composeText' ; @ Module ( { name : 'ContactDetailsUI' , deps : [ 'Locale' , 'RouterInteraction' , 'ContactSearch' , 'Contacts' , 'ExtensionInfo' , 'AppFeatures' , 'RateLimiter' , 'RegionSettings' , 'ConnectivityManager' , 'Call' , 'DialerUI' , 'ComposeText' , { dep : 'ContactDetailsUIOptions' , optional : true , } , ] , } ) export class ContactDetailsUI extends RcUIModuleV2 < Deps > { constructor ( deps ) { super ( { deps } ) ; } @ state currentContact : ContactModel = null ; @ state currentContactReadyState : ContactReadyState = contactReadyStates . pending ; @ action private _setCurrentContact ( readyState , contact ) { this . currentContactReadyState = readyState ; this . currentContact = contact ; } @ background async resetCurrentContact ( ) { this . _setCurrentContact ( contactReadyStates . pending , null ) ; } @ background async initCurrentContact ( { contactType , contactId } ) { if ( this . currentContactReadyState !== contactReadyStates . pending ) { return ; } this . _setCurrentContact ( contactReadyStates . loading , null ) ; const contact = await this . _deps . contacts . findContact ( { sourceName : contactType , contactId , } ) ; if ( this . _deps . appFeatures . isCDCEnabled && contact . phoneNumbers . length ) { contact . phoneNumbers = contact . phoneNumbers . filter ( ( phone ) => ! phone . hidden ) ; } if ( this . currentContactReadyState !== contactReadyStates . loading ) { return ; } this . _setCurrentContact ( contactReadyStates . loaded , contact as ContactModel ) ; if ( contact ) { this . _deps . contacts . getProfileImage ( contact , false ) ; this . _deps . contacts . getPresence ( contact , false ) ; } } @ proxify async showContactDetails ( { id , type , direct = false } ) { this . _deps . routerInteraction . push ( `/contacts/${ type }/${ id }${ direct ? '?direct=true' : '' }` ) ; } @ proxify async handleClickToDial ( contact , phoneNumber ) { const recipient = { ... contact , phoneNumber , } ; if ( this . _deps . call . isIdle ) { this . _deps . routerInteraction . push ( this . _deps . contactDetailsUIOptions ?. dialerRoute ?? DEFAULT_DIALER_ROUTE ) ; this . _deps . dialerUI . call ( { recipient } ) ; } this . _trackClickToCall ( ) ; } @ proxify async handleClickToSMS ( contact , phoneNumber ) { const recipient = { ... contact , phoneNumber , } ; this . _deps . routerInteraction . push ( this . _deps . contactDetailsUIOptions ?. composeTextRoute ?? DEFAULT_COMPOSE_TEXT_ROUTE ) ; this . _deps . composeText . addToNumber ( recipient ) ; if ( this . _deps . composeText . typingToNumber === recipient . phoneNumber ) { this . _deps . composeText . cleanTypingToNumber ( ) ; } this . _trackClickToSMS ( ) ; } @ track ( trackEvents . clickToCall ) private _trackClickToCall ( ) { } @ track ( trackEvents . clickToSMS ) private _trackClickToSMS ( ) { } getUIProps ( ) { return { currentLocale : this . _deps . locale . currentLocale , contact : this . currentContact , isMultipleSiteEnabled : this . _deps . extensionInfo . isMultipleSiteEnabled ?? false , isCallButtonDisabled : ! ! ( this . _deps . connectivityManager ?. isOfflineMode || this . _deps . connectivityManager ?. isWebphoneUnavailableMode || this . _deps . connectivityManager ?. isWebphoneInitializing || this . _deps . rateLimiter ?. throttling ) , disableLinks : ! ! ( this . _deps . connectivityManager ?. isOfflineMode || this . _deps . connectivityManager ?. isVoipOnlyMode || this . _deps . rateLimiter ?. throttling ) , showSpinner : ! ( this . currentContactReadyState === contactReadyStates . loaded && this . _deps . locale . ready && this . _deps . contactSearch . ready && this . _deps . appFeatures . ready ) , } ; } getUIFunctions ( { params } ) { return { formatNumber : ( phoneNumber ) => formatContactPhoneNumber ( phoneNumber , this . _deps . regionSettings . countryCode , this . _deps . extensionInfo . isMultipleSiteEnabled , this . _deps . extensionInfo . site ?. code ) , onVisitPage : ( ) => { this . initCurrentContact ( params ) ; } , onLeavingPage : ( ) => { this . resetCurrentContact ( ) ; } , canTextButtonShow : ( phoneType ) => { const outboundSmsPermission = this . _deps . appFeatures . hasOutboundSMSPermission ; const internalSmsPermission = this . _deps . appFeatures . hasInternalSMSPermission ; const isClickToTextEnabled = ! ! this . _deps . composeText ; return ( isClickToTextEnabled && phoneType !== phoneTypes . fax && ( phoneType === phoneTypes . extension ? internalSmsPermission : outboundSmsPermission ) ) ; } , canCallButtonShow : ( phoneType ) => { const isClickToDialEnabled = ! ! ( this . _deps . dialerUI && this . _deps . appFeatures . isCallingEnabled ) ; return isClickToDialEnabled && phoneType !== phoneTypes . fax ; } , onBackClick : ( ) => { this . _deps . routerInteraction . goBack ( ) ; } , onClickToDial : ( contact , phoneNumber ) => this . handleClickToDial ( contact , phoneNumber ) , onClickToSMS : ( contact , phoneNumber ) => this . handleClickToSMS ( contact , phoneNumber ) , } ; } }