From 689fdba52b74075bc4263baad179bd06008ab850 Mon Sep 17 00:00:00 2001
From: Vadim Stepanov <vadimkerr@gmail.com>
Date: Tue, 16 Apr 2024 13:16:35 +0100
Subject: [PATCH] SNOW minor wording & docs URL updates (#4229)

Related to https://github.com/grafana/oncall-private/issues/2615

## 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] Added the relevant release notes label (see labels prefixed w/
`release:`). These labels dictate how your PR will
    show up in the autogenerated release notes.

---------

Co-authored-by: Dominik <dominik.broj@grafana.com>
---
 .pre-commit-config.yaml                       |  1 +
 .../IntegrationForm/IntegrationForm.tsx       | 24 +++++++++++++++++--
 .../ServiceNowAuthSection.tsx                 |  4 +---
 .../ServiceNowConfigDrawer.tsx                | 21 +---------------
 .../ServiceNowTokenSection.tsx                |  5 ++--
 .../ConnectedIntegrationsTable.tsx            | 15 ++++++++----
 6 files changed, 39 insertions(+), 31 deletions(-)

diff --git a/.pre-commit-config.yaml b/.pre-commit-config.yaml
index 9698c79b..726f3590 100644
--- a/.pre-commit-config.yaml
+++ b/.pre-commit-config.yaml
@@ -63,6 +63,7 @@ repos:
           - eslint-plugin-rulesdir@^0.2.1
           - eslint-plugin-unused-imports@^3.1.0
           - "@grafana/eslint-config@^5.0.0"
+          - eslint-plugin-promise@^6.1.1
 
   - repo: https://github.com/pre-commit/mirrors-prettier
     rev: "v2.7.1"
diff --git a/grafana-plugin/src/containers/IntegrationForm/IntegrationForm.tsx b/grafana-plugin/src/containers/IntegrationForm/IntegrationForm.tsx
index 5da39d85..2e3ae349 100644
--- a/grafana-plugin/src/containers/IntegrationForm/IntegrationForm.tsx
+++ b/grafana-plugin/src/containers/IntegrationForm/IntegrationForm.tsx
@@ -38,7 +38,7 @@ import { IntegrationHelper, getIsBidirectionalIntegration } from 'pages/integrat
 import { AppFeature } from 'state/features';
 import { useStore } from 'state/useStore';
 import { UserActions } from 'utils/authorization/authorization';
-import { PLUGIN_ROOT, generateAssignToTeamInputDescription } from 'utils/consts';
+import { PLUGIN_ROOT, generateAssignToTeamInputDescription, DOCS_ROOT } from 'utils/consts';
 import { useIsLoading } from 'utils/hooks';
 import { OmitReadonlyMembers } from 'utils/types';
 
@@ -286,7 +286,17 @@ export const IntegrationForm = observer(
 
           <RenderConditionally shouldRender={isServiceNow && isNew}>
             <div className={styles.serviceNowHeading}>
-              <Text type="primary">ServiceNow configuration</Text>
+              <HorizontalGroup>
+                <Text type="primary">ServiceNow configuration</Text>
+              </HorizontalGroup>
+              <HorizontalGroup>
+                <Text type={'primary'} size={'small'}>
+                  Fill in ServiceNow credentials to be used by Grafana OnCall.{' '}
+                  <a href={`${DOCS_ROOT}/integrations/servicenow/`} target="_blank" rel="noreferrer">
+                    <Text type="link">Read setup guide</Text>
+                  </a>
+                </Text>
+              </HorizontalGroup>
             </div>
 
             <Controller
@@ -346,6 +356,16 @@ export const IntegrationForm = observer(
                 <div className={styles.webhookSwitch}>
                   <Switch value={field.value} onChange={field.onChange} />
                   <Text type="primary"> Create default outgoing webhooks</Text>
+                  <Tooltip
+                    content={
+                      <>
+                        If enabled, all the necessary webhooks will be created automatically. It's highly recommended to
+                        keep this option enabled.
+                      </>
+                    }
+                  >
+                    <Icon name={'info-circle'} />
+                  </Tooltip>
                 </div>
               )}
             />
diff --git a/grafana-plugin/src/containers/ServiceNowConfigDrawer/ServiceNowAuthSection.tsx b/grafana-plugin/src/containers/ServiceNowConfigDrawer/ServiceNowAuthSection.tsx
index 93cc63a5..acd5c0c7 100644
--- a/grafana-plugin/src/containers/ServiceNowConfigDrawer/ServiceNowAuthSection.tsx
+++ b/grafana-plugin/src/containers/ServiceNowConfigDrawer/ServiceNowAuthSection.tsx
@@ -30,9 +30,7 @@ export const ServiceNowAuthSection: React.FC = observer(() => {
         <Alert
           severity={authTestResult ? 'success' : 'error'}
           title={
-            (
-              <Text type="primary">{authTestResult ? 'Connection succeeded' : 'Connection failed'}</Text>
-            ) as unknown as string
+            (<Text type="primary">{authTestResult ? 'Connection OK' : 'Connection failed'}</Text>) as unknown as string
           }
         />
       </RenderConditionally>
diff --git a/grafana-plugin/src/containers/ServiceNowConfigDrawer/ServiceNowConfigDrawer.tsx b/grafana-plugin/src/containers/ServiceNowConfigDrawer/ServiceNowConfigDrawer.tsx
index af3f6b9d..6e88a07f 100644
--- a/grafana-plugin/src/containers/ServiceNowConfigDrawer/ServiceNowConfigDrawer.tsx
+++ b/grafana-plugin/src/containers/ServiceNowConfigDrawer/ServiceNowConfigDrawer.tsx
@@ -2,12 +2,11 @@ import React from 'react';
 
 import { css } from '@emotion/css';
 import { GrafanaTheme2 } from '@grafana/data';
-import { Drawer, Field, HorizontalGroup, Input, VerticalGroup, Icon, useStyles2, Button } from '@grafana/ui';
+import { Drawer, Field, HorizontalGroup, Input, useStyles2, Button } from '@grafana/ui';
 import { observer } from 'mobx-react';
 import { parseUrl } from 'query-string';
 import { Controller, FormProvider, useForm } from 'react-hook-form';
 
-import { Text } from 'components/Text/Text';
 import { ActionKey } from 'models/loader/action-keys';
 import { ApiSchemas } from 'network/oncall-api/api.types';
 import { useCurrentIntegration } from 'pages/integration/OutgoingTab/OutgoingTab.hooks';
@@ -111,24 +110,6 @@ export const ServiceNowConfigDrawer: React.FC<ServiceNowConfigurationDrawerProps
               <ServiceNowStatusSection />
             </div>
 
-            <div className={styles.border}>
-              <VerticalGroup>
-                <HorizontalGroup spacing="xs" align="center">
-                  <Text type="primary" strong>
-                    Labels Mapping
-                  </Text>
-                  <Icon name="info-circle" />
-                </HorizontalGroup>
-
-                <Text>
-                  Description for such object and{' '}
-                  <a href={'#'} target="_blank" rel="noreferrer">
-                    <Text type="link">link to documentation</Text>
-                  </a>
-                </Text>
-              </VerticalGroup>
-            </div>
-
             <div className={styles.border}>
               <ServiceNowTokenSection isDrawer />
             </div>
diff --git a/grafana-plugin/src/containers/ServiceNowConfigDrawer/ServiceNowTokenSection.tsx b/grafana-plugin/src/containers/ServiceNowConfigDrawer/ServiceNowTokenSection.tsx
index 88744a3c..c24c6d2d 100644
--- a/grafana-plugin/src/containers/ServiceNowConfigDrawer/ServiceNowTokenSection.tsx
+++ b/grafana-plugin/src/containers/ServiceNowConfigDrawer/ServiceNowTokenSection.tsx
@@ -11,6 +11,7 @@ import { Text } from 'components/Text/Text';
 import { AlertReceiveChannelHelper } from 'models/alert_receive_channel/alert_receive_channel.helpers';
 import { ActionKey } from 'models/loader/action-keys';
 import { useCurrentIntegration } from 'pages/integration/OutgoingTab/OutgoingTab.hooks';
+import { DOCS_ROOT } from 'utils/consts';
 import { useIsLoading } from 'utils/hooks';
 
 import { getCommonServiceNowConfigStyles } from './ServiceNow.styles';
@@ -42,13 +43,13 @@ export const ServiceNowTokenSection: React.FC<ServiceNowTokenSectionProps> = obs
     <VerticalGroup>
       <HorizontalGroup spacing="xs" align="center">
         <Text type="primary" strong>
-          Generate ServiceNow script
+          Generate ServiceNow Business Rule
         </Text>
       </HorizontalGroup>
 
       <Text>
         Copy and paste the following script to ServiceNow to allow communication between ServiceNow and OnCall{' '}
-        <a href={'#'} target="_blank" rel="noreferrer">
+        <a href={`${DOCS_ROOT}/integrations/servicenow/#create-integration`} target="_blank" rel="noreferrer">
           <Text type="link">Read more</Text>
         </a>
       </Text>
diff --git a/grafana-plugin/src/pages/integration/OutgoingTab/ConnectedIntegrationsTable.tsx b/grafana-plugin/src/pages/integration/OutgoingTab/ConnectedIntegrationsTable.tsx
index 547a403f..55c5cd66 100644
--- a/grafana-plugin/src/pages/integration/OutgoingTab/ConnectedIntegrationsTable.tsx
+++ b/grafana-plugin/src/pages/integration/OutgoingTab/ConnectedIntegrationsTable.tsx
@@ -84,12 +84,19 @@ const ConnectedIntegrationsTable: FC<ConnectedIntegrationsTableProps> = observer
                 <HorizontalGroup>
                   <Text type="secondary">Backsync</Text>
                   {tokenExists ? (
-                    <Tooltip content={<>Switch on to start sending data from other integrations</>}>
-                      {<Icon name={'info-circle'} />}
+                    <Tooltip
+                      content={
+                        <>
+                          Switch on to receive updates from ServiceNow. If disabled, Grafana OnCall will still send
+                          alerts to ServiceNow, but will not receive any updates back.
+                        </>
+                      }
+                    >
+                      <Icon name={'info-circle'} />
                     </Tooltip>
                   ) : (
-                    <Tooltip content={<>Token must be generated to enable backsync</>}>
-                      {<Icon name={'info-circle'} color={colors.error.shade} />}
+                    <Tooltip content={<>ServiceNow Business Rule script must be generated to enable backsync</>}>
+                      <Icon name={'info-circle'} color={colors.error.shade} />
                     </Tooltip>
                   )}
                 </HorizontalGroup>