index.tsx 1.93 KB
Newer Older
Maxym Borodenko's avatar
Maxym Borodenko committed
1
import * as React from 'react';
Matija Obreza's avatar
Matija Obreza committed
2
3
4
5
import {withStyles} from '@material-ui/core/styles';
import List from '@material-ui/core/List';
import ListItem from '@material-ui/core/ListItem';
import ListItemText from '@material-ui/core/ListItemText';
Maxym Borodenko's avatar
Maxym Borodenko committed
6
7
8
9
10
11
12
13
14
15
16
17
18
19

import StepsListItem from './StepsListItem';

interface IProgressMenuProps extends React.ClassAttributes<any> {
    disabled: boolean;
    classes: any;
    location: any;
    steps: any;
    onGotoStep: (i: number) => void;
}

const styleSheet = (theme) => ({
    /* tslint:disable */
    root: {
20
21
        position: 'sticky' as 'sticky',
        top: '6rem',
Maxym Borodenko's avatar
Maxym Borodenko committed
22
        width: '100%',
23
        // height: '100%',
Maxym Borodenko's avatar
Maxym Borodenko committed
24
25
26
        background: theme.palette.background.paper,
        fontFamily: 'Roboto-Medium',
        padding: '0',
Maxym Borodenko's avatar
Maxym Borodenko committed
27
        '& span': {
Maxym Borodenko's avatar
Maxym Borodenko committed
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
            fontFamily: 'Roboto-Medium',
        },
        boxShadow: '-4px 0px 2px -1px rgba(0, 0, 0, 0.2)',
    },
});

class ProgressMenu extends React.Component<IProgressMenuProps, any> {

    public render() {

        const {classes, disabled, steps, onGotoStep, location: {pathname}} = this.props;
        const link = pathname.split('/').pop();

        return (
            <List className={ classes.root }>
                <ListItem divider>
                    <ListItemText primary="Steps for data publication completion"/>
                </ListItem>
                {
                    steps.map((step, i) => (
                            <StepsListItem
                                key={ i }
                                disabled={ disabled }
Viacheslav Pavlov's avatar
Viacheslav Pavlov committed
51
                                onClick={ () => onGotoStep(i + 1) }
52
                                active={ step.path.endsWith(link) }
Maxym Borodenko's avatar
Maxym Borodenko committed
53
54
55
56
57
58
59
60
61
62
63
64
                                index={ i }
                                name = { step.name }
                            />
                        ),
                    )
                }
            </List>
        );
    }
}

export default withStyles(styleSheet)<any>(ProgressMenu);