From 74dba88015e7ec3a6461444bebce2c0604c20825 Mon Sep 17 00:00:00 2001
From: Daniil Polienko <donyaschefer@gmail.com>
Date: Wed, 20 Nov 2024 17:22:48 +0300
Subject: [PATCH] chore: resolve comments

---
 apps/common/components/FeaturedApp.tsx        |  2 +-
 apps/common/components/MobileNavbar.tsx       | 20 +++++++++--------
 apps/common/components/ModalMobileMenu.tsx    |  2 +-
 apps/common/components/Sidebar.tsx            |  4 +++-
 apps/common/components/SortingBar.tsx         |  5 +++--
 apps/common/icons/LogoDiscordRound.tsx        | 22 -------------------
 apps/common/icons/LogoParagraphRound.tsx      | 22 -------------------
 apps/common/icons/LogoTwitterRound.tsx        | 22 -------------------
 apps/landing/components/sections/About.tsx    |  2 +-
 .../components/sections/Contribute.tsx        |  7 ++++--
 apps/landing/components/sections/Partners.tsx |  4 +++-
 pages/_app.tsx                                |  2 +-
 pages/apps/[category].tsx                     |  7 +++++-
 pages/apps/index.tsx                          |  2 +-
 pages/apps/search/[query].tsx                 |  4 +++-
 15 files changed, 39 insertions(+), 88 deletions(-)
 delete mode 100644 apps/common/icons/LogoDiscordRound.tsx
 delete mode 100644 apps/common/icons/LogoParagraphRound.tsx
 delete mode 100644 apps/common/icons/LogoTwitterRound.tsx

diff --git a/apps/common/components/FeaturedApp.tsx b/apps/common/components/FeaturedApp.tsx
index 76f54c564..5628ad1b7 100644
--- a/apps/common/components/FeaturedApp.tsx
+++ b/apps/common/components/FeaturedApp.tsx
@@ -20,7 +20,7 @@ export function FeaturedApp(props: {app: TApp}): ReactElement {
 				<Image
 					src={props.app.logoURI}
 					alt={props.app.name}
-					priority={true}
+					priority
 					width={2000}
 					height={2000}
 					className={'right-0 top-0 size-full bg-center object-cover  '}
diff --git a/apps/common/components/MobileNavbar.tsx b/apps/common/components/MobileNavbar.tsx
index 84f20d9d5..1ea2a01f1 100644
--- a/apps/common/components/MobileNavbar.tsx
+++ b/apps/common/components/MobileNavbar.tsx
@@ -1,9 +1,9 @@
 import Link from 'next/link';
 import {usePathname} from 'next/navigation';
 import {cl} from '@builtbymom/web3/utils';
-import {LogoDiscordRound} from '@common/icons/LogoDiscordRound';
-import {LogoParagraphRound} from '@common/icons/LogoParagraphRound';
-import {LogoTwitterRound} from '@common/icons/LogoTwitterRound';
+import {IconDiscord} from '@common/icons/IconDiscord';
+import {IconParagraph} from '@common/icons/IconParagraph';
+import {IconTwitter} from '@common/icons/IconTwitter';
 import {iconsDict, LANDING_SIDEBAR_LINKS, MENU_TABS} from '@common/utils/constants';
 
 import type {ReactElement} from 'react';
@@ -16,11 +16,12 @@ export function MobileNavbar({onClose}: {onClose: VoidFunction}): ReactElement {
 	return (
 		<div
 			className={
-				'flex h-full w-screen flex-col justify-end border-t border-gray-600/50 bg-gradient-to-b from-gray-900 to-[#1A1A1A] '
+				'flex h-full w-screen flex-col justify-end border-t border-gray-600/50 bg-gradient-to-b from-gray-900 to-[#1A1A1A]'
 			}>
 			<div className={'flex flex-col items-start gap-y-2 bg-transparent p-6 pb-4'}>
 				{MENU_TABS.map(tab => (
 					<Link
+						key={tab.route}
 						className={cl(
 							'text-base flex items-center gap-x-2 py-2 text-gray-400',
 							currentTab === tab.route ? 'text-white' : 'text-gray-400'
@@ -35,10 +36,11 @@ export function MobileNavbar({onClose}: {onClose: VoidFunction}): ReactElement {
 				))}
 			</div>
 
-			<div className={'w-full border-t border-gray-700 p-6'}>
+			<div className={'w-full border-t border-gray-700 p-6 pb-[104px]'}>
 				<div className={'flex w-full justify-between'}>
 					{LANDING_SIDEBAR_LINKS.slice(0, 5).map(link => (
 						<Link
+							key={link.href}
 							href={link.href}
 							className={'text-sm text-gray-400'}
 							target={'_blank'}>
@@ -51,17 +53,17 @@ export function MobileNavbar({onClose}: {onClose: VoidFunction}): ReactElement {
 					<Link
 						target={'_blank'}
 						href={'https://discord.com/invite/yearn'}>
-						<LogoDiscordRound />
+						<IconDiscord />
 					</Link>
 					<Link
 						target={'_blank'}
-						href={''}>
-						<LogoParagraphRound />
+						href={'https://paragraph.xyz/@yearn'}>
+						<IconParagraph />
 					</Link>
 					<Link
 						target={'_blank'}
 						href={'https://twitter.com/yearnfi'}>
-						<LogoTwitterRound />
+						<IconTwitter />
 					</Link>
 				</div>
 			</div>
diff --git a/apps/common/components/ModalMobileMenu.tsx b/apps/common/components/ModalMobileMenu.tsx
index 619162e57..0c4a8fdfa 100644
--- a/apps/common/components/ModalMobileMenu.tsx
+++ b/apps/common/components/ModalMobileMenu.tsx
@@ -54,7 +54,7 @@ export function FooterNav(): ReactElement {
 					<IconParagraph className={'size-8 text-white transition-colors hover:text-primary'} />
 				</Link>
 				<Link
-					href={'https://discord.com/invite/b8ENPNqG5c'}
+					href={'https://discord.com/invite/yearn'}
 					target={'_blank'}
 					className={'flex items-center gap-x-4'}>
 					<IconDiscord className={'size-8 text-white transition-colors hover:text-primary'} />
diff --git a/apps/common/components/Sidebar.tsx b/apps/common/components/Sidebar.tsx
index aada40dbf..26d5afa9e 100644
--- a/apps/common/components/Sidebar.tsx
+++ b/apps/common/components/Sidebar.tsx
@@ -37,7 +37,9 @@ export function Sidebar(props: TSidebarProps): ReactElement {
 			<div>
 				<div className={'px-4'}>
 					<div className={'mb-4 ml-2'}>
-						<Link href={'/'}>
+						<Link
+							href={'/'}
+							className={'flex w-fit'}>
 							<LogoYearn
 								className={'size-10'}
 								back={'text-blue-500'}
diff --git a/apps/common/components/SortingBar.tsx b/apps/common/components/SortingBar.tsx
index 0d8d1668a..d11e19ea7 100644
--- a/apps/common/components/SortingBar.tsx
+++ b/apps/common/components/SortingBar.tsx
@@ -15,7 +15,7 @@ export function SortingBar(): ReactElement {
 				<p className={'mr-2 text-xs text-white'}>{'Sort by Popularity'}</p>
 				<IconChevron className={`size-6 text-white ${isOpen && 'rotate-180'}`} />
 			</button>
-			{isOpen && (
+			{isOpen ? (
 				<div
 					className={
 						'border-1 absolute top-28 z-30 w-80 border border-gray-700 bg-gray-500 py-2 text-white max-sm:left-0 md:right-1 md:top-10'
@@ -24,12 +24,13 @@ export function SortingBar(): ReactElement {
 						.fill('List Item')
 						.map((item, i) => (
 							<SortItem
+								key={i}
 								isActive={i === 2}
 								title={item}
 							/>
 						))}
 				</div>
-			)}
+			) : null}
 		</>
 	);
 }
diff --git a/apps/common/icons/LogoDiscordRound.tsx b/apps/common/icons/LogoDiscordRound.tsx
deleted file mode 100644
index 7475cd61d..000000000
--- a/apps/common/icons/LogoDiscordRound.tsx
+++ /dev/null
@@ -1,22 +0,0 @@
-import type {ReactElement} from 'react';
-
-export function LogoDiscordRound(props: React.SVGProps<SVGSVGElement>): ReactElement {
-	return (
-		<svg
-			{...props}
-			width={'24'}
-			height={'24'}
-			viewBox={'0 0 24 24'}
-			fill={'none'}
-			xmlns={'http://www.w3.org/2000/svg'}>
-			<path
-				fillRule={'evenodd'}
-				clipRule={'evenodd'}
-				d={
-					'M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24ZM14.0019 7.00068C15.0024 7.16258 15.9593 7.44526 16.8516 7.82895C16.8593 7.83207 16.8659 7.83728 16.8698 7.84456C18.4508 10.0238 19.2316 12.482 18.9397 15.312C18.9386 15.324 18.932 15.3349 18.9215 15.3422C17.724 16.1663 16.5641 16.6666 15.4201 16.9982C15.4019 17.0034 15.3821 16.9971 15.371 16.9826C15.1067 16.6379 14.8666 16.2745 14.6564 15.893C14.6443 15.8706 14.6553 15.8435 14.6801 15.8347C15.0614 15.6998 15.424 15.5384 15.7728 15.3474C15.8003 15.3323 15.802 15.2953 15.7766 15.2776C15.7027 15.2261 15.6293 15.1719 15.5592 15.1178C15.546 15.1079 15.5283 15.1058 15.5134 15.1126C13.2492 16.0929 10.7687 16.0929 8.47756 15.1126C8.46265 15.1063 8.44499 15.1084 8.43231 15.1183C8.36223 15.1725 8.28882 15.2261 8.21543 15.2776C8.19005 15.2953 8.19226 15.3323 8.21984 15.3474C8.5686 15.5348 8.93116 15.6998 9.31192 15.8352C9.33675 15.844 9.34834 15.8706 9.33619 15.893C9.13037 16.2751 8.89032 16.6385 8.62103 16.9831C8.60944 16.9971 8.59013 17.0034 8.57191 16.9982C7.4335 16.6666 6.27354 16.1663 5.07607 15.3422C5.06613 15.3349 5.05896 15.3234 5.05786 15.3115C4.81395 12.8636 5.31115 10.3851 7.12613 7.84404C7.13052 7.83728 7.13715 7.83207 7.14488 7.82895C8.03774 7.44475 8.99461 7.16206 9.99453 7.00068C10.0127 6.99808 10.0309 7.00588 10.0403 7.02098C10.1639 7.22609 10.3052 7.489 10.4007 7.704C11.4547 7.55303 12.5252 7.55303 13.6013 7.704C13.6968 7.49368 13.8331 7.22609 13.9561 7.02098C13.9655 7.00536 13.9837 6.99755 14.0019 7.00068ZM8.42016 12.4987C8.42016 13.2275 8.98854 13.821 9.67835 13.821C10.3792 13.821 10.9365 13.2275 10.9365 12.4987C10.9476 11.7751 10.3847 11.1764 9.67835 11.1764C8.97752 11.1764 8.42016 11.7698 8.42016 12.4987ZM13.0721 12.4987C13.0721 13.2275 13.6405 13.821 14.3303 13.821C15.0366 13.821 15.5885 13.2275 15.5885 12.4987C15.5995 11.7751 15.0366 11.1764 14.3303 11.1764C13.6294 11.1764 13.0721 11.7698 13.0721 12.4987Z'
-				}
-				fill={'white'}
-			/>
-		</svg>
-	);
-}
diff --git a/apps/common/icons/LogoParagraphRound.tsx b/apps/common/icons/LogoParagraphRound.tsx
deleted file mode 100644
index 284186e58..000000000
--- a/apps/common/icons/LogoParagraphRound.tsx
+++ /dev/null
@@ -1,22 +0,0 @@
-import type {ReactElement} from 'react';
-
-export function LogoParagraphRound(props: React.SVGProps<SVGSVGElement>): ReactElement {
-	return (
-		<svg
-			{...props}
-			width={'24'}
-			height={'24'}
-			viewBox={'0 0 24 24'}
-			fill={'none'}
-			xmlns={'http://www.w3.org/2000/svg'}>
-			<path
-				fillRule={'evenodd'}
-				clipRule={'evenodd'}
-				d={
-					'M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24ZM7.36857 12.6461C7.36857 12.9935 7.08436 13.2777 6.73699 13.2777C6.63173 13.2777 6.52646 13.2461 6.43173 13.204L5.25278 14.0882V14.225V14.3619L6.43173 15.2461C6.52646 15.204 6.63173 15.1724 6.73699 15.1724C7.08436 15.1724 7.36857 15.4566 7.36857 15.804C7.36857 16.1513 7.08436 16.4356 6.73699 16.4356C6.38962 16.4356 6.10541 16.1513 6.10541 15.804V15.6671L4.92646 14.7829C4.83173 14.825 4.72646 14.8566 4.6212 14.8566C4.27383 14.8566 3.98962 14.5724 3.98962 14.225C3.98962 13.8777 4.27383 13.5935 4.6212 13.5935C4.72646 13.5935 4.83173 13.625 4.92646 13.6671L6.10541 12.7829V12.6461C6.10541 12.2987 6.38962 12.0145 6.73699 12.0145C7.08436 12.0145 7.36857 12.2987 7.36857 12.6461ZM19.3686 12.5408C19.2633 12.5408 19.158 12.5724 19.0633 12.6145L17.8844 11.7303V11.5934C17.8844 11.2461 17.6001 10.9619 17.2528 10.9619C16.9054 10.9619 16.6212 11.2461 16.6212 11.5934C16.6212 11.9408 16.9054 12.225 17.2528 12.225C17.358 12.225 17.4633 12.1934 17.558 12.1513L18.737 13.0356V13.1724V13.3092L17.558 14.1934C17.4633 14.1513 17.358 14.1198 17.2528 14.1198C16.9054 14.1198 16.6212 14.404 16.6212 14.7513C16.6212 15.0987 16.9054 15.3829 17.2528 15.3829C17.6001 15.3829 17.8844 15.0987 17.8844 14.7513V14.6145L19.0633 13.7303C19.158 13.7724 19.2633 13.804 19.3686 13.804C19.7159 13.804 20.0001 13.5198 20.0001 13.1724C20.0001 12.825 19.7159 12.5408 19.3686 12.5408ZM12.2629 12.5944V11.1101H12.2524C12.2629 11.1101 12.2945 11.0996 12.2945 11.0996L13.4734 11.9838V12.1207V12.1417L12.3997 12.6786C12.3576 12.647 12.2629 12.5944 12.2629 12.5944ZM12.6317 10.5201V10.5411V10.678L13.8106 11.5622C13.8106 11.5622 13.8422 11.5517 13.8527 11.5411V10.0675C13.8527 10.0675 13.758 10.0148 13.7159 9.98325L12.6422 10.5201H12.6317ZM9.26296 9.35077V9.48761H9.25243C9.25243 9.74024 9.3998 9.9613 9.62085 10.0666V18.9087C9.61033 18.9192 9.57875 18.9297 9.57875 18.9297L9.08401 18.5613L8.75769 18.3192L8.3998 18.0455L8.0419 17.7823V8.43498L8.08401 8.46656L8.43138 8.72972L8.51559 8.79287L9.26296 9.35077ZM14.9579 6.66754L15.3684 6.45702L15.5789 6.35176L15.7158 6.2886L15.5895 6.19386L15.2105 5.90965L15.1368 5.85702L14.7895 5.60439L14.6 5.45702L14.4105 5.30965L14.0737 5.06754L13.7158 5.24649L13.4105 5.40439L13.2 5.50965L8.86314 7.67807L8.76841 7.72018L8.43156 7.8886L8.29472 7.96228L8.42104 8.04649L8.70525 8.26754L8.93683 8.43597L9.59999 8.9307C9.69472 8.8886 9.79998 8.85702 9.90525 8.85702C10.0526 8.85702 10.1895 8.90965 10.3052 8.99386L14.9684 6.66754H14.9579ZM15.2947 7.08819L15.3368 7.05661L15.8105 6.82503L15.9474 6.75134V13.5408L15.579 13.7198L15.1158 13.9513L14.8737 14.0777L12.4 15.3092C12.2842 15.225 12.1474 15.1724 12 15.1724C11.6526 15.1724 11.3684 15.4566 11.3684 15.804C11.3684 16.0566 11.5158 16.2777 11.7368 16.3829V17.7829L11.379 18.0461L11.0632 18.2777L11.0316 18.3092L10.2 18.9303C10.179 18.9303 10.1579 18.9092 10.1579 18.9092V10.0671C10.379 9.96187 10.5263 9.74082 10.5263 9.48819V9.46713L15.2947 7.08819ZM12.6316 13.1513L13.7053 12.6145C13.8211 12.6987 13.9579 12.7513 14.1053 12.7513C14.4526 12.7513 14.7368 12.4671 14.7368 12.1198C14.7368 11.8671 14.5895 11.6461 14.3684 11.5408V10.0671C14.5895 9.96187 14.7368 9.74082 14.7368 9.48819C14.7368 9.14082 14.4526 8.85661 14.1053 8.85661C13.7579 8.85661 13.4737 9.14082 13.4737 9.48819V9.50924L12.4 10.0461C12.2842 9.96187 12.1474 9.90924 12 9.90924C11.6526 9.90924 11.3684 10.1934 11.3684 10.5408C11.3684 10.7934 11.5158 11.0145 11.7368 11.1092V12.5934C11.5158 12.6987 11.3684 12.9198 11.3684 13.1724C11.3684 13.5198 11.6526 13.804 12 13.804C12.3474 13.804 12.6316 13.5198 12.6316 13.1724V13.1513Z'
-				}
-				fill={'white'}
-			/>
-		</svg>
-	);
-}
diff --git a/apps/common/icons/LogoTwitterRound.tsx b/apps/common/icons/LogoTwitterRound.tsx
deleted file mode 100644
index 77e641818..000000000
--- a/apps/common/icons/LogoTwitterRound.tsx
+++ /dev/null
@@ -1,22 +0,0 @@
-import type {ReactElement} from 'react';
-
-export function LogoTwitterRound(props: React.SVGProps<SVGSVGElement>): ReactElement {
-	return (
-		<svg
-			{...props}
-			width={'24'}
-			height={'24'}
-			viewBox={'0 0 24 24'}
-			fill={'none'}
-			xmlns={'http://www.w3.org/2000/svg'}>
-			<path
-				fillRule={'evenodd'}
-				clipRule={'evenodd'}
-				d={
-					'M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24ZM18.1726 6H16.0258L12.4883 9.83446L9.4298 6H5L10.2929 12.5631L5.27646 18H7.42451L11.2962 13.8049L14.6799 18H19L13.4825 11.0831L18.1726 6ZM16.4619 16.7815H15.2724L7.50693 7.15446H8.78343L16.4619 16.7815Z'
-				}
-				fill={'white'}
-			/>
-		</svg>
-	);
-}
diff --git a/apps/landing/components/sections/About.tsx b/apps/landing/components/sections/About.tsx
index 43476de33..8d5eb90f0 100644
--- a/apps/landing/components/sections/About.tsx
+++ b/apps/landing/components/sections/About.tsx
@@ -45,7 +45,7 @@ export function About(): ReactElement {
 						{'at all times.'}
 					</p>
 				</div>
-				{!isReadMore && (
+				{isReadMore ? null : (
 					<button
 						className={'mt-6 text-lg font-light text-primary'}
 						onClick={() => set_isReadMore(true)}>
diff --git a/apps/landing/components/sections/Contribute.tsx b/apps/landing/components/sections/Contribute.tsx
index 2be37a678..2644a1577 100644
--- a/apps/landing/components/sections/Contribute.tsx
+++ b/apps/landing/components/sections/Contribute.tsx
@@ -51,7 +51,7 @@ function ContributeCard(props: {title: string; description: string; href: string
 			</div>
 			<div className={'flex justify-between gap-2'}>
 				<p className={'leading-6 underline opacity-70 transition-opacity hover:opacity-100'}>{'Read more'}</p>
-				{isHovering && <IconArrow className={'text-black'} />}
+				{isHovering ? <IconArrow className={'text-black'} /> : null}
 			</div>
 		</Link>
 	);
@@ -68,7 +68,10 @@ export function Contribute(): ReactElement {
 					'mt-10 grid grid-flow-col grid-cols-1 grid-rows-4 gap-6 sm:grid-cols-2 sm:grid-rows-2 md:grid-flow-row md:grid-cols-4 md:grid-rows-1'
 				}>
 				{CARDS.map(card => (
-					<ContributeCard {...card} />
+					<ContributeCard
+						key={card.title}
+						{...card}
+					/>
 				))}
 			</div>
 		</div>
diff --git a/apps/landing/components/sections/Partners.tsx b/apps/landing/components/sections/Partners.tsx
index c0940e630..99d044c0f 100644
--- a/apps/landing/components/sections/Partners.tsx
+++ b/apps/landing/components/sections/Partners.tsx
@@ -25,7 +25,9 @@ export function Partners(): ReactElement {
 					pauseOnHover={true}
 					className={'grid h-full overflow-hidden'}>
 					{PARTNERS.map(partner => (
-						<div className={'mx-5 flex h-full max-h-[32px] flex-col items-center justify-center pr-10'}>
+						<div
+							className={'mx-5 flex h-full max-h-[32px] flex-col items-center justify-center pr-10'}
+							key={partner.src}>
 							<Image
 								src={partner.src}
 								alt={'partner'}
diff --git a/pages/_app.tsx b/pages/_app.tsx
index c706b8abe..59835bf5e 100755
--- a/pages/_app.tsx
+++ b/pages/_app.tsx
@@ -70,7 +70,7 @@ const WithLayout = memo(function WithLayout(
 						</motion.nav>
 						{isNavbarOpen && (
 							<motion.nav
-								className={'sticky top-20 z-50 h-[calc(100vh-80px)] w-screen md:hidden'}
+								className={'sticky top-16 z-50 h-[calc(100vh-64px)] w-screen md:hidden'}
 								initial={{y: '100%'}} // Start from below the screen
 								animate={{y: 0}} // Animate to the original position
 								exit={{y: '100%'}} // Exit back to below the screen
diff --git a/pages/apps/[category].tsx b/pages/apps/[category].tsx
index cd32dc681..b805311b5 100644
--- a/pages/apps/[category].tsx
+++ b/pages/apps/[category].tsx
@@ -52,7 +52,12 @@ export default function Index(props: {router: NextRouter}): ReactElement {
 				</div>
 
 				<div className={'flex grid-rows-1 flex-col gap-4 md:grid md:grid-cols-2 lg:grid-cols-4'}>
-					{shuffledApps?.map(app => <AppCard app={app} />)}
+					{shuffledApps?.map(app => (
+						<AppCard
+							app={app}
+							key={app.appURI}
+						/>
+					))}
 				</div>
 			</div>
 		</div>
diff --git a/pages/apps/index.tsx b/pages/apps/index.tsx
index b11ee993c..97cf3c858 100644
--- a/pages/apps/index.tsx
+++ b/pages/apps/index.tsx
@@ -41,7 +41,7 @@ export default function Home(): ReactElement {
 
 					<div>
 						<div className={'mb-6 flex items-start justify-between'}>
-							<p className={'text-lg font-bold text-white'}>{'Featured Apps'}</p>
+							<p className={'w-full text-lg font-bold text-white'}>{'Featured Apps'}</p>
 							<CarouselSlideArrows
 								onScrollBack={onScrollBack}
 								onScrollForward={onScrollForward}
diff --git a/pages/apps/search/[query].tsx b/pages/apps/search/[query].tsx
index 5a4af11d7..314de05c9 100644
--- a/pages/apps/search/[query].tsx
+++ b/pages/apps/search/[query].tsx
@@ -25,7 +25,9 @@ export default function SeachResults(): ReactElement {
 						className={cl(
 							'hidden truncate text-[64px] font-bold leading-[84px] text-white md:block',
 							searchFilteredApps.length < 1 ? 'mb-4' : 'mb-10'
-						)}>{`Results for "${searchValue}"`}</p>
+						)}>
+						{`Results for "${searchValue}"`}
+					</p>
 					{searchFilteredApps.length < 1 ? (
 						<div>
 							<p className={'text-base text-gray-400'}>