admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

1880 Refactored Dropdown components (#1884)

Browse Source 
* updated DropdownButton props

* refactoring in progress

* working but layout is wrong

* fixed bug

* wip on ColumnHeadWithDropdown

* fix bug

* fix bug

* remove unused styled component

* fix z-index bug

* add an optional argument to DropdownMenu to control the offset of the menu

* add an optional argument to DropdownMenu to control the offset of the menu

* modify files after PR comments

* clean the way the offset is handled

* fix lint
This commit is contained in:
bosiraphael
2023-10-05 18:11:54 +02:00
committed by GitHub
parent b8282e6789
commit 922f8eca0e
23 changed files with 213 additions and 182 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
front/src/modules/pipeline/components/PipelineAddButton.tsx
View File

@ -2,17 +2,17 @@ import { CompanyProgressPicker } from '@/companies/components/CompanyProgressPic
import { useCreateCompanyProgress } from '@/companies/hooks/useCreateCompanyProgress';
import { PageHotkeyScope } from '@/types/PageHotkeyScope';
import { IconButton } from '@/ui/button/components/IconButton';
import { DropdownButton } from '@/ui/dropdown/components/DropdownButton';
import { useDropdownButton } from '@/ui/dropdown/hooks/useDropdownButton';
import { useDropdown } from '@/ui/dropdown/hooks/useDropdown';
import { IconPlus } from '@/ui/icon/index';
import { EntityForSelect } from '@/ui/input/relation-picker/types/EntityForSelect';
import { RelationPickerHotkeyScope } from '@/ui/input/relation-picker/types/RelationPickerHotkeyScope';
import { useSnackBar } from '@/ui/snack-bar/hooks/useSnackBar';
import { ViewBarDropdownButton } from '@/ui/view-bar/components/ViewBarDropdownButton';
export const PipelineAddButton = () => {
const { enqueueSnackBar } = useSnackBar();
const { closeDropdownButton, toggleDropdownButton } = useDropdownButton({
const { closeDropdown, toggleDropdown } = useDropdown({
dropdownId: 'add-pipeline-progress',
});
@ -47,28 +47,28 @@ export const PipelineAddButton = () => {
console.error('There was a problem with the pipeline stage selection.');
return;
}
closeDropdownButton();
closeDropdown();
createCompanyProgress(selectedCompany.id, selectedPipelineStageId);
};
return (
<DropdownButton
<ViewBarDropdownButton
dropdownId="add-pipeline-progress"
buttonComponents={
buttonComponent={
<IconButton
Icon={IconPlus}
size="medium"
dataTestId="add-company-progress-button"
accent="default"
variant="secondary"
onClick={toggleDropdownButton}
onClick={toggleDropdown}
/>
}
dropdownComponents={
<CompanyProgressPicker
companyId={null}
onSubmit={handleCompanySelected}
onCancel={closeDropdownButton}
onCancel={closeDropdown}
/>
}
hotkey={{