Tab

Kai Reinhard

16.03.2018 1bb3ee67ddd397d61791dab220a9a65d23c9a91e

Tab

 borgbutler-webapp/src/components/views/archives/ArchiveView.jsx

@@ -1,9 +1,10 @@
import React from 'react'
import {Table} from 'reactstrap';
import {Nav, NavLink, TabContent, Table, TabPane} from 'reactstrap';
import {PageHeader} from '../../general/BootstrapComponents';
import {getRestServiceUrl, humanFileSize, humanSeconds} from '../../../utilities/global';
import ErrorAlert from '../../general/ErrorAlert';
import {IconRefresh} from "../../general/IconComponents";
import classNames from "classnames";

class ArchiveView extends React.Component {

@@ -44,6 +45,12 @@
            .catch(() => this.setState({isFetching: false, failed: true}));
    };

    toggleTab = tab => () => {
        this.setState({
            activeTab: tab
        })
    };

    render = () => {
        let content = undefined;
        let archive = this.state.archive;
@@ -71,6 +78,22 @@
                </div>
            </React.Fragment>;
            content = <React.Fragment>
                <Nav tabs>
                    <NavLink
                        className={classNames({active: this.state.activeTab === '1'})}
                        onClick={this.toggleTab('1')}
                    >
                        Information
                    </NavLink>
                    <NavLink
                        className={classNames({active: this.state.activeTab === '2'})}
                        onClick={this.toggleTab('2')}
                    >
                        File list
                    </NavLink>
                </Nav>
                <TabContent activeTab={this.state.activeTab}>
                    <TabPane tabId={'1'}>
                <Table hover>
                    <tbody>
                    <tr>
@@ -145,6 +168,11 @@
                    </tr>
                    </tbody>
                </Table>
                    </TabPane>
                    <TabPane tabId={'2'}>
                        Hurzel
                    </TabPane>
                </TabContent>
            </React.Fragment>;

        }