Skip to content

Commit

Permalink
Merge pull request #372 from zkLinkProtocol/feat/agg-parade-end
Browse files Browse the repository at this point in the history
Feat/agg parade end
  • Loading branch information
zkcarter authored Dec 13, 2024
2 parents 8884d71 + ba187f8 commit 06ef3a7
Show file tree
Hide file tree
Showing 11 changed files with 835 additions and 647 deletions.
6 changes: 6 additions & 0 deletions public/img/arrow-check-announcement.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
57 changes: 1 addition & 56 deletions src/App.tsx
Original file line number Diff line number Diff line change
@@ -1,24 +1,12 @@
import { Suspense } from "react";
import { BrowserRouter, Route, Routes } from "react-router-dom";
import Header from "./components/Header";

import Home from "./pages/Home";
import Home from "./pages/Home/index-end";
import Toast from "./components/Toast";
import Countdown from "@/components/Countdown";
import styled from "styled-components";
import AggregationParade from "./pages/AggregationParade";
import Bridge from "@/pages/Bridge";
import Dashboard from "./pages/Dashboard";
import Leaderboard from "./pages/Leaderboard";
import About from "./pages/About/index2";
import UnwrapETH from "@/pages/UnwrapETH";
import DashboardS2 from "./pages/DashboardS2/index2";

// const AggregationParade = lazy(() => import("@/pages/AggregationParade"));
// const Dashboard = lazy(() => import("@/pages/AggregationParade/Dashboard"));
// const Leaderboard = lazy(() => import("@/pages/Leaderboard"));
// const About = lazy(() => import("@/pages/About"));
// const Bridge = lazy(() => import('@/pages/Bridge'))

const HideBox = styled.div`
position: absolute;
Expand All @@ -33,7 +21,6 @@ export default function App() {
<Header />

<Routes>
{/* <Route path="/" element={<Navigate to="/aggregation-parade" />} /> */}
<Route
path="/"
element={
Expand All @@ -59,49 +46,7 @@ export default function App() {
</Suspense>
}
/>
<Route
path="/dashboard"
element={
<Suspense fallback="">
<Dashboard />
</Suspense>
}
/>

<Route
path="/dashboard2"
element={
<Suspense fallback="">
<DashboardS2 />
</Suspense>
}
/>

<Route
path="/leaderboard"
element={
<Suspense fallback="">
<Leaderboard />
</Suspense>
}
/>

<Route
path="/about"
element={
<Suspense fallback="">
<About />
</Suspense>
}
/>
<Route
path="/bridge"
element={
<Suspense fallback="">
<Bridge />
</Suspense>
}
/>
<Route
path="/unwrap"
element={
Expand Down
127 changes: 18 additions & 109 deletions src/components/DashboardS2/Tabs/Protfolio.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -477,29 +477,6 @@ export default function Portfolio({
<div className="md:flex justify-between items-center">
<div className="flex justify-between items-center gap-[16px]">
<Title className="text-[24px] md:text-[32px]">Your Nova Points</Title>
<Tooltip
classNames={{
content: "w-[350px] rounded-lg bg-[#151923] text-white px-4 py-5",
}}
content={
<div className="max-w-[20rem]">
<h4 className="font-[700] text-[0.875rem] leading-[1.3755rem]">
Loyalty Booster
</h4>
<p className="mt-[0.75rem] font-[400] text-[0.875rem] leading-[1.3755rem]">
An extra boost for Loyalty users,tied with days in the
Aggregation parade (capped at 50%):
<br />
<br />
Loyalty Booster = min(50%, 0.5%*days joined)
</p>
</div>
}
>
<PointsBox className="text-[14px] font-[900]">
+{royaltyBoosterPencentage}
</PointsBox>
</Tooltip>
</div>

<div className="hidden md:flex items-center gap-[12px]">
Expand Down Expand Up @@ -541,28 +518,24 @@ export default function Portfolio({
}}
content={
<div>
{epochActive !== epochList.length - 1 && (
<div>
<>
<div className="mb-[16px] text-[14px] font-[700]">
Sector in {epochList[epochActive].name}
</div>
<PointsPopoverContent
data={[
{
name: "Total Allocated Points",
points: item.sectorTotalPoints,
},
{
name: "Total Allocated $ZKL",
points: item.zkl,
},
]}
/>
<div className="my-[24px] w-full h-[1px] bg-[#999]"></div>
</>
<div>
<div className="mb-[16px] text-[14px] font-[700]">
Sector in {epochList[epochActive].name}
</div>
)}
<PointsPopoverContent
data={[
{
name: "Total Allocated Points",
points: item.sectorTotalPoints,
},
{
name: "Total Allocated $ZKL",
points: item.zkl,
},
]}
/>
<div className="my-[24px] w-full h-[1px] bg-[#999]"></div>
</div>

<div className="mb-[16px] text-[14px] font-[700]">
Your Sector Points in {epochList[epochActive].name}
Expand Down Expand Up @@ -622,71 +595,7 @@ export default function Portfolio({
</div>
</div>
<div className="divide my-12"></div>
<div className="mb-[18px] flex items-center justify-center md:justify-between">
<Title className="text-[24px] md:text-[32px">Your Project Points</Title>
<div className="view-more hidden md:flex" onClick={handleViewMore}>
<span className="mr-2 text-[#FbFbFb]/[0.6]">{`Hide Points < 0.1`}</span>
<Checkbox
defaultSelected
radius="none"
isSelected={checked}
onValueChange={setChecked}
></Checkbox>
</div>
</div>
<div className="overflow-x-auto">
<List className="min-w-[900px]">
<div className="list-content">
{projectPointsList.map((item, index) => (
<div className="row mb-[24px] flex items-center" key={index}>
<div className="list-content-item flex col-2 items-center gap-[10px]">
{item?.iconURL && (
<img
src={item?.iconURL}
alt=""
className="w-[55px] h-[56px] rounded-full block"
/>
)}
<div>
<div className="symbol flex items-center">
<span className="mr-1">{item?.eigenlayerName}</span>
</div>
</div>
</div>
<div className="col-line"></div>

<div className="list-content-item flex col-3 flex items-center gap-[12px] text-center">
<span className="text-gray">{item.pointsName}</span>
<PointsBox>
{formatNumberWithUnit(item?.pointsValue)}
</PointsBox>
</div>
<div className="col-line"></div>

<div className="list-content-item flex col-3 flex items-center gap-[12px] text-center">
<span className="text-gray">
{item.eigenlayerName} Eigenlayer Points
</span>
<PointsBox>
{formatNumberWithUnit(item?.eigenlayerValue)}
</PointsBox>
</div>
<div className="col-line"></div>

<a
className="list-content-item flex col-2 justify-center items-center gap-[10px]"
href={item.link}
target="_blank"
>
<span className="participate">Participate</span>
<img src="img/icon-link-arrow.svg" alt="" />
</a>
</div>
))}
</div>
</List>
</div>
<div className="divide my-12"></div>

<div className="flex items-center justify-center md:justify-between mb-5">
<Title className="text-[24px] md:text-[32px]">Your Nova NFTs</Title>
</div>
Expand Down
64 changes: 11 additions & 53 deletions src/components/Header.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -457,7 +457,10 @@ export default function Header() {
{/* <NavBox> */}
<NavbarContent className="hidden md:flex" justify="center">
<NavbarItem>
<NavLink to="/aggregation-parade" className="nav-link">
<NavLink
to={isActiveUser ? "/aggregation-parade" : "/"}
className="nav-link"
>
Aggregation Parade
</NavLink>
</NavbarItem>
Expand All @@ -484,16 +487,7 @@ export default function Header() {
NovaDrop🔥
</a>
</NavbarItem>
<NavbarItem>
<NavLink to="/leaderboard" className={"nav-link"}>
Leaderboard
</NavLink>
</NavbarItem>
<NavbarItem>
<NavLink to="/bridge" className={"nav-link"}>
Bridge
</NavLink>
</NavbarItem>

<NavbarItem>
<a
href="https://zk.link/governance"
Expand All @@ -503,11 +497,6 @@ export default function Header() {
Governance
</a>
</NavbarItem>
<NavbarItem>
<NavLink to="/about" className={"nav-link"}>
About
</NavLink>
</NavbarItem>

<Dropdown>
<NavbarItem>
Expand Down Expand Up @@ -537,14 +526,7 @@ export default function Header() {
<DropdownItem key="unwrap">
<NavLink to="/unwrap">Unwrap ETH</NavLink>
</DropdownItem>
<DropdownItem key="user-guide">
<a
href="https://blog.zk.link/user-onboarding-guide-zklink-nova-aggregation-parade-07861acb48e7"
target="_blank"
>
User Guide
</a>
</DropdownItem>

<DropdownItem key="user-guide">
<a href="https://explorer.zklink.io/" target="_blank">
Explorer
Expand Down Expand Up @@ -756,7 +738,10 @@ export default function Header() {
<NavbarMenuItem
isActive={location.pathname === "/aggregation-parade"}
>
<NavLink to="/aggregation-parade" className="nav-link block">
<NavLink
to={isActiveUser ? "/aggregation-parade" : "/"}
className="nav-link block"
>
Aggregation Parade
</NavLink>
</NavbarMenuItem>
Expand All @@ -779,11 +764,6 @@ export default function Header() {
</Tooltip>
)}
</NavbarMenuItem> */}
<NavbarMenuItem isActive={location.pathname === "/leaderboard"}>
<NavLink to="/leaderboard" className="block">
Leaderboard
</NavLink>
</NavbarMenuItem>

<NavbarMenuItem>
<a
Expand All @@ -795,18 +775,6 @@ export default function Header() {
</a>
</NavbarMenuItem>

<NavbarMenuItem isActive={location.pathname === "/about"}>
<NavLink to="/about" className="block">
About
</NavLink>
</NavbarMenuItem>

<NavbarMenuItem isActive={location.pathname === "/bridge"}>
<NavLink to="/bridge" className="block">
Bridge
</NavLink>
</NavbarMenuItem>

<Dropdown>
<NavbarMenuItem>
<DropdownTrigger>
Expand Down Expand Up @@ -847,17 +815,7 @@ export default function Header() {
</NavLink>
</NavbarMenuItem>
</DropdownItem>
<DropdownItem key="user-guide">
<NavbarMenuItem>
<a
href="https://blog.zk.link/user-onboarding-guide-zklink-nova-aggregation-parade-07861acb48e7"
target="_blank"
className="block"
>
User Guide
</a>
</NavbarMenuItem>
</DropdownItem>

<DropdownItem key="user-guide">
<NavbarMenuItem>
<a
Expand Down
8 changes: 0 additions & 8 deletions src/components/ReferralModal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -100,14 +100,6 @@ const ReferralModal = () => {

return (
<>
<ReferralButton onClick={modal.onOpen} className="hidden md:block">
<img
src="/img/icon-invite-btn.png"
alt=""
className="absolute bottom-0 right-[48px] w-[37px]"
/>
<span className="relative z-1">Your Invite Code: {invite?.code}</span>
</ReferralButton>
<ModalContainer
classNames={{ closeButton: "hidden" }}
size="md"
Expand Down
12 changes: 10 additions & 2 deletions src/constants/epoch.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,14 @@ export const epochList = [
time: "Snapshot taken on July 15, 2024, at 12:00 PM UTC",
season: 2,
},
{ name: "Epoch Two", season: 3 },
{ name: "Epoch Three", season: 4 },
{
name: "Epoch Two",
season: 3,
time: "Snapshot taken on August 31, 2024, at 12:00 PM UTC",
},
{
name: "Epoch Three",
season: 4,
time: "Snapshot taken on December 13, 2024, at 10 AM UTC",
},
];
Loading

0 comments on commit 06ef3a7

Please sign in to comment.