Utilisation de React pour le client

client/src/components/App.jsx

@@ -0,0 +1,24 @@
+import React from 'react';
+import { HashRouter as Router, Route, Redirect, Switch } from "react-router-dom";
+import { store } from '../store/store';
+import { Provider } from 'react-redux';
+import { HomePage } from './HomePage/HomePage';
+import { BoardPage } from './BoardPage/BoardPage';
+
+export class App extends React.Component {
+  render() {
+    return (
+      <Provider store={store}>
+        <React.Fragment>
+          <Router>
+            <Switch>
+              <Route path="/" exact component={HomePage} />
+              <Route path="/board/:id" exact component={BoardPage} />
+              <Route component={() => <Redirect to="/" />} />
+            </Switch>
+          </Router>
+        </React.Fragment>
+      </Provider>
+    );
+  }
+}

client/src/components/BoardPage/BoardPage.jsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import { Page } from '../Page';
+
+export class BoardPage extends React.Component {
+  render() {
+    return (
+      <Page>
+
+      </Page>
+    );
+  }
+}

client/src/components/HomePage/HomePage.jsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import { Page } from '../Page';
+
+export class HomePage extends React.Component {
+  render() {
+    return (
+      <Page>
+
+      </Page>
+    );
+  }
+}

client/src/components/Page.jsx

@@ -0,0 +1,11 @@
+import React from 'react';
+
+export class Page extends React.Component {
+  render() {
+    return (
+      <div>
+
+      </div>
+    );
+  }
+}

client/src/components/app-loader.riot

@@ -1,32 +0,0 @@
-<ga-app>
-  <!-- DOM -->
-  <riot-router>
-    <riot-route path="/">
-      <ga-app />
-    </riot-route>
-    <riot-route path="/logout">
-      <ga-logout />
-    </riot-route>
-    <riot-route path="(.*)">
-      <ga-redirect path="/" />
-    </riot-route>
-  </riot-router>
-
-  <!-- Script -->
-  <script>
-    import { Router, Route, router } from '@riotjs/route';
-    import Redirect from './redirect.riot';
-    import Logout from './logout.riot';
-    import Ticketing from './apps/ticketing/app.riot';
-
-    export default {
-      components: {
-        RiotRoute: Route,
-        RiotRouter: Router,
-        GaRedirect: Redirect,
-        GaLogout: Logout,
-        GaApp: Ticketing,
-      }
-    };
-  </script>
-</ga-app>

client/src/components/apps/ticketing/app.riot

@@ -1,23 +0,0 @@
-<ga-ticketing>
-
-  <style>
-    :host { display: block; }
-  </style>
-  
-  <div class="container">
-    <ga-navbar></ga-navbar>
-    <div class="columns"></div>
-  </div>
-
-  <script>
-    import Navbar from '../../navbar.riot';
-    export default {
-
-      components: {
-        GaNavbar: Navbar,
-      },
-
-
-    };
-  </script>
-</ga-ticketing>

client/src/components/logout.riot

@@ -1,12 +0,0 @@
-<ga-logout>
-  <style>
-    :host { display: none; }
-  </style>
-  <script>
-    export default {
-      onMounted() {
-        window.location = "/logout";
-      }
-    };
-  </script>
-</ga-logout>

client/src/components/navbar.riot

@@ -1,20 +0,0 @@
-<ga-navbar>
-  <style>
-    :host {
-      display: block;
-    }
-  </style>
-  <div class="level">
-    <div class="level-left"></div>
-    <div class="level-right">
-      <a class="button is-warning level-item" href="/logout">
-        Se déconnecter
-      </a>
-    </div>
-  </div>
-  <script>
-    export default {
-      
-    }
-  </script>
-</ga-navbar>

client/src/components/redirect.riot

@@ -1,14 +0,0 @@
-<ga-redirect>
-  <style>
-    :host { display: none; }
-  </style>
-  <script>
-    import { router } from '@riotjs/route';
-    export default {
-      onMounted() {
-        console.log(`redirect to ${this.props.path}`);
-        router.push(this.props.path);
-      }
-    };
-  </script>
-</ga-redirect>