nav

2019-05-15 19:26:27 +10:00
parent aca772263a
commit 127bdf0530
5 changed files with 54 additions and 16 deletions
@@ -0,0 +1,45 @@
+const { connect } = require('preact-redux');
+const preact = require('preact');
+const actions = require('../actions');
+
+const addState = connect(
+    function receiveState(state) {
+        const {
+            ws,
+            instances,
+            cryps,
+        } = state;
+
+        function sendInstanceState(instance) {
+            return ws.sendInstanceState(instance.id);
+        }
+
+        return {
+            instances,
+            sendInstanceState,
+        };
+    },
+);
+
+function Nav(args) {
+    const {
+        sendInstanceState,
+        instances,
+     } = args;
+
+    const joined = instances.map((i, j) => (
+        <button key={j} onClick={() => sendInstanceState(i)} >{i.name}</button>
+    ));
+
+    return (
+        <nav>
+            <h2>Instances</h2>
+            <button>list</button>
+            <button>create</button>
+            <hr />
+            {joined}
+        </nav>
+    );
+}
+
+module.exports = addState(Nav);
@@ -12,6 +12,7 @@ const registerEvents = require('./events');

 const Header = require('./components/header.container');
 const Body = require('./components/body.component');
+const Nav = require('./components/nav');

 // Redux Store
 const createStoreWithMiddleware = applyMiddleware(logger)(createStore);
@@ -53,19 +54,7 @@ document.fonts.load('16pt "Jura"').then(() => {
    const Cryps = () => (
        <main className="cryps" >
            <Header />
-            <nav>
-                <h2>Instances</h2>
-                <button>
-                    join new
-                </button>
-                <hr />
-                <button>
-                    six
-                </button>
-                <button>
-                    grep
-                </button>
-            </nav>
+            <Nav />
            <Body />
        </main>
    );
@@ -80,7 +80,7 @@ function crypsReducer(state = defaultCryps, action) {
    }
 }

-const defaultInstances = null;
+const defaultInstances = [];
 function instancesReducer(state = defaultInstances, action) {
    switch (action.type) {
        case actions.SET_INSTANCES:
@@ -312,7 +312,7 @@ function createSocket(events) {
                sendAccountInstances();
                sendAccountCryps();
                // console.log(testGame);
-                events.setGame(testGame(account.id));
+                // events.setGame(testGame(account.id));
                clearGameStateTimeout();
            }