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

4364-feat(front): Display tags in multi-select picker (#4419)

Browse Source 
* feat: add tags in multi select picker

* feat: display MenuItemLeftContent if no color passed

---------

Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
This commit is contained in:
Anchit Sinha
2024-03-14 22:29:11 +05:30
committed by GitHub
parent 595c7a9ba4
commit fbc7e6ab6e
2 changed files with 11 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownOptionSelect.tsx
View File

@ -108,6 +108,7 @@ export const ObjectFilterDropdownOptionSelect = () => {
handleMultipleOptionSelectChange(option, selected)
}
text={option.label}
color={option.color}
className=""
/>
))}

12
packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemMultiSelect.tsx
View File

@ -1,9 +1,11 @@
import styled from '@emotion/styled';
import { Tag } from 'tsup.ui.index';
import { IconComponent } from '@/ui/display/icon/types/IconComponent';
import { Checkbox } from '@/ui/input/components/Checkbox';
import { MenuItemLeftContent } from '@/ui/navigation/menu-item/internals/components/MenuItemLeftContent';
import { ThemeColor } from '@/ui/theme/constants/MainColorNames';
import { MenuItemLeftContent } from '../internals/components/MenuItemLeftContent';
import { StyledMenuItemBase } from '../internals/components/StyledMenuItemBase';
const StyledLeftContentWithCheckboxContainer = styled.div`
@ -14,6 +16,7 @@ const StyledLeftContentWithCheckboxContainer = styled.div`
`;
type MenuItemMultiSelectProps = {
color?: ThemeColor;
LeftIcon?: IconComponent;
selected: boolean;
text: string;
@ -22,6 +25,7 @@ type MenuItemMultiSelectProps = {
};
export const MenuItemMultiSelect = ({
color,
LeftIcon,
text,
selected,
@ -36,7 +40,11 @@ export const MenuItemMultiSelect = ({
<StyledMenuItemBase className={className} onClick={handleOnClick}>
<StyledLeftContentWithCheckboxContainer>
<Checkbox checked={selected} />
<MenuItemLeftContent LeftIcon={LeftIcon} text={text} />
{color ? (
<Tag color={color} text={text} Icon={LeftIcon} />
) : (
<MenuItemLeftContent LeftIcon={LeftIcon} text={text} />
)}
</StyledLeftContentWithCheckboxContainer>
</StyledMenuItemBase>
);