new class Ssettings to get videopath from db

add test - failing
remove useless videopath and tvpath from app.js

src/App.js

@@ -14,7 +14,8 @@ class App extends React.Component {
         this.state = {
             page: "default",
             generalSettingsLoaded: false,
-            passwordsupport: null
+            passwordsupport: null,
+            mediacentername: "OpenMediaCenter"
         };
 
         // bind this to the method for being able to call methods such as this.setstate
@@ -22,8 +23,6 @@ class App extends React.Component {
         this.returnToLastElement = this.returnToLastElement.bind(this);
     }
 
-    generaldata = {};
-
     componentDidMount() {
         const updateRequest = new FormData();
         updateRequest.append('action', 'loadInitialData');
@@ -31,16 +30,13 @@ class App extends React.Component {
         fetch('/api/Settings.php', {method: 'POST', body: updateRequest})
             .then((response) => response.json()
                 .then((result) => {
-                    this.generaldata = {
-                        videopath: result.video_path,
-                        tvshowpath: result.episode_path,
-                        mediacentername: result.mediacenter_name
-                    };
-
+                    console.log(result);
                     this.setState({
                         generalSettingsLoaded: true,
-                        passwordsupport: result.passwordEnabled
+                        passwordsupport: result.passwordEnabled,
+                        mediacentername: result.mediacenter_name
                     });
+                    console.log(this.state);
                 }));
     }
 
@@ -49,8 +45,7 @@ class App extends React.Component {
     constructViewBinding(){
         return {
             changeRootElement: this.changeRootElement,
-            returnToLastElement: this.returnToLastElement,
-            generalsettings: this.generaldata
+            returnToLastElement: this.returnToLastElement
         };
     }
 
@@ -86,7 +81,7 @@ class App extends React.Component {
         return (
             <div className="App">
                 <nav className="navbar navbar-expand-sm bg-primary navbar-dark">
-                    <div className="navbar-brand">OpenMediaCenter</div>
+                    <div className="navbar-brand">{this.state.mediacentername}</div>
 
                     <ul className="navbar-nav">
                         <li className="nav-item">

src/App.test.js

@@ -2,6 +2,14 @@ import React from 'react';
 import App from './App';
 import {shallow} from 'enzyme'
 
+function prepareFetchApi(response) {
+    const mockJsonPromise = Promise.resolve(response);
+    const mockFetchPromise = Promise.resolve({
+        json: () => mockJsonPromise,
+    });
+    return (jest.fn().mockImplementation(() => mockFetchPromise));
+}
+
 describe('<App/>', function () {
     it('renders without crashing ', function () {
         const wrapper = shallow(<App/>);
@@ -82,4 +90,28 @@ describe('<App/>', function () {
         wrapper.find(".nav-link").findWhere(t => t.text() === "Settings" && t.type() === "div").simulate("click");
         expect(wrapper.find("SettingsPage")).toHaveLength(1);
     });
+
+    it('test initial fetch from api', done => {
+        global.fetch = prepareFetchApi({
+            generalSettingsLoaded: true,
+            passwordsupport: true,
+            mediacentername: "testname"
+        });
+
+        const wrapper = shallow(<App/>);
+
+        expect(global.fetch).toBeCalledTimes(1);
+
+        process.nextTick(() => {
+            console.log(wrapper.state());
+
+            // todo state lifecycle not triggered
+            wrapper.update();
+            console.log(wrapper.state());
+            expect(wrapper.state('passwordsupport')).toBe(true);
+
+            global.fetch.mockClear();
+            done();
+        });
+    });
 });