Merge pull request #4 from babylonlabs-io/feat/ui-components

feat: add state & core functionality

eslint.config.js

@@ -24,5 +24,8 @@ export default tseslint.config(
       "react-hooks": reactHooks,
       "react-refresh": reactRefresh,
     },
+    rules: {
+      "@typescript-eslint/no-explicit-any": 0,
+    },
   },
 );

package.json

@@ -31,6 +31,7 @@
     "@storybook/react": "^8.4.2",
     "@storybook/react-vite": "^8.4.2",
     "@storybook/test": "^8.4.2",
+    "@types/bitcoinjs-lib": "^5.0.4",
     "@types/react": "^18.3.12",
     "@types/react-dom": "^18.3.1",
     "@vitejs/plugin-react": "^4.3.3",

src/core/Wallet.ts

@@ -0,0 +1,93 @@
+import { IWallet, Network, IProvider, type NetworkConfig, type WalletMetadata } from "@/core/types";
+
+interface Options<P extends IProvider> {
+  id: string;
+  name: string;
+  icon: string;
+  docs: string;
+  networks: Network[];
+  origin: any;
+  provider: P | null;
+}
+
+const defaultWalletGetter = (key: string) => (context: any) => context[key];
+
+export class Wallet<P extends IProvider> implements IWallet {
+  readonly id: string;
+  readonly origin: any;
+  readonly name: string;
+  readonly icon: string;
+  readonly docs: string;
+  readonly networkds: Network[];
+  readonly provider: P | null = null;
+
+  static create = async <P extends IProvider>(metadata: WalletMetadata<P>, context: any, config: NetworkConfig) => {
+    const {
+      id,
+      wallet: walletGetter,
+      name: nameGetter,
+      icon: iconGetter,
+      docs = "",
+      networks = [],
+      createProvider,
+    } = metadata;
+
+    const options: Options<P> = {
+      id,
+      name: "",
+      icon: "",
+      origin: null,
+      provider: null,
+      docs,
+      networks,
+    };
+
+    if (walletGetter) {
+      const getWallet = typeof walletGetter === "string" ? defaultWalletGetter(walletGetter) : walletGetter;
+
+      options.origin = getWallet(context, config) ?? null;
+      options.provider = options.origin ? createProvider(options.origin, config) : null;
+    } else {
+      options.origin = null;
+      options.provider = createProvider(null, config);
+    }
+
+    if (typeof nameGetter === "string") {
+      options.name = nameGetter ?? "";
+    } else {
+      options.name = options.origin ? await nameGetter(options.origin, config) : "";
+    }
+
+    if (typeof iconGetter === "string") {
+      options.icon = iconGetter ?? "";
+    } else {
+      options.icon = options.origin ? await iconGetter(options.origin, config) : "";
+    }
+
+    return new Wallet(options);
+  };
+
+  constructor({ id, origin, name, icon, docs, networks, provider }: Options<P>) {
+    this.id = id;
+    this.origin = origin;
+    this.name = name;
+    this.icon = icon;
+    this.docs = docs;
+    this.networkds = networks;
+    this.provider = provider;
+  }
+
+  get installed() {
+    return Boolean(this.provider);
+  }
+
+  async connect() {
+    if (!this.provider) {
+      throw Error("Provider not found");
+    }
+
+    await this.provider.connectWallet();
+
+    return this;
+  }
+}

src/core/WalletConnector.ts

@@ -0,0 +1,34 @@
+import { Wallet } from "@/core/Wallet";
+import type { NetworkConfig, IProvider, IChain, ConnectMetadata } from "@/core/types";
+
+export class WalletConnector<P extends IProvider> implements IChain {
+  connectedWallet: Wallet<P> | null = null;
+
+  static async create<P extends IProvider>(
+    metadata: ConnectMetadata<P>,
+    config: NetworkConfig,
+    context: any,
+  ): Promise<WalletConnector<P>> {
+    const wallets: Wallet<P>[] = [];
+
+    for (const walletMetadata of metadata.wallets) {
+      wallets.push(await Wallet.create(walletMetadata, context, config));
+    }
+
+    return new WalletConnector(metadata.chain, metadata.icon, wallets);
+  }
+
+  constructor(
+    public readonly chain: string,
+    public readonly icon: string,
+    public readonly wallets: Wallet<P>[],
+  ) {}
+
+  async connect(name: string) {
+    const wallet = this.wallets.find((wallet) => wallet.name.toLowerCase() === name.toLowerCase());
+
+    this.connectedWallet = (await wallet?.connect()) ?? null;
+
+    return this.connectedWallet;
+  }
+}