App feedbacks front (#19417)
## Before <img width="777" height="284" alt="image" src="https://github.com/user-attachments/assets/22a8c318-ed7c-4ec5-b7a8-a688098ec103" /> ## After <img width="897" height="329" alt="image" src="https://github.com/user-attachments/assets/16ad78bf-a449-4f25-99f6-13c35e448f1b" />
This commit is contained in:
+47
-9
@@ -1,17 +1,24 @@
|
||||
import { styled } from '@linaria/react';
|
||||
import { type LogicFunction } from '~/generated-metadata/graphql';
|
||||
import { TableCell } from '@/ui/layout/table/components/TableCell';
|
||||
import { IconChevronRight } from 'twenty-ui/display';
|
||||
import {
|
||||
IconChevronRight,
|
||||
IconCode,
|
||||
OverflowingTextWithTooltip,
|
||||
} from 'twenty-ui/display';
|
||||
import { StyledTableRow } from '@/settings/logic-functions/components/SettingsLogicFunctionsTable';
|
||||
import { useContext } from 'react';
|
||||
import { ThemeContext, themeCssVariables } from 'twenty-ui/theme-constants';
|
||||
|
||||
const StyledIconChevronRightContainer = styled.span`
|
||||
const StyledIconContainer = styled.span`
|
||||
align-items: center;
|
||||
color: ${themeCssVariables.font.color.tertiary};
|
||||
display: flex;
|
||||
`;
|
||||
|
||||
const StyledIconChevronRightContainer = styled(StyledIconContainer)`
|
||||
color: ${themeCssVariables.font.color.tertiary};
|
||||
`;
|
||||
|
||||
export const SettingsLogicFunctionsFieldItemTableRow = ({
|
||||
logicFunction,
|
||||
to,
|
||||
@@ -20,23 +27,54 @@ export const SettingsLogicFunctionsFieldItemTableRow = ({
|
||||
to: string;
|
||||
}) => {
|
||||
const { theme } = useContext(ThemeContext);
|
||||
|
||||
const computeTrigger = () => {
|
||||
const cronTrigger = logicFunction.cronTriggerSettings;
|
||||
|
||||
const routeTrigger = logicFunction.httpRouteTriggerSettings;
|
||||
|
||||
const databaseEventTriggerSettings =
|
||||
logicFunction.databaseEventTriggerSettings;
|
||||
|
||||
const isTool = logicFunction.isTool;
|
||||
|
||||
if (isTool) {
|
||||
return 'Tool';
|
||||
}
|
||||
|
||||
if (cronTrigger) {
|
||||
return 'Cron';
|
||||
}
|
||||
|
||||
if (routeTrigger) {
|
||||
return 'Route';
|
||||
}
|
||||
|
||||
if (databaseEventTriggerSettings) {
|
||||
return databaseEventTriggerSettings.eventName;
|
||||
}
|
||||
|
||||
return '';
|
||||
};
|
||||
return (
|
||||
<StyledTableRow to={to}>
|
||||
<TableCell
|
||||
color={themeCssVariables.font.color.primary}
|
||||
gap={themeCssVariables.spacing[2]}
|
||||
>
|
||||
{logicFunction.name}
|
||||
<StyledIconContainer>
|
||||
<IconCode size={theme.icon.size.md} />
|
||||
</StyledIconContainer>
|
||||
<OverflowingTextWithTooltip text={logicFunction.name} />
|
||||
</TableCell>
|
||||
<TableCell
|
||||
color={themeCssVariables.font.color.primary}
|
||||
gap={themeCssVariables.spacing[2]}
|
||||
></TableCell>
|
||||
<TableCell
|
||||
color={themeCssVariables.font.color.secondary}
|
||||
gap={themeCssVariables.spacing[2]}
|
||||
align={'right'}
|
||||
whiteSpace="nowrap"
|
||||
overflow="hidden"
|
||||
>
|
||||
{logicFunction.runtime}
|
||||
<OverflowingTextWithTooltip text={computeTrigger()} />
|
||||
</TableCell>
|
||||
<TableCell
|
||||
align="center"
|
||||
|
||||
+2
-3
@@ -16,7 +16,7 @@ export const StyledTableRow = (
|
||||
props: React.ComponentProps<typeof TableRow>,
|
||||
) => (
|
||||
<TableRow
|
||||
gridTemplateColumns="164px 1fr 96px 32px"
|
||||
gridTemplateColumns="300px 1fr 32px"
|
||||
// oxlint-disable-next-line react/jsx-props-no-spreading
|
||||
{...props}
|
||||
/>
|
||||
@@ -43,8 +43,7 @@ export const SettingsLogicFunctionsTable = ({
|
||||
<Table>
|
||||
<StyledTableRow>
|
||||
<TableHeader>{t`Name`}</TableHeader>
|
||||
<TableHeader></TableHeader>
|
||||
<TableHeader>{t`Runtime`}</TableHeader>
|
||||
<TableHeader align={'right'}>{t`Trigger`}</TableHeader>
|
||||
<TableHeader></TableHeader>
|
||||
</StyledTableRow>
|
||||
<StyledTableBodyContainer>
|
||||
|
||||
+1
-1
@@ -127,7 +127,7 @@ export const SettingsApplicationDetailContentTab = ({
|
||||
{shouldDisplayLogicFunctions && (
|
||||
<Section>
|
||||
<H2Title
|
||||
title={t`Functions`}
|
||||
title={t`Logic`}
|
||||
description={t`Logic functions powering this app`}
|
||||
/>
|
||||
<SettingsLogicFunctionsTable logicFunctions={logicFunctions} />
|
||||
|
||||
-3
@@ -79,7 +79,6 @@ export class LogicFunctionExecutorService {
|
||||
workspaceId,
|
||||
flatApplication,
|
||||
flatApplicationVariables,
|
||||
_flatLogicFunction: flatLogicFunction,
|
||||
});
|
||||
|
||||
const driver = this.logicFunctionDriverFactory.getCurrentDriver();
|
||||
@@ -179,12 +178,10 @@ export class LogicFunctionExecutorService {
|
||||
private async getExecutionEnvVariables({
|
||||
workspaceId,
|
||||
flatApplication,
|
||||
_flatLogicFunction,
|
||||
flatApplicationVariables,
|
||||
}: {
|
||||
workspaceId: string;
|
||||
flatApplication: FlatApplication;
|
||||
_flatLogicFunction: FlatLogicFunction;
|
||||
flatApplicationVariables: FlatApplicationVariable[];
|
||||
}) {
|
||||
const applicationAccessToken =
|
||||
|
||||
Reference in New Issue
Block a user