Make free coaching call url configurable and popup translatable (#823)

app/client/ui/WelcomeCoachingCall.ts

@@ -7,8 +7,9 @@ import {cardPopup, cssPopupBody, cssPopupButtons, cssPopupCloseButton,
 import {icon} from 'app/client/ui2018/icons';
 import {getGristConfig} from 'app/common/urlUtils';
 import {dom, styled} from 'grainjs';
+import { makeT } from '../lib/localization';
 
-const FREE_COACHING_CALL_URL = 'https://calendly.com/grist-team/grist-free-coaching-call';
+const t = makeT('WelcomeCoachingCall');
 
 export function shouldShowWelcomeCoachingCall(appModel: AppModel) {
   const {deploymentType} = getGristConfig();
@@ -63,7 +64,6 @@ export function showWelcomeCoachingCall(triggerElement: Element, appModel: AppMo
       ctl.close();
     };
 
-    // TODO: i18n
     return [
       cssPopup.cls(''),
       cssPopupHeader(
@@ -77,35 +77,39 @@ export function showWelcomeCoachingCall(triggerElement: Element, appModel: AppMo
           testId('popup-close-button'),
         ),
       ),
-      cssPopupTitle('Free Coaching Call', testId('popup-title')),
+      cssPopupTitle(t('free coaching call'),
+        dom.style('text-transform', 'capitalize'),
+        testId('popup-title')
+      ),
       cssPopupBody(
         cssBody(
           dom('div',
-            'Schedule your ', cssBoldText('free coaching call'), ' with a member of our team.'
+            t('Schedule your {{freeCoachingCall}} with a member of our team.',
+              {freeCoachingCall: cssBoldText(t('free coaching call'))}
+            )
           ),
           dom('div',
-            "On the call, we'll take the time to understand your needs and "
-            + 'tailor the call to you. We can show you the Grist basics, or start '
-            + 'working with your data right away to build the dashboards you need.'
+            t("On the call, we'll take the time to understand your needs and tailor the call to you. \
+We can show you the Grist basics, or start working with your data right away to build the dashboards you need.")
           ),
         ),
         testId('popup-body'),
       ),
       cssPopupButtons(
         bigPrimaryButtonLink(
-          'Schedule Call',
+          t('Schedule Call'),
           dom.on('click', () => {
             dismissPopup(false);
             logTelemetryEvent('clickedScheduleCoachingCall');
           }),
           {
-            href: FREE_COACHING_CALL_URL,
+            href: getGristConfig().freeCoachingCallUrl,
             target: '_blank',
           },
           testId('popup-primary-button'),
         ),
         bigBasicButton(
-          'Maybe Later',
+          t('Maybe Later'),
           dom.on('click', () => dismissPopup(true)),
           testId('popup-basic-button'),
         ),

app/common/gristUrls.ts

@@ -675,6 +675,9 @@ export interface GristLoadConfig {
   // Url for support for the browser client to use.
   helpCenterUrl?: string;
 
+  // Url for free coaching call scheduling for the browser client to use.
+  freeCoachingCallUrl?: string;
+
   // When set, this directs the client to encode org information in path, not in domain.
   pathOnly?: boolean;
 
@@ -879,6 +882,15 @@ export function getHelpCenterUrl(): string|null {
   }
 }
 
+export function getFreeCoachingCallUrl(): string|null {
+  if(isClient()) {
+    const gristConfig: GristLoadConfig = (window as any).gristConfig;
+    return gristConfig && gristConfig.freeCoachingCallUrl || null;
+  } else {
+    return process.env.FREE_COACHING_CALL_URL || null;
+  }
+}
+
 /**
  * Like getKnownOrg, but respects singleOrg/GRIST_SINGLE_ORG strictly.
  * The main difference in behavior would be for orgs with custom domains

app/server/lib/sendAppPage.ts

@@ -54,6 +54,7 @@ export function makeGristConfig(options: MakeGristConfigOptions): GristLoadConfi
     baseDomain,
     singleOrg: process.env.GRIST_SINGLE_ORG,
     helpCenterUrl: process.env.GRIST_HELP_CENTER || "https://support.getgrist.com",
+    freeCoachingCallUrl: process.env.FREE_COACHING_CALL_URL || "https://calendly.com/grist-team/grist-free-coaching-call",
     pathOnly,
     supportAnon: shouldSupportAnon(),
     enableAnonPlayground: isAffirmative(process.env.GRIST_ANON_PLAYGROUND ?? true),