feat: show test runs in executions

packages/web/src/components/ExecutionRow/index.tsx

@@ -1,9 +1,8 @@
 import * as React from 'react';
 import { Link } from 'react-router-dom';
 import Card from '@mui/material/Card';
-import Box from '@mui/material/Box';
-import Stack from '@mui/material/Stack';
 import CardActionArea from '@mui/material/CardActionArea';
+import Chip from '@mui/material/Chip';
 import ArrowForwardIosIcon from '@mui/icons-material/ArrowForwardIos';
 import { DateTime } from 'luxon';
 import type { IExecution } from '@automatisch/types';
@@ -49,6 +48,15 @@ export default function ExecutionRow(props: ExecutionRowProps): React.ReactEleme
             </Title>
 
             <ArrowContainer>
+              {execution.testRun && (
+                <Chip
+                  size="small"
+                  color="warning"
+                  variant="outlined"
+                  label={formatMessage('execution.test')}
+                />
+              )}
+
               <ArrowForwardIosIcon sx={{ color: (theme) => theme.palette.primary.main }} />
             </ArrowContainer>
           </CardContent>

packages/web/src/components/ExecutionRow/style.ts

@@ -31,6 +31,10 @@ export const Title = styled(MuiStack)(() => ({
 }));
 
 export const ArrowContainer = styled(MuiBox)(() => ({
+  flexDirection: 'row',
+  display: 'flex',
+  alignItems: 'center',
+  gap: 10,
   gridArea: 'arrow-container',
 }));
 export const Typography = styled(MuiTypography)(() => ({

packages/web/src/components/ExecutionStep/index.tsx

@@ -27,7 +27,7 @@ const validIcon = <CheckCircleIcon color="success" />;
 const errorIcon = <ErrorIcon color="error" />;
 
 export default function ExecutionStep(props: ExecutionStepProps): React.ReactElement | null {
-  const { executionStep, index, } = props;
+  const { executionStep, } = props;
   const [activeTabIndex, setActiveTabIndex] = React.useState(0);
   const step: IStep = executionStep.step;
   const isTrigger = step.type === 'trigger';

packages/web/src/components/FlowSubstep/index.tsx

@@ -43,7 +43,6 @@ function FlowSubstep(props: FlowSubstepProps): React.ReactElement {
     expanded = false,
     onExpand,
     onCollapse,
-    onChange,
     onSubmit,
     step,
   } = props;
@@ -57,24 +56,6 @@ function FlowSubstep(props: FlowSubstepProps): React.ReactElement {
   const formContext = useFormContext();
   const [validationStatus, setValidationStatus] = React.useState<boolean | null>(validateSubstep(substep, formContext.getValues() as IStep));
 
-  const handleChangeOnBlur = React.useCallback((key: string) => {
-    return (value: string) => {
-      const currentValue = step.parameters?.[key];
-
-      if (currentValue !== value) {
-        onChange({
-          step: {
-            ...step,
-            parameters: {
-              ...step.parameters,
-              [key]: value,
-            }
-          },
-        });
-      }
-    }
-  }, [step, onChange]);
-
   React.useEffect(() => {
     function validate (step: unknown) {
       const validationResult = validateSubstep(substep, step as IStep);

packages/web/src/components/InputCreator/index.tsx

@@ -1,10 +1,8 @@
 import * as React from 'react';
-import { useLazyQuery } from '@apollo/client';
 import MuiTextField from '@mui/material/TextField';
-import type { IField, IFieldDropdown, IFieldDropdownOption, IJSONObject } from '@automatisch/types';
+import type { IField, IFieldDropdownOption } from '@automatisch/types';
 
 import useDynamicData from 'hooks/useDynamicData';
-import { GET_DATA } from 'graphql/queries/get-data';
 import PowerInput from 'components/PowerInput';
 import TextField from 'components/TextField';
 import ControlledAutocomplete from 'components/ControlledAutocomplete';
@@ -23,7 +21,6 @@ type RawOption = {
   value: string;
 };
 
-const computeArguments = (args: IFieldDropdown["source"]["arguments"]): IJSONObject => args.reduce((result, { name, value }) => ({ ...result, [name as string]: value }), {});
 const optionGenerator = (options: RawOption[]): IFieldDropdownOption[] => options?.map(({ name, value }) => ({ label: name as string, value: value }));
 const getOption = (options: IFieldDropdownOption[], value: string) => options?.find(option => option.value === value);
 

packages/web/src/components/LoginForm/index.tsx

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { useNavigate } from 'react-router-dom';
 import { useMutation } from '@apollo/client';
-import { UseFormReturn } from 'react-hook-form';
 import Paper from '@mui/material/Paper';
 import Typography from '@mui/material/Typography';
 import LoadingButton from '@mui/lab/LoadingButton';
@@ -12,15 +11,11 @@ import { LOGIN } from 'graphql/mutations/login';
 import Form from 'components/Form';
 import TextField from 'components/TextField';
 
-type FormValues = {
-  email: string;
-  password: string;
-}
 
 function renderFields(props: { loading: boolean }) {
   const { loading = false } = props;
 
-  return (methods: UseFormReturn) => {
+  return () => {
     return (
       <>
         <TextField

packages/web/src/components/PowerInput/index.tsx

@@ -119,7 +119,7 @@ const PowerInput = (props: PowerInputProps) => {
       control={control}
       defaultValue={defaultValue}
       shouldUnregister={false}
-      render={({ field: { value, ref, onChange: controllerOnChange, onBlur: controllerOnBlur, ...field } }) => (
+      render={({ field: { value, onChange: controllerOnChange, onBlur: controllerOnBlur, } }) => (
         <Slate
           editor={editor}
           value={deserialize(value)}

packages/web/src/helpers/authenticationSteps.ts

@@ -1,7 +1,6 @@
 import type { IAuthenticationStep, IJSONObject } from '@automatisch/types';
 import apolloClient from 'graphql/client';
 import MUTATIONS from 'graphql/mutations';
-import appConfig from 'config/app';
 
 enum AuthenticationSteps {
   Mutation = 'mutation',

packages/web/src/locales/en.json

@@ -58,6 +58,7 @@
   "executions.title": "Executions",
   "executions.noExecutions": "There is no execution data point to show.",
   "execution.executedAt": "executed {datetime}",
+  "execution.test": "Test run",
   "profileSettings.title": "My Profile",
   "profileSettings.email": "Email",
   "profileSettings.updateEmail": "Update email",

packages/web/src/pages/Executions/index.tsx

@@ -15,7 +15,6 @@ import Container from 'components/Container';
 import PageTitle from 'components/PageTitle';
 import useFormatMessage from 'hooks/useFormatMessage'
 import { GET_EXECUTIONS } from 'graphql/queries/get-executions';
-import * as URLS from 'config/urls';
 
 const EXECUTION_PER_PAGE = 10;