After reading the blocknote documentation :
- we decided to increase to 100% the lines width
- we decided to reduce as much as possible inner padding
- we decided it's on the parent to decide the padding of the richtext
The two last points are recommended in a discussion on the project
blocknote. This way clicking on padding won't trigger weird behaviour on
Chrome.
Fixes
https://github.com/twentyhq/core-team-issues/issues/827#issuecomment-2842350359
## What
- Deprecate overlayscrollbars as we decided to follow the native
behavior
- rework on performances (avoid calling recoil states too much at field
level which is quite expensive)
- Also implements:
https://github.com/twentyhq/core-team-issues/issues/569
---------
Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
# 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
# Introduction
In this PR we've migrated `twenty-shared` from a `vite` app
[libary-mode](https://vite.dev/guide/build#library-mode) to a
[preconstruct](https://preconstruct.tools/) "atomic" application ( in
the future would like to introduce preconstruct to handle of all our
atomic dependencies such as `twenty-emails` `twenty-ui` etc it will be
integrated at the monorepo's root directly, would be to invasive in the
first, starting incremental via `twenty-shared`)
For more information regarding the motivations please refer to nor:
- https://github.com/twentyhq/core-team-issues/issues/587
-
https://github.com/twentyhq/core-team-issues/issues/281#issuecomment-2630949682
close https://github.com/twentyhq/core-team-issues/issues/589
close https://github.com/twentyhq/core-team-issues/issues/590
## How to test
In order to ease the review this PR will ship all the codegen at the
very end, the actual meaning full diff is `+2,411 −114`
In order to migrate existing dependent packages to `twenty-shared` multi
barrel new arch you need to run in local:
```sh
yarn tsx packages/twenty-shared/scripts/migrateFromSingleToMultiBarrelImport.ts && \
npx nx run-many -t lint --fix -p twenty-front twenty-ui twenty-server twenty-emails twenty-shared twenty-zapier
```
Note that `migrateFromSingleToMultiBarrelImport` is idempotent, it's atm
included in the PR but should not be merged. ( such as codegen will be
added before merging this script will be removed )
## Misc
- related opened issue preconstruct
https://github.com/preconstruct/preconstruct/issues/617
## Closed related PR
- https://github.com/twentyhq/twenty/pull/11028
- https://github.com/twentyhq/twenty/pull/10993
- https://github.com/twentyhq/twenty/pull/10960
## Upcoming enhancement: ( in others dedicated PRs )
- 1/ refactor generate barrel to export atomic module instead of `*`
- 2/ generate barrel own package with several files and tests
- 3/ Migration twenty-ui the same way
- 4/ Use `preconstruct` at monorepo global level
## Conclusion
As always any suggestions are welcomed !
fixes: #10913
1. Original issue:
```typescript
<StyledTabListContainer shouldDisplay={visibleTabs.length > 1}>
<StyledTabList />
</StyledTabListContainer>
```
TabList wasn't getting full width.
2. First fix attempt ie #10904:
```typescript
{visibleTabs.length > 1 && (
<StyledTabList />
)}
```
This broke workflow views because:
Workflows use single-tab layouts
The conditional rendering prevented the tab from showing at all when
visibleTabs.length <= 1
3. Current working solution:
```typescript
const StyledOuterContainer = styled.div`
width: 100%;
`;
<StyledTabListContainer shouldDisplay={visibleTabs.length > 1}>
<StyledOuterContainer>
<StyledTabList />
</StyledOuterContainer>
</StyledTabListContainer>
```
This works because:
Keeps the original display logic that supports single-tab workflows
Fixes the width issue with the new container
Maintains tab state management needed for workflow visualization
Closes https://github.com/twentyhq/core-team-issues/issues/271
This PR
- Removes the feature flag IS_COMMAND_MENU_V2_ENABLED
- Removes all old Right drawer components
- Removes the Action menu bar
- Removes unused Copilot page
### Bug
The active tab bottom border appeared slightly above the TabList's light
bottom border.
### Investigation
- Initial fix: Adjusted margin-bottom to -1px in Tab component to align
borders
- This fix caused active bottom borders to disappear in tabs wrapped
with ShowPageSubContainerTabListContainer
- Found that ShowPageSubContainerTabListContainer was adding a redundant
bottom border that overlapped with TabList's border
### Solution
- Removed ShowPageSubContainerTabListContainer to eliminate the
redundant border
- Kept the -1px margin-bottom fix in Tab component
- This ensures consistent border behavior across all TabList
implementations
- Improve the type-safety of the objects mapping the id of a right
drawer or side panel view to a React component
- Improve the types of the `useTabList` hook to type the available tab
identifiers strictly
- Create a specialized `WorkflowRunDiagramCanvas` component to render a
`WorkflowRunDiagramCanvasEffect` component that opens
`RightDrawerPages.WorkflowRunStepView` when a step is selected
- Create a new side panel view specifically for workflow run step
details
- Create tab list in the new side panel; all the tabs are `Node`,
`Input` and `Output`
- Create a hook `useWorkflowSelectedNodeOrThrow` not to duplicate
throwing mechanisms
Closes https://github.com/twentyhq/core-team-issues/issues/432
## Demo
https://github.com/user-attachments/assets/8d5df7dc-0b99-49a2-9a54-d3eaee80a8e6
# Introduction
Avoid having multiple `isDefined` definition across our pacakges
Also avoid importing `isDefined` from `twenty-ui` which exposes a huge
barrel for a such little util function
## In a nutshell
Removed own `isDefined.ts` definition from `twenty-ui` `twenty-front`
and `twenty-server` to move it to `twenty-shared`.
Updated imports for each packages, and added explicit dependencies to
`twenty-shared` if not already in place
Related PR https://github.com/twentyhq/twenty/pull/9941
The DX is not great when you need to do a lot of database
resets/command.
Should we disable Typescript validation to speed things up? With this
and caching database:reset takes 1min instead of 2 on my machine.
See also: https://github.com/typeorm/typeorm/issues/4136
And #9291 / #9293
---------
Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
- New task dropdown wasn't using the proper dropdown id
- Action menu triggered by context menu (right click) on table cell was
listening in edit mode.
This PR was created by [GitStart](https://gitstart.com/) to address the
requirements from this ticket:
[TWNTY-7536](https://clients.gitstart.com/twenty/5449/tickets/TWNTY-7536).
---
### Description
Migrate all menu items components to twenty ui and update imports.
```typescript
MenuItem
MenuItemAvata
MenuItemCommand
MenuItemCommandHotKeys
MenuItemDraggable
MenuItemMultiSelect
MenuItemMultiSelectAvatar
MenuItemMultiSelectTag
MenuItemNavigate
MenuItemSelect
MenuItemSelectAvatar
MenuItemSelectColor
MenuItemSelectTag
MenuItemSuggestion
MenuItemToggle
```
\
Also migrate all other dependent components and utilities like
`Checkbox` & `Toggle`\
\
Fixestwentyhq/private-issues#82
---------
Co-authored-by: gitstart-twenty <gitstart-twenty@users.noreply.github.com>
Co-authored-by: gitstart-twenty <140154534+gitstart-twenty@users.noreply.github.com>
Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
Closes#7499
- Modifies context store states to be component states
- Introduces the concept of `mainContextStore` which will dictate the
available actions inside the command K
- Adds contextual actions inside the right drawer
- Creates a new type of modal variant
Fix: #7100
The `TabList` component, located in
[Tablist](packages/twenty-front/src/modules/ui/layout/tab/components/TabList.tsx),
wraps the Tabs and defines the padding, and is used in multiple places.
The left padding for the Emails and Calendars sections of the Accounts
in Settings has been removed ( list appear when there are multiple
connected accounts ). However, the padding on the Record detail page
remains unchanged.
To address this, prop of css styles is added to `Tablist`, allowing for
the padding of the `TabList` component to be adjusted as required.
Additional styles can also be applied as per requirements individually
for Emails and Calendar section.
<img width="722" alt="Screenshot 2024-10-16 at 5 06 26 AM"
src="https://github.com/user-attachments/assets/3c7648ac-e2a6-4871-b58b-d25b008a06f0">
<img width="789" alt="Screenshot 2024-10-16 at 5 49 18 AM"
src="https://github.com/user-attachments/assets/a6e61b4d-0245-4744-ae87-86fe01a6bc43">
<img width="725" alt="Screenshot 2024-10-16 at 6 22 30 AM"
src="https://github.com/user-attachments/assets/e6a19095-3ee4-431f-ba19-1182552a5c8d">
---------
Co-authored-by: Charles Bochet <charles@twenty.com>
@ehconitin following your question I did a quick refactoring of the show
page - we can push it much further but it would be better to start from
this code than from main
Edit: I will merge to avoid conflicts, this is very far from perfect but
still much better than the mess we had before