powerpipe icon indicating copy to clipboard operation
powerpipe copied to clipboard

Upgrade Storybook from 8.6.14 to 10.0.8

Open e-gineer opened this issue 4 months ago • 2 comments

Summary

  • Upgraded Storybook from 8.6.14 → 9.1.16 → 10.0.8
  • Fixed framer-motion 12 compatibility issues
  • Replaced incompatible third-party addons with Storybook 9/10 alternatives
  • Fixed story rendering by adding dashboardsMetadata to storybook context
  • Added .claude/wip/ to .gitignore to prevent planning files from being tracked

Changes

Storybook 8.6.14 → 9.1.16

  • Updated all @storybook/* packages to 9.1.16
  • Replaced storybook-dark-mode addon (incompatible) with @storybook/addon-themes
  • Replaced storybook-addon-react-router-v6 with [email protected]
  • Updated story imports from @storybook/react to @storybook/react-webpack5
  • Added missing peer dependencies

Storybook 9.1.16 → 10.0.8

  • Updated all @storybook/* packages to 10.0.8
  • All stories render correctly (text, charts, tables, icons)
  • Theme toggle (light/dark) working
  • React Router addon functioning
  • Visual tests addon accessible

Bug Fixes

  • Fixed DashboardSearchPathProvider error by adding dashboardsMetadata to storybook context in src/utils/storybook.tsx
  • This fixes the TypeError: Cannot read properties of undefined that was preventing stories from rendering

Repository Cleanup

  • Added .claude/wip/ to .gitignore to exclude planning files from version control

Testing

  • ✅ All stories render without errors
  • ✅ Theme toggle works correctly
  • ✅ React Router addon functional
  • ✅ Visual tests addon accessible
  • ✅ No console errors

Notes

  • Peer dependency warning for [email protected] expecting Storybook ^9.0.0 is cosmetic - addon works perfectly with 10.0.8
  • Official Storybook 10 support for the addon is tracked in Issue #94

🤖 Generated with Claude Code

Co-Authored-By: Claude [email protected]

e-gineer avatar Nov 20 '25 01:11 e-gineer

Fixed the argTypesRegex deprecation warning by removing it from .storybook/preview.jsx.

Since none of our stories currently use action props (onClick, onChange, etc.), we can safely remove this configuration. Storybook now starts with only the expected peer dependency warning for storybook-addon-remix-react-router (which works perfectly despite the warning).

Verified that Storybook builds successfully with "No issues found" ✅

e-gineer avatar Nov 20 '25 11:11 e-gineer

@MichaelBurgess After the fix, you should now see:

argTypesRegex warning - Removed (fixed) ⚠️ Peer dependency warning - Expected and documented in PR description

The addon works perfectly with Storybook 10 despite the peer dependency warning. Build completes with "No issues found".

e-gineer avatar Nov 20 '25 11:11 e-gineer