8928 refactor page header buttons (#8952)

Closes #8928 

<img width="1296" alt="Capture d’écran 2024-12-09 à 10 26 37"
src="https://github.com/user-attachments/assets/f33202b0-9c11-48da-8daa-e867d62a1803">
<img width="1296" alt="Capture d’écran 2024-12-09 à 10 26 54"
src="https://github.com/user-attachments/assets/a94f89d4-ca12-403f-bfcb-12168a82f77c">
This commit is contained in:
Raphaël Bosi
2024-12-09 10:55:33 +01:00
committed by GitHub
parent ef0ae2568d
commit 387f5259a7
10 changed files with 70 additions and 68 deletions

View File

@ -3,6 +3,7 @@ import { isObjectMetadataReadOnly } from '@/object-metadata/utils/isObjectMetada
import { RecordIndexPageKanbanAddButton } from '@/object-record/record-index/components/RecordIndexPageKanbanAddButton';
import { RecordIndexRootPropsContext } from '@/object-record/record-index/contexts/RecordIndexRootPropsContext';
import { recordIndexViewTypeState } from '@/object-record/record-index/states/recordIndexViewTypeState';
import { PageHeaderOpenCommandMenuButton } from '@/ui/layout/page-header/components/PageHeaderOpenCommandMenuButton';
import { PageAddButton } from '@/ui/layout/page/components/PageAddButton';
import { PageHeader } from '@/ui/layout/page/components/PageHeader';
import { PageHotkeysEffect } from '@/ui/layout/page/components/PageHotkeysEffect';
@ -52,6 +53,7 @@ export const RecordIndexPageHeader = () => {
) : (
<RecordIndexPageKanbanAddButton />
))}
<PageHeaderOpenCommandMenuButton />
</PageHeader>
);
};

View File

@ -12,11 +12,11 @@ import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
import { DropdownMenu } from '@/ui/layout/dropdown/components/DropdownMenu';
import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
import { PageAddButton } from '@/ui/layout/page/components/PageAddButton';
import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
import styled from '@emotion/styled';
import { useCallback, useContext } from 'react';
import { useRecoilValue } from 'recoil';
import { IconButton, IconPlus } from 'twenty-ui';
const StyledDropdownMenuItemsContainer = styled(DropdownMenuItemsContainer)`
width: 100%;
@ -92,16 +92,7 @@ export const RecordIndexPageKanbanAddButton = () => {
<Dropdown
dropdownMenuWidth="200px"
dropdownPlacement="bottom-start"
clickableComponent={
<IconButton
Icon={IconPlus}
dataTestId="add-button"
size="medium"
variant="secondary"
accent="default"
ariaLabel="Add"
/>
}
clickableComponent={<PageAddButton />}
dropdownId={dropdownId}
dropdownComponents={
<StyledDropDownMenu>