Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(frontend): fix automate page to match new run cli command #2928

Merged
merged 2 commits into from
Jul 12, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -34,8 +34,9 @@ export const SwitchContainer = styled.div`
margin-bottom: 12px;
`;

export const SwitchLabel = styled.label`
cursor: pointer;
export const SwitchLabel = styled.label<{$disabled?: boolean}>`
color: ${({$disabled, theme}) => ($disabled ? theme.color.textLight : theme.color.text)};
cursor: ${({$disabled}) => ($disabled ? 'not-allowed' : 'pointer')};
`;

export const ControlsContainer = styled.div`
Expand Down
Original file line number Diff line number Diff line change
@@ -1,20 +1,37 @@
import {toUpper} from 'lodash';
import {useEffect} from 'react';
import {Form, Radio, Typography} from 'antd';
import {toUpper} from 'lodash';
import {useEffect, useMemo} from 'react';
import Test from 'models/Test.model';
import {CliCommandFormat, CliCommandOption, TCliCommandConfig} from 'services/CliCommand.service';
import * as S from './CliCommand.styled';
import SwitchControl from './SwitchControl';
import {defaultOptions} from './hooks/useCliCommand';
import Test from '../../../../models/Test.model';

const optionToText: Record<CliCommandOption, string> = {
[CliCommandOption.Wait]: 'Wait for test to complete',
[CliCommandOption.UseHostname]: 'Specify Tracetest server hostname',
[CliCommandOption.UseCurrentEnvironment]: 'Use current environment',
// [CliCommandOption.UseId]: 'Use file or test id',
[CliCommandOption.GeneratesJUnit]: 'Generate JUnit report',
[CliCommandOption.useDocker]: 'Run CLI via Docker image',
};
interface IOptionsMetadataParams {
isEnvironmentSelected: boolean;
}
interface IOptionsMetadata {
label: string;
help?: string;
disabled?: boolean;
}

function getOptionsMetadata({
isEnvironmentSelected,
}: IOptionsMetadataParams): Record<CliCommandOption, IOptionsMetadata> {
return {
[CliCommandOption.UseId]: {label: 'Use test ID instead of file'},
[CliCommandOption.SkipResultWait]: {label: 'Skip waiting for test to complete'},
[CliCommandOption.UseHostname]: {label: 'Specify Tracetest server hostname'},
[CliCommandOption.UseCurrentEnvironment]: {
label: 'Use selected environment',
help: !isEnvironmentSelected ? 'This option is only available when an environment is selected' : undefined,
disabled: !isEnvironmentSelected,
},
[CliCommandOption.GeneratesJUnit]: {label: 'Generate JUnit report'},
[CliCommandOption.useDocker]: {label: 'Run CLI via Docker image'},
};
}

interface IProps {
onChange(cmdConfig: TCliCommandConfig): void;
Expand All @@ -27,6 +44,7 @@ const Controls = ({onChange, test, environmentId, fileName}: IProps) => {
const [form] = Form.useForm<TCliCommandConfig>();
const options = Form.useWatch('options', form);
const format = Form.useWatch('format', form);
const optionsMetadata = useMemo(() => getOptionsMetadata({isEnvironmentSelected: !!environmentId}), [environmentId]);

useEffect(() => {
onChange({
Expand All @@ -51,9 +69,9 @@ const Controls = ({onChange, test, environmentId, fileName}: IProps) => {
>
<S.ControlsContainer>
<S.OptionsContainer>
{Object.entries(optionToText).map(([name, text]) => (
{Object.entries(optionsMetadata).map(([name, data]) => (
<Form.Item name={['options', name]} noStyle>
<SwitchControl id={name} text={text} key={name} />
<SwitchControl id={name} text={data.label} key={name} disabled={data.disabled} help={data.help} />
</Form.Item>
))}
</S.OptionsContainer>
Expand Down
Original file line number Diff line number Diff line change
@@ -1,21 +1,25 @@
import {Switch} from 'antd';
import {noop} from 'lodash';
import {TooltipQuestion} from 'components/TooltipQuestion/TooltipQuestion';
import * as S from './CliCommand.styled';

interface IProps {
text: string;
value?: boolean;
id: string;
disabled?: boolean;
help?: string;
onChange?(value: boolean): void;
}

const SwitchControl = ({value = false, onChange = noop, text, id}: IProps) => {
return (
<S.SwitchContainer>
<Switch onChange={onChange} checked={value} id={id} />
<S.SwitchLabel htmlFor={id}>{text}</S.SwitchLabel>
</S.SwitchContainer>
);
};
const SwitchControl = ({value = false, onChange = noop, text, id, disabled, help}: IProps) => (
<S.SwitchContainer>
<Switch onChange={onChange} checked={value} id={id} disabled={disabled} />
<S.SwitchLabel htmlFor={id} $disabled={disabled}>
{text}
</S.SwitchLabel>
{!!help && <TooltipQuestion title={help} />}
</S.SwitchContainer>
);

export default SwitchControl;
Original file line number Diff line number Diff line change
Expand Up @@ -6,24 +6,21 @@ import CliCommandService, {
} from 'services/CliCommand.service';

export const defaultOptions: TCliCommandEnabledOptions = {
[CliCommandOption.Wait]: false,
[CliCommandOption.UseId]: false,
[CliCommandOption.SkipResultWait]: false,
[CliCommandOption.UseHostname]: false,
[CliCommandOption.UseCurrentEnvironment]: true,
// [CliCommandOption.UseId]: true,
[CliCommandOption.UseCurrentEnvironment]: false,
[CliCommandOption.GeneratesJUnit]: false,
[CliCommandOption.useDocker]: false,
};

const useCliCommand = () => {
const [command, setCommand] = useState<string>('');

const onGetCommand = useCallback(
(config: TCliCommandConfig) => {
const cmd = CliCommandService.getCommand(config);
setCommand(cmd);
},
[]
);
const onGetCommand = useCallback((config: TCliCommandConfig) => {
const cmd = CliCommandService.getCommand(config);
setCommand(cmd);
}, []);

return {command, onGetCommand};
};
Expand Down
20 changes: 11 additions & 9 deletions web/src/services/CliCommand.service.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,10 @@ import Test from 'models/Test.model';
import {getServerBaseUrl} from 'utils/Common';

export enum CliCommandOption {
Wait = 'wait',
UseId = 'useId',
SkipResultWait = 'skipWait',
UseHostname = 'useHostname',
UseCurrentEnvironment = 'useCurrentEnvironment',
// UseId = 'useId',
GeneratesJUnit = 'generateJUnit',
useDocker = 'useDocker',
}
Expand All @@ -30,19 +30,21 @@ type TApplyProps = {
test: Test;
environmentId?: string;
enabled: boolean;
fileName: string;
};
type TApplyOption = (props: TApplyProps) => string;

const CliCommandService = () => ({
applyOptions: {
[CliCommandOption.Wait]: ({command, enabled}) => (enabled ? `${command} --wait-for-result` : command),
[CliCommandOption.UseId]: ({enabled, command, test: {id}, fileName}) =>
`${command} ${enabled ? `--id ${id}` : `--file ${fileName}`}`,
[CliCommandOption.SkipResultWait]: ({command, enabled}) => (enabled ? `${command} --skip-result-wait` : command),
[CliCommandOption.UseHostname]: ({command, enabled}) => {
const baseUrl = getServerBaseUrl();
return enabled ? `${command} -s ${baseUrl}` : command;
return enabled ? `${command} --server-url ${baseUrl}` : command;
},
[CliCommandOption.UseCurrentEnvironment]: ({command, enabled, environmentId}) =>
enabled && environmentId ? `${command} -e ${environmentId}` : command,
// [CliCommandOption.UseId]: ({enabled, command, test: {id}}) => `${command} -d ${enabled ? id : `${id}.yaml`}`,
enabled && environmentId ? `${command} --environment ${environmentId}` : command,
[CliCommandOption.GeneratesJUnit]: ({command, enabled}) => (enabled ? `${command} --junit result.junit` : command),
[CliCommandOption.useDocker]: ({enabled, command}) =>
`${
Expand All @@ -54,11 +56,11 @@ const CliCommandService = () => ({
getCommand({options, format, test, environmentId, fileName}: TCliCommandConfig) {
const command = Object.entries(options).reduce(
(acc, [option, enabled]) =>
this.applyOptions[option as CliCommandOption]({command: acc, enabled, test, environmentId}),
`run test -f ${fileName}`
this.applyOptions[option as CliCommandOption]({command: acc, enabled, test, environmentId, fileName}),
'run test'
);

return `${command} -o ${format}`;
return `${command} --output ${format}`;
},
});

Expand Down