Add Trezor Suite connection details

src/components/ConnectWallet/Wallets/TrezorSuite.vue

@@ -0,0 +1,51 @@
+<template>
+  <connection-details name="Trezor Suite" requires="electrum">
+    <step-list>
+      <step>
+        Open Trezor Suite and connect your Trezor.
+      </step>
+      <step>
+        Go to <span class="font-weight-bold">Settings > Application</span> and make sure <span class="font-weight-bold">"Tor"</span> is enabled.
+      </step>
+      <step>
+        Go to <span class="font-weight-bold">Settings > Crypto</span>.
+      </step>
+      <step>
+        Hover above <span class="font-weight-bold">"Bitcoin"</span> and click the gear icon.
+      </step>
+      <step>
+        Under <span class="font-weight-bold">"Backends"</span> click <span class="font-weight-bold">"Trezor servers"</span> and select
+        <span class="font-weight-bold">"Custom Electrum server"</span> from the dropdown menu.
+      </step>
+      <step>
+        In the next field enter:
+        <input-copy class="my-1" :value="`${urls.bitcoin.electrum.address}:${urls.bitcoin.electrum.port}:t`" auto-width></input-copy>
+      </step>
+      <step>
+        Press the <span class="font-weight-bold">"Confirm"</span> button.
+      </step>
+      <step>
+        Congratulations! You've successfully connected Trezor Suite to your Umbrel.
+      </step>
+    </step-list>
+  </connection-details>
+</template>
+
+<script>
+import ConnectionDetails from "@/components/ConnectWallet/ConnectionDetails";
+import StepList from "@/components/ConnectWallet/StepList";
+import Step from "@/components/ConnectWallet/Step";
+import InputCopy from "@/components/Utility/InputCopy";
+
+export default {
+  props: {
+    urls: Object
+  },
+  components: {
+    ConnectionDetails,
+    StepList,
+    Step,
+    InputCopy
+  }
+};
+</script>

src/router/index.js

@@ -35,6 +35,7 @@ import Phoenix from "../components/ConnectWallet/Wallets/Phoenix.vue";
 import SamouraiWallet from "../components/ConnectWallet/Wallets/SamouraiWallet.vue";
 import Sparrow from "../components/ConnectWallet/Wallets/Sparrow.vue";
 import SpecterDesktop from "../components/ConnectWallet/Wallets/SpecterDesktop.vue";
+import TrezorSuite from "../components/ConnectWallet/Wallets/TrezorSuite.vue";
 import Wasabi from "../components/ConnectWallet/Wallets/Wasabi.vue";
 
 import ZapAndroid from "../components/ConnectWallet/Wallets/ZapAndroid.vue";
@@ -249,6 +250,13 @@ const routes = [
                   wallet: "specter-desktop"
                 }
               },
+              {
+                path: "trezor-suite",
+                component: TrezorSuite,
+                meta: {
+                  wallet: "trezor-suite"
+                }
+              },
               {
                 path: "wasabi",
                 component: Wasabi,

src/views/ConnectWallet.vue

@@ -61,6 +61,7 @@ export default {
         { value: "samourai-wallet", text: "Samourai Wallet" },
         { value: "sparrow", text: "Sparrow" },
         { value: "specter-desktop", text: "Specter Desktop" },
+        { value: "trezor-suite", text: "Trezor Suite" },
         { value: "wasabi", text: "Wasabi" },
         { value: "zap-android", text: "Zap (Android)" },
         { value: "zap-desktop", text: "Zap (Desktop)" },