Make a reusable folder for common components and shift imports accordingly

Author: chauhanshilpa

app/components/communities_components/CommunitiesNavbar.tsx

@@ -2,7 +2,7 @@
 
 import { v4 as uuidv4 } from "uuid";
 import Link from "next/link";
-import SearchBar from "./SearchBar";
+import SearchBar from "../reusable/SearchBar";
 import { DISCOVER_NAVBAR_LINKS } from "@/app/utils/constants";
 
 const Navbar = () => {

app/components/random_chat_components/CategoriesAndGenderDetailsPopup.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import Image from "next/image";
-import CategoriesDropdown from "@/app/components/my_account_components/CategoriesDropdown";
+import CategoriesDropdown from "@/app/components/reusable/CategoriesDropdown";
 
 const CategoriesAndGenderDetailsPopup = () => {
   return (

app/components/my_account_components/CategoriesDropdown.tsx renamed to app/components/reusable/CategoriesDropdown.tsx

@@ -2,12 +2,11 @@
 import { useState, useRef, useEffect } from "react";
 import { IoMdClose } from "react-icons/io";
 import { GiHamburgerMenu } from "react-icons/gi";
-import { NAVBAR_LINKS } from "../utils/constants";
+import { NAVBAR_LINKS } from "@/app/utils/constants";
 import { v4 as uuidv4 } from "uuid";
 import Link from "next/link";
-import { Zklogin } from "../utils/Zklogin";
+import { Zklogin, AccountData } from "@/app/utils/Zklogin";
 import { CgProfile } from "react-icons/cg";
-import { AccountData } from "../utils/Zklogin";
 import { IoIosLogOut } from "react-icons/io";
 
 /**

app/components/Footer.tsx renamed to app/components/reusable/Footer.tsx

@@ -1,8 +1,6 @@
 import type { Metadata } from "next";
 import { Inter } from "next/font/google";
 import "./globals.css";
-import Navbar from "./components/HomeNavbar";
-import Footer from "./components/Footer";
 
 const inter = Inter({ subsets: ["latin"] });
 

app/components/HomeNavbar.tsx renamed to app/components/reusable/HomeNavbar.tsx

@@ -1,10 +1,10 @@
 import Image from "next/image";
+import HomeNavbar from "./components/reusable/HomeNavbar";
 import { LANDING_PAGE_BUTTON } from "./utils/constants";
 import { v4 as uuidv4 } from "uuid";
 import MembershipPlanCard1 from "./components/membership_plan_cards/MembershipPlanCard1";
 import MembershipPlanCard2 from "./components/membership_plan_cards/MembershipPlanCard2";
-import HomeNavbar from "./components/HomeNavbar";
-import Footer from "./components/Footer";
+import Footer from "./components/reusable/Footer";
 
 /*
  *
@@ -14,7 +14,7 @@ import Footer from "./components/Footer";
 export default function Home() {
   return (
     <main className="w-[95vw] mx-auto p-10">
-      <HomeNavbar />
+      <HomeNavbar/>
       <div className="bg-[#CDE1F2] p-10">
         <div className="flex lg:flex-row md:flex-col sm:items-center xs:flex-col justify-between row-1">
           <div className="flex flex-col xs:items-center lg:items-start">

app/components/communities_components/SearchBar.tsx renamed to app/components/reusable/SearchBar.tsx

@@ -5,7 +5,7 @@ import { v4 as uuidv4 } from "uuid";
 import { DISCOVER_PAGE_BUTTONS } from "../../utils/constants";
 import Image from "next/image";
 import VivrantCommunitiesCard from "../../components/communities_components/VivrantCommunitiesCard";
-import Footer from "@/app/components/Footer";
+import Footer from "@/app/components/reusable/Footer";
 
 const Community = () => {
   return (

app/layout.tsx

@@ -3,9 +3,9 @@
 import { useState } from "react";
 import Image from "next/image";
 import { useSearchParams } from "next/navigation";
-import HomeNavbar from "@/app/components/HomeNavbar";
-import Footer from "@/app/components/Footer";
-import CategoriesDropdown from "@/app/components/my_account_components/CategoriesDropdown";
+import HomeNavbar from "@/app/components/reusable/HomeNavbar";
+import Footer from "@/app/components/reusable/Footer";
+import CategoriesDropdown from "@/app/components/reusable/CategoriesDropdown";
 
 const MyAccount = () => {
   const [gender, setGender] = useState<string | undefined>();