Skip to content

Modularize Studio App.jsx into lib/components + add Vitest test suite#2

Merged
cybermejo merged 1 commit into
mainfrom
worktree-studio-modularize-and-test
Jun 17, 2026
Merged

Modularize Studio App.jsx into lib/components + add Vitest test suite#2
cybermejo merged 1 commit into
mainfrom
worktree-studio-modularize-and-test

Conversation

@cybermejo

Copy link
Copy Markdown
Owner

Summary

Splits the single 997-line studio/src/App.jsx into focused modules and adds the Studio's first automated test suite (Vitest).

Extraction (behavior-preserving, verbatim moves)

  • src/lib/lexicons.js — word/emoji sets, TONE_DEFS/TONE_COLOR/TONE_PATTERNS, CAPTION_TONES
  • src/lib/analysis.jstokenize, countEmoji, analyzeSentiment, analyzeTone, enrich
  • src/lib/csv.jsFIELD_MAP, pick, toNum, normalize, parseCSV
  • src/components/ — primitives + UploadCard / OverviewTab / BrandsTab / TweetsTab / CaptionStudio
  • src/App.jsx — thin shell (997 → 174 lines) wiring tabs + selection state

Tests

  • 40 tests across analysis / csv / lexicons; 100% line + 95.5% branch coverage of lib/
  • npm test / test:watch / test:coverage; standalone vitest.config.js so the Vite build config is untouched

Behavior preservation

  • Production build is byte-stable: identical CSS hash, same bundle size
  • A normalized source diff vs the original shows only formatter cosmetics (semicolons, trailing commas, arrow-param parens) plus the deliberate enrich/CAPTION_TONES relocations
  • Dropped the unused lucide Filter import

No behavior changes — pure refactor + tests.

App.jsx was a single 997-line file mixing data, analysis logic, CSV parsing,
UI primitives, and five feature components. This splits it into focused modules
and adds the Studio's first automated tests.

Extraction (behavior-preserving, verbatim moves):
- src/lib/lexicons.js   word/emoji sets, TONE_DEFS/COLOR/PATTERNS, CAPTION_TONES
- src/lib/analysis.js   tokenize, countEmoji, analyzeSentiment, analyzeTone, enrich
- src/lib/csv.js        FIELD_MAP, pick, toNum, normalize, parseCSV
- src/components/       primitives + UploadCard/Overview/Brands/Tweets/CaptionStudio
- src/App.jsx           thin shell (997 -> 174 lines) wiring tabs + selection state

Tests (Vitest, jsdom-free Node env):
- 40 tests across analysis/csv/lexicons; 100% line + 95.5% branch coverage of lib/
- npm test / test:watch / test:coverage scripts; standalone vitest.config.js so
  the build config is untouched

Behavior is unchanged: production build is byte-stable (identical CSS hash), and a
normalized source diff vs the original shows only formatter cosmetics (semicolons,
trailing commas, arrow-param parens) plus the deliberate enrich/CAPTION_TONES moves.
The unused lucide `Filter` import was dropped.
@cybermejo cybermejo self-assigned this Jun 17, 2026
@cybermejo cybermejo added the enhancement New feature or request label Jun 17, 2026
@cybermejo
cybermejo merged commit 744e76e into main Jun 17, 2026
4 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement New feature or request

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant