index.tsx 2.01 KB
Newer Older
Maxym Borodenko's avatar
Maxym Borodenko committed
1
import * as React from 'react';
Viacheslav Pavlov's avatar
i18n    
Viacheslav Pavlov committed
2
import {translate} from 'react-i18next';
Matija Obreza's avatar
Matija Obreza committed
3
4
5
6
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
7
8
9
10
11
12
13
14
15

import StepsListItem from './StepsListItem';

interface IProgressMenuProps extends React.ClassAttributes<any> {
    disabled: boolean;
    classes: any;
    location: any;
    steps: any;
    onGotoStep: (i: number) => void;
Viacheslav Pavlov's avatar
i18n    
Viacheslav Pavlov committed
16
    t: any;
Maxym Borodenko's avatar
Maxym Borodenko committed
17
18
19
20
21
}

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

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

    public render() {

Viacheslav Pavlov's avatar
i18n    
Viacheslav Pavlov committed
40
        const {classes, disabled, steps, onGotoStep, location: {pathname}, t} = this.props;
Maxym Borodenko's avatar
Maxym Borodenko committed
41
42
43
44
45
        const link = pathname.split('/').pop();

        return (
            <List className={ classes.root }>
                <ListItem divider>
Viacheslav Pavlov's avatar
i18n    
Viacheslav Pavlov committed
46
                    <ListItemText primary={ t('common:label.stepsForDataPublication') }/>
Maxym Borodenko's avatar
Maxym Borodenko committed
47
48
49
50
51
52
                </ListItem>
                {
                    steps.map((step, i) => (
                            <StepsListItem
                                key={ i }
                                disabled={ disabled }
Viacheslav Pavlov's avatar
Viacheslav Pavlov committed
53
                                onClick={ () => onGotoStep(i + 1) }
54
                                active={ step.path.endsWith(link) }
Maxym Borodenko's avatar
Maxym Borodenko committed
55
                                index={ i }
Viacheslav Pavlov's avatar
i18n    
Viacheslav Pavlov committed
56
                                name = { t(step.name) }
Maxym Borodenko's avatar
Maxym Borodenko committed
57
58
59
60
61
62
63
64
65
                            />
                        ),
                    )
                }
            </List>
        );
    }
}

Viacheslav Pavlov's avatar
i18n    
Viacheslav Pavlov committed
66
export default translate()(withStyles(styleSheet)<any>(ProgressMenu));