chore: don't show ad on no search result (#668)

* chore: don't show ad on no search result * feat: add disabled prop to Advertisement component and update usage for search page --------- Co-authored-by: soyoka <[email protected]>
koreanbots · Feb 9, 2025 · e99e661 · e99e661
1 parent 138ef55
commit e99e661
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 6 deletions.
diff --git a/components/Advertisement.tsx b/components/Advertisement.tsx
@@ -1,6 +1,8 @@
 import AdSense from 'react-adsense'
 
-const Advertisement: React.FC<AdvertisementProps> = ({ size = 'short' }) => {
+const Advertisement: React.FC<AdvertisementProps> = ({ size = 'short', disabled = false }) => {
+	if (disabled) return null
+
 	return (
 		<div className='py-5'>
 			<div
@@ -39,6 +41,7 @@ declare global {
 
 interface AdvertisementProps {
 	size?: 'short' | 'tall'
+	disabled?: boolean
 }
 
 export default Advertisement
diff --git a/pages/search.tsx b/pages/search.tsx
@@ -1,12 +1,12 @@
 import { NextPage, NextPageContext } from 'next'
-import type { FC } from 'react'
 import dynamic from 'next/dynamic'
 import { ParsedUrlQuery } from 'querystring'
+import type { FC } from 'react'
 
-import { List, Bot, Server } from '@types'
+import { Bot, List, Server } from '@types'
+import { KoreanbotsEndPoints } from '@utils/Constants'
 import { get } from '@utils/Query'
 import { SearchQuerySchema } from '@utils/Yup'
-import { KoreanbotsEndPoints } from '@utils/Constants'
 
 const Hero = dynamic(() => import('@components/Hero'))
 const Advertisement = dynamic(() => import('@components/Advertisement'))
@@ -58,6 +58,8 @@ const SearchComponent: FC<{
 const Search: NextPage<SearchProps> = ({ botData, serverData, priority, query }) => {
 	if (!query?.q) return <Redirect text={false} to='/' />
 	const list: ('bot' | 'server')[] = ['bot', 'server']
+	const resultNotExists =
+		(!botData || botData.data.length === 0) && (!serverData || serverData.data.length === 0)
 	return (
 		<>
 			<Hero
@@ -67,7 +69,7 @@ const Search: NextPage<SearchProps> = ({ botData, serverData, priority, query })
 			/>
 			<Container>
 				<section id='list'>
-					<Advertisement />
+					<Advertisement disabled={resultNotExists} />
 					{(priority === 'server' ? list.reverse() : list).map((el) => (
 						<SearchComponent
 							key={el}
@@ -76,7 +78,7 @@ const Search: NextPage<SearchProps> = ({ botData, serverData, priority, query })
 							type={el}
 						/>
 					))}
-					<Advertisement />
+					<Advertisement disabled={resultNotExists} />
 				</section>
 			</Container>
 		</>