Added annotationCheck and fixed workflow deletion by viewer (#2365)

* Added annotationCheck and fixed workflow deletion for viewer

Signed-off-by: Amit Kumar Das <amitkumar.das@mayadata.io>

* Minor change

Signed-off-by: Amit Kumar Das <amitkumar.das@mayadata.io>

litmus-portal/frontend/src/views/ChaosWorkflows/BrowseSchedule/TableData.tsx

@@ -15,9 +15,11 @@ import React from 'react';
 import cronstrue from 'cronstrue';
 import YAML from 'yaml';
 import GetAppIcon from '@material-ui/icons/GetApp';
+import { useSelector } from 'react-redux';
 import { ScheduleWorkflow } from '../../../models/graphql/scheduleData';
 import useStyles from './styles';
 import ExperimentPoints from './ExperimentPoints';
+import { RootState } from '../../../redux/reducers';
 
 interface TableDataProps {
   data: ScheduleWorkflow;
@@ -38,6 +40,8 @@ const TableData: React.FC<TableDataProps> = ({ data, deleteRow }) => {
     setPopAnchorEl(null);
   };
 
+  const userData = useSelector((state: RootState) => state.userData);
+
   const handlePopOverClick = (event: React.MouseEvent<HTMLElement>) => {
     setPopAnchorEl(event.currentTarget);
   };
@@ -183,6 +187,7 @@ const TableData: React.FC<TableDataProps> = ({ data, deleteRow }) => {
               </Typography>
             </div>
           </MenuItem>
+          {userData.userRole !== 'Viewer' ? (
             <MenuItem
               value="Analysis"
               onClick={() => deleteRow(data.workflow_id)}
@@ -193,11 +198,15 @@ const TableData: React.FC<TableDataProps> = ({ data, deleteRow }) => {
                   alt="Delete Schedule"
                   className={classes.btnImg}
                 />
-              <Typography data-cy="deleteSchedule" className={classes.btnText}>
+                <Typography
+                  data-cy="deleteSchedule"
+                  className={classes.btnText}
+                >
                   Delete Schedule
                 </Typography>
               </div>
             </MenuItem>
+          ) : null}
         </Menu>
       </TableCell>
     </>

litmus-portal/frontend/src/views/CreateWorkflow/CustomWorkflow/TuneWorkflow/index.tsx

@@ -42,7 +42,7 @@ const TuneCustomWorkflow: React.FC<VerifyCommitProps> = ({ gotoStep }) => {
     applabel: 'k8s-app=kube-proxy',
     appkind: 'daemonset',
   });
-
+  const [annotation, setAnnotation] = useState('true');
   const [env, setEnv] = useState<EnvValues[]>([]);
   const [yaml, setYaml] = useState<string>('');
   const [loadingEnv, setLoadingEnv] = useState(true);
@@ -112,6 +112,7 @@ const TuneCustomWorkflow: React.FC<VerifyCommitProps> = ({ gotoStep }) => {
         applabel: parsedYaml.spec.appinfo.applabel,
         appkind: parsedYaml.spec.appinfo.appkind,
       });
+      setAnnotation(parsedYaml.spec.annotationCheck);
       setEnv([...parsedYaml.spec.experiments[0].spec.components.env]);
       setYaml(customWorkflow.yaml as string);
       setLoadingEnv(false);
@@ -164,6 +165,7 @@ const TuneCustomWorkflow: React.FC<VerifyCommitProps> = ({ gotoStep }) => {
     parsedYaml.spec.appinfo.appns = appInfo.appns;
     parsedYaml.spec.appinfo.applabel = appInfo.applabel;
     parsedYaml.spec.appinfo.appkind = appInfo.appkind;
+    parsedYaml.spec.annotationCheck = annotation;
     parsedYaml.metadata.name = customWorkflow.experiment_name?.split('/')[1];
     parsedYaml.metadata.namespace =
       '{{workflow.parameters.adminModeNamespace}}';
@@ -248,10 +250,11 @@ const TuneCustomWorkflow: React.FC<VerifyCommitProps> = ({ gotoStep }) => {
             </Typography>
             <div className={classes.appInfoDiv}>
               <Typography className={classes.appInfoText}>appns:</Typography>
+              <div className={classes.inputField}>
                 <InputField
                   label="appns"
                   styles={{
-                  width: '20%',
+                    width: '100%',
                   }}
                   data-cy="inputWorkflow"
                   validationError={false}
@@ -264,12 +267,14 @@ const TuneCustomWorkflow: React.FC<VerifyCommitProps> = ({ gotoStep }) => {
                   value={appInfo.appns}
                 />
               </div>
+            </div>
             <div className={classes.appInfoDiv}>
               <Typography className={classes.appInfoText}>applabel:</Typography>
+              <div className={classes.inputField}>
                 <InputField
                   label="applabel"
                   styles={{
-                  width: '20%',
+                    width: '100%',
                   }}
                   data-cy="inputWorkflow"
                   validationError={false}
@@ -282,12 +287,14 @@ const TuneCustomWorkflow: React.FC<VerifyCommitProps> = ({ gotoStep }) => {
                   value={appInfo.applabel}
                 />
               </div>
+            </div>
             <div className={classes.appKind}>
               <Typography className={classes.appInfoText}>appkind:</Typography>
+              <div className={classes.inputField}>
                 <InputField
                   label="appkind"
                   styles={{
-                  width: '20%',
+                    width: '100%',
                   }}
                   data-cy="inputWorkflow"
                   validationError={false}
@@ -300,6 +307,24 @@ const TuneCustomWorkflow: React.FC<VerifyCommitProps> = ({ gotoStep }) => {
                   value={appInfo.appkind}
                 />
               </div>
+            </div>
+            <div className={classes.appKind}>
+              <Typography className={classes.appInfoText}>
+                annotationCheck:
+              </Typography>
+              <div className={classes.inputField}>
+                <InputField
+                  label="annotationCheck"
+                  styles={{
+                    width: '100%',
+                  }}
+                  data-cy="inputWorkflow"
+                  validationError={false}
+                  handleChange={(event) => setAnnotation(event.target.value)}
+                  value={annotation}
+                />
+              </div>
+            </div>
             <hr className={classes.horizontalLine} />
             <Typography className={classes.envHeader}>
               {t('customWorkflow.tuneExperiment.envText')}

litmus-portal/frontend/src/views/CreateWorkflow/CustomWorkflow/TuneWorkflow/styles.ts

@@ -39,6 +39,9 @@ const useStyles = makeStyles((theme) => ({
     marginTop: theme.spacing(2.5),
     marginBottom: theme.spacing(1.25),
   },
+  inputField: {
+    marginLeft: theme.spacing(2.5),
+  },
   appInfoText: {
     fontSize: '0.875rem',
     width: '6.25rem',
@@ -48,7 +51,6 @@ const useStyles = makeStyles((theme) => ({
     flexDirection: 'row',
     alignItems: 'center',
     paddingLeft: theme.spacing(2.5),
-    marginBottom: theme.spacing(2.5),
   },
   envHeader: {
     fontSize: '0.75rem',
@@ -102,7 +104,7 @@ const useStyles = makeStyles((theme) => ({
   horizontalLine: {
     border: `1px solid  ${theme.palette.customColors.black(0.3)}`,
     width: '100%',
-    marginTop: theme.spacing(1.25),
+    marginTop: theme.spacing(3.25),
     marginBottom: theme.spacing(1.25),
   },
   formControl: {