⚡

投资组合伙伴2项目上下文 portfolio-context

Portfolio Buddy 2 是一个基于 React 19 和 TypeScript 构建的投资组合分析工具。它为投资者和期货交易者提供交易策略对比、资产相关性分析、风险指标计算（如夏普比率、索提诺比率、最大回撤）、CSV数据上传与可视化、以及基于合约乘数的期货交易指标调整功能。该技能主要用于前端开发、量化金融分析和数据可视化项目。 关键词：投资组合分析，量化交易，React 19，TypeScript，风险指标，夏普比率，索提诺比率，相关性矩阵，期货交易，数据可视化，Supabase

回测系统 0 次安装 0 次浏览 更新于 2/28/2026

name: portfolio-context description: “Portfolio Buddy 2 开发自动加载上下文。用于任何涉及以下内容的任务：React 19 开发、TypeScript、投资组合分析功能、指标计算、交易策略比较，或处理 Portfolio Buddy 2 代码库。包含技术栈、已知问题和架构约束。”

Portfolio Buddy 2 - 项目上下文

技术栈

  • 前端：React 19, TypeScript, Vite
  • UI：Tailwind CSS, shadcn/ui (仅色彩系统)
  • 图表：Chart.js, react-chartjs-2, chartjs 插件 (缩放、标注、日期适配器)
  • 状态管理：原生 React (useState, useMemo, useCallback)
  • 数据工具：date-fns 用于日期操作
  • 后端：Supabase (PostgreSQL)
  • 部署：Cloudflare Pages

项目目的

面向投资者和期货交易者的投资组合分析工具，用于：

  • 比较交易策略与基准资产 (SPY, GLD)
  • 计算资产间的相关性矩阵 (斯皮尔曼和皮尔逊)
  • 分析风险指标和绩效 (夏普比率、索提诺比率、最大回撤等)
  • 通过 CSV 上传交易数据并可视化结果
  • 应用合约乘数来调整期货交易的指标
  • 按日期范围筛选数据进行特定时期分析

已知问题与技术债务

当前技术债务

  1. 未使用的依赖项：Recharts (11.5KB) 已安装但从未导入

    • 应从 package.json 中移除
    • 当前使用 Chart.js 代替

  2. 组件过大：违反 200 行标准

    • PortfolioSection.tsx (591 行) → 需要重构为子组件
    • App.tsx (351 行) → 将各部分提取为组件
    • MetricsTable.tsx (242 行) → 已改进但仍超限

  3. TypeScript 违规：15 处 any 类型使用

    • usePortfolio.ts: 11 处，在交易/指标类型中
    • useMetrics.ts: 4 处，在排序比较中
    • dataUtils.ts: 1 处，在 Metrics 接口中

已知缺陷

  1. Supabase 上传错误：大文件上传时偶发 500 错误
    • 已在提交 9fb7fdb 中增强错误处理
    • 检查上传钩子中的错误处理
    • 验证免费套餐的行数限制是否未超出

近期新增功能

  • 索提诺比率计算 (提交 258ba3a, 9f25040)
    • 位置：在 PortfolioSection.tsx 中内联实现 (第 133-158 行)
    • 无风险利率输入状态，用于用户指定的无风险利率
    • 使用 sqrt(365) 因子计算年化下行偏差
    • 修正方差计算 (除以总收益数，而非仅负收益)
    • 显示在投资组合统计部分 (第 535 行)
    • 注意：不在 dataUtils.ts 中 - 由于投资组合级上下文而保留在组件内
  • 日期范围筛选 (提交 258ba3a)
    • 按开始/结束日期筛选投资组合数据
    • 在 usePortfolio 钩子中实现
  • 高级多列排序 (useSorting 钩子)
    • 按优先级对多列进行排序
    • 每列自定义比较逻辑

架构约束

  • 组件限制：每个组件最多 200 行 (目前有 3 个组件违反)
  • 钩子模式：自定义钩子位于 /src/hooks/
  • 工具函数模式：纯函数位于 /src/utils/
  • 类型安全：严格的 TypeScript，无 any 类型 (存在 15 处违规作为技术债务)
  • 状态管理：仅使用原生 React 钩子 - 无 Zustand 或 TanStack Query

关键组件结构

src/
├── components/
│   ├── AnalyticsControls.tsx     (切换指标/投资组合/相关性视图)
│   ├── ContractInput.tsx         (合约乘数输入)
│   ├── CorrelationHeatmap.tsx    (相关性可视化)
│   ├── CorrelationSection.tsx    (相关性分析包装器)
│   ├── CustomTooltip.tsx         (图表工具提示)
│   ├── ErrorList.tsx             (错误显示)
│   ├── Header.tsx                (应用头部)
│   ├── MasterContractControl.tsx (将合约值应用于所有)
│   ├── MetricsTable.tsx          (指标显示与选择)
│   ├── PortfolioSection.tsx      (投资组合图表与分析 - 591 行!)
│   ├── SessionComplete.tsx       (完成界面)
│   ├── SortableHeader.tsx        (带排序指示器的表头)
│   ├── UploadedFilesList.tsx     (已上传文件列表)
│   └── UploadSection.tsx         (文件上传至 Supabase)
├── hooks/
│   ├── useContractMultipliers.ts (管理合约乘数)
│   ├── useMetrics.ts             (计算交易指标)
│   ├── usePortfolio.ts           (投资组合数据与日期筛选)
│   └── useSorting.ts             (高级多列排序)
└── utils/
    └── dataUtils.ts              (指标计算、CSV 解析、相关性)

迁移上下文

正在从旧应用迁移 40 项功能 (已完成 35/40)。详情请参阅 migration-tracker 技能。