added Terms and Condition Page

src/components/Header/Header.tsx

@@ -1,13 +1,15 @@
 import React, { useState, ChangeEvent } from "react";
 import Logo from "../../assets/icons/logo.svg";
 import Button from "../shared/Button";
-import { lowerMenuItems } from "../../utils/data";
+import { _lowerMenuItems } from "../../utils/data";
 import Sidebar from "./Sidebar";
 import { Link } from "react-router-dom";
+import HeaderMenuItem from "./HeaderMenuItem";
 
-type LowerMenuItem = {
-  id: string | number;
+export type LowerMenuItem = {
   name: string;
+  linkPath: string;
+  subItems?: LowerMenuItem[];
 };
 
 type HiddenMenuItems = {
@@ -88,14 +90,9 @@ const Header: React.FC<HiddenMenuItems> = ({
                 />
               </svg>
             </div>
-            <ul className="hidden lg:flex gap-[10px] items-center justify-end flex-wrap">
-              {lowerMenuItems.map((item: LowerMenuItem) => (
-                <li
-                  key={item.id}
-                  className="cursor-pointer text-[13.5px] font-medium text-[#525252] tracking-[1px] leading-[-0.3pt]"
-                >
-                  {item.name}
-                </li>
+            <ul className="hidden lg:flex gap-[10px] items-center justify-end flex-wrap relative">
+              {_lowerMenuItems.map((item: LowerMenuItem, idx: number) => (
+                <HeaderMenuItem key={idx} item={item} />
               ))}
             </ul>
           </div>