diff --git a/.gitignore b/.gitignore
index b51cc702..978ddd42 100644
--- a/.gitignore
+++ b/.gitignore
@@ -41,3 +41,6 @@ src/*/*.gresource.xml
 src/*/jsconfig.json
 src/*/rustc-ice-*.txt
 src/*/*.sqlite*
+
+# All JavaScript files
+src/**/*.js
diff --git a/src/About Dialog/main.js b/src/About Dialog/main.ts
similarity index 94%
rename from src/About Dialog/main.js
rename to src/About Dialog/main.ts
index f805d312..74605be8 100644
--- a/src/About Dialog/main.js	
+++ b/src/About Dialog/main.ts	
@@ -2,7 +2,7 @@ import { gettext as _ } from "gettext";
 import Adw from "gi://Adw";
 import Gtk from "gi://Gtk?version=4.0";
 
-const button = workbench.builder.get_object("button");
+const button = workbench.builder.get_object<Gtk.Button>("button");
 
 function openAboutDialog() {
   const dialog = new Adw.AboutDialog({
diff --git a/src/Accessibility/main.js b/src/Accessibility/main.ts
similarity index 94%
rename from src/Accessibility/main.js
rename to src/Accessibility/main.ts
index 21de5466..9a2994dd 100644
--- a/src/Accessibility/main.js
+++ b/src/Accessibility/main.ts
@@ -2,7 +2,7 @@ import GObject from "gi://GObject";
 import Gdk from "gi://Gdk?version=4.0";
 import Gtk from "gi://Gtk?version=4.0";
 
-const button = workbench.builder.get_object("custom_button");
+const button = workbench.builder.get_object<Gtk.Button>("custom_button");
 
 const clicker = new Gtk.GestureClick();
 clicker.connect("released", () => toggleButton(button));
diff --git a/src/Account/main.js b/src/Account/main.ts
similarity index 61%
rename from src/Account/main.js
rename to src/Account/main.ts
index 9c4f7fe2..96cf363d 100644
--- a/src/Account/main.js
+++ b/src/Account/main.ts
@@ -1,5 +1,8 @@
+import Adw from "gi://Adw";
 import Gdk from "gi://Gdk?version=4.0";
 import Gio from "gi://Gio";
+import GLib from "gi://GLib?version=2.0";
+import Gtk from "gi://Gtk?version=4.0";
 import Xdp from "gi://Xdp?version=1.0";
 import XdpGtk from "gi://XdpGtk4";
 
@@ -12,16 +15,22 @@ Gio._promisify(
 const portal = new Xdp.Portal();
 const parent = XdpGtk.parent_new_gtk(workbench.window);
 
-const revealer = workbench.builder.get_object("revealer");
-const button = workbench.builder.get_object("button");
-const avatar = workbench.builder.get_object("avatar");
-const entry = workbench.builder.get_object("entry");
-const username = workbench.builder.get_object("username");
-const display = workbench.builder.get_object("name");
+const revealer = workbench.builder.get_object<Gtk.Revealer>("revealer");
+const button = workbench.builder.get_object<Gtk.Button>("button");
+const avatar = workbench.builder.get_object<Adw.Avatar>("avatar");
+const entry = workbench.builder.get_object<Adw.EntryRow>("entry");
+const username = workbench.builder.get_object<Gtk.Label>("username");
+const display = workbench.builder.get_object<Gtk.Label>("name");
 
 async function onClicked() {
   const reason = entry.get_text();
-  const result = await portal.get_user_information(parent, reason, null, null);
+  // @ts-expect-error this function's isn't detected as `async` yet.
+  const result = await portal.get_user_information(
+    parent,
+    reason,
+    null,
+    null,
+  ) as GLib.Variant;
 
   /*
   result is a GVariant dictionary containing the following fields
diff --git a/src/Action Bar/main.js b/src/Action Bar/main.js
deleted file mode 100644
index 4a17102c..00000000
--- a/src/Action Bar/main.js	
+++ /dev/null
@@ -1,16 +0,0 @@
-const action_bar = workbench.builder.get_object("action_bar");
-const button = workbench.builder.get_object("button");
-const start_widget = workbench.builder.get_object("start_widget");
-const end_widget = workbench.builder.get_object("end_widget");
-
-button.connect("notify::active", () => {
-  action_bar.revealed = !button.active;
-});
-
-start_widget.connect("clicked", () => {
-  console.log("Start widget");
-});
-
-end_widget.connect("clicked", () => {
-  console.log("End widget");
-});
diff --git a/src/Action Bar/main.ts b/src/Action Bar/main.ts
new file mode 100644
index 00000000..cbea5c63
--- /dev/null
+++ b/src/Action Bar/main.ts	
@@ -0,0 +1,18 @@
+import Gtk from "gi://Gtk?version=4.0";
+
+const action_bar = workbench.builder.get_object<Gtk.ActionBar>("action_bar");
+const button = workbench.builder.get_object<Gtk.ToggleButton>("button");
+const start_widget = workbench.builder.get_object<Gtk.Button>("start_widget");
+const end_widget = workbench.builder.get_object<Gtk.Button>("end_widget");
+
+button.connect("notify::active", () => {
+  action_bar.revealed = !button.active;
+});
+
+start_widget.connect("clicked", () => {
+  console.log("Start widget");
+});
+
+end_widget.connect("clicked", () => {
+  console.log("End widget");
+});
diff --git a/src/Actions/main.js b/src/Actions/main.ts
similarity index 89%
rename from src/Actions/main.js
rename to src/Actions/main.ts
index c0ba3b61..9d9b1eaa 100644
--- a/src/Actions/main.js
+++ b/src/Actions/main.ts
@@ -1,7 +1,9 @@
+import Gtk from "gi://Gtk?version=4.0";
+import Adw from "gi://Adw";
 import GLib from "gi://GLib";
 import Gio from "gi://Gio";
 
-const demo = workbench.builder.get_object("demo");
+const demo = workbench.builder.get_object<Adw.StatusPage>("demo");
 
 const demo_group = new Gio.SimpleActionGroup();
 demo.insert_action_group("demo", demo_group);
@@ -55,7 +57,7 @@ scale_action.connect("notify::state", (action) => {
 
 demo_group.add_action(scale_action);
 
-const text = workbench.builder.get_object("text");
+const text = workbench.builder.get_object<Gtk.Label>("text");
 
 const alignment_action = new Gio.PropertyAction({
   name: "text-align",
diff --git a/src/Animation/main.js b/src/Animation/main.ts
similarity index 82%
rename from src/Animation/main.js
rename to src/Animation/main.ts
index 5b53facd..8a9afa96 100644
--- a/src/Animation/main.js
+++ b/src/Animation/main.ts
@@ -1,9 +1,10 @@
 import Adw from "gi://Adw";
 import Graphene from "gi://Graphene";
 import Gsk from "gi://Gsk";
+import Gtk from "gi://Gtk?version=4.0";
 
-const button_timed = workbench.builder.get_object("button_timed");
-const progress_bar = workbench.builder.get_object("progress_bar");
+const button_timed = workbench.builder.get_object<Gtk.Button>("button_timed");
+const progress_bar = workbench.builder.get_object<Gtk.ProgressBar>("progress_bar");
 const target_timed = Adw.PropertyAnimationTarget.new(progress_bar, "fraction");
 
 const animation_timed = new Adw.TimedAnimation({
@@ -23,8 +24,8 @@ animation_timed.connect("done", () => {
   animation_timed.reset();
 });
 
-const button_spring = workbench.builder.get_object("button_spring");
-const ball = workbench.builder.get_object("ball");
+const button_spring = workbench.builder.get_object<Gtk.Button>("button_spring");
+const ball = workbench.builder.get_object<Adw.Bin>("ball");
 
 const target_spring = Adw.CallbackAnimationTarget.new(animation_cb);
 const params = Adw.SpringParams.new(
diff --git a/src/Audio/main.js b/src/Audio/main.ts
similarity index 88%
rename from src/Audio/main.js
rename to src/Audio/main.ts
index 74741806..4f22f869 100644
--- a/src/Audio/main.js
+++ b/src/Audio/main.ts
@@ -1,7 +1,7 @@
 import Gio from "gi://Gio";
 import Gtk from "gi://Gtk?version=4.0";
 
-const controls = workbench.builder.get_object("controls");
+const controls = workbench.builder.get_object<Gtk.MediaControls>("controls");
 
 const buttons = ["sound", "music"];
 const audio_files = {
diff --git a/src/Avatar/main.js b/src/Avatar/main.ts
similarity index 64%
rename from src/Avatar/main.js
rename to src/Avatar/main.ts
index ecaef183..1b2b7bb7 100644
--- a/src/Avatar/main.js
+++ b/src/Avatar/main.ts
@@ -1,11 +1,12 @@
+import Adw from "gi://Adw";
 import Gdk from "gi://Gdk?version=4.0";
 import Gio from "gi://Gio";
 import Gtk from "gi://Gtk?version=4.0";
 
 Gio._promisify(Gtk.FileDialog.prototype, "open", "open_finish");
 
-const avatar_image = workbench.builder.get_object("avatar_image");
-const button = workbench.builder.get_object("button");
+const avatar_image = workbench.builder.get_object<Adw.Avatar>("avatar_image");
+const button = workbench.builder.get_object<Gtk.Button>("button");
 
 const file_filter = new Gtk.FileFilter();
 file_filter.add_pixbuf_formats();
@@ -21,7 +22,8 @@ button.connect("clicked", () => {
 });
 
 async function onClicked() {
-  const file = await file_dialog.open(workbench.window, null);
+  // @ts-expect-error this function's type isn't detected as async yet
+  const file = await file_dialog.open(workbench.window, null) as Gio.File;
   const texture = Gdk.Texture.new_from_file(file);
   avatar_image.set_custom_image(texture);
 }
diff --git a/src/Banner/main.js b/src/Banner/main.ts
similarity index 55%
rename from src/Banner/main.js
rename to src/Banner/main.ts
index 040c318c..c5f64d6d 100644
--- a/src/Banner/main.js
+++ b/src/Banner/main.ts
@@ -1,8 +1,9 @@
 import Adw from "gi://Adw";
+import Gtk from "gi://Gtk?version=4.0";
 
-const banner = workbench.builder.get_object("banner");
-const overlay = workbench.builder.get_object("overlay");
-const button_show_banner = workbench.builder.get_object("button_show_banner");
+const banner = workbench.builder.get_object<Adw.Banner>("banner");
+const overlay = workbench.builder.get_object<Adw.ToastOverlay>("overlay");
+const button_show_banner = workbench.builder.get_object<Gtk.Button>("button_show_banner");
 
 function alert() {
   const toast = new Adw.Toast({
diff --git a/src/Box/main.js b/src/Box/main.ts
similarity index 67%
rename from src/Box/main.js
rename to src/Box/main.ts
index 369c0f3c..1deac9d9 100644
--- a/src/Box/main.js
+++ b/src/Box/main.ts
@@ -1,19 +1,19 @@
 import Gtk from "gi://Gtk?version=4.0";
 
-const interactive_box = workbench.builder.get_object("interactive_box");
-const button_append = workbench.builder.get_object("button_append");
-const button_prepend = workbench.builder.get_object("button_prepend");
-const button_remove = workbench.builder.get_object("button_remove");
+const interactive_box = workbench.builder.get_object<Gtk.Box>("interactive_box");
+const button_append = workbench.builder.get_object<Gtk.Button>("button_append");
+const button_prepend = workbench.builder.get_object<Gtk.Button>("button_prepend");
+const button_remove = workbench.builder.get_object<Gtk.Button>("button_remove");
 let count = 0;
 
 button_append.connect("clicked", append);
 button_prepend.connect("clicked", prepend);
 button_remove.connect("clicked", remove);
 
-const toggle_orientation_horizontal = workbench.builder.get_object(
+const toggle_orientation_horizontal = workbench.builder.get_object<Gtk.ToggleButton>(
   "toggle_orientation_horizontal",
 );
-const toggle_orientation_vertical = workbench.builder.get_object(
+const toggle_orientation_vertical = workbench.builder.get_object<Gtk.ToggleButton>(
   "toggle_orientation_vertical",
 );
 
@@ -27,19 +27,19 @@ toggle_orientation_vertical.connect("toggled", () => {
     interactive_box.orientation = Gtk.Orientation.VERTICAL;
 });
 
-const highlight = workbench.builder.get_object("highlight");
+const highlight = workbench.builder.get_object<Gtk.CheckButton>("highlight");
 highlight.connect("toggled", () => {
   highlight.active
     ? interactive_box.add_css_class("border")
     : interactive_box.remove_css_class("border");
 });
 
-const halign_toggle_fill = workbench.builder.get_object("halign_toggle_fill");
-const halign_toggle_start = workbench.builder.get_object("halign_toggle_start");
-const halign_toggle_center = workbench.builder.get_object(
+const halign_toggle_fill = workbench.builder.get_object<Gtk.ToggleButton>("halign_toggle_fill");
+const halign_toggle_start = workbench.builder.get_object<Gtk.ToggleButton>("halign_toggle_start");
+const halign_toggle_center = workbench.builder.get_object<Gtk.ToggleButton>(
   "halign_toggle_center",
 );
-const halign_toggle_end = workbench.builder.get_object("halign_toggle_end");
+const halign_toggle_end = workbench.builder.get_object<Gtk.ToggleButton>("halign_toggle_end");
 
 halign_toggle_fill.connect("toggled", () => {
   if (halign_toggle_fill.active) interactive_box.halign = Gtk.Align.FILL;
@@ -57,12 +57,12 @@ halign_toggle_end.connect("toggled", () => {
   if (halign_toggle_end.active) interactive_box.halign = Gtk.Align.END;
 });
 
-const valign_toggle_fill = workbench.builder.get_object("valign_toggle_fill");
-const valign_toggle_start = workbench.builder.get_object("valign_toggle_start");
-const valign_toggle_center = workbench.builder.get_object(
+const valign_toggle_fill = workbench.builder.get_object<Gtk.ToggleButton>("valign_toggle_fill");
+const valign_toggle_start = workbench.builder.get_object<Gtk.ToggleButton>("valign_toggle_start");
+const valign_toggle_center = workbench.builder.get_object<Gtk.ToggleButton>(
   "valign_toggle_center",
 );
-const valign_toggle_end = workbench.builder.get_object("valign_toggle_end");
+const valign_toggle_end = workbench.builder.get_object<Gtk.ToggleButton>("valign_toggle_end");
 
 valign_toggle_fill.connect("toggled", () => {
   if (valign_toggle_fill.active) interactive_box.valign = Gtk.Align.FILL;
diff --git a/src/Boxed Lists/main.js b/src/Boxed Lists/main.js
deleted file mode 100644
index 58b95ab9..00000000
--- a/src/Boxed Lists/main.js	
+++ /dev/null
@@ -1,16 +0,0 @@
-import GObject from "gi://GObject";
-import Gtk from "gi://Gtk?version=4.0";
-
-const drop_down = workbench.builder.get_object("drop_down");
-
-drop_down.connect("notify::selected-item", () => {
-  const selected_item = drop_down.selected_item.get_string();
-  console.log(selected_item);
-});
-
-const expression = new Gtk.ClosureExpression(
-  GObject.TYPE_STRING,
-  (obj) => obj.string,
-  null,
-);
-drop_down.expression = expression;
diff --git a/src/Boxed Lists/main.ts b/src/Boxed Lists/main.ts
new file mode 100644
index 00000000..6b384dc1
--- /dev/null
+++ b/src/Boxed Lists/main.ts	
@@ -0,0 +1,18 @@
+import Adw from "gi://Adw";
+import GObject from "gi://GObject";
+import Gtk from "gi://Gtk?version=4.0";
+
+const drop_down = workbench.builder.get_object<Adw.ComboRow>("drop_down");
+
+drop_down.connect("notify::selected-item", () => {
+  const selected_item = drop_down.selected_item as Gtk.StringObject;
+  const selected_string = selected_item.get_string();
+  console.log(selected_string);
+});
+
+const expression = Gtk.ClosureExpression.new(
+  GObject.TYPE_STRING,
+  (obj) => obj.string,
+  null,
+);
+drop_down.expression = expression;
diff --git a/src/Breakpoints/main.js b/src/Breakpoints/main.ts
similarity index 59%
rename from src/Breakpoints/main.js
rename to src/Breakpoints/main.ts
index 2935f098..ad3fc518 100644
--- a/src/Breakpoints/main.js
+++ b/src/Breakpoints/main.ts
@@ -1,4 +1,6 @@
-const breakpoint = workbench.builder.get_object("breakpoint");
+import Adw from "gi://Adw";
+
+const breakpoint = workbench.builder.get_object<Adw.Breakpoint>("breakpoint");
 
 breakpoint.connect("apply", () => {
   console.log("Breakpoint Applied");
diff --git a/src/Button Row/main.js b/src/Button Row/main.ts
similarity index 100%
rename from src/Button Row/main.js
rename to src/Button Row/main.ts
diff --git a/src/Button/main.js b/src/Button/main.ts
similarity index 76%
rename from src/Button/main.js
rename to src/Button/main.ts
index 5909b440..214f44c6 100644
--- a/src/Button/main.js
+++ b/src/Button/main.ts
@@ -1,3 +1,5 @@
+import Gtk from "gi://Gtk?version=4.0";
+
 const button_ids = [
   "regular",
   "flat",
@@ -13,7 +15,7 @@ const button_ids = [
 ];
 
 for (const id of button_ids) {
-  const button = workbench.builder.get_object(id);
+  const button = workbench.builder.get_object<Gtk.Button>(id);
   button.connect("clicked", onClicked);
 }
 
diff --git a/src/CSS Gradients/main.js b/src/CSS Gradients/main.ts
similarity index 81%
rename from src/CSS Gradients/main.js
rename to src/CSS Gradients/main.ts
index 43421edb..ce888198 100644
--- a/src/CSS Gradients/main.js	
+++ b/src/CSS Gradients/main.ts	
@@ -5,15 +5,25 @@ import GtkSource from "gi://GtkSource";
 
 let css_provider;
 
-const combo_row_gradient_type = workbench.builder.get_object(
+const combo_row_gradient_type = workbench.builder.get_object<Adw.ComboRow>(
   "combo_row_gradient_type",
 );
-const spin_row_angle = workbench.builder.get_object("spin_row_angle");
-const button_color_1 = workbench.builder.get_object("button_color_1");
-const button_color_2 = workbench.builder.get_object("button_color_2");
-const button_color_3 = workbench.builder.get_object("button_color_3");
-const gtksource_buffer = workbench.builder.get_object("gtksource_buffer");
-const button_copy_css = workbench.builder.get_object("button_copy_css");
+const spin_row_angle = workbench.builder.get_object<Adw.SpinRow>(
+  "spin_row_angle",
+);
+const button_color_1 = workbench.builder.get_object<Gtk.ColorDialogButton>(
+  "button_color_1",
+);
+const button_color_2 = workbench.builder.get_object<Gtk.ColorDialogButton>(
+  "button_color_2",
+);
+const button_color_3 = workbench.builder.get_object<Gtk.ColorDialogButton>(
+  "button_color_3",
+);
+const gtksource_buffer = workbench.builder.get_object<GtkSource.Buffer>(
+  "gtksource_buffer",
+);
+const button_copy_css = workbench.builder.get_object<Gtk.Button>("button_copy_css");
 
 combo_row_gradient_type.connect("notify::selected", update);
 spin_row_angle.connect("notify::value", update);
diff --git a/src/Calendar/main.js b/src/Calendar/main.ts
similarity index 81%
rename from src/Calendar/main.js
rename to src/Calendar/main.ts
index e2cf20e3..7d0dceda 100644
--- a/src/Calendar/main.js
+++ b/src/Calendar/main.ts
@@ -1,4 +1,6 @@
-const calendar = workbench.builder.get_object("calendar");
+import Gtk from "gi://Gtk?version=4.0"
+
+const calendar = workbench.builder.get_object<Gtk.Calendar>("calendar");
 
 // calendar.get_date() returns a GLib.DateTime object
 // https://docs.gtk.org/glib/struct.DateTime.html
diff --git a/src/Camera/main.js b/src/Camera/main.ts
similarity index 74%
rename from src/Camera/main.js
rename to src/Camera/main.ts
index b1ad7d33..58089484 100644
--- a/src/Camera/main.js
+++ b/src/Camera/main.ts
@@ -1,16 +1,35 @@
+import Gdk from "gi://Gdk?version=4.0";
 import Gio from "gi://Gio";
+import Gsk from "gi://Gsk?version=4.0";
 import Gst from "gi://Gst";
+import GstVideo from "gi://GstVideo";
+import Gtk from "gi://Gtk?version=4.0";
 import Xdp from "gi://Xdp";
 import XdpGtk from "gi://XdpGtk4";
 
+interface GstGtk4Paintable extends Gdk.Paintable {
+  background_color: number;
+  force_aspect_ratio: number;
+  gl_context?: Gdk.GLContext;
+  orientation: number;
+  scaling_filter: Gsk.ScalingFilter;
+  use_scaling_filter: number;
+}
+
+interface GstGtk4PaintableSink extends GstVideo.VideoSink {
+  paintable: GstGtk4Paintable;
+  window_height: number;
+  window_width: number;
+}
+
 Gst.init(null);
 Gio._promisify(Xdp.Portal.prototype, "access_camera", "access_camera_finish");
 
 const portal = new Xdp.Portal();
 const parent = XdpGtk.parent_new_gtk(workbench.window);
 
-const output = workbench.builder.get_object("output");
-const button = workbench.builder.get_object("button");
+const output = workbench.builder.get_object<Gtk.Picture>("output");
+const button = workbench.builder.get_object<Gtk.Button>("button");
 
 button.connect("clicked", () => {
   accessCamera().catch(console.error);
@@ -22,11 +41,12 @@ async function accessCamera() {
     return;
   }
 
+  // @ts-expect-error an undetected async function
   const success = await portal.access_camera(
     parent,
     Xdp.CameraFlags.NONE,
     null,
-  );
+  ) as boolean;
 
   if (!success) {
     console.log("Permission denied");
@@ -49,7 +69,7 @@ async function handleCamera() {
   const paintable_sink = Gst.ElementFactory.make(
     "gtk4paintablesink",
     "paintable_sink",
-  );
+  ) as GstGtk4PaintableSink;
   const glsinkbin = Gst.ElementFactory.make("glsinkbin", "glsinkbin");
 
   // Set up and Link Pipeline
@@ -62,8 +82,7 @@ async function handleCamera() {
   source.link(queue);
   queue.link(glsinkbin);
 
-  const paintable = paintable_sink.get_property("paintable");
-  output.paintable = paintable;
+  output.paintable = paintable_sink.paintable;
 
   // Start the pipeline
   pipeline.set_state(Gst.State.PLAYING);
diff --git a/src/Carousel/main.js b/src/Carousel/main.ts
similarity index 77%
rename from src/Carousel/main.js
rename to src/Carousel/main.ts
index e1e18643..264c666b 100644
--- a/src/Carousel/main.js
+++ b/src/Carousel/main.ts
@@ -1,12 +1,12 @@
 import Adw from "gi://Adw";
 import Gtk from "gi://Gtk?version=4.0";
 
-const root_box = workbench.builder.get_object("root_box");
-const carousel = workbench.builder.get_object("carousel");
-const ls_switch = workbench.builder.get_object("ls_switch");
-const sw_switch = workbench.builder.get_object("sw_switch");
-const indicator_row = workbench.builder.get_object("indicator_row");
-const orientation_row = workbench.builder.get_object("orientation_row");
+const root_box = workbench.builder.get_object<Gtk.Box>("root_box");
+const carousel = workbench.builder.get_object<Adw.Carousel>("carousel");
+const ls_switch = workbench.builder.get_object<Adw.SwitchRow>("ls_switch");
+const sw_switch = workbench.builder.get_object<Adw.SwitchRow>("sw_switch");
+const indicator_row = workbench.builder.get_object<Adw.ComboRow>("indicator_row");
+const orientation_row = workbench.builder.get_object<Adw.ComboRow>("orientation_row");
 let indicators;
 
 carousel.connect("page-changed", () => {
diff --git a/src/Checkboxes/main.js b/src/Checkboxes/main.ts
similarity index 61%
rename from src/Checkboxes/main.js
rename to src/Checkboxes/main.ts
index c61d8224..0b9adede 100644
--- a/src/Checkboxes/main.js
+++ b/src/Checkboxes/main.ts
@@ -1,5 +1,7 @@
-const checkbox_1 = workbench.builder.get_object("checkbox_1");
-const checkbox_2 = workbench.builder.get_object("checkbox_2");
+import Gtk from "gi://Gtk?version=4.0";
+
+const checkbox_1 = workbench.builder.get_object<Gtk.CheckButton>("checkbox_1");
+const checkbox_2 = workbench.builder.get_object<Gtk.CheckButton>("checkbox_2");
 
 checkbox_1.connect("toggled", () => {
   if (checkbox_1.active) console.log("Notifications Enabled");
diff --git a/src/Clamp/main.js b/src/Clamp/main.ts
similarity index 70%
rename from src/Clamp/main.js
rename to src/Clamp/main.ts
index 7e4fea10..79bbb867 100644
--- a/src/Clamp/main.js
+++ b/src/Clamp/main.ts
@@ -1,6 +1,9 @@
-const button_increase = workbench.builder.get_object("button_increase");
-const button_decrease = workbench.builder.get_object("button_decrease");
-const clamp = workbench.builder.get_object("clamp");
+import Gtk from "gi://Gtk?version=4.0";
+import Adw1 from "gi://Adw";
+
+const button_increase = workbench.builder.get_object<Gtk.Button>("button_increase");
+const button_decrease = workbench.builder.get_object<Gtk.Button>("button_decrease");
+const clamp = workbench.builder.get_object<Adw1.Clamp>("clamp");
 
 function increase() {
   const current_size = clamp.get_maximum_size();
diff --git a/src/Color Dialog/main.js b/src/Color Dialog/main.ts
similarity index 72%
rename from src/Color Dialog/main.js
rename to src/Color Dialog/main.ts
index 69e8c4e5..23168bb0 100644
--- a/src/Color Dialog/main.js	
+++ b/src/Color Dialog/main.ts	
@@ -4,8 +4,10 @@ import Gtk from "gi://Gtk?version=4.0";
 
 Gio._promisify(Gtk.ColorDialog.prototype, "choose_rgba", "choose_rgba_finish");
 
-const color_dialog_button = workbench.builder.get_object("color_dialog_button");
-const custom_button = workbench.builder.get_object("custom_button");
+const color_dialog_button = workbench.builder.get_object<Gtk.ColorDialogButton>(
+  "color_dialog_button",
+);
+const custom_button = workbench.builder.get_object<Gtk.Button>("custom_button");
 
 const color = new Gdk.RGBA();
 color.parse("red");
@@ -36,6 +38,11 @@ custom_button.connect("clicked", () => {
 });
 
 async function onClicked() {
-  const color = await dialog_custom.choose_rgba(workbench.window, null, null);
+  // @ts-expect-error undetected async function
+  const color = await dialog_custom.choose_rgba(
+    workbench.window,
+    null,
+    null,
+  ) as Gdk.RGBA;
   console.log(`Custom Button: The color selected is ${color.to_string()}`);
 }
diff --git a/src/Color Picker/main.js b/src/Color Picker/main.ts
similarity index 66%
rename from src/Color Picker/main.js
rename to src/Color Picker/main.ts
index 96ae4caf..b60bcc2e 100644
--- a/src/Color Picker/main.js	
+++ b/src/Color Picker/main.ts	
@@ -1,18 +1,21 @@
 import Gdk from "gi://Gdk?version=4.0";
 import Gio from "gi://Gio";
+import GLib from "gi://GLib";
 import Xdp from "gi://Xdp";
 import XdpGtk from "gi://XdpGtk4";
+import Gtk from "gi://Gtk?version=4.0";
 
 Gio._promisify(Xdp.Portal.prototype, "pick_color", "pick_color_finish");
 
 const portal = new Xdp.Portal();
 const parent = XdpGtk.parent_new_gtk(workbench.window);
-const button = workbench.builder.get_object("button");
+const button = workbench.builder.get_object<Gtk.Button>("button");
 
 async function onClicked() {
   // result is a GVariant of the form (ddd), containing red, green and blue components in the range [0,1]
-  const result = await portal.pick_color(parent, null);
-  const [r, g, b] = result.deepUnpack();
+  // @ts-expect-error undetected async function
+  const result = await portal.pick_color(parent, null) as GLib.Variant<"(ddd)">;
+  const [r, g, b] = result.deepUnpack<number[]>();
 
   const color = new Gdk.RGBA({ red: r, green: g, blue: b, alpha: 1.0 });
   console.log(`Selected color is: ${color.to_string()}`);
diff --git a/src/Column View/main.js b/src/Column View/main.ts
similarity index 77%
rename from src/Column View/main.js
rename to src/Column View/main.ts
index 94516201..d2e4ff08 100644
--- a/src/Column View/main.js	
+++ b/src/Column View/main.ts	
@@ -2,10 +2,16 @@ import GObject from "gi://GObject";
 import Gio from "gi://Gio";
 import Gtk from "gi://Gtk?version=4.0";
 
-const column_view = workbench.builder.get_object("column_view");
-const col1 = workbench.builder.get_object("col1");
-const col2 = workbench.builder.get_object("col2");
-const col3 = workbench.builder.get_object("col3");
+const column_view = workbench.builder.get_object<Gtk.ColumnView>("column_view");
+const col1 = workbench.builder.get_object<Gtk.ColumnViewColumn>("col1");
+const col2 = workbench.builder.get_object<Gtk.ColumnViewColumn>("col2");
+const col3 = workbench.builder.get_object<Gtk.ColumnViewColumn>("col3");
+
+interface BookConstructorProps {
+  title: string;
+  author: string;
+  year: number;
+}
 
 // Define our class for our custom model
 const Book = GObject.registerClass(
@@ -36,11 +42,16 @@ const Book = GObject.registerClass(
       ),
     },
   },
-  class Book extends GObject.Object {},
+  class Book extends GObject.Object {
+    constructor(props?: Partial<BookConstructorProps>) {
+      // @ts-expect-error incorrect types: https://github.com/gjsify/ts-for-gir/issues/191
+      super(props);
+    }
+  },
 );
 
 // Create the model
-const data_model = new Gio.ListStore({ item_type: Book });
+const data_model = new Gio.ListStore({ item_type: Book.$gtype });
 data_model.splice(0, 0, [
   new Book({
     title: "Winds from Afar",
@@ -85,15 +96,15 @@ data_model.splice(0, 0, [
 ]);
 
 col1.sorter = new Gtk.StringSorter({
-  expression: Gtk.PropertyExpression.new(Book, null, "title"),
+  expression: Gtk.PropertyExpression.new(Book.$gtype, null, "title"),
 });
 
 col2.sorter = new Gtk.StringSorter({
-  expression: Gtk.PropertyExpression.new(Book, null, "author"),
+  expression: Gtk.PropertyExpression.new(Book.$gtype, null, "author"),
 });
 
 col3.sorter = new Gtk.NumericSorter({
-  expression: Gtk.PropertyExpression.new(Book, null, "year"),
+  expression: Gtk.PropertyExpression.new(Book.$gtype, null, "year"),
 });
 
 // View
diff --git a/src/Context Menu/main.js b/src/Context Menu/main.ts
similarity index 63%
rename from src/Context Menu/main.js
rename to src/Context Menu/main.ts
index a60a8400..92d896fc 100644
--- a/src/Context Menu/main.js	
+++ b/src/Context Menu/main.ts	
@@ -1,11 +1,16 @@
 import GLib from "gi://GLib";
 import Gdk from "gi://Gdk?version=4.0";
 import Gio from "gi://Gio";
+import Gtk from "gi://Gtk?version=4.0";
 
-const box_menu_parent = workbench.builder.get_object("box_menu_parent");
-const label_emoji = workbench.builder.get_object("label_emoji");
-const gesture_click = workbench.builder.get_object("gesture_click");
-const popover_menu = workbench.builder.get_object("popover_menu");
+const box_menu_parent = workbench.builder.get_object<Gtk.Box>(
+  "box_menu_parent",
+);
+const label_emoji = workbench.builder.get_object<Gtk.Label>("label_emoji");
+const gesture_click = workbench.builder.get_object<Gtk.GestureClick>("gesture_click");
+const popover_menu = workbench.builder.get_object<Gtk.PopoverMenu>(
+  "popover_menu",
+);
 
 gesture_click.connect("pressed", (_self, _n_press, x, y) => {
   const position = new Gdk.Rectangle({ x: x, y: y });
diff --git a/src/Custom Widget/main.js b/src/Custom Widget/main.ts
similarity index 100%
rename from src/Custom Widget/main.js
rename to src/Custom Widget/main.ts
diff --git a/src/Database/main.js b/src/Database/main.ts
similarity index 63%
rename from src/Database/main.js
rename to src/Database/main.ts
index a849bfdd..64d74fb0 100644
--- a/src/Database/main.js
+++ b/src/Database/main.ts
@@ -16,38 +16,54 @@ Gio._promisify(Gom.Repository.prototype, "find_async", "find_finish");
 Gio._promisify(Gom.Resource.prototype, "save_async", "save_finish");
 Gio._promisify(Gom.ResourceGroup.prototype, "fetch_async", "fetch_finish");
 
-const text_entry = workbench.builder.get_object("text_entry");
-const insert_button = workbench.builder.get_object("insert_button");
-const search_entry = workbench.builder.get_object("search_entry");
-const column_view = workbench.builder.get_object("column_view");
-const column_text = workbench.builder.get_object("column_text");
-const column_id = workbench.builder.get_object("column_id");
-
-const ItemClass = GObject.registerClass(
-  {
-    Properties: {
-      id: GObject.ParamSpec.int(
-        "id",
-        "ID",
-        "An ID",
-        GObject.ParamFlags.READWRITE | GObject.ParamFlags.CONSTRUCT,
-        0,
-        GLib.MAXINT32,
-        0,
-      ),
-      text: GObject.ParamSpec.string(
-        "text",
-        "Text",
-        "Some Text",
-        GObject.ParamFlags.READWRITE | GObject.ParamFlags.CONSTRUCT,
-        "",
-      ),
-    },
-  },
-  class ItemClass extends Gom.Resource {},
+const text_entry = workbench.builder.get_object<Gtk.Entry>("text_entry");
+const insert_button = workbench.builder.get_object<Gtk.Button>("insert_button");
+const search_entry = workbench.builder.get_object<Gtk.SearchEntry>(
+  "search_entry",
 );
+const column_view = workbench.builder.get_object<Gtk.ColumnView>("column_view");
+const column_text = workbench.builder.get_object<Gtk.ColumnViewColumn>(
+  "column_text",
+);
+const column_id = workbench.builder.get_object<Gtk.ColumnViewColumn>(
+  "column_id",
+);
+
+interface ItemClassConstructorProps extends Gom.Resource.ConstructorProps {
+  id: number;
+  text: string;
+}
+
+class ItemClass extends Gom.Resource {
+  constructor(props?: Partial<ItemClassConstructorProps>) {
+    super(props);
+  }
+
+  static {
+    GObject.registerClass({
+      Properties: {
+        id: GObject.ParamSpec.int(
+          "id",
+          "ID",
+          "An ID",
+          GObject.ParamFlags.READWRITE | GObject.ParamFlags.CONSTRUCT,
+          0,
+          GLib.MAXINT32,
+          0,
+        ),
+        text: GObject.ParamSpec.string(
+          "text",
+          "Text",
+          "Some Text",
+          GObject.ParamFlags.READWRITE | GObject.ParamFlags.CONSTRUCT,
+          "",
+        ),
+      },
+    }, this);
+  }
+}
 
-const data_model = new Gio.ListStore({ item_type: ItemClass });
+const data_model = new Gio.ListStore({ item_type: ItemClass.$gtype });
 let adapter;
 let repository;
 
@@ -67,7 +83,8 @@ async function initDatabase() {
 async function onInsert() {
   const text = text_entry.text;
   const item = new ItemClass({ repository, text });
-  const success = await item.save_async();
+  // @ts-expect-error this function has not been detected as async
+  const success = await item.save_async() as boolean;
   if (!success) {
     console.error("Failed to insert");
     return;
@@ -81,7 +98,7 @@ async function load() {
 
   data_model.remove_all();
   // Create a filter for Text matching
-  const filter = Gom.Filter.new_glob(ItemClass, "text", `*${text}*`);
+  const filter = Gom.Filter.new_glob(ItemClass.$gtype, "text", `*${text}*`);
   const resource_group = await repository.find_async(ItemClass, filter);
 
   await resource_group.fetch_async(0, resource_group.count);
diff --git a/src/Dialog/main.js b/src/Dialog/main.ts
similarity index 56%
rename from src/Dialog/main.js
rename to src/Dialog/main.ts
index 5449e542..7002f507 100644
--- a/src/Dialog/main.js
+++ b/src/Dialog/main.ts
@@ -1,8 +1,10 @@
+import Adw from "gi://Adw";
 import Gio from "gi://Gio";
+import Gtk from "gi://Gtk?version=4.0";
 
-const dialog = workbench.builder.get_object("dialog");
-const button = workbench.builder.get_object("button");
-const image = workbench.builder.get_object("image");
+const dialog = workbench.builder.get_object<Adw.Dialog>("dialog");
+const button = workbench.builder.get_object<Gtk.Button>("button");
+const image = workbench.builder.get_object<Gtk.Image>("image");
 
 image.file = Gio.File.new_for_uri(workbench.resolve("image.svg")).get_path();
 
diff --git a/src/Drag and Drop/main.js b/src/Drag and Drop/main.ts
similarity index 82%
rename from src/Drag and Drop/main.js
rename to src/Drag and Drop/main.ts
index 5d29c95c..d0b52641 100644
--- a/src/Drag and Drop/main.js	
+++ b/src/Drag and Drop/main.ts	
@@ -3,13 +3,16 @@ import GObject from "gi://GObject";
 import Gdk from "gi://Gdk?version=4.0";
 import Gtk from "gi://Gtk?version=4.0";
 
-const list = workbench.builder.get_object("list");
-const drop_target = Gtk.DropTarget.new(Gtk.ListBoxRow, Gdk.DragAction.MOVE);
+const list = workbench.builder.get_object<Gtk.ListBox>("list");
+const drop_target = Gtk.DropTarget.new(Gtk.ListBoxRow.$gtype, Gdk.DragAction.MOVE);
 
 list.add_controller(drop_target);
 
 // Iterate over ListBox children
-for (const row of list) {
+// @ts-expect-error Gtk.ListBox is iterable
+// See: https://github.com/gjsify/ts-for-gir/issues/193
+for (const object of list) {
+  const row = object as Adw.ActionRow;
   let drag_x;
   let drag_y;
 
@@ -28,7 +31,7 @@ for (const row of list) {
     drag_y = y;
 
     const value = new GObject.Value();
-    value.init(Gtk.ListBoxRow);
+    value.init(Gtk.ListBoxRow.$gtype);
     value.set_object(row);
 
     return Gdk.ContentProvider.new_for_value(value);
@@ -68,7 +71,7 @@ for (const row of list) {
 }
 
 // Drop Handling
-drop_target.connect("drop", (_drop, value, _x, y) => {
+drop_target.connect("drop", (_drop, value: Gtk.Widget, _x, y) => {
   const target_row = list.get_row_at_y(y);
   const target_index = target_row.get_index();
 
diff --git a/src/Drawing Area/main.js b/src/Drawing Area/main.ts
similarity index 52%
rename from src/Drawing Area/main.js
rename to src/Drawing Area/main.ts
index 329f614a..a24c67a2 100644
--- a/src/Drawing Area/main.js	
+++ b/src/Drawing Area/main.ts	
@@ -1,5 +1,10 @@
-const drawingArea = workbench.builder.get_object("drawing_area");
-const scaleRotate = workbench.builder.get_object("scale");
+import Gtk from "gi://Gtk?version=4.0";
+import cairo from "cairo";
+
+const drawingArea = workbench.builder.get_object<Gtk.DrawingArea>(
+  "drawing_area",
+);
+const scaleRotate = workbench.builder.get_object<Gtk.Scale>("scale");
 
 const triangle = [
   [100, 100],
@@ -8,7 +13,9 @@ const triangle = [
 ];
 var angle = 0;
 
-drawingArea.set_draw_func((_self, cr, _width, _height) => {
+// TS: the `cairo.Context` type is broken here
+// See: https://github.com/gjsify/ts-for-gir/issues/194
+drawingArea.set_draw_func((_self, cr: cairo.Context, _width, _height) => {
   // Draw triangle in context
   cr.translate(150, 150);
   cr.rotate(angle);
@@ -20,6 +27,9 @@ drawingArea.set_draw_func((_self, cr, _width, _height) => {
   cr.setSourceRGBA(1, 0, 1, 1);
   cr.stroke();
   // Freeing the context before returning from the callback
+
+  // @ts-expect-error this function is not exposed
+  // See: https://github.com/gjsify/ts-for-gir/issues/194
   cr.$dispose();
 });
 
diff --git a/src/Drop Down/main.js b/src/Drop Down/main.ts
similarity index 52%
rename from src/Drop Down/main.js
rename to src/Drop Down/main.ts
index ca965452..cd129dc3 100644
--- a/src/Drop Down/main.js	
+++ b/src/Drop Down/main.ts	
@@ -2,15 +2,16 @@ import GObject from "gi://GObject";
 import Gio from "gi://Gio";
 import Gtk from "gi://Gtk?version=4.0";
 
-const drop_down = workbench.builder.get_object("drop_down");
-const advanced_drop_down = workbench.builder.get_object("advanced_drop_down");
+const drop_down = workbench.builder.get_object<Gtk.DropDown>("drop_down");
+const advanced_drop_down = workbench.builder.get_object<Gtk.DropDown>("advanced_drop_down");
 
 drop_down.connect("notify::selected-item", () => {
-  const selected_item = drop_down.selected_item.get_string();
-  console.log(selected_item);
+  const selected_item = drop_down.selected_item as Gtk.StringObject;
+  const selected_string = selected_item.get_string();
+  console.log(selected_string);
 });
 
-const expression = new Gtk.ClosureExpression(
+const expression = Gtk.ClosureExpression.new(
   GObject.TYPE_STRING,
   (obj) => obj.string,
   null,
@@ -18,29 +19,46 @@ const expression = new Gtk.ClosureExpression(
 
 drop_down.expression = expression;
 
-const KeyValuePair = GObject.registerClass(
-  {
-    Properties: {
-      key: GObject.ParamSpec.string(
-        "key",
-        null,
-        null,
-        GObject.ParamFlags.READWRITE,
-        "",
-      ),
-      value: GObject.ParamSpec.string(
-        "value",
-        "Value",
-        "Value",
-        GObject.ParamFlags.READWRITE,
-        "",
-      ),
-    },
-  },
-  class KeyValuePair extends GObject.Object {},
-);
+interface KeyValuePairConstructorProps {
+  key: string;
+  value: string;
+}
+
+class KeyValuePair extends GObject.Object {
+  static {
+    GObject.registerClass(
+      {
+        Properties: {
+          key: GObject.ParamSpec.string(
+            "key",
+            null,
+            null,
+            GObject.ParamFlags.READWRITE,
+            "",
+          ),
+          value: GObject.ParamSpec.string(
+            "value",
+            "Value",
+            "Value",
+            GObject.ParamFlags.READWRITE,
+            "",
+          ),
+        },
+      },
+      this,
+    );
+  }
+
+  key!: string;
+  value!: string;
+
+  constructor(props?: Partial<KeyValuePairConstructorProps>) {
+    // @ts-expect-error incorrect types see https://github.com/gjsify/ts-for-gir/issues/191
+    super(props);
+  }
+}
 
-const model = new Gio.ListStore({ item_type: KeyValuePair });
+const model = new Gio.ListStore({ item_type: KeyValuePair.$gtype });
 
 model.splice(0, 0, [
   new KeyValuePair({ key: "lion", value: "Lion" }),
@@ -61,7 +79,7 @@ model.splice(0, 0, [
 ]);
 
 const list_store_expression = Gtk.PropertyExpression.new(
-  KeyValuePair,
+  KeyValuePair.$gtype,
   null,
   "value",
 );
@@ -70,7 +88,7 @@ advanced_drop_down.expression = list_store_expression;
 advanced_drop_down.model = model;
 
 advanced_drop_down.connect("notify::selected-item", () => {
-  const selected_item = advanced_drop_down.selected_item;
+  const selected_item = advanced_drop_down.selected_item as KeyValuePair;
   if (selected_item) {
     console.log(selected_item.key);
   }
diff --git a/src/Drop Zone/main.js b/src/Drop Zone/main.ts
similarity index 90%
rename from src/Drop Zone/main.js
rename to src/Drop Zone/main.ts
index 6cb1f202..0c646b56 100644
--- a/src/Drop Zone/main.js	
+++ b/src/Drop Zone/main.ts	
@@ -1,9 +1,10 @@
+import Adw from "gi://Adw";
 import GObject from "gi://GObject";
 import Gdk from "gi://Gdk?version=4.0";
 import Gio from "gi://Gio";
 import Gtk from "gi://Gtk?version=4.0";
 
-const bin = workbench.builder.get_object("bin");
+const bin = workbench.builder.get_object<Adw.Bin>("bin");
 
 // Universal drop target for any String data
 const string_drop_target = Gtk.DropTarget.new(
@@ -19,7 +20,7 @@ string_drop_target.connect("drop", (_self, value, _x, _y) => {
 });
 
 // Drop Target for Files
-const file_drop_target = Gtk.DropTarget.new(Gio.File, Gdk.DragAction.COPY);
+const file_drop_target = Gtk.DropTarget.new(Gio.File.$gtype, Gdk.DragAction.COPY);
 bin.add_controller(file_drop_target);
 file_drop_target.connect("drop", (_self, value, _x, _y) => {
   try {
@@ -31,7 +32,8 @@ file_drop_target.connect("drop", (_self, value, _x, _y) => {
 });
 
 function onDrop(value) {
-  if (!(value instanceof Gio.File)) return false;
+  // @ts-expect-error https://github.com/gjsify/ts-for-gir/issues/195
+  if (!(value instanceof Gio.File)) return null;
 
   const file_info = value.query_info("standard::content-type", 0, null);
   const content_type = file_info.get_content_type();
diff --git a/src/Email/main.js b/src/Email/main.ts
similarity index 78%
rename from src/Email/main.js
rename to src/Email/main.ts
index 17eedf0d..27fb00b7 100644
--- a/src/Email/main.js
+++ b/src/Email/main.ts
@@ -1,4 +1,5 @@
 import Gio from "gi://Gio";
+import Gtk from "gi://Gtk?version=4.0";
 import Xdp from "gi://Xdp";
 import XdpGtk from "gi://XdpGtk4";
 
@@ -7,12 +8,13 @@ Gio._promisify(Xdp.Portal.prototype, "compose_email", "compose_email_finish");
 const portal = new Xdp.Portal();
 const parent = XdpGtk.parent_new_gtk(workbench.window);
 
-const button = workbench.builder.get_object("button");
-const entry = workbench.builder.get_object("entry");
+const button = workbench.builder.get_object<Gtk.Button>("button");
+const entry = workbench.builder.get_object<Gtk.Entry>("entry");
 
 async function onClicked() {
   const email_address = entry.get_text();
 
+  // @ts-expect-error undetected async
   const success = await portal.compose_email(
     parent,
     [email_address], // addresses
@@ -23,7 +25,7 @@ async function onClicked() {
     null, // attachments
     Xdp.EmailFlags.NONE, // flags
     null, // cancellable
-  );
+  ) as boolean;
 
   if (success) {
     console.log("Success");
diff --git a/src/Emoji Chooser/main.js b/src/Emoji Chooser/main.js
deleted file mode 100644
index 943185ef..00000000
--- a/src/Emoji Chooser/main.js	
+++ /dev/null
@@ -1,6 +0,0 @@
-const emoji_chooser = workbench.builder.get_object("emoji_chooser");
-const button = workbench.builder.get_object("button");
-
-emoji_chooser.connect("emoji-picked", (_self, emoji) => {
-  button.label = emoji;
-});
diff --git a/src/Emoji Chooser/main.ts b/src/Emoji Chooser/main.ts
new file mode 100644
index 00000000..5549e61a
--- /dev/null
+++ b/src/Emoji Chooser/main.ts	
@@ -0,0 +1,8 @@
+import Gtk from "gi://Gtk?version=4.0";
+
+const emoji_chooser = workbench.builder.get_object<Gtk.EmojiChooser>("emoji_chooser");
+const button = workbench.builder.get_object<Gtk.Button>("button");
+
+emoji_chooser.connect("emoji-picked", (_self, emoji) => {
+  button.label = emoji;
+});
diff --git a/src/Event Controllers/main.js b/src/Event Controllers/main.ts
similarity index 80%
rename from src/Event Controllers/main.js
rename to src/Event Controllers/main.ts
index 1f5c4a9c..7fc3cb52 100644
--- a/src/Event Controllers/main.js	
+++ b/src/Event Controllers/main.ts	
@@ -4,13 +4,21 @@ import Gio from "gi://Gio";
 import Gtk from "gi://Gtk?version=4.0";
 
 const window = workbench.window;
-const ctrl_button = workbench.builder.get_object("ctrl_button");
-const stack = workbench.builder.get_object("stack");
-const stack_picture_1 = workbench.builder.get_object("stack_picture_1");
-const stack_picture_2 = workbench.builder.get_object("stack_picture_2");
-const primary_button = workbench.builder.get_object("primary_button");
-const middle_button = workbench.builder.get_object("middle_button");
-const secondary_button = workbench.builder.get_object("secondary_button");
+const ctrl_button = workbench.builder.get_object<Gtk.Button>("ctrl_button");
+const stack = workbench.builder.get_object<Gtk.Stack>("stack");
+const stack_picture_1 = workbench.builder.get_object<Gtk.Picture>(
+  "stack_picture_1",
+);
+const stack_picture_2 = workbench.builder.get_object<Gtk.Picture>(
+  "stack_picture_2",
+);
+const primary_button = workbench.builder.get_object<Gtk.Button>(
+  "primary_button",
+);
+const middle_button = workbench.builder.get_object<Gtk.Button>("middle_button");
+const secondary_button = workbench.builder.get_object<Gtk.Button>(
+  "secondary_button",
+);
 
 stack_picture_1.file = Gio.File.new_for_uri(workbench.resolve("image1.png"));
 stack_picture_2.file = Gio.File.new_for_uri(workbench.resolve("image2.png"));
diff --git a/src/File Monitor/main.js b/src/File Monitor/main.ts
similarity index 73%
rename from src/File Monitor/main.js
rename to src/File Monitor/main.ts
index 05e2fca4..614be951 100644
--- a/src/File Monitor/main.js	
+++ b/src/File Monitor/main.ts	
@@ -5,15 +5,15 @@ import Gtk from "gi://Gtk?version=4.0";
 
 Gio._promisify(Gtk.FileLauncher.prototype, "launch", "launch_finish");
 
-const edit_entry = workbench.builder.get_object("edit_entry");
-const view_file = workbench.builder.get_object("view_file");
-const delete_file = workbench.builder.get_object("delete_file");
-const edit_file = workbench.builder.get_object("edit_file");
-const file_name = workbench.builder.get_object("file_name");
+const edit_entry = workbench.builder.get_object<Gtk.TextView>("edit_entry");
+const view_file = workbench.builder.get_object<Gtk.Button>("view_file");
+const delete_file = workbench.builder.get_object<Gtk.Button>("delete_file");
+const edit_file = workbench.builder.get_object<Gtk.Button>("edit_file");
+const file_name = workbench.builder.get_object<Gtk.Label>("file_name");
 const { buffer } = edit_entry;
 const file = Gio.File.new_for_uri(workbench.resolve("workbench.txt"));
 const file_dir = file.get_parent();
-const overlay = workbench.builder.get_object("overlay");
+const overlay = workbench.builder.get_object<Adw.ToastOverlay>("overlay");
 const file_launcher = new Gtk.FileLauncher({
   always_ask: true,
   file,
@@ -33,10 +33,12 @@ const monitor_for_dir = file_dir.monitor(
 const monitor_for_file = file.monitor(Gio.FileMonitorFlags.NONE, null);
 
 delete_file.connect("clicked", () => {
+  // @ts-expect-error undetected async function
   file.delete_async(GLib.PRIORITY_DEFAULT, null).catch(console.error);
 });
 
 view_file.connect("clicked", () => {
+  // @ts-expect-error undetected async function
   file_launcher.launch(workbench.window, null).catch(console.error);
 });
 
@@ -57,7 +59,8 @@ monitor_for_dir.connect("changed", (_self, child, other_file, event) => {
 
   switch (event) {
     case Gio.FileMonitorEvent.RENAMED:
-      toast.title = `${child.get_basename()} was renamed to ${other_file.get_basename()}`;
+      toast.title =
+        `${child.get_basename()} was renamed to ${other_file.get_basename()}`;
       break;
     case Gio.FileMonitorEvent.DELETED:
       toast.title = `${child.get_basename()} was deleted from the directory`;
@@ -71,14 +74,14 @@ monitor_for_dir.connect("changed", (_self, child, other_file, event) => {
 });
 
 edit_file.connect("clicked", () => {
-  const bytes = new GLib.Bytes(buffer.text);
   file
     .replace_contents_async(
-      bytes,
+      buffer.text,
       null,
       false,
       Gio.FileCreateFlags.REPLACE_DESTINATION,
       null,
     )
+    // @ts-expect-error undetected async function
     .catch(console.error);
 });
diff --git a/src/Flow Box/main.js b/src/Flow Box/main.ts
similarity index 90%
rename from src/Flow Box/main.js
rename to src/Flow Box/main.ts
index 4142bfad..f288a703 100644
--- a/src/Flow Box/main.js	
+++ b/src/Flow Box/main.ts	
@@ -1,7 +1,7 @@
 import Adw from "gi://Adw";
 import Gtk from "gi://Gtk?version=4.0";
 
-const flowbox = workbench.builder.get_object("flowbox");
+const flowbox = workbench.builder.get_object<Gtk.FlowBox>("flowbox");
 
 for (let code = 128513; code <= 128591; code++) {
   addEmoji(flowbox, String.fromCodePoint(code));
diff --git a/src/Font Dialog/main.js b/src/Font Dialog/main.ts
similarity index 73%
rename from src/Font Dialog/main.js
rename to src/Font Dialog/main.ts
index 449a5392..b3b32032 100644
--- a/src/Font Dialog/main.js	
+++ b/src/Font Dialog/main.ts	
@@ -1,5 +1,6 @@
 import Gio from "gi://Gio";
 import Gtk from "gi://Gtk?version=4.0";
+import Pango from "gi://Pango";
 
 Gio._promisify(
   Gtk.FontDialog.prototype,
@@ -7,8 +8,8 @@ Gio._promisify(
   "choose_family_finish",
 );
 
-const font_dialog_button = workbench.builder.get_object("font_dialog_button");
-const custom_button = workbench.builder.get_object("custom_button");
+const font_dialog_button = workbench.builder.get_object<Gtk.FontDialogButton>("font_dialog_button");
+const custom_button = workbench.builder.get_object<Gtk.Button>("custom_button");
 
 const dialog_standard = new Gtk.FontDialog({
   title: "Select a Font",
@@ -29,10 +30,11 @@ const dialog_custom = new Gtk.FontDialog({
 custom_button.connect("clicked", () => onClicked().catch(console.error));
 
 async function onClicked() {
+  // @ts-expect-error undetected async function
   const family = await dialog_custom.choose_family(
     workbench.window,
     null,
     null,
-  );
+  ) as Pango.FontFamily;
   console.log(`Font Family: ${family.get_name()}`);
 }
diff --git a/src/Frame/main.js b/src/Frame/main.ts
similarity index 90%
rename from src/Frame/main.js
rename to src/Frame/main.ts
index bb5d8d30..e8329856 100644
--- a/src/Frame/main.js
+++ b/src/Frame/main.ts
@@ -1,11 +1,15 @@
 import Gio from "gi://Gio";
 import Gtk from "gi://Gtk?version=4.0";
 
-const pic_with_frame = workbench.builder.get_object("with_frame");
-const pic_without_frame = workbench.builder.get_object("without_frame");
+const pic_with_frame = workbench.builder.get_object<Gtk.Picture>("with_frame");
+const pic_without_frame = workbench.builder.get_object<Gtk.Picture>(
+  "without_frame",
+);
 
-const textview_with_frame = workbench.builder.get_object("textview_with_frame");
-const textview_without_frame = workbench.builder.get_object(
+const textview_with_frame = workbench.builder.get_object<Gtk.TextView>(
+  "textview_with_frame",
+);
+const textview_without_frame = workbench.builder.get_object<Gtk.TextView>(
   "textview_without_frame",
 );
 
diff --git a/src/Gamepad/main.js b/src/Gamepad/main.ts
similarity index 70%
rename from src/Gamepad/main.js
rename to src/Gamepad/main.ts
index 949b436d..9b46eec6 100644
--- a/src/Gamepad/main.js
+++ b/src/Gamepad/main.ts
@@ -1,9 +1,10 @@
+import Gtk from "gi://Gtk?version=4.0";
 import Manette from "gi://Manette";
 
-const stack = workbench.builder.get_object("stack");
-const button_rumble = workbench.builder.get_object("button_rumble");
+const stack = workbench.builder.get_object<Gtk.Stack>("stack");
+const button_rumble = workbench.builder.get_object<Gtk.Button>("button_rumble");
 
-const devices = new Set();
+const devices = new Set<Manette.Device>();
 
 stack.visible_child_name = "connect";
 button_rumble.connect("clicked", () => {
@@ -14,14 +15,16 @@ button_rumble.connect("clicked", () => {
   }
 });
 
-function onDevice(device) {
+function onDevice(device: Manette.Device) {
   console.log("Device connected:", device.get_name());
 
   // Face and Shoulder Buttons
   device.connect("button-press-event", (device, event) => {
     const [success, button] = event.get_button();
     console.log(
-      `${device.get_name()}: press ${success ? button : event.get_hardware_code()}`,
+      `${device.get_name()}: press ${
+        success ? button : event.get_hardware_code()
+      }`,
     );
   });
 
@@ -29,7 +32,9 @@ function onDevice(device) {
   device.connect("button-release-event", (device, event) => {
     const [success, button] = event.get_button();
     console.log(
-      `${device.get_name()}: release ${success ? button : event.get_hardware_code()}`,
+      `${device.get_name()}: release ${
+        success ? button : event.get_hardware_code()
+      }`,
     );
   });
 
@@ -42,8 +47,9 @@ function onDevice(device) {
   // Analog Axis - Triggers and Joysticks
   device.connect("absolute-axis-event", (device, event) => {
     const [, axis, value] = event.get_absolute();
-    if (Math.abs(value) > 0.2)
+    if (Math.abs(value) > 0.2) {
       console.log(`${device.get_name()}: moved axis ${axis} to ${value}`);
+    }
   });
 
   devices.add(device);
@@ -60,14 +66,14 @@ function onDeviceDisconnected(device) {
 const monitor = new Manette.Monitor();
 const monitor_iter = monitor.iterate();
 
-let has_next;
-let device;
+let has_next: boolean, device: Manette.Device | null;
 do {
   [has_next, device] = monitor_iter.next();
   if (device !== null) onDevice(device);
 } while (has_next);
 
 monitor.connect("device-connected", (_self, device) => onDevice(device));
-monitor.connect("device-disconnected", (_self, device) =>
-  onDeviceDisconnected(device),
+monitor.connect(
+  "device-disconnected",
+  (_self, device) => onDeviceDisconnected(device),
 );
diff --git a/src/Grid View/main.js b/src/Grid View/main.ts
similarity index 64%
rename from src/Grid View/main.js
rename to src/Grid View/main.ts
index d962671c..0408ee44 100644
--- a/src/Grid View/main.js	
+++ b/src/Grid View/main.ts	
@@ -1,8 +1,8 @@
 import Gtk from "gi://Gtk?version=4.0";
 
-const grid_view = workbench.builder.get_object("grid_view");
-const add = workbench.builder.get_object("add");
-const remove = workbench.builder.get_object("remove");
+const grid_view = workbench.builder.get_object<Gtk.GridView>("grid_view");
+const add = workbench.builder.get_object<Gtk.Button>("add");
+const remove = workbench.builder.get_object<Gtk.Button>("remove");
 
 //Model
 let item = 1;
@@ -13,7 +13,7 @@ const string_model = new Gtk.StringList({
 const model = new Gtk.SingleSelection({ model: string_model });
 
 const factory_for_grid_view = new Gtk.SignalListItemFactory();
-factory_for_grid_view.connect("setup", (_self, listItem) => {
+factory_for_grid_view.connect("setup", (_self, listItem: Gtk.ListItem) => {
   const listBox = new Gtk.Box({
     width_request: 160,
     height_request: 160,
@@ -27,12 +27,12 @@ factory_for_grid_view.connect("setup", (_self, listItem) => {
   listBox.append(label);
   listItem.set_child(listBox);
 });
-factory_for_grid_view.connect("bind", (_self, listItem) => {
+factory_for_grid_view.connect("bind", (_self, listItem: Gtk.ListItem) => {
   const listBox = listItem.get_child();
-  const modelItem = listItem.get_item();
-  const labelWidget = listBox.get_last_child();
+  const modelItem = listItem.get_item() as Gtk.StringObject;
+  const labelWidget = listBox.get_last_child() as Gtk.Label;
 
-  labelWidget.label = modelItem.string;
+  labelWidget.label = modelItem.string
 });
 
 //View
@@ -47,7 +47,7 @@ model.model.connect("items-changed", (_list, position, removed, added) => {
 model.connect("selection-changed", () => {
   const selected_item = model.get_selected();
   console.log(
-    `Model item selected from view: ${model.model.get_string(selected_item)}`,
+    `Model item selected from view: ${string_model.get_string(selected_item)}`,
   );
 });
 
@@ -57,11 +57,11 @@ grid_view.factory = factory_for_grid_view;
 // Controller
 add.connect("clicked", () => {
   const new_item = `New item ${item}`;
-  model.model.append(new_item);
+  string_model.append(new_item);
   item++;
 });
 
 remove.connect("clicked", () => {
   const selected_item = model.get_selected();
-  model.model.remove(selected_item);
+  string_model.remove(selected_item);
 });
diff --git a/src/Grid/main.js b/src/Grid/main.ts
similarity index 87%
rename from src/Grid/main.js
rename to src/Grid/main.ts
index 4edc82cb..f119c139 100644
--- a/src/Grid/main.js
+++ b/src/Grid/main.ts
@@ -1,3 +1,5 @@
+import Gtk from "gi://Gtk?version=4.0";
+
 const button_ids = [
   "button00",
   "button01",
@@ -28,10 +30,10 @@ function onClicked(button) {
     const pc_is_thinking_row = Math.floor(Math.random() * 3).toString();
     const pc_is_thinking_col = Math.floor(Math.random() * 3).toString();
     //make pc reaction if possible
-    const temp = workbench.builder.get_object(
+    const temp = workbench.builder.get_object<Gtk.Button>(
       `button${pc_is_thinking_row}${pc_is_thinking_col}`,
     );
-    const temp_image = temp.get_child();
+    const temp_image = temp.get_child() as Gtk.Image;
     if (!temp_image.icon_name) {
       //store and show pc reaction
       temp_image.icon_name = "circle-outline-thick-symbolic";
diff --git a/src/HTTP Image/main.js b/src/HTTP Image/main.ts
similarity index 82%
rename from src/HTTP Image/main.js
rename to src/HTTP Image/main.ts
index d27313d2..9fa09b95 100644
--- a/src/HTTP Image/main.js	
+++ b/src/HTTP Image/main.ts	
@@ -1,6 +1,7 @@
 import GLib from "gi://GLib";
 import Gdk from "gi://Gdk?version=4.0";
 import Gio from "gi://Gio";
+import Gtk from "gi://Gtk?version=4.0";
 import Soup from "gi://Soup";
 
 // https://picsum.photos/
@@ -14,7 +15,7 @@ Gio._promisify(
 
 const image_bytes = await getImageBytes(IMAGE_URL);
 const texture = Gdk.Texture.new_from_bytes(image_bytes);
-workbench.builder.get_object("picture").set_paintable(texture);
+workbench.builder.get_object<Gtk.Picture>("picture").set_paintable(texture);
 
 async function getImageBytes(url) {
   const session = new Soup.Session();
@@ -22,11 +23,12 @@ async function getImageBytes(url) {
     method: "GET",
     uri: GLib.Uri.parse(url, GLib.UriFlags.NONE),
   });
+  // @ts-expect-error undetected async function
   const bytes = await session.send_and_read_async(
     message,
     GLib.PRIORITY_DEFAULT,
     null,
-  );
+  ) as GLib.Bytes;
   const status = message.get_status();
   if (status !== Soup.Status.OK) {
     throw new Error(`Got ${status}, ${message.reason_phrase}`);
diff --git a/src/HTTP Request/main.js b/src/HTTP Request/main.ts
similarity index 81%
rename from src/HTTP Request/main.js
rename to src/HTTP Request/main.ts
index 073efe72..32a758a9 100644
--- a/src/HTTP Request/main.js	
+++ b/src/HTTP Request/main.ts	
@@ -1,5 +1,6 @@
 import GLib from "gi://GLib";
 import Gio from "gi://Gio";
+import Gtk from "gi://Gtk?version=4.0";
 import Soup from "gi://Soup";
 
 Gio._promisify(
@@ -9,8 +10,10 @@ Gio._promisify(
 );
 
 const http_session = new Soup.Session();
-const article_text_view = workbench.builder.get_object("article_text_view");
-const article_title = workbench.builder.get_object("article_title");
+const article_text_view = workbench.builder.get_object<Gtk.TextView>(
+  "article_text_view",
+);
+const article_title = workbench.builder.get_object<Gtk.Label>("article_title");
 
 fetchWikipediaTodaysFeaturedArticle().catch(console.error);
 
@@ -25,11 +28,12 @@ async function fetchWikipediaTodaysFeaturedArticle() {
   )}`;
   const message = Soup.Message.new("GET", url);
 
+  // @ts-expect-error undetected async function
   const bytes = await http_session.send_and_read_async(
     message,
     GLib.PRIORITY_DEFAULT,
     null,
-  );
+  ) as GLib.Bytes
 
   if (message.get_status() !== Soup.Status.OK) {
     console.error(`HTTP Status ${message.get_status()}`);
diff --git a/src/HTTP Server/main.js b/src/HTTP Server/main.ts
similarity index 84%
rename from src/HTTP Server/main.js
rename to src/HTTP Server/main.ts
index 39424b3e..fc820425 100644
--- a/src/HTTP Server/main.js	
+++ b/src/HTTP Server/main.ts	
@@ -1,8 +1,13 @@
+import Gtk from "gi://Gtk?version=4.0";
 import Soup from "gi://Soup";
 
-const button_server = workbench.builder.get_object("button_server");
-const linkbutton = workbench.builder.get_object("linkbutton");
-const label_greetings = workbench.builder.get_object("label_greetings");
+const button_server = workbench.builder.get_object<Gtk.ToggleButton>(
+  "button_server",
+);
+const linkbutton = workbench.builder.get_object<Gtk.LinkButton>("linkbutton");
+const label_greetings = workbench.builder.get_object<Gtk.Label>(
+  "label_greetings",
+);
 
 function handler(_server, msg, _path, _query) {
   msg.set_status(Soup.Status.OK, null);
diff --git a/src/Image/main.js b/src/Image/main.js
deleted file mode 100644
index 4016c4ce..00000000
--- a/src/Image/main.js
+++ /dev/null
@@ -1,9 +0,0 @@
-import Gio from "gi://Gio";
-
-const path = Gio.File.new_for_uri(
-  workbench.resolve("workbench.png"),
-).get_path();
-
-workbench.builder.get_object("icon1").file = path;
-workbench.builder.get_object("icon2").file = path;
-workbench.builder.get_object("icon3").file = path;
diff --git a/src/Image/main.ts b/src/Image/main.ts
new file mode 100644
index 00000000..d07eb2b8
--- /dev/null
+++ b/src/Image/main.ts
@@ -0,0 +1,10 @@
+import Gio from "gi://Gio";
+import Gtk from "gi://Gtk?version=4.0";
+
+const path = Gio.File.new_for_uri(
+  workbench.resolve("workbench.png"),
+).get_path();
+
+workbench.builder.get_object<Gtk.Image>("icon1").file = path;
+workbench.builder.get_object<Gtk.Image>("icon2").file = path;
+workbench.builder.get_object<Gtk.Image>("icon3").file = path;
diff --git a/src/Label/main.js b/src/Label/main.ts
similarity index 79%
rename from src/Label/main.js
rename to src/Label/main.ts
index 3a8eebf0..2447d3c7 100644
--- a/src/Label/main.js
+++ b/src/Label/main.ts
@@ -1,7 +1,14 @@
-const label = workbench.builder.get_object("label");
-const justification_row = workbench.builder.get_object("justification_row");
-const style_row = workbench.builder.get_object("style_row");
-const single_line_switch = workbench.builder.get_object("single_line_switch");
+import Adw from "gi://Adw";
+import Gtk from "gi://Gtk?version=4.0";
+
+const label = workbench.builder.get_object<Gtk.Label>("label");
+const justification_row = workbench.builder.get_object<Adw.ComboRow>(
+  "justification_row",
+);
+const style_row = workbench.builder.get_object<Adw.ComboRow>("style_row");
+const single_line_switch = workbench.builder.get_object<Adw.SwitchRow>(
+  "single_line_switch",
+);
 
 const style_classes = [
   "none",
diff --git a/src/Launcher/main.js b/src/Launcher/main.ts
similarity index 71%
rename from src/Launcher/main.js
rename to src/Launcher/main.ts
index 3ee6d787..d3e12130 100644
--- a/src/Launcher/main.js
+++ b/src/Launcher/main.ts
@@ -11,12 +11,12 @@ Gio._promisify(
 Gio._promisify(Gtk.FileDialog.prototype, "open", "open_finish");
 Gio._promisify(Gtk.UriLauncher.prototype, "launch", "launch_finish");
 
-const launch_file = workbench.builder.get_object("launch_file");
-const file_name = workbench.builder.get_object("file_name");
-const file_location = workbench.builder.get_object("file_location");
-const change_file = workbench.builder.get_object("change_file");
-const uri_launch = workbench.builder.get_object("uri_launch");
-const uri_details = workbench.builder.get_object("uri_details");
+const launch_file = workbench.builder.get_object<Gtk.Button>("launch_file");
+const file_name = workbench.builder.get_object<Gtk.Label>("file_name");
+const file_location = workbench.builder.get_object<Gtk.Button>("file_location");
+const change_file = workbench.builder.get_object<Gtk.Button>("change_file");
+const uri_launch = workbench.builder.get_object<Gtk.Button>("uri_launch");
+const uri_details = workbench.builder.get_object<Gtk.Entry>("uri_details");
 
 //File Launcher
 
@@ -27,6 +27,7 @@ const file_launcher = new Gtk.FileLauncher({
 });
 
 launch_file.connect("clicked", () => {
+  // @ts-expect-error undetected async function
   file_launcher.launch(workbench.window, null).catch(console.error);
 });
 
@@ -42,12 +43,14 @@ file_launcher.connect("notify::file", () => {
 file_location.connect("clicked", () => {
   file_launcher
     .open_containing_folder(workbench.window, null)
+    // @ts-expect-error undetected async function
     .catch(console.error);
 });
 
 change_file.connect("clicked", () => {
   new Gtk.FileDialog()
     .open(workbench.window, null)
+    // @ts-expect-error undetected async function
     .then((file) => {
       file_launcher.file = file;
     })
@@ -59,6 +62,7 @@ change_file.connect("clicked", () => {
 uri_launch.connect("clicked", () => {
   new Gtk.UriLauncher({ uri: uri_details.text })
     .launch(workbench.window, null)
+    // @ts-expect-error undetected async function
     .catch(console.error);
 });
 uri_details.connect("changed", () => {
diff --git a/src/Level Bars/main.js b/src/Level Bars/main.ts
similarity index 77%
rename from src/Level Bars/main.js
rename to src/Level Bars/main.ts
index 98c49392..b0d3a0b4 100644
--- a/src/Level Bars/main.js	
+++ b/src/Level Bars/main.ts	
@@ -1,18 +1,24 @@
-const bar_continuous = workbench.builder.get_object("bar_continuous");
+import Gtk from "gi://Gtk?version=4.0";
+
+const bar_continuous = workbench.builder.get_object<Gtk.LevelBar>(
+  "bar_continuous",
+);
 
 bar_continuous.add_offset_value("full", 100);
 bar_continuous.add_offset_value("half", 50);
 bar_continuous.add_offset_value("low", 25);
 
-const bar_discrete = workbench.builder.get_object("bar_discrete");
+const bar_discrete = workbench.builder.get_object<Gtk.LevelBar>("bar_discrete");
 
 bar_discrete.add_offset_value("very-weak", 1);
 bar_discrete.add_offset_value("weak", 2);
 bar_discrete.add_offset_value("moderate", 4);
 bar_discrete.add_offset_value("strong", 6);
 
-const entry = workbench.builder.get_object("entry");
-const label_strength = workbench.builder.get_object("label_strength");
+const entry = workbench.builder.get_object<Gtk.Entry>("entry");
+const label_strength = workbench.builder.get_object<Gtk.Label>(
+  "label_strength",
+);
 
 entry.connect("notify::text", () => {
   estimatePasswordStrength();
diff --git a/src/Link Button/main.js b/src/Link Button/main.ts
similarity index 72%
rename from src/Link Button/main.js
rename to src/Link Button/main.ts
index 8830156a..fccd335f 100644
--- a/src/Link Button/main.js	
+++ b/src/Link Button/main.ts	
@@ -1,4 +1,6 @@
-const linkbutton = workbench.builder.get_object("linkbutton");
+import Gtk from "gi://Gtk?version=4.0";
+
+const linkbutton = workbench.builder.get_object<Gtk.LinkButton>("linkbutton");
 
 linkbutton.connect("notify::visited", () => {
   console.log("The link has been visited");
diff --git a/src/List Model/main.js b/src/List Model/main.ts
similarity index 80%
rename from src/List Model/main.js
rename to src/List Model/main.ts
index e3821ef5..b12f3500 100644
--- a/src/List Model/main.js	
+++ b/src/List Model/main.ts	
@@ -1,13 +1,13 @@
 import Adw from "gi://Adw";
 import Gtk from "gi://Gtk?version=4.0";
 
-const stack = workbench.builder.get_object("stack");
-const list_box = workbench.builder.get_object("list_box");
-const flow_box = workbench.builder.get_object("flow_box");
-const add = workbench.builder.get_object("add");
-const remove = workbench.builder.get_object("remove");
-const list_box_editable = workbench.builder.get_object("list_box_editable");
-const search_entry = workbench.builder.get_object("search_entry");
+const stack = workbench.builder.get_object<Gtk.Stack>("stack");
+const list_box = workbench.builder.get_object<Gtk.ListBox>("list_box");
+const flow_box = workbench.builder.get_object<Gtk.FlowBox>("flow_box");
+const add = workbench.builder.get_object<Gtk.Button>("add");
+const remove = workbench.builder.get_object<Gtk.Button>("remove");
+const list_box_editable = workbench.builder.get_object<Gtk.ListBox>("list_box_editable");
+const search_entry = workbench.builder.get_object<Gtk.SearchEntry>("search_entry");
 
 //Model
 const model = new Gtk.StringList({
@@ -25,7 +25,7 @@ model.connect("items-changed", (_self, position, removed, added) => {
 
 //Filter-Model
 const search_expression = Gtk.PropertyExpression.new(
-  Gtk.StringObject,
+  Gtk.StringObject.$gtype,
   null,
   "string",
 );
diff --git a/src/List View with Sections/main.js b/src/List View with Sections/main.ts
similarity index 79%
rename from src/List View with Sections/main.js
rename to src/List View with Sections/main.ts
index 577b6475..19cffa89 100644
--- a/src/List View with Sections/main.js	
+++ b/src/List View with Sections/main.ts	
@@ -1,9 +1,9 @@
 import Gtk from "gi://Gtk";
 import GObject from "gi://GObject";
 
-const list_view = workbench.builder.get_object("list_view");
-const item_factory = workbench.builder.get_object("item_factory");
-const header_factory = workbench.builder.get_object("header_factory");
+const list_view = workbench.builder.get_object<Gtk.ListView>("list_view");
+const item_factory = workbench.builder.get_object<Gtk.SignalListItemFactory>("item_factory");
+const header_factory = workbench.builder.get_object<Gtk.SignalListItemFactory>("header_factory");
 
 const CustomModel = GObject.registerClass(
   {
diff --git a/src/List View with a Tree/main.js b/src/List View with a Tree/main.ts
similarity index 57%
rename from src/List View with a Tree/main.js
rename to src/List View with a Tree/main.ts
index 679b6428..47298055 100644
--- a/src/List View with a Tree/main.js	
+++ b/src/List View with a Tree/main.ts	
@@ -2,41 +2,43 @@ import Gtk from "gi://Gtk";
 import GObject from "gi://GObject";
 import Gio from "gi://Gio";
 
-const list_view = workbench.builder.get_object("list_view");
-const factory = workbench.builder.get_object("factory");
-
-const TreeNode = GObject.registerClass(
-  class TreeNode extends GObject.Object {
-    constructor(title, children) {
-      super();
-      this.title = title;
-      this.children = children;
-    }
-  },
-);
+const list_view = workbench.builder.get_object<Gtk.ListView>("list_view");
+const factory = workbench.builder.get_object<Gtk.SignalListItemFactory>("factory");
 
-const TreeWidget = GObject.registerClass(
-  class TreeWidget extends Gtk.Box {
-    constructor(...args) {
-      super(...args);
-      this.spacing = 6;
-      this.margin_start = 6;
-      this.margin_end = 12;
-      this.margin_top = 6;
-      this.margin_bottom = 6;
-
-      this.expander = new Gtk.TreeExpander();
-      this.label = new Gtk.Label({ halign: Gtk.Align.START });
-
-      this.append(this.expander);
-      this.append(this.label);
-    }
-  },
-);
+class TreeNode extends GObject.Object {
+  constructor(public title: string, public children: TreeNode[]) {
+    super();
+  }
+
+  static {
+    GObject.registerClass(this);
+  }
+}
+
+class TreeWidget extends Gtk.Box {
+  expander = new Gtk.TreeExpander();
+  label = new Gtk.Label({ halign: Gtk.Align.START });
+
+  constructor(args?: Partial<Gtk.Box.ConstructorProps>) {
+    super(args);
+    this.spacing = 6;
+    this.margin_start = 6;
+    this.margin_end = 12;
+    this.margin_top = 6;
+    this.margin_bottom = 6;
+
+    this.append(this.expander);
+    this.append(this.label);
+  }
+
+  static {
+    GObject.registerClass(this);
+  }
+}
 
 function create_model_func(item) {
   if (item.children.length < 1) return null;
-  const child_model = new Gio.ListStore(TreeNode);
+  const child_model = Gio.ListStore.new(TreeNode.$gtype);
   for (const child of item.children) {
     child_model.append(child);
   }
@@ -68,7 +70,7 @@ const root_model = new TreeNode("Root", [
   ]),
 ]);
 
-const tree_model = new Gio.ListStore(TreeNode);
+const tree_model = Gio.ListStore.new(TreeNode.$gtype);
 tree_model.append(root_model);
 
 const tree_list_model = Gtk.TreeListModel.new(
diff --git a/src/List View/main.js b/src/List View/main.ts
similarity index 68%
rename from src/List View/main.js
rename to src/List View/main.ts
index 30a8fef7..07d4d6ab 100644
--- a/src/List View/main.js	
+++ b/src/List View/main.ts	
@@ -1,8 +1,8 @@
 import Gtk from "gi://Gtk?version=4.0";
 
-const list_view = workbench.builder.get_object("list_view");
-const add = workbench.builder.get_object("add");
-const remove = workbench.builder.get_object("remove");
+const list_view = workbench.builder.get_object<Gtk.ListView>("list_view");
+const add = workbench.builder.get_object<Gtk.Button>("add");
+const remove = workbench.builder.get_object<Gtk.Button>("remove");
 
 //Model
 let item = 1;
@@ -24,7 +24,7 @@ model.model.connect("items-changed", (_list, position, removed, added) => {
 model.connect("selection-changed", () => {
   const selected_item = model.get_selected();
   console.log(
-    `Model item selected from view: ${model.model.get_string(selected_item)}`,
+    `Model item selected from view: ${string_model.get_string(selected_item)}`,
   );
 });
 
@@ -33,11 +33,11 @@ list_view.model = model;
 // Controller
 add.connect("clicked", () => {
   const new_item = `New item ${item}`;
-  model.model.append(new_item);
+  string_model.append(new_item);
   item++;
 });
 
 remove.connect("clicked", () => {
   const selected_item = model.get_selected();
-  model.model.remove(selected_item);
+  string_model.remove(selected_item);
 });
diff --git a/src/Location/main.js b/src/Location/main.ts
similarity index 65%
rename from src/Location/main.js
rename to src/Location/main.ts
index 497a3b62..8926b33f 100644
--- a/src/Location/main.js
+++ b/src/Location/main.ts
@@ -1,4 +1,6 @@
+import Adw from "gi://Adw";
 import Gio from "gi://Gio";
+import Gtk from "gi://Gtk?version=4.0";
 import Xdp from "gi://Xdp";
 import XdpGtk from "gi://XdpGtk4";
 
@@ -11,23 +13,31 @@ Gio._promisify(
 const portal = new Xdp.Portal();
 const parent = XdpGtk.parent_new_gtk(workbench.window);
 
-const revealer = workbench.builder.get_object("revealer");
-const start = workbench.builder.get_object("start");
-const close = workbench.builder.get_object("close");
-const distance_threshold = workbench.builder.get_object("distance_threshold");
-const time_threshold = workbench.builder.get_object("time_threshold");
-const accuracy_button = workbench.builder.get_object("accuracy_button");
+const revealer = workbench.builder.get_object<Gtk.Revealer>("revealer");
+const start = workbench.builder.get_object<Gtk.Button>("start");
+const close = workbench.builder.get_object<Gtk.Button>("close");
+const distance_threshold = workbench.builder.get_object<Adw.SpinRow>(
+  "distance_threshold",
+);
+const time_threshold = workbench.builder.get_object<Adw.SpinRow>(
+  "time_threshold",
+);
+const accuracy_button = workbench.builder.get_object<Adw.ComboRow>(
+  "accuracy_button",
+);
 
-const latitude_label = workbench.builder.get_object("latitude");
-const longitude_label = workbench.builder.get_object("longitude");
-const accuracy_label = workbench.builder.get_object("accuracy");
-const altitude_label = workbench.builder.get_object("altitude");
-const speed_label = workbench.builder.get_object("speed");
-const heading_label = workbench.builder.get_object("heading");
-const description_label = workbench.builder.get_object("description");
-const timestamp_label = workbench.builder.get_object("timestamp");
+const latitude_label = workbench.builder.get_object<Gtk.Label>("latitude");
+const longitude_label = workbench.builder.get_object<Gtk.Label>("longitude");
+const accuracy_label = workbench.builder.get_object<Gtk.Label>("accuracy");
+const altitude_label = workbench.builder.get_object<Gtk.Label>("altitude");
+const speed_label = workbench.builder.get_object<Gtk.Label>("speed");
+const heading_label = workbench.builder.get_object<Gtk.Label>("heading");
+const description_label = workbench.builder.get_object<Gtk.Label>(
+  "description",
+);
+const timestamp_label = workbench.builder.get_object<Gtk.Label>("timestamp");
 
-let locationAccuracy = Xdp.LocationAccuracy.Exact;
+let locationAccuracy = Xdp.LocationAccuracy.EXACT;
 let distanceThresholdValue = distance_threshold.value;
 let timeThresholdValue = time_threshold.value;
 
@@ -51,7 +61,8 @@ accuracy_button.connect("notify::selected-item", () => {
   console.log("Accuracy changed");
   portal.location_monitor_stop();
   revealer.reveal_child = false;
-  const accuracy_flag = accuracy_button.selected_item.get_string();
+  const accuracy_flag = (accuracy_button.selected_item as Gtk.StringObject)
+    .get_string();
   locationAccuracy = Xdp.LocationAccuracy[accuracy_flag];
   startSession();
 });
@@ -59,6 +70,7 @@ accuracy_button.connect("notify::selected-item", () => {
 async function startSession() {
   start.sensitive = false;
   close.sensitive = true;
+  // @ts-expect-error undetected async function
   const result = await portal.location_monitor_start(
     parent,
     distanceThresholdValue,
@@ -66,7 +78,7 @@ async function startSession() {
     locationAccuracy,
     Xdp.LocationMonitorFlags.NONE,
     null,
-  );
+  ) as boolean;
   if (result === true) {
     console.log("Location access granted");
     revealer.reveal_child = true;
diff --git a/src/Map/main.js b/src/Map/main.ts
similarity index 76%
rename from src/Map/main.js
rename to src/Map/main.ts
index 084a6bbe..0358e1fc 100644
--- a/src/Map/main.js
+++ b/src/Map/main.ts
@@ -1,7 +1,7 @@
 import Gtk from "gi://Gtk?version=4.0";
 import Shumate from "gi://Shumate";
 
-const map_widget = workbench.builder.get_object("map_widget");
+const map_widget = workbench.builder.get_object<Shumate.SimpleMap>("map_widget");
 const registry = Shumate.MapSourceRegistry.new_with_defaults();
 
 // Use OpenStreetMap as the source
@@ -20,7 +20,7 @@ const marker_layer = new Shumate.MarkerLayer({
   selection_mode: Gtk.SelectionMode.SINGLE,
 });
 
-const marker = workbench.builder.get_object("marker");
+const marker = workbench.builder.get_object<Shumate.Marker>("marker");
 marker.set_location(0, 0);
 marker_layer.add_marker(marker);
 map_widget.map.add_layer(marker_layer);
@@ -28,7 +28,7 @@ map_widget.map.add_layer(marker_layer);
 const gesture = new Gtk.GestureClick();
 map_widget.add_controller(gesture);
 
-const button_marker = workbench.builder.get_object("button_marker");
+const button_marker = workbench.builder.get_object<Gtk.ToggleButton>("button_marker");
 
 gesture.connect("pressed", (_self, _n_press, x, y) => {
   if (button_marker.active) {
@@ -38,9 +38,9 @@ gesture.connect("pressed", (_self, _n_press, x, y) => {
   }
 });
 
-const entry_latitude = workbench.builder.get_object("entry_latitude");
-const entry_longitude = workbench.builder.get_object("entry_longitude");
-const button_go = workbench.builder.get_object("button_go");
+const entry_latitude = workbench.builder.get_object<Gtk.Entry>("entry_latitude");
+const entry_longitude = workbench.builder.get_object<Gtk.Entry>("entry_longitude");
+const button_go = workbench.builder.get_object<Gtk.Button>("button_go");
 
 button_go.connect("clicked", () => {
   go_to_location();
@@ -55,8 +55,8 @@ entry_longitude.connect("activate", () => {
 });
 
 function go_to_location() {
-  const latitude = entry_latitude.text;
-  const longitude = entry_longitude.text;
+  const latitude = Number(entry_latitude.text);
+  const longitude = Number(entry_longitude.text);
   if (isNaN(latitude) || isNaN(longitude)) {
     console.log("Please enter valid coordinates");
     return;
diff --git a/src/Memory Monitor/main.js b/src/Memory Monitor/main.ts
similarity index 100%
rename from src/Memory Monitor/main.js
rename to src/Memory Monitor/main.ts
diff --git a/src/Menu Button/main.js b/src/Menu Button/main.js
deleted file mode 100644
index 418b05c5..00000000
--- a/src/Menu Button/main.js	
+++ /dev/null
@@ -1,10 +0,0 @@
-const circular_switch = workbench.builder.get_object("circular_switch");
-const secondary_button = workbench.builder.get_object("secondary");
-
-circular_switch.connect("notify::active", () => {
-  if (circular_switch.active) {
-    secondary_button.add_css_class("circular");
-  } else {
-    secondary_button.remove_css_class("circular");
-  }
-});
diff --git a/src/Menu Button/main.ts b/src/Menu Button/main.ts
new file mode 100644
index 00000000..a658761d
--- /dev/null
+++ b/src/Menu Button/main.ts	
@@ -0,0 +1,17 @@
+import Adw from "gi://Adw";
+import Gtk from "gi://Gtk?version=4.0";
+
+const circular_switch = workbench.builder.get_object<Adw.SwitchRow>(
+  "circular_switch",
+);
+const secondary_button = workbench.builder.get_object<Gtk.MenuButton>(
+  "secondary",
+);
+
+circular_switch.connect("notify::active", () => {
+  if (circular_switch.active) {
+    secondary_button.add_css_class("circular");
+  } else {
+    secondary_button.remove_css_class("circular");
+  }
+});
diff --git a/src/Menu/main.js b/src/Menu/main.ts
similarity index 94%
rename from src/Menu/main.js
rename to src/Menu/main.ts
index f83a6621..27aa9c81 100644
--- a/src/Menu/main.js
+++ b/src/Menu/main.ts
@@ -1,8 +1,9 @@
 import GLib from "gi://GLib";
 import Gio from "gi://Gio";
+import Gtk from "gi://Gtk?version=4.0";
 import Pango from "gi://Pango";
 
-const label = workbench.builder.get_object("label");
+const label = workbench.builder.get_object<Gtk.Label>("label");
 
 const text_group = new Gio.SimpleActionGroup();
 label.insert_action_group("text", text_group);
diff --git a/src/Message Dialogs/main.js b/src/Message Dialogs/main.ts
similarity index 84%
rename from src/Message Dialogs/main.js
rename to src/Message Dialogs/main.ts
index c5a6db8e..99afdc1c 100644
--- a/src/Message Dialogs/main.js	
+++ b/src/Message Dialogs/main.ts	
@@ -4,9 +4,9 @@ import Gtk from "gi://Gtk?version=4.0";
 
 Gio._promisify(Adw.AlertDialog.prototype, "choose", "choose_finish");
 
-const button_confirmation = workbench.builder.get_object("button_confirmation");
-const button_error = workbench.builder.get_object("button_error");
-const button_advanced = workbench.builder.get_object("button_advanced");
+const button_confirmation = workbench.builder.get_object<Gtk.Button>("button_confirmation");
+const button_error = workbench.builder.get_object<Gtk.Button>("button_error");
+const button_advanced = workbench.builder.get_object<Gtk.Button>("button_advanced");
 
 async function createConfirmationDialog() {
   const dialog = new Adw.AlertDialog({
@@ -57,7 +57,8 @@ async function createAdvancedDialog() {
 
   dialog.set_extra_child(entry);
 
-  const response = await dialog.choose(workbench.window, null);
+  // @ts-expect-error this function is not detected as async
+  const response = await dialog.choose(workbench.window, null) as string;
   if (response === "login") {
     console.log(
       `Selected "${response}" response with password "${entry.get_text()}"`,
diff --git a/src/Navigation View/main.js b/src/Navigation View/main.js
deleted file mode 100644
index 48a1b631..00000000
--- a/src/Navigation View/main.js	
+++ /dev/null
@@ -1,32 +0,0 @@
-const nav_view = workbench.builder.get_object("nav_view");
-const nav_pageone = workbench.builder.get_object("nav_pageone");
-const next_button = workbench.builder.get_object("next_button");
-const previous_button = workbench.builder.get_object("previous_button");
-const nav_pagetwo = workbench.builder.get_object("nav_pagetwo");
-const nav_pagethree = workbench.builder.get_object("nav_pagethree");
-const nav_pagefour = workbench.builder.get_object("nav_pagefour");
-const title = workbench.builder.get_object("title");
-
-next_button.connect("clicked", () => {
-  switch (nav_view.visible_page) {
-    case nav_pageone:
-      nav_view.push(nav_pagetwo);
-      break;
-    case nav_pagetwo:
-      nav_view.push(nav_pagethree);
-      break;
-    case nav_pagethree:
-      nav_view.push(nav_pagefour);
-      break;
-  }
-});
-
-previous_button.connect("clicked", () => {
-  nav_view.pop();
-});
-
-nav_view.connect("notify::visible-page", () => {
-  previous_button.sensitive = nav_view.visible_page !== nav_pageone;
-  next_button.sensitive = nav_view.visible_page !== nav_pagefour;
-  title.label = nav_view.visible_page.title;
-});
diff --git a/src/Navigation View/main.ts b/src/Navigation View/main.ts
new file mode 100644
index 00000000..e95387c0
--- /dev/null
+++ b/src/Navigation View/main.ts	
@@ -0,0 +1,45 @@
+import Adw from "gi://Adw";
+import Gtk from "gi://Gtk?version=4.0";
+
+const nav_view = workbench.builder.get_object<Adw.NavigationView>("nav_view");
+const nav_pageone = workbench.builder.get_object<Adw.NavigationPage>(
+  "nav_pageone",
+);
+const next_button = workbench.builder.get_object<Gtk.Button>("next_button");
+const previous_button = workbench.builder.get_object<Gtk.Button>(
+  "previous_button",
+);
+const nav_pagetwo = workbench.builder.get_object<Adw.NavigationPage>(
+  "nav_pagetwo",
+);
+const nav_pagethree = workbench.builder.get_object<Adw.NavigationPage>(
+  "nav_pagethree",
+);
+const nav_pagefour = workbench.builder.get_object<Adw.NavigationPage>(
+  "nav_pagefour",
+);
+const title = workbench.builder.get_object<Gtk.Label>("title");
+
+next_button.connect("clicked", () => {
+  switch (nav_view.visible_page) {
+    case nav_pageone:
+      nav_view.push(nav_pagetwo);
+      break;
+    case nav_pagetwo:
+      nav_view.push(nav_pagethree);
+      break;
+    case nav_pagethree:
+      nav_view.push(nav_pagefour);
+      break;
+  }
+});
+
+previous_button.connect("clicked", () => {
+  nav_view.pop();
+});
+
+nav_view.connect("notify::visible-page", () => {
+  previous_button.sensitive = nav_view.visible_page !== nav_pageone;
+  next_button.sensitive = nav_view.visible_page !== nav_pagefour;
+  title.label = nav_view.visible_page.title;
+});
diff --git a/src/Network Monitor/main.js b/src/Network Monitor/main.ts
similarity index 65%
rename from src/Network Monitor/main.js
rename to src/Network Monitor/main.ts
index 8b60125d..56b40739 100644
--- a/src/Network Monitor/main.js	
+++ b/src/Network Monitor/main.ts	
@@ -1,8 +1,10 @@
+import Adw from "gi://Adw";
 import Gio from "gi://Gio";
+import Gtk from "gi://Gtk?version=4.0";
 
-const banner = workbench.builder.get_object("banner");
+const banner = workbench.builder.get_object<Adw.Banner>("banner");
 const network_monitor = Gio.NetworkMonitor.get_default();
-const level_bar = workbench.builder.get_object("level_bar");
+const level_bar = workbench.builder.get_object<Gtk.LevelBar>("level_bar");
 
 function setNetworkStatus() {
   banner.revealed = network_monitor.network_metered;
diff --git a/src/Notification/main.js b/src/Notification/main.ts
similarity index 91%
rename from src/Notification/main.js
rename to src/Notification/main.ts
index 68661de0..dc59a21e 100644
--- a/src/Notification/main.js
+++ b/src/Notification/main.ts
@@ -1,4 +1,5 @@
 import Gio from "gi://Gio";
+import Gtk from "gi://Gtk?version=4.0";
 
 const { application, builder } = workbench;
 
@@ -16,7 +17,7 @@ notification.add_button("Decline", "app.notification-decline");
 const icon = new Gio.ThemedIcon({ name: "object-rotate-right-symbolic" });
 notification.set_icon(icon);
 
-builder.get_object("button_simple").connect("clicked", () => {
+builder.get_object<Gtk.Button>("button_simple").connect("clicked", () => {
   application.send_notification("lunch-is-ready", notification);
 });
 
diff --git a/src/Open File/main.js b/src/Open File/main.ts
similarity index 72%
rename from src/Open File/main.js
rename to src/Open File/main.ts
index 9fce1fc8..335b516d 100644
--- a/src/Open File/main.js	
+++ b/src/Open File/main.ts	
@@ -8,10 +8,12 @@ Gio._promisify(
   "open_multiple_finish",
 );
 
-const button_single = workbench.builder.get_object("button_single");
-const button_image = workbench.builder.get_object("button_image");
-const button_multiple = workbench.builder.get_object("button_multiple");
-const file_filter_image = workbench.builder.get_object("file_filter_image");
+const button_single = workbench.builder.get_object<Gtk.Button>("button_single");
+const button_image = workbench.builder.get_object<Gtk.Button>("button_image");
+const button_multiple = workbench.builder.get_object<Gtk.Button>("button_multiple");
+const file_filter_image = workbench.builder.get_object<Gtk.FileFilter>(
+  "file_filter_image",
+);
 
 async function openFile() {
   const file_dialog = new Gtk.FileDialog();
@@ -27,8 +29,12 @@ async function openImageFile() {
 
 async function openMultipleFiles() {
   const file_dialog = new Gtk.FileDialog();
-  const files = await file_dialog.open_multiple(workbench.window, null);
+  // @ts-expect-error undetected async function
+  const files = await file_dialog.open_multiple(workbench.window, null) as
+    | Gio.ListModel
+    | null;
   console.log(`Selected Files (${files.get_n_items()}):`);
+  // @ts-expect-error https://github.com/gjsify/ts-for-gir/issues/193
   for (const file of files) {
     console.log("  ", getFileName(file));
   }
diff --git a/src/Overlay Split View/main.js b/src/Overlay Split View/main.js
deleted file mode 100644
index 247fdaa6..00000000
--- a/src/Overlay Split View/main.js	
+++ /dev/null
@@ -1,13 +0,0 @@
-import Gtk from "gi://Gtk?version=4.0";
-
-const split_view = workbench.builder.get_object("split_view");
-const start_toggle = workbench.builder.get_object("start_toggle");
-const end_toggle = workbench.builder.get_object("end_toggle");
-
-start_toggle.connect("toggled", () => {
-  split_view.sidebar_position = Gtk.PackType.START;
-});
-
-end_toggle.connect("toggled", () => {
-  split_view.sidebar_position = Gtk.PackType.END;
-});
diff --git a/src/Overlay Split View/main.ts b/src/Overlay Split View/main.ts
new file mode 100644
index 00000000..12507d22
--- /dev/null
+++ b/src/Overlay Split View/main.ts	
@@ -0,0 +1,16 @@
+import Adw from "gi://Adw?version=1";
+import Gtk from "gi://Gtk?version=4.0";
+
+const split_view = workbench.builder.get_object<Adw.OverlaySplitView>(
+  "split_view",
+);
+const start_toggle = workbench.builder.get_object<Gtk.ToggleButton>("start_toggle");
+const end_toggle = workbench.builder.get_object<Gtk.ToggleButton>("end_toggle");
+
+start_toggle.connect("toggled", () => {
+  split_view.sidebar_position = Gtk.PackType.START;
+});
+
+end_toggle.connect("toggled", () => {
+  split_view.sidebar_position = Gtk.PackType.END;
+});
diff --git a/src/Overlay/main.js b/src/Overlay/main.ts
similarity index 52%
rename from src/Overlay/main.js
rename to src/Overlay/main.ts
index 58f18b86..1a42f4ca 100644
--- a/src/Overlay/main.js
+++ b/src/Overlay/main.ts
@@ -1,6 +1,7 @@
 import Gio from "gi://Gio";
+import Gtk from "gi://Gtk?version=4.0";
 
 const file = Gio.File.new_for_uri(workbench.resolve("./image.png"));
 
-const picture = workbench.builder.get_object("picture");
+const picture = workbench.builder.get_object<Gtk.Picture>("picture");
 picture.file = file;
diff --git a/src/Picture/main.js b/src/Picture/main.js
deleted file mode 100644
index 8b17feca..00000000
--- a/src/Picture/main.js
+++ /dev/null
@@ -1,13 +0,0 @@
-import Gio from "gi://Gio";
-
-const picture_fill = workbench.builder.get_object("picture_fill");
-const picture_contain = workbench.builder.get_object("picture_contain");
-const picture_cover = workbench.builder.get_object("picture_cover");
-const picture_scale_down = workbench.builder.get_object("picture_scale_down");
-
-const file = Gio.File.new_for_uri(workbench.resolve("./keys.png"));
-
-picture_fill.file = file;
-picture_contain.file = file;
-picture_cover.file = file;
-picture_scale_down.file = file;
diff --git a/src/Picture/main.ts b/src/Picture/main.ts
new file mode 100644
index 00000000..2bc33f7d
--- /dev/null
+++ b/src/Picture/main.ts
@@ -0,0 +1,20 @@
+import Gio from "gi://Gio";
+import Gtk from "gi://Gtk?version=4.0";
+
+const picture_fill = workbench.builder.get_object<Gtk.Picture>("picture_fill");
+const picture_contain = workbench.builder.get_object<Gtk.Picture>(
+  "picture_contain",
+);
+const picture_cover = workbench.builder.get_object<Gtk.Picture>(
+  "picture_cover",
+);
+const picture_scale_down = workbench.builder.get_object<Gtk.Picture>(
+  "picture_scale_down",
+);
+
+const file = Gio.File.new_for_uri(workbench.resolve("./keys.png"));
+
+picture_fill.file = file;
+picture_contain.file = file;
+picture_cover.file = file;
+picture_scale_down.file = file;
diff --git a/src/Popovers/main.js b/src/Popovers/main.ts
similarity index 100%
rename from src/Popovers/main.js
rename to src/Popovers/main.ts
diff --git a/src/Power Profile Monitor/main.js b/src/Power Profile Monitor/main.ts
similarity index 85%
rename from src/Power Profile Monitor/main.js
rename to src/Power Profile Monitor/main.ts
index effa0c26..f8d25690 100644
--- a/src/Power Profile Monitor/main.js	
+++ b/src/Power Profile Monitor/main.ts	
@@ -2,7 +2,7 @@ import Adw from "gi://Adw";
 import Gio from "gi://Gio";
 
 const power_profile_monitor = Gio.PowerProfileMonitor.dup_default();
-const overlay = workbench.builder.get_object("overlay");
+const overlay = workbench.builder.get_object<Adw.ToastOverlay>("overlay");
 
 power_profile_monitor.connect("notify::power-saver-enabled", () => {
   const toast = new Adw.Toast({
diff --git a/src/Preferences Dialog/main.js b/src/Preferences Dialog/main.ts
similarity index 58%
rename from src/Preferences Dialog/main.js
rename to src/Preferences Dialog/main.ts
index 7723a061..1de217bf 100644
--- a/src/Preferences Dialog/main.js	
+++ b/src/Preferences Dialog/main.ts	
@@ -1,13 +1,14 @@
+import Gtk from "gi://Gtk?version=4.0";
 import Adw from "gi://Adw";
 
-const dialog = workbench.builder.get_object("dialog");
-const dm_switch = workbench.builder.get_object("dm_switch");
-const subpage = workbench.builder.get_object("subpage");
-const subpage_row = workbench.builder.get_object("subpage_row");
-const subpage_button = workbench.builder.get_object("subpage_button");
-const toast_button = workbench.builder.get_object("toast_button");
+const dialog = workbench.builder.get_object<Adw.PreferencesDialog>("dialog");
+const dm_switch = workbench.builder.get_object<Adw.SwitchRow>("dm_switch");
+const subpage = workbench.builder.get_object<Adw.NavigationPage>("subpage");
+const subpage_row = workbench.builder.get_object<Adw.ActionRow>("subpage_row");
+const subpage_button = workbench.builder.get_object<Gtk.Button>("subpage_button");
+const toast_button = workbench.builder.get_object<Gtk.Button>("toast_button");
 const style_manager = Adw.StyleManager.get_default();
-const button = workbench.builder.get_object("button");
+const button = workbench.builder.get_object<Gtk.Button>("button");
 
 dm_switch.active = style_manager.dark;
 
diff --git a/src/Progress Bar/main.js b/src/Progress Bar/main.ts
similarity index 78%
rename from src/Progress Bar/main.js
rename to src/Progress Bar/main.ts
index adbfe6b7..2b834b7e 100644
--- a/src/Progress Bar/main.js	
+++ b/src/Progress Bar/main.ts	
@@ -1,10 +1,13 @@
 import Adw from "gi://Adw";
 import GLib from "gi://GLib";
+import Gtk from "gi://Gtk?version=4.0";
 
-const first_bar = workbench.builder.get_object("first");
-const second_bar = workbench.builder.get_object("second");
-const play = workbench.builder.get_object("play");
-const progress_tracker = workbench.builder.get_object("progress_tracker");
+const first_bar = workbench.builder.get_object<Gtk.ProgressBar>("first");
+const second_bar = workbench.builder.get_object<Gtk.ProgressBar>("second");
+const play = workbench.builder.get_object<Gtk.Button>("play");
+const progress_tracker = workbench.builder.get_object<Gtk.Label>(
+  "progress_tracker",
+);
 
 const target = Adw.PropertyAnimationTarget.new(first_bar, "fraction");
 
diff --git a/src/Radio Buttons/main.js b/src/Radio Buttons/main.js
deleted file mode 100644
index f6e5e218..00000000
--- a/src/Radio Buttons/main.js	
+++ /dev/null
@@ -1,10 +0,0 @@
-const radio_button_1 = workbench.builder.get_object("radio_button_1");
-const radio_button_2 = workbench.builder.get_object("radio_button_2");
-
-radio_button_1.connect("toggled", () => {
-  if (radio_button_1.active) console.log("Force Light Mode");
-});
-
-radio_button_2.connect("toggled", () => {
-  if (radio_button_2.active) console.log("Force Dark Mode");
-});
diff --git a/src/Radio Buttons/main.ts b/src/Radio Buttons/main.ts
new file mode 100644
index 00000000..b718093a
--- /dev/null
+++ b/src/Radio Buttons/main.ts	
@@ -0,0 +1,16 @@
+import Gtk from "gi://Gtk?version=4.0";
+
+const radio_button_1 = workbench.builder.get_object<Gtk.ToggleButton>(
+  "radio_button_1",
+);
+const radio_button_2 = workbench.builder.get_object<Gtk.ToggleButton>(
+  "radio_button_2",
+);
+
+radio_button_1.connect("toggled", () => {
+  if (radio_button_1.active) console.log("Force Light Mode");
+});
+
+radio_button_2.connect("toggled", () => {
+  if (radio_button_2.active) console.log("Force Dark Mode");
+});
diff --git a/src/Revealer/main.js b/src/Revealer/main.ts
similarity index 51%
rename from src/Revealer/main.js
rename to src/Revealer/main.ts
index f901d024..202dac75 100644
--- a/src/Revealer/main.js
+++ b/src/Revealer/main.ts
@@ -1,11 +1,20 @@
 import Gio from "gi://Gio";
+import Gtk from "gi://Gtk?version=4.0";
 
-const button_slide = workbench.builder.get_object("button_slide");
-const button_crossfade = workbench.builder.get_object("button_crossfade");
-const revealer_slide = workbench.builder.get_object("revealer_slide");
-const revealer_crossfade = workbench.builder.get_object("revealer_crossfade");
-const image1 = workbench.builder.get_object("image1");
-const image2 = workbench.builder.get_object("image2");
+const button_slide = workbench.builder.get_object<Gtk.ToggleButton>(
+  "button_slide",
+);
+const button_crossfade = workbench.builder.get_object<Gtk.ToggleButton>(
+  "button_crossfade",
+);
+const revealer_slide = workbench.builder.get_object<Gtk.Revealer>(
+  "revealer_slide",
+);
+const revealer_crossfade = workbench.builder.get_object<Gtk.Revealer>(
+  "revealer_crossfade",
+);
+const image1 = workbench.builder.get_object<Gtk.Picture>("image1");
+const image2 = workbench.builder.get_object<Gtk.Picture>("image2");
 
 image1.file = Gio.File.new_for_uri(workbench.resolve("./image1.png"));
 image2.file = Gio.File.new_for_uri(workbench.resolve("./image2.png"));
diff --git a/src/SVG/main.js b/src/SVG/main.ts
similarity index 79%
rename from src/SVG/main.js
rename to src/SVG/main.ts
index 7e827f11..b580612f 100644
--- a/src/SVG/main.js
+++ b/src/SVG/main.ts
@@ -1,6 +1,9 @@
+import Gtk from "gi://Gtk?version=4.0";
 import Rsvg from "gi://Rsvg?version=2.0";
 
-const drawing_area = workbench.builder.get_object("drawing_area");
+const drawing_area = workbench.builder.get_object<Gtk.DrawingArea>(
+  "drawing_area",
+);
 const svg = workbench.resolve("image.svg");
 
 const handle = Rsvg.Handle.new_from_file(svg);
diff --git a/src/Save File/main.js b/src/Save File/main.ts
similarity index 76%
rename from src/Save File/main.js
rename to src/Save File/main.ts
index 4752b7bf..9306ce52 100644
--- a/src/Save File/main.js	
+++ b/src/Save File/main.ts	
@@ -8,14 +8,17 @@ Gio._promisify(
   "replace_contents_finish",
 );
 
-const button = workbench.builder.get_object("button");
+const button = workbench.builder.get_object<Gtk.Button>("button");
 
 async function saveFile() {
   const file_dialog = new Gtk.FileDialog({
     initial_name: "Workbench.txt",
   });
   // "dialog.save" returns a Gio.File you can write to
-  const file = await file_dialog.save(workbench.window, null);
+  // @ts-expect-error this function is not yet detected as async
+  const file = await file_dialog.save(workbench.window, null) as
+    | Gio.File
+    | null;
 
   const contents = new TextEncoder().encode("Hello from Workbench!");
   await file.replace_contents_async(
diff --git a/src/Scale/main.js b/src/Scale/main.ts
similarity index 75%
rename from src/Scale/main.js
rename to src/Scale/main.ts
index fef529be..55005ef2 100644
--- a/src/Scale/main.js
+++ b/src/Scale/main.ts
@@ -1,8 +1,8 @@
 import Gtk from "gi://Gtk?version=4.0";
 
-const scale_one = workbench.builder.get_object("one");
-const scale_two = workbench.builder.get_object("two");
-const scale_button = workbench.builder.get_object("button");
+const scale_one = workbench.builder.get_object<Gtk.Scale>("one");
+const scale_two = workbench.builder.get_object<Gtk.Scale>("two");
+const scale_button = workbench.builder.get_object<Gtk.ScaleButton>("button");
 
 const marks = {
   0: "A",
@@ -18,7 +18,7 @@ const volume_icons = [
 ];
 
 for (const [value, label] of Object.entries(marks)) {
-  scale_two.add_mark(value, Gtk.PositionType.RIGHT, label);
+  scale_two.add_mark(Number(value), Gtk.PositionType.RIGHT, label);
 }
 
 scale_two.set_increments(25, 100);
diff --git a/src/Screencast/main.js b/src/Screencast/main.ts
similarity index 75%
rename from src/Screencast/main.js
rename to src/Screencast/main.ts
index 79a9c3ed..2074aa4a 100644
--- a/src/Screencast/main.js
+++ b/src/Screencast/main.ts
@@ -1,8 +1,17 @@
+import Gdk from "gi://Gdk?version=4.0";
 import Gio from "gi://Gio";
 import Gst from "gi://Gst";
+import GstVideo from "gi://GstVideo?version=1.0";
+import Gtk from "gi://Gtk?version=4.0";
 import Xdp from "gi://Xdp";
 import XdpGtk from "gi://XdpGtk4";
 
+interface GstGtk4PaintableSink extends GstVideo.VideoSink {
+  paintable: Gdk.Paintable;
+  window_height: number;
+  window_width: number;
+}
+
 Gst.init(null);
 
 Gio._promisify(
@@ -15,14 +24,15 @@ Gio._promisify(Xdp.Session.prototype, "start", "start_finish");
 
 const portal = new Xdp.Portal();
 const parent = XdpGtk.parent_new_gtk(workbench.window);
-const output = workbench.builder.get_object("output");
-const button = workbench.builder.get_object("button");
+const output = workbench.builder.get_object<Gtk.Picture>("output");
+const button = workbench.builder.get_object<Gtk.Button>("button");
 
 button.connect("clicked", () => {
   startScreencastSession().catch(console.error);
 });
 
 async function startScreencastSession() {
+  // @ts-expect-error this function is not yet detected as async
   const session = await portal.create_screencast_session(
     Xdp.OutputType.MONITOR,
     Xdp.ScreencastFlags.NONE,
@@ -30,14 +40,16 @@ async function startScreencastSession() {
     Xdp.PersistMode.TRANSIENT,
     null,
     null,
-  );
+  ) as Xdp.Session;
 
   if (!session) {
     console.log("Permission denied");
     return;
   }
 
-  const success = await session.start(parent, null);
+  // @ts-expect-error this function is not yet detected as async
+  const success = await session.start(parent, null) as boolean;
+
   if (!success) {
     console.log("Could not start session");
     return;
@@ -54,7 +66,7 @@ async function startScreencastSession() {
   const paintable_sink = Gst.ElementFactory.make(
     "gtk4paintablesink",
     "paintable_sink",
-  );
+  ) as GstGtk4PaintableSink;
   const glsinkbin = Gst.ElementFactory.make("glsinkbin", "glsinkbin");
 
   // Set up and Link Pipeline
@@ -81,8 +93,7 @@ async function startScreencastSession() {
   source.link(queue);
   queue.link(glsinkbin);
 
-  const paintable = paintable_sink.get_property("paintable");
-  output.paintable = paintable;
+  output.paintable = paintable_sink.paintable;
 
   // Start the pipeline
   pipeline.set_state(Gst.State.PLAYING);
diff --git a/src/Screenshot/main.js b/src/Screenshot/main.ts
similarity index 84%
rename from src/Screenshot/main.js
rename to src/Screenshot/main.ts
index e9942859..0bff44b7 100644
--- a/src/Screenshot/main.js
+++ b/src/Screenshot/main.ts
@@ -1,13 +1,14 @@
 import Adw from "gi://Adw";
 import Gio from "gi://Gio";
+import Gtk from "gi://Gtk?version=4.0";
 import Xdp from "gi://Xdp";
 import XdpGtk from "gi://XdpGtk4";
 
 const portal = new Xdp.Portal();
 const parent = XdpGtk.parent_new_gtk(workbench.window);
 
-const button = workbench.builder.get_object("button");
-const picture = workbench.builder.get_object("picture");
+const button = workbench.builder.get_object<Gtk.Button>("button");
+const picture = workbench.builder.get_object<Gtk.Picture>("picture");
 
 Gio._promisify(
   Xdp.Portal.prototype,
diff --git a/src/Scrolled Window/main.js b/src/Scrolled Window/main.ts
similarity index 80%
rename from src/Scrolled Window/main.js
rename to src/Scrolled Window/main.ts
index 8a2166df..d6517435 100644
--- a/src/Scrolled Window/main.js	
+++ b/src/Scrolled Window/main.ts	
@@ -1,18 +1,23 @@
 import Adw from "gi://Adw";
 import Gtk from "gi://Gtk?version=4.0";
 
-const scrolled_window = workbench.builder.get_object("scrolled_window");
-const container = workbench.builder.get_object("container");
-const toggle_orientation = workbench.builder.get_object("toggle_orientation");
-const button_start = workbench.builder.get_object("button_start");
-const button_end = workbench.builder.get_object("button_end");
+const scrolled_window = workbench.builder.get_object<Gtk.ScrolledWindow>(
+  "scrolled_window",
+);
+const container = workbench.builder.get_object<Gtk.Box>("container");
+const toggle_orientation = workbench.builder.get_object<Gtk.ToggleButton>(
+  "toggle_orientation",
+);
+const button_start = workbench.builder.get_object<Gtk.Button>("button_start");
+const button_end = workbench.builder.get_object<Gtk.Button>("button_end");
 let auto_scrolling = false;
 
 button_start.sensitive = false;
 
 const scrollbars = {
-  [Gtk.Orientation.HORIZONTAL]: scrolled_window.get_hscrollbar(),
-  [Gtk.Orientation.VERTICAL]: scrolled_window.get_vscrollbar(),
+  [Gtk.Orientation.HORIZONTAL]: scrolled_window
+    .get_hscrollbar() as Gtk.Scrollbar,
+  [Gtk.Orientation.VERTICAL]: scrolled_window.get_vscrollbar() as Gtk.Scrollbar,
 };
 
 toggle_orientation.connect("toggled", () => {
diff --git a/src/Search/main.js b/src/Search/main.ts
similarity index 64%
rename from src/Search/main.js
rename to src/Search/main.ts
index 3632d4e0..36f9d9b2 100644
--- a/src/Search/main.js
+++ b/src/Search/main.ts
@@ -1,13 +1,18 @@
 import Adw from "gi://Adw";
+import Gtk from "gi://Gtk?version=4.0";
 
-const button = workbench.builder.get_object("button_search");
-const searchbar = workbench.builder.get_object("searchbar");
-const searchentry = workbench.builder.get_object("searchentry");
-const stack = workbench.builder.get_object("stack");
-const main_page = workbench.builder.get_object("main_page");
-const search_page = workbench.builder.get_object("search_page");
-const status_page = workbench.builder.get_object("status_page");
-const listbox = workbench.builder.get_object("listbox");
+const button = workbench.builder.get_object<Gtk.ToggleButton>("button_search");
+const searchbar = workbench.builder.get_object<Gtk.SearchBar>("searchbar");
+const searchentry = workbench.builder.get_object<Gtk.SearchEntry>(
+  "searchentry",
+);
+const stack = workbench.builder.get_object<Gtk.Stack>("stack");
+const main_page = workbench.builder.get_object<Adw.StatusPage>("main_page");
+const search_page = workbench.builder.get_object<Gtk.ScrolledWindow>(
+  "search_page",
+);
+const status_page = workbench.builder.get_object<Adw.StatusPage>("status_page");
+const listbox = workbench.builder.get_object<Gtk.ListBox>("listbox");
 
 button.connect("clicked", () => {
   searchbar.search_mode_enabled = !searchbar.search_mode_enabled;
diff --git a/src/Select Folder/main.js b/src/Select Folder/main.ts
similarity index 67%
rename from src/Select Folder/main.js
rename to src/Select Folder/main.ts
index 20af5a3b..53f65d3f 100644
--- a/src/Select Folder/main.js	
+++ b/src/Select Folder/main.ts	
@@ -12,12 +12,15 @@ Gio._promisify(
   "select_multiple_folders_finish",
 );
 
-const button_single = workbench.builder.get_object("button_single");
-const button_multiple = workbench.builder.get_object("button_multiple");
+const button_single = workbench.builder.get_object<Gtk.Button>("button_single");
+const button_multiple = workbench.builder.get_object<Gtk.Button>("button_multiple");
 
 async function selectFolder() {
   const dialog_for_folder = new Gtk.FileDialog();
-  const file = await dialog_for_folder.select_folder(workbench.window, null);
+  // @ts-expect-error this function is not detected as async
+  const file = await dialog_for_folder.select_folder(workbench.window, null) as
+    | Gio.File
+    | null;
   const info = file.query_info(
     "standard::name",
     Gio.FileQueryInfoFlags.NONE,
@@ -28,7 +31,11 @@ async function selectFolder() {
 
 async function selectMultipleFolders() {
   const dialog = new Gtk.FileDialog();
-  const folders = await dialog.select_multiple_folders(workbench.window, null);
+  // @ts-expect-error this function is not detected as async
+  const folders = await dialog.select_multiple_folders(
+    workbench.window,
+    null,
+  ) as Gio.ListModel | null;
   const selected_items_count = folders.get_n_items();
   console.log(`${selected_items_count} selected folders`);
 }
diff --git a/src/Separator/main.js b/src/Separator/main.js
deleted file mode 100644
index a396882b..00000000
--- a/src/Separator/main.js
+++ /dev/null
@@ -1,9 +0,0 @@
-import Gio from "gi://Gio";
-
-const picture_one = workbench.builder.get_object("picture_one");
-const picture_two = workbench.builder.get_object("picture_two");
-
-const file = Gio.File.new_for_uri(workbench.resolve("./image.png"));
-
-picture_one.file = file;
-picture_two.file = file;
diff --git a/src/Separator/main.ts b/src/Separator/main.ts
new file mode 100644
index 00000000..13cc8272
--- /dev/null
+++ b/src/Separator/main.ts
@@ -0,0 +1,10 @@
+import Gio from "gi://Gio";
+import Gtk from "gi://Gtk?version=4.0";
+
+const picture_one = workbench.builder.get_object<Gtk.Picture>("picture_one");
+const picture_two = workbench.builder.get_object<Gtk.Picture>("picture_two");
+
+const file = Gio.File.new_for_uri(workbench.resolve("./image.png"));
+
+picture_one.file = file;
+picture_two.file = file;
diff --git a/src/Session Monitor and Inhibit/main.js b/src/Session Monitor and Inhibit/main.ts
similarity index 78%
rename from src/Session Monitor and Inhibit/main.js
rename to src/Session Monitor and Inhibit/main.ts
index cc0406bd..3e57aaa9 100644
--- a/src/Session Monitor and Inhibit/main.js	
+++ b/src/Session Monitor and Inhibit/main.ts	
@@ -1,4 +1,6 @@
+import Adw from "gi://Adw";
 import Gio from "gi://Gio";
+import Gtk from "gi://Gtk?version=4.0";
 import Xdp from "gi://Xdp";
 import XdpGtk from "gi://XdpGtk4";
 
@@ -16,11 +18,11 @@ Gio._promisify(
 
 const portal = new Xdp.Portal();
 const parent = XdpGtk.parent_new_gtk(workbench.window);
-const entry = workbench.builder.get_object("entry");
-const switch_row_logout = workbench.builder.get_object("switch_row_logout");
-const switch_row_idle = workbench.builder.get_object("switch_row_idle");
-const button_start = workbench.builder.get_object("button_start");
-const button_stop = workbench.builder.get_object("button_stop");
+const entry = workbench.builder.get_object<Gtk.Entry>("entry");
+const switch_row_logout = workbench.builder.get_object<Adw.SwitchRow>("switch_row_logout");
+const switch_row_idle = workbench.builder.get_object<Adw.SwitchRow>("switch_row_idle");
+const button_start = workbench.builder.get_object<Gtk.Button>("button_start");
+const button_stop = workbench.builder.get_object<Gtk.Button>("button_stop");
 let ids = [];
 
 button_start.connect("clicked", () => {
@@ -53,7 +55,9 @@ portal.connect(
 );
 
 async function startSession() {
-  const result = await portal.session_monitor_start(parent, null, null);
+  // @ts-expect-error this function is not detected as async
+  const result = await portal.session_monitor_start(parent, null, null) as boolean;
+
   if (result) {
     button_start.sensitive = false;
     button_stop.sensitive = true;
diff --git a/src/Snapshot/main.js b/src/Snapshot/main.ts
similarity index 89%
rename from src/Snapshot/main.js
rename to src/Snapshot/main.ts
index f8d2d256..f0a984c0 100644
--- a/src/Snapshot/main.js
+++ b/src/Snapshot/main.ts
@@ -4,8 +4,8 @@ import Graphene from "gi://Graphene";
 import Gsk from "gi://Gsk";
 import GObject from "gi://GObject";
 
-const box = workbench.builder.get_object("box");
-const label = workbench.builder.get_object("label");
+const box = workbench.builder.get_object<Gtk.Box>("box");
+const label = workbench.builder.get_object<Gtk.Label>("label");
 
 const Chessboard = GObject.registerClass(
   {
@@ -17,6 +17,19 @@ const Chessboard = GObject.registerClass(
     board_size = 8 * this.square_size;
     piece_size = 1.5 * this.square_size;
 
+    black_squares_color: Gdk.RGBA;
+    white_squares_color: Gdk.RGBA;
+    knight_color: Gdk.RGBA;
+    x: number;
+    y: number;
+    initial_x: number;
+    initial_y: number;
+    knight_path: Gsk.Path;
+    knight_stroke: Gsk.Stroke;
+    knight_bounds: Graphene.Rect;
+    gesture: Gtk.GestureDrag;
+    gesture_started: boolean;
+
     constructor(kwargs) {
       super(kwargs);
       // initialize colors
@@ -130,8 +143,8 @@ const Chessboard = GObject.registerClass(
       );
     }
 
-    vfunc_measure(_orientation, _for_size) {
-      return [this.board_size, this.board_size, -1, -1];
+    vfunc_measure() {
+      return [this.board_size, this.board_size, -1, -1] as [number, number, number, number];
     }
   },
 );
diff --git a/src/Source View/main.js b/src/Source View/main.ts
similarity index 88%
rename from src/Source View/main.js
rename to src/Source View/main.ts
index 8f1d1c78..462693e8 100644
--- a/src/Source View/main.js	
+++ b/src/Source View/main.ts	
@@ -4,7 +4,7 @@ import GtkSource from "gi://GtkSource";
 // However, you _have_ to call this once during the startup in your application - e.g. in GApplication::startup
 GtkSource.init();
 
-const buffer = workbench.builder.get_object("buffer");
+const buffer = workbench.builder.get_object<GtkSource.Buffer>("buffer");
 
 // Set the language we want to use
 const language_manager = GtkSource.LanguageManager.get_default();
diff --git a/src/Spell Checker/main.js b/src/Spell Checker/main.ts
similarity index 70%
rename from src/Spell Checker/main.js
rename to src/Spell Checker/main.ts
index 00a7d7b8..6312fbe4 100644
--- a/src/Spell Checker/main.js	
+++ b/src/Spell Checker/main.ts	
@@ -1,10 +1,11 @@
+import Gtk from "gi://Gtk?version=4.0";
 import GtkSource from "gi://GtkSource";
 import Spelling from "gi://Spelling";
 
 GtkSource.init();
 
-const buffer = workbench.builder.get_object("buffer");
-const text_view = workbench.builder.get_object("text_view");
+const buffer = workbench.builder.get_object<GtkSource.Buffer>("buffer");
+const text_view = workbench.builder.get_object<Gtk.TextView>("text_view");
 
 // Spell checking setup
 const checker = Spelling.Checker.get_default();
diff --git a/src/Spin Button/main.js b/src/Spin Button/main.ts
similarity index 86%
rename from src/Spin Button/main.js
rename to src/Spin Button/main.ts
index f9064cbf..10ce4e30 100644
--- a/src/Spin Button/main.js	
+++ b/src/Spin Button/main.ts	
@@ -1,6 +1,7 @@
 import Gtk from "gi://Gtk?version=4.0";
-const hours = workbench.builder.get_object("hours");
-const minutes = workbench.builder.get_object("minutes");
+
+const hours = workbench.builder.get_object<Gtk.SpinButton>("hours");
+const minutes = workbench.builder.get_object<Gtk.SpinButton>("minutes");
 
 hours.text = "00";
 minutes.text = "00";
diff --git a/src/Spinner/main.js b/src/Spinner/main.ts
similarity index 57%
rename from src/Spinner/main.js
rename to src/Spinner/main.ts
index 80d76343..faf448fc 100644
--- a/src/Spinner/main.js
+++ b/src/Spinner/main.ts
@@ -1,5 +1,7 @@
-const button = workbench.builder.get_object("button");
-const spinner = workbench.builder.get_object("spinner");
+import Gtk from "gi://Gtk?version=4.0";
+
+const button = workbench.builder.get_object<Gtk.Button>("button");
+const spinner = workbench.builder.get_object<Gtk.Spinner>("spinner");
 
 button.connect("clicked", () => {
   if (spinner.visible === true) {
diff --git a/src/Stack/main.js b/src/Stack/main.ts
similarity index 79%
rename from src/Stack/main.js
rename to src/Stack/main.ts
index ab55758a..32eefcab 100644
--- a/src/Stack/main.js
+++ b/src/Stack/main.ts
@@ -1,8 +1,9 @@
+import Adw from "gi://Adw";
 import Gtk from "gi://Gtk?version=4.0";
 
-const root_box = workbench.builder.get_object("root_box");
-const stack = workbench.builder.get_object("stack");
-const navigation_row = workbench.builder.get_object("navigation_row");
+const root_box = workbench.builder.get_object<Gtk.Box>("root_box");
+const stack = workbench.builder.get_object<Gtk.Stack>("stack");
+const navigation_row = workbench.builder.get_object<Adw.ComboRow>("navigation_row");
 
 let navigation_widget;
 let separator;
diff --git a/src/Styling with CSS/main.js b/src/Styling with CSS/main.js
deleted file mode 100644
index 1521af99..00000000
--- a/src/Styling with CSS/main.js	
+++ /dev/null
@@ -1,3 +0,0 @@
-const basic_label = workbench.builder.get_object("basic_label");
-
-basic_label.add_css_class("my_custom_class");
diff --git a/src/Styling with CSS/main.ts b/src/Styling with CSS/main.ts
new file mode 100644
index 00000000..9a07c853
--- /dev/null
+++ b/src/Styling with CSS/main.ts	
@@ -0,0 +1,5 @@
+import Gtk from "gi://Gtk?version=4.0";
+
+const basic_label = workbench.builder.get_object<Gtk.Label>("basic_label");
+
+basic_label.add_css_class("my_custom_class");
diff --git a/src/Switch/main.js b/src/Switch/main.js
deleted file mode 100644
index 078540d0..00000000
--- a/src/Switch/main.js
+++ /dev/null
@@ -1,15 +0,0 @@
-const switch_on = workbench.builder.get_object("switch_on");
-const label_on = workbench.builder.get_object("label_on");
-
-const switch_off = workbench.builder.get_object("switch_off");
-const label_off = workbench.builder.get_object("label_off");
-
-switch_on.connect("notify::active", () => {
-  label_on.label = switch_on.active ? "On" : "Off";
-  switch_off.active = !switch_on.active;
-});
-
-switch_off.connect("notify::active", () => {
-  label_off.label = switch_off.active ? "On" : "Off";
-  switch_on.active = !switch_off.active;
-});
diff --git a/src/Switch/main.ts b/src/Switch/main.ts
new file mode 100644
index 00000000..740ebe84
--- /dev/null
+++ b/src/Switch/main.ts
@@ -0,0 +1,17 @@
+import Gtk from "gi://Gtk?version=4.0";
+
+const switch_on = workbench.builder.get_object<Gtk.Switch>("switch_on");
+const label_on = workbench.builder.get_object<Gtk.Label>("label_on");
+
+const switch_off = workbench.builder.get_object<Gtk.Switch>("switch_off");
+const label_off = workbench.builder.get_object<Gtk.Label>("label_off");
+
+switch_on.connect("notify::active", () => {
+  label_on.label = switch_on.active ? "On" : "Off";
+  switch_off.active = !switch_on.active;
+});
+
+switch_off.connect("notify::active", () => {
+  label_off.label = switch_off.active ? "On" : "Off";
+  switch_on.active = !switch_off.active;
+});
diff --git a/src/Tab View/main.js b/src/Tab View/main.ts
similarity index 63%
rename from src/Tab View/main.js
rename to src/Tab View/main.ts
index 66ca8274..e8e27c27 100644
--- a/src/Tab View/main.js	
+++ b/src/Tab View/main.ts	
@@ -1,9 +1,10 @@
+import Gtk from "gi://Gtk?version=4.0";
 import Adw from "gi://Adw";
 
-const tab_view = workbench.builder.get_object("tab_view");
-const button_new_tab = workbench.builder.get_object("button_new_tab");
-const overview = workbench.builder.get_object("overview");
-const button_overview = workbench.builder.get_object("button_overview");
+const tab_view = workbench.builder.get_object<Adw.TabView>("tab_view");
+const button_new_tab = workbench.builder.get_object<Gtk.Button>("button_new_tab");
+const overview = workbench.builder.get_object<Adw.TabOverview>("overview");
+const button_overview = workbench.builder.get_object<Gtk.Button>("button_overview");
 let tab_count = 1;
 
 overview.connect("create-tab", () => {
diff --git a/src/Text Colors/main.js b/src/Text Colors/main.ts
similarity index 93%
rename from src/Text Colors/main.js
rename to src/Text Colors/main.ts
index 5b51cb42..6850d59d 100644
--- a/src/Text Colors/main.js	
+++ b/src/Text Colors/main.ts	
@@ -1,8 +1,9 @@
 // Pango is a text layout library. It can e.g. be used for formatting text
 // https://gjs-docs.gnome.org/pango10~1.0/
+import Gtk from "gi://Gtk?version=4.0";
 import Pango from "gi://Pango";
 
-const label = workbench.builder.get_object("label");
+const label = workbench.builder.get_object<Gtk.Label>("label");
 label.connect("notify::label", updateAttributes);
 updateAttributes();
 
diff --git a/src/Text Fields/main.js b/src/Text Fields/main.ts
similarity index 73%
rename from src/Text Fields/main.js
rename to src/Text Fields/main.ts
index 4a8bf930..ae16fe2d 100644
--- a/src/Text Fields/main.js	
+++ b/src/Text Fields/main.ts	
@@ -1,10 +1,11 @@
 import Adw from "gi://Adw";
+import GObject from "gi://GObject?version=2.0";
 import Gtk from "gi://Gtk?version=4.0";
 
-const entry = workbench.builder.get_object("entry");
-const entry_placeholder = workbench.builder.get_object("entry_placeholder");
-const entry_icon = workbench.builder.get_object("entry_icon");
-const entry_progress = workbench.builder.get_object("entry_progress");
+const entry = workbench.builder.get_object<Gtk.Entry>("entry");
+const entry_placeholder = workbench.builder.get_object<Gtk.Entry>("entry_placeholder");
+const entry_icon = workbench.builder.get_object<Gtk.Entry>("entry_icon");
+const entry_progress = workbench.builder.get_object<Gtk.Entry>("entry_progress");
 
 entry.connect("activate", () => {
   console.log(`Regular Entry: "${entry.text}" entered`);
@@ -52,12 +53,12 @@ animation.connect("done", () => {
   animation.reset();
 });
 
-const entry_completion = workbench.builder.get_object("entry_completion");
+const entry_completion = workbench.builder.get_object<Gtk.Entry>("entry_completion");
 const completion = new Gtk.EntryCompletion();
 
 entry_completion.completion = completion;
 
-const list_store = Gtk.ListStore.new([String]);
+const list_store = Gtk.ListStore.new([GObject.TYPE_STRING]);
 const words = ["a", "app", "apple", "apples", "applets", "application"];
 words.forEach((word) => {
   const iter = list_store.append();
@@ -69,11 +70,11 @@ completion.set_text_column(0);
 completion.inline_completion = true;
 completion.inline_selection = true;
 
-const entry_password = workbench.builder.get_object("entry_password");
-const entry_confirm_password = workbench.builder.get_object(
+const entry_password = workbench.builder.get_object<Gtk.PasswordEntry>("entry_password");
+const entry_confirm_password = workbench.builder.get_object<Gtk.PasswordEntry>(
   "entry_confirm_password",
 );
-const label_password = workbench.builder.get_object("label_password");
+const label_password = workbench.builder.get_object<Gtk.Label>("label_password");
 
 entry_password.connect("activate", () => {
   label_password.label = validate_password(
diff --git a/src/Text View/main.js b/src/Text View/main.ts
similarity index 90%
rename from src/Text View/main.js
rename to src/Text View/main.ts
index 309325b0..bd576805 100644
--- a/src/Text View/main.js	
+++ b/src/Text View/main.ts	
@@ -1,11 +1,12 @@
 import Gdk from "gi://Gdk?version=4.0";
-
-const textview = workbench.builder.get_object("textview");
-const select = workbench.builder.get_object("select");
-const copy = workbench.builder.get_object("copy");
-const cut = workbench.builder.get_object("cut");
-const clear = workbench.builder.get_object("clear");
-const paste = workbench.builder.get_object("paste");
+import Gtk from "gi://Gtk?version=4.0";
+
+const textview = workbench.builder.get_object<Gtk.TextView>("textview");
+const select = workbench.builder.get_object<Gtk.Button>("select");
+const copy = workbench.builder.get_object<Gtk.Button>("copy");
+const cut = workbench.builder.get_object<Gtk.Button>("cut");
+const clear = workbench.builder.get_object<Gtk.Button>("clear");
+const paste = workbench.builder.get_object<Gtk.Button>("paste");
 
 const display = Gdk.Display.get_default();
 const clipboard = display.get_clipboard();
diff --git a/src/Toasts/main.js b/src/Toasts/main.ts
similarity index 77%
rename from src/Toasts/main.js
rename to src/Toasts/main.ts
index fe92a0ad..e7709980 100644
--- a/src/Toasts/main.js
+++ b/src/Toasts/main.ts
@@ -1,10 +1,11 @@
 import Adw from "gi://Adw";
 import GLib from "gi://GLib";
 import Gio from "gi://Gio";
+import Gtk from "gi://Gtk?version=4.0";
 
-const overlay = workbench.builder.get_object("overlay");
+const overlay = workbench.builder.get_object<Adw.ToastOverlay>("overlay");
 
-const button_simple = workbench.builder.get_object("button_simple");
+const button_simple = workbench.builder.get_object<Gtk.Button>("button_simple");
 function simple() {
   const toast = new Adw.Toast({
     title: "Toasts are delicious!",
@@ -30,7 +31,7 @@ function advanced() {
   overlay.add_toast(toast);
 }
 
-workbench.builder.get_object("button_advanced").connect("clicked", advanced);
+workbench.builder.get_object<Gtk.Button>("button_advanced").connect("clicked", advanced);
 
 const action_console = new Gio.SimpleAction({
   name: "undo",
diff --git a/src/Toggle Button/main.js b/src/Toggle Button/main.ts
similarity index 75%
rename from src/Toggle Button/main.js
rename to src/Toggle Button/main.ts
index 870047a9..b5902d11 100644
--- a/src/Toggle Button/main.js	
+++ b/src/Toggle Button/main.ts	
@@ -1,3 +1,5 @@
+import Gtk from "gi://Gtk?version=4.0";
+
 const buttons = {
   button_no_look: "Don't look",
   button_look: "Look",
@@ -7,7 +9,7 @@ const buttons = {
 };
 
 for (const [id, name] of Object.entries(buttons)) {
-  const button = workbench.builder.get_object(id);
+  const button = workbench.builder.get_object<Gtk.ToggleButton>(id);
   button.connect("notify::active", () => {
     console.log(`${name} ${button.active ? "On" : "Off"}`);
   });
diff --git a/src/Tooltip/main.js b/src/Tooltip/main.ts
similarity index 86%
rename from src/Tooltip/main.js
rename to src/Tooltip/main.ts
index f30578d2..d0ca6aad 100644
--- a/src/Tooltip/main.js
+++ b/src/Tooltip/main.ts
@@ -1,6 +1,6 @@
 import Gtk from "gi://Gtk?version=4.0";
 
-const button = workbench.builder.get_object("button");
+const button = workbench.builder.get_object<Gtk.Button>("button");
 
 button.connect("query-tooltip", (_self, _x, _y, _mode, tooltip) => {
   const custom_tooltip = new Gtk.Box({ spacing: 6 });
diff --git a/src/Video/main.js b/src/Video/main.ts
similarity index 86%
rename from src/Video/main.js
rename to src/Video/main.ts
index 28ff627d..f0cc3ecf 100644
--- a/src/Video/main.js
+++ b/src/Video/main.ts
@@ -1,7 +1,7 @@
 import Gio from "gi://Gio";
 import Gtk from "gi://Gtk?version=4.0";
 
-const video = workbench.builder.get_object("video");
+const video = workbench.builder.get_object<Gtk.Video>("video");
 
 video.file = Gio.File.new_for_uri(workbench.resolve("./workbench-video.mp4"));
 
diff --git a/src/View Switcher/main.js b/src/View Switcher/main.ts
similarity index 71%
rename from src/View Switcher/main.js
rename to src/View Switcher/main.ts
index 69321511..006c25c7 100644
--- a/src/View Switcher/main.js	
+++ b/src/View Switcher/main.ts	
@@ -1,8 +1,12 @@
 import Adw from "gi://Adw";
 import Gtk from "gi://Gtk?version=4.0";
 
-const notifications_page = workbench.builder.get_object("page3");
-const notification_list = workbench.builder.get_object("notification_list");
+const notifications_page = workbench.builder.get_object<Adw.ViewStackPage>(
+  "page3",
+);
+const notification_list = workbench.builder.get_object<Gtk.ListBox>(
+  "notification_list",
+);
 
 const notification_count = 5;
 notifications_page.badge_number = notification_count;
@@ -14,10 +18,10 @@ for (let i = 0; i < notification_count; i++) {
   });
 
   const button = new Gtk.Button({
-    halign: "center",
-    valign: "center",
-    margin_top: "10",
-    margin_bottom: "10",
+    halign: Gtk.Align.CENTER,
+    valign: Gtk.Align.CENTER,
+    margin_top: 10,
+    margin_bottom: 10,
     icon_name: "check-plain-symbolic",
   });
 
diff --git a/src/Wallpaper/main.js b/src/Wallpaper/main.ts
similarity index 78%
rename from src/Wallpaper/main.js
rename to src/Wallpaper/main.ts
index 8f768887..e5b3f9f4 100644
--- a/src/Wallpaper/main.js
+++ b/src/Wallpaper/main.ts
@@ -1,16 +1,18 @@
 import Gio from "gi://Gio";
 import Xdp from "gi://Xdp";
 import XdpGtk from "gi://XdpGtk4";
+import Gtk from "gi://Gtk?version=4.0";
 
 Gio._promisify(Xdp.Portal.prototype, "set_wallpaper", "set_wallpaper_finish");
 
 const portal = new Xdp.Portal();
 const parent = XdpGtk.parent_new_gtk(workbench.window);
-const button = workbench.builder.get_object("button");
+const button = workbench.builder.get_object<Gtk.Button>("button");
 
 const uri = workbench.resolve("./wallpaper.png");
 
 async function onClicked() {
+  // @ts-expect-error this function is not correctly detected as async
   const success = await portal.set_wallpaper(
     parent,
     uri,
@@ -18,7 +20,7 @@ async function onClicked() {
       Xdp.WallpaperFlags.BACKGROUND |
       Xdp.WallpaperFlags.LOCKSCREEN,
     null,
-  );
+  ) as boolean;
 
   if (success) {
     console.log("Wallpaper set successfully");
diff --git a/src/Web View/main.js b/src/Web View/main.ts
similarity index 78%
rename from src/Web View/main.js
rename to src/Web View/main.ts
index 1d77a36e..f537892d 100644
--- a/src/Web View/main.js	
+++ b/src/Web View/main.ts	
@@ -1,13 +1,14 @@
 import GLib from "gi://GLib";
 import GObject from "gi://GObject";
+import Gtk from "gi://Gtk?version=4.0";
 import WebKit from "gi://WebKit";
 
-const button_back = workbench.builder.get_object("button_back");
-const button_forward = workbench.builder.get_object("button_forward");
-const button_reload = workbench.builder.get_object("button_reload");
-const button_stop = workbench.builder.get_object("button_stop");
-const url_bar = workbench.builder.get_object("url_bar");
-const web_view = workbench.builder.get_object("web_view");
+const button_back = workbench.builder.get_object<Gtk.Button>("button_back");
+const button_forward = workbench.builder.get_object<Gtk.Button>("button_forward");
+const button_reload = workbench.builder.get_object<Gtk.Button>("button_reload");
+const button_stop = workbench.builder.get_object<Gtk.Button>("button_stop");
+const url_bar = workbench.builder.get_object<Gtk.Entry>("url_bar");
+const web_view = workbench.builder.get_object<WebKit.WebView>("web_view");
 
 // URL bar displays the current loaded page
 web_view.bind_property(
diff --git a/src/WebSocket Client/main.js b/src/WebSocket Client/main.ts
similarity index 81%
rename from src/WebSocket Client/main.js
rename to src/WebSocket Client/main.ts
index 5592ad10..52b7c390 100644
--- a/src/WebSocket Client/main.js	
+++ b/src/WebSocket Client/main.ts	
@@ -1,5 +1,6 @@
 import GLib from "gi://GLib";
 import Gio from "gi://Gio";
+import Gtk from "gi://Gtk?version=4.0";
 import Soup from "gi://Soup";
 
 Gio._promisify(
@@ -9,15 +10,15 @@ Gio._promisify(
 );
 
 const text_decoder = new TextDecoder("utf-8");
-const text_encoder = new TextEncoder("utf-8");
+const text_encoder = new TextEncoder();
 
 const { builder } = workbench;
 
-const button_connect = builder.get_object("button_connect");
-const button_disconnect = builder.get_object("button_disconnect");
-const button_send = builder.get_object("button_send");
-const entry_url = builder.get_object("entry_url");
-const entry_message = builder.get_object("entry_message");
+const button_connect = builder.get_object<Gtk.Button>("button_connect");
+const button_disconnect = builder.get_object<Gtk.Button>("button_disconnect");
+const button_send = builder.get_object<Gtk.Button>("button_send");
+const entry_url = builder.get_object<Gtk.Entry>("entry_url");
+const entry_message = builder.get_object<Gtk.Entry>("entry_message");
 
 let connection = null;
 
diff --git a/src/Welcome/main.js b/src/Welcome/main.js
deleted file mode 100644
index 4972952c..00000000
--- a/src/Welcome/main.js
+++ /dev/null
@@ -1,30 +0,0 @@
-import Adw from "gi://Adw";
-import Gio from "gi://Gio";
-import Gtk from "gi://Gtk?version=4.0";
-
-Gio._promisify(Adw.AlertDialog.prototype, "choose", "choose_finish");
-
-const box = workbench.builder.get_object("subtitle");
-
-const button = new Gtk.Button({
-  label: "Press me",
-  margin_top: 6,
-  css_classes: ["suggested-action"],
-});
-button.connect("clicked", () => {
-  greet().catch(console.error);
-});
-box.append(button);
-
-console.log("Welcome to Workbench!");
-
-async function greet() {
-  const dialog = new Adw.AlertDialog({
-    body: "Hello World!",
-  });
-
-  dialog.add_response("ok", "OK");
-
-  const response = await dialog.choose(workbench.window, null);
-  console.log(response);
-}