#RI-2733-update filtered event (#556)

AmirAllayarovSofteq · web-flow · commit 9f173d7fd0a6 · 2022-04-22T14:49:02.000+03:00
* #RI-2733-update filtered event
diff --git a/redisinsight/ui/src/pages/browser/components/hash-details/HashDetails.tsx b/redisinsight/ui/src/pages/browser/components/hash-details/HashDetails.tsx
@@ -12,7 +12,7 @@ import {
   updateHashFieldsAction,
 } from 'uiSrc/slices/hash'
 import { formatLongName, Nullable } from 'uiSrc/utils'
-import { sendEventTelemetry, TelemetryEvent, getBasedOnViewTypeEvent } from 'uiSrc/telemetry'
+import { sendEventTelemetry, TelemetryEvent, getBasedOnViewTypeEvent, getMatchType } from 'uiSrc/telemetry'
 import VirtualTable from 'uiSrc/components/virtual-table/VirtualTable'
 import InlineItemEditor from 'uiSrc/components/inline-item-editor/InlineItemEditor'
 import {
@@ -25,6 +25,7 @@ import { connectedInstanceSelector } from 'uiSrc/slices/instances'
 import { SCAN_COUNT_DEFAULT } from 'uiSrc/constants/api'
 import HelpTexts from 'uiSrc/constants/help-texts'
 import {
+  GetHashFieldsResponse,
   AddFieldsToHashDto,
   HashFieldDto,
 } from 'apiSrc/modules/browser/dto/hash.dto'
@@ -126,8 +127,24 @@ const HashDetails = (props: Props) => {
     const fieldColumn = search.find((column) => column.id === 'field')
     if (fieldColumn) {
       const { value: match } = fieldColumn
+      const onSuccess = (data: GetHashFieldsResponse) => {
+        const matchValue = getMatchType(match)
+        sendEventTelemetry({
+          event: getBasedOnViewTypeEvent(
+            viewType,
+            TelemetryEvent.BROWSER_KEY_VALUE_FILTERED,
+            TelemetryEvent.TREE_VIEW_KEY_VALUE_FILTERED
+          ),
+          eventData: {
+            databaseId: instanceId,
+            keyType: KeyTypes.Hash,
+            match: matchValue,
+            length: data.total,
+          }
+        })
+      }
       setMatch(match)
-      dispatch(fetchHashFields(key, 0, SCAN_COUNT_DEFAULT, match || matchAllValue))
+      dispatch(fetchHashFields(key, 0, SCAN_COUNT_DEFAULT, match || matchAllValue, onSuccess))
     }
   }
 
diff --git a/redisinsight/ui/src/pages/browser/components/list-details/ListDetails.tsx b/redisinsight/ui/src/pages/browser/components/list-details/ListDetails.tsx
@@ -14,12 +14,15 @@ import {
   updateListValueStateSelector,
   fetchSearchingListElementAction,
 } from 'uiSrc/slices/list'
+import { connectedInstanceSelector } from 'uiSrc/slices/instances'
+import { sendEventTelemetry, TelemetryEvent, getBasedOnViewTypeEvent } from 'uiSrc/telemetry'
+import { KeyTypes } from 'uiSrc/constants'
 import {
   ITableColumn,
   IColumnSearchState,
 } from 'uiSrc/components/virtual-table/interfaces'
 import { formatLongName, validateListIndex } from 'uiSrc/utils'
-import { selectedKeyDataSelector } from 'uiSrc/slices/keys'
+import { selectedKeyDataSelector, keysSelector } from 'uiSrc/slices/keys'
 import { NoResultsFoundText } from 'uiSrc/constants/texts'
 import VirtualTable from 'uiSrc/components/virtual-table/VirtualTable'
 import InlineItemEditor from 'uiSrc/components/inline-item-editor/InlineItemEditor'
@@ -53,6 +56,8 @@ const ListDetails = (props: Props) => {
   )
 
   const { name: key } = useSelector(selectedKeyDataSelector) ?? { name: '' }
+  const { id: instanceId } = useSelector(connectedInstanceSelector)
+  const { viewType } = useSelector(keysSelector)
 
   const dispatch = useDispatch()
 
@@ -91,6 +96,20 @@ const ListDetails = (props: Props) => {
 
   const handleSearch = (search: IColumnSearchState[]) => {
     const indexColumn = search.find((column) => column.id === 'index')
+    const onSuccess = () => {
+      sendEventTelemetry({
+        event: getBasedOnViewTypeEvent(
+          viewType,
+          TelemetryEvent.BROWSER_KEY_VALUE_FILTERED,
+          TelemetryEvent.TREE_VIEW_KEY_VALUE_FILTERED
+        ),
+        eventData: {
+          databaseId: instanceId,
+          keyType: KeyTypes.List,
+          match: 'EXACT_VALUE_NAME',
+        }
+      })
+    }
 
     if (!indexColumn?.value) {
       dispatch(fetchListElements(key, 0, SCAN_COUNT_DEFAULT))
@@ -102,7 +121,8 @@ const ListDetails = (props: Props) => {
       dispatch(
         fetchSearchingListElementAction(
           key,
-          value ? +value : initSearchingIndex
+          value ? +value : initSearchingIndex,
+          onSuccess
         )
       )
     }
diff --git a/redisinsight/ui/src/pages/browser/components/set-details/SetDetails.tsx b/redisinsight/ui/src/pages/browser/components/set-details/SetDetails.tsx
@@ -8,7 +8,7 @@ import {
 
 import { formatLongName } from 'uiSrc/utils'
 import { KeyTypes } from 'uiSrc/constants'
-import { sendEventTelemetry, TelemetryEvent, getBasedOnViewTypeEvent } from 'uiSrc/telemetry'
+import { sendEventTelemetry, TelemetryEvent, getBasedOnViewTypeEvent, getMatchType } from 'uiSrc/telemetry'
 import { connectedInstanceSelector } from 'uiSrc/slices/instances'
 import { selectedKeyDataSelector, keysSelector } from 'uiSrc/slices/keys'
 import {
@@ -24,6 +24,7 @@ import { NoResultsFoundText } from 'uiSrc/constants/texts'
 import { IColumnSearchState, ITableColumn } from 'uiSrc/components/virtual-table/interfaces'
 import VirtualTable from 'uiSrc/components/virtual-table/VirtualTable'
 import PopoverDelete from 'uiSrc/pages/browser/components/popover-delete/PopoverDelete'
+import { GetSetMembersResponse } from 'apiSrc/modules/browser/dto/set.dto'
 
 import styles from './styles.module.scss'
 
@@ -82,8 +83,24 @@ const SetDetails = (props: Props) => {
     if (!fieldColumn) { return }
 
     const { value: match } = fieldColumn
+    const onSuccess = (data: GetSetMembersResponse) => {
+      const matchValue = getMatchType(match)
+      sendEventTelemetry({
+        event: getBasedOnViewTypeEvent(
+          viewType,
+          TelemetryEvent.BROWSER_KEY_VALUE_FILTERED,
+          TelemetryEvent.TREE_VIEW_KEY_VALUE_FILTERED
+        ),
+        eventData: {
+          databaseId: instanceId,
+          keyType: KeyTypes.Set,
+          match: matchValue,
+          length: data.total,
+        }
+      })
+    }
     setMatch(match)
-    dispatch(fetchSetMembers(key, 0, SCAN_COUNT_DEFAULT, match || matchAllValue))
+    dispatch(fetchSetMembers(key, 0, SCAN_COUNT_DEFAULT, match || matchAllValue, onSuccess))
   }
 
   const columns:ITableColumn[] = [
diff --git a/redisinsight/ui/src/pages/browser/components/zset-details/ZSetDetails.tsx b/redisinsight/ui/src/pages/browser/components/zset-details/ZSetDetails.tsx
@@ -21,12 +21,12 @@ import HelpTexts from 'uiSrc/constants/help-texts'
 import { NoResultsFoundText } from 'uiSrc/constants/texts'
 import { selectedKeyDataSelector, keysSelector } from 'uiSrc/slices/keys'
 import { formatLongName, validateScoreNumber } from 'uiSrc/utils'
-import { sendEventTelemetry, TelemetryEvent, getBasedOnViewTypeEvent } from 'uiSrc/telemetry'
+import { sendEventTelemetry, TelemetryEvent, getBasedOnViewTypeEvent, getMatchType } from 'uiSrc/telemetry'
 import { connectedInstanceSelector } from 'uiSrc/slices/instances'
 import VirtualTable from 'uiSrc/components/virtual-table/VirtualTable'
 import InlineItemEditor from 'uiSrc/components/inline-item-editor/InlineItemEditor'
 import { IColumnSearchState, ITableColumn } from 'uiSrc/components/virtual-table/interfaces'
-import { AddMembersToZSetDto, ZSetMemberDto } from 'apiSrc/modules/browser/dto'
+import { AddMembersToZSetDto, SearchZSetMembersResponse, ZSetMemberDto } from 'apiSrc/modules/browser/dto'
 import PopoverDelete from '../popover-delete/PopoverDelete'
 
 import styles from './styles.module.scss'
@@ -124,6 +124,22 @@ const ZSetDetails = (props: Props) => {
     if (!fieldColumn) { return }
 
     const { value: match } = fieldColumn
+    const onSuccess = (data: SearchZSetMembersResponse) => {
+      const matchValue = getMatchType(match)
+      sendEventTelemetry({
+        event: getBasedOnViewTypeEvent(
+          viewType,
+          TelemetryEvent.BROWSER_KEY_VALUE_FILTERED,
+          TelemetryEvent.TREE_VIEW_KEY_VALUE_FILTERED
+        ),
+        eventData: {
+          databaseId: instanceId,
+          keyType: KeyTypes.ZSet,
+          match: matchValue,
+          length: data.total,
+        }
+      })
+    }
     setMatch(match)
     if (match === '') {
       dispatch(
@@ -132,7 +148,7 @@ const ZSetDetails = (props: Props) => {
       return
     }
     dispatch(
-      fetchSearchZSetMembers(key, 0, SCAN_COUNT_DEFAULT, match)
+      fetchSearchZSetMembers(key, 0, SCAN_COUNT_DEFAULT, match, onSuccess)
     )
   }
 
diff --git a/redisinsight/ui/src/slices/hash.ts b/redisinsight/ui/src/slices/hash.ts
@@ -3,7 +3,7 @@ import { cloneDeep, remove, isNull } from 'lodash'
 import { apiService } from 'uiSrc/services'
 import { ApiEndpoints, KeyTypes } from 'uiSrc/constants'
 import { getApiErrorMessage, getUrl, isStatusSuccessful } from 'uiSrc/utils'
-import { getBasedOnViewTypeEvent, getMatchType, sendEventTelemetry, TelemetryEvent } from 'uiSrc/telemetry'
+import { getBasedOnViewTypeEvent, sendEventTelemetry, TelemetryEvent } from 'uiSrc/telemetry'
 import { SCAN_COUNT_DEFAULT } from 'uiSrc/constants/api'
 import successMessages from 'uiSrc/components/notifications/success-messages'
 import {
@@ -188,7 +188,8 @@ export function fetchHashFields(
   key: string,
   cursor: number,
   count: number,
-  match: string
+  match: string,
+  onSuccess?: (data: GetHashFieldsResponse) => void,
 ) {
   return async (dispatch: AppDispatch, stateInit: () => RootState) => {
     dispatch(loadHashFields(isNull(match) ? '*' : match))
@@ -209,23 +210,9 @@ export function fetchHashFields(
       )
 
       if (isStatusSuccessful(status)) {
-        const matchValue = getMatchType(match)
-        sendEventTelemetry({
-          event: getBasedOnViewTypeEvent(
-            state.browser.keys?.viewType,
-            TelemetryEvent.BROWSER_KEY_VALUE_FILTERED,
-            TelemetryEvent.TREE_VIEW_KEY_VALUE_FILTERED
-          ),
-          eventData: {
-            databaseId: state.connections.instances?.connectedInstance?.id,
-            keyType: KeyTypes.Hash,
-            match: matchValue,
-            length: data.total,
-          }
-        })
-
         dispatch(loadHashFieldsSuccess(data))
         dispatch(updateSelectedKeyRefreshTime(Date.now()))
+        onSuccess?.(data)
       }
     } catch (error) {
       const errorMessage = getApiErrorMessage(error)
diff --git a/redisinsight/ui/src/slices/list.ts b/redisinsight/ui/src/slices/list.ts
@@ -282,7 +282,8 @@ export function fetchMoreListElements(
 // Asynchronous thunk actions
 export function fetchSearchingListElementAction(
   key: string,
-  index: Nullable<number>
+  index: Nullable<number>,
+  onSuccess?: () => void,
 ) {
   return async (dispatch: AppDispatch, stateInit: () => RootState) => {
     dispatch(loadSearchingListElement(index))
@@ -302,18 +303,7 @@ export function fetchSearchingListElementAction(
       if (isStatusSuccessful(status)) {
         dispatch(loadSearchingListElementSuccess(data))
         dispatch(updateSelectedKeyRefreshTime(Date.now()))
-        sendEventTelemetry({
-          event: getBasedOnViewTypeEvent(
-            state.browser.keys?.viewType,
-            TelemetryEvent.BROWSER_KEY_VALUE_FILTERED,
-            TelemetryEvent.TREE_VIEW_KEY_VALUE_FILTERED
-          ),
-          eventData: {
-            databaseId: state.connections.instances?.connectedInstance?.id,
-            keyType: KeyTypes.List,
-            match: 'EXACT_VALUE_NAME',
-          }
-        })
+        onSuccess?.()
       }
     } catch (error) {
       const errorMessage = getApiErrorMessage(error)
diff --git a/redisinsight/ui/src/slices/set.ts b/redisinsight/ui/src/slices/set.ts
@@ -4,7 +4,7 @@ import { remove } from 'lodash'
 import { apiService } from 'uiSrc/services'
 import { ApiEndpoints, KeyTypes } from 'uiSrc/constants'
 import { getApiErrorMessage, getUrl, isStatusSuccessful } from 'uiSrc/utils'
-import { getBasedOnViewTypeEvent, sendEventTelemetry, TelemetryEvent, getMatchType } from 'uiSrc/telemetry'
+import { getBasedOnViewTypeEvent, sendEventTelemetry, TelemetryEvent } from 'uiSrc/telemetry'
 import {
   AddMembersToSetDto,
   GetSetMembersResponse,
@@ -149,7 +149,8 @@ export function fetchSetMembers(
   key: string,
   cursor: number,
   count: number,
-  match: string
+  match: string,
+  onSuccess?: (data: GetSetMembersResponse) => void,
 ) {
   return async (dispatch: AppDispatch, stateInit: () => RootState) => {
     dispatch(loadSetMembers(match))
@@ -170,22 +171,9 @@ export function fetchSetMembers(
       )
 
       if (isStatusSuccessful(status)) {
-        const matchValue = getMatchType(match)
-        sendEventTelemetry({
-          event: getBasedOnViewTypeEvent(
-            state.browser.keys?.viewType,
-            TelemetryEvent.BROWSER_KEY_VALUE_FILTERED,
-            TelemetryEvent.TREE_VIEW_KEY_VALUE_FILTERED
-          ),
-          eventData: {
-            databaseId: state.connections.instances?.connectedInstance?.id,
-            keyType: KeyTypes.Set,
-            match: matchValue,
-            length: data.total,
-          }
-        })
         dispatch(loadSetMembersSuccess(data))
         dispatch(updateSelectedKeyRefreshTime(Date.now()))
+        onSuccess?.(data)
       }
     } catch (error) {
       const errorMessage = getApiErrorMessage(error)
diff --git a/redisinsight/ui/src/slices/zset.ts b/redisinsight/ui/src/slices/zset.ts
@@ -4,7 +4,7 @@ import { createSlice } from '@reduxjs/toolkit'
 import { apiService } from 'uiSrc/services'
 import { ApiEndpoints, SortOrder, KeyTypes } from 'uiSrc/constants'
 import { getApiErrorMessage, getUrl, isStatusSuccessful } from 'uiSrc/utils'
-import { getBasedOnViewTypeEvent, sendEventTelemetry, TelemetryEvent, getMatchType } from 'uiSrc/telemetry'
+import { getBasedOnViewTypeEvent, sendEventTelemetry, TelemetryEvent } from 'uiSrc/telemetry'
 import { StateZset } from 'uiSrc/slices/interfaces/zset'
 import successMessages from 'uiSrc/components/notifications/success-messages'
 import {
@@ -427,7 +427,8 @@ export function fetchSearchZSetMembers(
   key: string,
   cursor: number,
   count: number,
-  match: string
+  match: string,
+  onSuccess?: (data: SearchZSetMembersResponse) => void,
 ) {
   return async (dispatch: AppDispatch, stateInit: () => RootState) => {
     dispatch(searchZSetMembers(isNull(match) ? '*' : match))
@@ -447,22 +448,9 @@ export function fetchSearchZSetMembers(
       )
 
       if (isStatusSuccessful(status)) {
-        const matchValue = getMatchType(match)
-        sendEventTelemetry({
-          event: getBasedOnViewTypeEvent(
-            state.browser.keys?.viewType,
-            TelemetryEvent.BROWSER_KEY_VALUE_FILTERED,
-            TelemetryEvent.TREE_VIEW_KEY_VALUE_FILTERED
-          ),
-          eventData: {
-            databaseId: state.connections.instances?.connectedInstance?.id,
-            keyType: KeyTypes.ZSet,
-            match: matchValue,
-            length: data.total,
-          }
-        })
         dispatch(searchZSetMembersSuccess(data))
         dispatch(updateSelectedKeyRefreshTime(Date.now()))
+        onSuccess?.(data)
       }
     } catch (error) {
       const errorMessage = getApiErrorMessage(error)
