Withdraw Options

packages/webapp/.env

@@ -15,6 +15,8 @@ NEXT_PUBLIC_TABLE_ROWS_MAX_FETCH_PER_SEC = "10"
 NEXT_PUBLIC_EDEN_CONTRACT_ACCOUNT = "test.edev"
 NEXT_PUBLIC_AA_FETCH_AFTER="1633883520000"
 NEXT_PUBLIC_TOKEN_CONTRACT = "eosio.token"
+NEXT_PUBLIC_TOKEN_SYMBOL = "WAX"
+NEXT_PUBLIC_TOKEN_PRECISION = "8"
 
 # ATOMICHUB
 NEXT_PUBLIC_AA_BASE_URL = "https://test.wax.api.atomicassets.io/atomicassets/v1"
@@ -27,6 +29,7 @@ NEXT_PUBLIC_AA_SCHEMA_NAME = "members"
 
 # OTHER
 NEXT_PUBLIC_BLOCKEXPLORER_ACCOUNT_BASE_URL = "https://wax-test.bloks.io/account"
+NEXT_PUBLIC_BLOCKEXPLORER_TRANSACTION_BASE_URL = "https://wax-test.bloks.io/transaction"
 NEXT_PUBLIC_APP_MINIMUM_DONATION_AMOUNT = "10.00000000 WAX"
 NEXT_PUBLIC_ENABLED_WALLETS = "ANCHOR,LEDGER,SOFTKEY"
 NEXT_PUBLIC_IPFS_BASE_URL = "https://infura-ipfs.io/ipfs"

packages/webapp/src/_app/hooks/queries.ts

@@ -19,7 +19,6 @@ import {
 } from "inductions/api";
 import {
     getChiefDelegates,
-    getDistributionsForAccount,
     getDistributionState,
     getMasterPool,
     getHeadDelegate,
@@ -200,11 +199,6 @@ export const queryMasterPool = () => ({
     queryFn: getMasterPool,
 });
 
-export const queryDistributionsForAccount = (account: string) => ({
-    queryKey: ["query_distributions_for_account", account],
-    queryFn: () => getDistributionsForAccount(account),
-});
-
 export const queryTokenBalanceForAccount = (account: string) => ({
     queryKey: ["query_token_balance_for_account", account],
     queryFn: () => getTokenBalanceForAccount(account),
@@ -248,12 +242,6 @@ export const useMemberByAccountName = (accountName?: string) =>
         enabled: Boolean(accountName),
     });
 
-export const useDistributionsForAccount = (account: string) =>
-    useQuery({
-        ...queryDistributionsForAccount(account),
-        enabled: Boolean(account),
-    });
-
 export const useDistributionState = () =>
     useQuery({
         ...queryDistributionState(),

packages/webapp/src/_app/styles/inputs.css

@@ -0,0 +1,11 @@
+/* Chrome, Safari, Edge, Opera */
+input::-webkit-outer-spin-button,
+input::-webkit-inner-spin-button {
+    -webkit-appearance: none;
+    margin: 0;
+}
+
+/* Firefox */
+input[type="number"] {
+    -moz-appearance: textfield;
+}

packages/webapp/src/_app/ui/form.tsx

@@ -3,15 +3,15 @@ import React, { HTMLProps } from "react";
 export const Label: React.FC<{
     htmlFor: string;
 }> = (props) => (
-    <label className="block text-sm font-medium text-gray-700" {...props}>
+    <label className="block text-sm font-normal text-gray-600" {...props}>
         {props.children}
     </label>
 );
 
 export const Input: React.FC<HTMLProps<HTMLInputElement>> = (props) => (
     <input
         name={props.id}
-        className={`w-full bg-white rounded border border-gray-300 focus:border-yellow-500 focus:ring-2 focus:ring-yellow-200 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out ${
+        className={`w-full bg-white border border-gray-300 focus:border-yellow-500 focus:ring-2 focus:ring-yellow-200 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out ${
             props.disabled ? "bg-gray-50" : ""
         }`}
         {...props}
@@ -47,7 +47,7 @@ export const TextArea: React.FC<HTMLProps<HTMLTextAreaElement>> = (props) => (
     <textarea
         rows={3}
         name={props.id}
-        className={`w-full bg-white rounded border border-gray-300 focus:border-yellow-500 focus:ring-2 focus:ring-yellow-200 h-32 text-base outline-none text-gray-700 py-1 px-3 resize-none leading-6 transition-colors duration-200 ease-in-out ${
+        className={`w-full bg-white border border-gray-300 focus:border-yellow-500 focus:ring-2 focus:ring-yellow-200 h-32 text-base outline-none text-gray-700 py-1 px-3 resize-none leading-6 transition-colors duration-200 ease-in-out ${
             props.disabled ? "bg-gray-50" : ""
         }`}
         {...props}

packages/webapp/src/_app/utils/asset.ts

@@ -1,9 +1,17 @@
+import { tokenConfig } from "config";
+
 export interface Asset {
     quantity: number; // integer without decimals
     symbol: string;
     precision: number;
 }
 
+export const getDefaultTokenAsset = () => ({
+    quantity: 0,
+    symbol: tokenConfig.symbol,
+    precision: tokenConfig.precision,
+});
+
 export const assetFromString = (asset: string): Asset => {
     const re = /^[0-9]+\.[0-9]+ [A-Z,a-z]{1,5}$/;
     if (asset.match(re) === null) {
@@ -20,6 +28,17 @@ export const assetFromString = (asset: string): Asset => {
     };
 };
 
+/**
+ * Convert a number to an Asset with the community-configured token symbol and precision
+ * @param {number} value - a number that can contain a decimal
+ * @returns {Asset} the Asset with the community's default token symbol and precision
+ */
+export const assetFromNumber = (value: number): Asset => ({
+    symbol: tokenConfig.symbol,
+    precision: tokenConfig.precision,
+    quantity: value * Math.pow(10, tokenConfig.precision),
+});
+
 export const assetToString = (price: Asset, decimals = 2) =>
     `${(price.quantity / Math.pow(10, price.precision)).toFixed(decimals)} ${
         price.symbol

packages/webapp/src/config.ts

@@ -9,6 +9,7 @@ if (
     !process.env.NEXT_PUBLIC_EOS_READ_RPC_URLS ||
     !process.env.NEXT_PUBLIC_EOS_CHAIN_ID ||
     !process.env.NEXT_PUBLIC_BLOCKEXPLORER_ACCOUNT_BASE_URL ||
+    !process.env.NEXT_PUBLIC_BLOCKEXPLORER_TRANSACTION_BASE_URL ||
     !process.env.NEXT_PUBLIC_AA_BASE_URL ||
     !process.env.NEXT_PUBLIC_AA_MARKET_URL ||
     !process.env.NEXT_PUBLIC_AA_HUB_URL ||
@@ -28,6 +29,8 @@ if (
     !process.env.NEXT_PUBLIC_ELECTION_COMMUNITY_ROOM_URL ||
     !process.env.NEXT_PUBLIC_ELECTION_MEETING_DURATION_MS ||
     !process.env.NEXT_PUBLIC_TOKEN_CONTRACT ||
+    !process.env.NEXT_PUBLIC_TOKEN_SYMBOL ||
+    !process.env.NEXT_PUBLIC_TOKEN_PRECISION ||
     !process.env.NEXT_PUBLIC_SUBCHAIN_WASM_URL ||
     !process.env.NEXT_PUBLIC_SUBCHAIN_STATE_URL ||
     !process.env.NEXT_PUBLIC_SUBCHAIN_WS_URL ||
@@ -48,6 +51,9 @@ EOS_CHAIN_ID="${process.env.NEXT_PUBLIC_EOS_CHAIN_ID}"
 BLOCKEXPLORER_ACCOUNT_BASE_URL="${
     process.env.NEXT_PUBLIC_BLOCKEXPLORER_ACCOUNT_BASE_URL
 }"
+BLOCKEXPLORER_TRANSACTION_BASE_URL="${
+    process.env.NEXT_PUBLIC_BLOCKEXPLORER_TRANSACTION_BASE_URL
+}"
 AA_BASE_URL="${process.env.NEXT_PUBLIC_AA_BASE_URL}"
 AA_MARKET_URL="${process.env.NEXT_PUBLIC_AA_MARKET_URL}"
 AA_HUB_URL="${process.env.NEXT_PUBLIC_AA_HUB_URL}"
@@ -74,6 +80,8 @@ ELECTION_COMMUNITY_ROOM_URL="${
     process.env.NEXT_PUBLIC_ELECTION_COMMUNITY_ROOM_URL
 }"
 TOKEN_CONTRACT="${process.env.NEXT_PUBLIC_TOKEN_CONTRACT}"
+TOKEN_SYMBOL="${process.env.NEXT_PUBLIC_TOKEN_SYMBOL}"
+TOKEN_PRECISION="${process.env.NEXT_PUBLIC_TOKEN_PRECISION}"
 SUBCHAIN_WASM_URL="${process.env.NEXT_PUBLIC_SUBCHAIN_WASM_URL}"
 SUBCHAIN_STATE_URL="${process.env.NEXT_PUBLIC_SUBCHAIN_STATE_URL}"
 SUBCHAIN_WS_URL="${process.env.NEXT_PUBLIC_SUBCHAIN_WS_URL}"
@@ -102,6 +110,8 @@ export const box = {
 
 export const blockExplorerAccountBaseUrl =
     process.env.NEXT_PUBLIC_BLOCKEXPLORER_ACCOUNT_BASE_URL;
+export const blockExplorerTransactionBaseUrl =
+    process.env.NEXT_PUBLIC_BLOCKEXPLORER_TRANSACTION_BASE_URL;
 
 export const shortAppName = process.env.NEXT_PUBLIC_APP_SHORT_NAME;
 export const appName = process.env.NEXT_PUBLIC_APP_NAME;
@@ -137,6 +147,12 @@ export const chainConfig = {
     rpcEndpoints: [rpcEndpoint],
 };
 
+export const tokenConfig = {
+    contract: process.env.NEXT_PUBLIC_TOKEN_CONTRACT,
+    symbol: process.env.NEXT_PUBLIC_TOKEN_SYMBOL,
+    precision: Number(process.env.NEXT_PUBLIC_TOKEN_PRECISION),
+};
+
 export const availableWallets = (
     process.env.NEXT_PUBLIC_ENABLED_WALLETS || ""
 ).split(",");

packages/webapp/src/delegates/api/eden-contract.ts

@@ -2,33 +2,23 @@ import { devUseFixtureData } from "config";
 import { EdenMember } from "members";
 import { queryClient } from "pages/_app";
 import {
-    CONTRACT_DISTRIBUTION_ACCOUNTS_TABLE,
     CONTRACT_DISTRIBUTION_TABLE,
     CONTRACT_POOLS_TABLE,
     getRow,
     getTableRawRows,
-    getTableRows,
-    i128BoundsForAccount,
-    INDEX_BY_OWNER,
     isValidDelegate,
     queryElectionState,
     queryMemberByAccountName,
     queryVoteDataRow,
-    TABLE_INDEXES,
 } from "_app";
 
 import {
-    DistributionAccount,
     DistributionState,
     DistributionStateData,
     Distribution,
     Pool,
 } from "../interfaces";
-import {
-    fixtureDistributionAccounts,
-    fixtureNextDistribution,
-    fixturePool,
-} from "./fixtures";
+import { fixtureNextDistribution, fixturePool } from "./fixtures";
 
 const queryElectionStateHelper = async () =>
     await queryClient.fetchQuery(
@@ -46,10 +36,6 @@ export const getChiefDelegates = async (): Promise<string[] | undefined> => {
     return electionState?.board;
 };
 
-const getMemberBudgetBalance = () => {
-    return {}; // TODO
-};
-
 const getMemberWrapper = async (account: string) => {
     const { queryKey, queryFn } = queryMemberByAccountName(account);
     return await queryClient.fetchQuery(queryKey, queryFn);
@@ -95,30 +81,6 @@ export const getMyDelegation = async (
     return myDelegates;
 };
 
-export const getDistributionsForAccount = async (
-    account: string
-): Promise<DistributionAccount[]> => {
-    if (devUseFixtureData) {
-        return fixtureDistributionAccounts;
-    }
-
-    const { lower, upper } = i128BoundsForAccount(account);
-
-    const distributionRows = await getTableRows(
-        CONTRACT_DISTRIBUTION_ACCOUNTS_TABLE,
-        {
-            ...TABLE_INDEXES[CONTRACT_DISTRIBUTION_ACCOUNTS_TABLE][
-                INDEX_BY_OWNER
-            ],
-            lowerBound: lower,
-            upperBound: upper,
-            limit: 9999,
-        }
-    );
-
-    return distributionRows as DistributionAccount[];
-};
-
 export const getDistributionState = async (): Promise<
     DistributionStateData | undefined
 > => {

packages/webapp/src/delegates/api/fixtures.ts

@@ -1,30 +1,4 @@
-import {
-    DistributionAccount,
-    DistributionStateData,
-    NextDistribution,
-    Pool,
-} from "../interfaces";
-
-export const fixtureDistributionAccounts: DistributionAccount[] = [
-    {
-        owner: "pip.edev",
-        balance: "10.0000 EOS",
-        rank: 1,
-        distribution_time: "2022-01-16T16:00:00.000",
-    },
-    {
-        owner: "pip.edev",
-        balance: "100.0000 EOS",
-        rank: 2,
-        distribution_time: "2022-01-16T16:00:00.000",
-    },
-    {
-        owner: "pip.edev",
-        balance: "1000.0000 EOS",
-        rank: 3,
-        distribution_time: "2022-01-16T16:00:00.000",
-    },
-];
+import { DistributionStateData, NextDistribution, Pool } from "../interfaces";
 
 export const fixtureNextDistribution: DistributionStateData = {
     state: "next_distribution",