diff --git a/packages/twenty-front/src/pages/settings/applications/components/SettingsApplicationDetailTitle.tsx b/packages/twenty-front/src/pages/settings/applications/components/SettingsApplicationDetailTitle.tsx
index 4c06e7d99b..66bc765fd9 100644
--- a/packages/twenty-front/src/pages/settings/applications/components/SettingsApplicationDetailTitle.tsx
+++ b/packages/twenty-front/src/pages/settings/applications/components/SettingsApplicationDetailTitle.tsx
@@ -12,7 +12,6 @@ type SettingsApplicationDetailTitleProps = {
};
const StyledTitleContainer = styled.div`
- margin-bottom: ${themeCssVariables.spacing[4]};
width: ${() => {
return OBJECT_SETTINGS_WIDTH + 'px';
}};
@@ -34,7 +33,7 @@ const StyledHeaderLeft = styled.div`
const StyledHeaderTop = styled.div`
align-items: center;
display: flex;
- gap: ${themeCssVariables.spacing[3]};
+ gap: ${themeCssVariables.spacing[2]};
`;
const StyledLogo = styled.div`
@@ -75,9 +74,10 @@ const StyledAppName = styled.div`
`;
const StyledAppDescription = styled.div`
- color: ${themeCssVariables.font.color.secondary};
+ color: ${themeCssVariables.font.color.tertiary};
font-size: ${themeCssVariables.font.size.md};
font-weight: ${themeCssVariables.font.weight.regular};
+ line-height: ${themeCssVariables.text.lineHeight.lg};
`;
const StyledUnlistedBanner = styled.div`
diff --git a/packages/twenty-front/src/pages/settings/applications/tabs/SettingsApplicationDetailAboutTab.tsx b/packages/twenty-front/src/pages/settings/applications/tabs/SettingsApplicationDetailAboutTab.tsx
index ce31ace490..437cdf016f 100644
--- a/packages/twenty-front/src/pages/settings/applications/tabs/SettingsApplicationDetailAboutTab.tsx
+++ b/packages/twenty-front/src/pages/settings/applications/tabs/SettingsApplicationDetailAboutTab.tsx
@@ -1,7 +1,6 @@
-import { SettingsTextInput } from '@/ui/input/components/SettingsTextInput';
import { t } from '@lingui/core/macro';
import { isDefined } from 'twenty-shared/utils';
-import { H2Title, IconTrash } from 'twenty-ui/display';
+import { H2Title, IconTrash, AppTooltip } from 'twenty-ui/display';
import { Section } from 'twenty-ui/layout';
import { SettingsApplicationVersionContainer } from '~/pages/settings/applications/components/SettingsApplicationVersionContainer';
import { Button } from 'twenty-ui/input';
@@ -46,8 +45,6 @@ export const SettingsApplicationDetailAboutTab = ({
return null;
}
- const { id, name, description } = application;
-
const handleUninstallApplication = async () => {
setIsLoading(true);
try {
@@ -77,38 +74,49 @@ export const SettingsApplicationDetailAboutTab = ({
appRegistrationId={registrationId}
/>
- {application.canBeUninstalled && (
- <>
-
-
-
-
- Please type {`"${confirmationValue}"`} to confirm you want to
- uninstall this application.
-
- }
- onConfirmClick={handleUninstallApplication}
- confirmButtonText={t`Uninstall`}
- loading={isLoading}
+ <>
+
+
- >
- )}
+
+
+ Please type {`"${confirmationValue}"`} to confirm you want to
+ uninstall this application.
+
+ }
+ onConfirmClick={handleUninstallApplication}
+ confirmButtonText={t`Uninstall`}
+ loading={isLoading}
+ />
+ >
>
);
};
diff --git a/packages/twenty-ui/src/input/button/components/Button/Button.tsx b/packages/twenty-ui/src/input/button/components/Button/Button.tsx
index 23b6dd479a..715f25267d 100644
--- a/packages/twenty-ui/src/input/button/components/Button/Button.tsx
+++ b/packages/twenty-ui/src/input/button/components/Button/Button.tsx
@@ -18,6 +18,7 @@ export type ButtonVariant = 'primary' | 'secondary' | 'tertiary';
export type ButtonAccent = 'default' | 'blue' | 'danger';
export type ButtonProps = {
+ id?: string;
className?: string;
Icon?: IconComponent;
title?: string;
@@ -441,7 +442,9 @@ const computeButtonWrapperColor = (
: themeCssVariables.font.color.inverted;
case 'danger':
return !inverted
- ? themeCssVariables.font.color.danger
+ ? !disabled
+ ? themeCssVariables.font.color.danger
+ : themeCssVariables.color.red5
: themeCssVariables.font.color.inverted;
}
break;
@@ -453,6 +456,7 @@ export const Button = ({
className,
Icon,
title,
+ id,
fullWidth = false,
variant = 'primary',
inverted = false,
@@ -512,6 +516,7 @@ export const Button = ({
style={dynamicStyles}
>