🔀📝 add a fully-fledged example project (#2)

* docs: add a full-fledged example project

* fix: use correct script path

* docs: improve example readme commands

* chore: ignore the dist folder

* chore: cleanup the makefile

1 files changed, 95 insertions, 0 deletions

diff --git a/example/src/lustre_counter.gleam b/example/src/lustre_counter.gleam
new file mode 100644
index 0000000..25872a4
--- /dev/null
+++ b/example/src/lustre_counter.gleam
@@ -0,0 +1,95 @@
+import gleam/int
+import lustre
+import lustre/element.{button, div, p, span, text}
+import lustre/event.{dispatch, on_click}
+import lustre/cmd
+import gleam/map.{Map}
+import gleam/list
+import gleam/option
+
+pub fn main() {
+  let app = lustre.application(#(init_state(), cmd.none()), update, render)
+  lustre.start(app, "#app")
+}
+
+type State {
+  State(ctr: Int, counters: Map(Int, Int))
+}
+
+fn init_state() {
+  State(ctr: 2, counters: map.from_list([#(1, 0)]))
+}
+
+pub type Action {
+  Add
+  Remove(id: Int)
+  Increment(id: Int)
+  Decrement(id: Int)
+}
+
+fn update(state, action) {
+  case action {
+    Add -> #(
+      State(
+        ..state,
+        ctr: state.ctr + 1,
+        counters: state.counters
+        |> map.insert(state.ctr, 0),
+      ),
+      cmd.none(),
+    )
+    Remove(id) -> #(
+      State(
+        ..state,
+        counters: state.counters
+        |> map.delete(id),
+      ),
+      cmd.none(),
+    )
+    Increment(id) -> #(
+      State(
+        ..state,
+        counters: state.counters
+        |> map.update(id, fn(opt_ctr) { option.unwrap(opt_ctr, 0) + 1 }),
+      ),
+      cmd.none(),
+    )
+    Decrement(id) -> #(
+      State(
+        ..state,
+        counters: state.counters
+        |> map.update(id, fn(opt_ctr) { option.unwrap(opt_ctr, 0) - 1 }),
+      ),
+      cmd.none(),
+    )
+  }
+}
+
+fn render(state) {
+  let render_counter = fn(pair) {
+    let #(id, value) = pair
+    p(
+      [],
+      [
+        button([on_click(dispatch(Decrement(id)))], [text("-")]),
+        span([], [text(" "), text(int.to_string(value)), text(" ")]),
+        button([on_click(dispatch(Increment(id)))], [text("+")]),
+        span([], [text(" ")]),
+        button([on_click(dispatch(Remove(id)))], [text("remove")]),
+      ],
+    )
+  }
+
+  div(
+    [],
+    [
+      div(
+        [],
+        state.counters
+        |> map.to_list
+        |> list.map(render_counter),
+      ),
+      p([], [button([on_click(dispatch(Add))], [text("add")])]),
+    ],
+  )
+}