From ad359a60ef130fc2dd01f0b2eda52d6e860878b3 Mon Sep 17 00:00:00 2001
From: Ayo <ramon.aycojr@gmail.com>
Date: Tue, 21 Nov 2023 11:23:20 +0100
Subject: [PATCH] refactor hello-world component

---
 demo/HelloWorld.mjs | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/demo/HelloWorld.mjs b/demo/HelloWorld.mjs
index 40ed12e..6483f72 100644
--- a/demo/HelloWorld.mjs
+++ b/demo/HelloWorld.mjs
@@ -2,17 +2,18 @@
 import WebComponent from "../src/WebComponent.js";
 
 export class HelloWorld extends WebComponent {
-  static properties = ["my-name", "emotion"];
+  static properties = ["count", "emotion"];
 
   onInit() {
-    let count = 0;
-    this.onclick = () => (this.props.myName = `Clicked ${++count}`);
+    this.props.count = 0;
+    this.onclick = () => ++this.props.count;
   }
 
   get template() {
-    return `<button id="btn">Hello ${this.props.myName ?? "World"}${
-      this.props.emotion === "sad" ? ". 😭" : "! 🙌"
-    }</button>`;
+    const label = this.props.count ? `Clicked ${this.props.count}` : "World";
+    const emote = this.props.emotion === "sad" ? ". 😭" : "! 🙌";
+
+    return `<button id="btn">Hello ${label}${emote}</button>`;
   }
 }