aboutsummaryrefslogtreecommitdiffstats
path: root/packages
diff options
context:
space:
mode:
Diffstat (limited to 'packages')
-rw-r--r--packages/asset-buyer/CHANGELOG.json9
-rw-r--r--packages/asset-buyer/package.json2
-rw-r--r--packages/contract-addresses/CHANGELOG.json8
-rw-r--r--packages/contract-addresses/src/index.ts11
-rw-r--r--packages/contract-wrappers/CHANGELOG.json10
-rw-r--r--packages/contract-wrappers/src/contract_wrappers/erc20_token_wrapper.ts3
-rw-r--r--packages/contract-wrappers/src/contract_wrappers/erc721_token_wrapper.ts3
-rw-r--r--packages/contract-wrappers/src/contract_wrappers/ether_token_wrapper.ts2
-rw-r--r--packages/contract-wrappers/src/contract_wrappers/exchange_wrapper.ts34
-rw-r--r--packages/contract-wrappers/src/contract_wrappers/forwarder_wrapper.ts4
-rw-r--r--packages/contract-wrappers/src/schemas/tx_opts_schema.ts1
-rw-r--r--packages/contract-wrappers/src/types.ts2
-rw-r--r--packages/instant/.dogfood.discharge.json2
-rw-r--r--packages/instant/.gitignore5
-rw-r--r--packages/instant/.npmignore5
-rw-r--r--packages/instant/.staging.discharge.json2
-rw-r--r--packages/instant/package.json11
-rw-r--r--packages/instant/public/index.html2
-rw-r--r--packages/instant/src/assets/icons/ae.svg4
-rw-r--r--packages/instant/src/assets/icons/agi.svg5
-rw-r--r--packages/instant/src/assets/icons/ant.svg5
-rw-r--r--packages/instant/src/assets/icons/ast.svg4
-rw-r--r--packages/instant/src/assets/icons/bat.svg3
-rw-r--r--packages/instant/src/assets/icons/cvc.svg4
-rw-r--r--packages/instant/src/assets/icons/dai.svg5
-rw-r--r--packages/instant/src/assets/icons/dgd.svg5
-rw-r--r--packages/instant/src/assets/icons/dgx.svg4
-rw-r--r--packages/instant/src/assets/icons/dnt.svg4
-rw-r--r--packages/instant/src/assets/icons/fun.svg4
-rw-r--r--packages/instant/src/assets/icons/gno.svg6
-rw-r--r--packages/instant/src/assets/icons/gnt.svg3
-rw-r--r--packages/instant/src/assets/icons/knc.svg6
-rw-r--r--packages/instant/src/assets/icons/link.svg6
-rw-r--r--packages/instant/src/assets/icons/lpt.svg8
-rw-r--r--packages/instant/src/assets/icons/mana.svg8
-rw-r--r--packages/instant/src/assets/icons/mkr.svg4
-rw-r--r--packages/instant/src/assets/icons/mln.svg4
-rw-r--r--packages/instant/src/assets/icons/omg.svg3
-rw-r--r--packages/instant/src/assets/icons/powr.svg6
-rw-r--r--packages/instant/src/assets/icons/ren.svg12
-rw-r--r--packages/instant/src/assets/icons/rep.svg7
-rw-r--r--packages/instant/src/assets/icons/req.svg3
-rw-r--r--packages/instant/src/assets/icons/salt.svg3
-rw-r--r--packages/instant/src/assets/icons/snt.svg4
-rw-r--r--packages/instant/src/assets/icons/spank.svg6
-rw-r--r--packages/instant/src/assets/icons/wax.svg4
-rw-r--r--packages/instant/src/assets/icons/zil.svg3
-rw-r--r--packages/instant/src/assets/icons/zrx.svg3
-rw-r--r--packages/instant/src/assets/powered_by_0x.svg17
-rw-r--r--packages/instant/src/components/erc20_asset_amount_input.tsx12
-rw-r--r--packages/instant/src/components/erc20_token_selector.tsx31
-rw-r--r--packages/instant/src/components/zero_ex_instant_container.tsx13
-rw-r--r--packages/instant/src/components/zero_ex_instant_provider.tsx14
-rw-r--r--packages/instant/src/constants.ts3
-rw-r--r--packages/instant/src/containers/selected_erc20_asset_amount_input.ts18
-rw-r--r--packages/instant/src/data/asset_meta_data_map.ts4
-rw-r--r--packages/instant/src/globals.d.ts6
-rw-r--r--packages/instant/src/index.umd.ts3
-rw-r--r--packages/instant/src/redux/analytics_middleware.ts59
-rw-r--r--packages/instant/src/redux/store.ts7
-rw-r--r--packages/instant/src/types.ts2
-rw-r--r--packages/instant/src/util/analytics.ts64
-rw-r--r--packages/instant/src/util/heap.ts113
-rw-r--r--packages/instant/src/util/provider_state_factory.ts2
-rw-r--r--packages/instant/webpack.config.js108
-rw-r--r--packages/monorepo-scripts/src/prepublish_checks.ts11
-rw-r--r--packages/web3-wrapper/CHANGELOG.json13
-rw-r--r--packages/web3-wrapper/package.json1
-rw-r--r--packages/web3-wrapper/src/index.ts3
-rw-r--r--packages/web3-wrapper/src/marshaller.ts18
-rw-r--r--packages/web3-wrapper/src/types.ts27
-rw-r--r--packages/web3-wrapper/src/web3_wrapper.ts26
-rw-r--r--packages/web3-wrapper/test/web3_wrapper_test.ts14
-rw-r--r--packages/website/public/css/basscss_responsive_custom.css9
-rw-r--r--packages/website/public/images/launch_kit/0x_cupboard.svg53
-rw-r--r--packages/website/public/images/launch_kit/enable_trading.svg9
-rw-r--r--packages/website/public/images/launch_kit/fork.svg4
-rw-r--r--packages/website/public/images/launch_kit/in_game_marketplace.svg15
-rw-r--r--packages/website/public/images/launch_kit/local_market.svg12
-rw-r--r--packages/website/public/images/launch_kit/secondary_market.svg6
-rw-r--r--packages/website/public/images/launch_kit/shared_liquidity.svg20
-rw-r--r--packages/website/translations/chinese.json13
-rw-r--r--packages/website/translations/english.json13
-rw-r--r--packages/website/translations/korean.json13
-rw-r--r--packages/website/translations/russian.json13
-rw-r--r--packages/website/translations/spanish.json13
-rw-r--r--packages/website/ts/components/footer.tsx6
-rw-r--r--packages/website/ts/components/ui/container.tsx2
-rw-r--r--packages/website/ts/containers/launch_kit.ts27
-rw-r--r--packages/website/ts/index.tsx2
-rw-r--r--packages/website/ts/pages/documentation/docs_home.tsx26
-rw-r--r--packages/website/ts/pages/landing/landing.tsx4
-rw-r--r--packages/website/ts/pages/launch_kit/launch_kit.tsx335
-rw-r--r--packages/website/ts/types.ts14
-rw-r--r--packages/website/ts/utils/constants.ts3
95 files changed, 1382 insertions, 81 deletions
diff --git a/packages/asset-buyer/CHANGELOG.json b/packages/asset-buyer/CHANGELOG.json
index 0e4623d05..394f29ff6 100644
--- a/packages/asset-buyer/CHANGELOG.json
+++ b/packages/asset-buyer/CHANGELOG.json
@@ -1,5 +1,14 @@
[
{
+ "version": "3.0.1",
+ "changes": [
+ {
+ "note": "Dependencies updated",
+ "pr": 1276
+ }
+ ]
+ },
+ {
"version": "3.0.0",
"changes": [
{
diff --git a/packages/asset-buyer/package.json b/packages/asset-buyer/package.json
index fad33476b..f6a331844 100644
--- a/packages/asset-buyer/package.json
+++ b/packages/asset-buyer/package.json
@@ -47,7 +47,7 @@
"@0x/utils": "^2.0.5",
"@0x/web3-wrapper": "^3.1.4",
"ethereum-types": "^1.1.2",
- "lodash": "^4.17.10"
+ "lodash": "^4.17.5"
},
"devDependencies": {
"@0x/tslint-config": "^1.0.10",
diff --git a/packages/contract-addresses/CHANGELOG.json b/packages/contract-addresses/CHANGELOG.json
index 307d73545..86c6a5c31 100644
--- a/packages/contract-addresses/CHANGELOG.json
+++ b/packages/contract-addresses/CHANGELOG.json
@@ -1,5 +1,13 @@
[
{
+ "version": "1.2.0",
+ "changes": [
+ {
+ "note": "Rinkeby Deployment"
+ }
+ ]
+ },
+ {
"version": "1.1.0",
"changes": [
{
diff --git a/packages/contract-addresses/src/index.ts b/packages/contract-addresses/src/index.ts
index f5fd8d0be..57358dd38 100644
--- a/packages/contract-addresses/src/index.ts
+++ b/packages/contract-addresses/src/index.ts
@@ -14,6 +14,7 @@ export interface ContractAddresses {
export enum NetworkId {
Mainnet = 1,
Ropsten = 3,
+ Rinkeby = 4,
Kovan = 42,
}
@@ -38,6 +39,16 @@ const networkToAddresses: { [networkId: number]: ContractAddresses } = {
forwarder: '0x2240dab907db71e64d3e0dba4800c83b5c502d4e',
orderValidator: '0x90431a90516ab49af23a0530e04e8c7836e7122f',
},
+ 4: {
+ erc20Proxy: '0x3e809c563c15a295e832e37053798ddc8d6c8dab',
+ erc721Proxy: '0x8e1ff02637cb5e39f2fa36c14706aa348b065b09',
+ zrxToken: '0x2727e688b8fd40b198cd5fe6e408e00494a06f07',
+ etherToken: '0xc778417e063141139fce010982780140aa0cd5ab',
+ exchange: '0x22ebc052f43a88efa06379426120718170f2204e',
+ assetProxyOwner: '0x1da52d1d3a3acfa0a1836b737393b4e9931268fc',
+ forwarder: '0xd2dbf3250a764eaaa94fa0c84ed87c0edc8ed04e',
+ orderValidator: '0x39c3fc9f4d8430af2713306ce80c584752d9e1c7',
+ },
42: {
erc20Proxy: '0xf1ec01d6236d3cd881a0bf0130ea25fe4234003e',
erc721Proxy: '0x2a9127c745688a165106c11cd4d647d2220af821',
diff --git a/packages/contract-wrappers/CHANGELOG.json b/packages/contract-wrappers/CHANGELOG.json
index fbf3972a9..1ea966fc6 100644
--- a/packages/contract-wrappers/CHANGELOG.json
+++ b/packages/contract-wrappers/CHANGELOG.json
@@ -1,5 +1,15 @@
[
{
+ "version": "4.1.0",
+ "changes": [
+ {
+ "note":
+ "Add a `nonce` field for `TxOpts` so that it's now possible to re-broadcast stuck transactions with a higher gas amount",
+ "pr": 1292
+ }
+ ]
+ },
+ {
"timestamp": 1542208198,
"version": "4.0.2",
"changes": [
diff --git a/packages/contract-wrappers/src/contract_wrappers/erc20_token_wrapper.ts b/packages/contract-wrappers/src/contract_wrappers/erc20_token_wrapper.ts
index 5e0ec1951..ad42cfd4f 100644
--- a/packages/contract-wrappers/src/contract_wrappers/erc20_token_wrapper.ts
+++ b/packages/contract-wrappers/src/contract_wrappers/erc20_token_wrapper.ts
@@ -111,6 +111,7 @@ export class ERC20TokenWrapper extends ContractWrapper {
from: normalizedOwnerAddress,
gas: txOpts.gasLimit,
gasPrice: txOpts.gasPrice,
+ nonce: txOpts.nonce,
}),
);
return txHash;
@@ -281,6 +282,7 @@ export class ERC20TokenWrapper extends ContractWrapper {
from: normalizedFromAddress,
gas: txOpts.gasLimit,
gasPrice: txOpts.gasPrice,
+ nonce: txOpts.nonce,
}),
);
return txHash;
@@ -342,6 +344,7 @@ export class ERC20TokenWrapper extends ContractWrapper {
from: normalizedSenderAddress,
gas: txOpts.gasLimit,
gasPrice: txOpts.gasPrice,
+ nonce: txOpts.nonce,
}),
);
return txHash;
diff --git a/packages/contract-wrappers/src/contract_wrappers/erc721_token_wrapper.ts b/packages/contract-wrappers/src/contract_wrappers/erc721_token_wrapper.ts
index 1610af47b..3bc7dc8e7 100644
--- a/packages/contract-wrappers/src/contract_wrappers/erc721_token_wrapper.ts
+++ b/packages/contract-wrappers/src/contract_wrappers/erc721_token_wrapper.ts
@@ -238,6 +238,7 @@ export class ERC721TokenWrapper extends ContractWrapper {
gas: txOpts.gasLimit,
gasPrice: txOpts.gasPrice,
from: normalizedOwnerAddress,
+ nonce: txOpts.nonce,
}),
);
return txHash;
@@ -298,6 +299,7 @@ export class ERC721TokenWrapper extends ContractWrapper {
gas: txOpts.gasLimit,
gasPrice: txOpts.gasPrice,
from: tokenOwnerAddress,
+ nonce: txOpts.nonce,
}),
);
return txHash;
@@ -369,6 +371,7 @@ export class ERC721TokenWrapper extends ContractWrapper {
gas: txOpts.gasLimit,
gasPrice: txOpts.gasPrice,
from: normalizedSenderAddress,
+ nonce: txOpts.nonce,
}),
);
return txHash;
diff --git a/packages/contract-wrappers/src/contract_wrappers/ether_token_wrapper.ts b/packages/contract-wrappers/src/contract_wrappers/ether_token_wrapper.ts
index 913c47cf7..6093f0f95 100644
--- a/packages/contract-wrappers/src/contract_wrappers/ether_token_wrapper.ts
+++ b/packages/contract-wrappers/src/contract_wrappers/ether_token_wrapper.ts
@@ -71,6 +71,7 @@ export class EtherTokenWrapper extends ContractWrapper {
value: amountInWei,
gas: txOpts.gasLimit,
gasPrice: txOpts.gasPrice,
+ nonce: txOpts.nonce,
}),
);
return txHash;
@@ -112,6 +113,7 @@ export class EtherTokenWrapper extends ContractWrapper {
from: normalizedWithdrawerAddress,
gas: txOpts.gasLimit,
gasPrice: txOpts.gasPrice,
+ nonce: txOpts.nonce,
}),
);
return txHash;
diff --git a/packages/contract-wrappers/src/contract_wrappers/exchange_wrapper.ts b/packages/contract-wrappers/src/contract_wrappers/exchange_wrapper.ts
index c76e51eee..c9556971a 100644
--- a/packages/contract-wrappers/src/contract_wrappers/exchange_wrapper.ts
+++ b/packages/contract-wrappers/src/contract_wrappers/exchange_wrapper.ts
@@ -196,6 +196,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
});
}
@@ -207,6 +208,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
},
);
return txHash;
@@ -243,6 +245,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
},
);
}
@@ -254,6 +257,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
},
);
return txHash;
@@ -287,6 +291,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
});
}
const txHash = await exchangeInstance.fillOrKillOrder.sendTransactionAsync(
@@ -297,6 +302,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
},
);
return txHash;
@@ -336,6 +342,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedSenderAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
});
}
const txHash = await exchangeInstance.executeTransaction.sendTransactionAsync(
@@ -347,6 +354,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedSenderAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
},
);
return txHash;
@@ -382,6 +390,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
});
}
const txHash = await exchangeInstance.batchFillOrders.sendTransactionAsync(
@@ -392,6 +401,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
},
);
return txHash;
@@ -425,6 +435,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
});
}
const txHash = await exchangeInstance.marketBuyOrders.sendTransactionAsync(
@@ -435,6 +446,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
},
);
return txHash;
@@ -468,6 +480,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
});
}
const txHash = await exchangeInstance.marketSellOrders.sendTransactionAsync(
@@ -478,6 +491,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
},
);
return txHash;
@@ -511,6 +525,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
});
}
const txHash = await exchangeInstance.marketBuyOrdersNoThrow.sendTransactionAsync(
@@ -521,6 +536,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
},
);
return txHash;
@@ -554,6 +570,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
});
}
const txHash = await exchangeInstance.marketSellOrdersNoThrow.sendTransactionAsync(
@@ -564,6 +581,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
},
);
return txHash;
@@ -599,6 +617,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
});
}
const txHash = await exchangeInstance.batchFillOrdersNoThrow.sendTransactionAsync(
@@ -609,6 +628,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
},
);
return txHash;
@@ -644,6 +664,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
});
}
const txHash = await exchangeInstance.batchFillOrKillOrders.sendTransactionAsync(
@@ -654,6 +675,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
},
);
return txHash;
@@ -682,12 +704,14 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedMakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
});
}
const txHash = await exchangeInstance.batchCancelOrders.sendTransactionAsync(orders, {
from: normalizedMakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
});
return txHash;
}
@@ -735,6 +759,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
},
);
}
@@ -747,6 +772,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
},
);
return txHash;
@@ -781,12 +807,14 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
});
}
const txHash = await exchangeInstance.preSign.sendTransactionAsync(hash, signerAddress, signature, {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
});
return txHash;
}
@@ -956,12 +984,14 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedMakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
});
}
const txHash = await exchangeInstance.cancelOrder.sendTransactionAsync(order, {
from: normalizedMakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
});
return txHash;
}
@@ -992,6 +1022,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedSenderAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
});
}
const txHash = await exchangeInstance.setSignatureValidatorApproval.sendTransactionAsync(
@@ -1001,6 +1032,7 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedSenderAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
},
);
return txHash;
@@ -1030,12 +1062,14 @@ export class ExchangeWrapper extends ContractWrapper {
from: normalizedSenderAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
});
}
const txHash = await exchangeInstance.cancelOrdersUpTo.sendTransactionAsync(targetOrderEpoch, {
from: normalizedSenderAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
});
return txHash;
}
diff --git a/packages/contract-wrappers/src/contract_wrappers/forwarder_wrapper.ts b/packages/contract-wrappers/src/contract_wrappers/forwarder_wrapper.ts
index 80742e030..5497f92b5 100644
--- a/packages/contract-wrappers/src/contract_wrappers/forwarder_wrapper.ts
+++ b/packages/contract-wrappers/src/contract_wrappers/forwarder_wrapper.ts
@@ -124,6 +124,7 @@ export class ForwarderWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
},
);
}
@@ -140,6 +141,7 @@ export class ForwarderWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
},
);
return txHash;
@@ -213,6 +215,7 @@ export class ForwarderWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
},
);
}
@@ -230,6 +233,7 @@ export class ForwarderWrapper extends ContractWrapper {
from: normalizedTakerAddress,
gas: orderTransactionOpts.gasLimit,
gasPrice: orderTransactionOpts.gasPrice,
+ nonce: orderTransactionOpts.nonce,
},
);
return txHash;
diff --git a/packages/contract-wrappers/src/schemas/tx_opts_schema.ts b/packages/contract-wrappers/src/schemas/tx_opts_schema.ts
index 83c819be2..1c1588db7 100644
--- a/packages/contract-wrappers/src/schemas/tx_opts_schema.ts
+++ b/packages/contract-wrappers/src/schemas/tx_opts_schema.ts
@@ -3,6 +3,7 @@ export const txOptsSchema = {
properties: {
gasPrice: { $ref: '/numberSchema' },
gasLimit: { type: 'number' },
+ nonce: { type: 'number' },
},
type: 'object',
};
diff --git a/packages/contract-wrappers/src/types.ts b/packages/contract-wrappers/src/types.ts
index 5a5bdd530..14d4649ae 100644
--- a/packages/contract-wrappers/src/types.ts
+++ b/packages/contract-wrappers/src/types.ts
@@ -142,10 +142,12 @@ export interface MethodOpts {
/**
* gasPrice: Gas price in Wei to use for a transaction
* gasLimit: The amount of gas to send with a transaction (in Gwei)
+ * nonce: The nonce to use for a transaction. If not specified, it defaults to the next incremented nonce.
*/
export interface TransactionOpts {
gasPrice?: BigNumber;
gasLimit?: number;
+ nonce?: number;
}
/**
diff --git a/packages/instant/.dogfood.discharge.json b/packages/instant/.dogfood.discharge.json
index 9ade97d01..ca36b3861 100644
--- a/packages/instant/.dogfood.discharge.json
+++ b/packages/instant/.dogfood.discharge.json
@@ -1,6 +1,6 @@
{
"domain": "0x-instant-dogfood",
- "build_command": "yarn build:umd:prod",
+ "build_command": "WEBPACK_OUTPUT_PATH=public yarn build:umd:prod",
"upload_directory": "public",
"index_key": "index.html",
"error_key": "index.html",
diff --git a/packages/instant/.gitignore b/packages/instant/.gitignore
index e1ce60fa2..a99cea187 100644
--- a/packages/instant/.gitignore
+++ b/packages/instant/.gitignore
@@ -1,2 +1,3 @@
-public/main.bundle.js
-public/main.bundle.js.map \ No newline at end of file
+public/instant.js
+public/instant.js.map
+umd/* \ No newline at end of file
diff --git a/packages/instant/.npmignore b/packages/instant/.npmignore
new file mode 100644
index 000000000..579d65af0
--- /dev/null
+++ b/packages/instant/.npmignore
@@ -0,0 +1,5 @@
+.*
+*
+*/
+!lib/src/**/*
+!umd/**/* \ No newline at end of file
diff --git a/packages/instant/.staging.discharge.json b/packages/instant/.staging.discharge.json
index 1026b9986..c917a650b 100644
--- a/packages/instant/.staging.discharge.json
+++ b/packages/instant/.staging.discharge.json
@@ -1,6 +1,6 @@
{
"domain": "0x-instant-staging",
- "build_command": "yarn build:umd:prod",
+ "build_command": "WEBPACK_OUTPUT_PATH=public yarn build:umd:prod",
"upload_directory": "public",
"index_key": "index.html",
"error_key": "index.html",
diff --git a/packages/instant/package.json b/packages/instant/package.json
index 6caa3902b..1813d61e5 100644
--- a/packages/instant/package.json
+++ b/packages/instant/package.json
@@ -1,11 +1,11 @@
{
"name": "@0x/instant",
- "version": "0.0.7",
+ "version": "1.0.0",
"engines": {
"node": ">=6.12"
},
- "private": true,
"description": "0x Instant React Component",
+ "private": true,
"main": "lib/src/index.js",
"types": "lib/src/index.d.ts",
"scripts": {
@@ -29,8 +29,8 @@
"config": {
"postpublish": {
"assets": [
- "packages/instant/public/index.js",
- "packages/instant/public/index.min.js"
+ "packages/instant/umd/instant.js",
+ "packages/instant/umd/instant.js.map"
]
}
},
@@ -57,7 +57,7 @@
"bowser": "^1.9.4",
"copy-to-clipboard": "^3.0.8",
"ethereum-types": "^1.1.2",
- "lodash": "^4.17.10",
+ "lodash": "^4.17.5",
"polished": "^2.2.0",
"react": "^16.5.2",
"react-dom": "^16.5.2",
@@ -89,6 +89,7 @@
"npm-run-all": "^4.1.2",
"nyc": "^11.0.1",
"shx": "^0.2.2",
+ "svg-react-loader": "^0.4.6",
"ts-jest": "^23.10.3",
"tslint": "5.11.0",
"typedoc": "0.13.0",
diff --git a/packages/instant/public/index.html b/packages/instant/public/index.html
index f6c809e33..253cbb194 100644
--- a/packages/instant/public/index.html
+++ b/packages/instant/public/index.html
@@ -6,7 +6,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>0x Instant Dev Environment</title>
<link rel="stylesheet" href="/external.css">
- <script type="text/javascript" src="/main.bundle.js" charset="utf-8"></script>
+ <script type="text/javascript" src="/instant.js" charset="utf-8"></script>
<script type="text/javascript" src="https://unpkg.com/jsuri@1.3.1/Uri.js" charset="utf-8"></script>
<script type="text/javascript" src="https://unpkg.com/bignumber.js@4.1.0/bignumber.js" charset="utf-8"></script>
<style>
diff --git a/packages/instant/src/assets/icons/ae.svg b/packages/instant/src/assets/icons/ae.svg
new file mode 100644
index 000000000..592400d1a
--- /dev/null
+++ b/packages/instant/src/assets/icons/ae.svg
@@ -0,0 +1,4 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M22.7499 13.7657H17.0782V12.215H21.1376C20.7961 10.7612 19.5062 9.6757 17.9887 9.6757C16.6799 9.6757 15.5038 10.4704 14.9916 11.711L14.6692 12.3506L13.588 11.1101C14.3467 9.28802 16.0729 8.125 17.9887 8.125C20.6064 8.125 22.7499 10.3154 22.7499 12.9903V13.7657V13.7657Z" fill="white"/>
+<path d="M17.9888 17.8556C15.8453 17.8556 14.6882 16.5375 13.7777 15.3164L13.1707 14.5022C12.2792 13.3004 11.3497 12.0405 10.4202 10.8193C9.88911 10.1215 8.95963 9.6757 8.01119 9.6757C6.22811 9.6757 4.76751 11.1682 4.76751 12.9903C4.76751 14.8124 6.22811 16.3049 8.01119 16.3049C9.62354 16.3049 10.7806 14.793 11.2169 14.1339L11.4446 13.6881L12.4689 15.0062C11.2738 16.8283 9.64251 17.875 7.99222 17.875C5.39348 17.8556 3.25 15.6846 3.25 12.9903C3.25 10.296 5.39348 8.125 8.01119 8.125C9.45282 8.125 10.7996 8.78405 11.6153 9.86953C12.5447 11.0907 13.4742 12.3506 14.3658 13.5718L14.9728 14.3859C15.8833 15.6071 16.661 16.3049 17.9698 16.3049C19.2218 16.3049 20.1892 15.7428 20.7203 14.5992L22.4275 14.6573L22.2758 15.0644C21.517 16.7701 19.8288 17.8556 17.9888 17.8556Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/agi.svg b/packages/instant/src/assets/icons/agi.svg
new file mode 100644
index 000000000..9ed9784a4
--- /dev/null
+++ b/packages/instant/src/assets/icons/agi.svg
@@ -0,0 +1,5 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12.325 5C10.8394 6.11774 9.74739 8.04279 10.0509 9.9134C10.6651 13.7056 16.5341 13.6813 16.6503 17.6773C16.7037 19.5213 15.62 20.7213 14.413 22" stroke="white" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M14.1626 5C14.1626 5 18.2507 7.50998 15.551 12.0307" stroke="white" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M12.311 21.9988C12.311 21.9988 8.22279 19.4888 10.9225 14.9681" stroke="white" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/ant.svg b/packages/instant/src/assets/icons/ant.svg
new file mode 100644
index 000000000..ed7e1491a
--- /dev/null
+++ b/packages/instant/src/assets/icons/ant.svg
@@ -0,0 +1,5 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M22.7939 9.45381C18.9889 6.11086 14.2089 4.40315 13.2906 4.09626L12.9929 4L12.7017 4.09512C11.7813 4.40315 6.99477 6.11312 3.18976 9.4606L3 9.62707L3.04689 9.89999C3.12542 10.3439 3.58127 12.6858 4.85288 15.2847C5.66972 16.9505 6.66868 18.4114 7.82251 19.6287C9.22826 21.1077 10.8696 22.205 12.7028 22.8902L13.0005 23L13.1936 22.9219L13.2961 22.8845C15.1184 22.2039 16.7587 21.1066 18.1742 19.6231C19.3215 18.4193 20.3205 16.9573 21.1449 15.2791C22.4242 12.6711 22.904 10.2544 22.9531 9.87734H22.9542L23 9.60782L22.7939 9.45381ZM14.6004 9.48891C15.6223 9.48212 16.546 9.73352 17.2211 10.1582C17.1992 10.1514 16.8448 10.0347 16.4849 9.98492C16.2984 10.1842 16.3964 10.0845 16.151 10.2986C15.9839 10.4444 15.963 10.46 15.963 10.46C14.8778 10.2222 14.6004 9.48891 14.6004 9.48891ZM20.3619 14.8691C20.0151 15.5769 19.6356 16.2416 19.2266 16.8633C19.0467 17.1374 18.8613 17.4012 18.6704 17.6572C17.3781 17.5609 16.7118 17.1363 16.3704 16.7025C15.9636 16.1873 16.0138 15.6618 16.0138 15.6618C16.0138 15.5905 16.0138 15.5203 16.0258 15.4489C16.0258 15.4489 16.0323 15.3866 16.052 15.2881C16.0803 15.1534 16.1359 14.9507 16.2417 14.7479C16.4217 14.3992 16.7499 14.0504 17.3356 14.0458H17.3465C17.5013 14.039 17.6562 14.0719 17.7871 14.1489C18.4065 14.4965 18.0041 15.1466 18.0041 15.1466C18.051 15.1386 18.0979 15.1284 18.1459 15.1149C18.8907 14.9065 19.7305 14.0221 19.5854 12.5397C19.5527 12.2034 19.4436 11.9021 19.2931 11.6349C18.9136 10.9611 18.2669 10.5126 17.8983 10.2986C17.7304 10.2012 17.6202 10.1514 17.6202 10.1514C17.6387 10.0314 17.6453 9.93736 17.6453 9.86602C17.6453 9.85243 17.6453 9.83997 17.6442 9.82751C17.6409 9.71314 17.6202 9.66897 17.6202 9.66897C13.777 7.25462 10.7823 7.77667 10.7823 7.77667L11.5261 8.54899C11.5228 8.54899 11.5206 8.54786 11.5174 8.54786C11.4454 8.5422 11.368 8.5422 11.2971 8.5422C10.2447 8.58183 9.26425 8.9159 8.42669 9.47193C6.78101 10.5625 5.68717 12.5023 5.68717 14.7151C5.68717 14.8193 5.69044 14.9189 5.6948 15.0152C5.67299 14.971 5.65118 14.9269 5.62828 14.8816C5.51377 14.6494 5.40689 14.4184 5.30547 14.1931C4.54643 12.4865 4.16037 10.9871 3.99351 10.2182C7.76471 7.07569 12.3538 5.49368 12.9951 5.28645C13.175 5.3442 13.6625 5.50954 14.3539 5.78698C15.1392 6.10067 16.1872 6.5593 17.3476 7.16629C18.8209 7.93748 20.4742 8.94988 21.9967 10.2148C21.8069 11.0823 21.3358 12.884 20.3619 14.8691ZM22.6172 10.3111C22.6216 10.2929 22.6248 10.2748 22.6292 10.2578C22.6336 10.2612 22.6368 10.2646 22.6412 10.2692L22.6717 10.2952L22.6172 10.3111Z" fill="white"/>
+<path d="M22.672 10.2941L22.6164 10.311C22.6208 10.2929 22.6241 10.2748 22.6284 10.2578C22.6328 10.2612 22.6361 10.2646 22.6404 10.2691L22.672 10.2941Z" fill="white"/>
+<path d="M22.641 10.268C22.6366 10.2646 22.6333 10.2612 22.629 10.2567C22.6257 10.2736 22.6213 10.2918 22.617 10.3099L22.6726 10.2929L22.641 10.268Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/ast.svg b/packages/instant/src/assets/icons/ast.svg
new file mode 100644
index 000000000..8136fb688
--- /dev/null
+++ b/packages/instant/src/assets/icons/ast.svg
@@ -0,0 +1,4 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M13.5404 20.9375C13.4799 20.9375 13.3589 20.8844 13.2983 20.8844L11.483 19.2906C11.4225 19.2375 11.3619 19.1312 11.4225 19.025C11.483 18.8656 11.5435 18.8125 11.6645 18.8125H12.0276C13.2378 18.7594 14.4481 18.4406 15.5373 17.9094C15.8399 17.75 16.7476 17.2719 16.7476 17.2719C16.8081 17.2188 16.8686 17.2188 16.9291 17.2188C16.9896 17.2188 17.1106 17.2719 17.1712 17.325C17.2922 17.4312 17.2922 17.5375 17.1712 17.6437C16.9291 17.9625 16.6265 18.2813 16.2634 18.6L13.7219 20.8844C13.6614 20.8844 13.6009 20.9375 13.5404 20.9375Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9.56975 16.2045C10.636 16.5909 11.8546 16.7455 12.9971 16.7455C13.911 16.7455 14.825 16.5909 15.6628 16.3591C16.9575 16.05 18.1761 15.5091 19.3185 14.7364C19.5582 14.5743 19.7429 14.4225 19.9518 14.2507C19.9927 14.2172 20.0345 14.1828 20.0778 14.1475C20.1218 14.1116 20.1642 14.0774 20.2057 14.0439C20.3315 13.9426 20.4492 13.8477 20.5776 13.7318L20.8418 13.5C20.918 13.4227 20.9733 13.3464 20.9941 13.1909C21.0106 13.0678 20.9941 12.9591 20.9179 12.8818L13.3017 5.07727C13.2636 5.07727 13.2065 5.05796 13.1494 5.03865C13.0923 5.01933 13.0352 5 12.9971 5C12.9209 5 12.7686 5.07727 12.6924 5.15455L5.07616 12.9591C5 13.0364 5 13.1909 5 13.2682C5 13.3454 5.07605 13.4226 5.15215 13.4998L5.15232 13.5L5.38082 13.7318L5.6093 13.9636C5.83779 14.1955 6.14244 14.4273 6.37093 14.5818C7.36104 15.2773 8.42731 15.8182 9.56975 16.2045ZM14.444 14.4272C14.5046 14.4878 14.5618 14.4878 14.6379 14.4878C15.7804 14.2559 16.7288 13.8863 17.7189 13.2681L17.7951 13.1909C17.8713 13.1136 17.9474 12.9591 17.9474 12.8818C17.9474 12.8045 17.9004 12.7264 17.8243 12.6491L17.7189 12.5727C16.348 11.8 14.7486 11.3363 13.1492 11.3363C11.7783 11.3363 10.4074 11.6454 9.18874 12.1863L8.88409 12.3409C8.78592 12.3835 8.73177 12.5727 8.73177 12.7272C8.73177 12.8818 8.88409 12.9591 9.03642 12.9591H9.41723C11.169 12.9591 12.9207 13.5 14.444 14.4272Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/bat.svg b/packages/instant/src/assets/icons/bat.svg
new file mode 100644
index 000000000..9b69ddf9d
--- /dev/null
+++ b/packages/instant/src/assets/icons/bat.svg
@@ -0,0 +1,3 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M13 4L5 18M13 4L21 18M13 4V9.59695M5 18H21M5 18L9.96552 15.1024M21 18L16.0345 15.1024M13 9.59695L9.96552 15.1024M13 9.59695L16.0345 15.1024M9.96552 15.1024H16.0345" stroke="white" stroke-linejoin="round"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/cvc.svg b/packages/instant/src/assets/icons/cvc.svg
new file mode 100644
index 000000000..bddc90e16
--- /dev/null
+++ b/packages/instant/src/assets/icons/cvc.svg
@@ -0,0 +1,4 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M15.2594 11.7495C15.2594 12.6029 14.7567 13.3438 14.0266 13.6875V16.2004H12.1715V13.6994C11.4294 13.3556 10.9148 12.6148 10.9148 11.7495C10.9148 10.5582 11.8902 9.59806 13.0871 9.59806C14.2839 9.59214 15.2594 10.5582 15.2594 11.7495Z" fill="white"/>
+<path d="M19.6575 14.7602C18.8736 17.6288 16.2285 19.7446 13.0868 19.7446C9.33464 19.7446 6.28266 16.722 6.28266 13C6.28266 9.27802 9.33464 6.26131 13.0868 6.26131C16.1926 6.26131 18.8257 8.33567 19.6336 11.1568H21.9195C21.0578 7.10884 17.4254 4.0625 13.0868 4.0625C8.11385 4.0625 4.0625 8.07489 4.0625 13C4.0625 17.931 8.11385 21.9375 13.0868 21.9375C17.4553 21.9375 21.1117 18.8437 21.9375 14.7602H19.6575Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/dai.svg b/packages/instant/src/assets/icons/dai.svg
new file mode 100644
index 000000000..901d522ca
--- /dev/null
+++ b/packages/instant/src/assets/icons/dai.svg
@@ -0,0 +1,5 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="13.0001" y="6.41421" width="9.3138" height="9.3138" transform="rotate(45 13.0001 6.41421)" stroke="white" stroke-width="2"/>
+<rect x="13.0001" y="10.3334" width="3.77125" height="3.77125" transform="rotate(45 13.0001 10.3334)" fill="white"/>
+<path d="M21.0001 13.0001L13.0001 21.0001L5 13.0001H21.0001Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/dgd.svg b/packages/instant/src/assets/icons/dgd.svg
new file mode 100644
index 000000000..371f89584
--- /dev/null
+++ b/packages/instant/src/assets/icons/dgd.svg
@@ -0,0 +1,5 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9.75 10.5H5V9H9.75V10.5Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12.5 9V16H5V11.6552H11V9H12.5ZM11 14.5V13.1552H6.5V14.5H11Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M21 9H13.5V16H21V11.6552H16.25V13.1552H19.5V14.5H15V10.5H21V9Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/dgx.svg b/packages/instant/src/assets/icons/dgx.svg
new file mode 100644
index 000000000..2e4a90a5d
--- /dev/null
+++ b/packages/instant/src/assets/icons/dgx.svg
@@ -0,0 +1,4 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13 5L21 13.0578L19.1416 14.9029L13 8.71696L6.85844 14.9029L5 13.0578L13 5Z" fill="white"/>
+<path d="M12.9489 10.9281L17.9487 15.9641L12.9489 21L7.94915 15.9641L12.9489 10.9281Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/dnt.svg b/packages/instant/src/assets/icons/dnt.svg
new file mode 100644
index 000000000..7d5459343
--- /dev/null
+++ b/packages/instant/src/assets/icons/dnt.svg
@@ -0,0 +1,4 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M21.7258 15.5161C21.4223 16.9902 20.8862 18.3613 19.9804 19.5672C18.6743 21.3155 16.9101 22.2664 14.8021 22.6148C13.9495 22.7573 13.0934 22.7813 12.2337 22.7142C12.125 22.7046 12.0058 22.7142 11.916 22.628C11.7991 22.7178 11.6645 22.6879 11.5405 22.6675C10.4789 22.4879 9.44911 22.1933 8.47841 21.7167C7.08967 21.0281 5.95718 20.0366 5.13645 18.7014C5.05497 18.5661 4.93334 18.4332 4.93806 18.2536C4.47397 17.2932 4.21299 16.2765 4.10907 15.2167C3.85281 12.5427 4.67 10.1825 6.16974 8.02577C6.75783 7.18154 7.4463 6.42593 8.18909 5.71701C9.94627 4.04411 11.9739 3.69923 14.2259 4.41534C14.5305 4.51473 14.8305 4.63807 15.1281 4.75902C15.2037 4.78895 15.304 4.79494 15.3335 4.90152C15.0301 5.12665 14.9391 5.44518 14.9391 5.80323C14.9391 7.24022 14.9391 8.67482 14.9368 10.1106C14.9368 10.1825 14.9793 10.2687 14.8919 10.3298C14.0074 9.85554 13.0816 9.64359 12.0766 9.76932C9.49989 10.0903 7.66595 12.605 8.13949 15.1892C8.71695 18.323 12.0731 19.9636 14.8376 18.4559C14.9875 18.3733 15.056 18.3733 15.1635 18.523C15.5615 19.0738 16.2641 19.1852 16.8026 18.7912C17.1628 18.5266 17.2998 18.1542 17.2998 17.7123C17.2974 13.8192 17.2998 9.9238 17.3021 6.02836C18.5987 6.92528 19.7088 8.01859 20.6582 9.28194C21.1873 9.98727 21.5215 10.7764 21.7199 11.6314C21.8332 11.8829 21.8403 12.1619 21.8734 12.4266C22.0009 13.4624 21.9313 14.4934 21.7258 15.5161Z" fill="white"/>
+<path d="M14.5209 15.0703C14.3237 16.0858 13.5715 16.6031 12.5724 16.3828C11.682 16.1864 11.0042 15.7026 10.7704 14.7614C10.4563 13.498 11.5285 11.9197 13.0991 12.1999C14.0722 12.3736 14.528 12.9879 14.5788 14.1243C14.5823 14.2033 14.5788 14.2824 14.5788 14.3614C14.5882 14.5997 14.5658 14.8368 14.5209 15.0703Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/fun.svg b/packages/instant/src/assets/icons/fun.svg
new file mode 100644
index 000000000..bb4347df2
--- /dev/null
+++ b/packages/instant/src/assets/icons/fun.svg
@@ -0,0 +1,4 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M25.6631 15.9533L23.4018 15.428C23.5825 14.6503 23.6786 13.8378 23.6786 13C23.6786 12.1622 23.5825 11.3497 23.4018 10.572L25.6631 10.0467C25.8835 10.9955 26 11.9841 26 13C26 14.0159 25.8835 15.0045 25.6631 15.9533ZM24.0412 6.13431L22.071 7.36203C21.2049 5.97222 20.0278 4.79506 18.638 3.92901L19.8657 1.9588C21.5565 3.01239 22.9876 4.44354 24.0412 6.13431ZM15.9533 0.336931L15.428 2.59815C14.6503 2.41747 13.8378 2.32143 13 2.32143C12.1622 2.32143 11.3497 2.41747 10.572 2.59815L10.0467 0.336932C10.9955 0.116523 11.9841 0 13 0C14.0159 0 15.0045 0.116523 15.9533 0.336931ZM6.13431 1.9588L7.36203 3.92901C5.97222 4.79506 4.79506 5.97222 3.92901 7.36203L1.9588 6.13431C3.01239 4.44354 4.44354 3.01239 6.13431 1.9588ZM0.336932 10.0467C0.116523 10.9955 0 11.9841 0 13C0 14.0159 0.116523 15.0045 0.336931 15.9533L2.59815 15.428C2.41747 14.6503 2.32143 13.8378 2.32143 13C2.32143 12.1622 2.41747 11.3497 2.59815 10.572L0.336932 10.0467ZM1.9588 19.8657L3.92901 18.638C4.79506 20.0278 5.97222 21.2049 7.36203 22.071L6.13431 24.0412C4.44354 22.9876 3.01239 21.5565 1.9588 19.8657ZM10.0467 25.6631C10.9955 25.8835 11.9841 26 13 26C14.0159 26 15.0045 25.8835 15.9533 25.6631L15.428 23.4018C14.6503 23.5825 13.8378 23.6786 13 23.6786C12.1622 23.6786 11.3497 23.5825 10.572 23.4018L10.0467 25.6631ZM19.8657 24.0412C21.5565 22.9876 22.9876 21.5565 24.0412 19.8657L22.071 18.638C21.2049 20.0278 20.0278 21.2049 18.638 22.071L19.8657 24.0412Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M18.8446 17.7331L17.9417 17.0037C18.1478 16.7486 18.3371 16.4737 18.507 16.1794C18.6769 15.8852 18.8203 15.5838 18.9382 15.2777L20.0213 15.695C19.8818 16.0571 19.7124 16.4131 19.5122 16.7598C19.3121 17.1065 19.0885 17.4312 18.8446 17.7331ZM20.4291 14.1765L19.2826 13.9952C19.3876 13.3314 19.385 12.66 19.281 12.0059L20.4273 11.8237C20.5502 12.5964 20.5534 13.3905 20.4291 14.1765ZM20.0204 10.305L18.9365 10.7204C18.6996 10.1019 18.3661 9.51917 17.9433 8.99682L18.8455 8.26657C19.3462 8.88513 19.7405 9.57446 20.0204 10.305ZM17.7331 7.15543L17.0038 8.05835C16.7486 7.85225 16.4737 7.66288 16.1795 7.49301C15.8852 7.32313 15.5838 7.17973 15.2777 7.06183L15.695 5.97871C16.0572 6.11822 16.4132 6.28764 16.7598 6.4878C17.1065 6.68796 17.4312 6.91155 17.7331 7.15543ZM14.1765 5.57091L13.9952 6.71738C13.3315 6.6124 12.6601 6.615 12.006 6.719L11.8237 5.57268C12.5964 5.44983 13.3905 5.4466 14.1765 5.57091ZM10.3051 5.9796L10.7204 7.06347C10.102 7.30044 9.51921 7.63389 8.99686 8.05669L8.2666 7.15447C8.88516 6.65381 9.57449 6.25955 10.3051 5.9796ZM7.15546 8.26687C6.91159 8.56877 6.68799 8.89349 6.48783 9.24017C6.28768 9.58686 6.11826 9.94285 5.97874 10.305L7.06186 10.7223C7.17977 10.4162 7.32316 10.1148 7.49304 9.82053C7.66292 9.52629 7.85229 9.25138 8.05838 8.99625L7.15546 8.26687ZM5.57095 11.8235L6.71742 12.0048C6.61244 12.6686 6.61504 13.34 6.71903 13.994L5.57272 14.1763C5.44987 13.4036 5.44664 12.6095 5.57095 11.8235ZM5.97964 15.6949L7.06351 15.2796C7.30048 15.8981 7.63393 16.4808 8.05672 17.0032L7.15451 17.7334C6.65384 17.1149 6.25958 16.4255 5.97964 15.6949ZM8.26691 18.8446L8.99629 17.9416C9.25142 18.1477 9.52633 18.3371 9.82057 18.507C10.1148 18.6769 10.4163 18.8202 10.7223 18.9381L10.305 20.0213C9.94289 19.8818 9.58689 19.7123 9.24021 19.5122C8.89353 19.312 8.56881 19.0884 8.26691 18.8446ZM11.8235 20.4291L12.0048 19.2826C12.6686 19.3876 13.34 19.385 13.9941 19.281L14.1763 20.4273C13.4036 20.5501 12.6095 20.5534 11.8235 20.4291ZM15.695 20.0204L15.2797 18.9365C15.8981 18.6995 16.4808 18.3661 17.0032 17.9433L17.7334 18.8455C17.1149 19.3462 16.4256 19.7404 15.695 20.0204Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/gno.svg b/packages/instant/src/assets/icons/gno.svg
new file mode 100644
index 000000000..ebf6290cf
--- /dev/null
+++ b/packages/instant/src/assets/icons/gno.svg
@@ -0,0 +1,6 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M21.3571 7.40046L20.5979 8.165C21.2029 9.12068 21.3926 10.3213 20.9775 11.4701C20.2875 13.4173 18.1463 14.4426 16.195 13.7478C15.9182 13.6442 15.6592 13.5208 15.4358 13.3655L13 15.8184L10.8747 13.6602C9.89011 14.3212 8.62874 14.5123 7.43855 14.0942C5.43579 13.3635 4.39981 11.1555 5.12539 9.15453C5.2282 8.84194 5.38439 8.5632 5.55639 8.30238L4.64101 7.38254L4.46901 7.67721C3.51804 9.24413 3.00005 11.052 3.00005 12.9135C2.98226 18.4605 7.47216 23 12.9822 23H13C18.5081 23 22.9822 18.4963 23 12.9474C23 11.1037 22.4998 9.29589 21.5488 7.71304L21.3571 7.40046Z" fill="white"/>
+<path d="M6.67956 9.43533C6.42056 9.78376 6.26437 10.2178 6.26437 10.6877C6.26437 11.8186 7.17975 12.7404 8.30272 12.7404C8.76931 12.7404 9.20031 12.5831 9.54629 12.3064L6.67956 9.43533Z" fill="white"/>
+<path d="M16.5982 12.2518C16.9285 12.4786 17.3105 12.6 17.7463 12.6C18.8765 12.6 19.7978 11.6786 19.7978 10.5483C19.7978 10.1304 19.6765 9.73037 19.4496 9.40002L16.5982 12.2518Z" fill="white"/>
+<path d="M13.0465 14.2L5.39969 6.4646L5.70373 6.14176C7.59026 4.1272 10.1673 3 12.9348 3H12.9513C15.7518 3 18.4387 4.20837 20.3106 6.3041L20.5981 6.62695L13.0465 14.2ZM6.647 6.4646L13.0465 12.9271L19.3655 6.59374C17.6713 4.88542 15.3671 3.90213 12.9659 3.90213H12.9495C10.5666 3.90213 8.34304 4.80425 6.647 6.4646Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/gnt.svg b/packages/instant/src/assets/icons/gnt.svg
new file mode 100644
index 000000000..7315ce459
--- /dev/null
+++ b/packages/instant/src/assets/icons/gnt.svg
@@ -0,0 +1,3 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M16.1123 6.80392L18 5.08032L17.0723 4L15.1809 5.72692C14.5328 5.20821 13.7184 4.89855 12.8343 4.89855C10.7151 4.89855 9 6.67359 9 8.85971C9 10.7993 10.3501 12.4153 12.1346 12.7551L12.1346 14.1434C10.3501 14.4833 9 16.0993 9 18.0388C9 20.225 10.7151 22 12.8343 22C14.9534 22 16.6685 20.225 16.6685 18.0388C16.6685 16.0993 15.3185 14.4833 13.534 14.1434V12.7551C15.3185 12.4153 16.6686 10.7993 16.6686 8.85971C16.6686 8.10751 16.4651 7.40334 16.1123 6.80392ZM12.8343 6.34151C11.491 6.34151 10.3994 7.46738 10.3994 8.85971C10.3994 10.252 11.491 11.3779 12.8343 11.3779C14.1775 11.3779 15.2692 10.252 15.2692 8.85971C15.2692 8.2138 15.035 7.62639 14.6488 7.18047C14.2018 6.66426 13.5548 6.34151 12.8343 6.34151ZM12.8343 15.5206C11.491 15.5206 10.3994 16.6465 10.3994 18.0388C10.3994 19.4312 11.491 20.557 12.8343 20.557C14.1775 20.557 15.2692 19.4312 15.2692 18.0388C15.2692 16.6465 14.1775 15.5206 12.8343 15.5206Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/knc.svg b/packages/instant/src/assets/icons/knc.svg
new file mode 100644
index 000000000..70d35bc2f
--- /dev/null
+++ b/packages/instant/src/assets/icons/knc.svg
@@ -0,0 +1,6 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12.4391 13L18.514 16.2448C18.7327 16.3582 19 16.2221 19 15.9952V10.0049C19 9.77795 18.7327 9.64181 18.514 9.75526L12.4391 13Z" fill="white"/>
+<path d="M18.4066 7.87359L14.4048 5.06338C14.2176 4.92849 13.9603 5.01841 13.9134 5.24323L12.4391 11.5156L18.3597 8.36819C18.5704 8.25578 18.5704 8.00848 18.4066 7.87359Z" fill="white"/>
+<path d="M14.4011 20.9357L18.3951 18.0966C18.582 17.9614 18.5586 17.7135 18.3718 17.6009L12.4391 14.4688L13.8872 20.778C13.934 20.9808 14.2142 21.0709 14.4011 20.9357Z" fill="white"/>
+<path d="M10.6638 12.9938L12.4279 6.3505C12.5093 6.08826 12.1293 5.89159 11.8579 6.06641L7.35281 8.84172C7.1357 8.99469 7 9.21322 7 9.4536V16.5339C7 16.7743 7.1357 16.9928 7.35281 17.1458L11.8579 19.943C12.1293 20.0959 12.4822 19.9211 12.4279 19.6589L10.6638 12.9938Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/link.svg b/packages/instant/src/assets/icons/link.svg
new file mode 100644
index 000000000..2fddf7ef1
--- /dev/null
+++ b/packages/instant/src/assets/icons/link.svg
@@ -0,0 +1,6 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13 3L21 7.68346V17.3165L13 22L5 17.3165V7.68346L13 3ZM6.28 9.19243V16.5278L12.36 20.0872V12.5645L6.28 9.19243ZM13.64 12.5645V20.0872L19.72 16.5278V9.19243L13.64 12.5645ZM19.0191 8.06188L13 11.4002L6.9809 8.06188L13 4.53811L19.0191 8.06188Z" fill="white"/>
+<path d="M18.2282 13.1079V12.615C18.2282 11.9957 17.8033 11.7385 17.2759 12.0514L16.648 12.4222C15.8306 12.7915 15.6957 13.4916 15.6957 14.113V14.606C15.4529 14.7817 15.2645 15.1396 15.2645 15.4353V17.377C15.2645 17.6963 15.4843 17.8313 15.7543 17.6706L18.1654 16.2454C18.4396 16.0847 18.6593 15.6904 18.6593 15.371V13.4273C18.6614 13.1337 18.4751 12.9944 18.2282 13.1079ZM16.3173 13.7466C16.3173 13.5301 16.4659 13.2665 16.6501 13.1572L17.278 12.7865C17.46 12.6772 17.6107 12.7672 17.6107 12.9836V13.468L16.3194 14.2309V13.7466H16.3173Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M10.4906 14.3533L7.25223 12.4824L7.56089 11.894L10.7993 13.7649L10.4906 14.3533Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9.30744 15.2854L7.24664 14.0381L7.56639 13.4564L9.62719 14.7036L9.30744 15.2854Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/lpt.svg b/packages/instant/src/assets/icons/lpt.svg
new file mode 100644
index 000000000..cbe4f2202
--- /dev/null
+++ b/packages/instant/src/assets/icons/lpt.svg
@@ -0,0 +1,8 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="8" y="6" width="2.60007" height="2.72222" fill="white"/>
+<rect x="8" y="11.4445" width="2.60007" height="2.72222" fill="white"/>
+<rect x="8" y="17.2778" width="2.60007" height="2.72222" fill="white"/>
+<rect x="13.2002" y="14.1667" width="2.60007" height="2.72222" fill="white"/>
+<rect x="13.2002" y="8.72223" width="2.60007" height="2.72222" fill="white"/>
+<rect x="18.3999" y="11.4445" width="2.60007" height="2.72222" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/mana.svg b/packages/instant/src/assets/icons/mana.svg
new file mode 100644
index 000000000..45be622e4
--- /dev/null
+++ b/packages/instant/src/assets/icons/mana.svg
@@ -0,0 +1,8 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M7.49637 17.2106C5.66831 17.0504 3.6051 17.0501 2.21785 17.0997L2.18216 16.1003C3.59491 16.0499 5.7017 16.0495 7.58364 16.2144C8.52311 16.2967 9.42302 16.4215 10.1582 16.6074C10.5258 16.7004 10.8652 16.8118 11.1529 16.9476C11.4351 17.0807 11.7032 17.2536 11.8904 17.4876C12.1548 17.8181 12.1951 18.1947 12.0685 18.544C11.9575 18.8502 11.7282 19.1116 11.5056 19.3215C11.2752 19.5389 11.0004 19.7477 10.7412 19.938C10.666 19.9932 10.5926 20.0465 10.5212 20.0984C10.3369 20.2322 10.1657 20.3566 10.0104 20.4795C9.8313 20.6213 9.71009 20.7335 9.63807 20.8195C9.70045 20.8513 9.8027 20.8944 9.9652 20.9413C10.3024 21.0386 10.8117 21.1286 11.5498 21.2025C13.7635 21.4238 15.3373 21.8324 16.3972 22.2626C16.9266 22.4775 17.3363 22.7012 17.6356 22.916C17.916 23.1172 18.1597 23.353 18.2642 23.6143L17.3358 23.9857C17.3364 23.9873 17.3359 23.9866 17.3338 23.9837C17.3216 23.9665 17.2559 23.8744 17.0525 23.7284C16.8328 23.5707 16.4971 23.3823 16.0212 23.1892C15.0705 22.8033 13.5943 22.4119 11.4503 22.1975C10.6883 22.1213 10.1101 22.0239 9.68794 21.9021C9.2949 21.7886 8.9238 21.6242 8.72365 21.329C8.60977 21.161 8.56362 20.9686 8.58639 20.7737C8.60754 20.5927 8.68431 20.4391 8.76413 20.3198C8.91883 20.0886 9.1609 19.8766 9.38966 19.6955C9.56253 19.5586 9.75948 19.4156 9.94983 19.2774C10.0177 19.2281 10.0847 19.1794 10.1494 19.1319C10.4059 18.9437 10.6374 18.7658 10.8194 18.5941C11.0093 18.415 11.0988 18.2849 11.1284 18.2032L11.1284 18.2031C11.1424 18.1646 11.1452 18.1569 11.1096 18.1123C11.0568 18.0464 10.9418 17.9537 10.7263 17.852C10.5164 17.753 10.2436 17.6605 9.91304 17.5769C9.25199 17.4097 8.4119 17.2908 7.49637 17.2106Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13 24C19.0751 24 24 19.0751 24 13C24 6.92487 19.0751 2 13 2C6.92487 2 2 6.92487 2 13C2 19.0751 6.92487 24 13 24ZM13 25C19.6274 25 25 19.6274 25 13C25 6.37258 19.6274 1 13 1C6.37258 1 1 6.37258 1 13C1 19.6274 6.37258 25 13 25Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M11 8C12.1046 8 13 7.10457 13 6C13 4.89543 12.1046 4 11 4C9.89543 4 9 4.89543 9 6C9 7.10457 9.89543 8 11 8ZM11 9C12.6569 9 14 7.65685 14 6C14 4.34315 12.6569 3 11 3C9.34315 3 8 4.34315 8 6C8 7.65685 9.34315 9 11 9Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M19.3544 10.0971C19.3932 10.1466 19.4365 10.2061 19.484 10.2774C19.7893 10.7353 20.1742 11.2747 20.5255 11.7041C20.7 11.9173 20.8758 12.1154 21.0359 12.2644C21.1152 12.3383 21.2026 12.4114 21.2933 12.4689C21.369 12.5169 21.5161 12.6 21.7 12.6C21.8593 12.6 21.948 12.6024 22.0287 12.6226C22.0927 12.6386 22.1619 12.669 22.2464 12.7536L23.7114 14.2186L24.084 14.7774L24.916 14.2226L24.4886 13.5815L22.9536 12.0465C22.5427 11.6356 22.1032 11.6027 21.7954 11.6002C21.7757 11.5847 21.7497 11.5627 21.7173 11.5325C21.6055 11.4284 21.4625 11.2702 21.2995 11.0709C20.9758 10.6753 20.6107 10.1647 20.316 9.72267C20.151 9.47514 19.989 9.28275 19.8263 9.14716C19.6693 9.01633 19.4649 8.90002 19.225 8.90002C18.956 8.90002 18.7546 9.04494 18.6402 9.21642C18.6195 9.24747 18.6015 9.27935 18.586 9.31166C18.4752 9.29075 18.3533 9.2574 18.2581 9.22568L18.1 9.17298L17.9419 9.22568C17.7542 9.28825 17.4747 9.41143 17.2033 9.58944C16.9388 9.76293 16.6298 10.0223 16.4528 10.3764C16.404 10.4739 16.2853 10.643 16.101 10.8746C15.9414 11.075 15.7554 11.2948 15.5674 11.5168C15.5469 11.541 15.5263 11.5653 15.5058 11.5896C15.3014 11.8311 15.0953 12.0762 14.9402 12.2813C14.8986 12.3363 14.8582 12.3918 14.8209 12.4462C14.6897 12.3856 14.5305 12.3063 14.3486 12.2153L14.341 12.2115C14.0837 12.0829 13.7913 11.9366 13.5241 11.8228C13.3886 11.7651 13.2507 11.7119 13.12 11.6724C12.9957 11.6348 12.8473 11.6 12.7 11.6C12.4003 11.6 12.1295 11.7423 11.9357 11.868C11.7287 12.0023 11.527 12.1737 11.3553 12.3263C11.2877 12.3864 11.2265 12.442 11.1698 12.4933C11.0709 12.583 10.9858 12.6602 10.9047 12.7273C10.8738 12.7528 10.8485 12.7727 10.828 12.7879C10.8082 12.7835 10.7855 12.7778 10.7597 12.7708C10.6725 12.747 10.5738 12.7143 10.4581 12.6757L10.4514 12.6734C10.3437 12.6375 10.2201 12.5963 10.1034 12.5645C9.99107 12.5339 9.84438 12.5 9.7 12.5C9.60264 12.5 9.44615 12.5174 9.29251 12.5368C9.12592 12.5577 8.92301 12.5865 8.71141 12.618C8.45081 12.6567 8.17344 12.7002 7.92827 12.7397L6.75021 9.50002H4.34269L4.19313 9.70941C3.93832 10.0661 3.54237 10.6448 3.1784 11.2277C2.82473 11.7941 2.46725 12.4172 2.32566 12.8419C2.30699 12.8979 2.2892 12.9377 2.27458 12.9652C2.26708 12.9592 2.25993 12.9528 2.25355 12.9465L1.54645 13.6536C1.68989 13.797 1.98689 14.0164 2.36436 13.9942C2.82326 13.9672 3.12157 13.6165 3.27434 13.1581C3.37276 12.8629 3.66528 12.336 4.0266 11.7574C4.31329 11.2983 4.62201 10.8397 4.85912 10.5H6.04979L7.27216 13.8616L7.6822 13.7932C7.98028 13.7435 8.44228 13.669 8.8586 13.6071C9.06699 13.5761 9.26158 13.5486 9.41749 13.5289C9.49557 13.5191 9.5616 13.5115 9.61358 13.5065C9.63952 13.504 9.66035 13.5023 9.6764 13.5012C9.69349 13.5001 9.70038 13.5 9.7 13.5C9.69972 13.5 9.69976 13.5 9.7 13.5C9.70169 13.5001 9.71319 13.5008 9.73706 13.5051C9.76371 13.5098 9.79778 13.5177 9.84032 13.5293C9.9275 13.5531 10.0262 13.5858 10.1419 13.6244L10.1487 13.6266C10.1569 13.6294 10.1652 13.6321 10.1735 13.6349L9.55279 14.8764L10.4472 15.3236L11.2599 13.6982C11.2739 13.6904 11.2862 13.6832 11.2968 13.6768C11.383 13.6249 11.4675 13.5596 11.5422 13.4977C11.6399 13.4169 11.7547 13.3129 11.8657 13.2123C11.9186 13.1644 11.9707 13.1173 12.0197 13.0737C12.1855 12.9264 12.3401 12.7977 12.4799 12.707C12.5488 12.6623 12.6044 12.6333 12.6473 12.6163C12.6806 12.603 12.6975 12.6005 12.7008 12.6001C12.7041 12.6003 12.7144 12.6012 12.733 12.6047C12.7575 12.6094 12.7899 12.6173 12.8308 12.6296C12.9134 12.6546 13.0146 12.6927 13.1322 12.7428C13.3686 12.8435 13.6355 12.9768 13.9014 13.1097L13.919 13.1185C14.1676 13.2429 14.427 13.3726 14.6258 13.451C14.7176 13.4873 14.8503 13.5352 14.9809 13.5458C15.0399 13.5506 15.1837 13.5565 15.3295 13.4724C15.4868 13.3817 15.5667 13.2365 15.5914 13.0969C15.5929 13.0943 15.5945 13.0915 15.5963 13.0884C15.6234 13.0423 15.6697 12.9746 15.7379 12.8844C15.8734 12.7051 16.0611 12.4814 16.2692 12.2355C16.2898 12.2112 16.3105 12.1867 16.3314 12.162C16.5175 11.9423 16.7138 11.7105 16.8834 11.4973C17.0647 11.2695 17.246 11.0261 17.3472 10.8236C17.4102 10.6977 17.5512 10.5571 17.7517 10.4256C17.8805 10.3412 18.0123 10.2745 18.1191 10.2283C18.2692 10.2699 18.4485 10.3097 18.616 10.3254C18.7277 10.3358 18.8928 10.342 19.0508 10.2925C19.1347 10.2663 19.2496 10.2142 19.3459 10.1069C19.3487 10.1037 19.3516 10.1004 19.3544 10.0971Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M17 16.5C16.1407 16.5 15.5 17.1455 15.5 17.875C15.5 18.1442 15.5796 18.2392 15.652 18.294C15.7592 18.3752 15.9562 18.4423 16.2977 18.4749C16.5049 18.4948 16.7388 18.5 17 18.5C17.2612 18.5 17.4951 18.4948 17.7023 18.4749C18.0438 18.4423 18.2408 18.3752 18.348 18.294C18.4204 18.2392 18.5 18.1442 18.5 17.875C18.5 17.1455 17.8593 16.5 17 16.5ZM14.5 17.875C14.5 16.5334 15.6502 15.5 17 15.5C18.3498 15.5 19.5 16.5334 19.5 17.875C19.5 18.3927 19.3211 18.8115 18.9517 19.0912C18.6171 19.3446 18.1892 19.4329 17.7977 19.4704C17.5416 19.4949 17.2692 19.5 17 19.5C16.7308 19.5 16.4584 19.4949 16.2023 19.4704C15.8108 19.4329 15.3829 19.3446 15.0483 19.0912C14.6789 18.8115 14.5 18.3927 14.5 17.875Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M20.5 18.5C19.8585 18.5 19.5 18.9173 19.5 19.25C19.5 19.3192 19.5125 19.3478 19.516 19.3548C19.5185 19.3596 19.5226 19.3674 19.5418 19.3803C19.5975 19.4177 19.7245 19.4618 19.9799 19.4836C20.1319 19.4965 20.3046 19.5 20.5 19.5C20.6954 19.5 20.8681 19.4965 21.0201 19.4836C21.2755 19.4618 21.4025 19.4177 21.4582 19.3803C21.4774 19.3674 21.4815 19.3596 21.484 19.3548C21.4875 19.3478 21.5 19.3192 21.5 19.25C21.5 18.9173 21.1415 18.5 20.5 18.5ZM18.5 19.25C18.5 18.202 19.4847 17.5 20.5 17.5C21.5153 17.5 22.5 18.202 22.5 19.25C22.5 19.6602 22.335 19.9955 22.0166 20.2098C21.7409 20.3954 21.3993 20.4549 21.1049 20.48C20.9095 20.4966 20.7025 20.5 20.5 20.5C20.2975 20.5 20.0905 20.4966 19.8951 20.48C19.6007 20.4549 19.2591 20.3954 18.9834 20.2098C18.665 19.9955 18.5 19.6602 18.5 19.25Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/mkr.svg b/packages/instant/src/assets/icons/mkr.svg
new file mode 100644
index 000000000..e09d47444
--- /dev/null
+++ b/packages/instant/src/assets/icons/mkr.svg
@@ -0,0 +1,4 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M19.7553 7.98947C20.5802 7.37761 21.75 7.96641 21.75 8.99342V17.6154C21.75 18.0296 21.4142 18.3654 21 18.3654C20.5858 18.3654 20.25 18.0296 20.25 17.6154V9.49013L15.5278 12.9929V18C15.5278 18.4142 15.192 18.75 14.7778 18.75C14.3636 18.75 14.0278 18.4142 14.0278 18V12.867C14.0278 12.4713 14.2153 12.0989 14.5331 11.8631L19.7553 7.98947Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6.24471 7.98947C5.41985 7.37761 4.25001 7.96641 4.25001 8.99342V17.6154C4.25001 18.0296 4.58579 18.3654 5.00001 18.3654C5.41422 18.3654 5.75001 18.0296 5.75001 17.6154V9.49013L10.4722 12.9929V18C10.4722 18.4142 10.808 18.75 11.2222 18.75C11.6364 18.75 11.9722 18.4142 11.9722 18V12.867C11.9722 12.4713 11.7847 12.0989 11.4669 11.8631L6.24471 7.98947Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/mln.svg b/packages/instant/src/assets/icons/mln.svg
new file mode 100644
index 000000000..a0b821c57
--- /dev/null
+++ b/packages/instant/src/assets/icons/mln.svg
@@ -0,0 +1,4 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12.6085 3.10634C12.8511 2.96455 13.1489 2.96455 13.3915 3.10634L20.6021 7.32038C20.8482 7.46417 21 7.73183 21 8.02174V16.6605C21 16.9353 20.8635 17.1912 20.6376 17.3399L15.6215 20.6409C15.2549 20.8822 14.7665 20.7736 14.5306 20.3984C14.2948 20.0233 14.4009 19.5235 14.7676 19.2822L19.4213 16.2197V9.41321L13.7894 12.7046V23C13.7894 23.4461 13.436 23.8077 13 23.8077C12.564 23.8077 12.2106 23.4461 12.2106 23V12.7046L6.57873 9.41321V16.2197L11.2324 19.2822C11.5991 19.5235 11.7052 20.0233 11.4694 20.3984C11.2335 20.7736 10.7451 20.8822 10.3785 20.6409L5.36237 17.3399C5.13652 17.1912 5 16.9353 5 16.6605V8.02174C5 7.73183 5.15184 7.46417 5.39787 7.32038L12.6085 3.10634ZM7.38094 8.02174L13 11.3056L18.6191 8.02174L13 4.73784L7.38094 8.02174Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12.737 4.33268V3.80768H13.2632V4.33268H12.737ZM12.737 6.43268V5.38268H13.2632V6.43268H12.737ZM12.737 8.53268V7.48268H13.2632V8.53268H12.737ZM12.737 10.6327V9.58268H13.2632V10.6327H12.737ZM12.737 12.0604V11.6827H13.2632V12.0536L13.6037 12.2582L13.3371 12.7225L13.0061 12.5235L12.711 12.717L12.4271 12.2637L12.737 12.0604ZM15.2181 13.8533L14.2776 13.2879L14.5442 12.8236L15.4847 13.389L15.2181 13.8533ZM11.8489 13.2824L10.9867 13.8478L10.7028 13.3945L11.5649 12.8291L11.8489 13.2824ZM16.1586 14.4187L16.4252 13.9544L17.3657 14.5198L17.0992 14.984L16.1586 14.4187ZM10.1246 14.4132L9.26245 14.9786L8.97849 14.5252L9.84063 13.9599L10.1246 14.4132ZM18.9802 16.1148L18.0397 15.5494L18.3062 15.0852L19.2468 15.6505L18.9802 16.1148ZM8.40031 15.544L7.53817 16.1093L7.25421 15.656L8.11635 15.0906L8.40031 15.544ZM20.391 16.9629L19.9207 16.6802L20.1873 16.2159L20.6575 16.4986L20.391 16.9629ZM6.67603 16.6747L6.24496 16.9574L5.961 16.5041L6.39207 16.2214L6.67603 16.6747Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/omg.svg b/packages/instant/src/assets/icons/omg.svg
new file mode 100644
index 000000000..a906509af
--- /dev/null
+++ b/packages/instant/src/assets/icons/omg.svg
@@ -0,0 +1,3 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9.41177 13.7682C9.91234 13.7682 10.3879 13.8687 10.8384 14.0697C11.2789 14.2607 11.6643 14.522 11.9947 14.8536C12.325 15.1853 12.5853 15.5722 12.7755 16.0144C12.9758 16.4667 13.0759 16.9441 13.0759 17.4466C13.0759 17.9592 12.9808 18.4365 12.7906 18.8788C12.5903 19.321 12.325 19.7104 11.9947 20.0471C11.6643 20.3838 11.2788 20.6476 10.8384 20.8386C10.3879 21.0295 9.91234 21.125 9.41177 21.125C8.90118 21.125 8.4257 21.0295 7.98515 20.8386C7.54465 20.6476 7.15671 20.3838 6.82135 20.0471C6.48598 19.7104 6.22318 19.321 6.03296 18.8788C5.84274 18.4365 5.74764 17.9592 5.74764 17.4466C5.74764 16.9441 5.84275 16.4666 6.03296 16.0144C6.22318 15.5722 6.48598 15.1852 6.82135 14.8536C7.15673 14.522 7.54467 14.2556 7.98515 14.0546C8.42565 13.8637 8.90118 13.7682 9.41177 13.7682ZM9.41177 19.8437C10.0625 19.8437 10.6206 19.61 11.0862 19.1427C11.5517 18.6753 11.7844 18.11 11.7844 17.4466C11.7844 16.7933 11.5517 16.2331 11.0862 15.7657C10.6206 15.2984 10.0625 15.0647 9.41177 15.0647C8.75101 15.0647 8.18786 15.2984 7.72233 15.7657C7.2568 16.233 7.02403 16.7934 7.02403 17.4466C7.02403 18.11 7.25679 18.6753 7.72233 19.1427C8.18785 19.61 8.75094 19.8437 9.41177 19.8437ZM17.4609 5.6875C17.9715 5.6875 18.4469 5.78298 18.8875 5.97394C19.328 6.1649 19.7159 6.42872 20.0513 6.7654C20.3867 7.10209 20.6495 7.49154 20.8397 7.93373C21.0299 8.37595 21.125 8.85334 21.125 9.36592C21.125 9.86844 21.0299 10.3459 20.8397 10.7981C20.6495 11.2403 20.3867 11.6273 20.0513 11.9589C19.7159 12.2905 19.328 12.5569 18.8875 12.7579C18.447 12.9488 17.9715 13.0443 17.4609 13.0443C16.9603 13.0443 16.4847 12.9488 16.0343 12.7579C15.5938 12.5569 15.2083 12.2905 14.878 11.9589C14.5477 11.6272 14.2823 11.2403 14.0821 10.7981C13.8919 10.3458 13.7968 9.86844 13.7968 9.36592C13.7968 8.85334 13.8919 8.376 14.0821 7.93373C14.2823 7.49152 14.5476 7.10207 14.878 6.7654C15.2084 6.42872 15.5938 6.1649 16.0343 5.97394C16.4848 5.78298 16.9603 5.6875 17.4609 5.6875ZM17.4609 11.7479C18.1216 11.7479 18.6848 11.5142 19.1503 11.0469C19.6159 10.5795 19.8486 10.0192 19.8486 9.36593C19.8486 8.7026 19.6159 8.13726 19.1503 7.66991C18.6848 7.20256 18.1217 6.96889 17.4609 6.96889C16.8101 6.96889 16.252 7.20255 15.7865 7.66991C15.321 8.13725 15.0882 8.70254 15.0882 9.36593C15.0882 10.0192 15.3209 10.5795 15.7865 11.0469C16.252 11.5142 16.8102 11.7479 17.4609 11.7479ZM8.94623 5.6875H13.1209V6.96897H12.1899C12.4602 7.29058 12.6729 7.65239 12.8281 8.05438C12.9833 8.4564 13.0609 8.88354 13.0609 9.33585V9.366C13.0609 9.87858 12.9607 10.3559 12.7605 10.7982C12.5703 11.2505 12.3075 11.6449 11.9721 11.9816C11.6367 12.3183 11.2488 12.5821 10.8083 12.7731C10.3578 12.9641 9.87727 13.0595 9.36666 13.0595C8.85607 13.0595 8.38059 12.964 7.94004 12.7731C7.48953 12.5821 7.09909 12.3183 6.76872 11.9816C6.43835 11.6449 6.17305 11.2505 5.97282 10.7982C5.7826 10.356 5.6875 9.87858 5.6875 9.366C5.6875 8.88358 5.78261 8.43132 5.97282 8.00918C6.16304 7.58706 6.41081 7.21268 6.71617 6.88608C7.02151 6.55944 7.3694 6.2906 7.75984 6.07954C8.15028 5.86848 8.54572 5.74285 8.94621 5.70265L8.94623 5.6875ZM11.7844 9.36597C11.7844 8.70264 11.5517 8.1373 11.0861 7.66994C10.6206 7.2026 10.0624 6.96893 9.41173 6.96893C8.75097 6.96893 8.18782 7.20259 7.72229 7.66994C7.25676 8.13729 7.02399 8.70258 7.02399 9.36597C7.02399 10.0192 7.25675 10.5795 7.72229 11.0469C8.18781 11.5142 8.75091 11.7479 9.41173 11.7479C10.0625 11.7479 10.6206 11.5142 11.0861 11.0469C11.5516 10.5795 11.7844 10.0192 11.7844 9.36597Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/powr.svg b/packages/instant/src/assets/icons/powr.svg
new file mode 100644
index 000000000..eb48342e1
--- /dev/null
+++ b/packages/instant/src/assets/icons/powr.svg
@@ -0,0 +1,6 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="4.77072" y="8.24185" width="13.4376" height="13.4376" transform="rotate(-14.9496 4.77072 8.24185)" stroke="white" stroke-width="1.5"/>
+<rect x="8.24472" y="4.77117" width="13.4376" height="13.4376" transform="rotate(15 8.24472 4.77117)" stroke="white" stroke-width="1.5"/>
+<rect x="13" y="3.49816" width="13.4376" height="13.4376" transform="rotate(45 13 3.49816)" stroke="white" stroke-width="1.5"/>
+<path d="M12.1932 9.98888L15.2043 10.7957L16.0111 13.8068L13.8068 16.0111L10.7957 15.2043L9.98887 12.1932L12.1932 9.98888Z" stroke="white" stroke-width="1.5"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/ren.svg b/packages/instant/src/assets/icons/ren.svg
new file mode 100644
index 000000000..fe563dee2
--- /dev/null
+++ b/packages/instant/src/assets/icons/ren.svg
@@ -0,0 +1,12 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M13.0587 19.5805C12.827 19.7307 12.761 20.0403 12.9112 20.272C13.0614 20.5037 13.371 20.5698 13.6027 20.4195L13.0587 19.5805ZM19.2281 15.5804L13.0587 19.5805L13.6027 20.4195L19.7722 16.4195L19.2281 15.5804Z" fill="white"/>
+<path d="M11.5033 18.8023C11.2625 18.9375 11.1769 19.2423 11.3121 19.4831C11.4473 19.7239 11.7521 19.8095 11.9928 19.6743L11.5033 18.8023ZM14.6687 17.025L11.5033 18.8023L11.9928 19.6743L15.1583 17.8969L14.6687 17.025Z" fill="white"/>
+<path d="M9.92058 17.7866C9.6798 17.9218 9.5942 18.2265 9.7294 18.4673C9.8646 18.7081 10.1694 18.7937 10.4102 18.6585L9.92058 17.7866ZM13.086 16.0092L9.92058 17.7866L10.4102 18.6585L13.5756 16.8811L13.086 16.0092Z" fill="white"/>
+<path d="M8.33788 16.7709C8.09709 16.9061 8.0115 17.2109 8.1467 17.4517C8.28189 17.6925 8.58669 17.7781 8.82747 17.6429L8.33788 16.7709ZM11.5033 14.9936L8.33788 16.7709L8.82747 17.6429L11.9929 15.8655L11.5033 14.9936Z" fill="white"/>
+<path d="M6.7552 15.7554C6.51442 15.8906 6.42883 16.1954 6.56402 16.4362C6.69922 16.677 7.00401 16.7626 7.2448 16.6274L6.7552 15.7554ZM9.92065 13.9781L6.7552 15.7554L7.2448 16.6274L10.4102 14.85L9.92065 13.9781Z" fill="white"/>
+<path d="M6.7552 13.978C6.51442 14.1132 6.42883 14.4179 6.56402 14.6587C6.69922 14.8995 7.00401 14.9851 7.2448 14.8499L6.7552 13.978ZM9.92065 12.2006L6.7552 13.978L7.2448 14.8499L10.4102 13.0725L9.92065 12.2006Z" fill="white"/>
+<path d="M6.7552 12.2006C6.51442 12.3358 6.42883 12.6406 6.56402 12.8814C6.69922 13.1222 7.00401 13.2078 7.2448 13.0726L6.7552 12.2006ZM9.92065 10.4233L6.7552 12.2006L7.2448 13.0726L10.4102 11.2952L9.92065 10.4233Z" fill="white"/>
+<path d="M6.7552 10.4233C6.51442 10.5585 6.42883 10.8633 6.56402 11.104C6.69922 11.3448 7.00401 11.4304 7.2448 11.2952L6.7552 10.4233ZM9.92065 8.6459L6.7552 10.4233L7.2448 11.2952L10.4102 9.51785L9.92065 8.6459Z" fill="white"/>
+<path d="M6.7552 8.64587C6.51442 8.78107 6.42883 9.08586 6.56402 9.32664C6.69922 9.56742 7.00401 9.65302 7.2448 9.51782L6.7552 8.64587ZM9.92065 6.8685L6.7552 8.64587L7.2448 9.51782L10.4102 7.74045L9.92065 6.8685Z" fill="white"/>
+<path d="M19.9808 9.06392L19.9999 16.5253L15.5436 19.0019L8.83997 15.2553L8.84 7.47653L13.2964 5L19.9808 9.06392Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/rep.svg b/packages/instant/src/assets/icons/rep.svg
new file mode 100644
index 000000000..1be1a6a88
--- /dev/null
+++ b/packages/instant/src/assets/icons/rep.svg
@@ -0,0 +1,7 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M9.88881 13.8359C9.79999 12.913 10.7758 11.694 11.8001 11.2609C12.8245 10.8278 13.0773 9.78797 13.0773 9.78797L12.9999 4.5" stroke="white" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M13.0775 21.6833V19.5653C13.0775 19.5653 12.7758 18.3027 13.8001 17.8696C14.3952 17.618 15.0001 17.8696 15.8152 16.5078" stroke="white" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M5.92307 17.2448L7.96301 15.9141C7.96301 15.9141 9.37674 15.4762 10.2 16.2174C10.7522 16.7152 10.9111 17.3133 11.8 17.4565" stroke="white" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M20.3846 16.9333C20.3846 16.9333 18.3583 16.2297 17.6791 15.7898C16.9999 15.35 16.5712 15.2674 16.2 13.7391C15.9411 12.6734 15.1184 11.7896 14.2 11.7251" stroke="white" stroke-miterlimit="10" stroke-linecap="round"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13.9245 4.56536C13.5449 3.88115 12.5621 3.87822 12.1784 4.56015L5.48413 16.4599C5.21577 16.9369 5.38078 17.5411 5.85439 17.8154L12.571 21.7067C12.8837 21.8879 13.2698 21.8863 13.5809 21.7025L20.162 17.8154C20.6284 17.5399 20.7907 16.9431 20.5279 16.4693L13.9245 4.56536Z" stroke="white" stroke-miterlimit="10" stroke-linecap="round"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/req.svg b/packages/instant/src/assets/icons/req.svg
new file mode 100644
index 000000000..d9eb89634
--- /dev/null
+++ b/packages/instant/src/assets/icons/req.svg
@@ -0,0 +1,3 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M14.9149 7.02062H8.125V4.875H14.9149C15.6706 4.875 16.7813 5.10159 17.7327 5.81283C18.7294 6.55795 19.4796 7.78688 19.4905 9.586C19.545 10.4331 19.377 11.6685 18.6624 12.7308C17.8941 13.873 16.5803 14.6836 14.6197 14.6836H13.7989L17.8646 21.6365L16.0982 22.75L10.1267 12.5379H14.6197C15.9654 12.5379 16.6197 12.0203 16.9683 11.5022C17.3586 10.9219 17.4628 10.1886 17.4272 9.7083C17.4252 9.68092 17.4242 9.65348 17.4242 9.62602C17.4242 8.50439 16.9972 7.90691 16.5252 7.55408C16.0006 7.16185 15.34 7.02062 14.9149 7.02062Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/salt.svg b/packages/instant/src/assets/icons/salt.svg
new file mode 100644
index 000000000..f2892c981
--- /dev/null
+++ b/packages/instant/src/assets/icons/salt.svg
@@ -0,0 +1,3 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7.5702 18L13 6.36471L18.4298 18H7.5702Z" stroke="white" stroke-width="2"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/snt.svg b/packages/instant/src/assets/icons/snt.svg
new file mode 100644
index 000000000..34b2c432b
--- /dev/null
+++ b/packages/instant/src/assets/icons/snt.svg
@@ -0,0 +1,4 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16.8917 13.922C17.1192 14.2276 17.022 14.443 16.9848 14.6496C16.3229 18.189 12.8267 20.5565 9.4926 19.8948C7.99515 19.5981 7.12853 18.6198 7.01477 17.1051C6.88861 15.4344 7.56983 14.4738 9.08383 13.9396C9.98354 13.623 10.9122 13.5966 11.8429 13.6494C13.5514 13.7483 15.2412 14.1682 16.8917 13.922Z" fill="white"/>
+<path d="M10.0068 12.1724C10.1723 8.91011 12.9198 6.18159 16.0533 6.01452C16.5683 5.98594 17.0833 5.99034 17.5921 6.11344C19.1123 6.48276 19.9396 7.50279 19.9976 9.08999C20.0534 10.6134 19.3824 11.6426 17.9388 12.1637C17.1487 12.4494 16.3275 12.544 15.5002 12.5C13.6884 12.4077 12.5508 11.9564 10.0068 12.1724Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/spank.svg b/packages/instant/src/assets/icons/spank.svg
new file mode 100644
index 000000000..1d7320770
--- /dev/null
+++ b/packages/instant/src/assets/icons/spank.svg
@@ -0,0 +1,6 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M20.3039 18.5295L20.535 19.8495L16.1251 21.5978L15.5923 22.7836L11.0368 21.732L10.0483 23C10.0483 23 6.706 19.5963 6.47705 18.8779C6.06194 18.8779 5.22531 18.8779 4.75029 18.8779C4.75029 18.073 4.67754 14.0071 4.67754 14.0071L3 13.4272L5.07981 9.12767C5.07981 9.12767 4.37584 8.07604 4.22606 7.61947C4.86798 7.35549 8.04119 5.14405 8.04119 5.14405L7.92564 3.53199L12.4512 3.73539L13.2386 2L17.1521 5.21113L18.5002 4.30448L20.5843 8.56291L22.1227 8.59969L22.0307 13.6241L23 14.6281L20.3039 18.5295ZM10.0076 20.6393L10.4591 19.8949L14.6208 21.0893L14.7706 20.4835C14.7706 20.4835 18.1343 19.3085 18.834 19.1354C18.6949 18.813 18.4788 18.311 18.4788 18.311L21.1213 14.9073L20.488 14.4615L20.7875 9.98671L19.7369 10.0884L18.008 6.2476L17.1714 7.11747L13.949 4.3456L13.2621 5.35611L9.5069 5.0813L9.67594 5.92303L6.0705 7.96352L6.6846 9.07141L4.97497 12.6049L6.14539 12.9966L6.31229 17.1944H7.11469L10.0076 20.6393Z" fill="white"/>
+<path d="M14.9588 9.84174C14.5758 10.1793 14.2099 10.4995 13.8248 10.8393C13.3176 10.3978 12.772 10.1815 12.1322 10.2702C11.5973 10.3437 11.1415 10.7029 11.0538 11.1379C10.9597 11.6074 11.0966 11.9601 11.5459 12.1938C12.0402 12.4513 12.5687 12.6439 13.0651 12.8949C13.6429 13.187 14.0772 13.6025 14.2891 14.2603C14.5908 15.1929 14.2142 16.4934 13.0544 17.1274C11.6337 17.9063 9.57312 17.7765 8.3171 16.7292C8.22937 16.6556 8.16304 16.5583 8.04108 16.422C8.44121 16.0779 8.82208 15.7512 9.21578 15.4136C9.42976 15.5521 9.61377 15.6495 9.77211 15.7793C10.3113 16.225 10.9383 16.2164 11.5673 16.1298C12.0702 16.0606 12.4489 15.6711 12.5174 15.2189C12.5944 14.7104 12.3419 14.3598 11.9375 14.1088C11.7599 13.9985 11.5652 13.9141 11.3726 13.834C11.1801 13.7539 10.9746 13.702 10.7821 13.6241C9.96469 13.2931 9.29496 12.8084 9.21151 11.8346C9.12164 10.809 9.50679 9.96724 10.3777 9.43494C11.6914 8.63216 13.0566 8.60403 14.4196 9.34406C14.5416 9.40897 14.6485 9.50418 14.7534 9.59723C14.8176 9.65781 14.8689 9.73571 14.9588 9.84174Z" fill="white"/>
+<path d="M16.7369 15.1691C16.7369 15.1691 16.0073 15.1691 15.5922 15.1691C15.7869 13.0442 16.0394 10.9669 16.2555 8.85937C16.8632 8.85937 17.4066 8.85937 17.9758 8.85937C17.9951 9.02382 18.0165 9.24669 18.0165 9.24669L16.7369 15.1691Z" fill="white"/>
+<path d="M15.2669 15.7403C15.8361 15.8507 16.8781 16.0562 16.8781 16.0562L16.6748 18.1076C16.6748 18.1076 15.6135 17.8436 15.0273 17.6964C15.1064 17.0451 15.1835 16.4154 15.2669 15.7403Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/wax.svg b/packages/instant/src/assets/icons/wax.svg
new file mode 100644
index 000000000..8bcb73015
--- /dev/null
+++ b/packages/instant/src/assets/icons/wax.svg
@@ -0,0 +1,4 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11.8566 15.9922L13.0585 13.0958L14.0716 15.9922H16.4376L18.2404 11.0395H16.3999L15.1617 14.1781L13.9221 11.0395H11.9321L10.1293 15.9922H11.8566ZM9.61222 15.5L10.5002 13.0958L9.61222 11.0395H7.76192L9.61222 15.5Z" fill="white"/>
+<path d="M23.3998 11.4139C23.0267 10.378 22.3098 9.45197 21.973 8.43159C21.5691 7.21137 21.263 5.85744 20.2554 4.97781C19.4113 4.24173 18.4317 3.68721 17.3472 3.40854C16.4766 3.18617 15.5277 3.24247 14.7087 2.83432C12.3009 1.6352 10.3248 3.45499 8.1377 4.31773C6.57948 4.93136 4.74736 5.30996 3.89908 6.97915C3.34567 8.06989 3.50778 9.03678 3.27579 10.2035C3.03822 11.3928 2.31012 12.4765 2.45686 13.7319C2.64133 15.3195 3.7174 16.6143 3.83759 18.2708C3.96755 20.0878 5.40698 19.9301 6.53197 20.8337C7.05044 21.2503 7.32156 21.9343 7.87776 22.296C8.25509 22.5395 8.70229 22.4945 9.11036 22.6394C9.50026 22.7773 9.82727 23.0659 10.1976 23.2474C11.8299 24.0482 13.4775 23.0602 15.1629 23.1405C16.812 23.2179 17.9831 22.1327 19.2492 21.0068C20.0807 20.2679 21.0786 19.9681 21.8891 19.2081C22.7807 18.3721 22.7835 17.2561 22.8688 16.0992C22.8953 15.7347 22.954 15.3687 23.0197 15.0028C23.2517 13.7375 23.8484 12.6651 23.3998 11.4139ZM12.9996 21.2024C8.50943 21.2024 4.85497 17.5221 4.85497 13.0001C4.85497 8.47663 8.50943 4.79766 12.9996 4.79766C17.4898 4.79766 21.1442 8.47663 21.1442 13.0001C21.1442 17.5221 17.4898 21.2024 12.9996 21.2024Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/zil.svg b/packages/instant/src/assets/icons/zil.svg
new file mode 100644
index 000000000..1a9218201
--- /dev/null
+++ b/packages/instant/src/assets/icons/zil.svg
@@ -0,0 +1,3 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M15.6598 10.9663L8 6.74312V5H11.0169L19 9.41624V12.4183L11.0169 16.0592L16.548 18.0682V14.7788L19 13.517V19.1048C19 20.5231 17.5402 21.4375 16.3161 20.7859L8 17.3024V14.4787L15.6598 10.9663Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/icons/zrx.svg b/packages/instant/src/assets/icons/zrx.svg
new file mode 100644
index 000000000..07518f551
--- /dev/null
+++ b/packages/instant/src/assets/icons/zrx.svg
@@ -0,0 +1,3 @@
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M22.6726 18.5002L22.6787 18.5063L22.625 18.5868C22.641 18.558 22.6569 18.5291 22.6726 18.5002V18.5002H22.6726ZM22.7893 18.5002L21.3866 17.0053L17.9692 12.9131L19.6779 11.0919L17.1249 7.89955L18.8337 6.07835L20.0599 4.74999C20.663 5.26419 21.2058 5.83552 21.6882 6.46394C22.1707 7.09242 22.5828 7.77444 22.9245 8.5101C23.2663 9.2457 23.5309 10.0206 23.7186 10.8347C23.9062 11.6489 24 12.4916 24 13.3628C24 14.3055 23.8928 15.216 23.6784 16.0945C23.4703 16.9468 23.174 17.7487 22.7893 18.5L22.7893 18.5002ZM6.74427 15.3604L8.87512 18.1019L7.20654 19.8795L5.94009 21.2502L5.91999 21.2288C5.3169 20.7291 4.77415 20.1651 4.29169 19.5368C3.80923 18.9086 3.39714 18.2268 3.05539 17.4915C2.71365 16.7562 2.45567 15.9816 2.28144 15.1677C2.09382 14.3539 2 13.5114 2 12.6405C2 11.6981 2.10721 10.7913 2.32164 9.92041C2.53608 9.04943 2.83091 8.24276 3.20615 7.50025L4.61334 8.99943L8.45293 13.54L6.7442 15.3605L6.74427 15.3604ZM7.89849 8.87512L6.12088 7.20654L4.75015 5.94009L4.77157 5.91999C5.27132 5.3169 5.83531 4.77415 6.46352 4.29169C7.09178 3.80923 7.77357 3.39714 8.50886 3.05539C9.2442 2.71365 10.0188 2.45567 10.8326 2.28144C11.6465 2.09382 12.489 2 13.3599 2C14.3023 2 15.209 2.10721 16.08 2.32164C16.9509 2.53608 17.7576 2.83091 18.5001 3.20615L17.0866 4.55302L12.9101 8.0307L11.0896 6.32197L7.89835 8.87496L7.89849 8.87512ZM18.1019 17.1252L19.8795 18.7938L21.2503 20.0602L21.2288 20.0803C20.7291 20.6834 20.1651 21.2262 19.5369 21.7086C18.9086 22.1911 18.2268 22.6032 17.4916 22.9449C16.7562 23.2867 15.9817 23.5447 15.1678 23.7189C14.3539 23.9065 13.5114 24.0003 12.6405 24.0003C11.6981 24.0003 10.7914 23.8931 9.92046 23.6787C9.04952 23.4643 8.2428 23.1694 7.50029 22.7942L8.91381 21.4473L13.54 17.5474L15.3606 19.6782L18.1021 17.1252L18.1019 17.1252Z" fill="white"/>
+</svg>
diff --git a/packages/instant/src/assets/powered_by_0x.svg b/packages/instant/src/assets/powered_by_0x.svg
new file mode 100644
index 000000000..e3d007d0b
--- /dev/null
+++ b/packages/instant/src/assets/powered_by_0x.svg
@@ -0,0 +1,17 @@
+<svg width="108" height="18" viewBox="0 0 108 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M1.17959 10.0032V13.5455H0V4.49716H3.29917C4.27807 4.49716 5.04398 4.74988 5.59692 5.25533C6.15395 5.76077 6.43246 6.42986 6.43246 7.26261C6.43246 8.14092 6.16009 8.8183 5.61535 9.29474C5.0747 9.76705 4.29855 10.0032 3.28688 10.0032H1.17959ZM1.17959 9.02752H3.29917C3.92992 9.02752 4.41323 8.87837 4.74909 8.58008C5.08494 8.27764 5.25287 7.84263 5.25287 7.27504C5.25287 6.73645 5.08494 6.30558 4.74909 5.98242C4.41323 5.65927 3.95245 5.49148 3.36675 5.47905H1.17959V9.02752Z" fill="#777777"/>
+<path d="M7.37245 10.1213C7.37245 9.46254 7.49942 8.87009 7.75336 8.34393C8.01139 7.81777 8.36773 7.41175 8.82236 7.12589C9.28109 6.84002 9.80331 6.69709 10.389 6.69709C11.2942 6.69709 12.0253 7.01403 12.5823 7.6479C13.1434 8.28178 13.424 9.12488 13.424 10.1772V10.258C13.424 10.9126 13.2991 11.5009 13.0492 12.0229C12.8035 12.5408 12.4492 12.9447 11.9864 13.2347C11.5276 13.5247 10.9993 13.6697 10.4013 13.6697C9.50022 13.6697 8.76912 13.3528 8.20799 12.7189C7.65096 12.085 7.37245 11.2461 7.37245 10.2021V10.1213ZM8.51518 10.258C8.51518 11.0037 8.68515 11.6024 9.02511 12.054C9.36915 12.5056 9.82788 12.7314 10.4013 12.7314C10.9788 12.7314 11.4375 12.5035 11.7775 12.0478C12.1174 11.5879 12.2874 10.9457 12.2874 10.1213C12.2874 9.38382 12.1133 8.78723 11.7652 8.3315C11.4212 7.87163 10.9624 7.64169 10.389 7.64169C9.82788 7.64169 9.3753 7.86748 9.03125 8.31907C8.6872 8.77066 8.51518 9.41696 8.51518 10.258Z" fill="#777777"/>
+<path d="M20.735 11.9608L22.0129 6.82138H23.1495L21.2142 13.5455H20.2927L18.6769 8.44957L17.1041 13.5455H16.1825L14.2534 6.82138H15.3838L16.6925 11.8551L18.2407 6.82138H19.1561L20.735 11.9608Z" fill="#777777"/>
+<path d="M27.0692 13.6697C26.1681 13.6697 25.4349 13.3714 24.8697 12.7749C24.3045 12.1741 24.0219 11.3725 24.0219 10.3699V10.1586C24.0219 9.49154 24.1468 8.89702 24.3967 8.375C24.6506 7.84884 25.0028 7.43868 25.4534 7.14453C25.908 6.84624 26.3995 6.69709 26.9279 6.69709C27.7921 6.69709 28.4638 6.98503 28.943 7.5609C29.4222 8.13678 29.6618 8.96123 29.6618 10.0343V10.5128H25.1585C25.1749 11.1757 25.3653 11.7122 25.7298 12.1223C26.0985 12.5283 26.5654 12.7314 27.1306 12.7314C27.532 12.7314 27.872 12.6485 28.1505 12.4828C28.429 12.3171 28.6727 12.0975 28.8816 11.824L29.5758 12.3709C29.0188 13.2368 28.1832 13.6697 27.0692 13.6697ZM26.9279 7.64169C26.4691 7.64169 26.0841 7.81155 25.7729 8.15128C25.4616 8.48686 25.2691 8.95916 25.1953 9.56818H28.5252V9.48118C28.4925 8.89702 28.3368 8.44543 28.0583 8.12642C27.7798 7.80327 27.403 7.64169 26.9279 7.64169Z" fill="#777777"/>
+<path d="M34.1959 7.85298C34.0238 7.82398 33.8375 7.80948 33.6368 7.80948C32.8914 7.80948 32.3855 8.13056 32.1193 8.77273V13.5455H30.9827V6.82138H32.0886L32.107 7.59819C32.4797 6.99746 33.0081 6.69709 33.6921 6.69709C33.9133 6.69709 34.0812 6.72609 34.1959 6.78409V7.85298Z" fill="#777777"/>
+<path d="M37.8821 13.6697C36.981 13.6697 36.2479 13.3714 35.6826 12.7749C35.1174 12.1741 34.8348 11.3725 34.8348 10.3699V10.1586C34.8348 9.49154 34.9597 8.89702 35.2096 8.375C35.4635 7.84884 35.8158 7.43868 36.2663 7.14453C36.7209 6.84624 37.2124 6.69709 37.7408 6.69709C38.605 6.69709 39.2767 6.98503 39.7559 7.5609C40.2351 8.13678 40.4747 8.96123 40.4747 10.0343V10.5128H35.9714C35.9878 11.1757 36.1782 11.7122 36.5428 12.1223C36.9114 12.5283 37.3783 12.7314 37.9435 12.7314C38.3449 12.7314 38.6849 12.6485 38.9634 12.4828C39.2419 12.3171 39.4856 12.0975 39.6945 11.824L40.3887 12.3709C39.8317 13.2368 38.9962 13.6697 37.8821 13.6697ZM37.7408 7.64169C37.2821 7.64169 36.8971 7.81155 36.5858 8.15128C36.2745 8.48686 36.082 8.95916 36.0083 9.56818H39.3382V9.48118C39.3054 8.89702 39.1497 8.44543 38.8712 8.12642C38.5927 7.80327 38.2159 7.64169 37.7408 7.64169Z" fill="#777777"/>
+<path d="M41.5192 10.1275C41.5192 9.09588 41.7608 8.26728 42.2441 7.64169C42.7274 7.01196 43.3602 6.69709 44.1425 6.69709C44.9207 6.69709 45.5372 6.96638 45.9918 7.50497V4H47.1284V13.5455H46.0839L46.0287 12.8246C45.574 13.388 44.9412 13.6697 44.1302 13.6697C43.3602 13.6697 42.7315 13.3507 42.2441 12.7127C41.7608 12.0747 41.5192 11.242 41.5192 10.2145V10.1275ZM42.6558 10.258C42.6558 11.0203 42.8114 11.6169 43.1227 12.0478C43.434 12.4786 43.864 12.6941 44.4129 12.6941C45.1337 12.6941 45.66 12.3668 45.9918 11.7122V8.62358C45.6518 7.9897 45.1296 7.67276 44.4251 7.67276C43.8681 7.67276 43.434 7.89027 43.1227 8.32528C42.8114 8.7603 42.6558 9.40453 42.6558 10.258Z" fill="#777777"/>
+<path d="M57.6464 10.258C57.6464 11.2855 57.4129 12.112 56.946 12.7376C56.4791 13.359 55.8524 13.6697 55.066 13.6697C54.2264 13.6697 53.5772 13.3694 53.1185 12.7686L53.0632 13.5455H52.0188V4H53.1553V7.5609C53.6141 6.98503 54.2469 6.69709 55.0538 6.69709C55.8606 6.69709 56.4934 7.00574 56.9522 7.62305C57.415 8.24035 57.6464 9.08552 57.6464 10.1586V10.258ZM56.5098 10.1275C56.5098 9.34446 56.3603 8.73958 56.0613 8.31285C55.7623 7.88613 55.3323 7.67276 54.7711 7.67276C54.0216 7.67276 53.483 8.02492 53.1553 8.72923V11.6376C53.5035 12.3419 54.0462 12.6941 54.7834 12.6941C55.3282 12.6941 55.7521 12.4807 56.0552 12.054C56.3583 11.6272 56.5098 10.9851 56.5098 10.1275Z" fill="#777777"/>
+<path d="M61.1852 11.8613L62.7334 6.82138H63.9498L61.2773 14.5833C60.8637 15.7019 60.2063 16.2612 59.3052 16.2612L59.0902 16.2425L58.6663 16.1618V15.2296L58.9734 15.2544C59.3584 15.2544 59.6574 15.1757 59.8704 15.0183C60.0875 14.8609 60.2657 14.5729 60.4049 14.1545L60.6568 13.4709L58.2853 6.82138H59.5264L61.1852 11.8613Z" fill="#777777"/>
+<path d="M72.7808 11.3763L74.178 9.93067L72.441 7.58664L70.2293 4.45722C69.448 5.79067 69 7.34287 69 9C69 11.7452 70.2293 14.203 72.1682 15.8537L74.9755 13.8697C74.0206 13.2748 73.2514 12.4087 72.7808 11.3763Z" fill="#777777"/>
+<path d="M75.6237 3.78081L77.0693 5.17803L79.4134 3.44099L82.5428 1.22933C81.2093 0.447982 79.6571 0 78 0C75.2548 0 72.797 1.22933 71.1463 3.16816L73.1303 5.97552C73.7252 5.02063 74.5913 4.25139 75.6237 3.78081Z" fill="#777777"/>
+<path d="M81.822 8.06933L83.559 10.4134L85.7707 13.5428C86.552 12.2093 87 10.6571 87 9C87 6.2548 85.7707 3.79695 83.8318 2.14628L81.0245 4.13031C81.9794 4.7252 82.7486 5.5913 83.2192 6.62368L81.822 8.06933Z" fill="#777777"/>
+<path d="M84.8537 14.8318L82.8697 12.0245C82.2748 12.9794 81.4087 13.7486 80.3763 14.2192L78.9307 12.822L76.5866 14.559L73.4572 16.7707C74.7907 17.552 76.3429 18 78 18C80.7452 18 83.203 16.7707 84.8537 14.8318Z" fill="#777777"/>
+<path d="M95.7487 3.89648C93.6141 3.89648 92.2419 5.54671 92.2419 8.8651C92.2419 12.1566 93.6231 13.8247 95.7487 13.8247C97.8742 13.8247 99.2733 12.1566 99.2733 8.8651C99.2733 5.57361 97.8742 3.89648 95.7487 3.89648ZM93.4348 8.87406C93.4348 6.41666 94.1971 4.97272 95.7397 4.97272C96.2061 4.97272 96.6097 5.10725 96.9594 5.38527L93.928 11.5826C93.6052 10.9279 93.4348 10.031 93.4348 8.87406ZM95.7487 12.7664C95.2823 12.7664 94.8877 12.6319 94.5469 12.3718L97.5783 6.18348C97.9101 6.85613 98.0715 7.74402 98.0715 8.87406C98.0715 11.3135 97.2913 12.7664 95.7487 12.7664Z" fill="#777777"/>
+<path d="M104.96 10.085L106.915 6.7666H105.704L104.09 9.50203H103.596L102.018 6.7666H100.78L102.708 10.1298L100.565 13.6545H101.838L103.587 10.7666H104.072L105.785 13.6545H107.094L104.96 10.085Z" fill="#777777"/>
+</svg>
diff --git a/packages/instant/src/components/erc20_asset_amount_input.tsx b/packages/instant/src/components/erc20_asset_amount_input.tsx
index 520ac33d5..b825255c4 100644
--- a/packages/instant/src/components/erc20_asset_amount_input.tsx
+++ b/packages/instant/src/components/erc20_asset_amount_input.tsx
@@ -22,7 +22,8 @@ export interface ERC20AssetAmountInputProps {
onSelectAssetClick?: (asset?: ERC20Asset) => void;
startingFontSizePx: number;
fontColor?: ColorOption;
- isDisabled: boolean;
+ isInputDisabled: boolean;
+ canSelectOtherAsset: boolean;
numberOfAssetsAvailable?: number;
}
@@ -50,14 +51,15 @@ export class ERC20AssetAmountInput extends React.Component<ERC20AssetAmountInput
);
}
private readonly _renderContentForAsset = (asset: ERC20Asset): React.ReactNode => {
- const { onChange, ...rest } = this.props;
- const amountBorderBottom = this.props.isDisabled ? '' : `1px solid ${transparentWhite}`;
+ const { onChange, isInputDisabled, ...rest } = this.props;
+ const amountBorderBottom = isInputDisabled ? '' : `1px solid ${transparentWhite}`;
const onSymbolClick = this._generateSelectAssetClickHandler();
return (
<React.Fragment>
<Container borderBottom={amountBorderBottom} display="inline-block">
<ScalingAmountInput
{...rest}
+ isDisabled={isInputDisabled}
textLengthThreshold={this._textLengthThresholdForAsset(asset)}
maxFontSizePx={this.props.startingFontSizePx}
onAmountChange={this._handleChange}
@@ -74,11 +76,11 @@ export class ERC20AssetAmountInput extends React.Component<ERC20AssetAmountInput
fontSize={`${this.state.currentFontSizePx}px`}
fontColor={ColorOption.white}
textTransform="uppercase"
- onClick={onSymbolClick}
+ onClick={this.props.canSelectOtherAsset ? onSymbolClick : undefined}
>
{assetUtils.formattedSymbolForAsset(asset)}
</Text>
- {this._renderChevronIcon()}
+ {this.props.canSelectOtherAsset && this._renderChevronIcon()}
</Flex>
</Container>
</React.Fragment>
diff --git a/packages/instant/src/components/erc20_token_selector.tsx b/packages/instant/src/components/erc20_token_selector.tsx
index e4d8749a9..1b1921acb 100644
--- a/packages/instant/src/components/erc20_token_selector.tsx
+++ b/packages/instant/src/components/erc20_token_selector.tsx
@@ -78,6 +78,7 @@ interface TokenSelectorRowProps {
class TokenSelectorRow extends React.Component<TokenSelectorRowProps> {
public render(): React.ReactNode {
const { token } = this.props;
+ const circleColor = token.metaData.primaryColor || 'black';
const displaySymbol = assetUtils.bestNameForAsset(token);
return (
<Container
@@ -93,11 +94,9 @@ class TokenSelectorRow extends React.Component<TokenSelectorRowProps> {
<Container marginLeft="5px">
<Flex justify="flex-start">
<Container marginRight="10px">
- <Circle diameter={30} rawColor={token.metaData.primaryColor}>
- <Flex height="100%">
- <Text fontColor={ColorOption.white} fontSize="8px">
- {displaySymbol}
- </Text>
+ <Circle diameter={26} rawColor={circleColor}>
+ <Flex height="100%" width="100%">
+ <TokenSelectorRowIcon token={token} />
</Flex>
</Circle>
</Container>
@@ -117,3 +116,25 @@ class TokenSelectorRow extends React.Component<TokenSelectorRowProps> {
this.props.onClick(this.props.token);
};
}
+
+interface TokenSelectorRowIconProps {
+ token: ERC20Asset;
+}
+
+const TokenSelectorRowIcon: React.StatelessComponent<TokenSelectorRowIconProps> = props => {
+ const { token } = props;
+ const iconUrlIfExists = token.metaData.iconUrl;
+ const TokenIcon = require(`../assets/icons/${token.metaData.symbol}.svg`);
+ const displaySymbol = assetUtils.bestNameForAsset(token);
+ if (!_.isUndefined(iconUrlIfExists)) {
+ return <img src={iconUrlIfExists} />;
+ } else if (!_.isUndefined(TokenIcon)) {
+ return <TokenIcon />;
+ } else {
+ return (
+ <Text fontColor={ColorOption.white} fontSize="8px">
+ {displaySymbol}
+ </Text>
+ );
+ }
+};
diff --git a/packages/instant/src/components/zero_ex_instant_container.tsx b/packages/instant/src/components/zero_ex_instant_container.tsx
index 698bfef17..47c938472 100644
--- a/packages/instant/src/components/zero_ex_instant_container.tsx
+++ b/packages/instant/src/components/zero_ex_instant_container.tsx
@@ -1,5 +1,7 @@
import * as React from 'react';
+import PoweredByLogo from '../assets/powered_by_0x.svg';
+import { ZERO_EX_SITE_URL } from '../constants';
import { AvailableERC20TokenSelector } from '../containers/available_erc20_token_selector';
import { ConnectedBuyOrderProgressOrPaymentMethod } from '../containers/connected_buy_order_progress_or_payment_method';
import { CurrentStandardSlidingPanel } from '../containers/current_standard_sliding_panel';
@@ -64,6 +66,17 @@ export class ZeroExInstantContainer extends React.Component<{}, ZeroExInstantCon
</SlidingPanel>
<CurrentStandardSlidingPanel />
</Container>
+ <Container
+ display={{ sm: 'none', default: 'block' }}
+ marginTop="10px"
+ marginLeft="auto"
+ marginRight="auto"
+ width="140px"
+ >
+ <a href={ZERO_EX_SITE_URL} target="_blank">
+ <PoweredByLogo />
+ </a>
+ </Container>
</Container>
</React.Fragment>
);
diff --git a/packages/instant/src/components/zero_ex_instant_provider.tsx b/packages/instant/src/components/zero_ex_instant_provider.tsx
index 8be53ee20..9435d8c7c 100644
--- a/packages/instant/src/components/zero_ex_instant_provider.tsx
+++ b/packages/instant/src/components/zero_ex_instant_provider.tsx
@@ -12,6 +12,7 @@ import { DEFAULT_STATE, DefaultState, State } from '../redux/reducer';
import { store, Store } from '../redux/store';
import { fonts } from '../style/fonts';
import { AccountState, AffiliateInfo, AssetMetaData, Network, OrderSource } from '../types';
+import { analytics, disableAnalytics } from '../util/analytics';
import { assetUtils } from '../util/asset';
import { errorFlasher } from '../util/error_flasher';
import { gasPriceEstimator } from '../util/gas_price_estimator';
@@ -36,6 +37,7 @@ export interface ZeroExInstantProviderOptionalProps {
additionalAssetMetaDataMap: ObjectMap<AssetMetaData>;
networkId: Network;
affiliateInfo: AffiliateInfo;
+ shouldDisableAnalyticsTracking: boolean;
}
export class ZeroExInstantProvider extends React.Component<ZeroExInstantProviderProps> {
@@ -121,6 +123,18 @@ export class ZeroExInstantProvider extends React.Component<ZeroExInstantProvider
gasPriceEstimator.getGasInfoAsync();
// tslint:disable-next-line:no-floating-promises
this._flashErrorIfWrongNetwork();
+
+ // Analytics
+ disableAnalytics(this.props.shouldDisableAnalyticsTracking || false);
+ analytics.addEventProperties({
+ embeddedHost: window.location.host,
+ embeddedUrl: window.location.href,
+ networkId: state.network,
+ providerName: state.providerState.name,
+ gitSha: process.env.GIT_SHA,
+ npmVersion: process.env.NPM_PACKAGE_VERSION,
+ });
+ analytics.trackInstantOpened();
}
public componentWillUnmount(): void {
if (this._accountUpdateHeartbeat) {
diff --git a/packages/instant/src/constants.ts b/packages/instant/src/constants.ts
index 5bd2349b3..be6077ca9 100644
--- a/packages/instant/src/constants.ts
+++ b/packages/instant/src/constants.ts
@@ -16,6 +16,7 @@ export const BUY_QUOTE_UPDATE_INTERVAL_TIME_MS = ONE_SECOND_MS * 15;
export const DEFAULT_GAS_PRICE = GWEI_IN_WEI.mul(6);
export const DEFAULT_ESTIMATED_TRANSACTION_TIME_MS = ONE_MINUTE_MS * 2;
export const ETH_GAS_STATION_API_BASE_URL = 'https://ethgasstation.info';
+export const HEAP_ANALYTICS_ID = process.env.HEAP_ANALYTICS_ID;
export const COINBASE_API_BASE_URL = 'https://api.coinbase.com/v2';
export const PROGRESS_STALL_AT_WIDTH = '95%';
export const PROGRESS_FINISH_ANIMATION_TIME_MS = 200;
@@ -31,6 +32,7 @@ export const ETHEREUM_NODE_URL_BY_NETWORK = {
[Network.Mainnet]: 'https://mainnet.infura.io/',
[Network.Kovan]: 'https://kovan.infura.io/',
};
+export const ZERO_EX_SITE_URL = 'https://www.0xproject.com/';
export const BLOCK_POLLING_INTERVAL_MS = 10000; // 10s
export const NO_ACCOUNT: AccountNotReady = {
state: AccountState.None,
@@ -47,4 +49,5 @@ export const PROVIDER_TYPE_TO_NAME: { [key in ProviderType]: string } = {
[ProviderType.Mist]: 'Mist',
[ProviderType.CoinbaseWallet]: 'Coinbase Wallet',
[ProviderType.Parity]: 'Parity',
+ [ProviderType.Fallback]: 'Fallback',
};
diff --git a/packages/instant/src/containers/selected_erc20_asset_amount_input.ts b/packages/instant/src/containers/selected_erc20_asset_amount_input.ts
index 2c2661e1a..a39bc46a2 100644
--- a/packages/instant/src/containers/selected_erc20_asset_amount_input.ts
+++ b/packages/instant/src/containers/selected_erc20_asset_amount_input.ts
@@ -23,9 +23,10 @@ interface ConnectedState {
assetBuyer: AssetBuyer;
value?: BigNumber;
asset?: ERC20Asset;
- isDisabled: boolean;
+ isInputDisabled: boolean;
numberOfAssetsAvailable?: number;
affiliateInfo?: AffiliateInfo;
+ canSelectOtherAsset: boolean;
}
interface ConnectedDispatch {
@@ -43,21 +44,27 @@ type FinalProps = ConnectedProps & SelectedERC20AssetAmountInputProps;
const mapStateToProps = (state: State, _ownProps: SelectedERC20AssetAmountInputProps): ConnectedState => {
const processState = state.buyOrderState.processState;
- const isEnabled = processState === OrderProcessState.None || processState === OrderProcessState.Failure;
- const isDisabled = !isEnabled;
+ const isInputEnabled = processState === OrderProcessState.None || processState === OrderProcessState.Failure;
+ const isInputDisabled = !isInputEnabled;
const selectedAsset =
!_.isUndefined(state.selectedAsset) && state.selectedAsset.metaData.assetProxyId === AssetProxyId.ERC20
? (state.selectedAsset as ERC20Asset)
: undefined;
const numberOfAssetsAvailable = _.isUndefined(state.availableAssets) ? undefined : state.availableAssets.length;
+ const canSelectOtherAsset =
+ numberOfAssetsAvailable && numberOfAssetsAvailable > 1
+ ? isInputEnabled || processState === OrderProcessState.Success
+ : false;
+
const assetBuyer = state.providerState.assetBuyer;
return {
assetBuyer,
value: state.selectedAssetUnitAmount,
asset: selectedAsset,
- isDisabled,
+ isInputDisabled,
numberOfAssetsAvailable,
affiliateInfo: state.affiliateInfo,
+ canSelectOtherAsset,
};
};
@@ -102,8 +109,9 @@ const mergeProps = (
onChange: (value, asset) => {
connectedDispatch.updateBuyQuote(connectedState.assetBuyer, value, asset, connectedState.affiliateInfo);
},
- isDisabled: connectedState.isDisabled,
+ isInputDisabled: connectedState.isInputDisabled,
numberOfAssetsAvailable: connectedState.numberOfAssetsAvailable,
+ canSelectOtherAsset: connectedState.canSelectOtherAsset,
};
};
diff --git a/packages/instant/src/data/asset_meta_data_map.ts b/packages/instant/src/data/asset_meta_data_map.ts
index 6ecb9af85..b24c9c83d 100644
--- a/packages/instant/src/data/asset_meta_data_map.ts
+++ b/packages/instant/src/data/asset_meta_data_map.ts
@@ -2,8 +2,6 @@ import { AssetProxyId, ObjectMap } from '@0x/types';
import { AssetMetaData } from '../types';
-// Map from assetData string to AssetMetaData object
-// TODO: import this from somewhere else.
export const assetMetaDataMap: ObjectMap<AssetMetaData> = {
'0xf47261b0000000000000000000000000e41d2489571d322189246dafa5ebde1f4699f498': {
assetProxyId: AssetProxyId.ERC20,
@@ -85,7 +83,7 @@ export const assetMetaDataMap: ObjectMap<AssetMetaData> = {
'0xf47261b0000000000000000000000000e0b7927c4af23765cb51314a0e0521a9645f0e2a': {
assetProxyId: AssetProxyId.ERC20,
decimals: 9,
- primaryColor: '#BC9952',
+ primaryColor: '#DEB564',
symbol: 'dgd',
name: 'DigixDao',
},
diff --git a/packages/instant/src/globals.d.ts b/packages/instant/src/globals.d.ts
index 94e63a32d..1b5fa443d 100644
--- a/packages/instant/src/globals.d.ts
+++ b/packages/instant/src/globals.d.ts
@@ -1,3 +1,9 @@
+declare module '*.svg' {
+ const content: any;
+ /* tslint:disable */
+ export default content;
+ /* tslint:enable */
+}
declare module '*.json' {
const json: any;
/* tslint:disable */
diff --git a/packages/instant/src/index.umd.ts b/packages/instant/src/index.umd.ts
index 0274db30c..5010347b3 100644
--- a/packages/instant/src/index.umd.ts
+++ b/packages/instant/src/index.umd.ts
@@ -35,6 +35,9 @@ export const render = (props: ZeroExInstantOverlayProps, selector: string = DEFA
if (!_.isUndefined(props.provider)) {
assert.isWeb3Provider('props.provider', props.provider);
}
+ if (!_.isUndefined(props.shouldDisableAnalyticsTracking)) {
+ assert.isBoolean('props.shouldDisableAnalyticsTracking', props.shouldDisableAnalyticsTracking);
+ }
assert.isString('selector', selector);
const appendToIfExists = document.querySelector(selector);
assert.assert(!_.isNull(appendToIfExists), `Could not find div with selector: ${selector}`);
diff --git a/packages/instant/src/redux/analytics_middleware.ts b/packages/instant/src/redux/analytics_middleware.ts
new file mode 100644
index 000000000..f971dbd33
--- /dev/null
+++ b/packages/instant/src/redux/analytics_middleware.ts
@@ -0,0 +1,59 @@
+import { Web3Wrapper } from '@0x/web3-wrapper';
+import * as _ from 'lodash';
+import { Middleware } from 'redux';
+
+import { ETH_DECIMALS } from '../constants';
+import { Account, AccountState } from '../types';
+import { analytics } from '../util/analytics';
+
+import { Action, ActionTypes } from './actions';
+
+import { State } from './reducer';
+
+const shouldTriggerWalletReady = (prevAccount: Account, curAccount: Account): boolean => {
+ const didJustTurnReady = curAccount.state === AccountState.Ready && prevAccount.state !== AccountState.Ready;
+ if (didJustTurnReady) {
+ return true;
+ }
+
+ if (curAccount.state === AccountState.Ready && prevAccount.state === AccountState.Ready) {
+ // Account was ready, and is now ready again, but address has changed
+ return curAccount.address !== prevAccount.address;
+ }
+
+ return false;
+};
+
+export const analyticsMiddleware: Middleware = store => next => middlewareAction => {
+ const prevState = store.getState() as State;
+ const prevAccount = prevState.providerState.account;
+
+ const nextAction = next(middlewareAction) as Action;
+
+ const curState = store.getState() as State;
+ const curAccount = curState.providerState.account;
+
+ switch (nextAction.type) {
+ case ActionTypes.SET_ACCOUNT_STATE_READY:
+ if (curAccount.state === AccountState.Ready && shouldTriggerWalletReady(prevAccount, curAccount)) {
+ const ethAddress = curAccount.address;
+ analytics.addUserProperties({ ethAddress });
+ analytics.trackWalletReady();
+ }
+ break;
+ case ActionTypes.UPDATE_ACCOUNT_ETH_BALANCE:
+ if (
+ curAccount.state === AccountState.Ready &&
+ curAccount.ethBalanceInWei &&
+ !_.isEqual(curAccount, prevAccount)
+ ) {
+ const ethBalanceInUnitAmount = Web3Wrapper.toUnitAmount(
+ curAccount.ethBalanceInWei,
+ ETH_DECIMALS,
+ ).toString();
+ analytics.addUserProperties({ ethBalanceInUnitAmount });
+ }
+ }
+
+ return nextAction;
+};
diff --git a/packages/instant/src/redux/store.ts b/packages/instant/src/redux/store.ts
index 20710765d..11bba3876 100644
--- a/packages/instant/src/redux/store.ts
+++ b/packages/instant/src/redux/store.ts
@@ -1,7 +1,8 @@
import * as _ from 'lodash';
-import { createStore, Store as ReduxStore } from 'redux';
-import { devToolsEnhancer } from 'redux-devtools-extension/developmentOnly';
+import { applyMiddleware, createStore, Store as ReduxStore } from 'redux';
+import { composeWithDevTools } from 'redux-devtools-extension/developmentOnly';
+import { analyticsMiddleware } from './analytics_middleware';
import { createReducer, State } from './reducer';
export type Store = ReduxStore<State>;
@@ -9,6 +10,6 @@ export type Store = ReduxStore<State>;
export const store = {
create: (initialState: State): Store => {
const reducer = createReducer(initialState);
- return createStore(reducer, initialState, devToolsEnhancer({}));
+ return createStore(reducer, initialState, composeWithDevTools(applyMiddleware(analyticsMiddleware)));
},
};
diff --git a/packages/instant/src/types.ts b/packages/instant/src/types.ts
index 67f21a396..999d50fed 100644
--- a/packages/instant/src/types.ts
+++ b/packages/instant/src/types.ts
@@ -51,6 +51,7 @@ export interface ERC20AssetMetaData {
primaryColor?: string;
symbol: string;
name: string;
+ iconUrl?: string;
}
export interface ERC721AssetMetaData {
@@ -164,4 +165,5 @@ export enum ProviderType {
Mist = 'MIST',
CoinbaseWallet = 'COINBASE_WALLET',
Cipher = 'CIPHER',
+ Fallback = 'FALLBACK',
}
diff --git a/packages/instant/src/util/analytics.ts b/packages/instant/src/util/analytics.ts
new file mode 100644
index 000000000..2ffaac1dd
--- /dev/null
+++ b/packages/instant/src/util/analytics.ts
@@ -0,0 +1,64 @@
+import { ObjectMap } from '@0x/types';
+
+import { heapUtil } from './heap';
+
+let isDisabled = false;
+export const disableAnalytics = (shouldDisableAnalytics: boolean) => {
+ isDisabled = shouldDisableAnalytics;
+};
+export const evaluateIfEnabled = (fnCall: () => void) => {
+ if (isDisabled) {
+ return;
+ }
+ fnCall();
+};
+
+enum EventNames {
+ INSTANT_OPENED = 'Instant - Opened',
+ WALLET_READY = 'Wallet - Ready',
+}
+const track = (eventName: EventNames, eventData: ObjectMap<string | number> = {}): void => {
+ evaluateIfEnabled(() => {
+ heapUtil.evaluateHeapCall(heap => heap.track(eventName, eventData));
+ });
+};
+function trackingEventFnWithoutPayload(eventName: EventNames): () => void {
+ return () => {
+ track(eventName);
+ };
+}
+// tslint:disable-next-line:no-unused-variable
+function trackingEventFnWithPayload<T extends ObjectMap<string | number>>(
+ eventName: EventNames,
+): (eventDataProperties: T) => void {
+ return (eventDataProperties: T) => {
+ track(eventName, eventDataProperties);
+ };
+}
+
+export interface AnalyticsUserOptions {
+ ethAddress?: string;
+ ethBalanceInUnitAmount?: string;
+}
+export interface AnalyticsEventOptions {
+ embeddedHost?: string;
+ embeddedUrl?: string;
+ networkId?: number;
+ providerName?: string;
+ gitSha?: string;
+ npmVersion?: string;
+}
+export const analytics = {
+ addUserProperties: (properties: AnalyticsUserOptions): void => {
+ evaluateIfEnabled(() => {
+ heapUtil.evaluateHeapCall(heap => heap.addUserProperties(properties));
+ });
+ },
+ addEventProperties: (properties: AnalyticsEventOptions): void => {
+ evaluateIfEnabled(() => {
+ heapUtil.evaluateHeapCall(heap => heap.addEventProperties(properties));
+ });
+ },
+ trackWalletReady: trackingEventFnWithoutPayload(EventNames.WALLET_READY),
+ trackInstantOpened: trackingEventFnWithoutPayload(EventNames.INSTANT_OPENED),
+};
diff --git a/packages/instant/src/util/heap.ts b/packages/instant/src/util/heap.ts
new file mode 100644
index 000000000..78ec3b3cc
--- /dev/null
+++ b/packages/instant/src/util/heap.ts
@@ -0,0 +1,113 @@
+import { ObjectMap } from '@0x/types';
+import { logUtils } from '@0x/utils';
+import * as _ from 'lodash';
+
+import { HEAP_ANALYTICS_ID } from '../constants';
+
+import { AnalyticsEventOptions, AnalyticsUserOptions } from './analytics';
+
+export interface HeapAnalytics {
+ loaded: boolean;
+ appid: string;
+ identify(id: string, idType: string): void;
+ track(eventName: string, eventProperties?: ObjectMap<string | number>): void;
+ resetIdentity(): void;
+ addUserProperties(properties: AnalyticsUserOptions): void;
+ addEventProperties(properties: AnalyticsEventOptions): void;
+ removeEventProperty(property: string): void;
+ clearEventProperties(): void;
+}
+interface ModifiedWindow {
+ heap?: HeapAnalytics;
+ zeroExInstantLoadedHeap?: boolean;
+}
+const getWindow = (): ModifiedWindow => {
+ return window as ModifiedWindow;
+};
+
+const setupZeroExInstantHeap = () => {
+ if (_.isUndefined(HEAP_ANALYTICS_ID)) {
+ return;
+ }
+
+ const curWindow = getWindow();
+ // Set property to specify that this is zeroEx's heap
+ curWindow.zeroExInstantLoadedHeap = true;
+
+ // Typescript-compatible version of https://docs.heapanalytics.com/docs/installation
+ /* tslint:disable */
+ ((window as any).heap = (window as any).heap || []),
+ ((window as any).heap.load = function(e: any, t: any) {
+ ((window as any).heap.appid = e), ((window as any).heap.config = t = t || {});
+ var r = t.forceSSL || 'https:' === (document.location as Location).protocol,
+ a = document.createElement('script');
+ (a.type = 'text/javascript'),
+ (a.async = !0),
+ (a.src = (r ? 'https:' : 'http:') + '//cdn.heapanalytics.com/js/heap-' + e + '.js');
+ var n = document.getElementsByTagName('script')[0];
+ (n.parentNode as Node).insertBefore(a, n);
+ for (
+ var o = function(e: any) {
+ return function() {
+ (window as any).heap.push([e].concat(Array.prototype.slice.call(arguments, 0)));
+ };
+ },
+ p = [
+ 'addEventProperties',
+ 'addUserProperties',
+ 'clearEventProperties',
+ 'identify',
+ 'resetIdentity',
+ 'removeEventProperty',
+ 'setEventProperties',
+ 'track',
+ 'unsetEventProperty',
+ ],
+ c = 0;
+ c < p.length;
+ c++
+ )
+ (window as any).heap[p[c]] = o(p[c]);
+ });
+ (window as any).heap.load(HEAP_ANALYTICS_ID);
+ /* tslint:enable */
+
+ return curWindow.heap as HeapAnalytics;
+};
+
+export const heapUtil = {
+ getHeap: (): HeapAnalytics | undefined => {
+ const curWindow = getWindow();
+ const hasOtherExistingHeapIntegration = curWindow.heap && !curWindow.zeroExInstantLoadedHeap;
+ if (hasOtherExistingHeapIntegration) {
+ return undefined;
+ }
+
+ const zeroExInstantHeapIntegration = curWindow.zeroExInstantLoadedHeap && curWindow.heap;
+ if (zeroExInstantHeapIntegration) {
+ return zeroExInstantHeapIntegration;
+ }
+
+ return setupZeroExInstantHeap();
+ },
+ evaluateHeapCall: (heapFunctionCall: (heap: HeapAnalytics) => void): void => {
+ if (_.isUndefined(HEAP_ANALYTICS_ID)) {
+ return;
+ }
+
+ const curHeap = heapUtil.getHeap();
+ if (curHeap) {
+ try {
+ if (curHeap.appid !== HEAP_ANALYTICS_ID) {
+ // Integrator has included heap after us and reset the app id
+ return;
+ }
+ heapFunctionCall(curHeap);
+ } catch (e) {
+ // We never want analytics to crash our React component
+ // TODO(sk): error reporter here
+ logUtils.log('Analytics error', e);
+ }
+ }
+ },
+};
diff --git a/packages/instant/src/util/provider_state_factory.ts b/packages/instant/src/util/provider_state_factory.ts
index 452a71460..7c788dff2 100644
--- a/packages/instant/src/util/provider_state_factory.ts
+++ b/packages/instant/src/util/provider_state_factory.ts
@@ -56,7 +56,7 @@ export const providerStateFactory = {
getInitialProviderStateFallback: (orderSource: OrderSource, network: Network): ProviderState => {
const provider = providerFactory.getFallbackNoSigningProvider(network);
const providerState: ProviderState = {
- name: envUtil.getProviderName(provider),
+ name: 'Fallback',
provider,
web3Wrapper: new Web3Wrapper(provider),
assetBuyer: assetBuyerFactory.getAssetBuyer(provider, orderSource, network),
diff --git a/packages/instant/webpack.config.js b/packages/instant/webpack.config.js
index 3129e13a6..41276809c 100644
--- a/packages/instant/webpack.config.js
+++ b/packages/instant/webpack.config.js
@@ -1,39 +1,81 @@
-const path = require('path');
+const childProcess = require('child_process');
const ip = require('ip');
+const path = require('path');
+const webpack = require('webpack');
+
// The common js bundle (not this one) is built using tsc.
// The umd bundle (this one) has a different entrypoint.
-const config = {
- entry: './src/index.umd.ts',
- output: {
- filename: '[name].bundle.js',
- path: path.resolve(__dirname, 'public'),
- library: 'zeroExInstant',
- libraryTarget: 'umd',
- },
- devtool: 'source-map',
- resolve: {
- extensions: ['.js', '.json', '.ts', '.tsx'],
- },
- module: {
- rules: [
- {
- test: /\.(ts|tsx)$/,
- loader: 'awesome-typescript-loader',
- },
+
+const GIT_SHA = childProcess
+ .execSync('git rev-parse HEAD')
+ .toString()
+ .trim();
+
+const HEAP_PRODUCTION_ENV_VAR_NAME = 'INSTANT_HEAP_ANALYTICS_ID_PRODUCTION';
+const HEAP_DEVELOPMENT_ENV_VAR_NAME = 'INSTANT_HEAP_ANALYTICS_ID_DEVELOPMENT';
+const getHeapAnalyticsId = modeName => {
+ if (modeName === 'production') {
+ return process.env[HEAP_PRODUCTION_ENV_VAR_NAME];
+ }
+
+ if (modeName === 'development') {
+ return process.env[HEAP_DEVELOPMENT_ENV_VAR_NAME];
+ }
+
+ return undefined;
+};
+
+module.exports = (env, argv) => {
+ const outputPath = process.env.WEBPACK_OUTPUT_PATH || 'umd';
+ const config = {
+ entry: {
+ instant: './src/index.umd.ts',
+ },
+ output: {
+ filename: '[name].js',
+ path: path.resolve(__dirname, outputPath),
+ library: 'zeroExInstant',
+ libraryTarget: 'umd',
+ },
+ plugins: [
+ new webpack.DefinePlugin({
+ 'process.env': {
+ GIT_SHA: JSON.stringify(GIT_SHA),
+ HEAP_ANALYTICS_ID: getHeapAnalyticsId(argv.mode),
+ NPM_PACKAGE_VERSION: JSON.stringify(process.env.npm_package_version),
+ },
+ }),
],
- },
- devServer: {
- contentBase: path.join(__dirname, 'public'),
- port: 5000,
- host: '0.0.0.0',
- after: () => {
- if (config.devServer.host === '0.0.0.0') {
- console.log(
- `webpack-dev-server can be accessed externally at: http://${ip.address()}:${config.devServer.port}`,
- );
- }
+ devtool: 'source-map',
+ resolve: {
+ extensions: ['.js', '.json', '.ts', '.tsx'],
},
- },
+ module: {
+ rules: [
+ {
+ test: /\.(ts|tsx)$/,
+ loader: 'awesome-typescript-loader',
+ },
+ {
+ test: /\.svg$/,
+ loader: 'svg-react-loader',
+ },
+ ],
+ },
+ devServer: {
+ contentBase: path.join(__dirname, 'public'),
+ port: 5000,
+ host: '0.0.0.0',
+ after: () => {
+ if (config.devServer.host === '0.0.0.0') {
+ console.log(
+ `webpack-dev-server can be accessed externally at: http://${ip.address()}:${
+ config.devServer.port
+ }`,
+ );
+ }
+ },
+ },
+ };
+ return config;
};
-
-module.exports = config;
diff --git a/packages/monorepo-scripts/src/prepublish_checks.ts b/packages/monorepo-scripts/src/prepublish_checks.ts
index 5f603ebc7..fc550cf3a 100644
--- a/packages/monorepo-scripts/src/prepublish_checks.ts
+++ b/packages/monorepo-scripts/src/prepublish_checks.ts
@@ -17,6 +17,7 @@ async function prepublishChecksAsync(): Promise<void> {
await checkChangelogFormatAsync(updatedPublicPackages);
await checkGitTagsForNextVersionAndDeleteIfExistAsync(updatedPublicPackages);
await checkPublishRequiredSetupAsync();
+ checkRequiredEnvVariables();
}
async function checkGitTagsForNextVersionAndDeleteIfExistAsync(updatedPublicPackages: Package[]): Promise<void> {
@@ -183,6 +184,16 @@ async function checkPublishRequiredSetupAsync(): Promise<void> {
}
}
+const checkRequiredEnvVariables = () => {
+ utils.log('Checking required environment variables...');
+ const requiredEnvVars = ['INSTANT_HEAP_ANALYTICS_ID_PRODUCTION'];
+ requiredEnvVars.forEach(requiredEnvVarName => {
+ if (_.isUndefined(process.env[requiredEnvVarName])) {
+ throw new Error(`Must have ${requiredEnvVarName} set`);
+ }
+ });
+};
+
prepublishChecksAsync().catch(err => {
utils.log(err.message);
process.exit(1);
diff --git a/packages/web3-wrapper/CHANGELOG.json b/packages/web3-wrapper/CHANGELOG.json
index b938f6986..cc65c2a7d 100644
--- a/packages/web3-wrapper/CHANGELOG.json
+++ b/packages/web3-wrapper/CHANGELOG.json
@@ -1,5 +1,18 @@
[
{
+ "version": "3.1.5",
+ "changes": [
+ {
+ "note": "Add unmarshalling of transaction receipts",
+ "pr": 1291
+ },
+ {
+ "note": "Return `undefined` instead of `null` if transaction receipt not found",
+ "pr": 1291
+ }
+ ]
+ },
+ {
"timestamp": 1542208198,
"version": "3.1.4",
"changes": [
diff --git a/packages/web3-wrapper/package.json b/packages/web3-wrapper/package.json
index 2469f7627..8d4d7ec35 100644
--- a/packages/web3-wrapper/package.json
+++ b/packages/web3-wrapper/package.json
@@ -10,6 +10,7 @@
"scripts": {
"build": "tsc -b",
"build:ci": "yarn build",
+ "watch_without_deps": "tsc -w",
"clean": "shx rm -rf lib generated_docs",
"lint": "tslint --format stylish --project .",
"test": "yarn run_mocha",
diff --git a/packages/web3-wrapper/src/index.ts b/packages/web3-wrapper/src/index.ts
index 679563a2b..4d20ba9be 100644
--- a/packages/web3-wrapper/src/index.ts
+++ b/packages/web3-wrapper/src/index.ts
@@ -52,6 +52,9 @@ export {
CallDataRPC,
BlockWithoutTransactionDataRPC,
BlockWithTransactionDataRPC,
+ TransactionReceiptStatusRPC,
+ TransactionReceiptRPC,
+ LogEntryRPC,
TransactionRPC,
TxDataRPC,
} from './types';
diff --git a/packages/web3-wrapper/src/marshaller.ts b/packages/web3-wrapper/src/marshaller.ts
index 299c6a64c..7bd274c85 100644
--- a/packages/web3-wrapper/src/marshaller.ts
+++ b/packages/web3-wrapper/src/marshaller.ts
@@ -9,6 +9,7 @@ import {
LogEntry,
RawLogEntry,
Transaction,
+ TransactionReceipt,
TxData,
} from 'ethereum-types';
import ethUtil = require('ethereumjs-util');
@@ -21,6 +22,7 @@ import {
BlockWithTransactionDataRPC,
CallDataRPC,
CallTxDataBaseRPC,
+ TransactionReceiptRPC,
TransactionRPC,
TxDataRPC,
} from './types';
@@ -92,6 +94,22 @@ export const marshaller = {
return tx;
},
/**
+ * Unmarshall transaction receipt
+ * @param txReceiptRpc transaction receipt to unmarshall
+ * @return unmarshalled transaction receipt
+ */
+ unmarshalTransactionReceipt(txReceiptRpc: TransactionReceiptRPC): TransactionReceipt {
+ const txReceipt = {
+ ...txReceiptRpc,
+ blockNumber: utils.convertHexToNumber(txReceiptRpc.blockNumber),
+ transactionIndex: utils.convertHexToNumber(txReceiptRpc.transactionIndex),
+ cumulativeGasUsed: utils.convertHexToNumber(txReceiptRpc.cumulativeGasUsed),
+ gasUsed: utils.convertHexToNumber(txReceiptRpc.gasUsed),
+ logs: _.map(txReceiptRpc.logs, marshaller.unmarshalLog.bind(marshaller)),
+ };
+ return txReceipt;
+ },
+ /**
* Unmarshall transaction data
* @param txDataRpc transaction data to unmarshall
* @return unmarshalled transaction data
diff --git a/packages/web3-wrapper/src/types.ts b/packages/web3-wrapper/src/types.ts
index e81039186..eb5a35f07 100644
--- a/packages/web3-wrapper/src/types.ts
+++ b/packages/web3-wrapper/src/types.ts
@@ -41,6 +41,33 @@ export interface TransactionRPC {
input: string;
}
+export interface TransactionReceiptRPC {
+ blockHash: string;
+ blockNumber: string;
+ transactionHash: string;
+ transactionIndex: string;
+ from: string;
+ to: string;
+ status: TransactionReceiptStatusRPC;
+ cumulativeGasUsed: string;
+ gasUsed: string;
+ contractAddress: string | null;
+ logs: LogEntryRPC[];
+}
+
+export interface LogEntryRPC {
+ logIndex: string | null;
+ transactionIndex: string | null;
+ transactionHash: string;
+ blockHash: string | null;
+ blockNumber: string | null;
+ address: string;
+ data: string;
+ topics: string[];
+}
+
+export type TransactionReceiptStatusRPC = null | string | 0 | 1;
+
export interface CallTxDataBaseRPC {
to?: string;
value?: string;
diff --git a/packages/web3-wrapper/src/web3_wrapper.ts b/packages/web3-wrapper/src/web3_wrapper.ts
index be1713f20..f1247e48a 100644
--- a/packages/web3-wrapper/src/web3_wrapper.ts
+++ b/packages/web3-wrapper/src/web3_wrapper.ts
@@ -27,6 +27,7 @@ import {
BlockWithoutTransactionDataRPC,
BlockWithTransactionDataRPC,
NodeType,
+ TransactionReceiptRPC,
TransactionRPC,
Web3WrapperErrors,
} from './types';
@@ -212,20 +213,23 @@ export class Web3Wrapper {
return networkId;
}
/**
- * Retrieves the transaction receipt for a given transaction hash
+ * Retrieves the transaction receipt for a given transaction hash if found
* @param txHash Transaction hash
- * @returns The transaction receipt, including it's status (0: failed, 1: succeeded or undefined: not found)
+ * @returns The transaction receipt, including it's status (0: failed, 1: succeeded). Returns undefined if transaction not found.
*/
- public async getTransactionReceiptAsync(txHash: string): Promise<TransactionReceipt> {
+ public async getTransactionReceiptIfExistsAsync(txHash: string): Promise<TransactionReceipt | undefined> {
assert.isHexString('txHash', txHash);
- const transactionReceipt = await this.sendRawPayloadAsync<TransactionReceipt>({
+ const transactionReceiptRpc = await this.sendRawPayloadAsync<TransactionReceiptRPC>({
method: 'eth_getTransactionReceipt',
params: [txHash],
});
- if (!_.isNull(transactionReceipt)) {
- transactionReceipt.status = Web3Wrapper._normalizeTxReceiptStatus(transactionReceipt.status);
+ if (!_.isNull(transactionReceiptRpc)) {
+ transactionReceiptRpc.status = Web3Wrapper._normalizeTxReceiptStatus(transactionReceiptRpc.status);
+ const transactionReceipt = marshaller.unmarshalTransactionReceipt(transactionReceiptRpc);
+ return transactionReceipt;
+ } else {
+ return undefined;
}
- return transactionReceipt;
}
/**
* Retrieves the transaction data for a given transaction
@@ -572,8 +576,8 @@ export class Web3Wrapper {
assert.isNumber('timeoutMs', timeoutMs);
}
// Immediately check if the transaction has already been mined.
- let transactionReceipt = await this.getTransactionReceiptAsync(txHash);
- if (!_.isNull(transactionReceipt) && !_.isNull(transactionReceipt.blockNumber)) {
+ let transactionReceipt = await this.getTransactionReceiptIfExistsAsync(txHash);
+ if (!_.isUndefined(transactionReceipt) && !_.isNull(transactionReceipt.blockNumber)) {
const logsWithDecodedArgs = _.map(
transactionReceipt.logs,
this.abiDecoder.tryToDecodeLogOrNoop.bind(this.abiDecoder),
@@ -600,8 +604,8 @@ export class Web3Wrapper {
return reject(Web3WrapperErrors.TransactionMiningTimeout);
}
- transactionReceipt = await this.getTransactionReceiptAsync(txHash);
- if (!_.isNull(transactionReceipt)) {
+ transactionReceipt = await this.getTransactionReceiptIfExistsAsync(txHash);
+ if (!_.isUndefined(transactionReceipt)) {
intervalUtils.clearAsyncExcludingInterval(intervalId);
const logsWithDecodedArgs = _.map(
transactionReceipt.logs,
diff --git a/packages/web3-wrapper/test/web3_wrapper_test.ts b/packages/web3-wrapper/test/web3_wrapper_test.ts
index 164253777..935c67636 100644
--- a/packages/web3-wrapper/test/web3_wrapper_test.ts
+++ b/packages/web3-wrapper/test/web3_wrapper_test.ts
@@ -1,5 +1,5 @@
import * as chai from 'chai';
-import { BlockParamLiteral, JSONRPCErrorCallback, JSONRPCRequestPayload } from 'ethereum-types';
+import { BlockParamLiteral, JSONRPCErrorCallback, JSONRPCRequestPayload, TransactionReceipt } from 'ethereum-types';
import * as Ganache from 'ganache-core';
import * as _ from 'lodash';
import 'mocha';
@@ -98,6 +98,18 @@ describe('Web3Wrapper tests', () => {
expect(typeof blockNumber).to.be.equal('number');
});
});
+ describe('#getTransactionReceiptAsync/awaitTransactionSuccessAsync', () => {
+ it('get block number', async () => {
+ const payload = { from: addresses[0], to: addresses[1], value: 1 };
+ const txHash = await web3Wrapper.sendTransactionAsync(payload);
+ await web3Wrapper.awaitTransactionSuccessAsync(txHash);
+ const receiptIfExists = await web3Wrapper.getTransactionReceiptIfExistsAsync(txHash);
+ expect(receiptIfExists).to.not.be.undefined();
+ const receipt = receiptIfExists as TransactionReceipt;
+ expect(receipt.transactionIndex).to.be.a('number');
+ expect(receipt.transactionHash).to.be.equal(txHash);
+ });
+ });
describe('#getBlockIfExistsAsync', () => {
it('gets block when supplied a valid BlockParamLiteral value', async () => {
const blockParamLiteral = BlockParamLiteral.Earliest;
diff --git a/packages/website/public/css/basscss_responsive_custom.css b/packages/website/public/css/basscss_responsive_custom.css
index 92a681cb1..041abca6a 100644
--- a/packages/website/public/css/basscss_responsive_custom.css
+++ b/packages/website/public/css/basscss_responsive_custom.css
@@ -26,6 +26,9 @@
.sm-right {
float: right;
}
+ .sm-left {
+ float: left;
+ }
.sm-justify-end {
ms-flex-pack: end;
justify-content: flex-end;
@@ -58,6 +61,9 @@
.md-right {
float: right;
}
+ .md-left {
+ float: left;
+ }
.md-justify-end {
ms-flex-pack: end;
justify-content: flex-end;
@@ -90,6 +96,9 @@
.lg-right {
float: right;
}
+ .lg-left {
+ float: left;
+ }
.lg-justify-end {
ms-flex-pack: end;
justify-content: flex-end;
diff --git a/packages/website/public/images/launch_kit/0x_cupboard.svg b/packages/website/public/images/launch_kit/0x_cupboard.svg
new file mode 100644
index 000000000..4c4e6ba1b
--- /dev/null
+++ b/packages/website/public/images/launch_kit/0x_cupboard.svg
@@ -0,0 +1,53 @@
+<svg width="325" height="356" viewBox="0 0 325 356" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.4" d="M74 108.5L149 85.5" stroke="white" stroke-width="3" stroke-dasharray="7 4"/>
+<path opacity="0.4" d="M32 90L107 67" stroke="white" stroke-width="3" stroke-dasharray="7 4"/>
+<path opacity="0.4" d="M71.5 161.5L122.5 146.5" stroke="white" stroke-width="3" stroke-dasharray="7 4"/>
+<path opacity="0.18" d="M235 352.304L320.3 311.604C321.4 311.104 322 310.004 322 308.804V80.5041C322 79.3041 321.3 78.204 320.2 77.604L160.8 3.30405C160.2 3.00405 159.5 2.90405 158.8 3.10405L58.8996 24.4041C56.5996 24.8041 59.4996 25.6041 61.5996 26.6041L233 107.904C234.3 108.504 235.8 108.604 237.2 108.104L322.1 78.5041" stroke="white" stroke-width="4.1573" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M55 98.6042V83.2042V28.4042C55 26.4042 56.8 25.0042 58.7 25.3042C58.9 25.4042 59.2 25.4042 59.5 25.5042L61.3 26.3042L160.1 73.1042L233 107.704L233.3 107.804C234.4 108.304 235.1 109.404 235.1 110.604V233.504V349.904C235.1 352.304 232.6 353.804 230.5 352.604L56.6 255.904C55.6 255.404 55 254.304 55 253.204V168.004V167.504" stroke="white" stroke-width="4" stroke-miterlimit="10"/>
+<path d="M160 95.8042V73.3042" stroke="white" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M123.5 116.704L74 131.704" stroke="white" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M74.5 148L235 233.604" stroke="white" stroke-width="4" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M55 253.204L73.2 246.904" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M235.999 257.304L212.499 245.804C211.499 245.304 210.399 245.204 209.399 245.504L181.199 254.004C179.399 254.504 178.199 256.204 178.199 258.104V305.004C178.199 306.504 178.999 308.004 180.399 308.704L215.899 328.504C216.999 329.104 218.299 329.204 219.499 328.804L236.099 322.504" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M217.699 328.504V274.104L237.599 267.904" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M178.199 254.904L217.699 274.104" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M191.6 301.405C195.7 306.505 200.8 309.405 204.8 308.705C205.9 308.505 206.9 308.105 207.7 307.405C207 305.905 206.3 304.305 205.5 302.705L204.9 301.405C204.1 302.405 202.9 303.005 201.4 302.905L199.2 299.205L191.6 301.405Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M186.899 278.805C185.899 280.205 185.399 282.005 185.199 284.205C184.999 287.205 185.699 290.705 187.199 294.205C187.899 295.905 188.799 297.505 189.799 299.005C190.799 298.805 191.799 298.505 192.799 298.205L193.599 297.905C192.299 296.205 191.199 294.205 190.599 292.205L192.699 290.905L186.899 278.805Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M204.299 283.404C200.199 278.304 195.099 275.404 191.099 276.104C189.999 276.304 188.999 276.704 188.199 277.404C188.899 278.904 189.599 280.504 190.399 282.104L190.999 283.404C191.799 282.404 192.999 281.804 194.499 281.904L196.499 285.404L204.299 283.404Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M208.999 306.104C211.299 302.704 211.199 296.804 208.699 290.804C207.999 289.104 207.099 287.504 206.099 286.004C205.099 286.204 204.099 286.504 203.099 286.804L202.299 287.104C203.599 288.804 204.699 290.804 205.299 292.804V292.904L203.199 294.204L208.999 306.104Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M197.5 249.004V237.604C197.5 236.004 196.6 234.504 195.1 233.804L159.8 216.504C158.8 216.004 157.7 215.904 156.7 216.204L128.5 224.704C126.7 225.204 125.5 226.904 125.5 228.804V275.704C125.5 277.204 126.3 278.704 127.7 279.404L163.2 299.204C164.3 299.804 165.6 299.904 166.8 299.504L178.2 295.204" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M165 299.204V244.804L196.5 235.004" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M125.5 225.604L165 244.804" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M138.9 272.204C143 277.304 148.1 280.204 152.1 279.504C153.2 279.304 154.2 278.904 155 278.204C154.3 276.704 153.6 275.104 152.8 273.504L152.2 272.204C151.4 273.204 150.2 273.804 148.7 273.704L146.5 270.004L138.9 272.204Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M134.2 249.504C133.2 250.904 132.7 252.704 132.5 254.904C132.3 257.904 133 261.404 134.5 264.904C135.2 266.604 136.1 268.204 137.1 269.704C138.1 269.504 139.1 269.204 140.1 268.904L140.9 268.604C139.6 266.904 138.5 264.904 137.9 262.904L140 261.604L134.2 249.504Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M151.6 254.104C147.5 249.004 142.4 246.104 138.4 246.804C137.3 247.004 136.3 247.404 135.5 248.104C136.2 249.604 136.9 251.204 137.7 252.804L138.3 254.104C139.1 253.104 140.3 252.504 141.8 252.604L143.8 256.104L151.6 254.104Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M156.3 276.804C158.6 273.404 158.5 267.504 156 261.504C155.3 259.804 154.4 258.204 153.4 256.704C152.4 256.904 151.4 257.204 150.4 257.504L149.6 257.804C150.9 259.504 152 261.504 152.6 263.504V263.604L150.5 264.904L156.3 276.804Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M146 220.504V208.304C146 206.704 145.1 205.204 143.6 204.504L108.3 187.204C107.3 186.704 106.2 186.604 105.2 186.904L77 195.404C75.2 195.904 74 197.604 74 199.504V246.404C74 247.904 74.8 249.404 76.2 250.104L111.7 269.904C112.8 270.504 114.1 270.604 115.3 270.204L125.8 266.204" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M113.5 270.004V215.504L145 205.704" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M74 196.404L113.5 215.504" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M87.3008 242.904C91.4008 248.004 96.5008 250.904 100.501 250.204C101.601 250.004 102.601 249.604 103.401 248.904C102.701 247.404 102.001 245.804 101.201 244.204L100.601 242.904C99.8008 243.904 98.6008 244.504 97.1008 244.404L94.9008 240.704L87.3008 242.904Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M82.7003 220.204C81.7003 221.604 81.2003 223.404 81.0003 225.604C80.8003 228.604 81.5003 232.104 83.0003 235.604C83.7003 237.304 84.6003 238.904 85.6003 240.404C86.6003 240.204 87.6003 239.904 88.6003 239.604L89.4003 239.304C88.1003 237.604 87.0003 235.604 86.4003 233.604L88.5003 232.304L82.7003 220.204Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M100.1 224.904C96 219.804 90.9 216.904 86.9 217.604C85.8 217.804 84.8 218.204 84 218.904C84.7 220.404 85.4 222.004 86.2 223.604L86.8 224.904C87.6 223.904 88.8 223.304 90.3 223.404L92.3 226.904L100.1 224.904Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M104.8 247.504C107.1 244.104 107 238.204 104.5 232.204C103.8 230.504 102.9 228.904 101.9 227.404C100.9 227.604 99.8996 227.904 98.8996 228.204L98.0996 228.504C99.3996 230.204 100.5 232.204 101.1 234.204V234.304L98.9996 235.604L104.8 247.504Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M234.999 133.504L211.499 122.004C210.499 121.504 209.399 121.404 208.399 121.704L180.199 130.204C178.399 130.704 177.199 132.404 177.199 134.304V181.204C177.199 182.704 177.999 184.204 179.399 184.904L214.899 204.704C215.999 205.304 217.299 205.404 218.499 205.004L235.099 198.704" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M216.699 204.804V150.304L234.999 144.604" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M177.199 131.204L216.699 150.304" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M190.6 177.704C194.7 182.804 199.8 185.704 203.8 185.004C204.9 184.804 205.9 184.404 206.7 183.704C206 182.204 205.3 180.604 204.5 179.004L203.9 177.704C203.1 178.704 201.9 179.304 200.4 179.204L198.2 175.504L190.6 177.704Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M185.899 155.004C184.899 156.404 184.399 158.204 184.199 160.404C183.999 163.404 184.699 166.904 186.199 170.404C186.899 172.104 187.799 173.704 188.799 175.204C189.799 175.004 190.799 174.704 191.799 174.404L192.599 174.104C191.299 172.404 190.199 170.404 189.599 168.404L191.699 167.104L185.899 155.004Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M203.299 159.704C199.199 154.604 194.099 151.704 190.099 152.404C188.999 152.604 187.999 153.004 187.199 153.704C187.899 155.204 188.599 156.804 189.399 158.404L189.999 159.704C190.799 158.704 191.999 158.104 193.499 158.204L195.499 161.704L203.299 159.704Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M207.999 182.304C210.299 178.904 210.199 173.004 207.699 167.004C206.999 165.304 206.099 163.704 205.099 162.204C204.099 162.404 203.099 162.704 202.099 163.004L201.299 163.304C202.599 165.004 203.699 167.004 204.299 169.004V169.104L202.199 170.404L207.999 182.304Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M195.5 125.704V115.904C195.5 114.304 194.6 112.804 193.1 112.104L157.8 94.8042C156.8 94.3042 155.7 94.2042 154.7 94.5042L126.5 103.004C124.7 103.504 123.5 105.204 123.5 107.104V154.004C123.5 155.504 124.3 157.004 125.7 157.704L161.2 177.504C162.3 178.104 163.6 178.204 164.8 177.804L177.2 173.104" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M163 177.504V123.104L194.5 113.204" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M123.5 103.904L163 123.104" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M136.9 150.405C141 155.505 146.1 158.405 150.1 157.705C151.2 157.505 152.2 157.105 153 156.405C152.3 154.905 151.6 153.305 150.8 151.705L150.2 150.405C149.4 151.405 148.2 152.005 146.7 151.905L144.5 148.205L136.9 150.405Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M132.2 127.705C131.2 129.105 130.7 130.905 130.5 133.105C130.3 136.105 131 139.605 132.5 143.105C133.2 144.805 134.1 146.405 135.1 147.905C136.1 147.705 137.1 147.405 138.1 147.105L138.9 146.805C137.6 145.105 136.5 143.105 135.9 141.105L138 139.805L132.2 127.705Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M149.6 132.404C145.5 127.304 140.4 124.404 136.4 125.104C135.3 125.304 134.3 125.704 133.5 126.404C134.2 127.904 134.9 129.504 135.7 131.104L136.3 132.404C137.1 131.404 138.3 130.804 139.8 130.904L141.8 134.404L149.6 132.404Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M154.3 155.004C156.6 151.604 156.5 145.704 154 139.704C153.3 138.004 152.4 136.404 151.4 134.904C150.4 135.104 149.4 135.404 148.4 135.704L147.6 136.004C148.9 137.704 150 139.704 150.6 141.704V141.804L148.5 143.104L154.3 155.004Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M43.3 172.504L71.2 161.904C72.9 161.304 74 159.704 74 157.904V110.504C74 108.904 73.1 107.404 71.6 106.704L36.3 89.4043C35.3 88.9043 34.2 88.8043 33.2 89.1043L5 97.7043C3.2 98.2043 2 99.9043 2 101.804V148.704C2 150.204 2.8 151.704 4.2 152.404L39.7 172.204C40.8 172.804 42.1 172.904 43.3 172.504Z" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M41.5 172.204V117.804L73 107.904" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M2 98.6045L41.5 117.804" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M15.3008 145.104C19.4008 150.204 24.5008 153.104 28.5008 152.404C29.6008 152.204 30.6008 151.804 31.4008 151.104C30.7008 149.604 30.0008 148.004 29.2008 146.404L28.6008 145.104C27.8008 146.104 26.6008 146.704 25.1008 146.604L22.9008 142.904L15.3008 145.104Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M10.7003 122.404C9.70027 123.804 9.20027 125.604 9.00027 127.804C8.80027 130.804 9.50027 134.304 11.0003 137.804C11.7003 139.504 12.6003 141.104 13.6003 142.604C14.6003 142.404 15.6003 142.104 16.6003 141.804L17.4003 141.504C16.1003 139.804 15.0003 137.804 14.4003 135.804L16.5003 134.504L10.7003 122.404Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M28.1 127.104C24 122.004 18.9 119.104 14.9 119.804C13.8 120.004 12.8 120.404 12 121.104C12.7 122.604 13.4 124.204 14.2 125.804L14.8 127.104C15.6 126.104 16.8 125.504 18.3 125.604L20.3 129.104L28.1 127.104Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+<path d="M32.7996 149.704C35.0996 146.304 34.9996 140.404 32.4996 134.404C31.7996 132.704 30.8996 131.104 29.8996 129.604C28.8996 129.804 27.8996 130.104 26.8996 130.404L26.0996 130.704C27.3996 132.404 28.4996 134.404 29.0996 136.404V136.504L26.9996 137.804L32.7996 149.704Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10"/>
+</svg>
diff --git a/packages/website/public/images/launch_kit/enable_trading.svg b/packages/website/public/images/launch_kit/enable_trading.svg
new file mode 100644
index 000000000..9fcb78c05
--- /dev/null
+++ b/packages/website/public/images/launch_kit/enable_trading.svg
@@ -0,0 +1,9 @@
+<svg width="62" height="67" viewBox="0 0 62 67" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle r="29" transform="matrix(1 0 0 -1 30.5 30.5)" stroke="white" stroke-width="3"/>
+<circle cx="25.5" cy="16.5" r="12" stroke="white" stroke-width="3"/>
+<circle cx="9" cy="25" r="4.5" stroke="white" stroke-width="3"/>
+<circle cx="50" cy="31" r="7.5" stroke="white" stroke-width="3"/>
+<circle cx="19.5" cy="41.5" r="11" stroke="white" stroke-width="3"/>
+<rect x="40.5" y="12.5" width="9" height="10" stroke="white" stroke-width="3"/>
+<path d="M33.9032 56.2038L32.5823 33.8826L52.5734 43.8992L33.9032 56.2038Z" stroke="white" stroke-width="2.5"/>
+</svg>
diff --git a/packages/website/public/images/launch_kit/fork.svg b/packages/website/public/images/launch_kit/fork.svg
new file mode 100644
index 000000000..83d2f6d65
--- /dev/null
+++ b/packages/website/public/images/launch_kit/fork.svg
@@ -0,0 +1,4 @@
+<svg width="61" height="61" viewBox="0 0 61 61" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle r="29" transform="matrix(1 0 0 -1 30.5 30.5)" stroke="white" stroke-width="3"/>
+<path d="M31 58.5V46.5M31 1.5V24M31 46.5L42 38V3.5M31 46.5V24M31 24L19.5 16.5V3.5" stroke="white" stroke-width="3"/>
+</svg>
diff --git a/packages/website/public/images/launch_kit/in_game_marketplace.svg b/packages/website/public/images/launch_kit/in_game_marketplace.svg
new file mode 100644
index 000000000..77422a667
--- /dev/null
+++ b/packages/website/public/images/launch_kit/in_game_marketplace.svg
@@ -0,0 +1,15 @@
+<svg width="62" height="62" viewBox="0 0 62 62" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M31 60C47.0163 60 60 47.0163 60 31C60 14.9837 47.0163 2 31 2C14.9837 2 2 14.9837 2 31C2 47.0163 14.9837 60 31 60Z" stroke="white" stroke-width="2.5" stroke-miterlimit="10"/>
+<path d="M48.3159 26.5213L31.1692 49.7925L14 26.5213L16.854 19.5693H31.1692H45.4618L48.3159 26.5213Z" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M31.0004 49.7925L24.0742 19.5693" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M31 49.7925L37.9261 19.5693" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M14 26.8101H48.001" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M18 20.5L8.5 12" stroke="white" stroke-width="3"/>
+<path d="M15.5 27L2.5 27" stroke="white" stroke-width="3"/>
+<path d="M44 20.5L53.5 12" stroke="white" stroke-width="3"/>
+<path d="M46.5 27L59.5 27" stroke="white" stroke-width="3"/>
+<path d="M40.9995 35.3153L55.5 46.5" stroke="white" stroke-width="3"/>
+<path d="M21.5005 35.3153L7 46.5" stroke="white" stroke-width="3"/>
+<path d="M26.8774 20.8714L22.5 4.5" stroke="white" stroke-width="3"/>
+<path d="M34.271 20.3714L38.6484 4" stroke="white" stroke-width="3"/>
+</svg>
diff --git a/packages/website/public/images/launch_kit/local_market.svg b/packages/website/public/images/launch_kit/local_market.svg
new file mode 100644
index 000000000..cf5af8bcb
--- /dev/null
+++ b/packages/website/public/images/launch_kit/local_market.svg
@@ -0,0 +1,12 @@
+<svg width="61" height="61" viewBox="0 0 61 61" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g style="mix-blend-mode:screen">
+<line x1="1" y1="32.5" x2="60" y2="32.5" stroke="white" stroke-width="3"/>
+<circle r="29" transform="matrix(1 0 0 -1 30.5 30.5)" stroke="white" stroke-width="3"/>
+<mask id="path-3-inside-1" fill="white">
+<path d="M13 19.2842C13 9.73842 20.8063 2 30.4359 2H30.5641C40.1937 2 48 9.73842 48 19.2842C48 24.3185 46.0144 27.2967 44.7837 29.2892C39.8746 36.5685 33.9497 40.9315 30.5641 51H30.4359C27.0503 40.9315 21.1254 36.5685 16.2163 29.2892C14.9856 27.2967 13 24.3185 13 19.2842Z"/>
+</mask>
+<path d="M13 19.2842C13 9.73842 20.8063 2 30.4359 2H30.5641C40.1937 2 48 9.73842 48 19.2842C48 24.3185 46.0144 27.2967 44.7837 29.2892C39.8746 36.5685 33.9497 40.9315 30.5641 51H30.4359C27.0503 40.9315 21.1254 36.5685 16.2163 29.2892C14.9856 27.2967 13 24.3185 13 19.2842Z" fill="black"/>
+<path d="M13 19.2842L16 19.2843V19.2842H13ZM30.4359 51L27.5923 51.9562L28.2796 54H30.4359V51ZM16.2163 29.2892L13.664 30.8657L13.6955 30.9168L13.7291 30.9666L16.2163 29.2892ZM48 19.2842H45V19.2843L48 19.2842ZM30.5641 51V54H32.7204L33.4077 51.9562L30.5641 51ZM44.7837 29.2892L47.2709 30.9666L47.3045 30.9168L47.336 30.8657L44.7837 29.2892ZM30.4359 -1C19.1742 -1 10 8.05692 10 19.2842H16C16 11.4199 22.4384 5 30.4359 5V-1ZM33.2794 50.0438C31.4467 44.5934 28.9179 40.69 26.2714 37.2645C23.5142 33.6957 21.1115 31.1823 18.7036 27.6118L13.7291 30.9666C16.2303 34.6754 19.2445 37.9831 21.5234 40.9328C23.913 44.0258 26.0395 47.3381 27.5923 51.9562L33.2794 50.0438ZM18.7687 27.7127C17.5609 25.7573 16 23.408 16 19.2843L10 19.2842C9.99996 25.229 12.4103 28.8361 13.664 30.8657L18.7687 27.7127ZM30.5641 5C38.5616 5 45 11.4199 45 19.2842H51C51 8.05692 41.8258 -1 30.5641 -1V5ZM33.4077 51.9562C34.9605 47.3381 37.087 44.0258 39.4766 40.9328C41.7555 37.9831 44.7697 34.6754 47.2709 30.9666L42.2964 27.6118C39.8885 31.1823 37.4858 33.6957 34.7286 37.2645C32.0821 40.69 29.5533 44.5934 27.7206 50.0438L33.4077 51.9562ZM47.336 30.8657C48.5897 28.8361 51 25.229 51 19.2842L45 19.2843C45 23.408 43.4391 25.7573 42.2313 27.7127L47.336 30.8657ZM30.4359 5H30.5641V-1H30.4359V5ZM30.5641 48H30.4359V54H30.5641V48Z" fill="white" mask="url(#path-3-inside-1)"/>
+<path d="M36.5 17.9247C36.5 21.1271 33.8424 23.7747 30.5 23.7747C27.1576 23.7747 24.5 21.1271 24.5 17.9247C24.5 14.7223 27.1576 12.0747 30.5 12.0747C33.8424 12.0747 36.5 14.7223 36.5 17.9247Z" stroke="white" stroke-width="3"/>
+</g>
+</svg>
diff --git a/packages/website/public/images/launch_kit/secondary_market.svg b/packages/website/public/images/launch_kit/secondary_market.svg
new file mode 100644
index 000000000..f57152516
--- /dev/null
+++ b/packages/website/public/images/launch_kit/secondary_market.svg
@@ -0,0 +1,6 @@
+<svg width="62" height="62" viewBox="0 0 62 62" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M60 31C60 14.9837 47.0163 2 31 2C14.9837 2 2 14.9837 2 31C2 47.0163 14.9837 60 31 60C47.0163 60 60 47.0163 60 31Z" fill="#1B1B1B" stroke="white" stroke-width="3" stroke-miterlimit="10" stroke-linejoin="bevel"/>
+<path d="M34.9134 41.2225C34.9134 33.4233 28.5909 27.1008 20.7917 27.1008C12.9924 27.1008 6.66992 33.4233 6.66992 41.2225C6.66992 49.0217 12.9924 55.3442 20.7917 55.3442C28.5909 55.3442 34.9134 49.0217 34.9134 41.2225Z" fill="#1B1B1B" stroke="white" stroke-width="3" stroke-miterlimit="10" stroke-linejoin="bevel"/>
+<path d="M45.1361 30.9998C45.1361 23.2006 38.8135 16.8781 31.0143 16.8781C23.2151 16.8781 16.8926 23.2006 16.8926 30.9998C16.8926 38.7991 23.2151 45.1216 31.0143 45.1216C38.8135 45.1216 45.1361 38.7991 45.1361 30.9998Z" fill="#1B1B1B" stroke="white" stroke-width="3" stroke-miterlimit="10" stroke-linejoin="bevel"/>
+<path d="M55.3587 20.7772C55.3587 12.978 49.0362 6.65544 41.237 6.65544C33.4378 6.65544 27.1152 12.978 27.1152 20.7772C27.1152 28.5764 33.4378 34.8989 41.237 34.8989C49.0362 34.8989 55.3587 28.5764 55.3587 20.7772Z" fill="#1B1B1B" stroke="white" stroke-width="3" stroke-miterlimit="10" stroke-linejoin="bevel"/>
+</svg>
diff --git a/packages/website/public/images/launch_kit/shared_liquidity.svg b/packages/website/public/images/launch_kit/shared_liquidity.svg
new file mode 100644
index 000000000..abab3444c
--- /dev/null
+++ b/packages/website/public/images/launch_kit/shared_liquidity.svg
@@ -0,0 +1,20 @@
+<svg width="70" height="70" viewBox="0 0 70 70" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M57.4993 18.3314C60.2035 21.9755 62.0433 26.2995 62.7157 31M51.6681 12.5002C48.2838 9.98885 44.3133 8.22296 39.9993 7.44531M29.9993 7.44531C25.6853 8.22296 21.7147 9.98885 18.3305 12.5002M62.7157 39.0004C62.0343 43.7638 60.154 48.1404 57.3903 51.8148M51.8193 57.3872C48.4023 59.9585 44.3777 61.7658 39.9993 62.555M29.9993 62.555C25.6209 61.7658 21.5963 59.9585 18.1793 57.3872M12.6083 51.8148C9.84454 48.1404 7.96424 43.7638 7.28286 39.0004M7.25195 31.2224C7.83085 26.9301 9.38234 22.9462 11.6773 19.5" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M35 12C37.7614 12 40 9.76142 40 7C40 4.23858 37.7614 2 35 2C32.2386 2 30 4.23858 30 7C30 9.76142 32.2386 12 35 12Z" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M15 21C17.7614 21 20 18.7614 20 16C20 13.2386 17.7614 11 15 11C12.2386 11 10 13.2386 10 16C10 18.7614 12.2386 21 15 21Z" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M54 21C56.7614 21 59 18.7614 59 16C59 13.2386 56.7614 11 54 11C51.2386 11 49 13.2386 49 16C49 18.7614 51.2386 21 54 21Z" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M63 40C65.7614 40 68 37.7614 68 35C68 32.2386 65.7614 30 63 30C60.2386 30 58 32.2386 58 35C58 37.7614 60.2386 40 63 40Z" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M55 60C57.7614 60 60 57.7614 60 55C60 52.2386 57.7614 50 55 50C52.2386 50 50 52.2386 50 55C50 57.7614 52.2386 60 55 60Z" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M35 68C37.7614 68 40 65.7614 40 63C40 60.2386 37.7614 58 35 58C32.2386 58 30 60.2386 30 63C30 65.7614 32.2386 68 35 68Z" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M15 60C17.7614 60 20 57.7614 20 55C20 52.2386 17.7614 50 15 50C12.2386 50 10 52.2386 10 55C10 57.7614 12.2386 60 15 60Z" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M7 40C9.76142 40 12 37.7614 12 35C12 32.2386 9.76142 30 7 30C4.23858 30 2 32.2386 2 35C2 37.7614 4.23858 40 7 40Z" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M32.163 37.837C30.6123 36.2863 30.6123 33.7489 32.163 32.163C33.7137 30.6123 36.2511 30.6123 37.837 32.163C39.3877 33.7137 39.3877 36.2511 37.837 37.837C36.2511 39.3877 33.7137 39.3877 32.163 37.837Z" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M19.8722 37.1278C18.7093 35.9648 18.7093 34.0617 19.8722 32.8722C21.0352 31.7093 22.9383 31.7093 24.1278 32.8722C25.2907 34.0352 25.2907 35.9383 24.1278 37.1278C22.9383 38.2907 21.0352 38.2907 19.8722 37.1278Z" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M45.8722 37.1278C44.7093 35.9648 44.7093 34.0617 45.8722 32.8722C47.0352 31.7093 48.9383 31.7093 50.1278 32.8722C51.2907 34.0352 51.2907 35.9383 50.1278 37.1278C48.9383 38.2907 47.0352 38.2907 45.8722 37.1278Z" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M23 26C23 24.3274 24.354 23 26 23C27.6726 23 29 24.354 29 26C29 27.6726 27.646 29 26 29C24.3274 29 23 27.6726 23 26Z" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M41 44C41 42.3274 42.354 41 44 41C45.6726 41 47 42.354 47 44C47 45.6726 45.646 47 44 47C42.354 47 41 45.646 41 44Z" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M44.0002 23C45.6727 23 47 24.354 47 26C47 27.6726 45.6461 29 44.0002 29C42.3277 29 41.0004 27.646 41.0004 26C40.9738 24.3274 42.3277 23 44.0002 23Z" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M26 41C27.6726 41 29 42.354 29 44C29 45.6726 27.646 47 26 47C24.3274 47 23 45.646 23 44C23 42.354 24.3274 41 26 41Z" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M32.8891 18.8722C34.0483 17.7093 35.9451 17.7093 37.1306 18.8722C38.2898 20.0352 38.2898 21.9383 37.1306 23.1278C35.9715 24.2907 34.0746 24.2907 32.8891 23.1278C31.7036 21.9383 31.7036 20.0352 32.8891 18.8722Z" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+<path d="M32.8891 45.8722C34.0483 44.7093 35.9451 44.7093 37.1306 45.8722C38.2898 47.0352 38.2898 48.9383 37.1306 50.1278C35.9715 51.2907 34.0746 51.2907 32.8891 50.1278C31.7036 48.9383 31.7036 47.0352 32.8891 45.8722Z" stroke="white" stroke-width="3" stroke-miterlimit="10"/>
+</svg>
diff --git a/packages/website/translations/chinese.json b/packages/website/translations/chinese.json
index e3798a072..eb88b43d0 100644
--- a/packages/website/translations/chinese.json
+++ b/packages/website/translations/chinese.json
@@ -95,6 +95,19 @@
"LIBRARIES_AND_TOOLS_DESCRIPTION":
"A list of available tools maintained by the 0x core developers and wider community for building on top of 0x Protocol and Ethereum",
"MORE": "more",
+ "LAUNCH_KIT": "0x launch kit",
+ "LAUNCH_KIT_PITCH": "launch a relayer in under a minute.",
+ "GET_STARTED": "get started",
+ "GET_IN_TOUCH": "get in touch",
+ "EXPLORE_THE_DOCS": "explore the docs",
+ "LOCAL_MARKET": "Easily build a 0x relayer for your local market",
+ "SEEMLESSLY_CREATE": "Seamlessly create an in-game marketplace for digital items and collectables",
+ "QUICKLY_LAUNCH": "Quickly launch a market for your community token",
+ "ENABLE_TRADING": "Enable trading for any ERC-20 or ERC-721 asset",
+ "FORK_AND_EXTEND": "Fork and extend to support new modes of exchange",
+ "TAP_INTO_AND_SHARE": "Tap into and share liquidity with other relayers",
+ "PERFECT_FOR_DEVELOPERS": "Perfect for developers who need a simple drop-in marketplace",
+ "LEARN_MORE": "learn more",
"START_BUILDING_ON_0X": "Start building on 0x",
"START_BUILDING_ON_0X_DESCRIPTION":
"Follow one of our \"Getting started\" guides to learn more about building ontop of 0x."
diff --git a/packages/website/translations/english.json b/packages/website/translations/english.json
index f91633492..5fba7a0ff 100644
--- a/packages/website/translations/english.json
+++ b/packages/website/translations/english.json
@@ -99,6 +99,19 @@
"LIBRARIES_AND_TOOLS_DESCRIPTION":
"A list of available tools maintained by the 0x core developers and wider community for building on top of 0x Protocol and Ethereum",
"MORE": "more",
+ "LAUNCH_KIT": "0x launch kit",
+ "LAUNCH_KIT_PITCH": "launch a relayer in under a minute.",
+ "GET_STARTED": "get started",
+ "GET_IN_TOUCH": "get in touch",
+ "EXPLORE_THE_DOCS": "explore the docs",
+ "LOCAL_MARKET": "Easily build a 0x relayer for your local market",
+ "SEEMLESSLY_CREATE": "Seamlessly create an in-game marketplace for digital items and collectables",
+ "QUICKLY_LAUNCH": "Quickly launch a market for your community token",
+ "ENABLE_TRADING": "Enable trading for any ERC-20 or ERC-721 asset",
+ "FORK_AND_EXTEND": "Fork and extend to support new modes of exchange",
+ "TAP_INTO_AND_SHARE": "Tap into and share liquidity with other relayers",
+ "PERFECT_FOR_DEVELOPERS": "Perfect for developers who need a simple drop-in marketplace",
+ "LEARN_MORE": "learn more",
"OUR_MISSION_AND_VALUES": "our mission & values",
"GAMING_AND_COLLECTABLES": "gaming & collectables",
"GAMING_AND_COLLECTABLES_DESCRIPTION":
diff --git a/packages/website/translations/korean.json b/packages/website/translations/korean.json
index ca8cbe3d0..e3ce74676 100644
--- a/packages/website/translations/korean.json
+++ b/packages/website/translations/korean.json
@@ -95,6 +95,19 @@
"LIBRARIES_AND_TOOLS_DESCRIPTION":
"A list of available tools maintained by the 0x core developers and wider community for building on top of 0x Protocol and Ethereum",
"MORE": "more",
+ "LAUNCH_KIT": "0x launch kit",
+ "LAUNCH_KIT_PITCH": "launch a relayer in under a minute.",
+ "GET_STARTED": "get started",
+ "GET_IN_TOUCH": "get in touch",
+ "EXPLORE_THE_DOCS": "explore the docs",
+ "LOCAL_MARKET": "Easily build a 0x relayer for your local market",
+ "SEEMLESSLY_CREATE": "Seamlessly create an in-game marketplace for digital items and collectables",
+ "QUICKLY_LAUNCH": "Quickly launch a market for your community token",
+ "ENABLE_TRADING": "Enable trading for any ERC-20 or ERC-721 asset",
+ "FORK_AND_EXTEND": "Fork and extend to support new modes of exchange",
+ "TAP_INTO_AND_SHARE": "Tap into and share liquidity with other relayers",
+ "PERFECT_FOR_DEVELOPERS": "Perfect for developers who need a simple drop-in marketplace",
+ "LEARN_MORE": "learn more",
"START_BUILDING_ON_0X": "Start building on 0x",
"START_BUILDING_ON_0X_DESCRIPTION":
"Follow one of our \"Getting started\" guides to learn more about building ontop of 0x."
diff --git a/packages/website/translations/russian.json b/packages/website/translations/russian.json
index a43d1e7b7..c74fb5e32 100644
--- a/packages/website/translations/russian.json
+++ b/packages/website/translations/russian.json
@@ -95,6 +95,19 @@
"LIBRARIES_AND_TOOLS_DESCRIPTION":
"A list of available tools maintained by the 0x core developers and wider community for building on top of 0x Protocol and Ethereum",
"MORE": "more",
+ "LAUNCH_KIT": "0x launch kit",
+ "LAUNCH_KIT_PITCH": "launch a relayer in under a minute.",
+ "GET_STARTED": "get started",
+ "GET_IN_TOUCH": "get in touch",
+ "EXPLORE_THE_DOCS": "explore the docs",
+ "LOCAL_MARKET": "Easily build a 0x relayer for your local market",
+ "SEEMLESSLY_CREATE": "Seamlessly create an in-game marketplace for digital items and collectables",
+ "QUICKLY_LAUNCH": "Quickly launch a market for your community token",
+ "ENABLE_TRADING": "Enable trading for any ERC-20 or ERC-721 asset",
+ "FORK_AND_EXTEND": "Fork and extend to support new modes of exchange",
+ "TAP_INTO_AND_SHARE": "Tap into and share liquidity with other relayers",
+ "PERFECT_FOR_DEVELOPERS": "Perfect for developers who need a simple drop-in marketplace",
+ "LEARN_MORE": "learn more",
"START_BUILDING_ON_0X": "Start building on 0x",
"START_BUILDING_ON_0X_DESCRIPTION":
"Follow one of our \"Getting started\" guides to learn more about building ontop of 0x."
diff --git a/packages/website/translations/spanish.json b/packages/website/translations/spanish.json
index 4d404ac6b..e29db711b 100644
--- a/packages/website/translations/spanish.json
+++ b/packages/website/translations/spanish.json
@@ -96,6 +96,19 @@
"LIBRARIES_AND_TOOLS_DESCRIPTION":
"A list of available tools maintained by the 0x core developers and wider community for building on top of 0x Protocol and Ethereum",
"MORE": "more",
+ "LAUNCH_KIT": "0x launch kit",
+ "LAUNCH_KIT_PITCH": "launch a relayer in under a minute.",
+ "GET_STARTED": "get started",
+ "GET_IN_TOUCH": "get in touch",
+ "EXPLORE_THE_DOCS": "explore the docs",
+ "LOCAL_MARKET": "Easily build a 0x relayer for your local market",
+ "SEEMLESSLY_CREATE": "Seamlessly create an in-game marketplace for digital items and collectables",
+ "QUICKLY_LAUNCH": "Quickly launch a market for your community token",
+ "ENABLE_TRADING": "Enable trading for any ERC-20 or ERC-721 asset",
+ "FORK_AND_EXTEND": "Fork and extend to support new modes of exchange",
+ "TAP_INTO_AND_SHARE": "Tap into and share liquidity with other relayers",
+ "PERFECT_FOR_DEVELOPERS": "Perfect for developers who need a simple drop-in marketplace",
+ "LEARN_MORE": "learn more",
"START_BUILDING_ON_0X": "Start building on 0x",
"START_BUILDING_ON_0X_DESCRIPTION":
"Follow one of our \"Getting started\" guides to learn more about building ontop of 0x."
diff --git a/packages/website/ts/components/footer.tsx b/packages/website/ts/components/footer.tsx
index dfedcba55..e10005a0a 100644
--- a/packages/website/ts/components/footer.tsx
+++ b/packages/website/ts/components/footer.tsx
@@ -23,6 +23,7 @@ const languageToMenuTitle = {
export interface FooterProps {
translate: Translate;
dispatcher: Dispatcher;
+ backgroundColor?: string;
}
interface FooterState {
@@ -30,6 +31,9 @@ interface FooterState {
}
export class Footer extends React.Component<FooterProps, FooterState> {
+ public static defaultProps = {
+ backgroundColor: colors.darkerGrey,
+ };
constructor(props: FooterProps) {
super(props);
this.state = {
@@ -112,7 +116,7 @@ export class Footer extends React.Component<FooterProps, FooterState> {
return <MenuItem key={menuTitle} value={language} primaryText={menuTitle} />;
});
return (
- <div className="relative pb4 pt2" style={{ backgroundColor: colors.darkerGrey }}>
+ <div className="relative pb4 pt2" style={{ backgroundColor: this.props.backgroundColor }}>
<div className="mx-auto max-width-4 md-px2 lg-px0 py4 clearfix" style={{ color: colors.white }}>
<div className="col lg-col-4 md-col-4 col-12 left">
<div className="sm-mx-auto" style={{ width: 148 }}>
diff --git a/packages/website/ts/components/ui/container.tsx b/packages/website/ts/components/ui/container.tsx
index ece077563..7eab2a50f 100644
--- a/packages/website/ts/components/ui/container.tsx
+++ b/packages/website/ts/components/ui/container.tsx
@@ -1,3 +1,4 @@
+import { TextAlignProperty } from 'csstype';
import * as React from 'react';
type StringOrNum = string | number;
@@ -26,6 +27,7 @@ export interface ContainerProps {
height?: StringOrNum;
minWidth?: StringOrNum;
minHeight?: StringOrNum;
+ textAlign?: TextAlignProperty;
isHidden?: boolean;
className?: string;
position?: 'absolute' | 'fixed' | 'relative' | 'unset';
diff --git a/packages/website/ts/containers/launch_kit.ts b/packages/website/ts/containers/launch_kit.ts
new file mode 100644
index 000000000..2557f38a5
--- /dev/null
+++ b/packages/website/ts/containers/launch_kit.ts
@@ -0,0 +1,27 @@
+import * as React from 'react';
+import { connect } from 'react-redux';
+import { Dispatch } from 'redux';
+import { LaunchKit as LaunchKitComponent, LaunchKitProps } from 'ts/pages/launch_kit/launch_kit';
+import { Dispatcher } from 'ts/redux/dispatcher';
+import { State } from 'ts/redux/reducer';
+import { Translate } from 'ts/utils/translate';
+
+interface ConnectedState {
+ translate: Translate;
+}
+
+interface ConnectedDispatch {
+ dispatcher: Dispatcher;
+}
+
+const mapStateToProps = (state: State, _ownProps: LaunchKitProps): ConnectedState => ({
+ translate: state.translate,
+});
+
+const mapDispatchToProps = (dispatch: Dispatch<State>): ConnectedDispatch => ({
+ dispatcher: new Dispatcher(dispatch),
+});
+
+export const LaunchKit: React.ComponentClass<LaunchKitProps> = connect(mapStateToProps, mapDispatchToProps)(
+ LaunchKitComponent,
+);
diff --git a/packages/website/ts/index.tsx b/packages/website/ts/index.tsx
index 21157e427..96e7184f8 100644
--- a/packages/website/ts/index.tsx
+++ b/packages/website/ts/index.tsx
@@ -9,6 +9,7 @@ import { DocsHome } from 'ts/containers/docs_home';
import { FAQ } from 'ts/containers/faq';
import { Jobs } from 'ts/containers/jobs';
import { Landing } from 'ts/containers/landing';
+import { LaunchKit } from 'ts/containers/launch_kit';
import { NotFound } from 'ts/containers/not_found';
import { Wiki } from 'ts/containers/wiki';
import { createLazyComponent } from 'ts/lazy_component';
@@ -87,6 +88,7 @@ render(
<Switch>
<Route exact={true} path="/" component={Landing as any} />
<Redirect from="/otc" to={`${WebsitePaths.Portal}`} />
+ <Route path={WebsitePaths.LaunchKit} component={LaunchKit as any} />
<Route path={WebsitePaths.Careers} component={Jobs as any} />
<Route path={WebsitePaths.Portal} component={LazyPortal} />
<Route path={WebsitePaths.FAQ} component={FAQ as any} />
diff --git a/packages/website/ts/pages/documentation/docs_home.tsx b/packages/website/ts/pages/documentation/docs_home.tsx
index 017573304..e3328f3fa 100644
--- a/packages/website/ts/pages/documentation/docs_home.tsx
+++ b/packages/website/ts/pages/documentation/docs_home.tsx
@@ -67,6 +67,32 @@ const CATEGORY_TO_PACKAGES: ObjectMap<Package[]> = {
},
{
description:
+ 'Launch a 0x relayer in under a minute with Launch Kit. `0x-launch-kit` is an open-source, free-to-use 0x relayer template that you can use as a starting point for your own project.',
+ link: {
+ title: '0x launch kit',
+ to: 'https://github.com/0xProject/0x-launch-kit',
+ shouldOpenInNewTab: true,
+ },
+ },
+ {
+ description:
+ 'Reference documentation for the 0x smart contracts. Helpful for dApp developer wanting to integrate 0x at the smart contract level.',
+ link: {
+ title: '0x smart contracts',
+ to: WebsitePaths.SmartContracts,
+ },
+ },
+ {
+ description:
+ "A Python library for interacting with 0x orders. Generate an orderHash, sign an order, validate it's signature and more.",
+ link: {
+ title: '0x-order-utils.py',
+ to: 'http://0x-order-utils-py.s3-website-us-east-1.amazonaws.com/',
+ shouldOpenInNewTab: true,
+ },
+ },
+ {
+ description:
'An http & websocket client for interacting with relayers that have implemented the [Standard Relayer API](https://github.com/0xProject/standard-relayer-api)',
link: {
title: '@0x/connect',
diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx
index e2af40c8d..bb76efe21 100644
--- a/packages/website/ts/pages/landing/landing.tsx
+++ b/packages/website/ts/pages/landing/landing.tsx
@@ -36,8 +36,8 @@ interface Project {
}
const THROTTLE_TIMEOUT = 100;
-const WHATS_NEW_TITLE = '0x Protocol v2 is Live!';
-const WHATS_NEW_URL = 'https://blog.0xproject.com/0x-protocol-v2-0-is-live-183aac180149';
+const WHATS_NEW_TITLE = 'Introducing the 0x Launch Kit';
+const WHATS_NEW_URL = 'https://blog.0xproject.com/introducing-the-0x-launch-kit-4acdc3453585';
const TITLE_STYLE: React.CSSProperties = {
fontFamily: 'Roboto Mono',
color: colors.grey,
diff --git a/packages/website/ts/pages/launch_kit/launch_kit.tsx b/packages/website/ts/pages/launch_kit/launch_kit.tsx
new file mode 100644
index 000000000..4ea56dbd4
--- /dev/null
+++ b/packages/website/ts/pages/launch_kit/launch_kit.tsx
@@ -0,0 +1,335 @@
+import { colors, Link } from '@0x/react-shared';
+import * as _ from 'lodash';
+import * as React from 'react';
+import DocumentTitle from 'react-document-title';
+import { Footer } from 'ts/components/footer';
+import { TopBar } from 'ts/components/top_bar/top_bar';
+import { Button } from 'ts/components/ui/button';
+import { Container } from 'ts/components/ui/container';
+import { Image } from 'ts/components/ui/image';
+import { Text } from 'ts/components/ui/text';
+import { Dispatcher } from 'ts/redux/dispatcher';
+import { Deco, Key, ScreenWidths } from 'ts/types';
+import { constants } from 'ts/utils/constants';
+import { Translate } from 'ts/utils/translate';
+import { utils } from 'ts/utils/utils';
+
+export interface LaunchKitProps {
+ location: Location;
+ translate: Translate;
+ dispatcher: Dispatcher;
+}
+
+interface LaunchKitState {
+ screenWidth: ScreenWidths;
+}
+
+const THROTTLE_TIMEOUT = 100;
+const lighterBackgroundColor = '#222222';
+const darkerBackgroundColor = '#1B1B1B';
+const grayText = '#999999';
+
+interface Benefit {
+ icon: string;
+ description: string;
+}
+
+export class LaunchKit extends React.Component<LaunchKitProps, LaunchKitState> {
+ private readonly _throttledScreenWidthUpdate: () => void;
+ constructor(props: LaunchKitProps) {
+ super(props);
+ this.state = {
+ screenWidth: utils.getScreenWidth(),
+ };
+ this._throttledScreenWidthUpdate = _.throttle(this._updateScreenWidth.bind(this), THROTTLE_TIMEOUT);
+ }
+ public componentDidMount(): void {
+ window.addEventListener('resize', this._throttledScreenWidthUpdate);
+ window.scrollTo(0, 0);
+ }
+ public componentWillUnmount(): void {
+ window.removeEventListener('resize', this._throttledScreenWidthUpdate);
+ }
+ public render(): React.ReactNode {
+ return (
+ <div id="launchKit" className="clearfix" style={{ color: colors.grey500 }}>
+ <DocumentTitle title="0x Launch Kit" />
+ <TopBar
+ blockchainIsLoaded={false}
+ location={this.props.location}
+ isNightVersion={true}
+ style={{ backgroundColor: lighterBackgroundColor, position: 'relative' }}
+ translate={this.props.translate}
+ />
+ {this._renderHero()}
+ {this._renderSection()}
+ {this._renderCallToAction()}
+ {this._renderDisclaimer()}
+ <Footer
+ backgroundColor={darkerBackgroundColor}
+ translate={this.props.translate}
+ dispatcher={this.props.dispatcher}
+ />
+ </div>
+ );
+ }
+ private _renderHero(): React.ReactNode {
+ const BENEFITS_1: Benefit[] = [
+ {
+ icon: '/images/launch_kit/shared_liquidity.svg',
+ description: this.props.translate.get(Key.TapIntoAndShare, Deco.Cap),
+ },
+ {
+ icon: '/images/launch_kit/fork.svg',
+ description: this.props.translate.get(Key.ForkAndExtend, Deco.Cap),
+ },
+ {
+ icon: '/images/launch_kit/enable_trading.svg',
+ description: this.props.translate.get(Key.EnableTrading, Deco.Cap),
+ },
+ ];
+ const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm;
+ const smallButtonPadding = '12px 30px 12px 30px';
+ const largeButtonPadding = '14px 60px 14px 60px';
+ const left = 'col lg-col-6 md-col-6 col-12 lg-pl2 md-pl2 sm-pl0 sm-px3 sm-center';
+ const flexClassName = isSmallScreen
+ ? 'flex items-center flex-column justify-center'
+ : 'flex items-center justify-center';
+ return (
+ <div className="clearfix pt4" style={{ backgroundColor: lighterBackgroundColor }}>
+ <div className="mx-auto max-width-4 clearfix">
+ <div className={`${flexClassName} lg-pb4 md-pb4 sm-mb4`}>
+ <div className={left} style={{ color: colors.white }}>
+ <div
+ className="inline-block lg-align-middle md-align-middle sm-align-top"
+ style={{
+ paddingLeft: isSmallScreen ? 0 : 12,
+ lineHeight: '36px',
+ }}
+ >
+ <Text
+ className="sm-pb2"
+ fontFamily="Roboto"
+ display="inline-block"
+ fontColor={colors.white}
+ fontWeight="bold"
+ lineHeight="1.3em"
+ letterSpacing="1px"
+ fontSize={isSmallScreen ? '38px' : '46px'}
+ >
+ {this.props.translate.get(Key.LaunchKit, Deco.CapWords)}
+ </Text>
+ <Container paddingTop="18px">
+ <Text fontColor={colors.linkSectionGrey} fontSize="18px">
+ {this.props.translate.get(Key.LaunchKitPitch, Deco.Cap)}
+ </Text>
+ </Container>
+ <Container
+ paddingTop="54px"
+ className={`flex clearfix sm-mx-auto ${isSmallScreen ? 'justify-center' : ''}`}
+ >
+ <Container paddingRight="20px">
+ <Link to={constants.URL_LAUNCH_KIT} shouldOpenInNewTab={true}>
+ <Button
+ padding={isSmallScreen ? smallButtonPadding : largeButtonPadding}
+ borderRadius="4px"
+ borderColor={colors.white}
+ >
+ <Text fontSize="16px" fontWeight="bold">
+ {this.props.translate.get(Key.GetStarted, Deco.Cap)}
+ </Text>
+ </Button>
+ </Link>
+ </Container>
+ <div>
+ <Link to={constants.URL_LAUNCH_KIT_BLOG_POST} shouldOpenInNewTab={true}>
+ <Button
+ backgroundColor={lighterBackgroundColor}
+ borderColor={colors.white}
+ fontColor={colors.white}
+ padding={isSmallScreen ? smallButtonPadding : largeButtonPadding}
+ borderRadius="4px"
+ >
+ <Text fontSize="16px" fontWeight="bold" fontColor={colors.white}>
+ {this.props.translate.get(Key.LearnMore, Deco.Cap)}
+ </Text>
+ </Button>
+ </Link>
+ </div>
+ </Container>
+ </div>
+ </div>
+ <Container
+ marginTop={isSmallScreen ? '60px' : '30px'}
+ marginBottom="30px"
+ marginLeft="15px"
+ marginRight="15px"
+ >
+ <Image
+ src="/images/launch_kit/0x_cupboard.svg"
+ maxWidth={isSmallScreen ? '75%' : '100%'}
+ height="auto"
+ />
+ </Container>
+ </div>
+ </div>
+ {this._renderBenefits(BENEFITS_1)}
+ </div>
+ );
+ }
+ private _renderSection(): React.ReactNode {
+ const BENEFITS_2: Benefit[] = [
+ {
+ icon: '/images/launch_kit/secondary_market.svg',
+ description: this.props.translate.get(Key.QuicklyLaunch, Deco.Cap),
+ },
+ {
+ icon: '/images/launch_kit/in_game_marketplace.svg',
+ description: this.props.translate.get(Key.SeemlesslyCreate, Deco.Cap),
+ },
+ {
+ icon: '/images/launch_kit/local_market.svg',
+ description: this.props.translate.get(Key.LocalMarket, Deco.Cap),
+ },
+ ];
+ return (
+ <div className="clearfix pb4" style={{ backgroundColor: darkerBackgroundColor }}>
+ <Container
+ className="mx-auto"
+ textAlign="center"
+ paddingTop="89px"
+ paddingBottom="89px"
+ maxWidth="421px"
+ paddingLeft="10px"
+ paddingRight="10px"
+ >
+ <Text fontSize="26px" lineHeight="37px" fontWeight="medium" fontColor={colors.white}>
+ {this.props.translate.get(Key.PerfectForDevelopers, Deco.Cap)}
+ </Text>
+ </Container>
+ {this._renderBenefits(BENEFITS_2)}
+ </div>
+ );
+ }
+ private _renderCallToAction(): React.ReactNode {
+ const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm;
+ const smallButtonPadding = '8px 14px 8px 14px';
+ const largeButtonPadding = '8px 14px 8px 14px';
+ return (
+ <Container
+ className="clearfix"
+ backgroundColor={lighterBackgroundColor}
+ paddingTop="90px"
+ paddingBottom="90px"
+ >
+ <Container className="clearfix mx-auto" maxWidth="850px">
+ <Container className="lg-left md-left sm-mx-auto sm-pb3" width="348px">
+ <Text fontColor={colors.white} fontSize="18px">
+ View our comprehensive documentation to start building today.
+ </Text>
+ </Container>
+ <Container
+ className={`lg-right md-right flex clearfix sm-mx-auto ${
+ isSmallScreen ? 'justify-center' : ''
+ }`}
+ paddingTop="5px"
+ >
+ <Container paddingRight="20px">
+ <Link to={`${constants.URL_LAUNCH_KIT}/#table-of-contents`} shouldOpenInNewTab={true}>
+ <Button
+ padding={isSmallScreen ? smallButtonPadding : largeButtonPadding}
+ borderRadius="4px"
+ backgroundColor={lighterBackgroundColor}
+ borderColor={colors.white}
+ >
+ <Text fontSize="16px" fontWeight="bold" fontColor={colors.white}>
+ {this.props.translate.get(Key.ExploreTheDocs, Deco.Cap)}
+ </Text>
+ </Button>
+ </Link>
+ </Container>
+ <div>
+ <Link to={constants.URL_ZEROEX_CHAT} shouldOpenInNewTab={true}>
+ <Button
+ padding={isSmallScreen ? smallButtonPadding : largeButtonPadding}
+ borderRadius="4px"
+ >
+ <Text fontSize="16px" fontWeight="bold">
+ {this.props.translate.get(Key.GetInTouch, Deco.Cap)}
+ </Text>
+ </Button>
+ </Link>
+ </div>
+ </Container>
+ </Container>
+ </Container>
+ );
+ }
+ private _renderBenefits(benefits: Benefit[]): React.ReactNode {
+ return (
+ <Container className="lg-flex md-flex justify-between mx-auto pb4" maxWidth="890px">
+ {_.map(benefits, benefit => {
+ return (
+ <Container className="mx-auto sm-pb4" width="240px">
+ <Container textAlign="center">
+ <img src={benefit.icon} />
+ </Container>
+ <Container paddingTop="26px">
+ <Text
+ fontSize="18px"
+ lineHeight="28px"
+ textAlign="center"
+ fontColor={colors.linkSectionGrey}
+ >
+ {benefit.description}
+ </Text>
+ </Container>
+ </Container>
+ );
+ })}
+ </Container>
+ );
+ }
+ private _renderDisclaimer(): React.ReactNode {
+ return (
+ <Container
+ className="clearfix"
+ backgroundColor={darkerBackgroundColor}
+ paddingTop="70px"
+ paddingBottom="70px"
+ >
+ <Container className="mx-auto" maxWidth="850px" paddingLeft="20px" paddingRight="20px">
+ <Text fontColor={grayText} fontSize="10px">
+ <b>Disclaimer:</b> The laws and regulations applicable to the use and exchange of digital assets
+ and blockchain-native tokens, including through any software developed using the licensed work
+ created by ZeroEx Intl. (the “Work”), vary by jurisdiction. As set forth in the Apache License,
+ Version 2.0 applicable to the Work, developers are “solely responsible for determining the
+ appropriateness of using or redistributing the Work,” which includes responsibility for ensuring
+ compliance with any such applicable laws and regulations.
+ </Text>
+ <Container paddingTop="15px">
+ <Text fontColor={grayText} fontSize="10px">
+ See the{' '}
+ <Link
+ to={constants.URL_APACHE_LICENSE}
+ shouldOpenInNewTab={true}
+ textDecoration="underline"
+ >
+ Apache License, Version 2.0
+ </Link>{' '}
+ for the specific language governing all applicable permissions and limitations.
+ </Text>
+ </Container>
+ </Container>
+ </Container>
+ );
+ }
+ private _updateScreenWidth(): void {
+ const newScreenWidth = utils.getScreenWidth();
+ if (newScreenWidth !== this.state.screenWidth) {
+ this.setState({
+ screenWidth: newScreenWidth,
+ });
+ }
+ }
+}
diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts
index ce4b50a58..444a8348d 100644
--- a/packages/website/ts/types.ts
+++ b/packages/website/ts/types.ts
@@ -352,6 +352,7 @@ export enum WebsitePaths {
Home = '/',
FAQ = '/faq',
About = '/about',
+ LaunchKit = '/launch-kit',
Whitepaper = '/pdfs/0x_white_paper.pdf',
SmartContracts = '/docs/contracts',
Connect = '/docs/connect',
@@ -479,6 +480,19 @@ export enum Key {
More = 'MORE',
StartBuildOn0x = 'START_BUILDING_ON_0X',
StartBuildOn0xDescription = 'START_BUILDING_ON_0X_DESCRIPTION',
+ LaunchKit = 'LAUNCH_KIT',
+ LaunchKitPitch = 'LAUNCH_KIT_PITCH',
+ ExploreTheDocs = 'EXPLORE_THE_DOCS',
+ EnableTrading = 'ENABLE_TRADING',
+ ForkAndExtend = 'FORK_AND_EXTEND',
+ LocalMarket = 'LOCAL_MARKET',
+ SeemlesslyCreate = 'SEEMLESSLY_CREATE',
+ QuicklyLaunch = 'QUICKLY_LAUNCH',
+ TapIntoAndShare = 'TAP_INTO_AND_SHARE',
+ PerfectForDevelopers = 'PERFECT_FOR_DEVELOPERS',
+ GetInTouch = 'GET_IN_TOUCH',
+ LearnMore = 'LEARN_MORE',
+ GetStarted = 'GET_STARTED',
}
export enum SmartContractDocSections {
diff --git a/packages/website/ts/utils/constants.ts b/packages/website/ts/utils/constants.ts
index 379f28022..e9afc8763 100644
--- a/packages/website/ts/utils/constants.ts
+++ b/packages/website/ts/utils/constants.ts
@@ -72,6 +72,7 @@ export const constants = {
PROJECT_URL_OPEN_ANX: 'https://www.openanx.org',
PROJECT_URL_IDT: 'https://kinalpha.com',
URL_ANGELLIST: 'https://angel.co/0xproject/jobs',
+ URL_APACHE_LICENSE: 'http://www.apache.org/licenses/LICENSE-2.0',
URL_BITLY_API: 'https://api-ssl.bitly.com',
URL_BLOG: 'https://blog.0xproject.com/latest',
URL_DISCOURSE_FORUM: 'https://forum.0xproject.com',
@@ -95,6 +96,8 @@ export const constants = {
URL_TWITTER: 'https://twitter.com/0xproject',
URL_WETH_IO: 'https://weth.io/',
URL_ZEROEX_CHAT,
+ URL_LAUNCH_KIT: 'https://github.com/0xProject/0x-launch-kit',
+ URL_LAUNCH_KIT_BLOG_POST: 'https://blog.0xproject.com/introducing-the-0x-launch-kit-4acdc3453585',
URL_WEB3_DOCS: 'https://github.com/ethereum/wiki/wiki/JavaScript-API',
URL_WEB3_DECODED_LOG_ENTRY_EVENT:
'https://github.com/0xProject/web3-typescript-typings/blob/f5bcb96/index.d.ts#L123',