Remove professional icon components and restore emoji-based navigation

Co-authored-by: sanjay-kv <[email protected]>

Author: Copilot

docusaurus.config.ts

@@ -91,7 +91,7 @@ const config: Config = {
       items: [
         {
           type: "dropdown",
-          html: '<span id="nav-docs"></span> Docs',
+          html: '<span class="nav-emoji">📚</span> Docs',
           position: "left",
           items: [
             {
@@ -130,71 +130,71 @@ const config: Config = {
               value: `<div class="grid grid-cols-3 gap-4">
                 <a  class="border-r col-span-1" href="#" target="_self" style="color:black"> Interview Prep </a>
                 <div class="grid grid-cols-1 col-span-2">
-                  <a href="/interview-prep/" target="_self" class="nav__icons"><span id="nav-technical" style="display:inline-flex;align-items:center;"></span> Technical</a> <br />
-                  <a href="/interview-prep/" target="_self" class="nav__icons"><span id="nav-behavioral" style="display:inline-flex;align-items:center;"></span> Behavioral</a>
+                  <a href="/interview-prep/" target="_self" class="nav__icons"><span class="nav-emoji">🧩</span> Technical</a> <br />
+                  <a href="/interview-prep/" target="_self" class="nav__icons"><span class="nav-emoji">💡</span> Behavioral</a>
                 </div>
               </div>`,
             },
           ],
         },
         {
           to: "/showcase",
-          html: '<span id="nav-showcase"></span> Showcase',
+          html: '<span class="nav-emoji">👁️</span> Showcase',
           position: "left",
         },
         {
           to: "/dashboard",
-          html: '<span id="nav-dashboard"></span> Dashboard',
+          html: '<span class="nav-emoji">📊</span> Dashboard',
           position: "left",
         },
         {
           to: "/our-sponsors/",
-          html: '<span id="nav-donate"></span> Donate',
+          html: '<span class="nav-emoji">💰</span> Donate',
           position: "left",
         },
         {
           type: "dropdown",
-          html: '<span id="nav-devfolio"></span> Devfolio',
+          html: '<span class="nav-emoji">👤</span> Devfolio',
           position: "left",
           items: [
             {
-              html: '<span id="nav-github" style="display:inline-flex;align-items:center;"></span> GitHub Profiles',
+              html: '<span class="nav-emoji">🐙</span> GitHub Profiles',
               to: "https://dev.recodehive.com/devfolio",
             },
             {
-              html: '<span id="nav-badges" style="display:inline-flex;align-items:center;"></span> GitHub Badges',
+              html: '<span class="nav-emoji">🏅</span> GitHub Badges',
               to: "/badges/github-badges/",
             }, 
           ],
         },
         {
           to: "/blogs",
-          html: '<span id="nav-blogs"></span> Blogs',
+          html: '<span class="nav-emoji">📝</span> Blogs',
           position: "left",
         },
         {
           type: "dropdown",
-          html: '<span id="nav-more"></span> More',
+          html: '<span class="nav-emoji">⋯</span> More',
           position: "left",
           items: [
             {
-              html: '<span id="nav-ebooks" style="display:inline-flex;align-items:center;"></span> E-books',
+              html: '<span class="nav-emoji">📚</span> E-books',
               to: "https://learn.recodehive.com/datascience",
             },
             {
-              html: '<span id="nav-roadmap" style="display:inline-flex;align-items:center;"></span> Roadmap',
+              html: '<span class="nav-emoji">🗺️</span> Roadmap',
               to: "https://github.com/orgs/recodehive/projects/9",
             },
             {
-              html: '<span id="nav-community" style="display:inline-flex;align-items:center;"></span> Community',
+              html: '<span class="nav-emoji">👥</span> Community',
               to: "/community",
             },
             {
-              html: '<span id="nav-broadcast" style="display:inline-flex;align-items:center;"></span> Broadcast',
+              html: '<span class="nav-emoji">📺</span> Broadcast',
               to: "/broadcasts/",
             },
             {
-              html: '<span id="nav-podcast" style="display:inline-flex;align-items:center;"></span> Podcast',
+              html: '<span class="nav-emoji">🎙️</span> Podcast',
               to: "/podcasts/",
             },
           ],

src/components/navbar/NavbarIcon.tsx

@@ -1,7 +1,6 @@
 import React, { useEffect, useState } from 'react';
 import Layout from '@theme/Layout';
 import Head from '@docusaurus/Head';
-import NavbarIcon from "../../../components/navbar/NavbarIcon";
 import { useHistory } from "@docusaurus/router";
 import type confettiType from 'canvas-confetti';
 import "../dashboard.css";
@@ -118,35 +117,27 @@ const GiveawayPage: React.FC = () => {
               className="nav-item"
               onClick={() => handleTabChange("home")}
             >
-              <span className="nav-icon">
-                <NavbarIcon name="Dashboard" />
-              </span>
+              <span className="nav-icon">📊</span>
               <span className="nav-text">Home</span>
             </li>
             <li
               className="nav-item"
               onClick={() => handleTabChange("discuss")}
             >
-              <span className="nav-icon">
-                <NavbarIcon name="Broadcast" />
-              </span>
+              <span className="nav-icon">📺</span>
               <span className="nav-text">Discuss</span>
             </li>
             <li
               className="nav-item"
               onClick={() => handleTabChange("leaderboard")}
             >
-              <span className="nav-icon">
-                <NavbarIcon name="Badges" />
-              </span>
+              <span className="nav-icon">🏅</span>
               <span className="nav-text">Leaderboard</span>
             </li>
             <li
               className="nav-item active"
             >
-              <span className="nav-icon">
-                <NavbarIcon name="Donate" />
-              </span>
+              <span className="nav-icon">💰</span>
               <span className="nav-text">Giveaway</span>
             </li>
           </ul>

src/components/navbar/NavbarIconInjector.tsx

@@ -1,4 +1,3 @@
-import NavbarIcon from "../../components/navbar/NavbarIcon";
 import React, { useEffect, useState } from "react";
 import Layout from "@theme/Layout";
 import Head from "@docusaurus/Head";
@@ -14,7 +13,6 @@ import {
   GitHubDiscussion,
 } from "@site/src/services/githubService";
 import DiscussionCard from "@site/src/components/discussions/DiscussionCard";
-import { Megaphone, Lightbulb, HelpCircle, Star, MessageCircle, Search, TrendingUp } from "lucide-react";
 import "@site/src/components/discussions/discussions.css";
 import "./dashboard.css";
 
@@ -152,11 +150,11 @@ const DashboardContent: React.FC = () => {
   const getCategoryIcon = (category: string) => {
     const iconMap = {
       'all': null,
-      'announcements': <Megaphone size={14} />,
-      'ideas': <Lightbulb size={14} />,
-      'q-a': <HelpCircle size={14} />,
-      'show-and-tell': <Star size={14} />,
-      'general': <MessageCircle size={14} />
+      'announcements': '📢',
+      'ideas': '💡',
+      'q-a': '❓',
+      'show-and-tell': '⭐',
+      'general': '💬'
     };
     return iconMap[category] || null;
   };
@@ -928,18 +926,14 @@ const DashboardContent: React.FC = () => {
               className={`nav-item ${activeTab === "home" ? "active" : ""}`}
               onClick={() => handleTabChange("home")}
             >
-              <span className="nav-icon">
-                <NavbarIcon name="Dashboard" />
-              </span>
+              <span className="nav-icon">📊</span>
               <span className="nav-text">Home</span>
             </li>
             <li
               className={`nav-item ${activeTab === "discuss" ? "active" : ""}`}
               onClick={() => handleTabChange("discuss")}
             >
-              <span className="nav-icon">
-                <NavbarIcon name="Broadcast" />
-              </span>
+              <span className="nav-icon">📺</span>
               <span className="nav-text">Discuss</span>
             </li>
             <li
@@ -948,18 +942,14 @@ const DashboardContent: React.FC = () => {
               }`}
               onClick={() => handleTabChange("leaderboard")}
             >
-              <span className="nav-icon">
-                <NavbarIcon name="Badges" />
-              </span>
+              <span className="nav-icon">🏅</span>
               <span className="nav-text">Leaderboard</span>
             </li>
             <li
               className={`nav-item ${activeTab === "giveaway" ? "active" : ""}`}
               onClick={() => handleTabChange("giveaway")}
             >
-              <span className="nav-icon">
-                <NavbarIcon name="Donate" />
-              </span>
+              <span className="nav-icon">💰</span>
               <span className="nav-text">Giveaway</span>
             </li>
           </ul>
@@ -1394,15 +1384,15 @@ const DashboardContent: React.FC = () => {
                     }`}
                     onClick={() => handleDiscussionTabChange("trending")}
                   >
-                    <TrendingUp size={16} /> Trending
+                    📈 Trending
                   </button>
                   <button
                     className={`tab-btn ${
                       activeDiscussionTab === "unanswered" ? "active" : ""
                     }`}
                     onClick={() => handleDiscussionTabChange("unanswered")}
                   >
-                    <HelpCircle size={16} /> Unanswered
+                    ❓ Unanswered
                   </button>
                 </div>
                 <button
@@ -1430,7 +1420,7 @@ const DashboardContent: React.FC = () => {
 
               <div className="search-sort-container">
                 <div className="search-wrapper">
-                  <Search className="search-icon" size={20} />
+                  <span className="search-icon">🔍</span>
                   <input
                     type="text"
                     placeholder="Search discussions..."

src/pages/dashboard/giveaway/index.tsx

@@ -2,15 +2,13 @@ import React, { type ReactNode } from "react";
 import Navbar from "@theme-original/Navbar";
 import type NavbarType from "@theme/Navbar";
 import type { WrapperProps } from "@docusaurus/types";
-import NavbarIconInjector from "../../components/navbar/NavbarIconInjector";
 
 type Props = WrapperProps<typeof NavbarType>;
 
 export default function NavbarWrapper(props: Props): ReactNode {
   return (
     <>
       <Navbar {...props} />
-      <NavbarIconInjector />
     </>
   );
 }