inventory wip

client/src/components/list.jsx

@@ -37,6 +37,16 @@ const addState = connect(
             instanceList,
         };
     },
+
+    function receiveDispatch(dispatch) {
+        function editConstruct(id) {
+            dispatch(actions.setConstructEditId(id));
+        }
+
+        return {
+            editConstruct,
+        };
+    }
 );
 
 function List(args) {
@@ -48,20 +58,16 @@ function List(args) {
         sendInstanceJoin,
         sendInstanceList,
         instanceList,
+
+        editConstruct,
     } = args;
 
     function listElements() {
         if (!instanceList) return <div>...</div>;
 
         const instancePanels = instanceList.map(instance => {
-            const player = instance.players.find(p => p.id === account.id);
-            const scoreText = player
-                ? `${player.wins} : ${player.losses}`
-                : '';
-
             function instanceClick() {
-                if (!player) return sendInstanceJoin(instance);
-                return sendInstanceState(instance);
+                return sendInstanceJoin(instance);
             }
 
             return (
@@ -69,21 +75,16 @@ function List(args) {
                     class="right"
                     onClick={instanceClick} >
                     <td>{instance.name}</td>
-                    <td>{instance.players.length} / {instance.max_players}</td>
-                    <td>{scoreText}</td>
                 </tr>
             );
         });
 
         return (
             <div class="menu-instance-list" >
-                <hr />
                 <table>
                     <thead>
                         <tr>
-                            <th>instance name</th>
-                            <th>players</th>
-                            <th>status</th>
+                            <th>opponent name</th>
                         </tr>
                     </thead>
                     <tbody>
@@ -98,14 +99,22 @@ function List(args) {
         );
     }
 
+    // <div class="controls">
+       // <button>&#9881;</button>
+    // </div>
+
     const constructPanels = constructs
         .filter(c => team.includes(c.id))
         .sort(idSort)
         .map(construct =>
             <div
                 key={construct.id}
+                // onClick={() => editConstruct(construct.id)}
                 class="menu-construct" >
-                <ConstructAvatar name={construct.name} id={construct.id} />
+                <ConstructAvatar
+                    name={construct.name}
+                    id={construct.id}
+                />
                 <h2>{construct.name}</h2>
             </div>
         );
@@ -115,6 +124,22 @@ function List(args) {
             <div class="construct-list">
                 {constructPanels}
             </div>
+            <hr />
+            <div class="inventory">
+                <h2>Inventory</h2>
+                <figure>
+                    <figcaption>Reimage</figcaption>
+                    <button>¤1</button>
+                </figure>
+                <figure>
+                    <figcaption>Rename</figcaption>
+                    <button>¤1</button>
+                </figure>
+                <figure>
+                    <figcaption>Invader Architecture</figcaption>
+                    <button>∞</button>
+                </figure>
+            </div>
             {listElements()}
         </main>
     );