Merge pull request #268 from RedisInsight/feature/RI-6910/disable-cloud-ads

RI-6910: disable cloud ads based on config

Author: KrumTy

.env

@@ -19,5 +19,6 @@ RI_ANALYTICS_START_EVENTS=true
 RI_AGREEMENTS_PATH='../../webviews/resources/agreements-spec.json'
 RI_ENCRYPTION_KEYTAR_SERVICE="redis-for-vscode"
 RI_SOCKETS_CORS=true
+RI_FEATURES_CLOUD_ADS_DEFAULT_FLAG=true
 # RI_SEGMENT_WRITE_KEY='SEGMENT_WRITE_KEY'
 

src/webviews/src/actions/oauthCallback.ts

@@ -1,5 +1,5 @@
 import { INFINITE_MESSAGES } from 'uiSrc/components'
-import { CloudAuthStatus, CloudJobName, CloudJobStep, OAuthSocialAction, StorageItem } from 'uiSrc/constants'
+import { CLOUD_ADS, CloudAuthStatus, CloudJobName, CloudJobStep, OAuthSocialAction, StorageItem } from 'uiSrc/constants'
 import { CustomError } from 'uiSrc/interfaces'
 import { CloudAuthResponse } from 'uiSrc/modules/oauth/interfaces'
 import { localStorageService } from 'uiSrc/services'
@@ -9,6 +9,10 @@ import { getApiErrorMessage, parseCustomError, removeInfinityToast, showErrorInf
 let isFlowInProgress = false
 
 export const processOauthCallback = ({ status, message = '', error }: CloudAuthResponse) => {
+  if (!CLOUD_ADS) {
+    return
+  }
+
   const {
     ssoFlow,
     isRecommendedSettings,

src/webviews/src/components/no-databases/NoDatabases.tsx

@@ -4,7 +4,7 @@ import * as l10n from '@vscode/l10n'
 
 import { PromoLink } from 'uiSrc/ui'
 import { vscodeApi } from 'uiSrc/services'
-import { OAuthSocialSource, VscodeMessageAction } from 'uiSrc/constants'
+import { CLOUD_ADS, OAuthSocialSource, VscodeMessageAction } from 'uiSrc/constants'
 import { sendEventTelemetry, TelemetryEvent } from 'uiSrc/utils'
 import { useAppInfoStore } from 'uiSrc/store/hooks/use-app-info-store/useAppInfoStore'
 import DockerIcon from 'uiSrc/assets/database/docker.svg?react'
@@ -64,7 +64,7 @@ export const NoDatabases: FC = () => {
         <h2 className="pb-3 text-[24px]">
           {l10n.t('Links')}
         </h2>
-        {contentCloud && (
+        {CLOUD_ADS && contentCloud && (
           <PromoLink Icon={LogoSvg} onClick={handleClickFree} {...contentCloud} />
         )}
         {contentDocker && (

src/webviews/src/constants/environment/environment.ts

@@ -4,6 +4,7 @@ import { toNumber } from 'lodash'
 export const BASE_APP_URL = import.meta.env.RI_BASE_APP_URL || 'http://localhost'
 export const APP_PORT = toNumber(window.ri?.appPort) || import.meta.env.RI_APP_PORT || 5541
 export const APP_PREFIX = import.meta.env.RI_APP_PREFIX || 'api'
+export const CLOUD_ADS = import.meta.env.RI_FEATURES_CLOUD_ADS_DEFAULT_FLAG !== 'false'
 
 const isDevelopment = import.meta.env.NODE_ENV === 'development'
 const hostedApiBaseUrl = import.meta.env.RI_HOSTED_API_BASE_URL

src/webviews/src/constants/window/helpTexts.tsx

@@ -4,7 +4,7 @@ import * as l10n from '@vscode/l10n'
 import { Link } from 'react-router-dom'
 
 import { getUtmExternalLink } from 'uiSrc/utils'
-import { EXTERNAL_LINKS, UTM_CAMPAIGNS } from 'uiSrc/constants'
+import { CLOUD_ADS, EXTERNAL_LINKS, UTM_CAMPAIGNS } from 'uiSrc/constants'
 import styles from 'uiSrc/components/popover-delete/styles.module.scss'
 
 export const helpTexts = {
@@ -23,16 +23,20 @@ export const helpTexts = {
       >
         {l10n.t('here. ')}
       </Link>
-      {l10n.t('You can also create a ')}
-      <Link
-        onClick={onFreeTrialDbClick}
-        className="underline hover:no-underline"
-        data-testid="no-json-module-create-free-db"
-        to=""
-      >
-        {l10n.t('free trial Redis Cloud database')}
-      </Link>
-      {l10n.t(' with built-in JSON support.')}
+      {CLOUD_ADS && (
+        <>
+          {l10n.t('You can also create a ')}
+          <Link
+            onClick={onFreeTrialDbClick}
+            className="underline hover:no-underline"
+            data-testid="no-json-module-create-free-db"
+            to=""
+          >
+            {l10n.t('free trial Redis Cloud database')}
+          </Link>
+          {l10n.t(' with built-in JSON support.')}
+        </>
+      )}
     </>
   ),
   REMOVE_LAST_ELEMENT: (fieldType: string) => (

src/webviews/src/pages/AddDatabasePage/AddDatabasePage.tsx

@@ -2,7 +2,7 @@ import { VSCodeDivider } from '@vscode/webview-ui-toolkit/react'
 import React, { FC, useEffect } from 'react'
 import * as l10n from '@vscode/l10n'
 
-import { OAuthSocialSource } from 'uiSrc/constants'
+import { CLOUD_ADS, OAuthSocialSource } from 'uiSrc/constants'
 import { CommonAppSubscription, DatabasePanel } from 'uiSrc/modules'
 import { OAuthCreateFreeDb, OAuthSsoDialog, OAuthJobs, OAuthSelectPlan } from 'uiSrc/modules/oauth'
 import { fetchCerts } from 'uiSrc/store'
@@ -22,13 +22,17 @@ export const AddDatabasePage: FC<any> = () => {
         {l10n.t('Add Redis database')}
       </h1>
       <VSCodeDivider className="divider" />
-      <OAuthJobs />
-      <CommonAppSubscription />
-      <OAuthSsoDialog />
-      <OAuthCreateFreeDb source={OAuthSocialSource.AddDbForm} />
-      <VSCodeDivider className="divider" />
+      {CLOUD_ADS && (
+        <>
+          <OAuthJobs />
+          <CommonAppSubscription />
+          <OAuthSsoDialog />
+          <OAuthCreateFreeDb source={OAuthSocialSource.AddDbForm} />
+          <OAuthSelectPlan />
+          <VSCodeDivider className="divider" />
+        </>
+      )}
       <DatabasePanel />
-      <OAuthSelectPlan />
     </div>
   )
 }

src/webviews/src/pages/AddKeyPage/AddKeyPage.tsx

@@ -1,4 +1,5 @@
 import React, { FC } from 'react'
+import { CLOUD_ADS } from 'uiSrc/constants'
 import { AddKey } from 'uiSrc/modules'
 import { KeysStoreProvider } from 'uiSrc/modules/keys-tree/hooks/useKeys'
 import { OAuthSsoDialog } from 'uiSrc/modules/oauth'
@@ -9,7 +10,7 @@ export const AddKeyPage: FC<any> = () => (
     <ContextStoreProvider>
       <KeysStoreProvider>
         <AddKey />
-        <OAuthSsoDialog />
+        {CLOUD_ADS && <OAuthSsoDialog />}
       </KeysStoreProvider>
     </ContextStoreProvider>
   </div>

src/webviews/src/pages/SidebarPage/SidebarPage.tsx

@@ -5,7 +5,7 @@ import { DatabaseWrapper } from 'uiSrc/modules'
 import { useDatabasesStore } from 'uiSrc/store'
 import { useAppInfoStore } from 'uiSrc/store/hooks/use-app-info-store/useAppInfoStore'
 import { OAuthCreateFreeDb } from 'uiSrc/modules/oauth'
-import { OAuthSocialSource } from 'uiSrc/constants'
+import { CLOUD_ADS, OAuthSocialSource } from 'uiSrc/constants'
 
 export const SidebarPage: FC<any> = () => {
   const databases = useDatabasesStore((state) => state.data)
@@ -20,7 +20,7 @@ export const SidebarPage: FC<any> = () => {
 
   return (
     <div className="flex w-full flex-wrap flex-col min-h-full text-vscode-icon-foreground" data-testid="tree-view-page">
-      <OAuthCreateFreeDb compressed source={OAuthSocialSource.DatabasesList} />
+      {CLOUD_ADS && <OAuthCreateFreeDb compressed source={OAuthSocialSource.DatabasesList} />}
       {databases.map((database) => (
         <DatabaseWrapper database={database} key={database.id} />
       ))}

src/webviews/src/pages/WelcomePage/WelcomePage.tsx

@@ -5,7 +5,7 @@ import { VscAdd } from 'react-icons/vsc'
 import { Link, PromoLink, Separator, Spacer } from 'uiSrc/ui'
 import { vscodeApi } from 'uiSrc/services'
 import { sendEventTelemetry, TelemetryEvent } from 'uiSrc/utils'
-import { OAuthSocialSource, VscodeMessageAction } from 'uiSrc/constants'
+import { CLOUD_ADS, OAuthSocialSource, VscodeMessageAction } from 'uiSrc/constants'
 import { useAppInfoStore } from 'uiSrc/store/hooks/use-app-info-store/useAppInfoStore'
 import DockerIcon from 'uiSrc/assets/database/docker.svg?react'
 import GithubIcon from 'uiSrc/assets/database/github.svg?react'
@@ -69,7 +69,7 @@ export const WelcomePage: FC = () => {
               <Spacer size="xl" />
 
               <h3>{l10n.t('Create new database')}</h3>
-              {contentCloud && (
+              {CLOUD_ADS && contentCloud && (
                 <PromoLink Icon={ShortLogoSvg} onClick={handleClickFree} {...contentCloud} />
               )}
               {contentDocker && (