local storage added to banner states

sanidhyy · Jan 27, 2024 · 672f64a · 672f64a
1 parent 8db2be0
commit 672f64a
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 3 deletions.
diff --git a/src/App.jsx b/src/App.jsx
@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import { BrowserRouter } from "react-router-dom";
 import {
   About,

diff --git a/src/components/Banner.jsx b/src/components/Banner.jsx
@@ -3,15 +3,26 @@ import { Link } from "react-router-dom";
 
 import { close, bulb } from "../assets";
 
+const BANNER_KEY = "hide-banner";
+
 const Banner = ({ hide, setHide }) => {
   useEffect(() => {
+    const hideBanner = localStorage.getItem(BANNER_KEY);
+
+    if (hideBanner) return;
+
     const bannerTimer = setTimeout(() => {
       setHide(false);
     }, 5000);
 
     return () => clearTimeout(bannerTimer);
   }, []);
 
+  const handleBannerClose = () => {
+    setHide(true);
+    localStorage.setItem(BANNER_KEY, true);
+  };
+
   return (
     <div
       id="sticky-banner"
@@ -49,7 +60,7 @@ const Banner = ({ hide, setHide }) => {
       <div className="flex items-center">
         <button
           data-dismiss-target="#sticky-banner"
-          onClick={() => setHide(true)}
+          onClick={handleBannerClose}
           type="button"
           className="flex-shrink-0 inline-flex justify-center items-center text-gray-400 hover:bg-gray-800 rounded-lg text-sm p-1.5 "
         >

diff --git a/src/components/Navbar.jsx b/src/components/Navbar.jsx
@@ -15,7 +15,6 @@ const Navbar = ({ hide }) => {
 
   useEffect(() => {
     const handleScroll = () => {
-      console.log(window.scrollY);
       if (window.scrollY > 10) {
         setIsAtBottom(true);
       } else {