Problems
6 components use <style jsx> which requires 'use client' in Next.js 15 and is inconsistent with the rest of the codebase (CSS Modules). Migrate all to CSS Modules.
Files to migrate
src/components/UnitHighlight/index.tsxsrc/components/Button/index.tsxsrc/components/Z1/index.tsxsrc/components/UnitCanvas/index.tsxsrc/special/heterotopia/Highlight.tsxsrc/special/heterotopia/Title.tsx
Additional: rewrite UnitCanvas as functional component
UnitCanvas is the only class component in the project. While migrating its styles, also:
- Rewrite as functional component with
useRef/useEffect
- Add null guards for canvas and context (currently uses non-null assertions)
- Clear
stopTimeout in cleanup to fix timer leak
- Add
'use client' directive
Problems
6 components use
<style jsx>which requires'use client'in Next.js 15 and is inconsistent with the rest of the codebase (CSS Modules). Migrate all to CSS Modules.Files to migrate
src/components/UnitHighlight/index.tsxsrc/components/Button/index.tsxsrc/components/Z1/index.tsxsrc/components/UnitCanvas/index.tsxsrc/special/heterotopia/Highlight.tsxsrc/special/heterotopia/Title.tsxAdditional: rewrite
UnitCanvasas functional componentUnitCanvasis the only class component in the project. While migrating its styles, also:useRef/useEffectstopTimeoutin cleanup to fix timer leak'use client'directive