rpc

client/package-lock.json

@@ -16,8 +16,7 @@
                 "preact-router": "^3.2.1",
                 "react-feather": "^2.0.10",
                 "react-redux": "^8.0.2",
-                "redux": "^4.2.0",
-                "unistore": "^3.5.2"
+                "redux": "^4.2.0"
             },
             "devDependencies": {
                 "@babel/plugin-transform-react-jsx-source": "^7.18.6",
@@ -19059,19 +19058,6 @@
                 "node": ">=8"
             }
         },
-        "node_modules/unistore": {
-            "version": "3.5.2",
-            "resolved": "https://registry.npmjs.org/unistore/-/unistore-3.5.2.tgz",
-            "integrity": "sha512-2Aa4eX0Ua1umyiI3Eai6Li+wXYOHgaDBGOPB3Hvw7PAVuD30TAyh5kS4yNKb2fLDbQgizvPhKQRcYnOdfsm4VQ==",
-            "peerDependenciesMeta": {
-                "preact": {
-                    "optional": true
-                },
-                "react": {
-                    "optional": true
-                }
-            }
-        },
         "node_modules/universalify": {
             "version": "2.0.0",
             "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz",
@@ -35978,11 +35964,6 @@
                 "crypto-random-string": "^2.0.0"
             }
         },
-        "unistore": {
-            "version": "3.5.2",
-            "resolved": "https://registry.npmjs.org/unistore/-/unistore-3.5.2.tgz",
-            "integrity": "sha512-2Aa4eX0Ua1umyiI3Eai6Li+wXYOHgaDBGOPB3Hvw7PAVuD30TAyh5kS4yNKb2fLDbQgizvPhKQRcYnOdfsm4VQ=="
-        },
         "universalify": {
             "version": "2.0.0",
             "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz",

client/src/app.tsx

@@ -20,6 +20,7 @@ import store, { userState, wsState } from './store'
 const ws = createWs(store);
 ws.connect();
 
+// dodgy, doesn't cause the header to rerender
 async function init() {
     const [error, user] = await http.getLogin();
     if (error) return route('/login');
@@ -27,7 +28,6 @@ async function init() {
     store.dispatch(userState.actions.set(user));
     store.dispatch(wsState.actions.set(ws));
 }
-
 init();
 
 const App = () => {

client/src/components/offer.tsx

@@ -7,7 +7,7 @@ import http from '../http';
 export default function Offer(offer) {
     const { want: { data: details } } = offer;
 
-    const [accepted, setAccepted] = useState(offer.status !== 'pending');
+    const [accepted, setAccepted] = useState(offer.status !== 'Pending');
 
     async function onClick() {
         const [error] = await http.postOfferAccept(offer.id);

client/src/routes/acp.tsx

@@ -1,21 +1,30 @@
 import { h } from 'preact';
 import { useState, useEffect } from 'preact/hooks';
-import { connect } from 'unistore/preact'
 
 import http from './../http';
 import AcpOffer from './../components/acp.offer';
 
-// hmmm
-// bundle...
-import { Status } from './../../../api/src/offers'
+import { useSelector, useDispatch } from 'react-redux'
+import { State } from './../store';
+
+enum Status {
+    Pending      = 'Pending',
+    Accepted     = 'Accepted',
+    Declined     = 'Declined',
+    Ordered      = 'Ordered',
+    Complete     = 'Complete',
+}
 
 function Item({ item }) {
+    const ws = useSelector((state: State) => state.ws);
+    console.log(item);
+
     const statuses = Object.entries(Status).map(([label, value]) => (
-        <option value={value}>{label}</option>
+        <option selected={item.status === value} value={value}>{value}</option>
     ));
 
     function onChange(e) {
-        console.log(item.id, e.target.value);
+        ws.sendOfferStatusSet(item.id, e.target.value);
     }
 
     return (

client/src/store.tsx

@@ -31,7 +31,10 @@ const reducer = combineReducers({
   ws: wsState.reducer,
 });
 
-const store = createStore(reducer);
+const store = createStore(
+  reducer,
+  window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
+);
 
 export default store;
 

client/src/style/index.less

@@ -227,11 +227,11 @@ article {
 }
 
 .list {
-    display: flex;
-    flex-flow: row wrap;
+    display: grid;
+    grid-template-columns:
+        1fr 1fr 1fr 1fr;
 
     article {
-        flex: 1 1 20%;
         padding: var(--base-spacing);
         margin: var(--base-spacing-half);
     }

client/src/ws.ts

@@ -24,13 +24,13 @@ export default function createSocket(store) {
         // setTimeout(sendPing, 50);
     }
 
-    function sendSourcesAvailable() {
-        send(['SourcesAvailable', {}]);
+    function sendOfferStatusSet(id, status) {
+        send(['OfferStatusSet', { id, status }]);
     }
 
     let pongTimeout;
     function onPong() {
-        pongTimeout = setTimeout(sendPing, 1000);
+        pongTimeout = setTimeout(sendPing, 5000);
     }
 
     // -------------
@@ -108,6 +108,6 @@ export default function createSocket(store) {
     return {
         connect,
 
-        sendSourcesAvailable,
+        sendOfferStatusSet,
     };
 }