Vibrate on successful send, receive, channel open

android/app/capacitor.build.gradle

@@ -14,6 +14,7 @@ dependencies {
     implementation project(':capacitor-clipboard')
     implementation project(':capacitor-filesystem')
     implementation project(':capacitor-share')
+    implementation project(':capacitor-haptics')
     implementation project(':capacitor-toast')
     implementation project(':mutinywallet-barcode-scanner')
 

android/capacitor.settings.gradle

@@ -17,6 +17,9 @@ project(':capacitor-filesystem').projectDir = new File('../node_modules/.pnpm/@c
 include ':capacitor-share'
 project(':capacitor-share').projectDir = new File('../node_modules/.pnpm/@capacitor+share@5.0.6_@capacitor+core@5.2.2/node_modules/@capacitor/share/android')
 
+include ':capacitor-haptics'
+project(':capacitor-haptics').projectDir = new File('../node_modules/.pnpm/@capacitor+haptics@5.0.6_@capacitor+core@5.2.2/node_modules/@capacitor/haptics/android')
+
 include ':capacitor-toast'
 project(':capacitor-toast').projectDir = new File('../node_modules/.pnpm/@capacitor+toast@5.0.6_@capacitor+core@5.2.2/node_modules/@capacitor/toast/android')
 

package.json

@@ -49,6 +49,7 @@
         "@capacitor/core": "^5.2.2",
         "@capacitor/filesystem": "^5.1.4",
         "@capacitor/share": "^5.0.6",
+        "@capacitor/haptics": "^5.0.6",
         "@capacitor/toast": "^5.0.6",
         "@kobalte/core": "^0.9.8",
         "@kobalte/tailwindcss": "^0.5.0",

pnpm-lock.yaml

@@ -29,6 +29,9 @@ importers:
       '@capacitor/share':
         specifier: ^5.0.6
         version: 5.0.6(@capacitor/core@5.2.2)
+      '@capacitor/haptics':
+        specifier: ^5.0.6
+        version: 5.0.6(@capacitor/core@5.2.2)
       '@capacitor/toast':
         specifier: ^5.0.6
         version: 5.0.6(@capacitor/core@5.2.2)
@@ -1611,6 +1614,14 @@ packages:
       '@capacitor/core': 5.2.2
     dev: false
 
+  /@capacitor/haptics@5.0.6(@capacitor/core@5.2.2):
+    resolution: {integrity: sha512-UrMcR7p2X10ql4VLlowUuH/VckTeu0lj+RQpekxox14uxDmu5AGIFDK/iDTi8W6QZkxTJRZK6sbCjgwYgNJ7Pw==}
+    peerDependencies:
+      '@capacitor/core': ^5.0.0
+    dependencies:
+      '@capacitor/core': 5.2.2
+    dev: false
+
   /@capacitor/toast@5.0.6(@capacitor/core@5.2.2):
     resolution: {integrity: sha512-djkRHVT8YtLJC1vvOnDU3EfAHfQYqAD7LYEXmSmhYuTnXRIggX93m/NkazwLnnpr95kDbs2VVPM/J6dqqYuJng==}
     peerDependencies:

src/components/PendingNwc.tsx

@@ -21,7 +21,12 @@ import {
 } from "~/components";
 import { useI18n } from "~/i18n/context";
 import { useMegaStore } from "~/state/megaStore";
-import { createDeepSignal, eify, formatExpiration } from "~/utils";
+import {
+    createDeepSignal,
+    eify,
+    formatExpiration,
+    vibrateSuccess
+} from "~/utils";
 
 type PendingItem = {
     id: string;
@@ -72,6 +77,7 @@ export function PendingNwc() {
             setPaying(item.id);
             const nodes = await state.mutiny_wallet?.list_nodes();
             await state.mutiny_wallet?.approve_invoice(item.id, nodes[0]);
+            await vibrateSuccess();
         } catch (e) {
             setError(eify(e));
             console.error(e);

src/routes/Receive.tsx

@@ -51,7 +51,8 @@ import {
     eify,
     mempoolTxUrl,
     MutinyTagItem,
-    objectToSearchParams
+    objectToSearchParams,
+    vibrateSuccess
 } from "~/utils";
 
 type OnChainTx = {
@@ -314,6 +315,7 @@ export default function Receive() {
                     if (invoice && invoice.paid) {
                         setReceiveState("paid");
                         setPaymentInvoice(invoice);
+                        await vibrateSuccess();
                         return "lightning_paid";
                     }
                 }
@@ -325,6 +327,7 @@ export default function Receive() {
                 if (tx) {
                     setReceiveState("paid");
                     setPaymentTx(tx);
+                    await vibrateSuccess();
                     return "onchain_paid";
                 }
             } catch (e) {

src/routes/Send.tsx

@@ -47,7 +47,7 @@ import { useI18n } from "~/i18n/context";
 import { Network } from "~/logic/mutinyWalletSetup";
 import { ParsedParams } from "~/logic/waila";
 import { useMegaStore } from "~/state/megaStore";
-import { eify, mempoolTxUrl, MutinyTagItem } from "~/utils";
+import { eify, mempoolTxUrl, MutinyTagItem, vibrateSuccess } from "~/utils";
 
 export type SendSource = "lightning" | "onchain";
 
@@ -549,6 +549,7 @@ export default function Send() {
             }
             setSentDetails(sentDetails as SentDetails);
             clearAll();
+            await vibrateSuccess();
         } catch (e) {
             const error = eify(e);
             setSentDetails({ failure_reason: error.message });

src/routes/Swap.tsx

@@ -35,7 +35,7 @@ import { useI18n } from "~/i18n/context";
 import { Network } from "~/logic/mutinyWalletSetup";
 import { MethodChooser, SendSource } from "~/routes/Send";
 import { useMegaStore } from "~/state/megaStore";
-import { eify, mempoolTxUrl } from "~/utils";
+import { eify, mempoolTxUrl, vibrateSuccess } from "~/utils";
 
 const CHANNEL_FEE_ESTIMATE_ADDRESS =
     "bc1qf7546vg73ddsjznzq57z3e8jdn6gtw6au576j07kt6d9j7nz8mzsyn6lgf";
@@ -158,6 +158,8 @@ export default function Swap() {
 
                     setChannelOpenResult({ channel: new_channel });
                 }
+
+                await vibrateSuccess();
             } catch (e) {
                 setChannelOpenResult({ failure_reason: eify(e) });
             } finally {

src/routes/settings/Plus.tsx

@@ -27,7 +27,7 @@ import {
 } from "~/components";
 import { useI18n } from "~/i18n/context";
 import { useMegaStore } from "~/state/megaStore";
-import { eify, subscriptionValid } from "~/utils";
+import { eify, subscriptionValid, vibrateSuccess } from "~/utils";
 
 function Perks(props: { alreadySubbed?: boolean }) {
     const i18n = useI18n();
@@ -90,6 +90,8 @@ function PlusCTA() {
                 invoice?.bolt11
             );
 
+            await vibrateSuccess();
+
             // "true" flag gives this a fallback to set a timestamp in case the subscription server is down
             await actions.checkForSubscription(true);
         } catch (e) {

src/utils/index.ts

@@ -15,4 +15,5 @@ export * from "./typescript";
 export * from "./useCopy";
 export * from "./words";
 export * from "./fetchZaps";
+export * from "./vibrate";
 export * from "./openLinkProgrammatically";

src/utils/vibrate.ts

@@ -0,0 +1,19 @@
+import { Capacitor } from "@capacitor/core";
+import { Haptics } from "@capacitor/haptics";
+import { NotificationType } from "@capacitor/haptics/dist/esm/definitions";
+
+export const vibrate = async (millis = 250) => {
+    if (Capacitor.isNativePlatform()) {
+        await Haptics.vibrate({ duration: millis });
+    } else {
+        window.navigator.vibrate(millis);
+    }
+};
+
+export const vibrateSuccess = async () => {
+    if (Capacitor.isNativePlatform()) {
+        await Haptics.notification({ type: NotificationType.Success });
+    } else {
+        window.navigator.vibrate([35, 65, 21]);
+    }
+};

vite.config.ts

@@ -51,6 +51,7 @@ export default defineConfig({
             "@capacitor/core",
             "@capacitor/filesystem",
             "@capacitor/toast",
+            "@capacitor/haptics",
             "@capacitor/app",
             "@capacitor/browser",
         ],