web: add analytics information for filter term input (#4672)

tilt-dev · Jun 22, 2021 · 59dd5b1 · 59dd5b1
1 parent 66e60f9
commit 59dd5b1
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 3 deletions.
diff --git a/web/src/OverviewActionBar.tsx b/web/src/OverviewActionBar.tsx
@@ -474,6 +474,9 @@ function FilterTermFieldError({ error }: { error: string }) {
 }
 
 const debounceFilterLogs = debounce((history: History, search: string) => {
+  // Record the action for analytics
+  incr("ui.web.filterTerm", { action: "edit" })
+  // Navigate to filtered logs with search query
   history.push({ search })
 }, FILTER_INPUT_DEBOUNCE)
 
@@ -530,7 +533,7 @@ export function FilterTermField({ termFromUrl }: { termFromUrl: FilterTerm }) {
     const endAdornment = (
       <InputAdornment position="end">
         <ClearFilterTermTextButton
-          analyticsName="TODO"
+          analyticsName="ui.web.clearFilterTerm"
           onClick={() => setTerm(EMPTY_TERM, false)}
         >
           <SrOnly>Clear filter term</SrOnly>

diff --git a/web/src/analytics.ts b/web/src/analytics.ts
@@ -1,4 +1,10 @@
-import { FilterLevel, filterSetFromLocation, FilterSource } from "./logfilters"
+import {
+  FilterLevel,
+  filterSetFromLocation,
+  FilterSource,
+  isRegexp,
+  TermState,
+} from "./logfilters"
 
 export type Tags = { [key: string]: string }
 
@@ -46,5 +52,9 @@ export let navigationToTags = (location: any, action: string): Tags => {
   if (filterSet.source != FilterSource.all) {
     tags.source = filterSet.source
   }
+  if (filterSet.term.state !== TermState.Empty) {
+    const termType = isRegexp(filterSet.term.input) ? "regexp" : "text"
+    tags.term = termType
+  }
   return tags
 }
diff --git a/web/src/logfilters.ts b/web/src/logfilters.ts
@@ -59,9 +59,13 @@ export const EMPTY_FILTER_TERM: FilterTerm = {
 }
 const TERM_REGEXP_FLAGS = "gi" // Terms are case-insensitive and can match multiple instances
 
+export function isRegexp(input: string): boolean {
+  return input.length > 2 && input[0] === "/" && input[input.length - 1] === "/"
+}
+
 export function parseTermInput(input: string): RegExp {
   // Input strings that are surrounded by `/` can be parsed as regular expressions
-  if (input.length > 2 && input[0] === "/" && input[input.length - 1] === "/") {
+  if (isRegexp(input)) {
     const regexpInput = input.slice(1, input.length - 1)
 
     return new RegExp(regexpInput, TERM_REGEXP_FLAGS)