Skip to content

Commit

Permalink
Next mig start point
Browse files Browse the repository at this point in the history
  • Loading branch information
sdkayy committed Feb 3, 2023
1 parent 115b3f1 commit a19faf2
Show file tree
Hide file tree
Showing 23 changed files with 350 additions and 56 deletions.
5 changes: 5 additions & 0 deletions next.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
const nextConfig = {
/* config options here */
};

module.exports = nextConfig;
8 changes: 4 additions & 4 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@
"ethers": "^5.7.0",
"framer-motion": "^7.2.1",
"lodash": "^4.17.21",
"next": "^13.1.6",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-icons": "^4.4.0",
Expand All @@ -30,10 +31,9 @@
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
"dev": "next dev",
"build": "next build",
"start": "next start"
},
"eslintConfig": {
"extends": [
Expand Down
File renamed without changes
File renamed without changes
33 changes: 19 additions & 14 deletions src/components/Leaderboard.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -65,20 +65,25 @@ export default function Leaderboard() {
</div>
)}
<table className="leaderboard">
{nfts.length > 0 && (
<TableHeader sortBy={sortBy} setSortBy={setSortBy} />
)}
{nfts.map((nft) => {
return (
<Row
nft={nft}
ensName={nft.ensName}
version={lastSyncVersion}
ownerAddress={nft.owner}
refetch={refetch}
/>
);
})}
<thead>
{nfts.length > 0 && (
<TableHeader sortBy={sortBy} setSortBy={setSortBy} />
)}
</thead>
<tbody>
{nfts.map((nft) => {
return (
<Row
key={`leaderboardnft-${nft.tokenId}`}
nft={nft}
ensName={nft.ensName}
version={lastSyncVersion}
ownerAddress={nft.owner}
refetch={refetch}
/>
);
})}
</tbody>
</table>
{count > DEFAULT_ROWS_PER_PAGE && (
<Footer
Expand Down
2 changes: 1 addition & 1 deletion src/components/LoadingCore.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ export default function LoadingCore({
{isLoading && (
<svg
aria-hidden="true"
class={`${
className={`${
style ? style : "mr-2 w-[7rem] mt-3 mb-4 h-20"
} text-gray-200 animate-spin dark:text-gray-600`}
viewBox="0 0 100 101"
Expand Down
2 changes: 1 addition & 1 deletion src/components/LoadingInplace.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ export default function LoadingInplace({ isLoading, style }) {
<div className="loader2">
<div role="status">
<LoadingCore style={style} isLoading />
<span class="sr-only">Loading...</span>
<span className="sr-only">Loading...</span>
</div>
</div>
)}
Expand Down
8 changes: 4 additions & 4 deletions src/components/Menu.jsx
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import { MenuOutlined } from "@ant-design/icons";
import { Button, Menu, MenuButton, MenuItem, MenuList } from "@chakra-ui/react";
import { useRouter } from "next/router";
import React from "react";
import { useNavigate } from "react-router-dom";
import { DOCS_URL } from "../consts/consts";

export default function MenuCustom() {
const navigate = useNavigate();
const router = useRouter();

const MENU_ITEM_STYLE = {
backgroundColor: "black",
Expand All @@ -17,12 +17,12 @@ export default function MenuCustom() {
<MenuOutlined style={{ height: "1.5rem" }} />
</MenuButton>
<MenuList style={{ backgroundColor: "black" }}>
<MenuItem style={MENU_ITEM_STYLE} onClick={() => navigate("/")}>
<MenuItem style={MENU_ITEM_STYLE} onClick={() => router.push("/")}>
Home
</MenuItem>
<MenuItem
style={MENU_ITEM_STYLE}
onClick={() => navigate("/leaderboard")}
onClick={() => router.push("/leaderboard")}
>
Leaderboard
</MenuItem>
Expand Down
27 changes: 21 additions & 6 deletions src/components/Navbar.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -28,18 +28,33 @@ export default function Navbar() {
borderBottom: "0.02rem solid #1f2937",
}}
>
<div className="flex md:gap-16 items-center justiy-center cursor-pointer">
<div className="flex items-center cursor-pointer md:gap-16 justiy-center">
<Logo />
{isSafetyModeActivated && <SafetyModeWarning />}
</div>
<div className="gap-2 flex items-center justify-center">
<div
className="flex items-center justify-center gap-2"
suppressHydrationWarning
>
{isConnected && (
<div className="hidden lg:flex gap-8 items-center justify-center mr-6">
<Stat name="TVL" value={formatUSD(ethInPool * ethPrice)} />
<div className="items-center justify-center hidden gap-8 mr-6 lg:flex">
<Stat
name="TVL"
value={formatUSD(ethInPool * ethPrice)}
suppressHydrationWarning
/>
<Divider />
<Stat name="ETH Price Δ" value={formatUSD(ethDelta)} />
<Stat
name="ETH Price Δ"
value={formatUSD(ethDelta)}
suppressHydrationWarning
/>
<Divider />
<Stat name="CR" value={`${round(cr, 0)}%`} />
<Stat
name="CR"
value={`${round(cr, 0)}%`}
suppressHydrationWarning
/>
<Divider />
</div>
)}
Expand Down
12 changes: 8 additions & 4 deletions src/components/NavbarLogo.jsx
Original file line number Diff line number Diff line change
@@ -1,10 +1,14 @@
import logo from "../static/dyad-logo.svg";
import { useNavigate } from "react-router-dom";
import { useRouter } from "next/router";

export default function NavbarLogo() {
let navigate = useNavigate();
let router = useRouter();

return (
<img src={logo} alt="logo" className="w-14" onClick={() => navigate("/")} />
<img
src={"./dyad-logo.svg"}
alt={"logo"}
className="w-14"
onClick={() => router.push("/")}
/>
);
}
1 change: 1 addition & 0 deletions src/components/Pagination.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ export default function CustomPagination({ totalRows, rowsPerPage, setRange }) {
function renderPage(i) {
return (
<div
key={`pagination-${i}`}
className={`${
i !== "..." &&
"border-[1px] border-white pl-1 pr-1 hover:cursor-pointer"
Expand Down
4 changes: 2 additions & 2 deletions src/components/ProgressBar.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ export default function ProgressBar({ percent, fullWidth = false }) {
{colors && (
<div
data-tip={`${round(percent, 2)}%` || "0%"}
class={`w-[6rem] border-2 border-[#737E76] min-w-[${
className={`w-[6rem] border-2 border-[#737E76] min-w-[${
fullWidth ? "100%" : "6rem"
}] max-w-[6rem] pr-[2px]`}
style={{
Expand All @@ -38,7 +38,7 @@ export default function ProgressBar({ percent, fullWidth = false }) {
width: `${isNaN(percent) ? 0 : percent > 100 ? 100 : percent}%`,
backgroundColor: colors[0],
}}
class={`stripes m-[1px] h-[0.5rem] `}
className={`stripes m-[1px] h-[0.5rem] `}
></div>
</div>
)}
Expand Down
22 changes: 11 additions & 11 deletions src/components/Skeletion.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,11 @@ export default function Skeleton() {
return (
<div
role="status"
class="md:w-[70rem] space-y-8 animate-pulse md:space-y-0 md:space-x-8 md:flex md:items-center"
className="md:w-[70rem] space-y-8 animate-pulse md:space-y-0 md:space-x-8 md:flex md:items-center"
>
<div class="flex justify-center items-center w-20 h-10 bg-gray-300 rounded sm:w-20 dark:bg-gray-700">
<div className="flex items-center justify-center w-20 h-10 bg-gray-300 rounded sm:w-20 dark:bg-gray-700">
<svg
class="w-8 h-8 text-gray-200"
className="w-8 h-8 text-gray-200"
xmlns="http://www.w3.org/2000/svg"
aria-hidden="true"
fill="currentColor"
Expand All @@ -15,15 +15,15 @@ export default function Skeleton() {
<path d="M480 80C480 35.82 515.8 0 560 0C604.2 0 640 35.82 640 80C640 124.2 604.2 160 560 160C515.8 160 480 124.2 480 80zM0 456.1C0 445.6 2.964 435.3 8.551 426.4L225.3 81.01C231.9 70.42 243.5 64 256 64C268.5 64 280.1 70.42 286.8 81.01L412.7 281.7L460.9 202.7C464.1 196.1 472.2 192 480 192C487.8 192 495 196.1 499.1 202.7L631.1 419.1C636.9 428.6 640 439.7 640 450.9C640 484.6 612.6 512 578.9 512H55.91C25.03 512 .0006 486.1 .0006 456.1L0 456.1z" />
</svg>
</div>
<div class="w-full">
<div class="h-2.5 bg-gray-200 rounded-full dark:bg-gray-700 w-48 mb-4"></div>
<div class="h-2 bg-gray-200 rounded-full dark:bg-gray-700 max-w-[480px] mb-2.5"></div>
<div class="h-2 bg-gray-200 rounded-full dark:bg-gray-700 mb-2.5"></div>
<div class="h-2 bg-gray-200 rounded-full dark:bg-gray-700 max-w-[440px] mb-2.5"></div>
<div class="h-2 bg-gray-200 rounded-full dark:bg-gray-700 max-w-[460px] mb-2.5"></div>
<div class="h-2 bg-gray-200 rounded-full dark:bg-gray-700 max-w-[360px]"></div>
<div className="w-full">
<div className="h-2.5 bg-gray-200 rounded-full dark:bg-gray-700 w-48 mb-4"></div>
<div className="h-2 bg-gray-200 rounded-full dark:bg-gray-700 max-w-[480px] mb-2.5"></div>
<div className="h-2 bg-gray-200 rounded-full dark:bg-gray-700 mb-2.5"></div>
<div className="h-2 bg-gray-200 rounded-full dark:bg-gray-700 max-w-[440px] mb-2.5"></div>
<div className="h-2 bg-gray-200 rounded-full dark:bg-gray-700 max-w-[460px] mb-2.5"></div>
<div className="h-2 bg-gray-200 rounded-full dark:bg-gray-700 max-w-[360px]"></div>
</div>
<span class="sr-only">Loading...</span>
<span className="sr-only">Loading...</span>
</div>
);
}
2 changes: 1 addition & 1 deletion src/hooks/useAvgMintedFromIndexer.js
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ export default function useAvgMintedFromIndexer() {
.eq("version_id", lastSyncVersion)
.then((res) => {
let minted = [];
res.data.forEach((nft) => {
res?.data?.forEach((nft) => {
minted.push(parseInt(nft.deposit) + parseInt(nft.withdrawn));
});
setAvgMinted(minted.reduce((a, b) => a + b, 0) / minted.length);
Expand Down
2 changes: 1 addition & 1 deletion src/hooks/useMinXpFromIndexer.js
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ export default function useXpMinFromIndexer() {
})
.limit(1)
.then((res) => {
setMinXp(res.data[0].xp);
setMinXp(res?.data?.[0]?.xp);
});
}, [lastSyncVersion]);

Expand Down
8 changes: 4 additions & 4 deletions src/hooks/useNftSyncSimulation.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,11 +7,11 @@ import dnftABI from "../abi/dNFT.json";
import { CONTRACT_POOL, CONTRACT_dNFT } from "../consts/contract";
import { useAccount } from "wagmi";

const TENDERLY_FORK_API = `https://api.tenderly.co/api/v1/account/${process.env.REACT_APP_TENDERLY_USER}/project/${process.env.REACT_APP_TENDERLY_PROJECT}/fork`;
const TENDERLY_FORK_API = `https://api.tenderly.co/api/v1/account/${process.env.NEXT_PUBLIC_TENDERLY_USER}/project/${process.env.NEXT_PUBLIC_TENDERLY_PROJECT}/fork`;

const opts = {
headers: {
"X-Access-Key": process.env.REACT_APP_TENDERLY_ACCESS_KEY,
"X-Access-Key": process.env.NEXT_PUBLIC_TENDERLY_ACCESS_KEY,
},
};

Expand All @@ -27,7 +27,7 @@ export default function useNftSyncSimulation(tokenId) {

setIsLoading(true);
const gp = new ethers.providers.JsonRpcProvider(
`https://${CURRENT_NETWORK}.infura.io/v3/${process.env.REACT_APP_INFURA_KEY}`
`https://${CURRENT_NETWORK}.infura.io/v3/${process.env.NEXT_PUBLIC_INFURA_KEY}`
);
const blockNumber = await gp.getBlockNumber();
const body = {
Expand Down Expand Up @@ -69,7 +69,7 @@ export default function useNftSyncSimulation(tokenId) {
setNftAfterSimulation(res);
setIsLoading(false);

const TENDERLY_FORK_ACCESS_URL = `https://api.tenderly.co/api/v1/account/${process.env.REACT_APP_TENDERLY_USER}/project/${process.env.REACT_APP_TENDERLY_PROJECT}/fork/${forkId}`;
const TENDERLY_FORK_ACCESS_URL = `https://api.tenderly.co/api/v1/account/${process.env.NEXT_PUBLIC_TENDERLY_USER}/project/${process.env.NEXT_PUBLIC_TENDERLY_PROJECT}/fork/${forkId}`;
await axios.delete(TENDERLY_FORK_ACCESS_URL, opts);
}
updateXP();
Expand Down
20 changes: 20 additions & 0 deletions src/pages/_app.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
import React from "react";
import { client, chains } from "../utils/wagmi-config";
import { ChakraProvider } from "@chakra-ui/react";
import { RainbowKitProvider } from "@rainbow-me/rainbowkit";
import { WagmiConfig } from "wagmi";
import "../App.css";
import "../index.css";
import "@rainbow-me/rainbowkit/styles.css";

export default function MyApp({ Component, pageProps }) {
return (
<ChakraProvider>
<WagmiConfig client={client}>
<RainbowKitProvider chains={chains}>
<Component {...pageProps} />
</RainbowKitProvider>
</WagmiConfig>
</ChakraProvider>
);
}
29 changes: 29 additions & 0 deletions src/pages/_document.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
import Document, { Html, Head, Main, NextScript } from "next/document";

class MyDocument extends Document {
static async getInitialProps(ctx) {
const initialProps = await Document.getInitialProps(ctx);
return { ...initialProps };
}

render() {
return (
<Html>
<Head>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Inconsolata&display=swap"
rel="stylesheet"
/>
</Head>
<body className={"antialiased"} id={"modalBody"}>
<Main />
<NextScript />
</body>
</Html>
);
}
}

export default MyDocument;
41 changes: 41 additions & 0 deletions src/pages/index.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
import Home from "../components/Home";
import Navbar from "../components/Navbar";
import Footer from "../components/Footer";
import { CURRENT_NETWORK } from "../consts/consts";
import Button from "../components/Button";
import { useAccount, useNetwork, useSwitchNetwork } from "wagmi";

export default function App() {
const { isConnected } = useAccount();
const { chain } = useNetwork();
const { switchNetwork } = useSwitchNetwork();

return (
<>
<div className="font-serif font-bold text-white page-container content-wrap">
<Navbar />
{isConnected ? (
<>
{chain.id === CURRENT_NETWORK.id ? (
<div className="flex flex-col ">
<Home />
</div>
) : (
<div className="flex justify-center gap-2 mt-10">
Please switch to the {CURRENT_NETWORK.name} Network!
<Button onClick={() => switchNetwork(CURRENT_NETWORK.id)}>
Switch
</Button>
</div>
)}
</>
) : (
<div className="flex justify-center mt-10">Connect your wallet!</div>
)}
<div className="footer">
<Footer />
</div>
</div>
</>
);
}
Loading

0 comments on commit a19faf2

Please sign in to comment.