Skip to content

Commit

Permalink
chore: code review
Browse files Browse the repository at this point in the history
  • Loading branch information
@beyond009
beyond009 committed May 6, 2024
1 parent f557231 commit c437841
Show file tree
Hide file tree
Showing 12 changed files with 64 additions and 246 deletions.
2 changes: 1 addition & 1 deletion src/app/layout.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ export default function RootLayout({
}>) {
return (
<html lang="en">
<body className={inter.className + ' relative'}>
<body className={`${inter.className} relative`}>
<Providers>
<Header />
<div className="flex min-h-screen w-full justify-center bg-black">{children}</div>
Expand Down
25 changes: 0 additions & 25 deletions src/components/ClaimReward/index.tsx
View file

This file was deleted.

4 changes: 2 additions & 2 deletions src/components/Header/NavTabs.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,14 +11,14 @@ const navigation = [
{ name: 'About', path: '/about' },
];

export interface NavigationHeaderProps {}
export interface NavigationHeaderProps { }

export function NavTabs() {
const pathname = usePathname();
return (
<nav className="full ml-[32px] hidden items-center gap-[36px] lg:flex" aria-label="Global">
{navigation.map((item) => (
<div className="flex flex-col gap-[1px]">
<div className="flex flex-col gap-[1px]" key={item.path}>
<Link
className={`text-[14px] font-bold leading-[16px] ${pathname === item.path ? 'text-neutrals1' : 'text-neutrals5'} transition-colors duration-200 hover:text-neutrals1`}
key={item.path}
Expand Down
2 changes: 1 addition & 1 deletion src/components/Header/NavTabsMobile.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ export function NavTabsMobile() {
return (
<nav className="absolute mt-[128px] flex flex-col gap-[36px] self-start lg:hidden" aria-label="Global">
{navigation.map((item) => (
<div className="flex h-[64px] items-center gap-[30px]">
<div className="flex h-[64px] items-center gap-[30px]" key={item.path}>
<div
className={`h-full w-[2px]`}
style={{ background: pathname === item.path ? 'var(--line-purple)' : 'transparent' }}
Expand Down
24 changes: 0 additions & 24 deletions src/components/Header/ProfileInfo.tsx
View file

This file was deleted.

7 changes: 3 additions & 4 deletions src/components/ProjectDetailCard/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,9 +11,10 @@ import Ton from '@/assets/logos/ton.svg';
import RightArrow from '@/assets/rightArrow.svg';
import { MainButton } from '@/components/MainButton.js';
import { publicClient } from '@/configs/wagmiClient.js';
import { IS_TESTNET, POOL_ID, STAKE_MANAGER_CONTRACT } from '@/constants/index.js';
import { CHAIN_ID, IS_TESTNET, POOL_ID, STAKE_MANAGER_CONTRACT } from '@/constants/index.js';
import { Image } from '@/esm/Image.js';
import { stakeAPI } from '@/providers/StakeAPI.js';
import { sepolia, mainnet } from 'wagmi';

interface ProjectCardProps {
setIsOpen: (isOpen: boolean) => void;
Expand All @@ -36,7 +37,7 @@ export function ProjectDetailCard({ setIsOpen }: ProjectCardProps) {
args: [BigInt(POOL_ID)],
});

const startTimeStamp = await publicClient({ chainId: IS_TESTNET ? 11155111 : 1 }).getBlock({
const startTimeStamp = await publicClient({ chainId: CHAIN_ID }).getBlock({
blockNumber: res[0],
});
const endTimeStamp = Number(res[1] - res[0]) * 12 + Number(startTimeStamp.timestamp);
Expand Down Expand Up @@ -114,7 +115,6 @@ export function ProjectDetailCard({ setIsOpen }: ProjectCardProps) {
}}
>
<div className="text-[32px] font-semibold text-neutrals8">
{' '}
{Math.floor(apyInfo?.data?.apy) || 0}%
</div>
<div className="text-[14px] font-bold text-neutrals6">APY</div>
Expand All @@ -127,7 +127,6 @@ export function ProjectDetailCard({ setIsOpen }: ProjectCardProps) {
}}
>
<div className="flex items-center gap-[4px] text-[32px] font-semibold text-neutrals8">
{' '}
{Math.floor(apyInfo?.data?.amount) || 0}
<Mask width={36} height={36} />
</div>
Expand Down
76 changes: 38 additions & 38 deletions src/components/StakeCard/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,46 +11,46 @@ import { STAKE_MANAGER_CONTRACT } from '@/constants/index.js';
import { Image } from '@/esm/Image.js';

interface StakeCardProps {
setIsOpen: (isOpen: boolean) => void;
setIsOpen: (isOpen: boolean) => void;
}

export function StakeCard({ setIsOpen }: StakeCardProps) {
const { address } = useAccount();
const { data, isLoading, isError } = useQuery({
queryKey: ['stake'],
queryFn: async () => {
if (!address) return {};
const [stakeAmount, poolId] = await readContract({
...STAKE_MANAGER_CONTRACT,
functionName: 'userInfos',
args: [address],
});
return { stakeAmount, poolId };
},
});
const { address } = useAccount();
const { data, isLoading, isError } = useQuery({
queryKey: ['stake', address],
queryFn: async () => {
if (!address) return;
const [stakeAmount, poolId] = await readContract({
...STAKE_MANAGER_CONTRACT,
functionName: 'userInfos',
args: [address],
});
return { stakeAmount, poolId };
},
});

return (
<div className="relative flex h-[196px] flex-col rounded-[16px] border-[1px] border-neutrals6 p-[16px]">
<Image
src="/glow.png"
width={360}
height={230}
alt="right"
className="absolute left-[-35px] top-[-30px] z-50"
/>
<div className="text-[20px] font-bold text-white">Staked MASK</div>
<div className="w-full text-center text-[48px] leading-[48px] text-white ">
{data?.stakeAmount ? formatEther(data.stakeAmount) : 0}
</div>
<div className="mb-[12px] w-full text-center text-[16px] text-white">+3 Points/h</div>
<MainButton
onClick={() => {
setIsOpen(true);
}}
>
<MASK width={16} height={16} />
Stake MASK
</MainButton>
</div>
);
return (
<div className="relative flex h-[196px] flex-col rounded-[16px] border-[1px] border-neutrals6 p-[16px]">
<Image
src="/glow.png"
width={360}
height={230}
alt="right"
className="absolute left-[-35px] top-[-30px] z-50"
/>
<div className="text-[20px] font-bold text-white">Staked MASK</div>
<div className="w-full text-center text-[48px] leading-[48px] text-white ">
{data?.stakeAmount ? formatEther(data.stakeAmount) : 0}
</div>
<div className="mb-[12px] w-full text-center text-[16px] text-white">+3 Points/h</div>
<MainButton
onClick={() => {
setIsOpen(true);
}}
>
<MASK width={16} height={16} />
Stake MASK
</MainButton>
</div>
);
}
40 changes: 0 additions & 40 deletions src/components/StakeModal/StakeTokenInput/SelectLockTime.tsx
View file

This file was deleted.

46 changes: 14 additions & 32 deletions src/components/StakeModal/StakeTokenInput/Stake.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import { readContract, waitForTransaction, writeContract } from 'wagmi/actions';

import { InputPanel } from '@/components/StakeModal/StakeTokenInput/InputPanel.js';
import { publicClient } from '@/configs/wagmiClient.js';
import { IS_TESTNET, MASK_TOKEN_CONTRACT, POOL_ID, STAKE_MANAGER_CONTRACT } from '@/constants/index.js';
import { CHAIN_ID, IS_TESTNET, MASK_TOKEN_CONTRACT, POOL_ID, STAKE_MANAGER_CONTRACT } from '@/constants/index.js';
import { stakeAPI } from '@/providers/StakeAPI.js';

export function Stake() {
Expand All @@ -18,7 +18,7 @@ export function Stake() {
const [allowanceSet, setAllowanceSet] = useState(BigInt(0));

const { data: allowanceFetch } = useSuspenseQuery({
queryKey: ['allowance'],
queryKey: ['allowance', address],
queryFn: async () => {
if (!address) return BigInt(0);
const res = await readContract({
Expand All @@ -31,7 +31,7 @@ export function Stake() {
});

const { data: balance } = useQuery({
queryKey: ['balance'],
queryKey: ['balance', address],
queryFn: async () => {
if (!address) return '0';
const res = await readContract({
Expand All @@ -44,7 +44,7 @@ export function Stake() {
});

const { data: apyInfo } = useQuery({
queryKey: ['poolinfo', 'apy'],
queryKey: ['poolinfo', 'apy', POOL_ID],
queryFn: async () => {
const res = stakeAPI.getPoolInfo(POOL_ID);
return res;
Expand All @@ -59,7 +59,7 @@ export function Stake() {
args: [BigInt(POOL_ID)],
});

const startTimeStamp = await publicClient({ chainId: IS_TESTNET ? 11155111 : 1 }).getBlock({
const startTimeStamp = await publicClient({ chainId: CHAIN_ID }).getBlock({
blockNumber: res[0],
});
const endTimeStamp = Number(res[1] - res[0]) * 12 + Number(startTimeStamp.timestamp);
Expand All @@ -71,38 +71,21 @@ export function Stake() {
});

const allowance = allowanceFetch || allowanceSet;
console.log('allowance', allowance, parseEther(amount));

return (
<>
<InputPanel amount={amount} setAmount={setAmount} balance={balance} />
{/* <SelectLockTime setLockTime={setLockTime} lockTime={lockTime} /> */}
<div className="flex items-center justify-between text-[16px] text-neutrals4">
<div>Unlock MASK Time</div>
<div className="font-bold text-secondary3">
{poolInfo ? dayjs(poolInfo.endTime).format('HH:MM MM/DD/YYYY') : null}
</div>
</div>
{poolInfo ?
<div className="flex items-center justify-between text-[16px] text-neutrals4">
<div>Unlock MASK Time</div>
<div className="font-bold text-secondary3">
{dayjs(poolInfo.endTime).format('HH:MM MM/DD/YYYY')}
</div>
</div> : null}
<div className="flex items-center justify-between text-[16px] text-neutrals4">
<div>APY</div>
<div className="font-bold"> {Math.floor(apyInfo?.data?.apy) || 0}%</div>
</div>
{/*
<div className="flex items-center justify-between text-[16px] text-neutrals4 ">
<div>Display X accounts in the staking leaderboard</div>
<Switch checked={showX} onChange={setShowX}>
{({ checked }) => (
<button
className={`${checked ? 'bg-primary4' : 'bg-neutrals4'
} relative inline-flex w-[64px] items-center rounded-[32px] p-[4px]`}
>
<span
className={`${checked ? 'translate-x-8' : 'translate-x-0'
} inline-block h-[24px] w-[24px] transform rounded-full bg-neutrals8 transition`}
/>
</button>
)}
</Switch>
</div> */}
<div className="text-[16px] text-primary3">
MASK Staking is exclusively open to individual users (excluding users listed in the{' '}

Check warning on line 90 in src/components/StakeModal/StakeTokenInput/Stake.tsx

View workflow job for this annotation

GitHub Actions / eslint 

Irregular whitespace not allowed
<span className="underline">blacklist</span>). Organizations, companies, or institutions are not allowed
Expand All @@ -119,8 +102,7 @@ export function Stake() {
functionName: 'approve',
args: [STAKE_MANAGER_CONTRACT.address, parseEther(amount)],
});
console.log('txHash', txHash);
await waitForTransaction({ hash: txHash.hash, chainId: IS_TESTNET ? 11155111 : 1 });
await waitForTransaction({ hash: txHash.hash, chainId: CHAIN_ID });
setAllowanceSet(parseEther(amount));
}
writeContract({
Expand Down
35 changes: 0 additions & 35 deletions src/components/StakeModal/StakeTokenInput/UnStake.tsx
View file

This file was deleted.

Loading

0 comments on commit c437841

Please sign in to comment.