From 4c2adccfbaf00c688c00b600aff06199e6b3eccc Mon Sep 17 00:00:00 2001
From: SahilDahekar <dahekar30sahil@gmail.com>
Date: Thu, 21 Nov 2024 10:28:19 +0530
Subject: [PATCH] Removed Unnecessary state use for hover effect

---
 pages/community/tsc.tsx | 17 ++++++-----------
 1 file changed, 6 insertions(+), 11 deletions(-)

diff --git a/pages/community/tsc.tsx b/pages/community/tsc.tsx
index 755652736f1b..24db5ce01feb 100644
--- a/pages/community/tsc.tsx
+++ b/pages/community/tsc.tsx
@@ -1,5 +1,4 @@
 import { sortBy } from 'lodash';
-import React, { useState } from 'react';
 
 import type { Tsc } from '@/types/pages/community/Community';
 
@@ -66,11 +65,10 @@ function addAdditionalUserInfo(user: Tsc) {
  * @returns The Twitter SVG component.
  */
 function TwitterSVG() {
-  const [isHovered, setIsHovered] = useState(false);
 
   return (
-    <div className='size-5' onMouseEnter={() => setIsHovered(true)} onMouseLeave={() => setIsHovered(false)}>
-      <IconTwitter className={isHovered ? 'hover:fill-black' : ''} />
+    <div className='size-5'>
+      <IconTwitter className='hover:fill-black' />
     </div>
   );
 }
@@ -81,11 +79,10 @@ function TwitterSVG() {
  * @returns The GitHub SVG component.
  */
 function GitHubSVG() {
-  const [isHovered, setIsHovered] = useState(false);
 
   return (
-    <div className='size-5' onMouseEnter={() => setIsHovered(true)} onMouseLeave={() => setIsHovered(false)}>
-      <IconGithub className={isHovered ? 'hover:fill-black' : ''} />
+    <div className='size-5'>
+      <IconGithub className='hover:fill-black'/>
     </div>
   );
 }
@@ -96,12 +93,10 @@ function GitHubSVG() {
  * @returns The LinkedIn SVG component.
  */
 function LinkedInSVG() {
-  const [isHovered, setIsHovered] = useState(false);
 
   return (
-    <div className='size-5' onMouseEnter={() => setIsHovered(true)} onMouseLeave={() => setIsHovered(false)}>
-      {/* Use the imported SVG icon component */}
-      <IconLinkedIn className={isHovered ? 'hover:fill-linkedin' : ''} />
+    <div className='size-5'>
+      <IconLinkedIn className='hover:fill-linkedin'/>
     </div>
   );
 }