# Note link's color contrast fixed in dark mode
## Key changes
This pull request introduces a minor styling update to the `BlockEditor`
component in `BlockEditor.tsx`. It adds a new style rule to ensure
inline links within the `.bn-inline-content` class are styled with the
theme's blue color.
### Styling updates:
*
[`packages/twenty-front/src/modules/ui/input/editor/components/BlockEditor.tsx`](diffhunk://#diff-4a66ce7d5588bddc6237ac1a3b2949fe4432182bd357114294e8a79d98afce51R119-R122):
Added a CSS rule to style links (`<a>` elements) within
`.bn-inline-content` to use the theme's blue color.
## Issue
fixes#11917
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
# 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#9265
#### Summary
The menu options appear in black color in dark mode, making text hard to
read because there is very little contrast between text and background.
#### Solution
Added `color: ${({ theme }) => theme.font.color.secondary};` to the
dropdown menu container, so the menu options inherit the correct text
color from their containers.
### Screenshots
Closes#8439
## Overview
This PR implements functionality to export notes/tasks to PDF and Word
formats.
https://github.com/user-attachments/assets/67eaf4eb-cabc-45ba-8727-13f22ba31067
## Testing
- [x] Verified that the export functionality works for both notes and
tasks, whether exporting immediately after opening the editor or after
editing.
- [x] Ensured the export button appears in the action menu only when the
object is a note/task.
- [x] Ensured the export button appears in the
RightDrawerActionMenuDropdown for a note/task.
## Notes
- The code already supports exporting to Word, but only PDF export is
currently available. To enable Word export, we just need a UI option
allowing users to choose between PDF and Word.
- After upgrading the Blocknote packages to the latest version,
dependency conflicts arose with tiptap and prosemirror-model. To address
this, all tiptap dependencies were consolidated in the root
package.json, and a resolution was added for prosemirror-model. Also,
some methods in CustomAddBlockItem.tsx were missing in the newer
version, so I updated the code to accommodate these changes.
- Exporting a note with an image works only if the image is embedded, as
Blocknote doesn’t support actual image uploads. Uploaded images are
omitted in the PDF export, while the text is retained.
---------
Co-authored-by: Félix Malfait <felix.malfait@gmail.com>
Co-authored-by: Félix Malfait <felix@twenty.com>
- Added a new Seeder service to help with custom object seeds
- Added RichTextFieldInput to edit a rich text field directly on the
table, but deactivated it for now.
- Removed disableBlur property from dropdown because it is no longer
needed since there's only one OverlayContainer component so there can be
only one blur at a time.
- Removed blur CSS properties from every component that used it because
one standalone OverlayContainer is able to handle all cases if placed
properly.
- Also removed disableBackgroundBlur property from SingleRecordSelect
- Removed FieldInputOverlay and FieldTextAreaOverlay components that
were a first attempt to create something like an OverlayContainer
- Used new unified OverlayContainer in RecordInlineCell and
RecordTableCell
- Fixed ScrollWrapper so that it works well both for dropdown with non
overflowing content and dropdown with overflowing content.
- Removed export default value on SearchVariablesDropdown as it is not
used in this codebase
- Refactored SearchVariablesDropdown function as component anti-pattern
- Refactored SearchVariablesDropdownFieldItems UI problems with
separator and missing ScrollWrapper behavior
- Refactored SearchVariablesDropdownObjectItems with UI problems with
separator and missing ScrollWrapper behavior
- Fixed blur bug on Firefox due to wrong placement of the element that
had the CSS property. Blur works on Firefox it it's on the container
that has the highest level in the tree.
- Fixed bug in ActivityTargetInlineCell by removing an unnecessary
container component StyledSelectContainer
- Unified problems of field height with a new common component
FieldInputContainer, instead of putting width and height at the wrong
abstraction level, width and height are a field's concern not a
dropdown, overlay or low-level input concern.
- Fixed block editor dropdown with new OverlayContainer
- Aligning field dropdown with their anchor on inline and table cells,
there are still many small pixel misalignments that give a low quality
impression.
- Fixed FormDateFieldInput that was missing OverlayContainer
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>
### Summary
This pull request addresses issue #6759 by adjusting the icon size and
container padding in the note grip menu. The 6-dot icon's size has been
reduced from 20px to 16px, while the container size has been kept at
20px to maintain the proper alignment and spacing.
### Changes Made
- **Icon Size**: Reduced the SVG icon size to 16x16px.
- **Container Size**: Ensured the container remains 20x20px to
accommodate the icon and maintain visual consistency.
### Screenshots
<img width="1440" alt="Screenshot 2024-08-29 at 3 26 41 AM"
src="https://github.com/user-attachments/assets/d8618636-165a-440d-a41e-947b2aa00bdb">
### Related Issue
- [Issue #6759]
### Testing
- Verified that the icon and container sizes are correctly displayed in
the note grip menu.
- Ensured no other UI elements were affected by these changes.
Please review the changes and let me know if any additional
modifications are required. Thank you!
Co-authored-by: Rishi Kant <khairrishi@Rishis-MacBook-Air.local>
@Bonapara @lucasbordeau
This PR addresses issue #6489:
- Created an entire sidemenu for the block editor.
## Review Request
Please review the implementation of the custom sidemenu.
## Outstanding Issues
1. Sidemenu Positioning:
- The current placement is determined by the BlockNote package.
- I need assistance in positioning it according to the Figma designs.
- Attempted adding margin to the sidemenu, but this solution doesn't
scale well across different screen sizes.
2. Props Spreading in `CustomSidemenu.tsx`:
- Unable to avoid props spreading due to the third-party BlockNote
components.
- Added eslint-disable comments as a temporary solution.
Your insights on these challenges would be greatly appreciated,
especially regarding the sidemenu positioning and any potential
alternatives to props spreading.
https://github.com/user-attachments/assets/4914a037-a115-4189-88bc-a41d121d309d
---------
Co-authored-by: Félix Malfait <felix.malfait@gmail.com>
In this PR, I'm fixing two issues that we have faced:
- computing a rich text first line in case of the first block content is
not a text
- migrating existing timelineActivities tied to tasks / notes to
linked-tasks / linked-notes during migration command
## Description
Adds a view for creation date and author to notes and tasks panel. Here
is a preview of the new `ActivityCreationDate` component:
Closes#5424
### Type of change
<!-- Please delete options that are not relevant. -->
- [x] New feature (non-breaking change which adds functionality)
## Checklist
- [x] My code follows the style guidelines of this project
- [x] I have performed a self-review of my own code
- [x] I have commented my code, particularly in hard-to-understand areas
- [x] I have made corresponding changes to the documentation
- [x] My changes generate no new warnings
- [x] I have added tests that prove my fix is effective or that my
feature works
- [x] New and existing unit tests pass locally with my changes
- [x] Any dependent changes have been merged and published in downstream
modules
---------
Co-authored-by: Félix Malfait <felix.malfait@gmail.com>
* on click focus on activity body editor
* acitivity editor hot key scope added
* classname prop added escape hot key scope call back added
* passing containerClassName prop for activity editor
* hot key scope added
* console log cleanup
* activity target escape hot key listener added
* tasks filter hot key scope refactor
* scope renaming refactor
* imports order linting refactor
* imports order linting refactor
* acitivity editor field focus state and body editor text listener added
* logic refactor removed state for activity editor fields focus
* removed conflicting click handler of inline cell creating new scope
* linting and formatting
* acitivity editor field focus state and body editor text listener added
* adding text at the end of line
* fix duplicate imports
* styling: gap fix activity editor
* format fix
* Added comments
* Fixes
* Remove useListenClickOutside, state, onFocus and onBlur
* Keep simplifying
* Complete review
* Fix lint
---------
Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
Co-authored-by: Charles Bochet <charles@twenty.com>
