From eeaec77fbb2116877f0b98819ae3718acb43b0bd Mon Sep 17 00:00:00 2001
From: Dominik Broj <dominik.broj@gmail.com>
Date: Tue, 7 Nov 2023 11:08:39 +0100
Subject: [PATCH] Unify Grafana Cloud OnCall wording (#3279)

# What this PR does

- Unify naming in the app of Grafana Cloud / Cloud OnCall / Grafana
Cloud OnCall so that it's always **Grafana Cloud OnCall**
- Unify naming the same way in docs

## Which issue(s) this PR fixes
https://github.com/grafana/oncall/issues/1468

## Checklist

- [x] Unit, integration, and e2e (if applicable) tests updated
- [x] Documentation added (or `pr:no public docs` PR label added if not
required)
- [x] `CHANGELOG.md` updated (or `pr:no changelog` PR label added if not
required)
---
 CHANGELOG.md                                  |  5 +++
 .../installation-and-setup/index.md           |  8 ++--
 docs/sources/open-source/_index.md            |  6 +--
 .../MobileAppConnection.tsx                   |  6 +--
 .../MobileAppConnection.test.tsx.snap         |  4 +-
 .../parts/connectors/PhoneConnector.tsx       | 16 ++++----
 .../CloudPhoneSettings/CloudPhoneSettings.tsx | 26 ++++++------
 .../pages/settings/tabs/Cloud/CloudPage.tsx   | 40 ++++++++++---------
 grafana-plugin/src/pages/users/Users.tsx      |  6 +--
 9 files changed, 62 insertions(+), 55 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 2e41e1d7..4621c54b 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,11 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## Unreleased
 
+### Changed
+
+- Unify naming of Grafana Cloud / Cloud OnCall / Grafana Cloud OnCall
+  so that it's always Grafana Cloud OnCall ([#3279](https://github.com/grafana/oncall/pull/3279))
+
 ## v1.3.54 (2023-11-06)
 
 ### Added
diff --git a/docs/sources/mobile-app/installation-and-setup/index.md b/docs/sources/mobile-app/installation-and-setup/index.md
index d463822d..c20da7d6 100644
--- a/docs/sources/mobile-app/installation-and-setup/index.md
+++ b/docs/sources/mobile-app/installation-and-setup/index.md
@@ -44,14 +44,14 @@ To access your QR code:
 1. Navigate to the **Users** tab, then tap **View my profile**
 1. tap **Mobile app connection** in your profile
 
->**Note**: The QR code will timeout for security purposes - Screenshots of the QR code are unlikely to work for authentication.
+> **Note**: The QR code will timeout for security purposes - Screenshots of the QR code are unlikely to work for authentication.
 
 ### Connect to your open source Grafana OnCall account
 
-Grafana OnCall OSS relies on Grafana Cloud as on relay for push notifications.
-You must first connect your Grafana OnCall OSS to Grafana Cloud for the mobile app to work.
+Grafana OnCall OSS relies on Grafana Cloud OnCall as on relay for push notifications.
+You must first connect your Grafana OnCall OSS to Grafana Cloud OnCall for the mobile app to work.
 
-To connect to Grafana Cloud, refer to the Cloud page in your OSS Grafana OnCall instance.
+To connect to Grafana Cloud OnCall, refer to the Cloud page in your OSS Grafana OnCall instance.
 
 For Grafana OnCall OSS, the QR code includes an authentication token along with a backend URL.
 Your Grafana OnCall OSS instance should be reachable from the same network as your mobile device, preferably from the internet.
diff --git a/docs/sources/open-source/_index.md b/docs/sources/open-source/_index.md
index 11107e4d..ae0ca4bb 100644
--- a/docs/sources/open-source/_index.md
+++ b/docs/sources/open-source/_index.md
@@ -197,13 +197,13 @@ Refer to the following steps to configure the Telegram integration:
 
 ## Grafana OSS-Cloud Setup
 
-The benefits of connecting to Grafana Cloud include:
+The benefits of connecting to Grafana Cloud OnCall include:
 
-- Cloud OnCall could monitor OSS OnCall uptime using heartbeat
+- Grafana Cloud OnCall could monitor OSS OnCall uptime using heartbeat
 - SMS for user notifications
 - Phone calls for user notifications.
 
-To connect to Grafana Cloud, refer to the **Cloud** page in your OSS Grafana OnCall instance.
+To connect to Grafana Cloud OnCall, refer to the **Cloud** page in your OSS Grafana OnCall instance.
 
 ## Supported Phone Providers
 
diff --git a/grafana-plugin/src/containers/MobileAppConnection/MobileAppConnection.tsx b/grafana-plugin/src/containers/MobileAppConnection/MobileAppConnection.tsx
index 1a293c5b..4e87938f 100644
--- a/grafana-plugin/src/containers/MobileAppConnection/MobileAppConnection.tsx
+++ b/grafana-plugin/src/containers/MobileAppConnection/MobileAppConnection.tsx
@@ -45,15 +45,15 @@ const MobileAppConnection = observer(({ userPk }: Props) => {
     return (
       <WithPermissionControlDisplay userAction={UserActions.UserSettingsWrite}>
         <VerticalGroup spacing="lg">
-          <Text type="secondary">Please connect Cloud OnCall to use the mobile app</Text>
+          <Text type="secondary">Please connect Grafana Cloud OnCall to use the mobile app</Text>
           <WithPermissionControlDisplay
             userAction={UserActions.OtherSettingsWrite}
-            message="You do not have permission to perform this action. Ask an admin to connect Cloud OnCall or upgrade your
+            message="You do not have permission to perform this action. Ask an admin to connect Grafana Cloud OnCall or upgrade your
             permissions."
           >
             <PluginLink query={{ page: 'cloud' }}>
               <Button variant="secondary" icon="external-link-alt">
-                Connect Cloud OnCall
+                Connect Grafana Cloud OnCall
               </Button>
             </PluginLink>
           </WithPermissionControlDisplay>
diff --git a/grafana-plugin/src/containers/MobileAppConnection/__snapshots__/MobileAppConnection.test.tsx.snap b/grafana-plugin/src/containers/MobileAppConnection/__snapshots__/MobileAppConnection.test.tsx.snap
index b583c4b8..1f46a2a3 100644
--- a/grafana-plugin/src/containers/MobileAppConnection/__snapshots__/MobileAppConnection.test.tsx.snap
+++ b/grafana-plugin/src/containers/MobileAppConnection/__snapshots__/MobileAppConnection.test.tsx.snap
@@ -2901,7 +2901,7 @@ exports[`MobileAppConnection it shows a warning when cloud is not connected 1`]
       <span
         class="root text text--secondary text--medium"
       >
-        Please connect Cloud OnCall to use the mobile app
+        Please connect Grafana Cloud OnCall to use the mobile app
       </span>
     </div>
     <div
@@ -2933,7 +2933,7 @@ exports[`MobileAppConnection it shows a warning when cloud is not connected 1`]
           <span
             class="css-1mhnkuh"
           >
-            Connect Cloud OnCall
+            Connect Grafana Cloud OnCall
           </span>
         </button>
       </a>
diff --git a/grafana-plugin/src/containers/UserSettings/parts/connectors/PhoneConnector.tsx b/grafana-plugin/src/containers/UserSettings/parts/connectors/PhoneConnector.tsx
index 434a9ba9..aa35f74e 100644
--- a/grafana-plugin/src/containers/UserSettings/parts/connectors/PhoneConnector.tsx
+++ b/grafana-plugin/src/containers/UserSettings/parts/connectors/PhoneConnector.tsx
@@ -35,11 +35,11 @@ const PhoneConnector = (props: PhoneConnectorProps) => {
             <InlineField
               label="Phone"
               labelWidth={12}
-              tooltip={'OnCall uses Grafana Cloud for SMS and phone call notifications'}
+              tooltip={'OnCall uses Grafana Cloud OnCall for SMS and phone call notifications'}
             >
-              <Button onClick={handleClickConfirmPhoneButton}>Connect to Cloud</Button>
+              <Button onClick={handleClickConfirmPhoneButton}>Connect to Grafana Cloud OnCall</Button>
             </InlineField>
-            <Alert title="This instance is not connected to Cloud OnCall" severity="warning" />
+            <Alert title="This instance is not connected to Grafana Cloud OnCall" severity="warning" />
           </>
         );
 
@@ -49,7 +49,7 @@ const PhoneConnector = (props: PhoneConnectorProps) => {
             <InlineField
               label="Phone"
               labelWidth={12}
-              tooltip={'OnCall uses Grafana Cloud for SMS and phone call notifications'}
+              tooltip={'OnCall uses Grafana Cloud OnCall for SMS and phone call notifications'}
             >
               <Button onClick={handleClickConfirmPhoneButton}>Reload from Cloud</Button>
             </InlineField>
@@ -63,11 +63,11 @@ const PhoneConnector = (props: PhoneConnectorProps) => {
             <InlineField
               label="Phone"
               labelWidth={12}
-              tooltip={'OnCall uses Grafana Cloud for SMS and phone call notifications'}
+              tooltip={'OnCall uses Grafana Cloud OnCall for SMS and phone call notifications'}
             >
               <Button onClick={handleClickConfirmPhoneButton}>Verify in Cloud</Button>
             </InlineField>
-            <Alert title="Phone number is not verified in Grafana Cloud" severity="warning" />
+            <Alert title="Phone number is not verified in Grafana Cloud OnCall" severity="warning" />
           </>
         );
       case 3:
@@ -76,7 +76,7 @@ const PhoneConnector = (props: PhoneConnectorProps) => {
             <InlineField
               label="Phone"
               labelWidth={12}
-              tooltip={'OnCall uses Grafana Cloud for SMS and phone call notifications'}
+              tooltip={'OnCall uses Grafana Cloud OnCall for SMS and phone call notifications'}
             >
               <Button onClick={handleClickConfirmPhoneButton}>Change in Cloud</Button>
             </InlineField>
@@ -90,7 +90,7 @@ const PhoneConnector = (props: PhoneConnectorProps) => {
               label="Phone"
               disabled={true}
               labelWidth={12}
-              tooltip={'OnCall uses Grafana Cloud for SMS and phone call notifications'}
+              tooltip={'OnCall uses Grafana Cloud OnCall for SMS and phone call notifications'}
             >
               <Button onClick={handleClickConfirmPhoneButton}>Reload from Cloud</Button>
             </InlineField>
diff --git a/grafana-plugin/src/containers/UserSettings/parts/tabs/CloudPhoneSettings/CloudPhoneSettings.tsx b/grafana-plugin/src/containers/UserSettings/parts/tabs/CloudPhoneSettings/CloudPhoneSettings.tsx
index 29809d02..405582f6 100644
--- a/grafana-plugin/src/containers/UserSettings/parts/tabs/CloudPhoneSettings/CloudPhoneSettings.tsx
+++ b/grafana-plugin/src/containers/UserSettings/parts/tabs/CloudPhoneSettings/CloudPhoneSettings.tsx
@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from 'react';
 
-import { Button, VerticalGroup, LoadingPlaceholder } from '@grafana/ui';
+import { Button, LoadingPlaceholder, VerticalGroup } from '@grafana/ui';
 import { observer } from 'mobx-react';
 
 import PluginLink from 'components/PluginLink/PluginLink';
@@ -53,10 +53,10 @@ const CloudPhoneSettings = observer((props: CloudPhoneSettingsProps) => {
       case 0:
         return (
           <VerticalGroup spacing="lg">
-            <Text>Cloud notifications enabled, but Grafana Cloud instance is not connected.</Text>
+            <Text>Cloud notifications enabled, but Grafana Cloud OnCall instance is not connected.</Text>
             <PluginLink query={{ page: 'cloud' }}>
               <Button variant="secondary" icon="external-link-alt">
-                Open Grafana Cloud page
+                Open Grafana Cloud OnCall page
               </Button>
             </PluginLink>
           </VerticalGroup>
@@ -65,11 +65,11 @@ const CloudPhoneSettings = observer((props: CloudPhoneSettingsProps) => {
         return (
           <VerticalGroup spacing="lg">
             <Text>
-              We can’t find a matching account in the connected Grafana Cloud instance (matching by e-mail
+              We can’t find a matching account in the connected Grafana Cloud OnCall instance (matching by e-mail
               {email && ': ' + email}).
             </Text>
             <Button variant="primary" onClick={() => handleLinkClick(userLink)}>
-              Sign up in Grafana Cloud
+              Sign up in Grafana Cloud OnCall
             </Button>
           </VerticalGroup>
         );
@@ -77,10 +77,10 @@ const CloudPhoneSettings = observer((props: CloudPhoneSettingsProps) => {
         return (
           <VerticalGroup spacing="lg">
             <Text>
-              Your account successfully matched with the Grafana Cloud account. Please verify your phone number.{' '}
+              Your account successfully matched with the Grafana Cloud OnCall account. Please verify your phone number.{' '}
             </Text>
             <Button variant="secondary" icon="external-link-alt" onClick={() => handleLinkClick(userLink)}>
-              Verify phone number in Grafana Cloud
+              Verify phone number in Grafana Cloud OnCall
             </Button>
           </VerticalGroup>
         );
@@ -88,10 +88,10 @@ const CloudPhoneSettings = observer((props: CloudPhoneSettingsProps) => {
         return (
           <VerticalGroup spacing="lg">
             <Text>
-              Your account successfully matched with the Grafana Cloud account. Your phone number is verified.{' '}
+              Your account successfully matched with the Grafana Cloud OnCall account. Your phone number is verified.{' '}
             </Text>
             <Button variant="secondary" icon="external-link-alt" onClick={() => handleLinkClick(userLink)}>
-              Open account in Grafana Cloud
+              Open account in Grafana Cloud OnCall
             </Button>
           </VerticalGroup>
         );
@@ -99,11 +99,11 @@ const CloudPhoneSettings = observer((props: CloudPhoneSettingsProps) => {
         return (
           <VerticalGroup spacing="lg">
             <Text>
-              We can’t find a matching account in the connected Grafana Cloud instance (matching by e-mail
+              We can’t find a matching account in the connected Grafana Cloud OnCall instance (matching by e-mail
               {email && ': ' + email}).
             </Text>
             <Button variant="primary" onClick={() => handleLinkClick(userLink)}>
-              Sign up in Grafana Cloud
+              Sign up in Grafana Cloud OnCall
             </Button>
           </VerticalGroup>
         );
@@ -113,10 +113,10 @@ const CloudPhoneSettings = observer((props: CloudPhoneSettingsProps) => {
   return (
     <WithPermissionControlDisplay
       userAction={UserActions.UserSettingsWrite}
-      title="OnCall uses Grafana Cloud for SMS and phone call notifications"
+      title="OnCall uses Grafana Cloud OnCall for SMS and phone call notifications"
     >
       <VerticalGroup spacing="lg">
-        <Text.Title level={3}>OnCall uses Grafana Cloud for SMS and phone call notifications</Text.Title>
+        <Text.Title level={3}>OnCall uses Grafana Cloud OnCall for SMS and phone call notifications</Text.Title>
         {syncing ? (
           <Button icon="sync" variant="secondary" disabled>
             Updating...
diff --git a/grafana-plugin/src/pages/settings/tabs/Cloud/CloudPage.tsx b/grafana-plugin/src/pages/settings/tabs/Cloud/CloudPage.tsx
index 1fbd7b56..64a40ab4 100644
--- a/grafana-plugin/src/pages/settings/tabs/Cloud/CloudPage.tsx
+++ b/grafana-plugin/src/pages/settings/tabs/Cloud/CloudPage.tsx
@@ -1,6 +1,6 @@
 import React, { useCallback, useEffect, useState } from 'react';
 
-import { Field, Input, Button, HorizontalGroup, Icon, VerticalGroup, LoadingPlaceholder } from '@grafana/ui';
+import { Button, Field, HorizontalGroup, Icon, Input, LoadingPlaceholder, VerticalGroup } from '@grafana/ui';
 import cn from 'classnames/bind';
 import { observer } from 'mobx-react';
 import { RouteComponentProps, withRouter } from 'react-router-dom';
@@ -15,7 +15,7 @@ import { WithStoreProps } from 'state/types';
 import { useStore } from 'state/useStore';
 import { withMobXProviderContext } from 'state/withStore';
 import { openErrorNotification } from 'utils';
-import { determineRequiredAuthString, UserActions } from 'utils/authorization';
+import { UserActions, determineRequiredAuthString } from 'utils/authorization';
 import { PLUGIN_ROOT } from 'utils/consts';
 
 import styles from './CloudPage.module.css';
@@ -135,16 +135,16 @@ const CloudPage = observer((props: CloudPageProps) => {
   const renderStatus = (user: Cloud) => {
     switch (user?.cloud_data?.status) {
       case 0:
-        return <Text className={cx('error-message')}>Grafana Cloud is not synced</Text>;
+        return <Text className={cx('error-message')}>Grafana Cloud OnCall is not synced</Text>;
       case 1:
-        return <Text className={cx('error-message')}>User not found in Grafana Cloud</Text>;
+        return <Text className={cx('error-message')}>User not found in Grafana Cloud OnCall</Text>;
       case 2:
-        return <Text type="warning">Phone number is not verified in Grafana Cloud</Text>;
+        return <Text type="warning">Phone number is not verified in Grafana Cloud OnCall</Text>;
       case 3:
         return <Text type="success">Phone number verified</Text>;
 
       default:
-        return <Text className={cx('error-message')}>User not found in Grafana Cloud</Text>;
+        return <Text className={cx('error-message')}>User not found in Grafana Cloud OnCall</Text>;
     }
   };
 
@@ -209,9 +209,9 @@ const CloudPage = observer((props: CloudPageProps) => {
       <Block withBackground bordered className={cx('info-block')}>
         <VerticalGroup>
           <Text.Title level={4}>
-            <Icon name="check" className={cx('block-icon')} size="lg" /> Cloud OnCall API key
+            <Icon name="check" className={cx('block-icon')} size="lg" /> Grafana Cloud OnCall API key
           </Text.Title>
-          <Text type="secondary">Cloud OnCall is sucessfully connected.</Text>
+          <Text type="secondary">Grafana Cloud OnCall is sucessfully connected.</Text>
 
           <WithConfirm title="Are you sure to disconnect Cloud OnCall?" confirmText="Disconnect">
             <Button variant="destructive" onClick={disconnectCloudOncall} size="md" className={cx('block-button')}>
@@ -261,7 +261,7 @@ const CloudPage = observer((props: CloudPageProps) => {
 
             <div style={{ width: '100%' }}>
               <Text type="secondary">
-                {`Ask your users to sign up in Grafana Cloud, verify phone number and feel free to set up SMS & phone call notifications in personal settings! Users must have ${determineRequiredAuthString(
+                {`Ask your users to sign up in Grafana Cloud OnCall, verify phone number and feel free to set up SMS & phone call notifications in personal settings! Users must have ${determineRequiredAuthString(
                   UserActions.NotificationsRead
                 )} in order to be synced.`}
               </Text>
@@ -277,7 +277,7 @@ const CloudPage = observer((props: CloudPageProps) => {
                       <Text type="secondary">
                         {matched_users_count ? matched_users_count : 0} user
                         {matched_users_count === 1 ? '' : 's'}
-                        {` matched between OSS and Cloud OnCall`}
+                        {` matched between OSS and Grafana Cloud OnCall`}
                       </Text>
                       <Button variant="primary" onClick={syncUsers} icon="sync" disabled={syncingUsers}>
                         {syncingUsers ? 'Syncing...' : 'Sync users'}
@@ -314,8 +314,8 @@ const CloudPage = observer((props: CloudPageProps) => {
             <Icon name="mobile-android" className={cx('block-icon')} size="lg" /> Mobile app push notifications
           </Text.Title>
           <Text type="secondary">
-            Connecting to Cloud OnCall enables sending push notifications on mobile devices using the Grafana OnCall
-            mobile app.
+            Connecting to Grafana Cloud OnCall enables sending push notifications on mobile devices using the Grafana
+            OnCall mobile app.
           </Text>
         </VerticalGroup>
       </Block>
@@ -327,11 +327,11 @@ const CloudPage = observer((props: CloudPageProps) => {
       <Block withBackground bordered className={cx('info-block')}>
         <VerticalGroup>
           <Text.Title level={4}>
-            <Icon name="sync" className={cx('block-icon')} size="lg" /> Cloud OnCall API key
+            <Icon name="sync" className={cx('block-icon')} size="lg" /> Grafana Cloud OnCall API key
           </Text.Title>
           <Field
             label=""
-            description="Find it on the Settings page of OnCall, within your Cloud Grafana instance"
+            description="Find it on the Settings page of OnCall, within your Grafana Cloud OnCall instance"
             style={{ width: '100%' }}
             invalid={apiKeyError}
           >
@@ -351,8 +351,9 @@ const CloudPage = observer((props: CloudPageProps) => {
             Monitor instance with heartbeat
           </Text.Title>
           <Text type="secondary">
-            Once connected, this OnCall instance will send heartbeats every 3 minutes to the Cloud Grafana instance. If
-            no heartbeats are received within 10 minutes, the Cloud Grafana instance will issue an alert.
+            Once connected, this OnCall instance will send heartbeats every 3 minutes to the Grafana Cloud OnCall
+            instance. If no heartbeats are received within 10 minutes, the Grafana Cloud OnCall instance will issue an
+            alert.
           </Text>
         </VerticalGroup>
       </Block>
@@ -363,7 +364,8 @@ const CloudPage = observer((props: CloudPageProps) => {
           </Text.Title>
 
           <Text type="secondary">
-            Connecting to Cloud OnCall enables sending SMS and phone call notifications using Cloud Grafana OnCall.
+            Connecting to Grafana Cloud OnCall enables sending SMS and phone call notifications using Grafana Cloud
+            OnCall.
           </Text>
         </VerticalGroup>
       </Block>
@@ -373,7 +375,7 @@ const CloudPage = observer((props: CloudPageProps) => {
             <Icon name="mobile-android" className={cx('block-icon')} size="lg" /> Mobile app push notifications
           </Text.Title>
           <Text type="secondary">
-            Connecting to Cloud Grafana OnCall enables sending push notifications on mobile devices using the Grafana
+            Connecting to Grafana Cloud OnCall enables sending push notifications on mobile devices using the Grafana
             OnCall mobile app.
           </Text>
         </VerticalGroup>
@@ -385,7 +387,7 @@ const CloudPage = observer((props: CloudPageProps) => {
     <div className={cx('root')}>
       <VerticalGroup spacing="lg">
         <Text.Title level={3} className={cx('cloud-page-title')}>
-          Connect Open Source OnCall and <Text className={cx('cloud-oncall-name')}>Cloud OnCall</Text>
+          Connect Open Source OnCall and <Text className={cx('cloud-oncall-name')}>Grafana Cloud OnCall</Text>
         </Text.Title>
         {cloudIsConnected === undefined ? (
           <LoadingPlaceholder text="Loading..." />
diff --git a/grafana-plugin/src/pages/users/Users.tsx b/grafana-plugin/src/pages/users/Users.tsx
index 24bf1278..6bb617c7 100644
--- a/grafana-plugin/src/pages/users/Users.tsx
+++ b/grafana-plugin/src/pages/users/Users.tsx
@@ -24,7 +24,7 @@ import { AppFeature } from 'state/features';
 import { PageProps, WithStoreProps } from 'state/types';
 import { withMobXProviderContext } from 'state/withStore';
 import LocationHelper from 'utils/LocationHelper';
-import { generateMissingPermissionMessage, isUserActionAllowed, UserActions } from 'utils/authorization';
+import { UserActions, generateMissingPermissionMessage, isUserActionAllowed } from 'utils/authorization';
 import { PAGE, PLUGIN_ROOT } from 'utils/consts';
 
 import { getUserRowClassNameFn } from './Users.helpers';
@@ -343,10 +343,10 @@ class Users extends React.Component<UsersProps, UsersState> {
           warnings.push('User not matched with cloud');
           break;
         case 2:
-          warnings.push('Phone number is not verified in Grafana Cloud');
+          warnings.push('Phone number is not verified in Grafana Cloud OnCall');
           break;
         case 3:
-          phone_verified = true; // Phone is verified in Grafana Cloud, no need to show warning to the user
+          phone_verified = true; // Phone is verified in Grafana Cloud OnCall, no need to show warning to the user
           break;
       }
     } else if (!phone_verified) {