Retain contract address while switching between link tabs

This commit is contained in:
Serkan Reis 2023-11-20 23:16:16 +03:00
parent 3e052e6e1e
commit 4d53d498d7
21 changed files with 66 additions and 1 deletions

View File

@ -1,5 +1,6 @@
import clsx from 'clsx'
import { Anchor } from 'components/Anchor'
import { useRouter } from 'next/router'
export interface LinkTabProps {
title: string
@ -11,6 +12,10 @@ export interface LinkTabProps {
export const LinkTab = (props: LinkTabProps) => {
const { title, description, href, isActive } = props
// get contract address from the router
const router = useRouter()
const { contractAddress } = router.query
return (
<Anchor
className={clsx(
@ -19,7 +24,7 @@ export const LinkTab = (props: LinkTabProps) => {
isActive ? 'border-plumbus' : 'border-transparent',
isActive ? 'bg-plumbus/5 hover:bg-plumbus/10' : 'hover:bg-white/5',
)}
href={href}
href={href + (contractAddress ? `?contractAddress=${contractAddress as string}` : '')}
>
<h4 className="font-bold">{title}</h4>
<span className="text-sm text-white/80 line-clamp-2">{description}</span>

View File

@ -489,6 +489,9 @@ const BadgeHubExecutePage: NextPage = () => {
if (contractAddress.length > 0) {
void router.replace({ query: { contractAddress } })
}
if (contractAddress.length === 0) {
void router.replace({ query: {} })
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [contractAddress])

View File

@ -81,6 +81,9 @@ const BadgeHubMigratePage: NextPage = () => {
if (contractAddress.length > 0) {
void router.replace({ query: { contractAddress } })
}
if (contractAddress.length === 0) {
void router.replace({ query: {} })
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [contractAddress])
useEffect(() => {

View File

@ -116,6 +116,9 @@ const BadgeHubQueryPage: NextPage = () => {
if (contractAddress.length > 0) {
void router.replace({ query: { contractAddress } })
}
if (contractAddress.length === 0) {
void router.replace({ query: {} })
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [contractAddress])
useEffect(() => {

View File

@ -96,6 +96,9 @@ const BaseMinterExecutePage: NextPage = () => {
if (contractAddress.length > 0) {
void router.replace({ query: { contractAddress } })
}
if (contractAddress.length === 0) {
void router.replace({ query: {} })
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [contractAddress])
useEffect(() => {

View File

@ -81,6 +81,9 @@ const BaseMinterMigratePage: NextPage = () => {
if (contractAddress.length > 0) {
void router.replace({ query: { contractAddress } })
}
if (contractAddress.length === 0) {
void router.replace({ query: {} })
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [contractAddress])
useEffect(() => {

View File

@ -68,6 +68,9 @@ const BaseMinterQueryPage: NextPage = () => {
if (contractAddress.length > 0) {
void router.replace({ query: { contractAddress } })
}
if (contractAddress.length === 0) {
void router.replace({ query: {} })
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [contractAddress])
useEffect(() => {

View File

@ -188,6 +188,9 @@ const OpenEditionMinterExecutePage: NextPage = () => {
if (contractAddress.length > 0) {
void router.replace({ query: { contractAddress } })
}
if (contractAddress.length === 0) {
void router.replace({ query: {} })
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [contractAddress])
useEffect(() => {

View File

@ -81,6 +81,9 @@ const OpenEditionMinterMigratePage: NextPage = () => {
if (contractAddress.length > 0) {
void router.replace({ query: { contractAddress } })
}
if (contractAddress.length === 0) {
void router.replace({ query: {} })
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [contractAddress])
useEffect(() => {

View File

@ -73,6 +73,9 @@ const OpenEditionMinterQueryPage: NextPage = () => {
if (contractAddress.length > 0) {
void router.replace({ query: { contractAddress } })
}
if (contractAddress.length === 0) {
void router.replace({ query: {} })
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [contractAddress])
useEffect(() => {

View File

@ -141,6 +141,9 @@ const Sg721ExecutePage: NextPage = () => {
if (contractAddress.length > 0) {
void router.replace({ query: { contractAddress } })
}
if (contractAddress.length === 0) {
void router.replace({ query: {} })
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [contractAddress])
useEffect(() => {

View File

@ -81,6 +81,9 @@ const Sg721MigratePage: NextPage = () => {
if (contractAddress.length > 0) {
void router.replace({ query: { contractAddress } })
}
if (contractAddress.length === 0) {
void router.replace({ query: {} })
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [contractAddress])
useEffect(() => {

View File

@ -85,6 +85,9 @@ const Sg721QueryPage: NextPage = () => {
if (contractAddress.length > 0) {
void router.replace({ query: { contractAddress } })
}
if (contractAddress.length === 0) {
void router.replace({ query: {} })
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [contractAddress])
useEffect(() => {

View File

@ -89,6 +89,9 @@ const SplitsExecutePage: NextPage = () => {
if (contractAddress.length > 0) {
void router.replace({ query: { contractAddress } })
}
if (contractAddress.length === 0) {
void router.replace({ query: {} })
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [contractAddress])
useEffect(() => {

View File

@ -82,6 +82,9 @@ const SplitsMigratePage: NextPage = () => {
if (contractAddress.length > 0) {
void router.replace({ query: { contractAddress } })
}
if (contractAddress.length === 0) {
void router.replace({ query: {} })
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [contractAddress])
useEffect(() => {

View File

@ -99,6 +99,9 @@ const SplitsQueryPage: NextPage = () => {
if (contractAddress.length > 0) {
void router.replace({ query: { contractAddress } })
}
if (contractAddress.length === 0) {
void router.replace({ query: {} })
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [contractAddress])
useEffect(() => {

View File

@ -196,6 +196,9 @@ const VendingMinterExecutePage: NextPage = () => {
if (contractAddress.length > 0) {
void router.replace({ query: { contractAddress } })
}
if (contractAddress.length === 0) {
void router.replace({ query: {} })
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [contractAddress])
useEffect(() => {

View File

@ -81,6 +81,9 @@ const VendingMinterMigratePage: NextPage = () => {
if (contractAddress.length > 0) {
void router.replace({ query: { contractAddress } })
}
if (contractAddress.length === 0) {
void router.replace({ query: {} })
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [contractAddress])
useEffect(() => {

View File

@ -73,6 +73,9 @@ const VendingMinterQueryPage: NextPage = () => {
if (contractAddress.length > 0) {
void router.replace({ query: { contractAddress } })
}
if (contractAddress.length === 0) {
void router.replace({ query: {} })
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [contractAddress])
useEffect(() => {

View File

@ -168,6 +168,9 @@ const WhitelistExecutePage: NextPage = () => {
if (contractAddress.length > 0) {
void router.replace({ query: { contractAddress } })
}
if (contractAddress.length === 0) {
void router.replace({ query: {} })
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [contractAddress])

View File

@ -115,6 +115,9 @@ const WhitelistQueryPage: NextPage = () => {
if (contractAddress.length > 0) {
void router.replace({ query: { contractAddress } })
}
if (contractAddress.length === 0) {
void router.replace({ query: {} })
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [contractAddress])
useEffect(() => {