feat: maintenance website

ethereum/app/src/js/components/App/pages/Deferred.tsx

@@ -4,6 +4,11 @@ import { useConnectedMetaMask } from 'metamask-react';
 import DeferredClient from '../../../web3/DeferredClient';
 import { ChainId } from '../../MetamaskConnect';
 import Container from '../../reusable/Container';
+import AdminSetRewardPool from './Deferred/AdminSetRewardPool';
+import AdminSetMinter from './Deferred/AdminSetMinter';
+import AdminSetMarketplace from './Deferred/AdminSetMarketplace';
+import CreateContract from './Deferred/CreateContract';
+import OwnerOf from './Deferred/OwnerOf';
 
 const Deferred = () => {
   const { account, ethereum, chainId } = useConnectedMetaMask();
@@ -20,12 +25,21 @@ const Deferred = () => {
   }, []);
 
   return (
-    <Container.FlexCols>
+    <Container.FlexCols className="gap-4">
       <Container.Container>
         <span className="block">Deferred Minter: {deferredMinter}</span>
         <span className="block">Marketplace: {marketplace}</span>
         <span className="block">Reward Pool: {rewardPool}</span>
       </Container.Container>
+      <Container.FlexCols className="gap-8 w-3/6">
+        <AdminSetRewardPool />
+        <AdminSetMinter />
+        <AdminSetMarketplace />
+        <hr />
+        <OwnerOf />
+        <hr />
+        <CreateContract />
+      </Container.FlexCols>
     </Container.FlexCols>
   );
 };

ethereum/app/src/js/components/App/pages/Deferred/AdminSetMarketplace.tsx

@@ -0,0 +1,57 @@
+import * as React from 'react';
+import { useConnectedMetaMask } from 'metamask-react';
+
+import DeferredClient from '../../../../web3/DeferredClient';
+import { ChainId } from '../../../MetamaskConnect';
+import Container from '../../../reusable/Container';
+import Input from '../../../reusable/Input';
+import Button from '../../../reusable/Button';
+
+const AdminSetMarketplace = () => {
+  const { account, ethereum, chainId } = useConnectedMetaMask();
+  const [pendingTx, setPendingTx] = React.useState<boolean>(false);
+  const [address, setAddress] = React.useState<string>('');
+
+  const onAddressChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+    setAddress(event.target.value);
+  };
+
+  const onSubmit = () => {
+    const client = new DeferredClient(account, ethereum, chainId as ChainId);
+
+    if (!address) {
+      alert('Address is required');
+      return;
+    }
+
+    setPendingTx(true);
+
+    client
+      .adminSetMarketplace(address)
+      .then(() => {
+        alert(`Set Marketplace address to ${address}`);
+        setAddress('');
+        setPendingTx(false);
+      })
+      .catch((error) => {
+        alert(`Error: ${error.message}`);
+        setPendingTx(false);
+      });
+  };
+
+  return (
+    <Container.FlexCols>
+      <Input.Input
+        id="admin-reward-marketplace-address"
+        value={address}
+        onChange={onAddressChange}
+        label="Marketplace Address"
+      />
+      <Button.Primary disabled={pendingTx} onClick={onSubmit}>
+        Set marketplace
+      </Button.Primary>
+    </Container.FlexCols>
+  );
+};
+
+export default AdminSetMarketplace;

ethereum/app/src/js/components/App/pages/Deferred/AdminSetMinter.tsx

@@ -0,0 +1,57 @@
+import * as React from 'react';
+import { useConnectedMetaMask } from 'metamask-react';
+
+import DeferredClient from '../../../../web3/DeferredClient';
+import { ChainId } from '../../../MetamaskConnect';
+import Container from '../../../reusable/Container';
+import Input from '../../../reusable/Input';
+import Button from '../../../reusable/Button';
+
+const AdminSetMinter = () => {
+  const { account, ethereum, chainId } = useConnectedMetaMask();
+  const [pendingTx, setPendingTx] = React.useState<boolean>(false);
+  const [address, setAddress] = React.useState<string>('');
+
+  const onAddressChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+    setAddress(event.target.value);
+  };
+
+  const onSubmit = () => {
+    const client = new DeferredClient(account, ethereum, chainId as ChainId);
+
+    if (!address) {
+      alert('Address is required');
+      return;
+    }
+
+    setPendingTx(true);
+
+    client
+      .adminSetDeferredMinter(address)
+      .then(() => {
+        alert(`Set Minter address to ${address}`);
+        setAddress('');
+        setPendingTx(false);
+      })
+      .catch((error) => {
+        alert(`Error: ${error.message}`);
+        setPendingTx(false);
+      });
+  };
+
+  return (
+    <Container.FlexCols>
+      <Input.Input
+        id="admin-reward-minter-address"
+        value={address}
+        onChange={onAddressChange}
+        label="Minter Address"
+      />
+      <Button.Primary disabled={pendingTx} onClick={onSubmit}>
+        Set minter pool
+      </Button.Primary>
+    </Container.FlexCols>
+  );
+};
+
+export default AdminSetMinter;

ethereum/app/src/js/components/App/pages/Deferred/AdminSetRewardPool.tsx

@@ -0,0 +1,57 @@
+import * as React from 'react';
+import { useConnectedMetaMask } from 'metamask-react';
+
+import DeferredClient from '../../../../web3/DeferredClient';
+import { ChainId } from '../../../MetamaskConnect';
+import Container from '../../../reusable/Container';
+import Input from '../../../reusable/Input';
+import Button from '../../../reusable/Button';
+
+const AdminSetRewardPool = () => {
+  const { account, ethereum, chainId } = useConnectedMetaMask();
+  const [pendingTx, setPendingTx] = React.useState<boolean>(false);
+  const [address, setAddress] = React.useState<string>('');
+
+  const onAddressChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+    setAddress(event.target.value);
+  };
+
+  const onSubmit = () => {
+    const client = new DeferredClient(account, ethereum, chainId as ChainId);
+
+    if (!address) {
+      alert('Address is required');
+      return;
+    }
+
+    setPendingTx(true);
+
+    client
+      .adminSetRewardPool(address)
+      .then(() => {
+        alert(`Set reward pool address to ${address}`);
+        setAddress('');
+        setPendingTx(false);
+      })
+      .catch((error) => {
+        alert(`Error: ${error.message}`);
+        setPendingTx(false);
+      });
+  };
+
+  return (
+    <Container.FlexCols>
+      <Input.Input
+        id="admin-reward-pool-address"
+        value={address}
+        onChange={onAddressChange}
+        label="Reward Pool Address"
+      />
+      <Button.Primary disabled={pendingTx} onClick={onSubmit}>
+        Set reward pool
+      </Button.Primary>
+    </Container.FlexCols>
+  );
+};
+
+export default AdminSetRewardPool;

ethereum/app/src/js/components/App/pages/Deferred/CreateContract.tsx

@@ -0,0 +1,181 @@
+import * as React from 'react';
+import { useConnectedMetaMask } from 'metamask-react';
+import DeferredClient from '../../../../web3/DeferredClient';
+import { ChainId } from '../../../MetamaskConnect';
+import { Contract } from 'web3';
+import Input from '../../../reusable/Input';
+import Button from '../../../reusable/Button';
+import Heading from '../../../reusable/Heading';
+
+const CreateContract = () => {
+  const { account, ethereum, chainId } = useConnectedMetaMask();
+  const [pendingTx, setPendingTx] = React.useState<boolean>(false);
+
+  const [contractId, setContractId] = React.useState<string>();
+  const [metadataUri, setMetadataUri] = React.useState<string>();
+  const [seller, setSeller] = React.useState<string>();
+  const [buyer, setBuyer] = React.useState<string>();
+  const [reward, setReward] = React.useState<string>();
+  const [priceUsd, setPriceUsd] = React.useState<string>();
+  const [tokensAmount, setTokensAmount] = React.useState<string>();
+
+  const onContractIdChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    setContractId(e.target.value);
+  };
+
+  const onMetadataUriChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    setMetadataUri(e.target.value);
+  };
+
+  const onSellerChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    setSeller(e.target.value);
+  };
+
+  const onBuyerChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    setBuyer(e.target.value);
+  };
+
+  const onRewardChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    setReward(e.target.value);
+  };
+
+  const onPriceUsdChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    setPriceUsd(e.target.value);
+  };
+
+  const onTokensAmountChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    setTokensAmount(e.target.value);
+  };
+
+  const onSubmit = () => {
+    const client = new DeferredClient(account, ethereum, chainId as ChainId);
+
+    if (!contractId) {
+      alert('contractId is required');
+      return;
+    }
+
+    if (!metadataUri) {
+      alert('metadataUri is required');
+      return;
+    }
+
+    if (!seller) {
+      alert('seller is required');
+      return;
+    }
+
+    if (!buyer) {
+      alert('buyer is required');
+      return;
+    }
+
+    if (!reward) {
+      alert('reward is required');
+      return;
+    }
+
+    if (!priceUsd) {
+      alert('priceUsd is required');
+      return;
+    }
+
+    if (!tokensAmount) {
+      alert('tokensAmount is required');
+      return;
+    }
+
+    const tokenIdNumber = BigInt(contractId);
+    const rewardNumber = BigInt(reward);
+    const priceUsdNumber = BigInt(priceUsd);
+    const tokensAmountNumber = BigInt(tokensAmount);
+
+    setPendingTx(true);
+
+    client
+      .createContract({
+        contractId: tokenIdNumber,
+        sellers: [{ seller, quota: 100 }],
+        buyers: [buyer],
+        metadataUri,
+        ekokeReward: rewardNumber,
+        tokenPriceUsd: priceUsdNumber,
+        tokensAmount: tokensAmountNumber,
+      })
+      .then(() => {
+        alert(`Contract created with ID ${tokenIdNumber}`);
+        setContractId('');
+        setMetadataUri('');
+        setSeller('');
+        setBuyer('');
+        setReward('');
+        setPriceUsd('');
+        setTokensAmount('');
+        setPendingTx(false);
+      })
+      .catch((error) => {
+        alert(`Error: ${error.message}`);
+        setPendingTx(false);
+      });
+  };
+
+  return (
+    <form className="flex flex-col gap-4" onSubmit={onSubmit}>
+      <Heading.H2>Create contract</Heading.H2>
+      <Input.Input
+        id="create-contract-id"
+        value={contractId}
+        onChange={onContractIdChange}
+        label="ContractId"
+        required
+      />
+      <Input.Input
+        id="create-contract-metadata-uri"
+        value={metadataUri}
+        onChange={onMetadataUriChange}
+        label="Metadata URI"
+        required
+      />
+      <Input.Input
+        id="create-contract-seller"
+        value={seller}
+        onChange={onSellerChange}
+        label="Seller"
+        required
+      />
+      <Input.Input
+        id="create-contract-buyer"
+        value={buyer}
+        onChange={onBuyerChange}
+        label="Buyer"
+        required
+      />
+      <Input.Input
+        id="create-contract-reward"
+        value={reward}
+        onChange={onRewardChange}
+        label="Reward"
+        required
+      />
+      <Input.Input
+        id="create-contract-price-usd"
+        value={priceUsd}
+        onChange={onPriceUsdChange}
+        label="Price USD"
+        required
+      />
+      <Input.Input
+        id="create-contract-tokens-amount"
+        value={tokensAmount}
+        onChange={onTokensAmountChange}
+        label="Tokens Amount"
+        required
+      />
+      <Button.Primary disabled={pendingTx} onClick={onSubmit}>
+        Create contract
+      </Button.Primary>
+    </form>
+  );
+};
+
+export default CreateContract;