@ckb-ccc/connector-react 0.0.12-alpha.7 → 0.0.13-alpha.0

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @ckb-ccc/connector-react
 
+## 0.0.13-alpha.0
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @ckb-ccc/connector@0.0.13-alpha.0
+
+## 0.0.12
+
+### Patch Changes
+
+- [`591e779`](https://github.com/ckb-ecofund/ccc/commit/591e7794ce3d07ceaad55b7a80d2277fe0aa9fe7) Thanks [@Hanssen0](https://github.com/Hanssen0)! - feat: custom SignersController
+
+- Updated dependencies [[`6bee006`](https://github.com/ckb-ecofund/ccc/commit/6bee006fbcb96986c65ca4d2d896fca21db2503b), [`591e779`](https://github.com/ckb-ecofund/ccc/commit/591e7794ce3d07ceaad55b7a80d2277fe0aa9fe7)]:
+  - @ckb-ccc/connector@0.0.12
+
 ## 0.0.12-alpha.7
 
 ### Patch Changes

package/README.md

@@ -1,5 +1,5 @@
 <p align="center">
-  <a href="https://ckbccc-demo.vercel.app/">
+  <a href="https://app.ckbccc.com/">
     <img alt="Logo" src="https://raw.githubusercontent.com/ckb-ecofund/ccc/master/assets/logo.svg" width="20%" />
   </a>
 </p>
@@ -14,9 +14,12 @@
   /></a>
   <img alt="GitHub commit activity" src="https://img.shields.io/github/commit-activity/m/ckb-ecofund/ccc" />
   <img alt="GitHub last commit" src="https://img.shields.io/github/last-commit/ckb-ecofund/ccc/master" />
-  <img alt="GitHub deployments" src="https://img.shields.io/github/deployments/ckb-ecofund/ccc/production" />
-  <a href="https://ckbccc-demo.vercel.app/"><img
-    alt="Demo" src="https://img.shields.io/website?url=https%3A%2F%2Fckbccc-demo.vercel.app%2F&label=Demo"
+  <img alt="GitHub branch check runs" src="https://img.shields.io/github/check-runs/ckb-ecofund/ccc/master" />
+  <a href="https://app.ckbccc.com/"><img
+    alt="App" src="https://img.shields.io/website?url=https%3A%2F%2Fapp.ckbccc.com%2F&label=App"
+  /></a>
+  <a href="https://docs.ckbccc.com/"><img
+    alt="Docs" src="https://img.shields.io/website?url=https%3A%2F%2Fdocs.ckbccc.com%2F&label=Docs"
   /></a>
 </p>
 
@@ -33,13 +36,13 @@
 ## Preview
 
 <p align="center">
-  <a href="https://ckbccc-demo.vercel.app/">
+  <a href="https://app.ckbccc.com/">
     <img src="https://raw.githubusercontent.com/ckb-ecofund/ccc/master/assets/preview.png" width="30%" />
   </a>
 </p>
 
-This project is still under active development, and we are looking forward to your feedback. [Try its demo now here](https://ckbccc-demo.vercel.app/). It showcases how to use CCC for some basic scenarios in CKB.
+This project is still under active development, and we are looking forward to your feedback. [Try its demo now here](https://app.ckbccc.com/). It showcases how to use CCC for some basic scenarios in CKB.
 
 <h3 align="center">
-  Read more about CCC on its <a href="https://github.com/ckb-ecofund/ccc">GitHub Repo</a>.
+  Read more about CCC on <a href="https://docs.ckbccc.com">our website</a> or <a href="https://github.com/ckb-ecofund/ccc">GitHub Repo</a>.
 </h3>

package/dist/hooks/useCcc.d.ts

@@ -1,11 +1,12 @@
 import { ccc } from "@ckb-ccc/connector";
 import React from "react";
-export declare function Provider({ children, connectorProps, name, icon, signerFilter, defaultClient, preferredNetworks, }: {
+export declare function Provider({ children, connectorProps, name, icon, signerFilter, signersController, defaultClient, preferredNetworks, }: {
     children: React.ReactNode;
     connectorProps?: React.HTMLAttributes<{}>;
     name?: string;
     icon?: string;
     signerFilter?: (signerInfo: ccc.SignerInfo, wallet: ccc.Wallet) => Promise<boolean>;
+    signersController?: ccc.SignersController;
     defaultClient?: ccc.Client;
     preferredNetworks?: ccc.NetworkPreference[];
 }): React.JSX.Element;

package/dist/hooks/useCcc.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useCcc.d.ts","sourceRoot":"","sources":["../../src/hooks/useCcc.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,oBAAoB,CAAC;AACzC,OAAO,KAMN,MAAM,OAAO,CAAC;AAef,wBAAgB,QAAQ,CAAC,EACvB,QAAQ,EACR,cAAc,EACd,IAAI,EACJ,IAAI,EACJ,YAAY,EACZ,aAAa,EACb,iBAAiB,GAClB,EAAE;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,cAAc,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,EAAE,CAAC,CAAC;IAC1C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,CACb,UAAU,EAAE,GAAG,CAAC,UAAU,EAC1B,MAAM,EAAE,GAAG,CAAC,MAAM,KACf,OAAO,CAAC,OAAO,CAAC,CAAC;IACtB,aAAa,CAAC,EAAE,GAAG,CAAC,MAAM,CAAC;IAC3B,iBAAiB,CAAC,EAAE,GAAG,CAAC,iBAAiB,EAAE,CAAC;CAC7C,qBAsEA;AAED,wBAAgB,MAAM;;;;;;;EAQrB"}
+{"version":3,"file":"useCcc.d.ts","sourceRoot":"","sources":["../../src/hooks/useCcc.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,oBAAoB,CAAC;AACzC,OAAO,KAON,MAAM,OAAO,CAAC;AAuCf,wBAAgB,QAAQ,CAAC,EACvB,QAAQ,EACR,cAAc,EACd,IAAI,EACJ,IAAI,EACJ,YAAY,EACZ,iBAAiB,EACjB,aAAa,EACb,iBAAiB,GAClB,EAAE;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,cAAc,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,EAAE,CAAC,CAAC;IAC1C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,CACb,UAAU,EAAE,GAAG,CAAC,UAAU,EAC1B,MAAM,EAAE,GAAG,CAAC,MAAM,KACf,OAAO,CAAC,OAAO,CAAC,CAAC;IACtB,iBAAiB,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC;IAC1C,aAAa,CAAC,EAAE,GAAG,CAAC,MAAM,CAAC;IAC3B,iBAAiB,CAAC,EAAE,GAAG,CAAC,iBAAiB,EAAE,CAAC;CAC7C,qBAoFA;AAED,wBAAgB,MAAM;;;;;;;EAQrB"}

package/dist/hooks/useCcc.js

@@ -1,11 +1,24 @@
 import { ccc } from "@ckb-ccc/connector";
-import React, { createContext, useCallback, useEffect, useMemo, useState, } from "react";
+import React, { createContext, useCallback, useEffect, useMemo, useRef, useState, } from "react";
 import { Connector } from "../components/index.js";
 const CCC_CONTEXT = createContext(undefined);
-export function Provider({ children, connectorProps, name, icon, signerFilter, defaultClient, preferredNetworks, }) {
+class SignersControllerWithFilter extends ccc.SignersController {
+    constructor(filter) {
+        super();
+        this.filter = filter;
+    }
+    async addSigner(walletName, icon, signerInfo, context) {
+        if (!(await this.filter?.(signerInfo, { name: walletName, icon }))) {
+            return;
+        }
+        return super.addSigner(walletName, icon, signerInfo, context);
+    }
+}
+export function Provider({ children, connectorProps, name, icon, signerFilter, signersController, defaultClient, preferredNetworks, }) {
     const [ref, setRef] = useState(null);
     const [isOpen, setIsOpen] = useState(false);
     const [_, setFlag] = useState(0);
+    const defautlSignersController = useRef(undefined);
     const client = useMemo(() => ref?.client ?? new ccc.ClientPublicTestnet(), [ref?.client]);
     const open = useCallback(() => {
         setIsOpen(true);
@@ -18,6 +31,14 @@ export function Provider({ children, connectorProps, name, icon, signerFilter, d
             setClient(defaultClient);
         }
     }, [setClient]);
+    useEffect(() => {
+        if (!defautlSignersController.current) {
+            defautlSignersController.current = new SignersControllerWithFilter(signerFilter);
+        }
+        else {
+            defautlSignersController.current.filter = signerFilter;
+        }
+    }, [signerFilter]);
     return (React.createElement(CCC_CONTEXT.Provider, { value: {
             open,
             disconnect,
@@ -26,7 +47,7 @@ export function Provider({ children, connectorProps, name, icon, signerFilter, d
             wallet: ref?.wallet,
             signerInfo: ref?.signer,
         } },
-        React.createElement(Connector, { name: name, icon: icon, signerFilter: signerFilter, ref: setRef, onWillUpdate: () => setFlag((f) => f + 1), onClose: () => setIsOpen(false), preferredNetworks: preferredNetworks, ...connectorProps,
+        React.createElement(Connector, { name: name, icon: icon, signersController: signersController ?? defautlSignersController.current, ref: setRef, onWillUpdate: () => setFlag((f) => f + 1), onClose: () => setIsOpen(false), preferredNetworks: preferredNetworks, ...connectorProps,
             style: {
                 ...connectorProps?.style,
                 zIndex: connectorProps?.style?.zIndex ?? 999,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ckb-ccc/connector-react",
-  "version": "0.0.12-alpha.7",
+  "version": "0.0.13-alpha.0",
   "description": "CCC - CKBer's Codebase. Common Chains Connector UI Component for React",
   "author": "Hanssen0 <hanssen0@hanssen0.com>",
   "license": "MIT",
@@ -36,7 +36,7 @@
   "dependencies": {
     "@lit/react": "^1.0.5",
     "react": "^18",
-    "@ckb-ccc/connector": "0.0.12-alpha.7"
+    "@ckb-ccc/connector": "0.0.13-alpha.0"
   },
   "scripts": {
     "build": "rimraf ./dist && tsc",

package/src/hooks/useCcc.tsx

@@ -4,6 +4,7 @@ import React, {
   useCallback,
   useEffect,
   useMemo,
+  useRef,
   useState,
 } from "react";
 import { Connector } from "../components/index.js";
@@ -20,12 +21,37 @@ const CCC_CONTEXT = createContext<
   | undefined
 >(undefined);
 
+class SignersControllerWithFilter extends ccc.SignersController {
+  constructor(
+    public filter?: (
+      signerInfo: ccc.SignerInfo,
+      wallet: ccc.Wallet,
+    ) => Promise<boolean>,
+  ) {
+    super();
+  }
+
+  async addSigner(
+    walletName: string,
+    icon: string,
+    signerInfo: ccc.SignerInfo,
+    context: ccc.SignersControllerRefreshContext,
+  ) {
+    if (!(await this.filter?.(signerInfo, { name: walletName, icon }))) {
+      return;
+    }
+
+    return super.addSigner(walletName, icon, signerInfo, context);
+  }
+}
+
 export function Provider({
   children,
   connectorProps,
   name,
   icon,
   signerFilter,
+  signersController,
   defaultClient,
   preferredNetworks,
 }: {
@@ -37,12 +63,16 @@ export function Provider({
     signerInfo: ccc.SignerInfo,
     wallet: ccc.Wallet,
   ) => Promise<boolean>;
+  signersController?: ccc.SignersController;
   defaultClient?: ccc.Client;
   preferredNetworks?: ccc.NetworkPreference[];
 }) {
   const [ref, setRef] = useState<ccc.WebComponentConnector | null>(null);
   const [isOpen, setIsOpen] = useState(false);
   const [_, setFlag] = useState(0);
+  const defautlSignersController = useRef<
+    SignersControllerWithFilter | undefined
+  >(undefined);
 
   const client = useMemo(
     () => ref?.client ?? new ccc.ClientPublicTestnet(),
@@ -66,6 +96,15 @@ export function Provider({
       setClient(defaultClient);
     }
   }, [setClient]);
+  useEffect(() => {
+    if (!defautlSignersController.current) {
+      defautlSignersController.current = new SignersControllerWithFilter(
+        signerFilter,
+      );
+    } else {
+      defautlSignersController.current.filter = signerFilter;
+    }
+  }, [signerFilter]);
 
   return (
     <CCC_CONTEXT.Provider
@@ -82,7 +121,9 @@ export function Provider({
       <Connector
         name={name}
         icon={icon}
-        signerFilter={signerFilter}
+        signersController={
+          signersController ?? defautlSignersController.current
+        }
         ref={setRef}
         onWillUpdate={() => setFlag((f) => f + 1)}
         onClose={() => setIsOpen(false)}

package/typedoc.json

@@ -0,0 +1,6 @@
+{
+  "$schema": "https://typedoc.org/schema.json",
+  "entryPoints": ["./src/index.ts", "./src/advanced.ts"],
+  "extends": ["../../typedoc.base.json"],
+  "name": "@ckb-ccc connector-react"
+}