Feature/ri 4667 telemetry improvements

redisinsight/api/package.json

@@ -23,7 +23,7 @@
     "start": "nest start",
     "start:dev": "cross-env NODE_ENV=development BUILD_TYPE=DOCKER_ON_PREMISE SERVER_STATIC_CONTENT=1 nest start --watch",
     "start:debug": "nest start --debug --watch",
-    "start:stage": "cross-env NODE_ENV=staging SERVER_STATIC_CONTENT=true node dist/src/main",
+    "start:stage": "cross-env NODE_ENV=staging BUILD_TYPE=DOCKER_ON_PREMISE SERVER_STATIC_CONTENT=true node dist/src/main",
     "start:prod": "cross-env NODE_ENV=production node dist/src/main",
     "test": "cross-env NODE_ENV=test ./node_modules/.bin/jest -w 1",
     "test:watch": "cross-env NODE_ENV=test jest --watch -w 1",

redisinsight/api/src/constants/telemetry-events.ts

@@ -72,6 +72,9 @@ export enum TelemetryEvents {
   FeatureFlagConfigUpdateError = 'FEATURE_FLAG_CONFIG_UPDATE_ERROR',
   FeatureFlagInvalidRemoteConfig = 'FEATURE_FLAG_INVALID_REMOTE_CONFIG',
   FeatureFlagRecalculated = 'FEATURE_FLAG_RECALCULATED',
+
+  // Insights
+  InsightsRecommendationGenerated = 'INSIGHTS_RECOMMENDATION_GENERATED',
 }
 
 export enum CommandType {

redisinsight/api/src/modules/database-recommendation/database-recommendation.analytics.spec.ts

@@ -0,0 +1,48 @@
+import { Test, TestingModule } from '@nestjs/testing';
+import { EventEmitter2 } from '@nestjs/event-emitter';
+import {
+  mockDatabase,
+  mockDatabaseRecommendation,
+  mockDatabaseWithTlsAuth,
+} from 'src/__mocks__';
+import { TelemetryEvents } from 'src/constants';
+import { DatabaseRecommendationAnalytics } from './database-recommendation.analytics';
+
+const provider = 'cloud';
+
+describe('DatabaseRecommendationAnalytics', () => {
+  let service: DatabaseRecommendationAnalytics;
+  let sendEventSpy;
+  let sendFailedEventSpy;
+
+  beforeEach(async () => {
+    const module: TestingModule = await Test.createTestingModule({
+      providers: [
+        EventEmitter2,
+        DatabaseRecommendationAnalytics,
+      ],
+    }).compile();
+
+    service = await module.get(DatabaseRecommendationAnalytics);
+    sendEventSpy = jest.spyOn(service as any, 'sendEvent');
+    sendFailedEventSpy = jest.spyOn(service as any, 'sendFailedEvent');
+  });
+
+  describe('sendInstanceAddedEvent', () => {
+    it('should emit event with recommendationName and provider', () => {
+      service.sendCreatedRecommendationEvent(
+        mockDatabaseRecommendation,
+        mockDatabaseWithTlsAuth,
+      );
+
+      expect(sendEventSpy).toHaveBeenCalledWith(
+        TelemetryEvents.InsightsRecommendationGenerated,
+        {
+          recommendationName: mockDatabaseRecommendation.name,
+          databaseId: mockDatabase.id,
+          provider: mockDatabaseWithTlsAuth.provider,
+        },
+      );
+    });
+  });
+});

redisinsight/api/src/modules/database-recommendation/database-recommendation.analytics.ts

@@ -0,0 +1,28 @@
+import { Injectable } from '@nestjs/common';
+import { EventEmitter2 } from '@nestjs/event-emitter';
+import { TelemetryBaseService } from 'src/modules/analytics/telemetry.base.service';
+import { TelemetryEvents } from 'src/constants';
+import { DatabaseRecommendation } from './models';
+import { Database } from '../database/models/database';
+
+@Injectable()
+export class DatabaseRecommendationAnalytics extends TelemetryBaseService {
+  constructor(protected eventEmitter: EventEmitter2) {
+    super(eventEmitter);
+  }
+
+  sendCreatedRecommendationEvent(recommendation: DatabaseRecommendation, database: Database): void {
+    try {
+      this.sendEvent(
+        TelemetryEvents.InsightsRecommendationGenerated,
+        {
+          recommendationName: recommendation.name,
+          databaseId: database.id,
+          provider: database.provider,
+        },
+      );
+    } catch (e) {
+      // ignore
+    }
+  }
+}

redisinsight/api/src/modules/database-recommendation/database-recommendation.module.ts

@@ -10,6 +10,7 @@ import { DatabaseRecommendationGateway } from 'src/modules/database-recommendati
 import {
   DatabaseRecommendationEmitter,
 } from 'src/modules/database-recommendation/providers/database-recommendation.emitter';
+import { DatabaseRecommendationAnalytics } from 'src/modules/database-recommendation/database-recommendation.analytics';
 
 @Module({})
 export class DatabaseRecommendationModule {
@@ -25,6 +26,7 @@ export class DatabaseRecommendationModule {
         RecommendationProvider,
         DatabaseRecommendationGateway,
         DatabaseRecommendationEmitter,
+        DatabaseRecommendationAnalytics,
         {
           provide: DatabaseRecommendationRepository,
           useClass: databaseRecommendationRepository,

redisinsight/api/src/modules/database-recommendation/database-recommendation.service.ts

@@ -11,6 +11,7 @@ import {
 } from 'src/modules/database-recommendation/dto/database-recommendations.response';
 import { Recommendation } from 'src/modules/database-analysis/models/recommendation';
 import { ModifyDatabaseRecommendationDto, DeleteDatabaseRecommendationResponse } from './dto';
+import { DatabaseRecommendationAnalytics } from './database-recommendation.analytics';
 import { DatabaseService } from '../database/database.service';
 
 @Injectable()
@@ -21,19 +22,22 @@ export class DatabaseRecommendationService {
     private readonly databaseRecommendationRepository: DatabaseRecommendationRepository,
     private readonly scanner: RecommendationScanner,
     private readonly databaseService: DatabaseService,
+    private readonly analytics: DatabaseRecommendationAnalytics,
   ) {}
 
   /**
    * Create recommendation entity
    * @param clientMetadata
-   * @param recommendationName
+   * @param entity
    */
-  public async create(clientMetadata: ClientMetadata, recommendationName: string): Promise<DatabaseRecommendation> {
-    const entity = plainToClass(
-      DatabaseRecommendation,
-      { databaseId: clientMetadata?.databaseId, name: recommendationName },
-    );
-    return this.databaseRecommendationRepository.create(entity);
+  public async create(clientMetadata: ClientMetadata, entity: DatabaseRecommendation): Promise<DatabaseRecommendation> {
+    const recommendation = await this.databaseRecommendationRepository.create(entity);
+
+    const database = await this.databaseService.get(clientMetadata?.databaseId);
+
+    this.analytics.sendCreatedRecommendationEvent(recommendation, database);
+
+    return recommendation;
   }
 
   /**
@@ -74,7 +78,7 @@ export class DatabaseRecommendationService {
           { databaseId: newClientMetadata?.databaseId, ...recommendation },
         );
 
-        return await this.databaseRecommendationRepository.create(entity);
+        return await this.create(newClientMetadata, entity);
       }
     }
 

redisinsight/ui/src/components/live-time-recommendations/components/recommendation/Recommendation.tsx

@@ -135,12 +135,27 @@ const Recommendation = ({
     setIsLoading(false)
   }
 
+  const onRecommendationLinkClick = () => {
+    sendEventTelemetry({
+      event: TelemetryEvent.INSIGHTS_RECOMMENDATION_LINK_CLICKED,
+      eventData: {
+        databaseId: instanceId,
+        name: recommendationsContent[name]?.telemetryEvent ?? name,
+        provider
+      }
+    })
+    setIsLoading(false)
+  }
+
   const recommendationContent = () => (
     <EuiText>
       {renderRecommendationContent(
         recommendationsContent[name]?.content,
         params,
-        recommendationsContent[name]?.telemetryEvent ?? name,
+        {
+          onClickLink: onRecommendationLinkClick,
+          telemetryName: recommendationsContent[name]?.telemetryEvent ?? name,
+        },
         true
       )}
       {!!params?.keys?.length && (

redisinsight/ui/src/components/recommendation-voting/RecommendationVoting.tsx

@@ -31,7 +31,7 @@ const RecommendationVoting = ({ vote, name, id = '', live = false, containerClas
       gutterSize={live ? 'none' : 'l'}
       data-testid="recommendation-voting"
     >
-      <EuiText size="m">Is this useful?</EuiText>
+      <EuiText size="m" className={cx({ [styles.highlightText]: live })}>Is this useful?</EuiText>
       <div className="voteContent">
         {Object.values(Vote).map((option) => (
           <VoteOption

redisinsight/ui/src/components/recommendation-voting/styles.module.scss

@@ -29,3 +29,6 @@
   }
 }
 
+div.highlightText {
+  color: var(--euiColorPrimary) !important;
+}

redisinsight/ui/src/telemetry/events.ts

@@ -237,4 +237,5 @@ export enum TelemetryEvent {
   INSIGHTS_RECOMMENDATION_SHOW_HIDDEN = 'INSIGHTS_RECOMMENDATION_SHOW_HIDDEN',
   INSIGHTS_RECOMMENDATION_DATABASE_ANALYSIS_CLICKED = 'INSIGHTS_RECOMMENDATION_DATABASE_ANALYSIS_CLICKED',
   INSIGHTS_RECOMMENDATION_KEY_COPIED = 'INSIGHTS_RECOMMENDATION_KEY_COPIED',
+  INSIGHTS_RECOMMENDATION_LINK_CLICKED = 'INSIGHTS_RECOMMENDATION_LINK_CLICKED',
 }

redisinsight/ui/src/utils/recommendation/utils.tsx

@@ -23,6 +23,11 @@ const recommendationsContent = _content as IRecommendationsStatic
 const utmSource = 'redisinsight'
 const utmMedium = 'recommendation'
 
+interface ITelemetry {
+  telemetryName: string
+  onClickLink?: () => void
+}
+
 const badgesContent = [
   { id: 'code_changes', icon: <CodeIcon className={styles.badgeIcon} />, name: 'Code Changes' },
   { id: 'configuration_changes', icon: <ConfigurationIcon className={styles.badgeIcon} />, name: 'Configuration Changes' },
@@ -87,7 +92,7 @@ const addUtmToLink = (href: string, telemetryName: string): string => {
 const renderContentElement = (
   { type, value: jsonValue, parameter }: IRecommendationContent,
   params: any,
-  telemetryName: string,
+  telemetry: ITelemetry,
   insights: boolean,
   idx: number
 ) => {
@@ -96,8 +101,8 @@ const renderContentElement = (
     case 'paragraph':
       return (
         <EuiTextColor
-          data-testid={`paragraph-${telemetryName}-${idx}`}
-          key={`${telemetryName}-${idx}`}
+          data-testid={`paragraph-${telemetry.telemetryName}-${idx}`}
+          key={`${telemetry.telemetryName}-${idx}`}
           component="div"
           className={cx(styles.text, { [styles.insights]: insights })}
           color="subdued"
@@ -108,9 +113,9 @@ const renderContentElement = (
     case 'code':
       return (
         <EuiTextColor
-          data-testid={`code-${telemetryName}-${idx}`}
+          data-testid={`code-${telemetry.telemetryName}-${idx}`}
           className={cx(styles.code, { [styles.insights]: insights })}
-          key={`${telemetryName}-${idx}`}
+          key={`${telemetry.telemetryName}-${idx}`}
           color="subdued"
         >
           <code className={cx(styles.span, styles.text)}>
@@ -121,8 +126,8 @@ const renderContentElement = (
     case 'span':
       return (
         <EuiTextColor
-          data-testid={`span-${telemetryName}-${idx}`}
-          key={`${telemetryName}-${idx}`}
+          data-testid={`span-${telemetry.telemetryName}-${idx}`}
+          key={`${telemetry.telemetryName}-${idx}`}
           color="subdued"
           className={cx(styles.span, styles.text, { [styles.insights]: !!insights })}
         >
@@ -132,23 +137,24 @@ const renderContentElement = (
     case 'link':
       return (
         <EuiLink
-          key={`${telemetryName}-${idx}`}
+          key={`${telemetry.telemetryName}-${idx}`}
           external={false}
-          data-testid={`link-${telemetryName}-${idx}`}
+          data-testid={`link-${telemetry.telemetryName}-${idx}`}
           target="_blank"
-          href={addUtmToLink(value.href, telemetryName)}
+          href={addUtmToLink(value.href, telemetry.telemetryName)}
+          onClick={() => telemetry.onClickLink?.()}
         >
           {value.name}
         </EuiLink>
       )
     case 'code-link':
       return (
         <EuiLink
-          key={`${telemetryName}-${idx}`}
+          key={`${telemetry.telemetryName}-${idx}`}
           external={false}
-          data-testid={`code-link-${telemetryName}-${idx}`}
+          data-testid={`code-link-${telemetry.telemetryName}-${idx}`}
           target="_blank"
-          href={addUtmToLink(value.href, telemetryName)}
+          href={addUtmToLink(value.href, telemetry.telemetryName)}
         >
           <EuiTextColor
             className={cx(styles.code, { [styles.insights]: insights })}
@@ -163,21 +169,25 @@ const renderContentElement = (
     case 'spacer':
       return (
         <EuiSpacer
-          data-testid={`spacer-${telemetryName}-${idx}`}
-          key={`${telemetryName}-${idx}`}
+          data-testid={`spacer-${telemetry.telemetryName}-${idx}`}
+          key={`${telemetry.telemetryName}-${idx}`}
           size={value as SpacerSize}
         />
       )
     case 'list':
       return (
-        <ul className={styles.list} data-testid={`list-${telemetryName}-${idx}`} key={`${telemetryName}-${idx}`}>
+        <ul
+          className={styles.list}
+          data-testid={`list-${telemetry.telemetryName}-${idx}`}
+          key={`${telemetry.telemetryName}-${idx}`}
+        >
           {isArray(jsonValue) && jsonValue.map((listElement: IRecommendationContent[], idx) => (
             <li
               className={cx(styles.listItem, { [styles.insights]: insights })}
               // eslint-disable-next-line react/no-array-index-key
               key={`list-item-${listElement[0]}-${idx}`}
             >
-              {renderRecommendationContent(listElement, params, telemetryName, insights)}
+              {renderRecommendationContent(listElement, params, telemetry, insights)}
             </li>
           ))}
         </ul>
@@ -190,10 +200,10 @@ const renderContentElement = (
 const renderRecommendationContent = (
   elements: IRecommendationContent[] = [],
   params: any,
-  telemetryName: string,
+  telemetry: ITelemetry,
   insights: boolean = false
 ) => (
-  elements?.map((item, idx) => renderContentElement(item, params, telemetryName, insights, idx)))
+  elements?.map((item, idx) => renderContentElement(item, params, telemetry, insights, idx)))
 
 const sortRecommendations = (recommendations: any[]) => sortBy(recommendations, [
   ({ name }) => name !== 'searchJSON',

redisinsight/ui/src/utils/tests/recommendation/utils.spec.tsx

@@ -1,4 +1,4 @@
-import { render, screen } from 'uiSrc/utils/test-utils'
+import { fireEvent, render, screen } from 'uiSrc/utils/test-utils'
 import {
   addUtmToLink,
   sortRecommendations,
@@ -198,7 +198,7 @@ describe('replaceVariables', () => {
 
 describe('renderRecommendationContent', () => {
   it('should render content', () => {
-    const renderedContent = renderRecommendationContent(mockContent, undefined, mockTelemetryName)
+    const renderedContent = renderRecommendationContent(mockContent, undefined, { telemetryName: mockTelemetryName })
     render(renderedContent)
 
     expect(screen.queryByTestId(`paragraph-${mockTelemetryName}-0`)).toBeInTheDocument()
@@ -210,4 +210,18 @@ describe('renderRecommendationContent', () => {
     expect(screen.queryByTestId(`code-link-${mockTelemetryName}-7`)).toBeInTheDocument()
     expect(screen.getByText('unknown')).toBeInTheDocument()
   })
+
+  it('click on link should call onClick', () => {
+    const onClickMock = jest.fn()
+    const renderedContent = renderRecommendationContent(
+      mockContent,
+      null,
+      { telemetryName: mockTelemetryName, onClickLink: onClickMock },
+    )
+    const { queryByTestId } = render(renderedContent)
+
+    fireEvent.click(queryByTestId(`link-${mockTelemetryName}-6`))
+
+    expect(onClickMock).toBeCalled()
+  })
 })