diff --git a/pages/community/tsc.tsx b/pages/community/tsc.tsx
index 755652736f1..03040adfa4b 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,9 @@ 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 +78,9 @@ 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 +91,9 @@ 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>
   );
 }