Add CodeFind feature

src/widgets/CodeView.blp

@@ -4,20 +4,60 @@ using GtkSource 5;
 template $CodeView : Gtk.Widget {
   layout-manager: BinLayout {};
   vexpand: true;
-  ScrolledWindow scrolled_window {
-    vexpand: true;
-    GtkSource.View source_view {
-      buffer: GtkSource.Buffer {};
-      monospace: true;
-      auto-indent: true;
-      highlight-current-line: true;
-      indent-on-tab: true;
-      indent-width: 2;
-      insert-spaces-instead-of-tabs: true;
-      show-line-marks: true;
-      show-line-numbers: true;
-      smart-backspace: true;
-      tab-width: 2;
+  Box {
+    orientation: vertical;
+
+    Overlay overlay {  // Add an Overlay container
+      ScrolledWindow scrolled_window {
+        vexpand: true;
+
+        GtkSource.View source_view {
+          buffer: GtkSource.Buffer {};
+          monospace: true;
+          auto-indent: true;
+          highlight-current-line: true;
+          indent-on-tab: true;
+          indent-width: 2;
+          insert-spaces-instead-of-tabs: true;
+          show-line-marks: true;
+          show-line-numbers: true;
+          smart-backspace: true;
+          tab-width: 2;
+        }
+      }
+      [overlay]
+      Box {
+        halign: end;
+        valign: start;
+        Revealer revealer {
+          Box {
+            orientation: horizontal;
+
+            SearchBar search_bar {
+              show-close-button: true;
+              search-mode-enabled: true;
+
+              Box {
+                SearchEntry search_entry {
+                  placeholder-text: _("Start searching");
+                  search-delay: 300;
+                  margin-end: 18;
+                }
+                Box {
+                  valign: center;
+                  styles ["linked"]
+                  Button previous_match {
+                    icon-name: "up";
+                  }
+                  Button next_match {
+                    icon-name: "down";
+                  }
+                }
+              }
+            }
+          }
+        }
+      }
     }
   }
 }

src/widgets/CodeView.js

@@ -20,6 +20,13 @@ const style_manager = Adw.StyleManager.get_default();
 class CodeView extends Gtk.Widget {
   constructor({ language_id, ...params } = {}) {
     super(params);
+
+    this.previous_match = this._previous_match;
+    this.next_match = this._next_match;
+    this.overlay = this._overlay;
+    this.search_entry = this._search_entry;
+    this.search_bar = this._search_bar;
+    this.revealer = this._revealer;
     this.source_view = this._source_view;
     this.buffer = this._source_view.buffer;
 
@@ -30,6 +37,8 @@ class CodeView extends Gtk.Widget {
       this.#prepareHoverProvider();
       this.#prepareSignals();
       this.#updateStyle();
+      this.revealSearch();
+      this.handleSearch();
     } catch (err) {
       logError(err);
       throw err;
@@ -140,6 +149,62 @@ class CodeView extends Gtk.Widget {
     );
     this.buffer.set_style_scheme(scheme);
   };
+
+  revealSearch() {
+    const controller_key = new Gtk.EventControllerKey();
+    this.source_view.add_controller(controller_key);
+    controller_key.connect(
+      "key-pressed",
+      (controller, keyval, keycode, state) => {
+        if (
+          (state & Gdk.ModifierType.CONTROL_MASK && keyval === Gdk.KEY_f) ||
+          (state & Gdk.ModifierType.CONTROL_MASK && keyval === Gdk.KEY_F)
+        ) {
+          this.revealer.reveal_child = true;
+          this.search_bar.search_mode_enabled = true;
+        }
+      },
+    );
+  }
+
+  handleSearch() {
+    this.search_bar.connect_entry(this.search_entry);
+    const { buffer, source_view } = this;
+    const search_settings = new Source.SearchSettings({
+      case_sensitive: false,
+    });
+
+    const search_context = new Source.SearchContext({
+      buffer,
+      settings: search_settings,
+      highlight: true,
+    });
+
+    function selectSearchOccurence(match_start, match_end) {
+      buffer.select_range(match_start, match_end);
+      source_view.scroll_mark_onscreen(buffer.get_insert());
+    }
+
+    this.search_entry.connect("search-changed", () => {
+      search_settings.search_text = this.search_entry.get_text();
+    });
+
+    this.previous_match.connect("clicked", () => {
+      const [, iter] = buffer.get_selection_bounds();
+      const [found, match_start, match_end] = search_context.backward(iter);
+      if (!found) return;
+      // log(iter.get_offset(), match_start.get_offset(), match_end.get_offset());
+      selectSearchOccurence(match_start, match_end);
+    });
+
+    this.next_match.connect("clicked", () => {
+      const [, , iter] = buffer.get_selection_bounds();
+      const [found, match_start, match_end] = search_context.forward(iter);
+      if (!found) return;
+      // log(iter.get_offset(), match_start.get_offset(), match_end.get_offset());
+      selectSearchOccurence(match_start, match_end);
+    });
+  }
 }
 
 export default registerClass(
@@ -158,7 +223,15 @@ export default registerClass(
     Signals: {
       changed: {},
     },
-    InternalChildren: ["source_view"],
+    InternalChildren: [
+      "source_view",
+      "search_bar",
+      "search_entry",
+      "revealer",
+      "overlay",
+      "previous_match",
+      "next_match",
+    ],
   },
   CodeView,
 );