@prosopo/procaptcha 0.2.13 → 0.2.15

package/dist/modules/Manager.js

@@ -1,31 +1,39 @@
 import { AccountNotFoundError } from '../api/errors.js';
-import { ApiPromise, Keyring, WsProvider } from '@polkadot/api';
-import { ProcaptchaConfigSchema } from '@prosopo/types';
-import { Observable, from, lastValueFrom } from 'rxjs';
+import { ApiPromise } from '@polkadot/api/promise/Api';
+import { ProcaptchaConfigSchema, } from '@prosopo/types';
+import { ProviderApi } from '@prosopo/api';
+import { Keyring } from '@polkadot/keyring';
 import { ProsopoCaptchaContract, wrapQuery } from '@prosopo/contract';
 import { ProsopoEnvError, trimProviderUrl } from '@prosopo/common';
-import { ProviderApi } from '@prosopo/api';
-import { ContractAbi as abiJson } from '@prosopo/captcha-contract';
+import { WsProvider } from '@polkadot/rpc-provider/ws';
+import { ContractAbi as abiJson } from '@prosopo/captcha-contract/contract-info';
 import { at } from '@prosopo/util';
-import { randomAsHex } from '@polkadot/util-crypto';
-import { retry, take } from 'rxjs/operators';
+import { randomAsHex } from '@polkadot/util-crypto/random';
+import { sleep } from '../utils/utils.js';
+import { stringToU8a } from '@polkadot/util/string';
 import ExtensionWeb2 from '../api/ExtensionWeb2.js';
 import ExtensionWeb3 from '../api/ExtensionWeb3.js';
 import ProsopoCaptchaApi from './ProsopoCaptchaApi.js';
 import storage from './storage.js';
-export const defaultState = () => ({
-    showModal: false,
-    loading: false,
-    index: 0,
-    challenge: undefined,
-    solutions: undefined,
-    isHuman: false,
-    captchaApi: undefined,
-    account: undefined,
-});
-const buildUpdateState = (state, onStateUpdate) => (nextState) => {
-    Object.assign(state, nextState);
-    onStateUpdate(nextState);
+export const defaultState = () => {
+    return {
+        showModal: false,
+        loading: false,
+        index: 0,
+        challenge: undefined,
+        solutions: undefined,
+        isHuman: false,
+        captchaApi: undefined,
+        account: undefined,
+    };
+};
+const buildUpdateState = (state, onStateUpdate) => {
+    const updateCurrentState = (nextState) => {
+        Object.assign(state, nextState);
+        onStateUpdate(nextState);
+        console.log('Procaptcha state update:', nextState, '\nResult:', state);
+    };
+    return updateCurrentState;
 };
 export const getNetwork = (config) => {
     const network = config.networks[config.defaultNetwork];
@@ -34,19 +42,16 @@ export const getNetwork = (config) => {
     }
     return network;
 };
-/**
- * The state operator. This is used to mutate the state of Procaptcha during the captcha process. State updates are published via the onStateUpdate callback. This should be used by frontends, e.g. react, to maintain the state of Procaptcha across renders.
- */
 export function Manager(configOptional, state, onStateUpdate, callbacks) {
     const alertError = (error) => {
-        console.error(error);
+        console.log(error);
         alert(error.message);
     };
     const events = Object.assign({
         onAccountNotFound: alertError,
         onError: alertError,
         onHuman: (output) => {
-            console.info('onHuman event triggered', output);
+            console.log('onHuman event triggered', output);
         },
         onExtensionNotFound: () => {
             alert('No extension found');
@@ -61,10 +66,10 @@ export function Manager(configOptional, state, onStateUpdate, callbacks) {
             alert('Uncompleted challenge has expired, please try again');
         },
         onOpen: () => {
-            console.info('onOpen event triggered');
+            console.log('onOpen event triggered');
         },
         onClose: () => {
-            console.info('onClose event triggered');
+            console.log('onClose event triggered');
         },
     }, callbacks);
     const dispatchErrorEvent = (err) => {
@@ -77,17 +82,16 @@ export function Manager(configOptional, state, onStateUpdate, callbacks) {
         }
     };
     const updateState = buildUpdateState(state, onStateUpdate);
-    /**
-     * Build the config on demand, using the optional config passed in from the outside. State may override various
-     * config values depending on the state of the captcha process. E.g. if the process has been started using account
-     * "ABC" and then the user changes account to "DEF" via the optional config prop, the account in use will not change.
-     * This is because the captcha process has already been started using account "ABC".
-     * @returns the config for procaptcha
-     */
-    const getConfig = () => ProcaptchaConfigSchema.parse({
-        ...configOptional,
-        userAccountAddress: state.account ? state.account.account.address : configOptional.userAccountAddress || '',
-    });
+    const getConfig = () => {
+        const config = {
+            userAccountAddress: '',
+            ...configOptional,
+        };
+        if (state.account) {
+            config.userAccountAddress = state.account.account.address;
+        }
+        return ProcaptchaConfigSchema.parse(config);
+    };
     const fallable = async (fn) => {
         try {
             await fn();
@@ -98,31 +102,58 @@ export function Manager(configOptional, state, onStateUpdate, callbacks) {
             updateState({ isHuman: false, showModal: false, loading: false });
         }
     };
-    /**
-     * Called on start of user verification. This is when the user ticks the box to claim they are human.
-     */
     const start = async () => {
+        console.log('Starting procaptcha');
         events.onOpen();
         await fallable(async () => {
-            if (state.loading || state.isHuman)
+            if (state.loading) {
+                console.log('Procaptcha already loading');
+                return;
+            }
+            if (state.isHuman) {
+                console.log('already human');
                 return;
+            }
             resetState();
-            updateState({ dappAccount: getConfig().account.address, loading: true });
+            updateState({ loading: true });
+            const config = getConfig();
+            updateState({ dappAccount: config.account.address });
+            await sleep(100);
             const account = await loadAccount();
             const contract = await loadContract();
-            if (await checkHumanInContract(contract, account)) {
-                handleHumanInContract(account);
+            let contractIsHuman = false;
+            try {
+                contractIsHuman = (await contract.query.dappOperatorIsHumanUser(account.account.address, config.solutionThreshold)).value
+                    .unwrap()
+                    .unwrap();
+            }
+            catch (error) {
+                console.warn(error);
+            }
+            if (contractIsHuman) {
+                updateState({ isHuman: true, loading: false });
+                events.onHuman({
+                    user: account.account.address,
+                    dapp: getDappAccount(),
+                });
+                setValidChallengeTimeout();
                 return;
             }
-            // Check if a provider is cached in local storage
             const providerUrlFromStorage = storage.getProviderUrl();
+            let providerApi;
             if (providerUrlFromStorage) {
+                providerApi = await loadProviderApi(providerUrlFromStorage);
                 try {
-                    // Verify cached provider is legitimate
-                    const verifyDappUserResponse = await getVerifyDappUserFunction(providerUrlFromStorage, account);
-                    // If legitimate cached provider, check if human in cached provider
+                    const verifyDappUserResponse = await providerApi.verifyDappUser(account.account.address, undefined, configOptional.challengeValidLength);
                     if (verifyDappUserResponse.solutionApproved) {
-                        handleHumanInCachedProvider(providerUrlFromStorage, account, verifyDappUserResponse);
+                        updateState({ isHuman: true, loading: false });
+                        events.onHuman({
+                            providerUrl: providerUrlFromStorage,
+                            user: account.account.address,
+                            dapp: getDappAccount(),
+                            commitmentId: verifyDappUserResponse.commitmentId,
+                        });
+                        setValidChallengeTimeout();
                         return;
                     }
                 }
@@ -130,36 +161,72 @@ export function Manager(configOptional, state, onStateUpdate, callbacks) {
                     console.error('Error contacting provider from storage', providerUrlFromStorage);
                 }
             }
-            // If not human in contract or cached provider, get new captcha from a random provider
-            const randomProviderResponse = await getRandomProviderResponse(contract, account);
-            const challenge = await getChallenge(randomProviderResponse, contract);
+            const payload = {
+                address: account.account.address,
+                data: stringToU8a('message'),
+                type: 'bytes',
+            };
+            const signed = await account.extension.signer.signRaw(payload);
+            console.log('Signature:', signed);
+            const getRandomProviderResponse = await wrapQuery(contract.query.getRandomActiveProvider, contract.query)(account.account.address, getDappAccount());
+            const blockNumber = parseInt(getRandomProviderResponse.blockNumber.toString());
+            console.log('provider', getRandomProviderResponse);
+            const providerUrl = trimProviderUrl(getRandomProviderResponse.provider.url.toString());
+            providerApi = await loadProviderApi(providerUrl);
+            console.log('providerApi', providerApi);
+            const captchaApi = await loadCaptchaApi(contract, getRandomProviderResponse, providerApi);
+            console.log('captchaApi', captchaApi);
+            const challenge = await captchaApi.getCaptchaChallenge();
+            console.log('challenge', challenge);
             if (challenge.captchas.length <= 0) {
                 throw new Error('No captchas returned from provider');
             }
+            const timeMillis = challenge.captchas
+                .map((captcha) => captcha.captcha.timeLimitMs || 30 * 1000)
+                .reduce((a, b) => a + b);
+            const timeout = setTimeout(() => {
+                console.log('challenge expired after ' + timeMillis + 'ms');
+                events.onChallengeExpired();
+                updateState({ isHuman: false, showModal: false, loading: false });
+            }, timeMillis);
             updateState({
-                challenge,
                 index: 0,
                 solutions: challenge.captchas.map(() => []),
+                challenge,
                 showModal: true,
-                timeout: setTimeToComplete(challenge),
-                blockNumber: getBlockNumberFromProvider(randomProviderResponse),
+                timeout,
+                blockNumber,
             });
         });
     };
-    /**
-     * Submit the captcha solution.
-     */
     const submit = async () => {
         await fallable(async () => {
+            console.log('submitting solutions');
             clearTimeout();
-            updateState({ showModal: false });
             if (!state.challenge) {
                 throw new Error('cannot submit, no challenge found');
             }
-            const datasetId = getDatasetId();
+            updateState({ showModal: false });
+            const challenge = state.challenge;
             const salt = randomAsHex();
-            // Build the captcha solution
-            const submission = await getCaptchaApi().submitCaptchaSolution(getAccount().extension.signer, state.challenge.requestHash, datasetId, getSolutionsFromState(salt), salt);
+            const captchaSolution = state.challenge.captchas.map((captcha, index) => {
+                const solution = at(state.solutions, index);
+                return {
+                    captchaId: captcha.captcha.captchaId,
+                    captchaContentId: captcha.captcha.captchaContentId,
+                    salt,
+                    solution,
+                };
+            });
+            const account = getAccount();
+            const blockNumber = getBlockNumber();
+            const signer = account.extension.signer;
+            const first = at(challenge.captchas, 0);
+            if (!first.captcha.datasetId) {
+                throw new Error('No datasetId set for challenge');
+            }
+            const captchaApi = getCaptchaApi();
+            const submission = await captchaApi.submitCaptchaSolution(signer, challenge.requestHash, first.captcha.datasetId, captchaSolution, salt);
             const isHuman = submission[0].solutionApproved;
             if (!isHuman) {
                 events.onFailed();
@@ -169,24 +236,26 @@ export function Manager(configOptional, state, onStateUpdate, callbacks) {
                 isHuman,
                 loading: false,
             });
-            if (isHuman) {
-                const trimmedUrl = trimProviderUrl(getCaptchaApi().provider.provider.url.toString());
+            if (state.isHuman) {
+                const trimmedUrl = trimProviderUrl(captchaApi.provider.provider.url.toString());
                 storage.setProviderUrl(trimmedUrl);
                 events.onHuman({
                     providerUrl: trimmedUrl,
-                    user: getAccount().account.address,
+                    user: account.account.address,
                     dapp: getDappAccount(),
                     commitmentId: submission[1],
-                    blockNumber: getBlockNumberFromState(),
+                    blockNumber,
                 });
                 setValidChallengeTimeout();
             }
         });
     };
-    /**
-     * (De)Select an image from the solution for the current round. If the hash is already in the solutions list, it will be removed (deselected) and if not it will be added (selected).
-     * @param hash the hash of the image
-     */
+    const cancel = async () => {
+        console.log('cancel');
+        clearTimeout();
+        resetState();
+        events.onClose();
+    };
     const select = (hash) => {
         if (!state.challenge) {
             throw new Error('cannot select, no challenge found');
@@ -194,13 +263,19 @@ export function Manager(configOptional, state, onStateUpdate, callbacks) {
         if (state.index >= state.challenge.captchas.length || state.index < 0) {
             throw new Error('cannot select, round index out of range');
         }
-        const solution = at(state.solutions, state.index);
-        handleIsSelected(solution, hash);
-        updateState({ solutions: state.solutions });
+        const index = state.index;
+        const solutions = state.solutions;
+        const solution = at(solutions, index);
+        if (solution.includes(hash)) {
+            console.log('deselecting', hash);
+            solution.splice(solution.indexOf(hash), 1);
+        }
+        else {
+            console.log('selecting', hash);
+            solution.push(hash);
+        }
+        updateState({ solutions });
     };
-    /**
-     * Proceed to the next round of the challenge.
-     */
     const nextRound = () => {
         if (!state.challenge) {
             throw new Error('cannot proceed to next round, no challenge found');
@@ -208,214 +283,37 @@ export function Manager(configOptional, state, onStateUpdate, callbacks) {
         if (state.index + 1 >= state.challenge.captchas.length) {
             throw new Error('cannot proceed to next round, already at last round');
         }
+        console.log('proceeding to next round');
         updateState({ index: state.index + 1 });
     };
-    /**
-     * Load the captcha api using the contract and provider.
-     * @param contract the contract instance
-     * @param provider the provider instance
-     * @param providerApi the provider api instance
-     */
     const loadCaptchaApi = async (contract, provider, providerApi) => {
-        updateState({
-            captchaApi: new ProsopoCaptchaApi(getAccount().account.address, contract, provider, providerApi, getConfig().web2, getDappAccount()),
-        });
-        return getCaptchaApi();
-    };
-    /**
-     * Create an observable that emits on every new block.
-     * Used for retrying random provider requests.
-     */
-    const createBlockObservable = () => new Observable((subscriber) => () => ApiPromise.create({ provider: new WsProvider(getNetwork(getConfig()).endpoint) })
-        .then((api) => {
-        api.rpc.chain.subscribeNewHeads((header) => {
-            subscriber.next(header);
-        });
-    })
-        .catch((error) => {
-        subscriber.error(error);
-    }));
-    /**
-     * Load the account using address specified in config, or generate new address if not found in local storage for web2 mode.
-     */
-    const loadAccount = async () => {
         const config = getConfig();
-        if (!config.web2 && !config.userAccountAddress) {
-            throw new Error('Account address has not been set for web3 mode');
-        }
-        const ext = config.web2 ? new ExtensionWeb2() : new ExtensionWeb3();
-        const account = await ext.getAccount(config);
-        storage.setAccount(account.account.address);
-        updateState({ account });
-        return getAccount();
+        const captchaApi = new ProsopoCaptchaApi(getAccount().account.address, contract, provider, providerApi, config.web2, getDappAccount());
+        updateState({ captchaApi });
+        return getCaptchaApi();
     };
-    /**
-     * Load the provider api
-     * @param providerUrl
-     */
     const loadProviderApi = async (providerUrl) => {
         const config = getConfig();
+        const network = getNetwork(config);
         if (!config.account.address) {
             throw new ProsopoEnvError('GENERAL.SITE_KEY_MISSING');
         }
-        return new ProviderApi(getNetwork(config), providerUrl, config.account.address);
-    };
-    /**
-     * Load the contract instance using addresses from config.
-     */
-    const loadContract = async () => {
-        const network = getNetwork(getConfig());
-        const api = await ApiPromise.create({ provider: new WsProvider(network.endpoint) });
-        const type = 'sr25519';
-        return new ProsopoCaptchaContract(api, JSON.parse(abiJson), network.contract.address, 'prosopo', 0, new Keyring({ type, ss58Format: api.registry.chainSS58 }).addFromAddress(getAccount().account.address));
-    };
-    /**
-     * Handles whether clicking on an image should select or deselect it.
-     * @param solution
-     * @param hash
-     */
-    function handleIsSelected(solution, hash) {
-        if (solution.includes(hash)) {
-            solution.splice(solution.indexOf(hash), 1);
-        }
-        else {
-            solution.push(hash);
-        }
-    }
-    /**
-     * Get the solutions from the state, with the salt added.
-     * @param salt
-     * @returns
-     */
-    function getSolutionsFromState(salt) {
-        if (!state.challenge) {
-            throw new Error('cannot get solutions, no challenge found');
-        }
-        return state.challenge.captchas.map((captcha, index) => ({
-            captchaId: captcha.captcha.captchaId,
-            captchaContentId: captcha.captcha.captchaContentId,
-            salt,
-            solution: at(state.solutions, index),
-        }));
-    }
-    /**
-     * Handle the case where the user is human and the provider is cached in local storage
-     * @param providerUrlFromStorage
-     * @param account
-     * @param verifyDappUserResponse
-     */
-    function handleHumanInCachedProvider(providerUrlFromStorage, account, verifyDappUserResponse) {
-        updateState({ isHuman: true, loading: false });
-        events.onHuman({
-            providerUrl: providerUrlFromStorage,
-            user: account.account.address,
-            dapp: getDappAccount(),
-            commitmentId: verifyDappUserResponse.commitmentId,
-        });
-        setValidChallengeTimeout();
-    }
-    /**
-     * Get the verifyDappUser function from the provider api
-     * @param providerUrlFromStorage
-     * @param account
-     * @returns
-     */
-    function getVerifyDappUserFunction(providerUrlFromStorage, account) {
-        return loadProviderApi(providerUrlFromStorage).then((providerApi) => providerApi.verifyDappUser(account.account.address));
-    }
-    /**
-     * Handle the case where the user is human and the provider is cached in the contract
-     * @param account
-     */
-    function handleHumanInContract(account) {
-        updateState({ isHuman: true, loading: false });
-        events.onHuman({
-            user: account.account.address,
-            dapp: getDappAccount(),
-        });
-        setValidChallengeTimeout();
-    }
-    /**
-     * Check if the user is human in the contract
-     * @param contract
-     * @param account
-     * @returns
-     */
-    async function checkHumanInContract(contract, account) {
-        try {
-            return await contract.query
-                .dappOperatorIsHumanUser(account.account.address, getConfig().solutionThreshold)
-                .then((res) => res.value.unwrap().unwrap());
-        }
-        catch (err) {
-            console.error(err);
-            return false;
-        }
-    }
-    /**
-     * Get the captcha challenge from the provider api
-     * @param getRandomProviderResponse
-     * @param contract
-     * @returns
-     */
-    function getChallenge(getRandomProviderResponse, contract) {
-        return loadProviderApi(trimProviderUrl(getRandomProviderResponse.provider.url.toString()))
-            .then((api) => loadCaptchaApi(contract, getRandomProviderResponse, api))
-            .then((captchaApi) => captchaApi.getCaptchaChallenge());
-    }
-    /**
-     * Get a random provider from the contract
-     * Uses retry to handle the case where the provider is not available on the first attempt
-     * Waits for block rollover to ensure new provider selected
-     * Returns promise
-     *
-     * @param contract
-     * @param account
-     * @returns
-     */
-    function getRandomProviderResponse(contract, account) {
-        return lastValueFrom(from(wrapQuery(contract.query.getRandomActiveProvider, contract.query)(account.account.address, getDappAccount())).pipe(retry({
-            count: 3,
-            delay: (error, retryCount) => {
-                console.error(`Attempt ${retryCount} failed. Retrying on next block. Error: ${error}`);
-                return createBlockObservable().pipe(take(1));
-            },
-            resetOnSuccess: true,
-        })));
-    }
-    /**
-     * Verify the captcha data
-     * @param challenge
-     * @returns
-     */
-    function setTimeToComplete(challenge) {
-        return setTimeout(() => {
-            events.onChallengeExpired();
-            updateState({ isHuman: false, showModal: false, loading: false });
-        }, challenge.captchas.map((captcha) => captcha.captcha.timeLimitMs || 30 * 1000).reduce((a, b) => a + b));
-    }
-    /**
-     * The timeout for the challenge to be completed
-     * Defaults to 2 minutes
-     * @returns
-     */
-    const setValidChallengeTimeout = () => {
-        updateState({
-            successfullChallengeTimeout: setTimeout(() => {
-                updateState({ isHuman: false });
-                events.onExpired();
-            }, configOptional.challengeValidLength || 120 * 1000),
-        });
-    };
-    const cancel = async () => {
-        clearTimeout();
-        resetState();
-        events.onClose();
+        return new ProviderApi(network, providerUrl, config.account.address);
     };
     const clearTimeout = () => {
         window.clearTimeout(state.timeout);
         updateState({ timeout: undefined });
     };
+    const setValidChallengeTimeout = () => {
+        console.log('setting valid challenge timeout');
+        const timeMillis = configOptional.challengeValidLength || 120 * 1000;
+        const successfullChallengeTimeout = setTimeout(() => {
+            console.log('valid challenge expired after ' + timeMillis + 'ms');
+            updateState({ isHuman: false });
+            events.onExpired();
+        }, timeMillis);
+        updateState({ successfullChallengeTimeout });
+    };
     const resetState = () => {
         clearTimeout();
         updateState(defaultState());
@@ -426,37 +324,47 @@ export function Manager(configOptional, state, onStateUpdate, callbacks) {
         }
         return state.captchaApi;
     };
+    const loadAccount = async () => {
+        const config = getConfig();
+        if (!config.web2 && !config.userAccountAddress) {
+            throw new Error('Account address has not been set for web3 mode');
+        }
+        const ext = config.web2 ? new ExtensionWeb2() : new ExtensionWeb3();
+        const account = await ext.getAccount(config);
+        storage.setAccount(account.account.address);
+        console.log('Using account:', account);
+        updateState({ account });
+        return getAccount();
+    };
     const getAccount = () => {
         if (!state.account) {
             throw new Error('Account not loaded');
         }
-        return state.account;
+        const account = state.account;
+        return account;
     };
     const getDappAccount = () => {
         if (!state.dappAccount) {
             throw new ProsopoEnvError('GENERAL.SITE_KEY_MISSING');
         }
-        return state.dappAccount;
+        const dappAccount = state.dappAccount;
+        return dappAccount;
     };
-    const getBlockNumberFromState = () => {
+    const getBlockNumber = () => {
         if (!state.blockNumber) {
             throw new Error('Account not loaded');
         }
-        return state.blockNumber;
+        const blockNumber = state.blockNumber;
+        return blockNumber;
+    };
+    const loadContract = async () => {
+        const config = getConfig();
+        const network = getNetwork(config);
+        const api = await ApiPromise.create({ provider: new WsProvider(network.endpoint), initWasm: false });
+        const type = 'sr25519';
+        const keyring = new Keyring({ type, ss58Format: api.registry.chainSS58 });
+        return new ProsopoCaptchaContract(api, JSON.parse(abiJson), network.contract.address, 'prosopo', 0, keyring.addFromAddress(getAccount().account.address));
     };
-    function getBlockNumberFromProvider(getRandomProviderResponse) {
-        return parseInt(getRandomProviderResponse.blockNumber.toString());
-    }
-    function getDatasetId() {
-        if (!state.challenge) {
-            throw new Error('cannot get datasetId, no challenge found');
-        }
-        const datasetId = at(state.challenge.captchas, 0).captcha.datasetId;
-        if (!datasetId) {
-            throw new Error('No datasetId set for challenge');
-        }
-        return datasetId;
-    }
     return {
         start,
         cancel,