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

feat(approval-domain): add UI for approval domains (#10480)

Browse Source
This commit is contained in:
Antoine Moreaux
2025-02-25 16:44:07 +01:00
committed by GitHub
parent 9997cf5a4e
commit 7c9b902cfe
8 changed files with 110 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
packages/twenty-front/src/modules/settings/components/SettingsListCard.tsx
View File

@ -36,6 +36,7 @@ const StyledButton = styled.button`
type SettingsListCardProps<ListItem extends { id: string }> = {
items: ListItem[];
getItemLabel: (item: ListItem) => string;
getItemDescription?: (item: ListItem) => string;
hasFooter?: boolean;
isLoading?: boolean;
onRowClick?: (item: ListItem) => void;
@ -54,6 +55,7 @@ export const SettingsListCard = <
>({
items,
getItemLabel,
getItemDescription,
hasFooter,
isLoading,
onRowClick,
@ -75,6 +77,7 @@ export const SettingsListCard = <
key={item.id}
LeftIcon={RowIconFn ? RowIconFn(item) : RowIcon}
label={getItemLabel(item)}
description={getItemDescription?.(item)}
rightComponent={<RowRightComponent item={item} />}
divider={index < items.length - 1}
onClick={() => onRowClick?.(item)}

17
packages/twenty-front/src/modules/settings/components/SettingsListItemCardContent.tsx
View File

@ -17,8 +17,16 @@ const StyledRow = styled(CardContent)`
min-height: ${({ theme }) => theme.spacing(6)};
`;
const StyledLabel = styled.span`
const StyledContent = styled.div`
flex: 1 0 auto;
display: flex;
gap: ${({ theme }) => theme.spacing(1)};
`;
const StyledDescription = styled.span`
color: ${({ theme }) => theme.font.color.light};
font-weight: ${({ theme }) => theme.font.weight.regular};
padding-left: ${({ theme }) => theme.spacing(1)};
`;
const StyledLink = styled(Link)`
@ -32,6 +40,7 @@ const StyledLink = styled(Link)`
type SettingsListItemCardContentProps = {
label: string;
description?: string;
divider?: boolean;
LeftIcon?: IconComponent;
onClick?: () => void;
@ -41,6 +50,7 @@ type SettingsListItemCardContentProps = {
export const SettingsListItemCardContent = ({
label,
description,
divider,
LeftIcon,
onClick,
@ -52,7 +62,10 @@ export const SettingsListItemCardContent = ({
const content = (
<StyledRow onClick={onClick} divider={divider}>
{!!LeftIcon && <LeftIcon size={theme.icon.size.md} />}
<StyledLabel>{label}</StyledLabel>
<StyledContent>
{label}
{!!description && <StyledDescription>{description}</StyledDescription>}
</StyledContent>
{rightComponent}
</StyledRow>
);