From 69312f5133734237edaea6ca29e2de9bf3203050 Mon Sep 17 00:00:00 2001
From: polwex <polwex@sortug.com>
Date: Sun, 15 Jun 2025 01:44:45 +0700
Subject: checkpoint here...

---
 bs5/universal/native/shared/SearchField.re | 40 ++++++++++++++++++++++++++++++
 1 file changed, 40 insertions(+)
 create mode 100644 bs5/universal/native/shared/SearchField.re

(limited to 'bs5/universal/native/shared/SearchField.re')

diff --git a/bs5/universal/native/shared/SearchField.re b/bs5/universal/native/shared/SearchField.re
new file mode 100644
index 0000000..5ab888d
--- /dev/null
+++ b/bs5/universal/native/shared/SearchField.re
@@ -0,0 +1,40 @@
+[@warning "-26-27"];
+
+open Melange_json.Primitives;
+
+[@react.client.component]
+let make = (~searchText: string, ~selectedId: option(int), ~isEditing: bool) => {
+  let {navigate, _}: ClientRouter.t = ClientRouter.useRouter();
+  let (text, setText) = RR.useStateValue(searchText);
+  let (isSearching, startSearching) = React.useTransition();
+
+  let onSubmit = event => {
+    React.Event.Form.preventDefault(event);
+  };
+
+  let%browser_only onChange = event => {
+    let target = React.Event.Form.target(event);
+    let nextText = target##value;
+    setText(nextText);
+    startSearching(() =>
+      navigate({
+        searchText: Some(nextText),
+        selectedId,
+        isEditing,
+      })
+    );
+  };
+
+  <form className="search" role="search" onSubmit>
+    <label className="offscreen mr-4" htmlFor="sidebar-search-input">
+      <Text> "Search for a note by title" </Text>
+    </label>
+    <InputText
+      id="sidebar-search-input"
+      placeholder="Search"
+      value=text
+      onChange
+    />
+    <Spinner active=isSearching />
+  </form>;
+};
-- 
cgit v1.2.3