From 93d46754d4692a12f8b88f929583d33f51349496 Mon Sep 17 00:00:00 2001
From: Matt Hunzinger <matthunz2@gmail.com>
Date: Sat, 20 Jan 2024 12:52:21 -0500
Subject: [PATCH] Update README

---
 README.md | 45 ++++++++++++++++++++++++++++++++++++++++++---
 1 file changed, 42 insertions(+), 3 deletions(-)

diff --git a/README.md b/README.md
index f3c33c1c..64ea50dc 100644
--- a/README.md
+++ b/README.md
@@ -16,7 +16,7 @@
 </div>
 
 <div align="center">
- <a href="https://github.com/concoct-rs/concoct/tree/main/examples">Examples</a>
+ <a href="https://github.com/concoct-rs/concoct/tree/main/web_examples">Examples</a>
 </div>
 
 <br />
@@ -28,8 +28,8 @@ This crate provides a diffing-engine and state management system for any backend
 ```rust
 struct App;
 
-impl View for App {
-    fn body(&self) -> impl Body {
+impl ViewBuilder for App {
+    fn build(&self) -> impl View {
         let (count, set_high) = use_state(|| 0);
         let set_low = set_high.clone();
 
@@ -42,6 +42,45 @@ impl View for App {
 }
 ```
 
+## Components
+```rust
+struct Readme {
+    crate_name: String,
+    version: String,
+}
+
+impl ViewBuilder for Readme {
+    fn build(&self) -> impl View {
+        let (content, set_content) = use_state(|| None);
+
+        use_effect(&self.crate_name, || {
+            let name = self.crate_name.clone();
+            let version = self.version.clone();
+            spawn_local(async move {
+                let readme = api::get_readme(&name, &version).await;
+                set_content(Some(readme));
+            })
+        });
+
+        content
+            .map(|content| OneOf2::A(content))
+            .unwrap_or_else(|| OneOf2::B("Loading..."))
+    }
+}
+
+struct App;
+
+impl ViewBuilder for App {
+    fn build(&self) -> impl View {
+        Readme {
+            crate_name: String::from("concoct"),
+            version: String::from("1.0"),
+        }
+    }
+}
+```
+
+
 ## Installation
 The easiest way to get started is using the `full` feature flag.