From bca2ad4f81cee2f0ed2b58ae5a064ddc3d91b8e2 Mon Sep 17 00:00:00 2001
From: zdl <3489966805@qq.com>
Date: Tue, 28 Oct 2025 21:24:42 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=AE=9E=E7=8E=B0=E7=9A=84=E5=8A=9F?=
 =?UTF-8?q?=E8=83=BD=20Home=20=E9=A1=B5=E9=9D=A2=E8=BF=BD=E8=B8=AA?=
 =?UTF-8?q?=EF=BC=882=E4=B8=AA=E4=BA=8B=E4=BB=B6=EF=BC=89=20**Home=20?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2**:=201.=20**=E9=A1=B5=E9=9D=A2=E8=AE=BF?=
 =?UTF-8?q?=E9=97=AE**=20-=20=E4=BA=86=E8=A7=A3=E6=B5=81=E9=87=8F=E6=9D=A5?=
 =?UTF-8?q?=E6=BA=90=E3=80=81=E7=99=BB=E5=BD=95=E8=BD=AC=E5=8C=96=E7=8E=87?=
 =?UTF-8?q?=202.=20**=E5=8A=9F=E8=83=BD=E5=8D=A1=E7=89=87=E7=82=B9?=
 =?UTF-8?q?=E5=87=BB**=20-=20=E8=AF=86=E5=88=AB=E6=9C=80=E5=8F=97=E6=AC=A2?=
 =?UTF-8?q?=E8=BF=8E=E7=9A=84=E5=8A=9F=E8=83=BD=203.=20**=E6=8E=A8?=
 =?UTF-8?q?=E8=8D=90=E5=8A=9F=E8=83=BD=E6=95=88=E6=9E=9C**=20-=20=E5=88=86?=
 =?UTF-8?q?=E6=9E=90=E7=89=B9=E8=89=B2=E5=8A=9F=E8=83=BD=EF=BC=88=E6=96=B0?=
 =?UTF-8?q?=E9=97=BB=E4=B8=AD=E5=BF=83=EF=BC=89=E7=9A=84=E7=82=B9=E5=87=BB?=
 =?UTF-8?q?=E7=8E=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/Home/HomePage.js | 40 +++++++++++++++++++++++++++++---------
 1 file changed, 31 insertions(+), 9 deletions(-)

diff --git a/src/views/Home/HomePage.js b/src/views/Home/HomePage.js
index 1fd38f6f..0a7f5321 100755
--- a/src/views/Home/HomePage.js
+++ b/src/views/Home/HomePage.js
@@ -1,5 +1,5 @@
 // src/views/Home/HomePage.js - 专业投资分析平台
-import React, { useEffect } from 'react';
+import React, { useEffect, useCallback } from 'react';
 import {
   Box,
   Container,
@@ -21,10 +21,13 @@ import heroBg from '../../assets/img/BackgroundCard1.png';
 import '../../styles/home-animations.css';
 import { logger } from '../../utils/logger';
 import MidjourneyHeroSection from '../Community/components/MidjourneyHeroSection';
+import { usePostHogTrack } from '../../hooks/usePostHogRedux';
+import { ACQUISITION_EVENTS } from '../../lib/constants';
 
 export default function HomePage() {
   const { user, isAuthenticated } = useAuth(); // ⚡ 移除 isLoading，不再依赖它
   const navigate = useNavigate();
+  const { track } = usePostHogTrack(); // PostHog 追踪
   const [imageLoaded, setImageLoaded] = React.useState(false);
 
   // 响应式配置
@@ -46,6 +49,15 @@ export default function HomePage() {
     });
   }, [user?.id, isAuthenticated]); // 只依赖 user.id,避免无限循环
 
+  // 🎯 PostHog 追踪：页面浏览
+  useEffect(() => {
+    track(ACQUISITION_EVENTS.LANDING_PAGE_VIEWED, {
+      timestamp: new Date().toISOString(),
+      is_authenticated: isAuthenticated,
+      user_id: user?.id || null,
+    });
+  }, [track, isAuthenticated, user?.id]);
+
   // 核心功能配置 - 5个主要功能
   const coreFeatures = [
     {
@@ -106,15 +118,25 @@ export default function HomePage() {
   ];
 
   // @TODO 如何区分内部链接和外部链接？
-  const handleProductClick = (url) => {
-    if (url.startsWith('http')) {
+  const handleProductClick = useCallback((feature) => {
+    // 🎯 PostHog 追踪：功能卡片点击
+    track(ACQUISITION_EVENTS.FEATURE_CARD_CLICKED, {
+      feature_id: feature.id,
+      feature_title: feature.title,
+      feature_url: feature.url,
+      is_featured: feature.featured || false,
+      link_type: feature.url.startsWith('http') ? 'external' : 'internal',
+    });
+
+    // 原有导航逻辑
+    if (feature.url.startsWith('http')) {
       // 外部链接，直接打开
-      window.open(url, '_blank');
+      window.open(feature.url, '_blank');
     } else {
       // 内部路由
-      navigate(url);
+      navigate(feature.url);
     }
-  };
+  }, [track, navigate]);
 
   return (
     <Box>
@@ -273,7 +295,7 @@ export default function HomePage() {
                         borderRadius="full"
                         fontWeight="bold"
                         w={{ base: '100%', md: 'auto' }}
-                        onClick={() => handleProductClick(coreFeatures[0].url)}
+                        onClick={() => handleProductClick(coreFeatures[0])}
                         minH="44px"
                         flexShrink={0}
                       >
@@ -305,7 +327,7 @@ export default function HomePage() {
                           borderColor: `${feature.color}.400`,
                           transform: 'translateY(-2px)'
                         }}
-                        onClick={() => handleProductClick(feature.url)}
+                        onClick={() => handleProductClick(feature)}
                         minH={{ base: 'auto', md: '180px' }}
                       >
                       <CardBody p={{ base: 5, md: 6 }}>
@@ -343,7 +365,7 @@ export default function HomePage() {
                             minH="44px"
                             onClick={(e) => {
                               e.stopPropagation();
-                              handleProductClick(feature.url);
+                              handleProductClick(feature);
                             }}
                           >
                             使用