...

Kai Reinhard

10.15.2018 e4302e28ee27fe03342efeaeb006946660aa5fd2

...

 borgbutler-webapp/src/components/general/Menu.jsx

@@ -1,11 +1,8 @@
import React from 'react';
import {NavLink as ReactRouterNavLink} from 'react-router-dom';
import {Collapse, Nav, Navbar, NavbarBrand, NavbarToggler, NavItem, NavLink, UncontrolledTooltip} from 'reactstrap';
import {getResponseHeaderFilename, getRestServiceUrl} from '../../utilities/global';
import fileDownload from 'js-file-download';
import {Collapse, Nav, Navbar, NavbarBrand, NavbarToggler, NavItem, NavLink} from 'reactstrap';
import LoadingOverlay from './loading/LoadingOverlay';
import FailedOverlay from './loading/failed/Overlay';
import I18n from "./translation/I18n";

class Menu extends React.Component {
    getNavElement = (route, index) => {

 borgbutler-webapp/src/components/views/develop/RestServices.jsx

@@ -1,7 +1,6 @@
import React from 'react';
import {PageHeader} from '../../general/BootstrapComponents';
import {getRestServiceUrl, getResponseHeaderFilename} from "../../../utilities/global";
import fileDownload from 'js-file-download';
import {getRestServiceUrl} from "../../../utilities/global";

class RestUrlLink extends React.Component {
    render() {
@@ -24,68 +23,6 @@
}

class RestServices extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            templateDefinitionId: '',
            templatePrimaryKey: '',
        }
        this.onRun = this.onRun.bind(this);
    }

    componentDidMount() {
        fetch(getRestServiceUrl("templates/example-definitions"), {
            method: "GET",
            dataType: "JSON",
            headers: {
                "Content-Type": "text/plain; charset=utf-8",
            }
        })
            .then((resp) => {
                return resp.json()
            })
            .then((data) => {
                    this.setState({
                        templateDefinitionId: data.templateDefinitionId,
                        templatePrimaryKey: data.templatePrimaryKey
                    });
                }
            )
            .catch((error) => {
                    console.log(error, "Oups, what's happened?")
                }
            )
    }

    onRun() {
        let filename;
        fetch(getRestServiceUrl('templates/example-run-data'), {
            method: "GET",
            dataType: "JSON",
            headers: {
                "Content-Type": "text/plain; charset=utf-8"
            }
        })
            .then((resp) => {
                return resp.json()
            })
            .then((data) => {
                fetch(getRestServiceUrl("templates/run"), {
                    method: 'POST',
                    body: JSON.stringify(data)
                })
                    .then(response => {
                        filename = getResponseHeaderFilename(response.headers.get("Content-Disposition"));
                        //this.setState({downloadFilename: filename});
                        return response.blob();
                    })
                    .then(blob => fileDownload(blob, filename));
            })
            .catch((error) => {
                console.log(error, "Oups, what's happened?")
            })
    }

    render() {
        return (
            <React.Fragment>

 borgbutler-webapp/src/components/views/repos/RepoCard.jsx

@@ -16,7 +16,7 @@
    render = () => {
        const repo = this.props.repo;
        let repoId = repo.id ? repo.id : repo.name;
        let content = [[Name, repo.name, 'name']];
        let content = [['Name', repo.name, 'name']];
        let repoText = this.buildItem(null, content);

        return <React.Fragment>
@@ -40,4 +40,4 @@
    }
}

export default repoCard;
export default RepoCard;

 borgbutler-webapp/src/components/views/repos/RepoListView.jsx

@@ -4,9 +4,8 @@
import {PageHeader} from '../../general/BootstrapComponents';
import {getRestServiceUrl} from '../../../utilities/global';
import ErrorAlert from '../../general/ErrorAlert';
import TemplateCard from './TemplateCard';
import RepoCard from './RepoCard';
import {IconRefresh} from "../../general/IconComponents";
import I18n from "../../general/translation/I18n";

class RepoListView extends React.Component {

@@ -17,15 +16,14 @@
    };

    componentDidMount = () => {
        this.fetchTemplates();
        this.fetchRepos();
    };

    fetchTemplates = () => {
    fetchRepos = () => {
        this.setState({
            isFetching: true,
            failed: false,
            definitions: undefined,
            templates: undefined
            repos: undefined
        });
        fetch(`${this.path}/list`, {
            method: 'GET',
@@ -35,31 +33,18 @@
        })
            .then(response => response.json())
            .then(json => {
                const definitions = json.templateDefinitions.reduce((accumulator, current) => ({
                    ...accumulator,
                    [current.refId]: current
                }), {});

                const templates = json.templates.map(template => {
                    if (typeof template.templateDefinition === 'object') {
                        //console.log('refId: ' + template.templateDefinition.refId + ', templateDefinition: ' + JSON.stringify(template.templateDefinition))
                        definitions[template.templateDefinition.refId] = template.templateDefinition;
                        template.templateDefinition = template.templateDefinition.refId;
                    }

                const repos = json.repos.map(repo => {
                    return {
                        id: template.id,
                        primaryKey: template.fileDescriptor.primaryKey,
                        filename: template.fileDescriptor.filename,
                        lastModified: template.fileDescriptor.lastModified,
                        templateDefinitionId: template.templateDefinitionId,
                        templateDefinition: template.templateDefinition
                        id: repo.id,
                        name: repo.name,
                        lastModified: repo.last_modified
                    };
                });

                this.setState({
                    isFetching: false,
                    definitions, templates
                    repos
                })
            })
            .catch(() => this.setState({isFetching: false, failed: true}));
@@ -75,31 +60,28 @@
        } else if (this.state.failed) {

            content = <ErrorAlert
                title={'Cannot load Templates'}
                title={'Cannot load Repositories'}
                description={'Something went wrong during contacting the rest api.'}
                action={{
                    handleClick: this.fetchTemplates,
                    handleClick: this.fetchRepos,
                    title: 'Try again'
                }}
            />;

        } else if (this.state.templates) {
        } else if (this.state.repos) {

            content = <React.Fragment>
                <div
                    className={'btn btn-outline-primary refresh-button-right'}
                    onClick={this.fetchTemplates}
                    onClick={this.fetchRepos}
                >
                    <IconRefresh/>
                </div>
                <CardDeck>
                {this.state.templates.map(template => {
                    const definition = this.state.definitions[template.templateDefinition];

                    return <TemplateCard
                        key={template.primaryKey}
                        template={template}
                        definition={definition}
                {this.state.repos.map(repo => {
                    return <RepoCard
                        key={repo.id}
                        repo={repo}
                    />;
                })}
                </CardDeck>
@@ -109,7 +91,7 @@

        return <React.Fragment>
            <PageHeader>
                <I18n name={'templates'}/>
                Repositories
            </PageHeader>
            {content}
        </React.Fragment>;
@@ -118,7 +100,7 @@
    constructor(props) {
        super(props);

        this.fetchTemplates = this.fetchTemplates.bind(this);
        this.fetchRepos = this.fetchRepos.bind(this);
    }
}


 borgbutler-webapp/src/containers/WebApp.jsx

@@ -2,10 +2,10 @@
import createBrowserHistory from 'history/createBrowserHistory';
import {Route, Router, Switch} from 'react-router';
import {connect} from 'react-redux';
import {Badge} from 'reactstrap';

import Menu from '../components/general/Menu';
import Start from '../components/views/Start';
import RepoListView from '../components/views/repos/RepoListView';
import ConfigurationPage from '../components/views/config/ConfigurationPage';
import RestServices from '../components/views/develop/RestServices';
import {isDevelopmentMode} from '../utilities/global';
@@ -13,7 +13,6 @@
import Footer from '../components/views/footer/Footer';
import {loadVersion} from '../actions';
import {getTranslation} from '../utilities/i18n';
import I18n from "../components/general/translation/I18n";

class WebApp extends React.Component {

@@ -26,8 +25,9 @@
    render() {
        let routes = [
            ['Start', '/', Start],
            ['Log viewer', '/logging', LogPage],
            ['Configuration', '/config', ConfigurationPage]
            ['Repositories', '/repos', RepoListView],
            [getTranslation('logviewer'), '/logging', LogPage],
            [getTranslation('configuration'), '/config', ConfigurationPage]
        ];

        if (isDevelopmentMode()) {