Adds color support for navigation menu items.
---------
Co-authored-by: Copilot Autofix powered by AI <223894421+github-code-quality[bot]@users.noreply.github.com>
Co-authored-by: Devessier <baptiste@devessier.fr>
Co-authored-by: Charles Bochet <charles@twenty.com>
## Summary
Add Home/Chat tabs and a dedicated threads list in the navigation
drawer.
## Changes
- **Navbar tabs:** Tabs in the drawer to switch between Home and Chat
(with “New chat” button). Shown on desktop when expanded and on mobile
below the workspace selector.
- **Navbar threads list:** New `NavigationDrawerAIChatThreadsList` for
the Chat tab with date groups (Today / Yesterday / Older), thread rows
as `NavigationDrawerItem` (IconComment, title, timestamp). Shared
`useAIChatThreadClick` hook used by navbar and command menu; navbar
passes `resetNavigationStack: true`.
- **NavigationDrawerItem:** New `alwaysShowRightOptions` prop so the
timestamp is always visible (no hover-only).
---------
Co-authored-by: Etienne <45695613+etiennejouan@users.noreply.github.com>
Co-authored-by: Félix Malfait <felix@twenty.com>
Co-authored-by: Charles Bochet <charles@twenty.com>
## Summary
- Migrate more hand-written test mocks to auto-generated data from a
real Twenty instance
- Add generators for views, billing plans, API keys; extend record
generator for workspace members, favorites, connected accounts, calendar
events
- Remove 9 hand-written mock files replaced by generated equivalents
- Update 16 test/story files to use generated data
- Fix WorkflowEditActionEmailBase story assertion to match configured
recipient email
## Test plan
- [x] Lint, typecheck, unit tests pass
- [ ] Storybook tests pass in CI
This PR pgrades all BlockNote packages (@blocknote/core,
@blocknote/react, @blocknote/mantine, @blocknote/server-util,
@blocknote/xl-docx-exporter, @blocknote/xl-pdf-exporter) to 0.47.0 and
adapts the codebase to the new API.
### Changes
- Dependency upgrades: Bumped all BlockNote packages to 0.47.0, added
required Mantine v8 peer dependencies, removed unnecessary prosemirror
resolutions
- Formatting toolbar: Replaced the manual reimplementation of
FormattingToolbarController (which handled visibility, positioning,
portal rendering, text-alignment-based placement, and a
dangerouslySetInnerHTML transition trick) with BlockNote's built-in
FormattingToolbarController. The toolbar buttons themselves are
unchanged.
- Side menu: Replaced manual drag handle menu positioning and rendering
(DashboardBlockDragHandleMenu, DashboardBlockColorPicker, and their
floating configs) with BlockNote's built-in SideMenuController,
DragHandleButton, and DragHandleMenu components. Deleted 4 files that
became dead code.
- Extension API migration: Replaced deprecated editor.suggestionMenus
and editor.formattingToolbar APIs with the new extension system
(SuggestionMenu, useExtensionState, editor.getExtension())
- Slash menu fixes: Filtered out BlockNote's new default "File" item
(added in 0.47) to avoid duplicates with our custom one; added icon
mappings for new block types (Toggle List, Divider, Toggle Headings,
Headings 4-6)
- Server-side: Switched @blocknote/server-util to dynamic import() to
handle ESM-only transitive dependencies in CJS context
- Eliminated the StyledDropIndicator component, which was previously used to visually indicate drop targets during drag-and-drop operations.
- Updated the WorkspaceDndKitSortableItem to remove references to isDropTarget, streamlining the component's functionality.
- Introduced `FavoritesDragDropProviderContent` to manage drag-and-drop interactions for favorite items within the workspace.
- Updated `CurrentWorkspaceMemberFavoritesFolders` to wrap favorite components with the new `FavoritesDragProvider`, enabling drag-and-drop functionality.
- Refactored `PageDragDropProvider` to utilize `FavoritesDragDropProviderContent`, streamlining drag-and-drop logic.
- Added new components for handling workspace navigation items with drag-and-drop capabilities, including `WorkspaceSectionListDndKit` and `WorkspaceSectionListHelloPangea`.
- Enhanced existing components to support the new drag-and-drop context and improve user experience during item manipulation.
- Introduced `DndKitDropTargetIdSeparator.ts` to define a constant for separating droppable IDs in drag-and-drop functionality.
- Added `getDndKitDropTargetId.ts` to generate a unique drop target ID using the droppable ID and index.
- Created `parseDropTargetIdToDestination.ts` to parse the drop target ID back into its components, returning the droppable ID and index or null if invalid.
- Updated the `preloadWorkspaceDndKit` function to enhance code clarity by adding braces around the return statement when `preloadScheduled` is true. This change improves the readability of the conditional logic.
- Updated `CommandMenuAddToNavDraggablePlaceholder.tsx` to conditionally render children based on the `WorkspaceDndKitContext`, allowing for better integration with drag-and-drop features.
- Modified `CommandMenuAddToNavDroppable.tsx` to utilize lazy loading for the `CommandMenuAddToNavDroppableDndKit` component when in DnD mode, improving performance.
- Enhanced `CommandMenuItemWithAddToNavigationDrag.tsx` to support lazy loading of the `CommandMenuItemWithAddToNavigationDragDndKit` component, streamlining drag-and-drop interactions.
- Refactored imports in `CurrentWorkspaceMemberFavorites.tsx` for improved state management and consistency across components.
- Introduced `SortableDropTargetRefContext.tsx`, creating a context for managing references to sortable drop targets in the navigation menu.
- This context will facilitate the integration of drag-and-drop features within the workspace navigation, enhancing user interaction.
- Introduced `WorkspaceDndKitProvider.tsx`, a new provider component that manages drag-and-drop interactions within the workspace navigation.
- Added `WorkspaceDndKitContext.tsx` to create a context for sharing drag-and-drop state across components.
- Implemented state management for drag events, including handling drag start, drag over, and drop actions, utilizing `@dnd-kit/react` for enhanced drag-and-drop capabilities.
- Introduced `WorkspaceDndKitSortableItem.tsx`, a new component for implementing sortable drag-and-drop functionality within the workspace navigation menu.
- Utilizes `@dnd-kit/react/sortable` for drag-and-drop capabilities and includes styled components for visual indicators during sorting.
- Introduced `CommandMenuItemWithAddToNavigationDragDndKit.tsx` for draggable command menu items with navigation integration.
- Added `WorkspaceDndKitDraggableItem.tsx` to facilitate drag-and-drop functionality for workspace items, supporting custom item components and scrollable containers.
- Introduced `CommandMenuItemWithAddToNavigationDragDndKit.tsx` for draggable command menu items with navigation integration.
- Added `WorkspaceDndKitDraggableItem.tsx` to facilitate drag-and-drop functionality for workspace items, supporting custom item components and scrollable containers.
- Introduced a new file `preloadWorkspaceDndKit.ts` that contains a function to preload the WorkspaceDndKitProvider.
- The function ensures that preloading is scheduled only once, utilizing `requestIdleCallback` or a fallback `setTimeout` for efficient resource loading.
- Added @dnd-kit packages (abstract, collision, dom, geometry, react, state) at version 0.3.2 to yarn.lock and package.json.
- Updated @preact/signals-core to version 1.13.0 in yarn.lock.
## Summary
Unifies test mocking tooling across Jest and Storybook, replaces
handcrafted mock data with auto-generated server-fetched data, and
restructures the mock data generation script for maintainability.
### Mock data generation
- Split `generate-mock-data.ts` into three focused modules under
`scripts/mock-data/`:
- `utils.ts` — shared authentication, GraphQL client, and file writer
- `generate-metadata.ts` — fetches object metadata from `/metadata`
- `generate-record-data.ts` — fetches record data from `/graphql` using
metadata-driven dynamic queries
- The orchestrator (`generate-mock-data.ts`) authenticates once and
passes the token to both generators
- Company records are now fetched from the actual server (limited to 10
records) instead of being handcrafted
- Generated files are organized under `generated/metadata/objects/` and
`generated/data/companies/`
### Unified test utilities
- Consolidated Jest and MSW mocking into shared utilities that compose
production code (`prefillRecord`, `getRecordNodeFromRecord`,
`getRecordConnectionFromRecords`) with mock metadata
- Renamed `generateEmptyJestRecordNode` → `generateMockRecordNode` and
moved to `testing/utils/`
- Extracted `generateMockRecordConnection` into its own file
- Removed `sanitizeInputForPrefill` workaround (no longer needed with
correctly shaped generated data)
- Add media-specific events
- Extend `iFrame` with missing properties
- Enrich `SerializedEventData` with media-related target fields so
serialized events carry the media element state.
- Refactor the `remote-elements` code generator to support per-element
custom events
Abdul Rahman
