From 219d0fb0ab8f39679f31fc2630da47050e191514 Mon Sep 17 00:00:00 2001
From: SpanishPear <shrey.somaiya@gmail.com>
Date: Wed, 6 Sep 2023 22:11:31 +1000
Subject: [PATCH] yew 0.20 upgrade but run will panic

---
 crates/mipsy_web/Cargo.toml                   |  6 +-
 crates/mipsy_web/index.html                   | 37 ++++++++--
 crates/mipsy_web/src/bin/app.rs               |  3 +-
 crates/mipsy_web/src/bin/worker.rs            |  7 +-
 crates/mipsy_web/src/components/decompiled.rs |  6 +-
 crates/mipsy_web/src/components/navbar.rs     | 16 ++---
 crates/mipsy_web/src/components/registers.rs  | 33 ++++-----
 .../src/components/settings_modal.rs          | 14 ++--
 crates/mipsy_web/src/pages/main/app.rs        | 46 ++++++-------
 crates/mipsy_web/src/state/config.rs          | 14 ++--
 crates/mipsy_web/src/state/update.rs          | 10 +--
 crates/mipsy_web/src/worker.rs                | 68 ++++++++++++-------
 12 files changed, 145 insertions(+), 115 deletions(-)

diff --git a/crates/mipsy_web/Cargo.toml b/crates/mipsy_web/Cargo.toml
index 861c3334..e41792fc 100644
--- a/crates/mipsy_web/Cargo.toml
+++ b/crates/mipsy_web/Cargo.toml
@@ -9,8 +9,8 @@ crate-type = ["cdylib", "rlib"]
 
 
 [dependencies]
-yew = "0.19.3"
-yew-agent = "0.1.0"
+yew = { version = "0.20", features = ["csr"] }
+yew-agent = "0.2.0"
 gloo-file = "0.2.0"
 gloo-utils = { version = "0.1.5", features = ["serde"]}
 web-sys = { version="0.3.55", features=["Element", "EventTarget", "HtmlElement", "HtmlSelectElement"] }
@@ -26,7 +26,7 @@ wasm-logger = "0.2.0"
 git-version = "0.3.5"
 derivative = "2.2.0"
 gloo-console = "0.2.1"
-bounce = "0.3.0"
+bounce = "0.7.0"
 serde_json = "1.0.82"
 
 # [profile.release]
diff --git a/crates/mipsy_web/index.html b/crates/mipsy_web/index.html
index 0f8b07a2..6c4373ca 100644
--- a/crates/mipsy_web/index.html
+++ b/crates/mipsy_web/index.html
@@ -12,15 +12,40 @@
     <meta name="viewport" content="width=device-width, initial-scale=1" />
 
     <script>
-      function split_setup() {
-        Split(["#file_data", "#information"], {
-          sizes: [70, 30],
-        });
-        Split(["#regs", "#output"], {
-          direction: "vertical",
+      function waitForElm(selector) {
+        return new Promise(resolve => {
+            if (document.querySelector(selector)) {
+                return resolve(document.querySelector(selector));
+            }
+
+            const observer = new MutationObserver(mutations => {
+                if (document.querySelector(selector)) {
+                    observer.disconnect();
+                    resolve(document.querySelector(selector));
+                }
+            });
+
+            observer.observe(document.body, {
+                childList: true,
+                subtree: true
+            });
         });
       };
 
+      function split_setup() {
+        // wait for the elements to be created
+        // then split them
+        waitForElm("#file_data").then(() => {
+          Split(["#file_data", "#information"], {
+            sizes: [70, 30],
+          });
+          Split(["#regs", "#output"], {
+            direction: "vertical",
+          });
+
+        })
+      };
+
       function alarm() {
           console.error("AHHHHHHHHHHH");
       };
diff --git a/crates/mipsy_web/src/bin/app.rs b/crates/mipsy_web/src/bin/app.rs
index 03eefec4..4f88b17f 100644
--- a/crates/mipsy_web/src/bin/app.rs
+++ b/crates/mipsy_web/src/bin/app.rs
@@ -14,7 +14,8 @@ pub fn app_wrapper() -> Html {
 fn main() {
     let document = web_sys::window().unwrap().document().unwrap();
     let entry_point = document.get_element_by_id("yew_app").unwrap();
-    yew::start_app_in_element::<AppWrapper>(entry_point);
+
+    yew::Renderer::<AppWrapper>::with_root(entry_point).render();
 
     wasm_logger::init(wasm_logger::Config::default());
 
diff --git a/crates/mipsy_web/src/bin/worker.rs b/crates/mipsy_web/src/bin/worker.rs
index fb3f45e2..d6eb62b2 100644
--- a/crates/mipsy_web/src/bin/worker.rs
+++ b/crates/mipsy_web/src/bin/worker.rs
@@ -1,7 +1,8 @@
-use mipsy_web::worker::Worker;
+use mipsy_web::worker::MipsyWebWorker;
 use wasm_logger::Config;
-use yew_agent::Threaded;
+use yew_agent::PublicWorker;
+
 fn main() {
     wasm_logger::init(Config::default());
-    Worker::register();
+    MipsyWebWorker::register();
 }
diff --git a/crates/mipsy_web/src/components/decompiled.rs b/crates/mipsy_web/src/components/decompiled.rs
index a3ed2755..0bbebf14 100644
--- a/crates/mipsy_web/src/components/decompiled.rs
+++ b/crates/mipsy_web/src/components/decompiled.rs
@@ -1,9 +1,9 @@
 use crate::{
     state::state::{ErrorType::RuntimeError, State},
-    worker::{Worker, WorkerRequest},
+    worker::{MipsyWebWorker, WorkerRequest},
 };
 use derivative::Derivative;
-use yew::{classes, function_component, html, Callback, Properties, UseStateHandle};
+use yew::{classes, function_component, html, Html, Callback, Properties, UseStateHandle};
 use yew_agent::UseBridgeHandle;
 
 #[derive(Properties, Derivative)]
@@ -14,7 +14,7 @@ pub struct DecompiledProps {
     pub state: UseStateHandle<State>,
 
     #[derivative(PartialEq = "ignore")]
-    pub worker: UseBridgeHandle<Worker>,
+    pub worker: UseBridgeHandle<MipsyWebWorker>,
 }
 
 #[function_component(DecompiledCode)]
diff --git a/crates/mipsy_web/src/components/navbar.rs b/crates/mipsy_web/src/components/navbar.rs
index a9ec18d1..9688888d 100644
--- a/crates/mipsy_web/src/components/navbar.rs
+++ b/crates/mipsy_web/src/components/navbar.rs
@@ -1,12 +1,12 @@
 use crate::{
     pages::main::app::NUM_INSTR_BEFORE_RESPONSE,
     state::state::{DisplayedCodeTab, ErrorType, MipsState, RunningState, State},
-    worker::{FileInformation, Worker, WorkerRequest},
+    worker::{FileInformation, MipsyWebWorker, WorkerRequest},
 };
 use derivative::Derivative;
 use log::info;
 use yew::{prelude::*, Html};
-use yew_agent::{Agent, UseBridgeHandle};
+use yew_agent::{Worker, UseBridgeHandle};
 
 #[derive(Properties, Derivative)]
 #[derivative(PartialEq)]
@@ -20,7 +20,7 @@ pub struct NavBarProps {
     pub state: UseStateHandle<State>,
     pub is_saved: UseStateHandle<bool>,
     #[derivative(PartialEq = "ignore")]
-    pub worker: UseBridgeHandle<Worker>,
+    pub worker: UseBridgeHandle<MipsyWebWorker>,
     pub filename: UseStateHandle<Option<String>>,
     pub file: UseStateHandle<Option<String>>,
     pub show_tab: UseStateHandle<DisplayedCodeTab>,
@@ -94,7 +94,7 @@ fn icons(props: &NavBarProps) -> Vec<Icon> {
                             filename: filename.as_deref().unwrap_or("Untitled").to_string(),
                             file: file.as_deref().unwrap_or("").to_string(),
                         };
-                        let input = <Worker as Agent>::Input::Run(
+                        let input = <MipsyWebWorker as Worker>::Input::Run(
                             MipsState {
                                 is_stepping: false,
                                 ..curr.mips_state.clone()
@@ -134,7 +134,7 @@ fn icons(props: &NavBarProps) -> Vec<Icon> {
                                 ..curr.clone()
                             }));
                             let input =
-                                <Worker as Agent>::Input::ResetRuntime(curr.mips_state.clone());
+                                <MipsyWebWorker as Worker>::Input::ResetRuntime(curr.mips_state.clone());
                             worker.send(input);
                         }
                         State::Error(ErrorType::RuntimeError(curr)) => {
@@ -145,7 +145,7 @@ fn icons(props: &NavBarProps) -> Vec<Icon> {
                                 input_needed: None,
                             }));
                             let input =
-                                <Worker as Agent>::Input::ResetRuntime(curr.mips_state.clone());
+                                <MipsyWebWorker as Worker>::Input::ResetRuntime(curr.mips_state.clone());
                             worker.send(input);
                         }
 
@@ -219,7 +219,7 @@ fn icons(props: &NavBarProps) -> Vec<Icon> {
                             file: file.as_deref().unwrap_or("").to_string(),
                         };
                         let input =
-                            <Worker as Agent>::Input::Run(new_mips_state, -1, file_information);
+                            <MipsyWebWorker as Worker>::Input::Run(new_mips_state, -1, file_information);
                         worker.send(input);
                     } else {
                         info!("No File loaded, cannot step");
@@ -258,7 +258,7 @@ fn icons(props: &NavBarProps) -> Vec<Icon> {
                             file: file.as_deref().unwrap_or("").to_string(),
                         };
                         let input =
-                            <Worker as Agent>::Input::Run(new_mips_state, 1, file_information);
+                            <MipsyWebWorker as Worker>::Input::Run(new_mips_state, 1, file_information);
                         worker.send(input);
                     } else {
                         info!("No File loaded, cannot step");
diff --git a/crates/mipsy_web/src/components/registers.rs b/crates/mipsy_web/src/components/registers.rs
index bd17a303..9ba37644 100644
--- a/crates/mipsy_web/src/components/registers.rs
+++ b/crates/mipsy_web/src/components/registers.rs
@@ -2,12 +2,12 @@ use crate::components::data_segment::{FP_COLOR, SP_COLOR};
 use crate::components::decompiled::{StopIconFilled, StopIconOutline};
 use crate::state::config::{MipsyWebConfig, RegisterBase};
 use crate::state::state::{ErrorType, RegisterTab, State};
-use crate::worker::{Worker, WorkerRequest};
+use crate::worker::{MipsyWebWorker, WorkerRequest};
 use bounce::use_atom;
 use derivative::Derivative;
 use mipsy_lib::compile::breakpoints::{TargetAction, WatchpointTarget};
 use mipsy_lib::{Register, Safe, KDATA_BOT, TEXT_BOT};
-use yew::{function_component, html, Callback, Properties, UseStateHandle};
+use yew::{function_component, html, Html, Callback, Properties, UseStateHandle};
 use yew_agent::UseBridgeHandle;
 
 const MIXED_BASE_MIN_ADDRESS: u32 = TEXT_BOT - 1024;
@@ -20,7 +20,13 @@ pub struct RegisterProps {
     pub tab: UseStateHandle<RegisterTab>,
 
     #[derivative(PartialEq = "ignore")]
-    pub worker: UseBridgeHandle<Worker>,
+    pub worker: UseBridgeHandle<MipsyWebWorker>,
+}
+
+pub fn register_is_uncommon(index: usize) -> bool {
+    index == usize::from(Register::K0.to_number()) ||
+        index == usize::from(Register::K1.to_number()) ||
+        index == usize::from(Register::Gp.to_number())
 }
 
 #[function_component(Registers)]
@@ -33,18 +39,15 @@ pub fn render_running_registers(props: &RegisterProps) -> Html {
 
     let config = use_atom::<MipsyWebConfig>();
 
-    let show_uninitialised_registers = match &*props.tab {
-        RegisterTab::AllRegisters => true,
-        _ => false,
-    };
+    let show_uninitialised_registers = matches!(&*props.tab, RegisterTab::AllRegisters);
 
     let registers = mips_state
         .clone()
-        .map(|state| state.register_values.clone())
+        .map(|state| state.register_values)
         .unwrap_or_else(|| vec![Safe::Uninitialised; 32]);
 
     let previous_registers = mips_state
-        .map(|state| state.previous_registers.clone())
+        .map(|state| state.previous_registers)
         .unwrap_or_else(|| vec![Safe::Uninitialised; 32]);
 
     html! {
@@ -68,16 +71,8 @@ pub fn render_running_registers(props: &RegisterProps) -> Html {
             <tbody>
             {
                 for registers.iter().enumerate().map(|(index, item)| {
-                    if !show_uninitialised_registers &&
-                        config.hide_uncommon_registers &&
-                        (index == usize::from(Register::K0.to_number()) ||
-                         index == usize::from(Register::K1.to_number()) ||
-                         index == usize::from(Register::Gp.to_number())
-                        )
-                    {
-                        html!{}
-                    }
-                    else if !show_uninitialised_registers && item == &Safe::Uninitialised {
+                    // dont' show uninit registers, or uncommon K0, K1, GP 
+                    if !show_uninitialised_registers && !register_is_uncommon(index) && item.as_option().is_some() {
                         html!{}
                     }
                     else {
diff --git a/crates/mipsy_web/src/components/settings_modal.rs b/crates/mipsy_web/src/components/settings_modal.rs
index 83744cf6..0598c958 100644
--- a/crates/mipsy_web/src/components/settings_modal.rs
+++ b/crates/mipsy_web/src/components/settings_modal.rs
@@ -90,7 +90,7 @@ pub fn render_modal(props: &ModalProps) -> Html {
                                 label={"font size"}
                                 hide_label={true}
                                 // TODO - config selected, min max and font step
-                                selected_value={(*config).font_size.to_string()}
+                                selected_value={config.font_size.to_string()}
                                 options={
                                     (10..=70_i32)
                                         .step_by(2)
@@ -132,7 +132,7 @@ pub fn render_modal(props: &ModalProps) -> Html {
                                 })}
                                 label={"tab size"}
                                 hide_label={true}
-                                selected_value={(*config).tab_size.to_string()}
+                                selected_value={config.tab_size.to_string()}
                                 // TODO - config selected, min max and font step
                                 options={
                                     (2..=8_i32)
@@ -162,7 +162,7 @@ pub fn render_modal(props: &ModalProps) -> Html {
                             })}
                             label={"register base"}
                             hide_label={true}
-                            selected_value={(*config).register_base.to_string()}
+                            selected_value={config.register_base.to_string()}
                             options={
                                 vec!["Hexadecimal".to_string(), "Decimal".to_string(), "Binary".to_string(), "Mixed".to_string()]
                             }
@@ -198,7 +198,7 @@ pub fn render_modal(props: &ModalProps) -> Html {
                             })}}
                             label={"monaco theme"}
                             hide_label={true}
-                            selected_value={(*config).monaco_theme.clone()}
+                            selected_value={config.monaco_theme.clone()}
                             options={
                                 vec![
                                     "vs".to_string(),
@@ -226,7 +226,7 @@ pub fn render_modal(props: &ModalProps) -> Html {
                                 })
 
                             }
-                            color={(&*config.font_color.0).to_string()}
+                            color={(*config.font_color.0).to_string()}
                         />
                         <button
                             type="button"
@@ -238,7 +238,7 @@ pub fn render_modal(props: &ModalProps) -> Html {
                                         font_color: FontColor::default(),
                                         ..(*config).clone()
                                     });
-                                    crate::update_font_color(&*FontColor::default().0);
+                                    crate::update_font_color(&FontColor::default().0);
                                 })
                             }
                         >
@@ -267,7 +267,7 @@ pub fn render_modal(props: &ModalProps) -> Html {
                                     crate::update_primary_color(&val);
                                 })
                             }
-                            color={(&*config.primary_color.0).to_string()}
+                            color={(*config.primary_color.0).to_string()}
                         />
 
                         <button
diff --git a/crates/mipsy_web/src/pages/main/app.rs b/crates/mipsy_web/src/pages/main/app.rs
index 73489832..aac6d573 100644
--- a/crates/mipsy_web/src/pages/main/app.rs
+++ b/crates/mipsy_web/src/pages/main/app.rs
@@ -10,7 +10,7 @@ use crate::{
         state::{DisplayedCodeTab, ErrorType, MipsState, RegisterTab, RunningState, State},
         update,
     },
-    worker::{FileInformation, Worker, WorkerRequest},
+    worker::{FileInformation, MipsyWebWorker, WorkerRequest},
 };
 use bounce::use_atom;
 use gloo_console::log;
@@ -37,7 +37,6 @@ pub const NUM_INSTR_BEFORE_RESPONSE: i32 = 40;
 
 #[function_component(App)]
 pub fn render_app() -> Html {
-    let worker = Rc::new(RefCell::new(None));
     /* State Handlers */
     let state: UseStateHandle<State> = use_state_eq(|| State::NoFile);
     let display_modal: UseStateHandle<bool> = use_state_eq(|| false);
@@ -61,42 +60,38 @@ pub fn render_app() -> Html {
     });
     let monaco_cursor = use_atom::<MonacoCursor>();
 
-    if worker.borrow().is_none() {
-        *worker.borrow_mut() = {
+    let worker  = {
             let state = state.clone();
-            let show_tab = show_code_tab.clone();
+            let show_code_tab = show_code_tab.clone();
             let show_io = show_io.clone();
             let file = file.clone();
             let input_ref = input_ref.clone();
-            let worker = worker.clone();
             let is_saved = is_saved.clone();
             let filename = filename.clone();
             let monaco_cursor = monaco_cursor.clone();
-            Some(use_bridge(move |response| {
+            use_bridge(move |response| {
                 let state = state.clone();
-                let show_tab = show_tab.clone();
+                let show_code_tab = show_code_tab.clone();
                 let show_io = show_io.clone();
                 let file = file.clone();
                 let input_ref = input_ref.clone();
-                let worker = worker.clone();
                 let is_saved = is_saved.clone();
                 let filename = filename.clone();
                 let monaco_cursor = monaco_cursor.clone();
                 update::handle_response_from_worker(
                     state,
-                    show_tab,
+                    show_code_tab,
                     show_io,
                     file,
                     filename,
                     response,
-                    worker,
                     input_ref,
                     is_saved,
                     monaco_cursor,
-                )
-            }))
-        };
-    }
+                );
+            })
+    };
+    
 
     let config = use_atom::<MipsyWebConfig>();
 
@@ -340,7 +335,7 @@ pub fn render_app() -> Html {
                             });
                             log!("sending to worker");
 
-                            worker.borrow().as_ref().unwrap().send(input);
+                            worker.send(input);
                         }
 
                         Err(_e) => {}
@@ -374,9 +369,6 @@ pub fn render_app() -> Html {
                 crate::set_localstorage_filename(filename);
                 file.set(Some(updated_content));
                 worker
-                    .borrow()
-                    .as_ref()
-                    .unwrap()
                     .send(WorkerRequest::CompileCode(FileInformation {
                         filename: filename.to_string(),
                         file: clone,
@@ -391,11 +383,11 @@ pub fn render_app() -> Html {
         let input_ref = input_ref.clone();
         Callback::from(move |event: KeyboardEvent| {
             if event.key() == "Enter" {
-                update::submit_input(worker.borrow().as_ref().unwrap(), &input_ref, &state);
+                update::submit_input(&worker, &input_ref, &state);
             };
             if event.key() == "d" && event.ctrl_key() {
                 event.prevent_default();
-                update::submit_eof(worker.borrow().as_ref().unwrap(), &input_ref, &state);
+                update::submit_eof(&worker, &input_ref, &state);
             };
         })
     };
@@ -498,7 +490,7 @@ pub fn render_app() -> Html {
                     {file_loaded}
                     {waiting_syscall}
                     state={state.clone()}
-                    worker={worker.borrow().as_ref().unwrap().clone()}
+                    worker={worker.clone()}
                     {filename}
                     {file}
                     {is_saved}
@@ -559,7 +551,7 @@ pub fn render_app() -> Html {
                         </div>
 
                         <div id="regs" class="overflow-y-auto bg-th-secondary px-2 border-2 border-current">
-                            <Registers state={state.clone()} tab={show_register_tab} worker={worker.borrow().as_ref().unwrap().clone()}/>
+                            <Registers state={state.clone()} tab={show_register_tab} worker={worker.clone()}/>
                         </div>
 
                         <OutputArea
@@ -599,7 +591,7 @@ fn render_running(
     save_keydown: Callback<KeyboardEvent>,
     is_saved: UseStateHandle<bool>,
     show_tab: UseStateHandle<DisplayedCodeTab>,
-    worker: Rc<RefCell<Option<UseBridgeHandle<Worker>>>>,
+    worker: UseBridgeHandle<MipsyWebWorker>,
 ) -> Html {
     let display_filename = (&*filename.as_deref().unwrap_or("Untitled")).to_string();
 
@@ -626,7 +618,7 @@ fn render_running(
                                         current_instr={curr.mips_state.current_instr}
                                         decompiled={curr.decompiled.clone()}
                                         state={state.clone()}
-                                        worker={worker.borrow().as_ref().unwrap().clone()}
+                                        worker={worker.clone()}
                                     />
                                 }
                             },
@@ -645,7 +637,7 @@ fn render_running(
                                                         current_instr={error.mips_state.current_instr}
                                                         decompiled={error.decompiled.clone()}
                                                         state={state.clone()}
-                                                        worker={worker.borrow().as_ref().unwrap().clone()}
+                                                        worker={worker.clone()}
                                                     />
                                                 </tbody>
                                             </table>
@@ -748,7 +740,7 @@ fn focus_input(input_ref: UseStateHandle<NodeRef>) {
 
 pub fn process_syscall_response(
     state: UseStateHandle<State>,
-    worker: UseBridgeHandle<Worker>,
+    worker: UseBridgeHandle<MipsyWebWorker>,
     input: HtmlInputElement,
     required_type: ReadSyscallInputs,
 ) {
diff --git a/crates/mipsy_web/src/state/config.rs b/crates/mipsy_web/src/state/config.rs
index e7c1c7c8..b7c43ff9 100644
--- a/crates/mipsy_web/src/state/config.rs
+++ b/crates/mipsy_web/src/state/config.rs
@@ -7,18 +7,18 @@ use serde::{Deserialize, Serialize};
 use wasm_bindgen::JsValue;
 
 // i should probably write a macro for this
-#[derive(Clone, PartialEq, Atom, Serialize, Deserialize)]
+#[derive(Clone, PartialEq, Atom, Serialize, Deserialize, Debug)]
 pub struct PrimaryColor(pub String);
-#[derive(Clone, PartialEq, Atom, Serialize, Deserialize)]
+#[derive(Clone, PartialEq, Atom, Serialize, Deserialize, Debug)]
 pub struct SecondaryColor(pub String);
-#[derive(Clone, PartialEq, Atom, Serialize, Deserialize)]
+#[derive(Clone, PartialEq, Atom, Serialize, Deserialize, Debug)]
 pub struct TertiaryColor(pub String);
-#[derive(Clone, PartialEq, Atom, Serialize, Deserialize)]
+#[derive(Clone, PartialEq, Atom, Serialize, Deserialize, Debug)]
 pub struct HighlightColor(pub String);
-#[derive(Clone, PartialEq, Atom, Serialize, Deserialize)]
+#[derive(Clone, PartialEq, Atom, Serialize, Deserialize, Debug)]
 pub struct FontColor(pub String);
 
-#[derive(Clone, PartialEq, Atom, Serialize, Deserialize)]
+#[derive(Clone, PartialEq, Atom, Serialize, Deserialize, Debug)]
 #[bounce(observed)]
 pub struct MipsyWebConfig {
     pub mipsy_config: MipsyConfig,
@@ -101,7 +101,7 @@ impl From<std::string::String> for FontColor {
     }
 }
 
-#[derive(Clone, PartialEq, Serialize, Deserialize)]
+#[derive(Clone, PartialEq, Serialize, Deserialize, Debug)]
 pub enum RegisterBase {
     Hexadecimal,
     Decimal,
diff --git a/crates/mipsy_web/src/state/update.rs b/crates/mipsy_web/src/state/update.rs
index 9377176c..c52baddc 100644
--- a/crates/mipsy_web/src/state/update.rs
+++ b/crates/mipsy_web/src/state/update.rs
@@ -10,7 +10,7 @@ use crate::{
         },
     },
     worker::{
-        FileInformation, ReadSyscallInputs, RuntimeErrorResponse, Worker, WorkerRequest,
+        FileInformation, ReadSyscallInputs, RuntimeErrorResponse, MipsyWebWorker, WorkerRequest,
         WorkerResponse,
     },
 };
@@ -32,7 +32,6 @@ pub fn handle_response_from_worker(
     file: UseStateHandle<Option<String>>,
     filename: UseStateHandle<Option<String>>,
     response: WorkerResponse,
-    worker: Rc<RefCell<Option<UseBridgeHandle<Worker>>>>,
     input_ref: UseStateHandle<NodeRef>,
     is_saved: UseStateHandle<bool>,
     monaco_cursor: UseAtomHandle<MonacoCursor>,
@@ -142,7 +141,8 @@ pub fn handle_response_from_worker(
                         ..curr.clone()
                     }));
 
-                    worker.borrow().as_ref().unwrap().send(input);
+                    // TODO(shreys) verify this isn't needed?
+                    // worker.borrow().as_ref().unwrap().send(input);
                 }
 
                 state.set(State::Compiled(RunningState {
@@ -220,7 +220,7 @@ pub fn handle_response_from_worker(
 }
 
 pub fn submit_input(
-    worker: &UseBridgeHandle<Worker>,
+    worker: &UseBridgeHandle<MipsyWebWorker>,
     input_ref: &UseStateHandle<NodeRef>,
     state: &UseStateHandle<State>,
 ) {
@@ -318,7 +318,7 @@ pub fn submit_input(
 
 // same default values for EOF as crates/mipsy/src/main.rs
 pub fn submit_eof(
-    worker: &UseBridgeHandle<Worker>,
+    worker: &UseBridgeHandle<MipsyWebWorker>,
     input_ref: &UseStateHandle<NodeRef>,
     state: &UseStateHandle<State>,
 ) {
diff --git a/crates/mipsy_web/src/worker.rs b/crates/mipsy_web/src/worker.rs
index 08bde1c2..1a89fdac 100644
--- a/crates/mipsy_web/src/worker.rs
+++ b/crates/mipsy_web/src/worker.rs
@@ -1,3 +1,4 @@
+use crate::pages::main::app::NUM_INSTR_BEFORE_RESPONSE;
 use crate::state::config::MipsyWebConfig;
 use crate::{state::state::MipsState, utils::decompile, utils::generate_highlighted_line};
 use log::{error, info};
@@ -11,7 +12,7 @@ use mipsy_lib::{runtime::RuntimeSyscallGuard, Binary, InstSet, MipsyError, Runti
 use mipsy_parser::TaggedFile;
 use serde::{Deserialize, Serialize};
 use std::rc::Rc;
-use yew_agent::{Agent, AgentLink, HandlerId, Public};
+use yew_agent::{Worker, WorkerLink, HandlerId, Public};
 
 //            Worker Overview
 // ___________________________________________
@@ -35,11 +36,11 @@ use yew_agent::{Agent, AgentLink, HandlerId, Public};
 // Worker: Sure, here is a cleared set of registers
 // ____________________________________________
 
-pub struct Worker {
+pub struct MipsyWebWorker {
     // the link that allows to communicate to main thread
-    link: AgentLink<Self>,
+    link: WorkerLink<Self>,
     inst_set: InstSet,
-    file: Option<String>,
+    file: Option<FileInformation>,
     // the runtime may not exist if no binary
     runtime: Option<RuntimeState>,
     // the binary will not exist if we have not been sent a file
@@ -69,7 +70,7 @@ enum RuntimeState {
 
 type NumSteps = i32;
 
-#[derive(Serialize, Deserialize)]
+#[derive(Serialize, Deserialize, Debug)]
 pub enum ReadSyscallInputs {
     Int(i32),
     Float(f32),
@@ -79,7 +80,7 @@ pub enum ReadSyscallInputs {
     //Read((i32, Vec<u8>)),
 }
 
-#[derive(Serialize, Deserialize)]
+#[derive(Serialize, Deserialize, Debug)]
 pub enum WorkerRequest {
     // The struct that worker can obtain
     CompileCode(FileInformation),
@@ -93,20 +94,20 @@ pub enum WorkerRequest {
     GiveSyscallValue(MipsState, ReadSyscallInputs),
 }
 
-#[derive(Serialize, Deserialize)]
+#[derive(Serialize, Deserialize, Debug)]
 pub struct DecompiledResponse {
     pub decompiled: String,
     pub file: Option<String>,
     pub binary: Binary,
 }
 
-#[derive(Serialize, Deserialize)]
+#[derive(Serialize, Deserialize, Clone, Debug)]
 pub struct FileInformation {
     pub file: String,
     pub filename: String,
 }
 
-#[derive(Serialize, Deserialize)]
+#[derive(Serialize, Deserialize, Debug)]
 pub struct ErrorResponse {
     // error is RuntimeError, ParseError, or CompilerError
     pub error: MipsyError,
@@ -117,13 +118,13 @@ pub struct ErrorResponse {
     pub message: String,
 }
 
-#[derive(Serialize, Deserialize)]
+#[derive(Serialize, Deserialize, Debug)]
 pub struct RuntimeErrorResponse {
     pub error: MipsyError,
     pub mips_state: MipsState,
 }
 
-#[derive(Serialize, Deserialize)]
+#[derive(Serialize, Deserialize, Debug)]
 pub enum WorkerResponse {
     DecompiledCode(DecompiledResponse),
     WorkerError(ErrorResponse),
@@ -139,13 +140,13 @@ pub enum WorkerResponse {
     RuntimeError(RuntimeErrorResponse), //NeedRead((i32, Vec<u8>)),
 }
 
-impl Agent for Worker {
+impl Worker for MipsyWebWorker {
     type Reach = Public<Self>;
     type Message = ();
     type Input = WorkerRequest;
     type Output = WorkerResponse;
 
-    fn create(link: AgentLink<Self>) -> Self {
+    fn create(link: WorkerLink<Self>) -> Self {
         Self {
             link,
             inst_set: mipsy_instructions::inst_set(),
@@ -176,6 +177,7 @@ impl Agent for Worker {
         let mut breakpoint = false;
         let mut watchpoint = false;
         let mut watchpoints = Vec::new();
+        log::info!("Handling input {msg:#?}");
         match msg {
             Self::Input::CompileCode(FileInformation { file, filename }) => {
                 // TODO(shreys): this is a hack to get the file to compile
@@ -198,7 +200,7 @@ impl Agent for Worker {
                         let runtime = mipsy_lib::runtime(&binary, &[]);
                         self.binary = Some(binary);
                         self.runtime = Some(RuntimeState::Running(runtime));
-                        self.file = Some(file);
+                        self.file = Some(FileInformation { file, filename });
                         self.link.respond(id, response)
                     }
 
@@ -250,8 +252,9 @@ impl Agent for Worker {
                             // if we are not running, then just recompile the file (since we have
                             // lost the old runtime lawl)
                             if let Some(binary) = &self.binary {
+                                let file = self.file.clone().map(|file| file.file);
                                 let decompiled =
-                                    decompile(binary, &self.inst_set, self.file.clone());
+                                    decompile(binary, &self.inst_set, file);
                                 let response = Self::Output::DecompiledCode(DecompiledResponse {
                                     decompiled,
                                     file: None,
@@ -264,7 +267,8 @@ impl Agent for Worker {
                         }
                     }
                 } else if let Some(binary) = &self.binary {
-                    let decompiled = decompile(binary, &self.inst_set, self.file.clone());
+                    let file = self.file.clone().map(|file| file.file);
+                    let decompiled = decompile(binary, &self.inst_set, file);
                     let response = Self::Output::DecompiledCode(DecompiledResponse {
                         decompiled,
                         file: None,
@@ -687,6 +691,7 @@ impl Agent for Worker {
                                             breakpoint = true;
                                             break;
                                         }
+                                        info!("end of printchar");
                                     }
 
                                     ReadInt(guard) => {
@@ -892,6 +897,13 @@ impl Agent for Worker {
                     self.runtime = Some(RuntimeState::Running(runtime));
 
                     let response;
+
+                    let file_info = FileInformation {
+                        filename,
+                        file,
+                    };
+
+
                     if mips_state.exit_status.is_some() {
                         mips_state.stdout.push(format!(
                             "\nProgram exited with exit status {}",
@@ -899,7 +911,8 @@ impl Agent for Worker {
                                 .exit_status
                                 .expect("infinite loop guarantees Some return")
                         ));
-                        response = Self::Output::ProgramExited(mips_state);
+                        response = Self::Output::ProgramExited(mips_state.clone());
+                        self.link.respond(id, response);
                     } else if breakpoint {
                         // the label or address
                         let label = binary
@@ -912,7 +925,8 @@ impl Agent for Worker {
                             .mipsy_stdout
                             .push(format!("BREAKPOINT - {label}"));
 
-                        response = Self::Output::UpdateMipsState(mips_state);
+                        response = Self::Output::UpdateMipsState(mips_state.clone());
+                        self.link.respond(id, response);
                     } else if watchpoint {
                         for wp in watchpoints {
                             mips_state.mipsy_stdout.push(format!(
@@ -926,23 +940,25 @@ impl Agent for Worker {
                             ));
                         }
 
-                        response = Self::Output::UpdateMipsState(mips_state);
+                        response = Self::Output::UpdateMipsState(mips_state.clone());
+                        self.link.respond(id, response);
                     } else if step_size.abs() == 1 {
                         // just update the state
-                        response = Self::Output::UpdateMipsState(mips_state);
+                        response = Self::Output::UpdateMipsState(mips_state.clone());
+                        self.link.respond(id, response);
                     } else {
                         // update state and tell frontend to run more isntructions
-                        response = Self::Output::InstructionOk(mips_state);
+                        response = Self::Output::InstructionOk(mips_state.clone());
+                        self.link.respond(id, response);
+                        self.link.send_input(WorkerRequest::Run(mips_state, NUM_INSTR_BEFORE_RESPONSE, file_info));
                     }
-
-                    self.link.respond(id, response);
                 }
             }
         }
     }
 }
 
-impl Worker {
+impl MipsyWebWorker {
     fn upload_syscall_value<T>(
         &mut self,
         mut mips_state: MipsState,
@@ -966,10 +982,10 @@ impl Worker {
 
         if mips_state.is_stepping {
             self.link
-                .respond(id, <Worker as Agent>::Output::UpdateMipsState(mips_state))
+                .respond(id, <MipsyWebWorker as Worker>::Output::UpdateMipsState(mips_state))
         } else {
             self.link
-                .respond(id, <Worker as Agent>::Output::InstructionOk(mips_state))
+                .respond(id, <MipsyWebWorker as Worker>::Output::InstructionOk(mips_state))
         }
     }
 }