index.tsx 1.76 KB
Newer Older
1
import * as React from 'react';
2
import {withStyles} from 'material-ui/styles';
Maxim Babichev's avatar
Maxim Babichev committed
3
import List, {ListItem, ListItemText} from 'material-ui/List';
4

Maxim Babichev's avatar
Maxim Babichev committed
5
import StepsListItem from './StepsListItem';
6
7

interface IProgressMenuProps extends React.ClassAttributes<any> {
8
    disabled: boolean;
9
    classes: any;
Maxim Babichev's avatar
Maxim Babichev committed
10
    location: any;
Matija Obreza's avatar
Matija Obreza committed
11
    steps: any;
Maxym Borodenko's avatar
Maxym Borodenko committed
12
    onGotoStep: (i: number) => void;
13
14
}

15
const styleSheet = (theme) => ({
16
17
18
    /* tslint:disable */
    root: {
        width: '100%',
Valeriy Panov's avatar
Valeriy Panov committed
19
        height: '100%',
20
21
        background: theme.palette.background.paper,
        fontFamily: 'Roboto-Medium',
Svetlana Alieksieieva's avatar
Svetlana Alieksieieva committed
22
        padding: '0',
23
24
25
        '& h3': {
            fontFamily: 'Roboto-Medium',
        },
Valeriy Panov's avatar
Valeriy Panov committed
26
        boxShadow: '-4px 0px 2px -1px rgba(0, 0, 0, 0.2)',
27
    },
28
});
29
30
31
32
33

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

    public render() {

34
        const {classes, disabled, steps, onGotoStep, location: {pathname}} = this.props;
Matija Obreza's avatar
Matija Obreza committed
35
        const link = pathname.split('/').pop();
36
37

        return (
Valeriy Panov's avatar
Valeriy Panov committed
38
39
40
41
42
            <List className={ classes.root }>
                <ListItem divider>
                    <ListItemText primary="Steps for data publication completion"/>
                </ListItem>
                {
Matija Obreza's avatar
Matija Obreza committed
43
                    steps.map((step, i) => (
Maxim Babichev's avatar
Maxim Babichev committed
44
                            <StepsListItem
45
46
                                key={ i }
                                disabled={ disabled }
47
                                onClick={ onGotoStep(i + 1) }
Matija Obreza's avatar
Matija Obreza committed
48
49
50
                                active={ step.link.endsWith(link) }
                                index={ i }
                                name = { step.name }
Maxim Babichev's avatar
Maxim Babichev committed
51
                            />
Valeriy Panov's avatar
Valeriy Panov committed
52
53
54
55
                        ),
                    )
                }
            </List>
56
        );
Matija Obreza's avatar
Matija Obreza committed
57
    }
58
59
}

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