// IK || Set pageName and pageId in sessionStorage

SessionStorage Page Tracking

✅ উদ্দেশ্য

এই কোডের মূল কাজ হচ্ছে:

• কোন পেজে ইউজার আছে তা চিহ্নিত করা

• পেজের Title সংরক্ষণ করা

• একটি ইউনিক Page ID রাখা
  এই ডাটা sessionStorage-এ রাখা হচ্ছে যাতে অন্য কম্পোনেন্ট / Layout / Analytics এ ইউজ করা যায়।

---

✅ Code Breakdown

🔹 1. Home Page এর জন্য Data সেট করা

useEffect(() => {
    sessionStorage.setItem("pageType", "Home");

    const pageTitle = document.title;
    sessionStorage.setItem("pageTitle", pageTitle);

    sessionStorage.setItem("pageId", "101");
}, []);

🧠 কী হচ্ছে এখানে?

• পেজ লোড হলেই:

  • pageType = Home

  • pageTitle = document.title

  • pageId = 101

• [] থাকার কারণে শুধুমাত্র প্রথমবার চলবে।

---

🔹 2. Brand Page হলে Dynamic Data সেট করা

useEffect(() => {
  if (BrandData?.brand?.name) {
    sessionStorage.setItem("pageType", BrandData.brand.name);
    sessionStorage.setItem("pageTitle", document.title);
    sessionStorage.setItem("pageId", "109");
  }
}, [BrandData?.brand?.name]);

🧠 কী হচ্ছে?

• BrandData আসলেই:

  • pageType = Brand এর নাম

  • pageTitle = বর্তমান title

  • pageId = 109

• Brand পরিবর্তন হলে আবার রান করবে।

---

❌ সমস্যা: Wrong Key Name

তুমি নিচে এইভাবে ডাটা আনছো:

const pageName = sessionStorage.getItem("pageName");
const pageId = sessionStorage.getItem("pageId");

console.log(pageName, pageId);

👉 কিন্তু তুমি কোথাও "pageName" সেট করোনি
✅ তুমি সেট করেছো "pageType"

---

✅ Correct Code (Fix)

const location = useLocation();

const pageType = sessionStorage.getItem("pageType");
const pageTitle = sessionStorage.getItem("pageTitle");
const pageId = sessionStorage.getItem("pageId");

console.log("Type:", pageType);
console.log("Title:", pageTitle);
console.log("ID:", pageId);

---

✅ Naming Standard (Recommended)

একটাই নাম ব্যবহার করো পুরো প্রোজেক্টে:

Use for	Key Name
Page Name	pageType
Page Title	pageTitle
Page ID	pageId

অথবা যদি pageName পছন্দ করো তাহলে সব জায়গায় একটাই রাখো:

sessionStorage.setItem("pageName", "Home");

এবং পড়বে:

sessionStorage.getItem("pageName");

---

✅ Example Output

Home Page এ থাকলে:

Type: Home
Title: Paikaree - Home
ID: 101

Brand Page হলে:

Type: Samsung
Title: Samsung Mobile
ID: 109

---

✅ Advanced Tip (Auto Clear on Browser Close)

sessionStorage browser বন্ধ করলে auto clear হয় — তাই Analytics বা Tracking এর জন্য perfect ✅

---

যদি চাও আমি তোমার জন্য:
✅ Layout.jsx ready-made setup
✅ Analytics tracking function
✅ API payload example

useEffect(() => {

        sessionStorage.setItem("pageType", "Home");

        const pageTitle = document.title;

        sessionStorage.setItem("pageTitle", pageTitle);

        sessionStorage.setItem("pageId", "101");

    }, []);

  useEffect(() => {

    if (BrandData?.brand?.name) {

      sessionStorage.setItem("pageType", BrandData.brand.name);

      sessionStorage.setItem("pageTitle", document.title);

      sessionStorage.setItem("pageId", "109");

    }

  }, [BrandData?.brand?.name]);

const location = useLocation();

const pageName = sessionStorage.getItem("pageName");

const pageId = sessionStorage.getItem("pageId");

console.log(pageName, pageId);