From ed15a15f16fb82005916558e08fb01cec8a5b8e8 Mon Sep 17 00:00:00 2001
From: RingCentral Integrations Team <integrations@ringcentral.com>
Date: Thu, 30 Mar 2017 17:50:05 +0800
Subject: [PATCH] Update WelcomePage and CallItem to disable links when
 disconnected

---
 dev-server/Phone.js                 | 18 +++++++++++++++++-
 dev-server/containers/App/index.js  |  5 ++++-
 src/components/CallItem/index.js    | 11 +++++------
 src/containers/WelcomePage/index.js |  9 ++++++++-
 4 files changed, 34 insertions(+), 9 deletions(-)

diff --git a/dev-server/Phone.js b/dev-server/Phone.js
index 4a76cd4b2f..6f434a5a16 100644
--- a/dev-server/Phone.js
+++ b/dev-server/Phone.js
@@ -42,8 +42,9 @@ import DetailedPresence from 'ringcentral-integration/modules/DetailedPresence';
 import CallLog from 'ringcentral-integration/modules/CallLog';
 import CallMonitor from 'ringcentral-integration/modules/CallMonitor';
 import CallHistory from 'ringcentral-integration/modules/CallHistory';
-
 import ContactMatcher from 'ringcentral-integration/modules/ContactMatcher';
+import ActivityMatcher from 'ringcentral-integration/modules/ActivityMatcher';
+import CallLogger from 'ringcentral-integration/modules/CallLogger';
 
 import RouterInteraction from '../src/modules/RouterInteraction';
 
@@ -373,6 +374,19 @@ export default class Phone extends RcModule {
       storage: this.storage,
       getState: () => this.state.contactMatcher,
     }));
+    this.addModule('activityMatcher', new ActivityMatcher({
+      ...options,
+      storage: this.storage,
+      getState: () => this.state.activityMatcher,
+    }));
+    this.addModule('callLogger', new CallLogger({
+      ...options,
+      storage: this.storage,
+      callMonitor: this.callMonitor,
+      contactMatcher: this.contactMatcher,
+      activityMatcher: this.activityMatcher,
+      getState: () => this.state.callLogger,
+    }));
     this._reducer = combineReducers({
       accountExtension: this.accountExtension.reducer,
       accountInfo: this.accountInfo.reducer,
@@ -416,6 +430,8 @@ export default class Phone extends RcModule {
       callMonitor: this.callMonitor.reducer,
       callHistory: this.callHistory.reducer,
       contactMatcher: this.contactMatcher.reducer,
+      activityMatcher: this.activityMatcher.reducer,
+      callLogger: this.callLogger.reducer,
       lastAction: (state = null, action) => {
         console.log(action);
         return action;
diff --git a/dev-server/containers/App/index.js b/dev-server/containers/App/index.js
index c56ff5c9fc..54ff3f6b6a 100644
--- a/dev-server/containers/App/index.js
+++ b/dev-server/containers/App/index.js
@@ -140,6 +140,7 @@ export default function App({
                   regionSettings={phone.regionSettings}
                   connectivityMonitor={phone.connectivityMonitor}
                   dateTimeFormat={phone.dateTimeFormat}
+                  callLogger={phone.callLogger}
                 />
               )} />
             <Route
@@ -153,6 +154,7 @@ export default function App({
                   regionSettings={phone.regionSettings}
                   connectivityMonitor={phone.connectivityMonitor}
                   dateTimeFormat={phone.dateTimeFormat}
+                  callLogger={phone.callLogger}
                 />
               )} />
             <Route
@@ -226,7 +228,8 @@ export default function App({
               <WelcomePage
                 auth={phone.auth}
                 locale={phone.locale}
-                rateLimiter={phone.rateLimiter} >
+                rateLimiter={phone.rateLimiter}
+                connectivityMonitor={phone.connectivityMonitor} >
                 <AlertContainer
                   locale={phone.locale}
                   alert={phone.alert}
diff --git a/src/components/CallItem/index.js b/src/components/CallItem/index.js
index a9307738bc..b56f24480b 100644
--- a/src/components/CallItem/index.js
+++ b/src/components/CallItem/index.js
@@ -163,10 +163,9 @@ ContactLink.defaultProps = {
 function LogLink({
   onLogCall,
   isLogged,
-  disableLinks,
+  disabled,
   isLogging,
 }) {
-  const disabled = disableLinks || isLogging;
   const spinner = isLogging ?
     (
       <div className={styles.spinnerContainer}>
@@ -178,10 +177,10 @@ function LogLink({
     <a
       className={classnames(
         styles.logLink,
-        disabled && styles.disabled,
+        (disabled || isLogging) && styles.disabled,
       )}
-      onClick={!disabled && onLogCall}
-      disabled={disabled}>
+      onClick={!(disabled || isLogging) && onLogCall}
+      disabled={(disabled || isLogging)}>
       <span
         className={isLogged ?
           dynamicsFont.edit :
@@ -194,7 +193,7 @@ function LogLink({
 LogLink.propTypes = {
   onLogCall: PropTypes.func,
   isLogged: PropTypes.bool.isRequired,
-  disableLinks: PropTypes.bool,
+  disabled: PropTypes.bool,
   isLogging: PropTypes.bool.isRequired,
 };
 
diff --git a/src/containers/WelcomePage/index.js b/src/containers/WelcomePage/index.js
index e0ed772906..ae776da8c1 100644
--- a/src/containers/WelcomePage/index.js
+++ b/src/containers/WelcomePage/index.js
@@ -3,6 +3,7 @@ import { connect } from 'react-redux';
 import Auth from 'ringcentral-integration/modules/Auth';
 import Locale from 'ringcentral-integration/modules/Locale';
 import RateLimiter from 'ringcentral-integration/modules/RateLimiter';
+import ConnectivityMonitor from 'ringcentral-integration/modules/ConnectivityMonitor';
 import LoginPanel from '../../components/LoginPanel';
 
 import styles from './styles.scss';
@@ -40,10 +41,15 @@ function mapToProps(_, {
   auth,
   locale,
   rateLimiter,
+  connectivityMonitor,
 }) {
   return {
     currentLocale: locale.currentLocale,
-    disabled: !auth.proxyLoaded || rateLimiter.throttling,
+    disabled: (
+      !auth.proxyLoaded ||
+      rateLimiter.throttling ||
+      !connectivityMonitor.connectivity
+    ),
   };
 }
 
@@ -73,6 +79,7 @@ const propTypes = {
   auth: PropTypes.instanceOf(Auth).isRequired,
   locale: PropTypes.instanceOf(Locale).isRequired,
   rateLimiter: PropTypes.instanceOf(RateLimiter).isRequired,
+  connectivityMonitor: PropTypes.instanceOf(ConnectivityMonitor).isRequired,
   mainUrl: PropTypes.string,
   onLogin: PropTypes.func,
 };