feat: arguments mode (#1012)

kubeshop · Feb 19, 2024 · ca255a4 · ca255a4
1 parent 076144f
commit ca255a4
Show file tree

Hide file tree

Showing 4 changed files with 62 additions and 8 deletions.
diff --git a/...rc/components/pages/Tests/TestDetails/TestSettings/SettingsVariables/Arguments.styled.tsx b/...rc/components/pages/Tests/TestDetails/TestSettings/SettingsVariables/Arguments.styled.tsx
@@ -4,6 +4,10 @@ import Colors from '@styles/Colors';
 import Fonts from '@styles/Fonts';
 
 export const ArgumentsWrapper = styled.div`
+  display: flex;
+  flex-direction: column;
+  gap: 32px;
+
   .args-textarea {
     color: ${Colors.slate50};
 

diff --git a/...s/web/src/components/pages/Tests/TestDetails/TestSettings/SettingsVariables/Arguments.tsx b/...s/web/src/components/pages/Tests/TestDetails/TestSettings/SettingsVariables/Arguments.tsx
@@ -1,13 +1,14 @@
 import React, {useEffect, useMemo} from 'react';
 
-import {Form, Input} from 'antd';
+import {Form, Input, Select} from 'antd';
 
 import {ExternalLink} from '@atoms';
 
-import {Button, FullWidthSpace, Text} from '@custom-antd';
+import {Button, FormItem, FormItemLabel, FullWidthSpace, Text} from '@custom-antd';
 
 import {useLastCallback} from '@hooks/useLastCallback';
 
+import {ExecutionArgsModeEnum} from '@models/execution';
 import {Test} from '@models/test';
 
 import {CopyCommand, notificationCall} from '@molecules';
@@ -16,6 +17,7 @@ import {CardForm} from '@organisms';
 
 import {Permissions, usePermission} from '@permissions/base';
 
+import {useGetExecutorDetailsByTestTypeQuery} from '@services/executors';
 import {useUpdateTestMutation} from '@services/tests';
 
 import {useEntityDetailsPick} from '@store/entityDetails';
@@ -31,6 +33,7 @@ import {ArgumentsWrapper} from './Arguments.styled';
 
 type ArgumentsFormValues = {
   args: string;
+  argsMode: ExecutionArgsModeEnum;
 };
 
 interface ArgumentsProps {
@@ -45,10 +48,17 @@ const Arguments: React.FC<ArgumentsProps> = ({readOnly}) => {
 
   const [updateTest] = useUpdateTestMutation();
 
+  const {data: executorDetails} = useGetExecutorDetailsByTestTypeQuery(encodeURIComponent(details.type));
+
   const entityArgs = details.executionRequest?.args || [];
   const initialArgs = useMemo(() => escapeArguments(entityArgs)?.join('\n') || '', [entityArgs]);
+  const initialArgsMode = useMemo(
+    () => details.executionRequest?.args_mode || 'append',
+    [details.executionRequest?.args_mode]
+  );
 
   const currentArgs = Form.useWatch('args', form) || '';
+  const argsMode = Form.useWatch('argsMode', form) || 'append';
 
   const prettifiedArgs = useMemo(() => prettifyArguments(currentArgs), [currentArgs]);
   const currentArgsInline = useMemo(() => prettifiedArgs.replace(/\n+/g, ' '), [prettifiedArgs]);
@@ -59,7 +69,7 @@ const Arguments: React.FC<ArgumentsProps> = ({readOnly}) => {
     const argVal = currentArgs?.trim().split('\n').filter(Boolean) || [];
 
     // Reset the form when there is no actual change
-    if (argVal.join('\n') === initialArgs) {
+    if (argVal.join('\n') === initialArgs && argsMode === initialArgsMode) {
       form.resetFields();
     }
 
@@ -68,6 +78,7 @@ const Arguments: React.FC<ArgumentsProps> = ({readOnly}) => {
       executionRequest: {
         ...details.executionRequest,
         args: argVal,
+        args_mode: argsMode,
       },
     };
 
@@ -98,15 +109,45 @@ const Arguments: React.FC<ArgumentsProps> = ({readOnly}) => {
       description="Define arguments which will be passed to the test executor."
       footer={footer}
       form={form}
-      initialValues={{args: initialArgs}}
       disabled={!mayEdit}
       readOnly={readOnly}
+      initialValues={{args: initialArgs, argsMode: initialArgsMode}}
       onConfirm={onSaveForm}
       onCancel={onCancel}
     >
       <ArgumentsWrapper>
-        <CopyCommand command={currentArgsInline} isBordered additionalPrefix="executor-binary" />
+        <FormItem
+          name="argsMode"
+          key="argsMode"
+          label={
+            <FormItemLabel
+              text="Mode"
+              tooltipMessage="Choose between appending arguments to the executor or replacing them"
+            />
+          }
+        >
+          <Select
+            options={[
+              {
+                label: 'Append',
+                value: 'append',
+              },
+              {
+                label: 'Replace',
+                value: 'replace',
+              },
+            ]}
+          />
+        </FormItem>
         <FullWidthSpace size={16} direction="vertical">
+          <CopyCommand
+            command={currentArgsInline}
+            isBordered
+            additionalPrefix={`executor-binary ${
+              argsMode === 'append' && executorDetails?.executor.args ? executorDetails?.executor.args.join(' ') : ''
+            }`}
+          />
+
           <Text className="regular middle" color={Colors.slate400}>
             Arguments passed to the executor (concat and passed directly to the executor)
           </Text>
@@ -118,9 +159,9 @@ const Arguments: React.FC<ArgumentsProps> = ({readOnly}) => {
               }}
               className="args-textarea"
               placeholder={`--flag="value value"
---flag-123=value
-value
-`}
+              --flag-123=value
+              value
+              `}
             />
           </Form.Item>
           <Button onClick={onPrettify} $customType="secondary" disabled={isPrettified || readOnly}>

diff --git a/packages/web/src/models/execution.ts b/packages/web/src/models/execution.ts
@@ -10,6 +10,7 @@ export const executionStatusList = ['running', 'passed', 'failed', 'queued', 'ti
 export type ExecutionStatusEnum = (typeof executionStatusList)[number];
 export type ExecutionResultOutputTypeEnum = 'text/plain' | 'application/junit+xml' | 'application/json';
 export type ExecutionStepResultStatusEnum = 'success' | 'error';
+export type ExecutionArgsModeEnum = 'append' | 'replace';
 
 export type ExecutionStepResult = {
   name: string;
@@ -35,6 +36,7 @@ export type Execution = {
   name: string;
   envs: EntityMap;
   args: Args;
+  args_mode?: ExecutionArgsModeEnum;
   params: EntityMap;
   paramsFile: string;
   content: TestContent;
@@ -62,6 +64,7 @@ export type ExecutionRequest = {
   testSecretUUID: string;
   testSuiteSecretUUID: string;
   args: Args;
+  args_mode?: ExecutionArgsModeEnum;
   image: string;
   envs: EntityMap;
   secretEnvs: EntityMap;

diff --git a/packages/web/src/services/executors.ts b/packages/web/src/services/executors.ts
@@ -49,6 +49,11 @@ export const executorsApi = createApi({
       }),
       providesTags: (res, err, id) => [{type: 'Executor', id}],
     }),
+    getExecutorDetailsByTestType: builder.query<any, string>({
+      query: testType => ({
+        url: `/executor-by-types?testType=${testType}`,
+      }),
+    }),
     deleteExecutor: builder.mutation<void, string>({
       query: id => ({
         url: `/executors/${id}`,
@@ -82,6 +87,7 @@ export const {
   useCreateExecutorMutation,
   useGetExecutorDefinitionQuery,
   useGetExecutorDetailsQuery,
+  useGetExecutorDetailsByTestTypeQuery,
   useDeleteExecutorMutation,
   useUpdateCustomExecutorMutation,
   useUpdateExecutorDefinitionMutation,