This PR is the first part of a refactoring aiming to deprecate the
hotkey scopes api in favor of the new focus stack api which is more
robust.
The refactored components in this PR are the dropdowns and the side
panel/command menu.
- Replaced `useScopedHotkeys` by `useHotkeysOnFocusedElement` for all
dropdown components, selectable lists and the command menu
- Introduced `focusId` for all dropdowns and created a common hotkey
scope `DropdownHotkeyScope` for backward compatibility
- Replaced `setHotkeyScopeAndMemorizePreviousScope` occurrences with
`usePushFocusItemToFocusStack` and `goBackToPreviousHotkeyScope` with
`removeFocusItemFromFocusStack`
Note: Test that the shorcuts and arrow key navigation still work
properly when interacting with dropdowns and the command menu.
Bugs that I have spotted during the QA but which are already present on
main:
- Icon picker select with arrow keys doesn’t work inside dropdowns
- Some dropdowns are not selectable with arrow keys (no selectable list)
- Dropdowns in dropdowns don’t reset the hotkey scope correctly when
closing
- The table click outside is not triggered after closing a table cell
and clicking outside of the table
## Context
- Same logic as role level permission, setting true on any higher
permission will force true on read and removing read will remove higher
permissions. Just a bit more complex here since object level permissions
have 3 possible states instead of a simple bool.
Note and task tabs in side panel should only show if user has reading
permission on them.
"Go to companies", "Go to workflows", etc. in command menu should only
show is user has reading permission on related objects.
<img width="507" alt="Capture d’écran 2025-06-17 à 11 09 50"
src="https://github.com/user-attachments/assets/3a2a4c25-0b9b-4ee6-b18f-b019b8a56d47"
/>
<img width="505" alt="Capture d’écran 2025-06-17 à 11 09 56"
src="https://github.com/user-attachments/assets/8a219955-cc8e-4dbf-a4f9-a50e1aaa4b59"
/>
**How to test**
Assign a user with a custom role that has **no** read permissions on
notes/tasks/workflows/companies/opportunities/people (no need to test
them all but at least one between note and tasks; workflows; one between
companies/opportunities/people). Check that you don't see the related
tab / action.
---------
Co-authored-by: Charles Bochet <charles@twenty.com>
## Context
Icon does not exist in tabler-icon it seems, had to create a new one
manually.
Also added a reload current user when roles are updated to update the
state accordingly
<img width="419" alt="Screenshot 2025-06-18 at 13 06 23"
src="https://github.com/user-attachments/assets/2667883e-c392-4f68-bc04-7471b9bdd6fd"
/>
- Fixed an issue where you have invitations in your available workspaces
for signup.
- Corrected the URL display in the browser when hovering over the twenty
logo on the sign-in/up form.
- The workspace list is now displayed when you are logged into the
default domain.
Closes#12571
~~## What’s broken?~~
~~Toggling a feature flag in the admin panel re-renders the entire table
and uses a Framer Motion slide animation for the knob. Each animation
frame forces a layout recalculation all the way up, causing the page to
“jump.”~~
~~## What’s the fix?~~
~~Swap out the Framer Motion toggle for a pure-CSS version:~~
~~- Container is position: relative~~
~~- Knob is position: absolute and moves via left~~
~~- A transition: left 0.3s ease + will-change: left hint runs on the
compositor layer~~
~~This keeps the smooth slide effect but never triggers parent layout
reflows.~~
~~No changes to the public <Toggle> API or behavior.~~
~~TODO: test all toggles in app and stories if any~~
---------
Co-authored-by: Charles Bochet <charles@twenty.com>
it is an unusual 2.75 here.
I tried to set it to 3 however it requires a big re-work on all cells of
the table. The main concern being the new border left of 1px for the
"focus mode"
Note: to be fair, we are not 100% aligned with the Figma on the paddings
and alignment contruction. It is not related to this issue, but makes
this fix not ideal since not aligned with our CSS standards.
Fixes https://github.com/twentyhq/twenty/issues/12607
---------
Co-authored-by: Charles Bochet <charles@twenty.com>
This PR fixes a bug where the side panel couldn't be closed after the
execution of a workflow with a form. After the execution of the
workflow, `goBackFromCommandMenu` is called to show the workflow run.
The hotkey scope wasn't reset properly, and the click outside listener
from the side panel is only triggered when the scope is
`CommandMenuFocused`.
This PR sets the hotkey scope to `CommandMenuFocused` when going back or
when navigating inside the command menu history.
Note: (we don't use `setHotkeyScopeAndMemorizePreviousScope` here
because we don't need to memorize the active hotkey scope of the page we
are leaving)
Before:
https://github.com/user-attachments/assets/09edf97b-7520-46ce-ade3-6bb6b15ef435
After:
https://github.com/user-attachments/assets/16c288cb-1d42-4099-8925-74a673f7a479
To test :
- Import a record with Id column (for upsert-ing) + some subfields in
each composite fields. Check that only matched subfields are updated
(Main issue)
- Import a record with a multi-select field - Check it works + Match
multi-select field on a non multi-select column, check it does not work.
(Specific bug fixed in second commit is : undefined value in multi
select column (corresponding to no item selected) caused error in
multi-select parsing).
closes https://github.com/twentyhq/core-team-issues/issues/990
## Context
Support button was missing for configuration having support enabled
(FrontApp)
<img width="1253" alt="image"
src="https://github.com/user-attachments/assets/930e3e0c-05a1-4a5b-820b-bb257f19fdde"
/>
## How
Recently, we changed some enums from lowercase to uppercase in graphql
## Problem resolution
supportDriver was typed as a string where we could have used
SupportDriver type. I'm exposing it in the graphql generated files to
re-use in the front so this issue cannot happen anymore
## All Objects
Remove from deleted records view for all object:
- NoSelectionRecordActionKeys.CREATE_NEW_RECORD
- NoSelectionRecordActionKeys.IMPORT_RECORDS
- SingleRecordActionKeys.ADD_TO_FAVORITES
- SingleRecordActionKeys.REMOVE_FROM_FAVORITES
Remove from index view for deleted record:
- DELETE
- ADD_TO_FAVORITES
- REMOVE_FROM_FAVORITES
## Workflows
Remove from deleted workflows view:
- NoSelectionWorkflowRecordActionKeys.GO_TO_RUNS
- SingleRecordActionKeys.EXPORT
Remove from index view for deleted workflow:
- ACTIVATE
- DEACTIVATE
- DISCARD_DRAFT
- SEE_ACTIVE_VERSION
- SEE_RUNS
- SEE_VERSIONS
- TEST
This PR introduces a new generic UI component DropdownMenuInnerSelect,
that improves the UI by allowing to have both a dropdown menu header and
a select in the header.
In this PR we implement it just for filter dropdown components.
Fixes https://github.com/twentyhq/core-team-issues/issues/1001
### Issue:
overflow of input fields when opening the side panel.
Could be imporved with a better command menu state handling
### Solution:
In command menu hooks, we now close all dropdowns when opening the side
panel. This ensures all UI elements are close properly before the
sidepanel shows up
Fixes : https://github.com/twentyhq/twenty/issues/12485
Co-authored-by: Charles Bochet <charles@twenty.com>
