40 lines
1.2 KiB
TypeScript
40 lines
1.2 KiB
TypeScript
import { StyledDropdownMenuItemsContainer } from '@/ui/dropdown/components/StyledDropdownMenuItemsContainer';
|
|
import { StyledDropdownMenuSubheader } from '@/ui/dropdown/components/StyledDropdownMenuSubheader';
|
|
import type {
|
|
ViewFieldDefinition,
|
|
ViewFieldMetadata,
|
|
} from '@/ui/editable-field/types/ViewField';
|
|
import { IconMinus, IconPlus } from '@/ui/icon';
|
|
import { MenuItem } from '@/ui/menu-item/components/MenuItem';
|
|
|
|
type OwnProps<Field> = {
|
|
fields: Field[];
|
|
onVisibilityChange: (field: Field) => void;
|
|
title: string;
|
|
};
|
|
|
|
export function ViewFieldsVisibilityDropdownSection<
|
|
Field extends ViewFieldDefinition<ViewFieldMetadata>,
|
|
>({ fields, onVisibilityChange, title }: OwnProps<Field>) {
|
|
return (
|
|
<>
|
|
<StyledDropdownMenuSubheader>{title}</StyledDropdownMenuSubheader>
|
|
<StyledDropdownMenuItemsContainer>
|
|
{fields.map((field) => (
|
|
<MenuItem
|
|
key={field.key}
|
|
LeftIcon={field.Icon}
|
|
iconButtons={[
|
|
{
|
|
Icon: field.isVisible ? IconMinus : IconPlus,
|
|
onClick: () => onVisibilityChange(field),
|
|
},
|
|
]}
|
|
text={field.name}
|
|
/>
|
|
))}
|
|
</StyledDropdownMenuItemsContainer>
|
|
</>
|
|
);
|
|
}
|