From 5033142a777a3829da7c40b505ee0df11bd8b8af Mon Sep 17 00:00:00 2001
From: EYHN <cneyhn@gmail.com>
Date: Tue, 27 May 2025 08:17:14 +0000
Subject: [PATCH] feat(core): all docs tracks (#12556)

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit

- **New Features**
  - Added enhanced tracking for user interactions across document lists, navigation, display menus, quick actions, and collection operations.
  - User actions such as opening documents, editing collections, toggling favorites, changing view modes, and navigating collections are now logged for analytics.

- **Chores**
  - Expanded internal event tracking capabilities to support more detailed analytics on user interactions throughout the interface.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---
 .../explorer/display-menu/group.tsx           |  5 +++
 .../explorer/display-menu/order.tsx           |  5 +++
 .../explorer/display-menu/properties.tsx      |  9 ++++-
 .../explorer/display-menu/quick-actions.tsx   |  5 +++
 .../explorer/display-menu/view-toggle.tsx     |  4 ++
 .../explorer/docs-view/doc-list-item.tsx      |  2 +
 .../explorer/docs-view/more-menu.tsx          |  6 ++-
 .../explorer/docs-view/quick-actions.tsx      |  4 ++
 .../components/explorer/header/navigation.tsx |  6 +++
 .../page-list/view/collection-operations.tsx  |  2 +
 .../nodes/collection/operations.tsx           |  1 +
 .../navigation-panel/nodes/doc/index.tsx      |  3 ++
 .../navigation-panel/nodes/doc/operations.tsx |  2 +
 .../workspace/all-page/pinned-collections.tsx | 33 +++++++++++------
 .../workspace/collection/list-header.tsx      |  2 +
 packages/frontend/track/src/events.ts         | 37 +++++++++++++++++--
 16 files changed, 110 insertions(+), 16 deletions(-)

diff --git a/packages/frontend/core/src/components/explorer/display-menu/group.tsx b/packages/frontend/core/src/components/explorer/display-menu/group.tsx
index f97bf0daef..0d03d0add0 100644
--- a/packages/frontend/core/src/components/explorer/display-menu/group.tsx
+++ b/packages/frontend/core/src/components/explorer/display-menu/group.tsx
@@ -2,6 +2,7 @@ import { Divider, MenuItem } from '@affine/component';
 import type { GroupByParams } from '@affine/core/modules/collection-rules/types';
 import { WorkspacePropertyService } from '@affine/core/modules/workspace-property';
 import { useI18n } from '@affine/i18n';
+import track from '@affine/track';
 import { DoneIcon } from '@blocksuite/icons/rc';
 import { useLiveData, useService } from '@toeverything/infra';
 import { cssVarV2 } from '@toeverything/theme/v2';
@@ -128,6 +129,10 @@ const GroupByListItem = ({
     <MenuItem
       onClick={e => {
         e.preventDefault();
+        track.allDocs.header.displayMenu.editDisplayMenu({
+          control: 'groupBy',
+          type: property.systemProperty?.type ?? 'custom-property',
+        });
         if (value) {
           onChange?.(value);
         }
diff --git a/packages/frontend/core/src/components/explorer/display-menu/order.tsx b/packages/frontend/core/src/components/explorer/display-menu/order.tsx
index 292679a647..cff1601f79 100644
--- a/packages/frontend/core/src/components/explorer/display-menu/order.tsx
+++ b/packages/frontend/core/src/components/explorer/display-menu/order.tsx
@@ -2,6 +2,7 @@ import { MenuItem } from '@affine/component';
 import type { OrderByParams } from '@affine/core/modules/collection-rules/types';
 import { WorkspacePropertyService } from '@affine/core/modules/workspace-property';
 import { useI18n } from '@affine/i18n';
+import track from '@affine/track';
 import { SortDownIcon, SortUpIcon } from '@blocksuite/icons/rc';
 import { useLiveData, useService } from '@toeverything/infra';
 import { cssVarV2 } from '@toeverything/theme/v2';
@@ -125,6 +126,10 @@ const OrderByListItem = ({
     <MenuItem
       onClick={e => {
         e.preventDefault();
+        track.allDocs.header.displayMenu.editDisplayMenu({
+          control: 'orderBy',
+          type: property.systemProperty?.type ?? 'custom-property',
+        });
         if (value) {
           onChange?.(value);
         }
diff --git a/packages/frontend/core/src/components/explorer/display-menu/properties.tsx b/packages/frontend/core/src/components/explorer/display-menu/properties.tsx
index f4b307518f..7545c008dc 100644
--- a/packages/frontend/core/src/components/explorer/display-menu/properties.tsx
+++ b/packages/frontend/core/src/components/explorer/display-menu/properties.tsx
@@ -1,6 +1,7 @@
 import { Button, Divider } from '@affine/component';
 import { WorkspacePropertyService } from '@affine/core/modules/workspace-property';
 import { useI18n } from '@affine/i18n';
+import track from '@affine/track';
 import { useLiveData, useService } from '@toeverything/infra';
 import { useCallback, useMemo } from 'react';
 
@@ -160,7 +161,13 @@ const PropertyRenderer = ({
     <Button
       key={key}
       data-show={isActive}
-      onClick={() => handlePropertyClick(key)}
+      onClick={() => {
+        track.allDocs.header.displayMenu.editDisplayMenu({
+          control: 'displayProperties',
+          type: systemProperty?.type ?? 'custom-property',
+        });
+        handlePropertyClick(key);
+      }}
       className={styles.property}
       data-key={key}
     >
diff --git a/packages/frontend/core/src/components/explorer/display-menu/quick-actions.tsx b/packages/frontend/core/src/components/explorer/display-menu/quick-actions.tsx
index c5d252945b..37999f2b2d 100644
--- a/packages/frontend/core/src/components/explorer/display-menu/quick-actions.tsx
+++ b/packages/frontend/core/src/components/explorer/display-menu/quick-actions.tsx
@@ -1,5 +1,6 @@
 import { Checkbox, MenuItem, MenuSub } from '@affine/component';
 import { useI18n } from '@affine/i18n';
+import track from '@affine/track';
 import { useCallback } from 'react';
 
 import { type QuickAction, quickActions } from '../quick-actions.constants';
@@ -27,6 +28,10 @@ export const QuickActionsConfig = ({
             action={action}
             active={displayPreference[`${action.key}`] ?? false}
             onClick={() => {
+              track.allDocs.header.displayMenu.editDisplayMenu({
+                control: 'quickActions',
+                type: action.key,
+              });
               onDisplayPreferenceChange({
                 ...displayPreference,
                 [action.key]: !displayPreference[action.key],
diff --git a/packages/frontend/core/src/components/explorer/display-menu/view-toggle.tsx b/packages/frontend/core/src/components/explorer/display-menu/view-toggle.tsx
index c34fe8d631..c8d047a6e8 100644
--- a/packages/frontend/core/src/components/explorer/display-menu/view-toggle.tsx
+++ b/packages/frontend/core/src/components/explorer/display-menu/view-toggle.tsx
@@ -1,4 +1,5 @@
 import { RadioGroup, type RadioItem } from '@affine/component';
+import track from '@affine/track';
 import { useCallback } from 'react';
 
 import {
@@ -34,6 +35,9 @@ export const ViewToggle = ({
 }) => {
   const handleViewChange = useCallback(
     (view: DocListItemView) => {
+      track.allDocs.header.viewMode.editDisplayMenu({
+        type: view,
+      });
       onViewChange(view);
     },
     [onViewChange]
diff --git a/packages/frontend/core/src/components/explorer/docs-view/doc-list-item.tsx b/packages/frontend/core/src/components/explorer/docs-view/doc-list-item.tsx
index cc03bdd538..9d380c6c4c 100644
--- a/packages/frontend/core/src/components/explorer/docs-view/doc-list-item.tsx
+++ b/packages/frontend/core/src/components/explorer/docs-view/doc-list-item.tsx
@@ -10,6 +10,7 @@ import { DocDisplayMetaService } from '@affine/core/modules/doc-display-meta';
 import { WorkbenchLink } from '@affine/core/modules/workbench';
 import type { AffineDNDData } from '@affine/core/types/dnd';
 import { useI18n } from '@affine/i18n';
+import track from '@affine/track';
 import {
   AutoTidyUpIcon,
   PropertyIcon,
@@ -139,6 +140,7 @@ export const DocListItem = ({ ...props }: DocListItemProps) => {
           return;
         } else {
           // as link
+          track.allDocs.list.doc.openDoc();
           return;
         }
       }
diff --git a/packages/frontend/core/src/components/explorer/docs-view/more-menu.tsx b/packages/frontend/core/src/components/explorer/docs-view/more-menu.tsx
index 82f250f5dc..77b1c486a6 100644
--- a/packages/frontend/core/src/components/explorer/docs-view/more-menu.tsx
+++ b/packages/frontend/core/src/components/explorer/docs-view/more-menu.tsx
@@ -42,6 +42,7 @@ const ToggleFavorite = ({ docId }: DocOperationProps) => {
 
   const toggleFavorite = useCallback(() => {
     favAdapter.toggle(docId, 'doc');
+    track.allDocs.list.docMenu.toggleFavorite();
   }, [docId, favAdapter]);
 
   return (
@@ -66,7 +67,7 @@ const DocInfo = ({ docId }: DocOperationProps) => {
 
   const onOpenInfoModal = useCallback(() => {
     if (docId) {
-      track.$.docInfoPanel.$.open();
+      track.allDocs.list.docMenu.openDocInfo();
       workspaceDialogService.open('doc-info', { docId });
     }
   }, [docId, workspaceDialogService]);
@@ -85,6 +86,8 @@ const NewTab = ({ docId }: DocOperationProps) => {
   const t = useI18n();
   const workbench = useService(WorkbenchService).workbench;
   const onOpenInNewTab = useCallback(() => {
+    track.allDocs.list.doc.openDoc();
+    track.allDocs.list.docMenu.openInNewTab();
     workbench.openDoc(docId, { at: 'new-tab' });
   }, [docId, workbench]);
 
@@ -103,6 +106,7 @@ const SplitView = ({ docId }: DocOperationProps) => {
   const workbench = useService(WorkbenchService).workbench;
 
   const onOpenInSplitView = useCallback(() => {
+    track.allDocs.list.doc.openDoc();
     track.allDocs.list.docMenu.openInSplitView();
     workbench.openDoc(docId, { at: 'tail' });
   }, [docId, workbench]);
diff --git a/packages/frontend/core/src/components/explorer/docs-view/quick-actions.tsx b/packages/frontend/core/src/components/explorer/docs-view/quick-actions.tsx
index 46dadc5a7d..89266ba959 100644
--- a/packages/frontend/core/src/components/explorer/docs-view/quick-actions.tsx
+++ b/packages/frontend/core/src/components/explorer/docs-view/quick-actions.tsx
@@ -45,6 +45,7 @@ export const QuickFavorite = memo(function QuickFavorite({
       onClick?.(e);
       e.stopPropagation();
       e.preventDefault();
+      track.allDocs.list.docMenu.toggleFavorite();
       favAdapter.toggle(doc.id, 'doc');
     },
     [doc.id, favAdapter, onClick]
@@ -77,6 +78,8 @@ export const QuickTab = memo(function QuickTab({
       onClick?.(e);
       e.stopPropagation();
       e.preventDefault();
+      track.allDocs.list.doc.openDoc();
+      track.allDocs.list.docMenu.openInNewTab();
       workbench.openDoc(doc.id, { at: 'new-tab' });
     },
     [doc.id, onClick, workbench]
@@ -109,6 +112,7 @@ export const QuickSplit = memo(function QuickSplit({
       onClick?.(e);
       e.stopPropagation();
       e.preventDefault();
+      track.allDocs.list.doc.openDoc();
       track.allDocs.list.docMenu.openInSplitView();
       workbench.openDoc(doc.id, { at: 'tail' });
     },
diff --git a/packages/frontend/core/src/components/explorer/header/navigation.tsx b/packages/frontend/core/src/components/explorer/header/navigation.tsx
index f23f073438..2ff056f743 100644
--- a/packages/frontend/core/src/components/explorer/header/navigation.tsx
+++ b/packages/frontend/core/src/components/explorer/header/navigation.tsx
@@ -1,5 +1,6 @@
 import { WorkbenchLink } from '@affine/core/modules/workbench';
 import { useI18n } from '@affine/i18n';
+import track from '@affine/track';
 
 import * as styles from './navigation.css';
 
@@ -37,6 +38,11 @@ export const ExplorerNavigation = ({ active }: { active: NavigationKey }) => {
           data-testid={item.testId}
           data-active={active === item.value}
           to={item.to}
+          onClick={() => {
+            track.allDocs.header.navigation.navigateAllDocsRouter({
+              control: item.value,
+            });
+          }}
           className={styles.item}
         >
           {t[item.label]()}
diff --git a/packages/frontend/core/src/components/page-list/view/collection-operations.tsx b/packages/frontend/core/src/components/page-list/view/collection-operations.tsx
index 271deaa777..ad3ca46d66 100644
--- a/packages/frontend/core/src/components/page-list/view/collection-operations.tsx
+++ b/packages/frontend/core/src/components/page-list/view/collection-operations.tsx
@@ -4,6 +4,7 @@ import { WorkspaceDialogService } from '@affine/core/modules/dialogs';
 import { CompatibleFavoriteItemsAdapter } from '@affine/core/modules/favorite';
 import { WorkbenchService } from '@affine/core/modules/workbench';
 import { useI18n } from '@affine/i18n';
+import track from '@affine/track';
 import {
   DeleteIcon,
   EditIcon,
@@ -71,6 +72,7 @@ export const CollectionOperations = ({
   }, [openRenameModal, openPromptModal, t, service, collection]);
 
   const showEdit = useCallback(() => {
+    track.collection.collection.$.editCollection();
     workspaceDialogService.open('collection-editor', {
       collectionId: collection.id,
     });
diff --git a/packages/frontend/core/src/desktop/components/navigation-panel/nodes/collection/operations.tsx b/packages/frontend/core/src/desktop/components/navigation-panel/nodes/collection/operations.tsx
index 7d627c262b..d20d1b9aea 100644
--- a/packages/frontend/core/src/desktop/components/navigation-panel/nodes/collection/operations.tsx
+++ b/packages/frontend/core/src/desktop/components/navigation-panel/nodes/collection/operations.tsx
@@ -106,6 +106,7 @@ export const useNavigationPanelCollectionNodeOperations = (
 
   const handleShowEdit = useCallback(() => {
     onOpenEdit();
+    track.$.navigationPanel.collections.editCollection();
   }, [onOpenEdit]);
 
   return useMemo(
diff --git a/packages/frontend/core/src/desktop/components/navigation-panel/nodes/doc/index.tsx b/packages/frontend/core/src/desktop/components/navigation-panel/nodes/doc/index.tsx
index 36e50b9465..7d8cbf815c 100644
--- a/packages/frontend/core/src/desktop/components/navigation-panel/nodes/doc/index.tsx
+++ b/packages/frontend/core/src/desktop/components/navigation-panel/nodes/doc/index.tsx
@@ -251,6 +251,9 @@ export const NavigationPanelDocNode = ({
       setCollapsed={setCollapsed}
       canDrop={handleCanDrop}
       to={`/${docId}`}
+      onClick={() => {
+        track.$.navigationPanel.docs.openDoc();
+      }}
       active={active}
       postfix={
         referencesLoading &&
diff --git a/packages/frontend/core/src/desktop/components/navigation-panel/nodes/doc/operations.tsx b/packages/frontend/core/src/desktop/components/navigation-panel/nodes/doc/operations.tsx
index 44142d6d69..fb18aa61cb 100644
--- a/packages/frontend/core/src/desktop/components/navigation-panel/nodes/doc/operations.tsx
+++ b/packages/frontend/core/src/desktop/components/navigation-panel/nodes/doc/operations.tsx
@@ -105,6 +105,7 @@ export const useNavigationPanelDocNodeOperations = (
     workbenchService.workbench.openDoc(docId, {
       at: 'new-tab',
     });
+    track.$.navigationPanel.docs.openDoc();
     track.$.navigationPanel.organize.openInNewTab({
       type: 'doc',
     });
@@ -114,6 +115,7 @@ export const useNavigationPanelDocNodeOperations = (
     workbenchService.workbench.openDoc(docId, {
       at: 'beside',
     });
+    track.$.navigationPanel.docs.openDoc();
     track.$.navigationPanel.organize.openInSplitView({
       type: 'doc',
     });
diff --git a/packages/frontend/core/src/desktop/pages/workspace/all-page/pinned-collections.tsx b/packages/frontend/core/src/desktop/pages/workspace/all-page/pinned-collections.tsx
index 77e360bdeb..24cf47e6d4 100644
--- a/packages/frontend/core/src/desktop/pages/workspace/all-page/pinned-collections.tsx
+++ b/packages/frontend/core/src/desktop/pages/workspace/all-page/pinned-collections.tsx
@@ -14,6 +14,7 @@ import {
 import type { FilterParams } from '@affine/core/modules/collection-rules';
 import { WorkspaceDialogService } from '@affine/core/modules/dialogs';
 import { useI18n } from '@affine/i18n';
+import track from '@affine/track';
 import {
   CloseIcon,
   CollectionsIcon,
@@ -102,10 +103,15 @@ export const PinnedCollections = ({
       <div
         className={styles.item}
         data-active={activeCollectionId === null ? 'true' : undefined}
-        onClick={() =>
+        onClick={() => {
           // only fire onActiveAll if the collection is not already active
-          activeCollectionId !== null ? onActiveAll() : undefined
-        }
+          if (activeCollectionId !== null) {
+            track.allDocs.header.navigation.navigatePinedCollectionRouter({
+              control: 'all',
+            });
+            onActiveAll();
+          }
+        }}
         role="button"
       >
         {t['com.affine.all-docs.pinned-collection.all']()}
@@ -115,12 +121,15 @@ export const PinnedCollections = ({
           key={record.collectionId}
           record={record}
           isActive={activeCollectionId === record.collectionId}
-          onClick={() =>
+          onClick={() => {
             // only fire onActiveCollection if the collection is not already active
-            activeCollectionId !== record.collectionId
-              ? onActiveCollection(record.collectionId)
-              : undefined
-          }
+            if (activeCollectionId !== record.collectionId) {
+              track.allDocs.header.navigation.navigatePinedCollectionRouter({
+                control: 'user-custom-collection',
+              });
+              onActiveCollection(record.collectionId);
+            }
+          }}
           onClickRemove={() => {
             const nextCollectionId = pinnedCollections[index - 1]?.collectionId;
             if (nextCollectionId) {
@@ -144,11 +153,12 @@ export const PinnedCollections = ({
           <IconButton
             size="16"
             className={styles.editIconButton}
-            onClick={() =>
+            onClick={() => {
+              track.allDocs.header.collection.editCollection();
               workspaceDialogService.open('collection-editor', {
                 collectionId: activeCollectionId,
-              })
-            }
+              });
+            }}
           >
             <EditIcon />
           </IconButton>
@@ -228,6 +238,7 @@ export const AddPinnedCollectionMenuContent = ({
           prefixIcon={<CollectionsIcon />}
           suffixIcon={<PlusIcon />}
           onClick={() => {
+            track.allDocs.header.collection.addPinnedCollection();
             onPinCollection(meta.id);
           }}
         >
diff --git a/packages/frontend/core/src/desktop/pages/workspace/collection/list-header.tsx b/packages/frontend/core/src/desktop/pages/workspace/collection/list-header.tsx
index aa4040cb7e..43df133b2e 100644
--- a/packages/frontend/core/src/desktop/pages/workspace/collection/list-header.tsx
+++ b/packages/frontend/core/src/desktop/pages/workspace/collection/list-header.tsx
@@ -10,6 +10,7 @@ import type { DocRecord } from '@affine/core/modules/doc';
 import { WorkbenchLink } from '@affine/core/modules/workbench';
 import { WorkspaceService } from '@affine/core/modules/workspace';
 import { useI18n } from '@affine/i18n';
+import track from '@affine/track';
 import type { DocMode } from '@blocksuite/affine/model';
 import { ViewLayersIcon } from '@blocksuite/icons/rc';
 import { useLiveData, useServices } from '@toeverything/infra';
@@ -31,6 +32,7 @@ export const CollectionListHeader = ({
     });
 
   const handleEdit = useCallback(() => {
+    track.collection.collection.$.editCollection();
     workspaceDialogService.open('collection-editor', {
       collectionId: collection.id,
     });
diff --git a/packages/frontend/track/src/events.ts b/packages/frontend/track/src/events.ts
index d83ba183f0..2c011efd51 100644
--- a/packages/frontend/track/src/events.ts
+++ b/packages/frontend/track/src/events.ts
@@ -39,6 +39,7 @@ type WorkspaceEvents =
   | 'export'
   | 'openWorkspaceList';
 type DocEvents =
+  | 'openDoc'
   | 'createDoc'
   | 'quickStart'
   | 'renameDoc'
@@ -53,7 +54,10 @@ type DocEvents =
   | 'bookmark'
   | 'editProperty'
   | 'editPropertyMeta'
-  | 'addProperty';
+  | 'addProperty'
+  | 'editDisplayMenu'
+  | 'navigateAllDocsRouter'
+  | 'navigatePinedCollectionRouter';
 type EditorEvents =
   | 'bold'
   | 'italic'
@@ -77,7 +81,9 @@ type CollectionEvents =
   | 'createCollection'
   | 'deleteCollection'
   | 'renameCollection'
-  | 'addDocToCollection';
+  | 'addDocToCollection'
+  | 'editCollection'
+  | 'addPinnedCollection';
 type FolderEvents =
   | 'createFolder'
   | 'renameFolder'
@@ -340,12 +346,13 @@ interface PageEvents extends PageDivision {
         'toggleFavorite',
         'drop',
       ];
-      docs: ['createDoc', 'deleteDoc', 'linkDoc', 'drop'];
+      docs: ['createDoc', 'deleteDoc', 'linkDoc', 'drop', 'openDoc'];
       collections: [
         'createDoc',
         'addDocToCollection',
         'removeOrganizeItem',
         'drop',
+        'editCollection',
       ];
       folders: ['createDoc', 'drop'];
       tags: ['createDoc', 'tagDoc', 'drop'];
@@ -489,15 +496,21 @@ interface PageEvents extends PageDivision {
   };
   allDocs: {
     header: {
+      navigation: ['navigateAllDocsRouter', 'navigatePinedCollectionRouter'];
       actions: ['createDoc', 'createWorkspace'];
+      displayMenu: ['editDisplayMenu'];
+      viewMode: ['editDisplayMenu'];
+      collection: ['editCollection', 'addPinnedCollection'];
     };
     list: {
+      doc: ['openDoc'];
       docMenu: [
         'createDoc',
         'deleteDoc',
         'openInSplitView',
         'toggleFavorite',
         'openInNewTab',
+        'openDocInfo',
       ];
     };
   };
@@ -505,6 +518,9 @@ interface PageEvents extends PageDivision {
     docList: {
       docMenu: ['removeOrganizeItem'];
     };
+    collection: {
+      $: ['editCollection'];
+    };
   };
   tag: {};
   trash: {};
@@ -766,6 +782,21 @@ export type EventArgs = {
     control: 'Additional docs';
     result: 'success' | 'failure';
   };
+  editDisplayMenu: {
+    control:
+      | 'groupBy'
+      | 'orderBy'
+      | 'displayProperties'
+      | 'listViewOptions'
+      | 'quickActions';
+    type: string;
+  };
+  navigateAllDocsRouter: {
+    control: string;
+  };
+  navigatePinedCollectionRouter: {
+    control: 'all' | 'user-custom-collection';
+  };
 };
 
 // for type checking