diff --git a/litmus-portal/frontend/src/views/CreateWorkflow/ChooseAWorkflowAgent/index.tsx b/litmus-portal/frontend/src/views/CreateWorkflow/ChooseAWorkflowAgent/index.tsx
index 6daa918b8..9a99ae0f1 100644
--- a/litmus-portal/frontend/src/views/CreateWorkflow/ChooseAWorkflowAgent/index.tsx
+++ b/litmus-portal/frontend/src/views/CreateWorkflow/ChooseAWorkflowAgent/index.tsx
@@ -1,5 +1,5 @@
import { useLazyQuery, useQuery } from '@apollo/client';
-import { Typography, useTheme } from '@material-ui/core';
+import { RadioGroup, Typography, useTheme } from '@material-ui/core';
import { LitmusCard, RadioButton, Search } from 'litmus-ui';
import React, {
forwardRef,
@@ -215,32 +215,38 @@ const ChooseWorkflowAgent = forwardRef((_, ref) => {
/>
{/* Cluster Data */}
-
- {filteredCluster.map((cluster) => (
-
- handleChange(e)}
+ handleChange(e)}
+ >
+
+ {filteredCluster.map((cluster) => (
+
- {cluster.cluster_name}
- {cluster.cluster_id}
-
-
- ))}
-
+
+
+ {cluster.cluster_name}
+ {cluster.cluster_id}
+
+
+
+ ))}
+
+
);
diff --git a/litmus-portal/frontend/src/views/CreateWorkflow/ChooseAWorkflowAgent/styles.ts b/litmus-portal/frontend/src/views/CreateWorkflow/ChooseAWorkflowAgent/styles.ts
index a87eb9f1a..8ff0e8153 100644
--- a/litmus-portal/frontend/src/views/CreateWorkflow/ChooseAWorkflowAgent/styles.ts
+++ b/litmus-portal/frontend/src/views/CreateWorkflow/ChooseAWorkflowAgent/styles.ts
@@ -43,12 +43,13 @@ const useStyles = makeStyles((theme: Theme) => ({
// Agent Div
agentWrapperDiv: {
marginTop: theme.spacing(5),
- display: 'grid',
- gridTemplateColumns: '1fr 1fr',
- gridGap: '1.5rem',
+ display: 'flex',
+ flexDirection: 'row',
+ flexWrap: 'wrap',
},
litmusCard: {
background: theme.palette.cards.background,
+ margin: theme.spacing(2, 2, 2, 0),
},
agentRadioButton: {
marginTop: theme.spacing(1),
diff --git a/litmus-portal/frontend/src/views/CreateWorkflow/TuneWorkflow/AddProbe/index.tsx b/litmus-portal/frontend/src/views/CreateWorkflow/TuneWorkflow/AddProbe/index.tsx
index 86b9c548d..c63e4625c 100644
--- a/litmus-portal/frontend/src/views/CreateWorkflow/TuneWorkflow/AddProbe/index.tsx
+++ b/litmus-portal/frontend/src/views/CreateWorkflow/TuneWorkflow/AddProbe/index.tsx
@@ -247,7 +247,7 @@ const AddProbe: React.FC = ({
- {t('createWorkflow.tuneWorkflow.addProbe.labels.timeout')}(ms)
+ {t('createWorkflow.tuneWorkflow.addProbe.labels.timeout')}(sec)
= ({
- {t('createWorkflow.tuneWorkflow.addProbe.labels.interval')}(ms)
+ {t('createWorkflow.tuneWorkflow.addProbe.labels.interval')}(sec)
= ({
- {t('createWorkflow.tuneWorkflow.addProbe.labels.polling')}(ms)
+ {t('createWorkflow.tuneWorkflow.addProbe.labels.polling')}(sec)
= ({
{t('createWorkflow.tuneWorkflow.addProbe.labels.initialDelay')}
- (ms)
+ (sec)
= ({
closeStepper,
isCustom,
}) => {
- const { t } = useTranslation();
const classes = useStyles();
// State variable to handle Stepper Steps
@@ -73,76 +65,6 @@ const ConfigurationStepper: React.FC = ({
const gotoStep = (page: number) => {
setActiveStep(page);
};
- const workflow = useActions(WorkflowActions);
- const manifest: WorkflowManifest = useSelector(
- (state: RootState) => state.workflowManifest
- );
-
- const deleteExperiment = () => {
- /**
- * Workflow manifest saved in redux state
- */
- const wfManifest = YAML.parse(manifest.manifest);
-
- /**
- * Get template name according to the experiment index
- */
- const templateName = wfManifest.spec.templates[experimentIndex].name;
-
- /**
- * Get the workflow name according to the experiment index
- */
- const wfName = YAML.parse(manifest.engineYAML).metadata.generateName;
-
- /**
- * if the template is a revert-chaos template
- * the engine name is removed from the
- * revert-chaos template args
- */
- if (
- wfManifest.spec.templates[
- wfManifest.spec.templates.length - 1
- ].name.includes('revert-')
- ) {
- const argument = wfManifest.spec.templates[
- wfManifest.spec.templates.length - 1
- ].container.args[0].replace(wfName, '');
- wfManifest.spec.templates[
- wfManifest.spec.templates.length - 1
- ].container.args[0] = argument;
- }
-
- /**
- * Remove the experiment name from steps
- */
- wfManifest.spec.templates[0].steps.forEach(
- (data: any, stepIndex: number) => {
- data.forEach((step: any, index: number) => {
- if (step.name === templateName) {
- data.splice(index, 1);
- }
- });
- if (data.length === 0) {
- wfManifest.spec.templates[0].steps.splice(stepIndex, 1);
- }
- }
- );
-
- /**
- * Remove the chaos engine from the overall manifest
- * according to the experiment index
- */
- wfManifest.spec.templates.splice(experimentIndex, 1);
-
- /**
- * Set the updated manifest to redux state
- */
- workflow.setWorkflowManifest({
- manifest: YAML.stringify(wfManifest),
- engineYAML: '',
- });
- closeStepper();
- };
return (
@@ -151,26 +73,6 @@ const ConfigurationStepper: React.FC = ({
✕
-
-
- {t('createWorkflow.tuneWorkflow.verticalStepper.editExp')}
-
-
{
- deleteExperiment();
- }}
- className={classes.deleteBtn}
- >
-
-
- {t('createWorkflow.tuneWorkflow.verticalStepper.deleteExp')}
-
-
-
{steps.map((label, index) => (
diff --git a/litmus-portal/frontend/src/views/CreateWorkflow/TuneWorkflow/WorkflowTable.tsx b/litmus-portal/frontend/src/views/CreateWorkflow/TuneWorkflow/WorkflowTable.tsx
index cbc6faf6b..cd9f56a26 100644
--- a/litmus-portal/frontend/src/views/CreateWorkflow/TuneWorkflow/WorkflowTable.tsx
+++ b/litmus-portal/frontend/src/views/CreateWorkflow/TuneWorkflow/WorkflowTable.tsx
@@ -1,5 +1,5 @@
/* eslint-disable no-const-assign */
-import { Typography, useTheme } from '@material-ui/core';
+import { IconButton, Typography, useTheme } from '@material-ui/core';
import Paper from '@material-ui/core/Paper';
import Table from '@material-ui/core/Table';
import TableBody from '@material-ui/core/TableBody';
@@ -224,6 +224,75 @@ const WorkflowTable = forwardRef(
});
}, [manifest]);
+ const deleteExperiment = (experimentIndex: number) => {
+ /**
+ * Workflow manifest saved in redux state
+ */
+ const wfManifest = YAML.parse(manifest);
+
+ /**
+ * Get template name according to the experiment index
+ */
+ const templateName = wfManifest.spec.templates[experimentIndex].name;
+
+ /**
+ * Get instance_id of Chaos Engines
+ */
+ const selectedEngine =
+ wfManifest.spec.templates[experimentIndex].inputs.artifacts[0];
+ const { instance_id } = YAML.parse(
+ selectedEngine.raw.data
+ ).metadata.labels;
+
+ /**
+ * if the template is a revert-chaos template
+ * the engine name is removed from the
+ * revert-chaos template args
+ */
+ if (
+ wfManifest.spec.templates[
+ wfManifest.spec.templates.length - 1
+ ].name.includes('revert-')
+ ) {
+ const argument = wfManifest.spec.templates[
+ wfManifest.spec.templates.length - 1
+ ].container.args[0].replace(`${instance_id}, `, '');
+ wfManifest.spec.templates[
+ wfManifest.spec.templates.length - 1
+ ].container.args[0] = argument;
+ }
+
+ /**
+ * Remove the experiment name from steps
+ */
+ wfManifest.spec.templates[0].steps.forEach(
+ (data: any, stepIndex: number) => {
+ data.forEach((step: any, index: number) => {
+ if (step.name === templateName) {
+ data.splice(index, 1);
+ }
+ });
+ if (data.length === 0) {
+ wfManifest.spec.templates[0].steps.splice(stepIndex, 1);
+ }
+ }
+ );
+
+ /**
+ * Remove the chaos engine from the overall manifest
+ * according to the experiment index
+ */
+ wfManifest.spec.templates.splice(experimentIndex, 1);
+
+ /**
+ * Set the updated manifest to redux state
+ */
+ workflow.setWorkflowManifest({
+ manifest: YAML.stringify(wfManifest),
+ engineYAML: '',
+ });
+ };
+
function onNext() {
if (experiments.length === 0) {
return false; // Should show alert
@@ -264,26 +333,29 @@ const WorkflowTable = forwardRef(
{t('createWorkflow.chooseWorkflow.table.head5')}
+
{experiments.length > 0 ? (
experiments.map((experiment: ChaosCRDTable, index) => (
- {
- setDisplayStepper(true);
- setEngineIndex(experiment.StepIndex);
- workflow.setWorkflowManifest({
- engineYAML: experiment.ChaosEngine,
- });
- }}
- className={classes.selection}
- >
+
{index + 1}
- {experiment.Name}
+ {
+ setDisplayStepper(true);
+ setEngineIndex(experiment.StepIndex);
+ workflow.setWorkflowManifest({
+ engineYAML: experiment.ChaosEngine,
+ });
+ }}
+ >
+ {experiment.Name}
+
{experiment.Namespace}
@@ -291,6 +363,18 @@ const WorkflowTable = forwardRef(
{experiment.Application}
{experiment.Probes}
+
+
+ deleteExperiment(experiment.StepIndex)
+ }
+ >
+
+
+
))
) : (