chore(deps): bump 5 dependencies (date-fns, eslint-plugin-react-hooks, react-resizable-panels, recharts, wrangler) and fix breaking changes#17
Conversation
Bumps [date-fns](https://github.com/date-fns/date-fns) from 3.6.0 to 4.1.0. - [Release notes](https://github.com/date-fns/date-fns/releases) - [Changelog](https://github.com/date-fns/date-fns/blob/main/CHANGELOG.md) - [Commits](date-fns/date-fns@v3.6.0...v4.1.0) --- updated-dependencies: - dependency-name: date-fns dependency-version: 4.1.0 dependency-type: direct:production update-type: version-update:semver-major ... Signed-off-by: dependabot[bot] <support@github.com>
Bumps [eslint-plugin-react-hooks](https://github.com/facebook/react/tree/HEAD/packages/eslint-plugin-react-hooks) from 5.2.0 to 7.0.1. - [Release notes](https://github.com/facebook/react/releases) - [Changelog](https://github.com/facebook/react/blob/main/packages/eslint-plugin-react-hooks/CHANGELOG.md) - [Commits](https://github.com/facebook/react/commits/HEAD/packages/eslint-plugin-react-hooks) --- updated-dependencies: - dependency-name: eslint-plugin-react-hooks dependency-version: 7.0.1 dependency-type: direct:development update-type: version-update:semver-major ... Signed-off-by: dependabot[bot] <support@github.com>
Bumps [react-resizable-panels](https://github.com/bvaughn/react-resizable-panels) from 2.1.9 to 4.0.15. - [Release notes](https://github.com/bvaughn/react-resizable-panels/releases) - [Changelog](https://github.com/bvaughn/react-resizable-panels/blob/main/CHANGELOG.md) - [Commits](bvaughn/react-resizable-panels@2.1.9...4.0.15) --- updated-dependencies: - dependency-name: react-resizable-panels dependency-version: 4.0.15 dependency-type: direct:production update-type: version-update:semver-major ... Signed-off-by: dependabot[bot] <support@github.com>
Bumps [recharts](https://github.com/recharts/recharts) from 2.15.4 to 3.6.0. - [Release notes](https://github.com/recharts/recharts/releases) - [Changelog](https://github.com/recharts/recharts/blob/main/CHANGELOG.md) - [Commits](recharts/recharts@v2.15.4...v3.6.0) --- updated-dependencies: - dependency-name: recharts dependency-version: 3.6.0 dependency-type: direct:production update-type: version-update:semver-major ... Signed-off-by: dependabot[bot] <support@github.com>
Bumps [wrangler](https://github.com/cloudflare/workers-sdk/tree/HEAD/packages/wrangler) from 3.114.16 to 4.54.0. - [Release notes](https://github.com/cloudflare/workers-sdk/releases) - [Commits](https://github.com/cloudflare/workers-sdk/commits/wrangler@4.54.0/packages/wrangler) --- updated-dependencies: - dependency-name: wrangler dependency-version: 4.54.0 dependency-type: direct:development update-type: version-update:semver-major ... Signed-off-by: dependabot[bot] <support@github.com>
- recharts v3: switch ChartTooltipContent props to TooltipContentProps and ChartLegendContent props to DefaultLegendContentProps; widen formatter call site to match new ValueType. - react-resizable-panels v4: rename PanelGroup -> Group and PanelResizeHandle -> Separator in the resizable wrapper. - eslint-plugin-react-hooks v7: pin to v5-era ruleset (rules-of-hooks + exhaustive-deps) instead of v7 recommended preset, to keep the lint baseline unchanged. Newly added strict rules can be enabled individually in a follow-up. https://claude.ai/code/session_011xUm8nLQmyjMyis1vG1cmd
Qodo reviews are paused for this user.Troubleshooting steps vary by plan Learn more → On a Teams plan? Using GitHub Enterprise Server, GitLab Self-Managed, or Bitbucket Data Center? |
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Organization UI Review profile: ASSERTIVE Plan: Pro Run ID: 📒 Files selected for processing (1)
📝 WalkthroughWalkthrough複数パッケージをアップグレードし(date-fns, react-resizable-panels, recharts, eslint-plugin-react-hooks, wrangler)、それに合わせて chart/resizable コンポーネントの型・実装を調整、StatsScreen の CartesianGrid に yAxisId を追加し、ESLint の React Hooks ルールを有効化しています。 Changesパッケージ依存関係とコンポーネント型定義の更新
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Comment |
There was a problem hiding this comment.
Code Review
This pull request upgrades several major dependencies, including date-fns, recharts, react-resizable-panels, and wrangler, while also updating the ESLint configuration. Feedback indicates that the PR description should be updated to reflect the full scope of these changes rather than just the date-fns bump. Furthermore, the upgrade to react-resizable-panels v4 introduced breaking changes to data attributes in the resizable component that require updates to ensure correct styling in vertical layouts.
| "cmdk": "^1.1.1", | ||
| "d3": "^7.9.0", | ||
| "date-fns": "^3.6.0", | ||
| "date-fns": "^4.1.0", |
There was a problem hiding this comment.
The pull request title and description are misleading. While they only mention bumping date-fns, this PR also includes major version upgrades for several other critical dependencies: recharts (v2 to v3), react-resizable-panels (v2 to v4), eslint-plugin-react-hooks (v5 to v7), and wrangler (v3 to v4).
Mixing multiple major upgrades in a single PR makes it difficult to track breaking changes and increases the risk of regressions. It is recommended to update the PR title and description to reflect all major changes, or ideally, split these into separate pull requests to ensure each upgrade is properly validated.
| <ResizablePrimitive.PanelGroup | ||
| <ResizablePrimitive.Group | ||
| data-slot="resizable-panel-group" | ||
| className={cn('flex h-full w-full data-[panel-group-direction=vertical]:flex-col', className)} |
There was a problem hiding this comment.
The upgrade to react-resizable-panels v4 introduced breaking changes to data attributes. The data-panel-group-direction attribute has been renamed to data-group-direction. The current Tailwind selector will fail to apply the flex-col class when the direction is vertical.
| className={cn('flex h-full w-full data-[panel-group-direction=vertical]:flex-col', className)} | |
| className={cn('flex h-full w-full data-[group-direction=vertical]:flex-col', className)} |
| <ResizablePrimitive.Separator | ||
| data-slot="resizable-handle" | ||
| className={cn( | ||
| 'bg-border focus-visible:ring-ring relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-offset-1 focus-visible:outline-hidden data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:-translate-y-1/2 data-[panel-group-direction=vertical]:after:translate-x-0 [&[data-panel-group-direction=vertical]>div]:rotate-90', |
There was a problem hiding this comment.
Similar to the ResizablePanelGroup, the Separator (formerly PanelResizeHandle) now uses data-group-direction instead of data-panel-group-direction in version 4. All occurrences in the className string need to be updated to ensure the handle is styled correctly in vertical layouts.
| 'bg-border focus-visible:ring-ring relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-offset-1 focus-visible:outline-hidden data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:-translate-y-1/2 data-[panel-group-direction=vertical]:after:translate-x-0 [&[data-panel-group-direction=vertical]>div]:rotate-90', | |
| 'bg-border focus-visible:ring-ring relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-offset-1 focus-visible:outline-hidden data-[group-direction=vertical]:h-px data-[group-direction=vertical]:w-full data-[group-direction=vertical]:after:left-0 data-[group-direction=vertical]:after:h-1 data-[group-direction=vertical]:after:w-full data-[group-direction=vertical]:after:-translate-y-1/2 data-[group-direction=vertical]:after:translate-x-0 [&[data-group-direction=vertical]>div]:rotate-90', |
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 1c6caa7d7e
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| }) { | ||
| return ( | ||
| <ResizablePrimitive.PanelResizeHandle | ||
| <ResizablePrimitive.Separator |
There was a problem hiding this comment.
Preserve vertical separator styling after v4 rename
When this wrapper is used with a vertical group, the v4 Separator/Group components no longer emit the old data-panel-group-direction=vertical attribute; v4 exposes orientation via ARIA/data attributes instead. The class list immediately below still keys all vertical sizing/rotation off that old attribute, so vertical separators keep the horizontal w-px sizing and the grip does not rotate. Please migrate these selectors to the v4 attributes (or otherwise pass your own orientation state) along with the component rename.
Useful? React with 👍 / 👎.
This module exported isTauri / getPlatform / invokeTauriCommand / openExternal, but none of them are imported anywhere in the codebase (vite.config.ts has its own local isTauri based on TAURI_ENV_PLATFORM). The dynamic imports of @tauri-apps/plugin-os and @tauri-apps/plugin-shell also referenced packages not listed in package.json, causing the CI Type Check job to fail. Removing this dead module makes tsc -b green. https://claude.ai/code/session_011xUm8nLQmyjMyis1vG1cmd
Deploying typeflow with
|
| Latest commit: |
103c1a8
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://bddd1255.typeflow-4n3.pages.dev |
| Branch Preview URL: | https://claude-merge-dependabot-prs.typeflow-4n3.pages.dev |
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 721f5095cb
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| "react-resizable-panels": "^2.1.7", | ||
| "recharts": "^2.15.1", | ||
| "react-resizable-panels": "^4.0.15", | ||
| "recharts": "^3.6.0", |
There was a problem hiding this comment.
Set CartesianGrid axis ids before upgrading Recharts
With this Recharts 3 upgrade, the stats charts that define YAxis yAxisId="left"/"right" but leave CartesianGrid without a matching yAxisId (src/components/StatsScreen.tsx lines 504/508 and 892/899) lose their horizontal grid lines: Recharts 3 now matches grid lines to the explicit x/yAxisId instead of implicitly choosing the first axis, and grids with a non-default axis id no longer render unless the id is provided. Please update those grids (for example yAxisId="left") as part of the dependency bump.
Useful? React with 👍 / 👎.
Recharts 3 no longer implicitly matches CartesianGrid to the first y-axis when multiple yAxisIds are defined; an explicit yAxisId is now required, otherwise the horizontal grid lines disappear. Both StatsScreen charts that use yAxisId="left"/"right" were affected. Reported by Codex review on PR #17. https://claude.ai/code/session_011xUm8nLQmyjMyis1vG1cmd
Summary
5 件の Dependabot PR (#9, #12, #14, #15, #16) を統合し、major bump 由来の breaking changes に対応したコンシリデーション PR です。
依存関係の更新 (cherry-pick で個別コミット)
Breaking change への追従
src/components/ui/chart.tsx)ChartTooltipContentの props 型をTooltipContentPropsに変更(v3 でTooltipの props からpayload/labelが除外され、content render prop 側に移動)ChartLegendContentの props 型をDefaultLegendContentPropsに変更formatter呼び出し時の引数型をValueTypeに整合src/components/ui/resizable.tsx)PanelGroup→Group、PanelResizeHandle→Separatorにリネームeslint.config.mjs)recommendedにはset-state-in-effect/purity/immutability等の厳格ルールが多数追加され、既存コードに 23 件の新規エラーが発生rules-of-hooks(error) +exhaustive-deps(warn) にピン留めし、baseline を維持lockfile
bun installでbun.lockを再生成(個別コミット)。Test plan
bun run typecheck— pre-existing なsrc/lib/tauri.tsの 2 エラー以外は解消(main にも同じエラーあり、chore(deps-dev): bump wrangler from 3.114.16 to 4.54.0 #16 等の CI でも失敗中)bun run lint— 0 errors / 10 warnings(main baseline と同じ)bun run test:run— 148/148 passingbun run build— successStatsScreen.tsx(recharts 利用箇所)の見た目確認(recharts v3 移行のため要 manual check)CI ステータスと既知の問題
src/lib/tauri.tsの@tauri-apps/plugin-os/@tauri-apps/plugin-shellモジュール解決エラー(pre-existing、main の他 PR chore(deps-dev): bump wrangler from 3.114.16 to 4.54.0 #16 でも同じ失敗)。本 PR の変更とは無関係。tauri.tsは現状どこからも import されていないため、別途@tauri-apps/plugin-os@tauri-apps/plugin-shellを devDependencies に追加するか、tauri.ts自体を削除する対応を推奨。マージ後の後始末
このブランチを
mainにマージすると、元の 5 件の Dependabot PR (#9, #12, #14, #15, #16) は Dependabot の次回スキャン時に自動でクローズされます。手動でクローズしたい場合は@dependabot closeコメントで個別にクローズ可能です。Summary by CodeRabbit
Chores
Refactor
Bug Fixes
Code Quality