fix: some missing events on notebooks (#4097)

Author: drdelambre

src/flows/components/FlowsIndex.tsx

@@ -1,5 +1,5 @@
 // Libraries
-import React, {useState, useContext, useRef} from 'react'
+import React, {useState, useContext, useRef, useEffect} from 'react'
 
 // Components
 import {
@@ -18,6 +18,7 @@ import ResourceSortDropdown from 'src/shared/components/resource_sort_dropdown/R
 import {SortTypes} from 'src/shared/utils/sort'
 import PresetFlows from 'src/flows/components/PresetFlows'
 import RateLimitAlert from 'src/cloud/components/RateLimitAlert'
+import {event} from 'src/cloud/utils/reporting'
 
 // Utils
 import {pageTitleSuffixer} from 'src/shared/utils/pageTitles'
@@ -106,13 +107,29 @@ const FlowsIndex = () => {
   }
 
   const setSort = (sortKey, sortDirection, sortType) => {
+    if (
+      sortKey === sortOptions.sortKey &&
+      sortDirection === sortOptions.sortDirection
+    ) {
+      return
+    }
+
+    event('Notebook List Sort Change', {
+      key: sortKey,
+      direction: sortDirection,
+    })
+
     setSortOptions({
       sortKey,
       sortType,
       sortDirection,
     })
   }
 
+  useEffect(() => {
+    event('Notebook List Page Visited')
+  }, [])
+
   return (
     <Page
       titleTag={pageTitleSuffixer([PROJECT_NAME_PLURAL])}

src/flows/components/header/MenuButton.tsx

@@ -71,6 +71,7 @@ const MenuButton: FC<Props> = ({handleResetShare}) => {
   }
 
   const handleDownloadAsPNG = () => {
+    event('full notebook png download')
     const canvas = document.getElementById(flow.id)
     import('html2canvas').then((module: any) =>
       module.default(canvas as HTMLDivElement, canvasOptions).then(result => {
@@ -80,6 +81,7 @@ const MenuButton: FC<Props> = ({handleResetShare}) => {
   }
 
   const handleDownloadAsPDF = () => {
+    event('full notebook pdf download')
     const canvas = document.getElementById(flow.id)
     import('html2canvas').then((module: any) =>
       module.default(canvas as HTMLDivElement, canvasOptions).then(result => {
@@ -217,6 +219,9 @@ const MenuButton: FC<Props> = ({handleResetShare}) => {
         triggerRef={triggerRef}
         enableDefaultStyles={false}
         style={{minWidth: 209}}
+        onShow={() => {
+          event('Notebook main menu opened')
+        }}
         showEvent={PopoverInteraction.Click}
         hideEvent={PopoverInteraction.Click}
         contents={onHide => (