From fb04a913e0cbc9c4ad8f570b6be5c725ff02d84e Mon Sep 17 00:00:00 2001 From: peetzweg/ Date: Wed, 20 Sep 2023 13:56:18 +0200 Subject: [PATCH] removes tmp dev file --- .../src/components/pg-home/HomePageSmol.tsx | 716 ------------------ 1 file changed, 716 deletions(-) delete mode 100644 playground/src/components/pg-home/HomePageSmol.tsx diff --git a/playground/src/components/pg-home/HomePageSmol.tsx b/playground/src/components/pg-home/HomePageSmol.tsx deleted file mode 100644 index 2ff499f..0000000 --- a/playground/src/components/pg-home/HomePageSmol.tsx +++ /dev/null @@ -1,716 +0,0 @@ -import Link from 'next/link'; -import { useEffect, useState } from 'react'; -/* eslint-disable @next/next/no-img-element */ -import { - VerificationState, - useBalance, - useBlockHeader, - useBlockHeaders, - useCall, - useCallSubscription, - useChainRpc, - useChainRpcList, - useContract, - useDryRun, - useEventSubscription, - useEvents, - useInstalledWallets, - useMessageSigner, - useSignatureVerifier, - useTimestampDate, - useTimestampNow, - useTokenSymbol, - useTx, - useTxPaymentInfo, - useUninstalledWallets, - useWallet, -} from 'useink'; -import { ChainId } from 'useink/chains'; -import { useNotifications, useTxNotifications } from 'useink/notifications'; -import { - RustResult, - isBroadcast, - isFinalized, - isInBlock, - isPendingSignature, - pickDecoded, - pickDecodedError, - pickResultErr, - pickResultOk, - pickTxInfo, - planckToDecimalFormatted, - shouldDisable, -} from 'useink/utils'; -import metadata from '../../metadata/playground.json'; -import { Notifications } from '../Notifications'; - -const CONTRACTS_ROCOCO_ADDRESS = - '5G31GiBqWPFCm8S9cknY7UWAPA8SwNJJdoG4RrmtVDQyrk7Y'; - -const SHIBUYA_CONTRACT_ADDRESS = - /* cSpell:disable */ - 'XtH77i6CYHSSg7tFerUMCSWifBcAz2gewDXeyQNCbgRXHs8'; - -interface Happy { - mood: string; -} -interface BadMood { - BadMood: { mood: string }; -} -// RustResult is a convenience type to define { Ok?: T, Err?: E }, returned by calls -// to contracts that return a Result -type MoodResult = RustResult; - -export const HomePage: React.FC = () => { - const { account, accounts, setAccount, connect, disconnect } = useWallet(); - const block = useBlockHeader(); // with no arguments it defaults to the first item in the chains config - const astarBlockNumber = useBlockHeader('astar'); - const allChainBlockHeaders = useBlockHeaders(); - const balance = useBalance(account); - const cRococoContract = useContract(CONTRACTS_ROCOCO_ADDRESS, metadata); - const { rpcs, setChainRpc } = useChainRpcList('astar'); - const astarRpc = useChainRpc('astar'); - const get = useCall(cRococoContract, 'get'); - const signer = useMessageSigner(); - const signatureVerifier = useSignatureVerifier(); - const [messageToSign, setMessageToSign] = useState( - 'Sign this message, or change me and then sign!', - ); - const getSubcription = useCallSubscription( - cRococoContract, - 'get', - [], - { defaultCaller: true }, - ); - const flipTx = useTx(cRococoContract, 'flip'); - const flipDryRun = useDryRun(cRococoContract, 'flip'); - const flipPaymentInfo = useTxPaymentInfo(cRococoContract, 'flip'); - const panic = useCall(cRococoContract, 'panic'); - const assertBoom = useCall(cRococoContract, 'assertBoom'); - const mood = useCall(cRococoContract, 'mood'); - const phalaTimestamp = useTimestampNow('phala'); - const phalaDate = useTimestampDate('phala'); - const shibuyaContract = useContract( - SHIBUYA_CONTRACT_ADDRESS, - metadata, - 'shibuya-testnet', - ); - const shibuyaSymbol = useTokenSymbol('shibuya-testnet'); - const rocSymbol = useTokenSymbol('rococo-contracts-testnet'); - const shibuyaFlipTx = useTx(shibuyaContract, 'flip'); - useTxNotifications(shibuyaFlipTx); // Add a notification on tx status changes - const shibuyaGetSubcription = useCallSubscription( - shibuyaContract, - 'get', - ); - const { addNotification } = useNotifications(); - useEventSubscription(cRococoContract); - const { events } = useEvents(cRococoContract?.contract?.address); - const option = useCall(cRococoContract, 'option'); - - // Use helper functions to quickly pick values from a Result - // Instead of doing something like this: - // mood?.result?.ok ? mood.result.value.decoded : undefined - const goodMood = pickResultOk(mood.result); - const badMood = pickResultErr(mood.result); - - useEffect(() => { - // Customize messages - if (isPendingSignature(flipTx)) { - addNotification({ - type: flipTx.status, - message: 'Please sign the transaction in your wallet', - }); - } - - if (isBroadcast(flipTx)) { - addNotification({ - type: flipTx.status, - message: 'Flip transaction has been broadcast!', - }); - } - - if (isInBlock(flipTx)) { - addNotification({ - type: flipTx.status, - message: 'Transaction is in the block.', - }); - } - - if (isFinalized(flipTx)) { - addNotification({ - type: flipTx.status, - message: 'The transaction has been finalized.', - }); - } - - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [flipTx.status]); - - useEffect(() => { - account && - addNotification({ - type: 'WalletConnected', - message: `Connected to ${account.name || account.address}`, - }); - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [account]); - - const installedWallets = useInstalledWallets(); - const uninstalledWallets = useUninstalledWallets(); - - if (!cRococoContract?.contract) { - return ( -
-

Loading contract...

-
- ); - } - - return ( -
- -
-

- useink Kitchen Sink -

-

- See the contract definitions{' '} - - here - - . -

- -
- {!account && ( -
    - {installedWallets.length > 0 ? ( - <> -

    Connect a Wallet

    -

    Installed Wallets

    - {installedWallets.map((w) => ( -
  • - -
  • - ))} - - ) : ( -

    - You don't have any wallets installed... -

    - )} - - {uninstalledWallets.length > 0 && ( - <> -

    Uninstalled Wallets

    - - {uninstalledWallets.map((w) => ( -
  • - - {w.logo.alt} - Install {w.title} - -
  • - ))} - - )} -
- )} -
    - {account && ( - <> -
  • - -
  • - -
  • - You are connected as: - - {account?.name || account?.address} - -
  • - - {accounts?.map( - (acc) => - account !== acc && ( -
  • - Connect to {acc.name ? acc.name : 'wallet'} - -
  • - ), - )} - -
  • - Your Free Balance: - - {planckToDecimalFormatted(balance?.freeBalance, { - significantFigures: 4, - api: cRococoContract.contract.api, - })} - -
  • - - )} - -
  • - Contracts Rococo Current Block: - - {block?.blockNumber === undefined - ? '--' - : block.blockNumber.toLocaleString()} - -
  • - -
  • - Astar Current Block: - - {astarBlockNumber?.blockNumber === undefined - ? '--' - : astarBlockNumber.blockNumber.toLocaleString()} - -
  • - -
  • - Change a chain's active RPC url: (e.g. Astar) -
      - {rpcs.map((rpc) => ( -
    • - -
    • - ))} -
    -
  • - -
  • - - Get all blocks from configured chains using:{' '} - - useBlockHeaders() - - -
      - {(Object.keys(allChainBlockHeaders) as ChainId[]).map( - (chainId) => ( -
    • - - {chainId}:{' '} - {allChainBlockHeaders[ - chainId - ]?.blockNumber?.toLocaleString() || '--'}{' '} - -
    • - ), - )} -
    -
  • - -
  • - - Phala's current timestamp:{' '} - - {phalaTimestamp} - - - -

    - Phala's last block time: {phalaDate?.toLocaleTimeString()} -

    -
  • - -
  • - - -

    - Value: {pickDecoded(get.result)?.toString() || '--'} -

    -
  • - -
  • -

    - get() will update on new blocks:{' '} - {pickDecoded(getSubcription.result)?.toString() || '--'} -

    -
  • - -
  • - - -

    - Status: {flipTx.status} -

    - -

    - Events: -
      - {events.map((event) => ( -
    • - {event.name} - flipper: {event.args?.[0] as string} - , value: {event.args?.[1]?.toString()} -
    • - ))} -
    -

    - - -
  • - -
  • -

    - Call a contract on another chain. e.g. "Shibuya" -

    - -

    - Shibuya Flipped:{' '} - {pickDecoded(shibuyaGetSubcription.result)?.toString() || '--'} -

    - - - -

    - Status: {shibuyaFlipTx.status} -

    - - -
  • - -
  • - - -

    - Gas Required:{' '} - {planckToDecimalFormatted( - pickTxInfo(flipDryRun.result)?.partialFee, - { api: cRococoContract.contract.api }, - )} - - {pickDecodedError(flipDryRun, cRococoContract, {}, '--')} -

    -
  • - -
  • - - -

    - Partial Fee (a.k.a. Gas Required):{' '} - {planckToDecimalFormatted(flipPaymentInfo.result?.partialFee, { - api: cRococoContract.contract.api, - })} -

    -
  • - -
  • - - -

    - {pickDecodedError( - panic, - cRococoContract, - { - ContractTrapped: - 'This is a custom message. There was a panic in the contract!', - }, - 'this is a default error message', - )} -

    -
  • - -
  • - - -

    - {pickDecodedError( - assertBoom, - cRococoContract, - { - ContractTrapped: - 'This is a custom message. The assertion failed!', - }, - '--', - )} -

    -
  • - -
  • -

    - Handle Results. An even number will return an Ok Result, and an - odd number will return an Error -

    - - - - -

    - Mood: {!goodMood && !badMood && '--'} - {goodMood?.mood} - {badMood?.BadMood.mood} -

    -
  • - -
  • -

    - Handle Options. An even number will return a Some(Happy), and an - odd number will return None -

    - - - - -

    - Option: {!option.result && '--'} - {JSON.stringify(pickDecoded(option.result))} -

    -
  • - -
  • -

    - Rococo Contracts Token Symbol: {rocSymbol} -

    - -

    - Shibuya Token Symbol: {shibuyaSymbol} -

    -
  • - -
  • -

    Sign a message, and Verify it

    - setMessageToSign(e.target.value)} - /> - - - - - {signer.signature && account?.address && ( -
    -