From 65d2af09271c1ec01db6d0cedc258169c7f083f8 Mon Sep 17 00:00:00 2001
From: kolibril13 <44469195+kolibril13@users.noreply.github.com>
Date: Fri, 28 Apr 2023 13:39:58 +0200
Subject: [PATCH 1/2] add prime example

---
 examples/prime_example.ipynb | 144 +++++++++++++++++++++++++++++++++++
 1 file changed, 144 insertions(+)
 create mode 100644 examples/prime_example.ipynb

diff --git a/examples/prime_example.ipynb b/examples/prime_example.ipynb
new file mode 100644
index 0000000..9c58732
--- /dev/null
+++ b/examples/prime_example.ipynb
@@ -0,0 +1,144 @@
+{
+ "cells": [
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "from traitlets import  Any, observe\n",
+    "from traitlets import Int, Any\n",
+    "import ipyreact\n",
+    "\n",
+    "def is_prime_number(n):\n",
+    "    for i in range(2, n):\n",
+    "        if n % i == 0:\n",
+    "            return \"No 💻🧊🧊🧊\"\n",
+    "    return \"Yes 💻✅✅✅\"\n",
+    "\n",
+    "\n",
+    "class PrimePythonWidget(ipyreact.ReactWidget):\n",
+    "    prime_message = Any(\"Click the Button\").tag(sync=True)\n",
+    "    count = Int(0).tag(sync=True)\n",
+    "\n",
+    "    @observe(\"count\")\n",
+    "    def _observe_count(self, change):\n",
+    "        self.prime_message = is_prime_number(self.count)\n",
+    "\n",
+    "    _esm = \"\"\"\n",
+    "    import * as React from \"react\";\n",
+    "\n",
+    "    export default function({on_count, count, prime_message}) {\n",
+    "        return <div><button onClick={() => on_count(count + 1)}>\n",
+    "            {count} times clicked \n",
+    "        </button>\n",
+    "        <br/>\n",
+    "        <span> {prime_message} </span>\n",
+    "        </div>\n",
+    "    };\"\"\"\n",
+    "\n",
+    "\n",
+    "primepy = PrimePythonWidget()\n",
+    "primepy\n"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "primepy.count = 3"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "primepy.count = 4"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "class PrimeJavaScriptWidget(ipyreact.ReactWidget):\n",
+    "    prime_message = Any(\"Click the Button\").tag(sync=True)    \n",
+    "    count = Int(0).tag(sync=True)\n",
+    "\n",
+    "    _esm = \"\"\"\n",
+    "    import * as React from \"react\";\n",
+    "\n",
+    "    function isPrimeNumber(n) {\n",
+    "    for (let i = 2; i < n; i++) {\n",
+    "        if (n % i === 0) {\n",
+    "        return \"No 🌐🧊🧊🧊\";\n",
+    "        }\n",
+    "    }\n",
+    "    return \"Yes 🌐✅✅✅\";\n",
+    "    }\n",
+    "\n",
+    "    export const MyUpdater = ({ count, on_count, prime_message }) => {\n",
+    "    prime_message = isPrimeNumber(count);\n",
+    "    return <span> {prime_message} </span>;\n",
+    "    };\n",
+    "\n",
+    "    export default function ({ on_count, count, prime_message }) {\n",
+    "    return (\n",
+    "        <div>\n",
+    "        <button onClick={() => on_count(count + 1)}>{count} times clicked</button>\n",
+    "        <br />\n",
+    "        <MyUpdater count={count} prime_message={prime_message} />\n",
+    "        </div>\n",
+    "    );\n",
+    "    }\n",
+    "    \"\"\"\n",
+    "primejs = PrimeJavaScriptWidget()\n",
+    "primejs"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "primejs.count = 3"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "primejs.count = 4"
+   ]
+  }
+ ],
+ "metadata": {
+  "kernelspec": {
+   "display_name": "Python 3 (ipykernel)",
+   "language": "python",
+   "name": "python3"
+  },
+  "language_info": {
+   "codemirror_mode": {
+    "name": "ipython",
+    "version": 3
+   },
+   "file_extension": ".py",
+   "mimetype": "text/x-python",
+   "name": "python",
+   "nbconvert_exporter": "python",
+   "pygments_lexer": "ipython3",
+   "version": "3.11.3"
+  }
+ },
+ "nbformat": 4,
+ "nbformat_minor": 2
+}

From 5a0ac776a23022a70ee697fa547378bb19949dcd Mon Sep 17 00:00:00 2001
From: kolibril13 <44469195+kolibril13@users.noreply.github.com>
Date: Fri, 28 Apr 2023 14:11:23 +0200
Subject: [PATCH 2/2] update example

---
 examples/prime_example.ipynb | 26 ++++++++++++++++++++++----
 1 file changed, 22 insertions(+), 4 deletions(-)

diff --git a/examples/prime_example.ipynb b/examples/prime_example.ipynb
index 9c58732..e5d23b7 100644
--- a/examples/prime_example.ipynb
+++ b/examples/prime_example.ipynb
@@ -60,6 +60,15 @@
     "primepy.count = 4"
    ]
   },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "primepy.prime_message = \"Hello World\""
+   ]
+  },
   {
    "cell_type": "code",
    "execution_count": null,
@@ -67,7 +76,7 @@
    "outputs": [],
    "source": [
     "class PrimeJavaScriptWidget(ipyreact.ReactWidget):\n",
-    "    prime_message = Any(\"Click the Button\").tag(sync=True)    \n",
+    "    prime_message = Any(\"Click the Button\").tag(sync=True)    # <- TODO: this message does not show up because prime_message is overwritten\n",
     "    count = Int(0).tag(sync=True)\n",
     "\n",
     "    _esm = \"\"\"\n",
@@ -82,17 +91,17 @@
     "    return \"Yes 🌐✅✅✅\";\n",
     "    }\n",
     "\n",
-    "    export const MyUpdater = ({ count, on_count, prime_message }) => {\n",
+    "    export const MyUpdater = ({ count, prime_message}) => {\n",
     "    prime_message = isPrimeNumber(count);\n",
     "    return <span> {prime_message} </span>;\n",
     "    };\n",
     "\n",
-    "    export default function ({ on_count, count, prime_message }) {\n",
+    "    export default function ({ on_count, count, prime_message}) {\n",
     "    return (\n",
     "        <div>\n",
     "        <button onClick={() => on_count(count + 1)}>{count} times clicked</button>\n",
     "        <br />\n",
-    "        <MyUpdater count={count} prime_message={prime_message} />\n",
+    "        <MyUpdater count={count} prime_message = {prime_message}/>\n",
     "        </div>\n",
     "    );\n",
     "    }\n",
@@ -118,6 +127,15 @@
    "source": [
     "primejs.count = 4"
    ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "primejs.prime_message = \"Hello World\"   # <- TODO: this message does not show up because it is overwritten by prime_message = isPrimeNumber(count);"
+   ]
   }
  ],
  "metadata": {