clean up counter example

Cargo.toml

@@ -11,5 +11,5 @@ members = [
     "aper-websocket-client",
     "aper-serve",
     "aper-stateroom",
-    "site/doctests",
+    "site/doctests", "aper-yew",
 ]

aper-websocket-client/src/client.rs

@@ -24,7 +24,7 @@ where
 {
     fn eq(&self, _other: &Self) -> bool {
         // only equal if they are the same instance
-        self as *const _ == _other as *const _
+        self.conn.as_ref() as *const _ == _other.conn.as_ref() as *const _
     }
 }
 

aper-yew/Cargo.toml

@@ -0,0 +1,10 @@
+[package]
+version = "0.5.0"
+name = "aper-yew"
+version = "0.1.0"
+edition = "2021"
+
+[dependencies]
+yew = "0.21.0"
+aper = { path = "../aper" }
+aper-websocket-client = { path = "../aper-websocket-client" }

aper-yew/src/lib.rs

@@ -0,0 +1,50 @@
+use aper::{Aper, Store};
+use aper_websocket_client::AperWebSocketClient;
+use yew::Callback;
+
+pub struct FakeSend<T> {
+    pub value: T,
+}
+
+unsafe impl<T> Send for FakeSend<T> {}
+unsafe impl<T> Sync for FakeSend<T> {}
+
+#[derive(Clone)]
+pub struct YewAperClient<T: Aper> {
+    client: AperWebSocketClient<T>,
+}
+
+impl<T: Aper> PartialEq for YewAperClient<T> {
+    fn eq(&self, _other: &Self) -> bool {
+        // only equal if they are the same instance
+        self.client == _other.client
+    }
+}
+
+impl<T: Aper> YewAperClient<T> {
+    pub fn new(url: &str) -> Self {
+        let client = AperWebSocketClient::new(url).unwrap();
+        YewAperClient { client }
+    }
+
+    pub fn state(&self) -> T {
+        self.client.state()
+    }
+
+    pub fn store(&self) -> Store {
+        self.client.store()
+    }
+
+    pub fn apply(&self, intent: T::Intent) -> Result<(), T::Error> {
+        self.client.apply(intent)
+    }
+
+    pub fn callback<A>(&self, func: impl Fn() -> T::Intent + 'static) -> Callback<A> {
+        let client = self.clone();
+
+        Callback::from(move |_| {
+            let intent = func();
+            let _ = client.apply(intent);
+        })
+    }
+}

examples/counter/client/Cargo.toml

@@ -9,7 +9,7 @@ crate-type = ["cdylib", "rlib"]
 
 [dependencies]
 aper = {path = "../../../aper"}
-aper-websocket-client = {path = "../../../aper-websocket-client"}
+aper-yew = {path = "../../../aper-yew"}
 console_error_panic_hook = "0.1.6"
 serde = { version = "1.0.124", features = ["derive"] }
 wasm-bindgen = "0.2.83"

examples/counter/client/src/lib.rs

@@ -1,34 +1,15 @@
 use aper::AperSync;
-use aper_websocket_client::AperWebSocketClient;
+use aper_yew::{FakeSend, YewAperClient};
 pub use counter_common::{Counter, CounterIntent};
 use wasm_bindgen::prelude::*;
 use yew::{
     prelude::{function_component, html, Html, Properties},
-    use_state, Callback,
+    use_state,
 };
 
 #[derive(Clone, PartialEq, Properties)]
 struct CounterViewProps {
-    connection: AperWebSocketClient<Counter>,
-}
-
-struct FakeSend<T> {
-    value: T,
-}
-
-unsafe impl<T> Send for FakeSend<T> {}
-unsafe impl<T> Sync for FakeSend<T> {}
-
-fn callback<T>(
-    func: impl Fn() -> CounterIntent + 'static,
-    client: &AperWebSocketClient<Counter>,
-) -> Callback<T> {
-    let client = client.clone();
-
-    Callback::from(move |_| {
-        let intent = func();
-        let _ = client.apply(intent);
-    })
+    connection: YewAperClient<Counter>,
 }
 
 #[function_component]
@@ -47,13 +28,13 @@ fn CounterView(props: &CounterViewProps) -> Html {
     html! {
         <div>
             <p>{&format!("Counter: {}", counter.value())}</p>
-            <button onclick={callback(|| CounterIntent::Add(1), &props.connection)}>
+            <button onclick={props.connection.callback(|| CounterIntent::Add(1))}>
                 {"+1"}
             </button>
-            <button onclick={callback(|| CounterIntent::Subtract(1), &props.connection)}>
+            <button onclick={props.connection.callback(|| CounterIntent::Subtract(1))}>
                 {"-1"}
             </button>
-            <button onclick={callback(|| CounterIntent::Reset, &props.connection)}>
+            <button onclick={props.connection.callback(|| CounterIntent::Reset)}>
                 {"Reset"}
             </button>
         </div>
@@ -64,7 +45,7 @@ fn CounterView(props: &CounterViewProps) -> Html {
 pub fn entry() {
     let url = "ws://localhost:8080/ws";
 
-    let connection = AperWebSocketClient::<Counter>::new(url).unwrap();
+    let connection = YewAperClient::<Counter>::new(url);
 
     let props = CounterViewProps { connection };