# Introduction
closes https://github.com/twentyhq/core-team-issues/issues/591
Same than for `twenty-shared` made in
https://github.com/twentyhq/twenty/pull/11083.
## TODO
- [x] Manual migrate twenty-website twenty-ui imports
## What's next:
- Generate barrel and migration script factorization within own package
+ tests
- Refactoring using preconstruct ? TimeBox
- Lint circular dependencies
- Lint import from barrel and forbid them
### Preconstruct
We need custom rollup plugins addition, but preconstruct does not expose
its rollup configuration. It might be possible to handle this using the
babel overrides. But was a big tunnel.
We could give it a try afterwards ! ( allowing cjs interop and stuff
like that )
Stuck to vite lib app
Closed related PRs:
- https://github.com/twentyhq/twenty/pull/11294
- https://github.com/twentyhq/twenty/pull/11203
Fixes: #6436
Changes made:
- Added typecheck step before twenty-ui build to check stories TS errors
- Added a tsconfig.dev.json to add stories and tests to typecheking when
in dev mode
- Added tsconfig.dev.json to storybook dev command of twenty-ui to
typecheck stories while developing
- Fixed twenty-ui stories that were broken
- Added a serve command to serve front build
- Fixed unit test from another PR
---------
Co-authored-by: Félix Malfait <felix.malfait@gmail.com>
Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
Split from https://github.com/twentyhq/twenty/pull/4518
- Setup `@ui/*` as an internal alias to reference `twenty-ui/src`.
- Configures twenty-front to understand the `@ui/*` alias on development
mode, so twenty-ui can be hot reloaded.
- When building on production mode, twenty-front needs twenty-ui to be
built beforehand (which is automatic with the `dependsOn` option).
- Configures twenty-front to understand the `@ui/*` alias when launching
tests, so there is no need to re-build twenty-ui for tests.
---------
Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
Split from https://github.com/twentyhq/twenty/pull/4518
Related to #4766
Mutualizes eslint config between projects.
I didn't include `twenty-server` in this PR as this was causing too many
lint errors.
* feat: create a separate package for twenty-ui, extract the pill component with hard-coded theme values into it, and use the component inside twenty-front to complete the setup
* feat: extract the light and the dark theme into twenty-ui and update the AppThemeProvider component inside twenty-front to consume themes from twenty-ui
* fix: create a decorator inside preview.tsx to provide a default theme to storybook development server
* fix: remove redundant type declarations and revert back the naming convention for theme declarations
* fix: introduce a default value for pill label within the story for development server
* fix: introduce the nx script into package.json for twenty-ui and resolve imports for theme type within the package
* fix: remove the pill component from the twenty-front package along with the story for it
* fix: revert the package versions to those before running the nx cli command for storybook init
* feat: update readme to include details for building the ui library and starting the storybook development server
* fix: include details about twenty-ui inside jest.config for twenty-front to complete front-jest job
* - Added preview head for font
- Added theme addon for light/dark switch
- Added ComponentDecorator
---------
Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
