83 lines
2.7 KiB
TypeScript
83 lines
2.7 KiB
TypeScript
import { AppBar, Typography } from '@material-ui/core';
|
|
import Tabs from '@material-ui/core/Tabs';
|
|
import React from 'react';
|
|
import { useSelector } from 'react-redux';
|
|
import ButtonFilled from '../../components/Button/ButtonFilled';
|
|
import { StyledTab, TabPanel } from '../../components/Tabs';
|
|
import Center from '../../containers/layouts/Center';
|
|
import Scaffold from '../../containers/layouts/Scaffold';
|
|
import useActions from '../../redux/actions';
|
|
import * as TabActions from '../../redux/actions/tabs';
|
|
import { history } from '../../redux/configureStore';
|
|
import { RootState } from '../../redux/reducers';
|
|
import BrowseWorkflow from '../../views/ChaosWorkflows/BrowseWorkflow';
|
|
import Templates from '../../views/ChaosWorkflows/Templates';
|
|
import useStyles from './styles';
|
|
|
|
const Workflows = () => {
|
|
const classes = useStyles();
|
|
const workflowTabValue = useSelector(
|
|
(state: RootState) => state.tabNumber.workflows
|
|
);
|
|
const tabs = useActions(TabActions);
|
|
|
|
const handleChange = (event: React.ChangeEvent<{}>, newValue: number) => {
|
|
tabs.changeWorkflowsTabs(newValue);
|
|
};
|
|
|
|
return (
|
|
<Scaffold>
|
|
<section className="Header section">
|
|
<div className={classes.header}>
|
|
<Typography variant="h4">Chaos Workflows</Typography>
|
|
<div className={classes.scheduleBtn}>
|
|
<ButtonFilled
|
|
isPrimary={false}
|
|
handleClick={() => history.push('/create-workflow')}
|
|
>
|
|
<>Schedule a workflow</>
|
|
</ButtonFilled>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<AppBar position="static" color="default" className={classes.appBar}>
|
|
<Tabs
|
|
value={workflowTabValue}
|
|
onChange={handleChange}
|
|
indicatorColor="secondary"
|
|
textColor="secondary"
|
|
variant="fullWidth"
|
|
>
|
|
<StyledTab label="Browse workflows" />
|
|
<StyledTab label="Schedules" />
|
|
<StyledTab label="Templates" />
|
|
<StyledTab label="Analytics" />
|
|
</Tabs>
|
|
</AppBar>
|
|
<TabPanel value={workflowTabValue} index={0}>
|
|
<BrowseWorkflow />
|
|
</TabPanel>
|
|
<TabPanel value={workflowTabValue} index={1}>
|
|
{/* <BrowseSchedule /> */}
|
|
<Center>
|
|
<Typography variant="h3" align="center">
|
|
Schedule comming soon
|
|
</Typography>
|
|
</Center>
|
|
</TabPanel>
|
|
<TabPanel value={workflowTabValue} index={2}>
|
|
<Templates />
|
|
</TabPanel>
|
|
<TabPanel value={workflowTabValue} index={3}>
|
|
<Center>
|
|
<Typography variant="h3" align="center">
|
|
Analytics comming soon
|
|
</Typography>
|
|
</Center>
|
|
</TabPanel>
|
|
</Scaffold>
|
|
);
|
|
};
|
|
|
|
export default Workflows;
|