fix(react): fix some upgrade issues and rename public to docs

LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2019 MBorne
+Copyright (c) 2021 MBorne
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -11,7 +11,7 @@ For the moment, it looks like a scam which served to motivate a child to learn h
 | Name           | Description |
 | -------------- | ----------- |
 | Addition       | `a + b = ?` |
-| Substraction   | `a - b = ?` |
+| Soustraction   | `a - b = ?` |
 | Multiplication | `a * b = ?` |
 | Double         | `2 * a = ?` |
 | Moitié         | `a / 2 = ?` |

package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mborne/math-city",
   "version": "0.1.0",
-  "description": "",
+  "description": "Play smart games to earn money to build your city and protect it from zombies!",
   "main": "index.js",
   "scripts": {
     "build": "webpack --mode=production",
@@ -10,10 +10,10 @@
   },
   "repository": {
     "type": "git",
-    "url": "https://gogs.quadtreeworld.net/experiments/math-city.git"
+    "url": "https://github.com/mborne/math-city.git"
   },
-  "author": "",
-  "license": "UNLICENSED",
+  "author": "MBorne <mborne@users.noreply.github.com>",
+  "license": "MIT",
   "private": true,
   "devDependencies": {
     "@babel/core": "^7.23.3",

server.js

@@ -2,7 +2,7 @@ const express = require('express');
 const app = express();
 const port = 3000;
 
-app.use(express.static('public'));
+app.use(express.static('docs'));
 
 app.get('*', function (req, res) {
     res.redirect('/');

src/components/Home.js

@@ -23,7 +23,7 @@ class Home extends React.Component {
             modeItems.push(modeItem);
         });
         return (
-            <div class="home">
+            <div className="home">
                 <h1>MathCity</h1>
                 <ul className="list-group">
                     {modeItems}

src/components/Main.js

@@ -1,8 +1,8 @@
 import React from 'react';
 
 import {
-  HashRouter as Router,
-  Switch,
+  BrowserRouter as Router,
+  Routes,
   Route,
   useParams
 } from 'react-router-dom';
@@ -29,10 +29,10 @@ class Main extends React.Component {
   render() {
     return (
       <Router>
-        <Switch>
-          <Route exact path="/" component={Home} />
-          <Route path="/play/:mode" children={<GameRoute />}/>
-        </Switch>
+        <Routes>
+          <Route exact path="/" element={<Home />} />
+          <Route path="/play/:mode" element={<GameRoute />}/>
+        </Routes>
       </Router>
     );
   }

src/index.js

@@ -2,11 +2,8 @@ const React = require('react');
 const ReactDOM = require('react-dom');
 
 import Main from './components/Main';
-import { BrowserRouter, Route, Switch } from 'react-router-dom';
+import { createRoot } from 'react-dom/client';
 
-ReactDOM.render(
-    <BrowserRouter>
-        <Main />
-    </BrowserRouter>,
-    document.getElementById('main')
-);
+const container = document.getElementById('main');
+const root = createRoot(container);
+root.render(<Main />);

webpack.config.js

@@ -5,7 +5,7 @@ module.exports = {
     entry: './src/index.js',
     output: {
         filename: 'main.js',
-        path: path.resolve(__dirname, 'public/js'),
+        path: path.resolve(__dirname, 'docs/js'),
     },
     module: {
         rules: [{