Password modal not working and other fixes

extension/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "extension"
-version = "0.2.7"
+version = "0.2.8"
 authors = [ "The elenpay Developers" ]
 description = "A chrome extension/firefox add on for importing keys and signing PSBTs"
 edition = "2021"
@@ -9,25 +9,25 @@ edition = "2021"
 crate-type = [ "cdylib" ]
 
 [dependencies]
-anyhow = "1.0.69"
-yew-router = "0.17.0"
-serde-wasm-bindgen = "0.5.0"
-serde = "1.0.158"
-js-sys = "0.3.61"
-wasm-bindgen-futures = "0.4.34"
+anyhow = "1.0"
+yew-router = "0.17"
+serde-wasm-bindgen = "0.5"
+serde = "1.0"
+js-sys = "0.3"
+wasm-bindgen-futures = "0.4"
 
   [dependencies.signer]
   path = "../signer"
 
   [dependencies.wasm-bindgen]
-  version = "0.2.84"
+  version = "0.2"
 
   [dependencies.yew]
-  version = "0.20.0"
+  version = "0.20"
   features = [ "csr" ]
 
   [dependencies.web-sys]
-  version = "0.3.61"
+  version = "0.3"
   features = [
   "Document",
   "Element",

extension/src/components/text_input.rs

@@ -11,6 +11,7 @@ pub struct Props {
     pub onchange: Callback<Result<String>>,
     pub itype: Option<String>,
     pub placeholder: Option<String>,
+    pub onkeypress: Option<Callback<KeyboardEvent>>,
 }
 
 fn get_value_from_input_event(e: InputEvent) -> Result<String> {
@@ -33,13 +34,14 @@ pub fn text_input(props: &Props) -> Html {
         placeholder,
         id,
         disabled,
+        onkeypress,
     } = props.clone();
 
     let oninput = Callback::from(move |input_event: InputEvent| {
         onchange.emit(get_value_from_input_event(input_event));
     });
 
     html! {
-        <input disabled={disabled.unwrap_or_default()} {id} {value} {oninput} type={itype} placeholder={placeholder} />
+        <input disabled={disabled.unwrap_or_default()} {id} {value} {oninput} {onkeypress} type={itype} placeholder={placeholder} />
     }
 }

extension/src/features/export_xpub.rs

@@ -34,7 +34,7 @@ pub fn export_xpub(props: &Props) -> Html {
         wallet
             .as_ref()
             .map(|w| w.derivation.to_string())
-            .unwrap_or_else(String::default)
+            .unwrap_or_default()
     });
     let next_derivation = use_state(String::default);
     let error = use_state(String::default);

extension/src/features/generate_seed.rs

@@ -102,6 +102,11 @@ pub fn generate_seed() -> Html {
             let mut storage = UserStorage::read(LocalStorage::default());
             let mut wallet = Wallet::default();
 
+            if wallet_name_value.is_empty() {
+                error.set("Wallet name is mandatory".into());
+                return;
+            }
+
             let parsed = wallet.from_seed_str(&wallet_name_value, &(*seed).join(" "), &password);
 
             if parsed.is_err() {

extension/src/features/import_from_seed.rs

@@ -7,6 +7,7 @@ use crate::utils::storage::LocalStorage;
 use anyhow::{anyhow, Result};
 use signer::storage::UserStorage;
 use signer::wallet::Wallet;
+use std::vec;
 use wasm_bindgen::JsCast;
 use web_sys::ClipboardEvent;
 use yew::prelude::*;
@@ -15,15 +16,16 @@ use yew_router::prelude::use_navigator;
 #[function_component(ImportFromSeed)]
 pub fn import_from_seed() -> Html {
     let navigator = use_navigator().unwrap();
-    let seed = use_state(Vec::new);
+    let seed = use_state(|| vec![String::default(); 24]);
     let wallet_name = use_state(String::default);
     let error = use_state(String::default);
     let popup_visible = use_state(|| false);
-    let mut seed_value = (*seed).clone();
+    let seed_value = (*seed).clone();
     let wallet_name_value = (*wallet_name).clone();
     let error_value = (*error).clone();
 
     let onpaste = {
+        let seed = seed.clone();
         let error = error.clone();
         Callback::from(move |e: Event| {
             e.prevent_default();
@@ -41,7 +43,10 @@ pub fn import_from_seed() -> Html {
                         .map(ToString::to_string)
                         .collect::<Vec<String>>()
                 })
-                .map(|v| seed.set(v));
+                .map(|mut v| {
+                    v.resize(24, String::default());
+                    seed.set(v)
+                });
             with_error_msg!(result, error.set("Error while generating seed".to_string()));
         })
     };
@@ -88,6 +93,11 @@ pub fn import_from_seed() -> Html {
             let mut storage = UserStorage::read(LocalStorage::default());
             let mut wallet = Wallet::default();
 
+            if wallet_name_value.is_empty() {
+                error.set("Wallet name is mandatory".into());
+                return;
+            }
+
             let parsed = wallet.from_seed_str(&wallet_name_value, &(*seed).join(" "), &password);
 
             if parsed.is_err() {
@@ -113,7 +123,14 @@ pub fn import_from_seed() -> Html {
         })
     };
 
-    seed_value.resize(24, String::default());
+    fn on_change_seed(seed: UseStateHandle<Vec<String>>, index: usize) -> Callback<Result<String>> {
+        Callback::from(move |value: Result<String>| {
+            let mut seed_value = (*seed).clone();
+            seed_value[index] = value.unwrap_or_default();
+            seed.set(seed_value);
+        })
+    }
+
     html! {
         <>
             <h class="title">{"Import from Seed"}</h>
@@ -123,7 +140,7 @@ pub fn import_from_seed() -> Html {
                     seed_value.clone().iter().enumerate().map(|(index, word)| {
                         html!{
                             <li>
-                                <input disabled={*popup_visible} key={index} value={word.to_string()}/>
+                                <TextInput disabled={*popup_visible} key={index} value={word.to_string()} onchange={on_change_seed(seed.clone(), index)}/>
                             </li>
                         }
                     }).collect::<Html>()

extension/src/features/import_from_xprv.rs

@@ -77,6 +77,11 @@ pub fn import_from_xprv() -> Html {
             let mut storage = UserStorage::read(LocalStorage::default());
             let mut wallet = Wallet::default();
 
+            if wallet_name_value.is_empty() {
+                error.set("Wallet name is mandatory".into());
+                return;
+            }
+
             let parsed = wallet.from_xprv_str(&wallet_name_value, &xprv, &derivation, &password);
 
             if parsed.is_err() {

extension/src/features/input_password_modal.rs

@@ -1,3 +1,5 @@
+use std::rc::Rc;
+
 use anyhow::Result;
 use signer::storage::UserStorage;
 use wasm_bindgen_futures::spawn_local;
@@ -130,16 +132,27 @@ pub fn input_password_modal(props: &Props) -> Html {
         PasswordFor::UnlockingApp => "Input your password to unlock extension",
     };
 
+    let onkeypress = {
+        let onclick = Rc::new(onclick.clone());
+        Callback::from(move |event: KeyboardEvent| {
+            if event.key() == "Enter" {
+                let _ = MouseEvent::new("click").map(|e| {
+                    let _ = &onclick.emit(e);
+                });
+            }
+        })
+    };
+
     html! {
         <div class="modal-backdrop">
             <div class="modal">
                 <h class="title">{title}</h>
                 {checkbox}
-                <TextInput id={Some("password-input")} itype="password" onchange={on_change} value={password_value} placeholder="Input your password" />
+                <TextInput id={Some("password-input")} itype="password" onchange={on_change} value={password_value} {onkeypress} placeholder="Input your password" />
                 <div class="error">{error_value}</div>
                 <div class="button-bar">
                     <button class="cancel" onclick={onclick_cancel}>{"Cancel"}</button>
-                    <button disabled={save_disabled} {onclick}>{button_label}</button>
+                    <button disabled={save_disabled} onclick={onclick}>{button_label}</button>
                 </div>
             </div>
         </div>

extension/src/features/password_injector.rs

@@ -14,17 +14,23 @@ pub struct PasswordInjectorProps {
 #[function_component]
 pub fn PasswordInjector(props: &PasswordInjectorProps) -> Html {
     let context = use_context::<UserContext>().unwrap();
-    let existing_password = context.password.clone().unwrap_or_default();
+    let in_memory_password = context.password.clone().unwrap_or_default();
     use_effect(move || {
         if !session_exists().unwrap_or_default() {
             return;
         }
         spawn_local(async move {
             match get_password().await {
-                Ok(password) if !password.is_empty() && password != existing_password => {
-                    context.dispatch(ContextAction::InputPassword { password })
+                Ok(session_password)
+                    if !session_password.is_empty() && session_password != in_memory_password =>
+                {
+                    context.dispatch(ContextAction::InputPassword {
+                        password: session_password,
+                    })
                 }
-                Ok(password) if password.is_empty() => {
+                Ok(session_password)
+                    if session_password.is_empty() && !in_memory_password.is_empty() =>
+                {
                     context.dispatch(ContextAction::ClearPassword)
                 }
                 Err(_) => context.dispatch(ContextAction::ClearPassword),

extension/static/app.css

@@ -36,22 +36,25 @@ button {
     padding: 10px;
     margin: 5px 0;
     flex-grow: 1;
+    cursor: pointer;
 }
 
 button:disabled {
     opacity: 0.5;
 }
 
 ol {
-    display: flex;
-    flex-direction: column;
-    flex-wrap: wrap;
-    height: 300px;
-    /* margin-bottom: -20px */
+    display: grid;
+    grid-template-columns: 33% 33% 33%;
+    width: 100%
 }
 
 li {
-    width: 33%;
+    width: 70%;
+}
+
+li>input {
+    width: 100%;
 }
 
 .app {
@@ -159,12 +162,18 @@ span.textbox-with-prefix input {
 }
 
 .open-in-tab {
-    width: 50px;
-    height: 50px;
+    width: 30px;
+    height: 30px;
     position: absolute;
-    z-index: 10;
+    z-index: 100;
     top: 0px;
     right: 5px;
+    padding: 5px;
+}
+
+.open-in-tab:hover {
+    width: 50px;
+    height: 50px;
 }
 
 .open-in-tab img {

extension/static/manifest.json

@@ -2,7 +2,7 @@
   "manifest_version": 3,
   "name": "NodeGuard Companion",
   "description": "Import or generate your Bitcoin mnemonics, export your xpubs and sign your PSBTs. Your private keys never leave your browser.",
-  "version": "0.2.7",
+  "version": "0.2.8",
   "action": {
     "default_popup": "popup.html"
   },
@@ -28,7 +28,6 @@
   ],
   "permissions": [
     "activeTab",
-    "tabs",
     "storage"
   ],
   "web_accessible_resources": [

extension/versions/manifest_v2.json

@@ -2,10 +2,14 @@
   "manifest_version": 2,
   "name": "NodeGuard Companion",
   "description": "Import or generate your Bitcoin mnemonics, export your xpubs and sign your PSBTs. Your private keys never leave your browser.",
-  "version": "0.2.7",
+  "version": "0.2.8",
   "browser_action": {
     "default_popup": "popup.html"
   },
+  "options_ui": {
+    "page": "configure.html",
+    "open_in_tab": true
+  },
   "content_security_policy": "script-src 'self' 'wasm-unsafe-eval'; object-src 'self'",
   "content_scripts": [
     {
@@ -22,7 +26,6 @@
   ],
   "permissions": [
     "activeTab",
-    "tabs",
     "storage"
   ],
   "web_accessible_resources": [