Merge pull request Ketanop321#42 from Ketanop321/new_featurebranch/ketan

added  newletter

Author: Ketanop321

public/teckinka2.jpeg

@@ -3,11 +3,13 @@ import { BrowserRouter as Router } from 'react-router-dom';
 import Sidebar from './components/Sidebar';
 import AppRoutes from './routes/AppRoutes'; 
 import { useAuth } from './context/authContext/authContext';
-
+import NewsletterModal from './Newslettermodal';
 const App = () => {
   const { userLoggedIn } = useAuth();
 
   return (
+    <>
+    <NewsletterModal/>
     <Router>
       <div className="flex">
         {userLoggedIn && <Sidebar />} {/* Show Sidebar if authenticated */}
@@ -16,6 +18,8 @@ const App = () => {
         </div>
       </div>
     </Router>
+    
+    </>
   );
 };
 

src/App.js

@@ -0,0 +1,42 @@
+import { useEffect, useState } from 'react';
+
+function NewsletterModal() {
+  const [isOpen, setIsOpen] = useState(false);
+
+  useEffect(() => {
+    // Open the modal on page load
+    setIsOpen(true);
+  }, []);
+
+  const closeModal = () => {
+    setIsOpen(false);
+  };
+
+  return (
+    <>
+      {isOpen && (
+        <div className="fixed inset-0 flex items-center justify-center bg-black bg-opacity-50 z-50">
+          <div className="relative">
+            
+            {/* Close Button */}
+            <button
+              className="absolute top-2 right-2 bg-white rounded-full p-1 text-gray-600 hover:text-gray-800"
+              onClick={closeModal}
+            >
+              ✕
+            </button>
+
+            {/* Image section */}
+            <img
+              src="/teckinka2.jpeg"
+              alt="Sample"
+              className="w-full max-w-md h-auto rounded-lg shadow-lg"
+            />
+          </div>
+        </div>
+      )}
+    </>
+  );
+}
+
+export default NewsletterModal;