Loader added for the website

* Loader added for main page

* Update App.jsx

---------

Co-authored-by: Rishi <[email protected]>
Co-authored-by: Arnab Mondal <[email protected]>

src/App.jsx

@@ -1,4 +1,4 @@
-import React ,{useEffect} from 'react';
+import React ,{useEffect,useState} from 'react';
 import './App.css';
 import 'react-tooltip/dist/react-tooltip.css'
 import { BrowserRouter as Router, Route, Routes } from 'react-router-dom';
@@ -25,6 +25,7 @@ import { Donationfront } from './pages/user/Donation/Donationfront/Donationfront
 import requestPermission from './utils/Functions/notifyService';
 import TeamPage from './pages/shared/team';
 import NotFound from './Components/shared/PageNotfound';
+import Loadermain from './Components/shared/Loader/Loadermain';
 /**
  * The main component of the application.
  * @returns {JSX.Element} The rendered App component.
@@ -35,9 +36,15 @@ function App() {
     // Req user for notification permission
     requestPermission();
   }, []);
+  const [loading, setLoading] = useState(true);
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      setLoading(false);
+    }, 2500);
+    return () => clearTimeout(timer);
+  }, []);
 
-
-
+  if (loading) return <Loadermain />
   return (
     <div>
       <Router>

src/Components/shared/Loader/Loadermain.jsx

@@ -0,0 +1,13 @@
+export default function Loadermain(){
+    return (
+        <div
+        className={` fixed inset-0 flex flex-col justify-center items-center bg-custom-gradient backdrop-blur-md z-50`} style={{
+          backgroundColor:"#00000033",
+          backgroundRepeat: "no-repeat",
+          backgroundSize: "cover"
+        }}
+      >
+        <img src="/loader.gif" alt="loader" className="max-w-[200px]"/>
+      </div>
+    );
+}

src/pages/ngo/ngoProfile.jsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useState, useContext } from "react";
 // import { FaUser, FaPhoneAlt } from "react-icons/fa";
 import { FaPhoneAlt } from "react-icons/fa";
-import Loader from "../../Components/shared/loader";
+import Loader from "../../Components/shared/Loader/loader";
 import { Link } from "react-router-dom";
 import { NgoContext } from "../../utils/contexts/NgoContext";
 import { IoIosMail } from "react-icons/io";

src/pages/user/UserProfile.jsx

@@ -3,7 +3,7 @@ import { FaUser, FaPhoneAlt } from "react-icons/fa";
 import { IoIosMail } from "react-icons/io";
 import { RiCoinsLine } from "react-icons/ri";
 import { IoDocumentSharp } from "react-icons/io5";
-import Loader from "../../Components/shared/loader";
+import Loader from "../../Components/shared/Loader/loader";
 import { Link } from "react-router-dom";
 import { UserContext } from "../../utils/contexts/UserContext";
 import { ProfilePhoto } from "../../Components/shared/ProfilePhoto";