where should i add this? In Inchmodal.jsx? Now that I changed the emojis/menuitems and the code in quickstart my wallet will no longer fully connect - it simply reverts back to authenticate after I sign the appropriate wallet prompts now.
import { useEffect } from "react";
import { useMoralis } from "react-moralis";
import {
BrowserRouter as Router,
Switch,
Route,
Redirect,
} from "react-router-dom";
import Account from "components/Account/Account";
import Chains from "components/Chains";
import TokenPrice from "components/TokenPrice";
import ERC20Balance from "components/ERC20Balance";
import ERC20Transfers from "components/ERC20Transfers";
import DEX from "components/DEX";
import NFTBalance from "components/NFTBalance";
import Wallet from "components/Wallet";
import { Layout, Tabs } from "antd";
import "antd/dist/antd.css";
import NativeBalance from "components/NativeBalance";
import "./style.css";
import QuickStart from "components/QuickStart";
import Contract from "components/Contract/Contract";
import Text from "antd/lib/typography/Text";
import Ramper from "components/Ramper";
import MenuItems from "./components/MenuItems";
const { Header, Footer } = Layout;
const styles = {
content: {
display: "flex",
justifyContent: "center",
fontFamily: "Roboto, sans-serif",
color: "#041836",
marginTop: "130px",
padding: "10px",
},
header: {
position: "fixed",
zIndex: 1,
width: "100%",
background: "#fff",
display: "flex",
justifyContent: "space-between",
alignItems: "center",
fontFamily: "Roboto, sans-serif",
borderBottom: "2px solid rgba(0, 0, 0, 0.06)",
padding: "0 10px",
boxShadow: "0 1px 10px rgb(151 164 175 / 10%)",
},
headerRight: {
display: "flex",
gap: "20px",
alignItems: "center",
fontSize: "15px",
fontWeight: "600",
},
};
const App = ({ isServerInfo }) => {
const { isWeb3Enabled, enableWeb3, isAuthenticated, isWeb3EnableLoading } =
useMoralis();
useEffect(() => {
const connectorId = window.localStorage.getItem("connectorId");
if (isAuthenticated && !isWeb3Enabled && !isWeb3EnableLoading)
enableWeb3({ provider: connectorId });
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [isAuthenticated, isWeb3Enabled]);
return (
<Layout style={{ height: "100vh", overflow: "auto" }}>
<Router>
<Header style={styles.header}>
<Logo />
<MenuItems />
<div style={styles.headerRight}>
<Chains />
<TokenPrice
address="0x1f9840a85d5af5bf1d1762f925bdaddc4201f984"
chain="eth"
image="https://cloudflare-ipfs.com/ipfs/QmXttGpZrECX5qCyXbBQiqgQNytVGeZW5Anewvh2jc4psg/"
size="40px"
/>
<NativeBalance />
<Account />
</div>
</Header>
<div style={styles.content}>
<Switch>
<Route exact path="/quickstart">
<QuickStart isServerInfo={isServerInfo} />
</Route>
<Route path="/wallet">
<Wallet />
</Route>
<Route path="/1inch">
<Tabs defaultActiveKey="1" style={{ alignItems: "center" }}>
<Tabs.TabPane tab={<span>Ethereum</span>} key="1">
<DEX chain="eth" />
</Tabs.TabPane>
<Tabs.TabPane tab={<span>Binance Smart Chain</span>} key="2">
<DEX chain="bsc" />
</Tabs.TabPane>
<Tabs.TabPane tab={<span>Polygon</span>} key="3">
<DEX chain="polygon" />
</Tabs.TabPane>
</Tabs>
</Route>
<Route path="/erc20balance">
<ERC20Balance />
</Route>
<Route path="/onramp">
<Ramper />
</Route>
<Route path="/erc20transfers">
<ERC20Transfers />
</Route>
<Route path="/nftBalance">
<NFTBalance />
</Route>
<Route path="/contract">
<Contract />
</Route>
<Route path="/">
<Redirect to="/quickstart" />
</Route>
<Route path="/ethereum-boilerplate">
<Redirect to="/quickstart" />
</Route>
<Route path="/nonauthenticated">
<>Please login using the "Authenticate" button</>
</Route>
</Switch>
</div>
</Router>
<Footer style={{ textAlign: "center" }}>
<Text style={{ display: "block" }}>
⭐️ Please visit our Flagship site!{" "}
<a
href="https://theancienthardware.com/"
target="_blank"
rel="noopener noreferrer"
>
here
</a>
, every new mystic makes us stronger, WAGMI!
</Text>
<Text style={{ display: "block" }}>
Questions? Ask them on the {""}
<a
target="_blank"
rel="noopener noreferrer"
href="https://discord.com/invite/8wy6GqCyTc"
>
Discord
</a>
</Text>
<Text style={{ display: "block" }}>
View the{" "}
<a
target="_blank"
rel="noopener noreferrer"
href="https://theancienthardware.com/about"
>
Whitepaper
</a>
</Text>
</Footer>
</Layout>
);
};
export const Logo = () => (
<div style={{ display: "flex" }}>
<svg
width="0"
height="o"
viewBox="0 0 50 38"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M43.6871 32.3986C43.5973 32.4884 43.53 32.5782 43.4402 32.6905C43.53 32.6007 43.5973 32.5109 43.6871 32.3986Z"
fill="black"
/>
<path
d="M49.7037 14.3715C49.5241 6.2447 42.7891 -0.17592 34.6624 0.00367768C31.0031 0.0934765 27.4784 1.53026 24.8294 4.06708C22.113 1.46291 18.4986 0.00367768 14.727 0.00367768C6.71246 0.00367768 0.202047 6.49164 0 14.5511V14.6633C0 20.8146 2.24497 26.2698 4.26545 30.0189C5.11853 31.5904 6.08387 33.117 7.13901 34.5762C7.5431 35.115 7.8574 35.564 8.10435 35.8559L8.39619 36.2151L8.48599 36.3273L8.50844 36.3498L8.53089 36.3722C10.2146 38.3253 13.1555 38.5498 15.1087 36.8886C15.1311 36.8661 15.1536 36.8437 15.176 36.8212C17.1291 35.0701 17.3312 32.0843 15.625 30.1087L15.6026 30.0638L15.423 29.8618C15.2658 29.6597 15.0189 29.3455 14.727 28.9414C13.9188 27.8189 13.178 26.6515 12.5269 25.4392C10.8881 22.4309 9.42888 18.6145 9.42888 14.7531C9.49623 11.8347 11.9432 9.52236 14.8617 9.58971C17.7128 9.65705 19.9802 11.9694 20.0251 14.8205C20.0476 15.5389 20.2272 16.2348 20.5415 16.8859C21.4844 19.3104 24.2232 20.5227 26.6478 19.5798C28.4438 18.8839 29.6336 17.1553 29.6561 15.2246V14.596C29.7683 11.6775 32.2153 9.38766 35.1562 9.47746C37.94 9.56726 40.1625 11.8122 40.2748 14.596C40.2523 17.6941 39.2645 20.7472 38.1421 23.1718C37.6931 24.1371 37.1992 25.08 36.6379 25.978C36.4359 26.3147 36.2787 26.5617 36.1665 26.6964C36.1216 26.7862 36.0767 26.8311 36.0542 26.8535L36.0318 26.876L35.9869 26.9433C37.6033 24.9004 40.5442 24.5412 42.5871 26.1576C44.4953 27.6617 44.9443 30.3781 43.6198 32.4211L43.6422 32.4435V32.3986L43.6647 32.3762L43.732 32.2864C43.7769 32.1966 43.8667 32.1068 43.9565 31.9721C44.1361 31.7027 44.3606 31.3435 44.6525 30.8945C45.3933 29.6822 46.0668 28.4026 46.673 27.1229C48.1097 24.0249 49.6812 19.5349 49.6812 14.5286L49.7037 14.3715Z"
fill="#041836"
/>
<path
d="M39.7135 25.1249C37.1094 25.1025 34.9991 27.2127 34.9766 29.8169C34.9542 32.4211 37.0645 34.5313 39.6686 34.5538C41.1503 34.5538 42.5647 33.8578 43.4626 32.6905C43.53 32.6007 43.5973 32.4884 43.6871 32.3986C45.1015 30.221 44.4729 27.3025 42.2953 25.9107C41.532 25.3943 40.634 25.1249 39.7135 25.1249Z"
fill="#B7E803"
/>
</svg>
</div>
);
export default App;
import { Card, Timeline, Typography } from "antd";
import React, { useMemo } from "react";
import { useMoralis } from "react-moralis";
const { Text } = Typography;
const styles = {
title: {
fontSize: "20px",
fontWeight: "700",
},
text: {
fontSize: "16px",
},
card: {
boxShadow: "0 0.5rem 1.2rem rgb(189 197 209 / 20%)",
border: "1px solid #e7eaf3",
borderRadius: "0.5rem",
},
timeline: {
marginBottom: "-45px",
},
};
export default function QuickStart({ isServerInfo }) {
const { Moralis } = useMoralis();
const isInchDex = useMemo(
() => (Moralis.Plugins?.oneInch ? true : false),
[Moralis.Plugins?.oneInch],
);
return (
<div style={{ display: "flex", gap: "10px" }}>
<Card
style={styles.card}
title={
<>
👣 <Text strong>How to join Esowood and start earning $ESPER</Text>
</>
}
>
<Timeline mode="left" style={styles.timeline}>
<Timeline.Item dot="👼">
<Text delete style={styles.text}>
Mint A Mystic{" "}
<a
href="https://opensea.io/assets/matic/0x2953399124f0cbb46d2cbacd8a89cf0599974963/94633657394553156014474030574821282325403449324061318292383064508494788956264"
target="_blank"
rel="noopener noreferrer"
>
MysticAwakens
</a>{" "}
</Text>
</Timeline.Item>
<Timeline.Item dot="👣">
<Text delete style={styles.text}>
Initiation <Text code>join discord</Text>
</Text>
</Timeline.Item>
<Timeline.Item dot="🧰">
<Text delete={isServerInfo} style={styles.text}>
Sign up for a free account on{" "}
<a
href="https://theancienthardware.com/"
target="_blank"
rel="noopener noreferrer"
>
TheAncientHardware
</a>
</Text>
</Timeline.Item>
<Timeline.Item dot="🧞♂️">
<Text delete={isServerInfo} style={styles.text}>
Add to pool on firebird (
<a
href="https://app.firebird.finance/farm/0x65daa38d53ef76312b573a7c98ba54c32783455c"
target="_blank"
rel="noopener noreferrer"
>
Start earning
</a>
)
</Text>
</Timeline.Item>
<Timeline.Item dot="👣">
<Text delete={isInchDex} style={styles.text}>
Get Active{" "}
<a
href="https://gather.town/app/xrWdl8dHF09B8Ia1/The%20Ancient%20Hardware"
target="_blank"
rel="noopener noreferrer"
>
TAH Gather
</a>{" "}
needed to join<Text code>{"<DelEsowood>"}</Text> metaverse
(optional)
</Text>
</Timeline.Item>
<Timeline.Item dot="👣">
<Text style={styles.text}>WAGMI!!!</Text>
</Timeline.Item>
</Timeline>
</Card>
<div>
<Card
style={styles.card}
title={
<>
☄️ <Text strong>Starting Primitive Quests (optional)</Text>
</>
}
>
<Timeline mode="left" style={styles.timeline}>
<Timeline.Item dot="👣">
<Text style={styles.text}>
Buy{" "}
<a
target="_blank"
rel="noopener noreferrer"
href="https://opensea.io/assets/matic/0x2953399124f0cbb46d2cbacd8a89cf0599974963/94633657394553156014474030574821282325403449324061318292383064550376230807552"
>
SoulOrb
</a>{" "}
and{" "}
<a
target="_blank"
rel="noopener noreferrer"
href="https://opensea.io/assets/matic/0x2953399124f0cbb46d2cbacd8a89cf0599974963/94633657394553156014474030574821282325403449324061318292383064551375742436328"
>
GCA
</a>{" "}
<Text code>send !loot in discord to passively earn NFTs</Text>
</Text>
</Timeline.Item>
</Timeline>
</Card>
<Card
style={{ marginTop: "10px", ...styles.card }}
title={
<>
💫{" "}
<Text strong> Connecting to Polygon Chain in the Modal, GM!</Text>
</>
}
>
<Timeline mode="left" style={styles.timeline}>
<Timeline.Item dot="👣">
<Text style={styles.text}>
Get{" "}
<a
target="_blank"
rel="noopener noreferrer"
href="https://opensea.io/assets/matic/0x2953399124f0cbb46d2cbacd8a89cf0599974963/94633657394553156014474030574821282325403449324061318292383064551375742436328"
>
GCA
</a>{" "}
and send a call in the <Text code>discord</Text> !loot
</Text>
</Timeline.Item>
<Timeline.Item dot="👣">
<Text style={styles.text}>
Connect your Wallet to Polygon and change Twitter PFP:{" "}
<Text code>Send Your Twitter In Discord With !ESPER </Text>
</Text>
</Timeline.Item>
</Timeline>
</Card>
</div>
</div>
);
}
I have cloned and cd into github.com/Huge/ethereum-boilerplate , npm install went ok, but npm build or start yield:
src/index.js Line 1:1: Import and export declarations are not supported yet node/no-unsupported-features/es-syntax Line 2:1: Import and export declarations are not supported yet node/no-unsupported-features/es-syntax Line 3:1: Import and export declarations are not supported yet node/no-unsupported-features/es-syntax and lot more those lines. Probably something noobish, can you please help me?
try npm install react-final-form
Thank I have tried that, and also tried https://solveforums.msomimaktaba.com/threads/solved-failed-to-load-config-prettier-to-extend-from-previous-reference-of-this-question-didnt-help.251914/#post-251923 , which lead me to try and delete all content of devDependencies, which after a few hours of tweaking solved it! I suppose it is something about linters, but weird that a linter would have stopped compilation…
This is not a code issue. This is a configuration and an install issue. Therefoere,
Try the following steps -
- Delete your
node_modulesfolder andyarn.lockfile and install again via yarn byyarn install - Try running the app again by
npm start - If the problem still persists, try deleting the
.eslintfile to see if linting is causing these errors.
Are you still facing the issue?
1 Like
Thanks for your reply, I know in the past, and using the 1inch API you can add an extra fee for your platform. Would be great if this could be added to the Plugin. Should I add it to the Moralis backlog?
I have tried to do something with this, and I wasn’t successful. If you can share basic details or code, I am happy to work with you on that.
One of the swap parameters is “fee” and can be used to collect a referral fee. I assume that this is what Moralis is doing when they collect the 1% transaction fee. I just wanted to know if there was a possibility to do it via the plugin or if I would have to use the 1inch API directly. It sounds like I have to use the 1inch API directly, just a shame as I would have liked to use the plugin. I don’t have a technical background so this is from a business point of view.
You must use the 1inch plugin outside of moralis to add your own fees, I have tried to use moralis “fee” parameter and the ethereum boilerplate freeze!
Hi! Having problems running the app in android emulator. This is the error :
Unable to make field private final java.lang.String java.io.File.path accessible: module java.base does not “opens java.io” to unnamed module @536b348b
As far as I’ve read it has something to do with the JDK. I’ve had 11.0.10 and changed to 17.0.2 . Is there a specific version I need to use?
Hi all,
I am new to Moralis.
I am running the Boilerplate on my server and it seems to work except for the Wallet transfer.
I am using the wallet to transfer some ETH to a test account on the Ropsten Test network.
The transaction is successful but I am getting an error.
Transfer.jsx:94 Uncaught (in promise) TypeError: txStatus.on is not a function at transfer
It is in the Transfer.jsx file, in the following code
const txStatus = await Moralis.transfer(options);
txStatus
.on("transactionHash", (hash) => {
openNotification({
message: "🔊 New Transaction",
description: `${hash}`,
});
console.log("🔊 New Transaction", hash);
})
.on("receipt", (receipt) => {
openNotification({
message: "📃 New Receipt",
description: `${receipt.transactionHash}`,
});
console.log("🔊 New Receipt: ", receipt);
setIsPending(false);
})
.on("error", (error) => {
openNotification({
message: "📃 Error",
description: `${error.message}`,
});
console.error(error);
setIsPending(false);
});
Thanks for your help.
Hey, my market tab is not showing the NFTs that I sold, everything works for me except the Explore Market tab
I’ve downloaded final version. Seems like it doesn’t fetch tokens from my smart contract?
Im using the Moralis boilerplate trying to deploy to the mumbai testnet using hardhat and I keap getting the error that the network isnt found. using moralis speedy nodes. There no reason why it shouldnt work. for some reason the module isnt being exported. I can only assume that its something in the build because of the fact that it defaults with truffle(why, when everyone uses hardhat for the logging functionality) A default setup for doing real deployments with hardhat would be nice, any help is much appreciated.
where this code go do you have sample with full code?
you didnt properly name mumbai in the network
this is a nice request
