feat(app-config): add routing configuration

eficode · Dec 26, 2020 · 8a0de1a · 8a0de1a
1 parent 5a20813
commit 8a0de1a
Show file tree

Hide file tree

Showing 11 changed files with 153 additions and 82 deletions.
diff --git a/packages/game-app/cypress/integration/test.spec.ts b/packages/game-app/cypress/integration/test.spec.ts
@@ -1,4 +1,3 @@
-/* eslint-disable jest/valid-expect-in-promise */
 /// <reference types="cypress" />
 
 context("Index page", () => {
@@ -7,6 +6,6 @@ context("Index page", () => {
   });
 
   it("should contain the title", () => {
-    cy.containsTranslation("home.title");
+    cy.contains("Signup");
   });
 });
diff --git a/packages/game-app/package-lock.json b/packages/game-app/package-lock.json
diff --git a/packages/game-app/package.json b/packages/game-app/package.json
@@ -9,6 +9,7 @@
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
     "react-redux": "^7.2.2",
+    "react-router-dom": "^5.2.0",
     "redux-saga": "^1.1.3",
     "web-vitals": "^0.2.4"
   },
@@ -54,6 +55,7 @@
     "@types/react": "^16.14.2",
     "@types/react-dom": "^16.9.10",
     "@types/react-redux": "^7.1.14",
+    "@types/react-router-dom": "^5.1.6",
     "@types/redux-saga": "^0.10.5",
     "cypress": "^6.2.0",
     "env-cmd": "^10.1.0",

diff --git a/packages/game-app/src/App.css b/packages/game-app/src/App.css
diff --git a/packages/game-app/src/App.test.tsx b/packages/game-app/src/App.test.tsx
diff --git a/packages/game-app/src/App.tsx b/packages/game-app/src/App.tsx
@@ -1,30 +1,18 @@
 import React from 'react';
-import logo from './logo.svg';
-import './App.css';
-import { useTranslate } from '@pipeline/i18n';
+import {Redirect, Route, Switch} from 'react-router-dom';
+import {RoutingPath} from "@pipeline/routing";
 
 function App() {
 
-  const t = useTranslate();
-
-
   return (
-    <div className="App">
-      <header className="App-header">
-        <img src={logo} className="App-logo" alt="logo" />
-        <p>
-        {t("home.title")}
-        </p>
-        <a
-          className="App-link"
-          href="https://reactjs.org"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          Learn React
-        </a>
-      </header>
-    </div>
+    <Switch>
+      <Route path={RoutingPath.Login} render={() => <div>Login</div>}/>
+      <Route path={RoutingPath.Signup} render={() => <div>Signup</div>}/>
+      <Route path={RoutingPath.Dashboard} render={() => <div>Dashboard</div>}/>
+      <Route path="*">
+        <Redirect to={RoutingPath.Signup}/>
+      </Route>
+    </Switch>
   );
 }
 

diff --git a/packages/game-app/src/_shared/routing/index.ts b/packages/game-app/src/_shared/routing/index.ts
@@ -0,0 +1,5 @@
+import { RoutingPath } from "./routingPath";
+
+export {
+  RoutingPath
+}
diff --git a/packages/game-app/src/_shared/routing/routingPath.ts b/packages/game-app/src/_shared/routing/routingPath.ts
@@ -0,0 +1,5 @@
+export enum RoutingPath {
+  Login = '/login',
+  Signup = '/signup',
+  Dashboard = '/dashboard',
+}
diff --git a/packages/game-app/src/index.tsx b/packages/game-app/src/index.tsx
@@ -6,13 +6,17 @@ import reportWebVitals from './reportWebVitals';
 
 import {bootstrap} from "./_shared";
 import {Provider} from "react-redux";
-
+import {
+  BrowserRouter as Router
+} from "react-router-dom";
 const store = bootstrap();
 
 ReactDOM.render(
   <React.StrictMode>
     <Provider store={store}>
-      <App/>
+      <Router>
+        <App/>
+      </Router>
     </Provider>
   </React.StrictMode>,
   document.getElementById('root')

diff --git a/packages/game-app/src/logo.svg b/packages/game-app/src/logo.svg
diff --git a/packages/game-app/tsconfig.paths.json b/packages/game-app/tsconfig.paths.json
@@ -4,7 +4,8 @@
     "paths": {
       "@assets/*": ["src/assets/*"],
       "@pipeline/app-config": ["src/_shared/config"],      
-      "@pipeline/i18n": ["src/_shared/i18n"]
+      "@pipeline/i18n": ["src/_shared/i18n"],
+      "@pipeline/routing": ["src/_shared/routing"]
     }
   }
 }