@kheopskit/core 0.0.1-alpha.0 → 0.0.1

package/src/api/polkadot/wallets.ts

@@ -1,103 +1,123 @@
 import { store } from "@/api/store";
-import type { PolkadotWallet } from "@/api/types";
-import { getWalletId, parseWalletId, type WalletId } from "@/utils/WalletId";
+import type {
+  KheopskitConfig,
+  PolkadotInjectedWallet,
+  PolkadotWallet,
+} from "@/api/types";
+import { type WalletId, getWalletId, parseWalletId } from "@/utils/WalletId";
+import { POLKADOT_EXTENSIONS } from "@/utils/polkadotExtensions";
 import { isEqual } from "lodash";
 import {
+  type InjectedExtension,
   connectInjectedExtension,
   getInjectedExtensions,
-  type InjectedExtension,
 } from "polkadot-api/pjs-signer";
 import {
   BehaviorSubject,
+  Observable,
   combineLatest,
   distinctUntilChanged,
   map,
   mergeMap,
-  Observable,
   of,
   shareReplay,
   timer,
 } from "rxjs";
+import { getAppKitWallets$ } from "../appKit";
 
 const getInjectedWalletsIds = () =>
   getInjectedExtensions().map((name) => getWalletId("polkadot", name));
 
-const polkadotInjectedWallets$ = new Observable<PolkadotWallet[]>(
-  (subscriber) => {
-    const enabledExtensions$ = new BehaviorSubject<
-      Map<WalletId, InjectedExtension>
-    >(new Map());
+export const polkadotInjectedWallets$ = new Observable<
+  PolkadotInjectedWallet[]
+>((subscriber) => {
+  const enabledExtensions$ = new BehaviorSubject<
+    Map<WalletId, InjectedExtension>
+  >(new Map());
 
-    const connect = async (walletId: WalletId) => {
-      if (enabledExtensions$.value.has(walletId))
-        throw new Error(`Extension ${walletId} already connected`);
-      const { identifier } = parseWalletId(walletId);
-      const extension = await connectInjectedExtension(identifier);
+  const connect = async (walletId: WalletId) => {
+    if (enabledExtensions$.value.has(walletId))
+      throw new Error(`Extension ${walletId} already connected`);
+    const { identifier } = parseWalletId(walletId);
+    const extension = await connectInjectedExtension(identifier);
 
-      const newMap = new Map(enabledExtensions$.value);
-      newMap.set(walletId, extension);
-      enabledExtensions$.next(newMap);
+    const newMap = new Map(enabledExtensions$.value);
+    newMap.set(walletId, extension);
+    enabledExtensions$.next(newMap);
 
-      store.addEnabledWalletId(walletId);
-    };
+    store.addEnabledWalletId(walletId);
+  };
 
-    const disconnect = (walletId: WalletId) => {
-      if (!enabledExtensions$.value.has(walletId))
-        throw new Error(`Extension ${walletId} is not connected`);
+  const disconnect = (walletId: WalletId) => {
+    if (!enabledExtensions$.value.has(walletId))
+      throw new Error(`Extension ${walletId} is not connected`);
 
-      const newMap = new Map(enabledExtensions$.value);
-      newMap.delete(walletId);
-      enabledExtensions$.next(newMap);
+    const newMap = new Map(enabledExtensions$.value);
+    newMap.delete(walletId);
+    enabledExtensions$.next(newMap);
 
-      store.removeEnabledWalletId(walletId);
-    };
+    store.removeEnabledWalletId(walletId);
+  };
 
-    const walletIds$ = of(0, 200, 500, 1000) // poll for wallets that register after page load
-      .pipe(
-        mergeMap((time) => timer(time)),
-        map(() => getInjectedWalletsIds()),
-        distinctUntilChanged<WalletId[]>(isEqual)
-      );
+  const walletIds$ = of(0, 200, 500, 1000) // poll for wallets that inject after page load
+    .pipe(
+      mergeMap((time) => timer(time)),
+      map(() => getInjectedWalletsIds()),
+      distinctUntilChanged<WalletId[]>(isEqual),
+    );
 
-    const subscription = combineLatest([walletIds$, enabledExtensions$])
-      .pipe(
-        map(([walletIds, enabledExtensions]) => {
-          return walletIds.map((id): PolkadotWallet => {
-            const { identifier } = parseWalletId(id);
-            const extension = enabledExtensions.get(id);
+  const subscription = combineLatest([walletIds$, enabledExtensions$])
+    .pipe(
+      map(([walletIds, enabledExtensions]) => {
+        return walletIds.map((id): PolkadotInjectedWallet => {
+          const { identifier } = parseWalletId(id);
+          const extension = enabledExtensions.get(id);
+          const extInfo = POLKADOT_EXTENSIONS[identifier];
+
+          return {
+            id,
+            type: "injected",
+            platform: "polkadot",
+            name: extInfo?.name ?? identifier,
+            icon: extInfo?.icon ?? "",
+            extensionId: identifier,
+            extension,
+            isConnected: !!extension,
+            connect: () => connect(id),
+            disconnect: () => disconnect(id),
+          };
+        });
+      }),
+    )
+    .subscribe(subscriber);
+
+  return () => {
+    // console.log("Unsubscribing from polkadotInjectedWallets$");
+    subscription.unsubscribe();
+  };
+}).pipe(
+  // logObservable("polkadotInjectedWallets$"),
+  shareReplay({ refCount: true, bufferSize: 1 }),
+);
 
-            return extension
-              ? {
-                  id,
-                  platform: "polkadot",
-                  name: identifier,
-                  extensionId: identifier,
-                  isEnabled: true,
-                  extension,
-                  disconnect: () => disconnect(id),
-                }
-              : {
-                  id,
-                  platform: "polkadot",
-                  name: identifier,
-                  extensionId: identifier,
-                  isEnabled: false,
-                  connect: () => connect(id),
-                };
-          });
-        })
+export const getPolkadotWallets$ = (config: KheopskitConfig) => {
+  return new Observable<PolkadotWallet[]>((subscriber) => {
+    const subscription = combineLatest([
+      polkadotInjectedWallets$,
+      getAppKitWallets$(config)?.pipe(map((w) => w.polkadot)),
+    ])
+      .pipe(
+        map(([injectedWallets, appKitWallet]) =>
+          appKitWallet ? [...injectedWallets, appKitWallet] : injectedWallets,
+        ),
       )
       .subscribe(subscriber);
 
     return () => {
       subscription.unsubscribe();
     };
-  }
-).pipe(shareReplay({ refCount: true, bufferSize: 1 }));
-
-// TODO merge with wallet connect
-export const polkadotWallets$ = polkadotInjectedWallets$;
-
-polkadotWallets$.subscribe(() => {
-  console.count("[kheopskit] polkadotWallets$ emit");
-});
+  }).pipe(
+    // logObservable("getPolkadotWallets$"),
+    shareReplay({ refCount: true, bufferSize: 1 }),
+  );
+};

package/src/api/store.ts

@@ -1,10 +1,13 @@
+import { type WalletId, parseWalletId } from "@/utils/WalletId";
 import { createStore } from "@/utils/createStore";
-import type { KheopskitStoreData } from "./types";
 import { uniq } from "lodash";
-import { parseWalletId, type WalletId } from "@/utils/WalletId";
 
 const LOCAL_STORAGE_KEY = "kheopskit";
 
+export type KheopskitStoreData = {
+  autoReconnect?: WalletId[];
+};
+
 const DEFAULT_SETTINGS: KheopskitStoreData = {};
 
 const storage = createStore(LOCAL_STORAGE_KEY, DEFAULT_SETTINGS);
@@ -21,7 +24,7 @@ export const removeEnabledWalletId = (walletId: WalletId) => {
   storage.mutate((prev) => ({
     ...prev,
     autoReconnect: uniq(
-      (prev.autoReconnect ?? []).filter((id) => id !== walletId)
+      (prev.autoReconnect ?? []).filter((id) => id !== walletId),
     ),
   }));
 };

package/src/api/types.ts

@@ -1,92 +1,109 @@
+import type { WalletAccountId } from "@/utils";
 import type { WalletId } from "@/utils/WalletId";
-import type { EIP1193Provider } from "viem";
+import type { AppKit } from "@reown/appkit/core";
+import type { AppKitNetwork } from "@reown/appkit/networks";
+import type { Metadata } from "@walletconnect/universal-provider";
 import type {
-  InjectedAccount,
   InjectedExtension,
-  PolkadotSigner,
+  InjectedPolkadotAccount,
 } from "polkadot-api/pjs-signer";
-import type { PolkadotAccount } from "./polkadot/accounts";
-import type { EthereumAccount } from "./ethereum/accounts";
-
-type AccountStorageBase = {
-  wallet: string;
-  address: string;
-};
-
-export type EthereumAccountStorage = AccountStorageBase & {
-  platform: "ethereum";
-};
-
-export type PolkadotAccountStorage = AccountStorageBase & {
-  platform: "polkadot";
-  name: InjectedAccount["name"];
-  type: InjectedAccount["type"]; // required, right?
-  genesisHash: InjectedAccount["genesisHash"];
-};
-
-export type AccountStorage = PolkadotAccountStorage | EthereumAccountStorage;
-
-export type Account<T extends AccountStorage> = T & {
-  id: string;
-  signer: T extends PolkadotAccountStorage ? PolkadotSigner : null;
-};
-
-export type PlatformData<T extends AccountStorageBase> = {
-  enabledExtensionIds: string[];
-  accounts: T[];
-  defaultAccountId: string | null;
-};
-
-export type KheopskitStoreData = {
-  // polkadot?: PlatformData<PolkadotAccountStorage>;
-  // ethereum?: PlatformData<EthereumAccountStorage>;
-  autoReconnect?: WalletId[];
-};
+import type {
+  Account,
+  CustomTransport,
+  EIP1193Provider,
+  WalletClient,
+} from "viem";
 
 export type KheopskitConfig = {
-  autoReconnect?: boolean;
+  autoReconnect: boolean;
   platforms: WalletPlatform[];
+  walletConnect?: {
+    projectId: string;
+    metadata: Metadata;
+    /** Defaults to wss://relay.walletconnect.com */
+    relayUrl?: string;
+    /**
+     * list of CAIP-13 ids of polkadot-sdk chains
+     * see https://docs.reown.com/advanced/multichain/polkadot/dapp-integration-guide#walletconnect-code%2Fcomponent-setup
+     */
+    networks: [AppKitNetwork, ...AppKitNetwork[]];
+  };
+  debug: boolean;
 };
 
-export type PolkadotDisabledInjectedWallet = {
+export type PolkadotInjectedWallet = {
   id: WalletId;
   platform: "polkadot";
+  type: "injected";
   extensionId: string;
+  extension: InjectedExtension | undefined;
   name: string;
-  isEnabled: false;
+  icon: string;
+  isConnected: boolean;
   connect: () => Promise<void>;
+  disconnect: () => void;
 };
 
-export type PolkadotEnabledInjectedWallet = {
+export type PolkadotAppKitWallet = {
   id: WalletId;
   platform: "polkadot";
-  extensionId: string;
-  extension: InjectedExtension;
+  type: "appKit";
+  appKit: AppKit;
   name: string;
-  isEnabled: true;
+  icon: string;
+  isConnected: boolean;
+  connect: () => Promise<void>;
   disconnect: () => void;
 };
 
-// TODO export type PolkadotWalletConnectWallet = {}
-
-export type PolkadotWallet =
-  | PolkadotDisabledInjectedWallet
-  | PolkadotEnabledInjectedWallet;
+export type PolkadotWallet = PolkadotInjectedWallet | PolkadotAppKitWallet;
 
-export type EthereumWallet = {
+export type EthereumInjectedWallet = {
   platform: "ethereum";
+  type: "injected";
   id: WalletId;
   providerId: string;
   provider: EIP1193Provider;
   name: string;
   icon: string;
-  isEnabled: boolean;
+  isConnected: boolean;
+  connect: () => Promise<void>;
+  disconnect: () => void;
+};
+
+export type EthereumAppKitWallet = {
+  platform: "ethereum";
+  type: "appKit";
+  id: WalletId;
+  appKit: AppKit;
+  name: string;
+  icon: string;
+  isConnected: boolean;
   connect: () => Promise<void>;
   disconnect: () => void;
 };
 
+export type EthereumWallet = EthereumInjectedWallet | EthereumAppKitWallet;
+
 export type Wallet = PolkadotWallet | EthereumWallet;
 
 export type WalletPlatform = Wallet["platform"];
 
+export type PolkadotAccount = InjectedPolkadotAccount & {
+  id: WalletAccountId;
+  platform: "polkadot";
+  walletName: string;
+  walletId: string;
+};
+
+export type EthereumAccount = {
+  id: WalletAccountId;
+  platform: "ethereum";
+  client: WalletClient<CustomTransport, undefined, Account, undefined>; // let consumer knows chain is unknown
+  address: `0x${string}`;
+  walletName: string;
+  walletId: string;
+  isWalletDefault: boolean;
+};
+
 export type WalletAccount = PolkadotAccount | EthereumAccount;

package/src/api/wallets.ts

@@ -1,54 +1,56 @@
+import { sortWallets } from "@/utils/sortWallets";
 import {
+  Observable,
   combineLatest,
   distinct,
   filter,
   map,
   mergeMap,
-  Observable,
   of,
   shareReplay,
   take,
 } from "rxjs";
-import type { ResolvedConfig } from "./config";
-import { ethereumWallets$ } from "./ethereum/wallets";
-import { polkadotWallets$ } from "./polkadot/wallets";
+import { getEthereumWallets$ } from "./ethereum/wallets";
+import { getPolkadotWallets$ } from "./polkadot/wallets";
 import { store } from "./store";
-import type { Wallet } from "./types";
+import type { KheopskitConfig, Wallet } from "./types";
 
 // lock the list of wallets to auto reconnect on first call
 const autoReconnectWalletIds$ = store.observable.pipe(
   map((s) => s.autoReconnect ?? []),
   take(1),
-  shareReplay(1)
+  shareReplay(1),
 );
 
-export const getWallets$ = (config: ResolvedConfig) => {
+export const getWallets$ = (config: KheopskitConfig) => {
   return new Observable<Wallet[]>((subscriber) => {
     const observables = config.platforms.map<Observable<Wallet[]>>(
       (platform) => {
         switch (platform) {
           case "polkadot":
-            return polkadotWallets$;
+            return getPolkadotWallets$(config);
           case "ethereum":
-            return ethereumWallets$;
+            return getEthereumWallets$(config);
         }
-      }
+      },
     );
 
     const wallets$ = observables.length
-      ? combineLatest(observables).pipe(map((wallets) => wallets.flat()))
+      ? combineLatest(observables).pipe(
+          map((wallets) => wallets.flat().sort(sortWallets)),
+        )
       : of([]);
 
     const subAutoReconnect = combineLatest([wallets$, autoReconnectWalletIds$])
       .pipe(
         filter(([, walletIds]) => config.autoReconnect && !!walletIds?.length),
         mergeMap(([wallets, walletIds]) =>
-          wallets.filter((wallet) => walletIds?.includes(wallet.id))
+          wallets.filter((wallet) => walletIds?.includes(wallet.id)),
         ),
-        distinct((w) => w.id)
+        distinct((w) => w.id),
       )
       .subscribe(async (wallet) => {
-        if (wallet.isEnabled) {
+        if (wallet.isConnected) {
           console.warn("Wallet %s already connected", wallet.id);
           return;
         }

package/src/index.ts

@@ -1,3 +1 @@
 export * from "./api";
-
-export type { KheopskitConfig } from "./api/types";

package/src/utils/{AccountId.ts → WalletAccountId.ts}

@@ -2,18 +2,18 @@ import type { SS58String } from "polkadot-api";
 
 import { isValidAddress } from "./isValidAddress";
 
-export type AccountId = string;
+export type WalletAccountId = string;
 
-export const getAccountId = (
+export const getWalletAccountId = (
   walletId: string,
-  address: SS58String
-): AccountId => {
+  address: SS58String,
+): WalletAccountId => {
   if (!walletId) throw new Error("Missing walletId");
   if (!isValidAddress(address)) throw new Error("Invalid address");
   return `${walletId}::${address}`;
 };
 
-export const parseAccountId = (accountId: string) => {
+export const parseWalletAccountId = (accountId: string) => {
   if (!accountId) throw new Error("Invalid walletAccountId");
   const [walletId, address] = accountId.split("::");
   if (!walletId) throw new Error("Missing walletId");

package/src/utils/WalletId.ts

@@ -5,7 +5,7 @@ export type WalletId = string;
 
 export const getWalletId = (
   platform: WalletPlatform,
-  identifier: string
+  identifier: string,
 ): WalletId => {
   if (!isWalletPlatform(platform)) throw new Error("Invalid platform");
   if (!identifier) throw new Error("Invalid name");

package/src/utils/createStore.ts

@@ -7,7 +7,7 @@ export const createStore = <T>(key: string, defaultValue: T) => {
   fromEvent<StorageEvent>(window, "storage")
     .pipe(
       filter((event) => event.key === key),
-      map((event) => parseData(event.newValue, defaultValue))
+      map((event) => parseData(event.newValue, defaultValue)),
     )
     .subscribe((newValue) => subject.next(newValue));
 

package/src/utils/getAccountAddressType.ts

@@ -1,6 +1,7 @@
 import { isEthereumAddress } from "./isEthereumAddress";
 import { isSs58Address } from "./isSs58Address";
-import type { AccountAddressType } from "./types";
+
+export type AccountAddressType = "ss58" | "ethereum";
 
 export const getAccountAddressType = (address: string): AccountAddressType => {
   if (address.startsWith("0x")) {

package/src/utils/getCachedObservable.ts

@@ -0,0 +1,12 @@
+import type { Observable } from "rxjs";
+
+const CACHE = new Map<string, Observable<unknown>>();
+
+export const getCachedObservable$ = <T, Obs = Observable<T>>(
+  key: string,
+  create: () => Obs,
+): Obs => {
+  if (!CACHE.has(key)) CACHE.set(key, create() as Observable<unknown>);
+
+  return CACHE.get(key) as Obs;
+};

package/src/utils/getQuery.ts

@@ -0,0 +1,72 @@
+import { isEqual } from "lodash";
+import {
+  BehaviorSubject,
+  Observable,
+  distinctUntilChanged,
+  shareReplay,
+} from "rxjs";
+
+import { getCachedObservable$ } from "./getCachedObservable";
+
+export type QueryStatus = "loading" | "loaded" | "error";
+
+export type QueryResult<
+  T,
+  S extends QueryStatus = "loading" | "loaded" | "error",
+> = S extends "loading"
+  ? { status: "loading"; data: T | undefined; error: undefined }
+  : S extends "loaded"
+    ? { status: "loaded"; data: T; error: undefined }
+    : { status: "error"; data: undefined; error: unknown };
+
+type QueryOptions<T> = {
+  queryKey: string;
+  queryFn: () => Promise<T>;
+  defaultValue?: T;
+  refreshInterval?: number;
+};
+
+export const getQuery$ = <T>({
+  queryKey,
+  queryFn,
+  defaultValue,
+  refreshInterval,
+}: QueryOptions<T>): Observable<QueryResult<T>> => {
+  return getCachedObservable$(queryKey, () =>
+    new Observable<QueryResult<T>>((subscriber) => {
+      const result = new BehaviorSubject<QueryResult<T>>({
+        status: "loading",
+        data: defaultValue,
+        error: undefined,
+      });
+
+      // result subscription
+      const sub = result
+        .pipe(distinctUntilChanged<QueryResult<T>>(isEqual))
+        .subscribe(subscriber);
+
+      let timeout: ReturnType<typeof setTimeout> | undefined = undefined;
+
+      // fetch result subscription
+      const run = () => {
+        queryFn()
+          .then((data) => {
+            result.next({ status: "loaded", data, error: undefined });
+          })
+          .catch((error) => {
+            result.next({ status: "error", data: undefined, error });
+          })
+          .finally(() => {
+            if (refreshInterval) timeout = setTimeout(run, refreshInterval);
+          });
+      };
+
+      run();
+
+      return () => {
+        sub.unsubscribe();
+        if (timeout) clearTimeout(timeout);
+      };
+    }).pipe(shareReplay({ refCount: true, bufferSize: 1 })),
+  );
+};

package/src/utils/index.ts

@@ -1,12 +1,10 @@
 // export all modules from this folder, except exports.ts
 export * from "./createStore";
 export * from "./getAccountAddressType";
-export * from "./AccountId";
+export * from "./WalletAccountId";
 export * from "./isEthereumAddress";
 export * from "./isSs58Address";
-export * from "./isTruthy";
 export * from "./isValidAddress";
 export * from "./sleep";
 export * from "./throwAfter";
-export * from "./types";
 export * from "./isWalletPlatform";

package/src/utils/isEthereumAddress.ts

@@ -1,2 +1,4 @@
+import { isAddress } from "viem";
+
 export const isEthereumAddress = (address: string): boolean =>
-  /^0x[a-fA-F0-9]{40}$/.test(address);
+  isAddress(address);

package/src/utils/isSs58Address.ts

@@ -3,13 +3,13 @@ import { AccountId, type SS58String } from "polkadot-api";
 const accountIdEncoder = AccountId().enc;
 
 export const isSs58Address = (
-  address: SS58String | string
+  address: SS58String | string,
 ): address is SS58String => {
   try {
     if (!address) return false;
     accountIdEncoder(address);
     return true;
-  } catch (_err) {
+  } catch {
     return false;
   }
 };

package/src/utils/isWalletPlatform.ts

@@ -1,7 +1,7 @@
 import type { WalletPlatform } from "@/api/types";
 
 export const isWalletPlatform = (
-  platform: unknown
+  platform: unknown,
 ): platform is WalletPlatform =>
   typeof platform === "string" &&
   ["polkadot", "ethereum"].includes(platform as WalletPlatform);

package/src/utils/logObservable.ts

@@ -0,0 +1,21 @@
+import { type MonoTypeOperatorFunction, tap } from "rxjs";
+
+type Opts = {
+  printValue?: boolean;
+  enabled?: boolean;
+};
+
+export const logObservable = <T>(
+  label: string,
+  opts?: Opts,
+): MonoTypeOperatorFunction<T> =>
+  tap((value) => {
+    const { printValue = false, enabled = true } = opts || {};
+
+    if (!label || !enabled) return;
+
+    const text = `[kheopskit] observable ${label} emit`;
+
+    if (printValue) console.debug(text, value);
+    else console.debug(text);
+  });