feat(wallet-mimir): mimir wallet integration

.changeset/loose-lemons-smell.md

@@ -0,0 +1,5 @@
+---
+"@reactive-dot/wallet-mimir": minor
+---
+
+Added Mimir wallet integration.

apps/docs/react/getting-started/connect-wallets.mdx

@@ -29,19 +29,27 @@ npm install @reactive-dot/wallet-walletconnect
 npm install @reactive-dot/wallet-ledger
 ```
 
+### [Mimir](https://mimir.global/)
+
+```bash npm2yarn
+npm install @reactive-dot/wallet-mimir
+```
+
 ## Add wallets to the config
 
 ```ts title="config.ts"
 import { defineConfig } from "@reactive-dot/core";
 import { InjectedWalletProvider } from "@reactive-dot/core/wallets.js";
 import { LedgerWallet } from "@reactive-dot/wallet-ledger";
+import { MimirWalletProvider } from "@reactive-dot/wallet-mimir";
 import { WalletConnect } from "@reactive-dot/wallet-walletconnect";
 
 export const config = defineConfig({
   // ...
   wallets: [
     new InjectedWalletProvider(),
-    new LedgerWalet(),
+    new LedgerWallet(),
+    new MimirWalletProvider(),
     new WalletConnect({
       projectId: "WALLET_CONNECT_PROJECT_ID",
       providerOptions: {

apps/docs/vue/getting-started/connect-wallets.mdx

@@ -29,19 +29,27 @@ npm install @reactive-dot/wallet-walletconnect
 npm install @reactive-dot/wallet-ledger
 ```
 
+### [Mimir](https://mimir.global/)
+
+```bash npm2yarn
+npm install @reactive-dot/wallet-mimir
+```
+
 ## Add wallets to the config
 
 ```ts title="config.ts"
 import { defineConfig } from "@reactive-dot/core";
 import { InjectedWalletProvider } from "@reactive-dot/core/wallets.js";
 import { LedgerWallet } from "@reactive-dot/wallet-ledger";
+import { MimirWalletProvider } from "@reactive-dot/wallet-mimir";
 import { WalletConnect } from "@reactive-dot/wallet-walletconnect";
 
 export const config = defineConfig({
   // ...
   wallets: [
     new InjectedWalletProvider(),
-    new LedgerWalet(),
+    new LedgerWallet(),
+    new MimirWalletProvider(),
     new WalletConnect({
       projectId: "WALLET_CONNECT_PROJECT_ID",
       providerOptions: {

examples/react/package.json

@@ -13,6 +13,7 @@
     "@polkadot-api/descriptors": "portal:.papi/descriptors",
     "@reactive-dot/react": "workspace:^",
     "@reactive-dot/wallet-ledger": "workspace:^",
+    "@reactive-dot/wallet-mimir": "workspace:^",
     "@reactive-dot/wallet-walletconnect": "workspace:^",
     "date-fns": "^4.1.0",
     "jotai-devtools": "^0.11.0",

examples/react/src/config.ts

@@ -11,6 +11,7 @@ import { defineConfig } from "@reactive-dot/core";
 import { createLightClientProvider } from "@reactive-dot/core/providers/light-client.js";
 import { InjectedWalletProvider } from "@reactive-dot/core/wallets.js";
 import { LedgerWallet } from "@reactive-dot/wallet-ledger";
+import { MimirWalletProvider } from "@reactive-dot/wallet-mimir";
 import { WalletConnect } from "@reactive-dot/wallet-walletconnect";
 
 const lightClientProvider = createLightClientProvider();
@@ -55,6 +56,7 @@ export const config = defineConfig({
   targetChains: ["polkadot", "kusama", "westend"],
   wallets: [
     new InjectedWalletProvider({ originName: "ReactiveDOT React Example" }),
+    new MimirWalletProvider({ originName: "ReactiveDOT React Example" }),
     new LedgerWallet(),
     new WalletConnect({
       projectId: "68f5b7e972a51cf379b127f51a791c34",

nx.json

@@ -14,5 +14,5 @@
       "cache": true
     }
   },
-  "parallel": 9
+  "parallel": 10
 }

packages/core/src/wallets/injected/wallet.ts

@@ -6,7 +6,7 @@ import {
   type InjectedExtension,
   type InjectedPolkadotAccount,
 } from "polkadot-api/pjs-signer";
-import { BehaviorSubject, Observable } from "rxjs";
+import { BehaviorSubject, Observable, of } from "rxjs";
 import { map, switchMap } from "rxjs/operators";
 
 export type InjectedWalletOptions = WalletOptions & { originName?: string };
@@ -33,7 +33,7 @@ export class InjectedWallet extends Wallet<InjectedWalletOptions, "connected"> {
     }
   }
 
-  connected$ = this.#extension$.pipe(
+  readonly connected$ = this.#extension$.pipe(
     map((extension) => extension !== undefined),
   );
 
@@ -53,21 +53,20 @@ export class InjectedWallet extends Wallet<InjectedWalletOptions, "connected"> {
   }
 
   readonly accounts$ = this.#extension$.pipe(
-    switchMap(
-      (extension) =>
-        new Observable<PolkadotSignerAccount[]>((subscriber) => {
-          if (extension === undefined) {
-            subscriber.next([]);
-          } else {
-            subscriber.next(this.#withIds(extension.getAccounts()));
-            subscriber.add(
-              extension.subscribe((accounts) =>
-                subscriber.next(this.#withIds(accounts)),
-              ),
-            );
-          }
-        }),
-    ),
+    switchMap((extension) => {
+      if (extension === undefined) {
+        return of([]);
+      }
+
+      return new Observable<PolkadotSignerAccount[]>((subscriber) => {
+        subscriber.next(this.#withIds(extension.getAccounts()));
+        subscriber.add(
+          extension.subscribe((accounts) =>
+            subscriber.next(this.#withIds(accounts)),
+          ),
+        );
+      });
+    }),
   );
 
   override getAccounts() {

packages/wallet-mimir/.gitignore

@@ -0,0 +1 @@
+build

packages/wallet-mimir/eslint.config.js

@@ -0,0 +1,4 @@
+import recommended from "@reactive-dot/eslint-config";
+import tseslint from "typescript-eslint";
+
+export default tseslint.config(...recommended);

packages/wallet-mimir/package.json

@@ -0,0 +1,47 @@
+{
+  "name": "@reactive-dot/wallet-mimir",
+  "version": "0.0.0",
+  "description": "Mimir adapter for Reactive DOT",
+  "keywords": [
+    "substrate",
+    "polkadot",
+    "mimir"
+  ],
+  "homepage": "https://reactivedot.dev/",
+  "bugs": {
+    "url": "https://github.com/tien/reactive-dot/issues",
+    "email": "tien.nguyenkhac@icloud.com"
+  },
+  "license": "LGPL-3.0-or-later",
+  "author": "Tiến Nguyễn Khắc <tien.nguyenkhac@icloud.com> (https://tien.zone/)",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/tien/reactive-dot.git",
+    "directory": "packages/wallet-mimir"
+  },
+  "type": "module",
+  "files": [
+    "src",
+    "build"
+  ],
+  "exports": "./build/index.js",
+  "scripts": {
+    "dev": "tsc --build --watch",
+    "build": "rm -rf build && tsc --build",
+    "lint": "eslint src",
+    "test": "vitest"
+  },
+  "dependencies": {
+    "@mimirdev/apps-inject": "^3.1.1",
+    "@mimirdev/papi-signer": "^3.1.0",
+    "@reactive-dot/core": "workspace:^"
+  },
+  "devDependencies": {
+    "@reactive-dot/eslint-config": "workspace:^",
+    "@tsconfig/recommended": "^1.0.8",
+    "@tsconfig/strictest": "^2.0.5",
+    "eslint": "^9.21.0",
+    "typescript": "^5.7.3",
+    "vitest": "^3.0.6"
+  }
+}

packages/wallet-mimir/src/index.test.ts

@@ -0,0 +1,10 @@
+import * as exports from "./index.js";
+import { expect, it } from "vitest";
+
+it("should match inline snapshot", () =>
+  expect(Object.keys(exports)).toMatchInlineSnapshot(`
+    [
+      "MimirWalletProvider",
+      "MimirWallet",
+    ]
+  `));

packages/wallet-mimir/src/index.ts

@@ -0,0 +1,2 @@
+export { MimirWalletProvider } from "./mimir-wallet-provider.js";
+export { MimirWallet } from "./mimir-wallet.js";

packages/wallet-mimir/src/mimir-wallet-provider.test.ts

@@ -0,0 +1,33 @@
+import { MimirWalletProvider } from "./mimir-wallet-provider.js";
+import { MimirWallet } from "./mimir-wallet.js";
+import { isMimirReady } from "@mimirdev/apps-inject";
+import { describe, it, expect, vi, beforeEach } from "vitest";
+
+vi.mock("@mimirdev/apps-inject");
+vi.mock("./mimir-wallet.js");
+
+let provider: MimirWalletProvider;
+
+beforeEach(() => {
+  provider = new MimirWalletProvider();
+
+  vi.clearAllMocks();
+});
+
+describe("getWallets", () => {
+  it("should return empty array when Mimir is not ready", async () => {
+    vi.mocked(isMimirReady).mockResolvedValue(null);
+    const wallets = await provider.getWallets();
+
+    expect(wallets).toEqual([]);
+    expect(isMimirReady).toHaveBeenCalled();
+  });
+
+  it("should return MimirWallet instance when Mimir is ready", async () => {
+    vi.mocked(isMimirReady).mockResolvedValue("origin");
+    const wallets = await provider.getWallets();
+
+    expect(wallets).toHaveLength(1);
+    expect(wallets[0]).toBeInstanceOf(MimirWallet);
+  });
+});

packages/wallet-mimir/src/mimir-wallet-provider.ts

@@ -0,0 +1,19 @@
+import { MimirWallet, type MimirWalletOptions } from "./mimir-wallet.js";
+import { isMimirReady } from "@mimirdev/apps-inject";
+import { WalletProvider } from "@reactive-dot/core/wallets.js";
+
+export class MimirWalletProvider extends WalletProvider {
+  constructor(private readonly options?: MimirWalletOptions) {
+    super();
+  }
+
+  async getWallets() {
+    const origin = await isMimirReady();
+
+    if (origin === null) {
+      return [];
+    }
+
+    return [new MimirWallet(this.options)];
+  }
+}