fix: update product link and improve dropdown layout in HeaderClient

Dev

app/(website)/about/page.tsx

@@ -15,6 +15,8 @@ import {
   FaUserCheck,
   FaProjectDiagram,
 } from "react-icons/fa";
+import { Metadata } from "next";
+
 
 // const leadershipTeam = [
 //   {
@@ -42,6 +44,23 @@ import {
 //     linkedinUrl: "#",
 //   },
 // ];
+    export const metadata: Metadata = {
+    title: "About Us | Owethu Managed Services (OMS)",
+    description: "Learn about OMS, our mission, vision, and the values that drive us to deliver exceptional IT solutions and services.",
+    keywords: [
+      "Owethu Managed Services",
+      "About OMS",
+      "OMS",
+      "Black-owned ",
+      "Women-owned",
+      "Tech company",
+      "bank statement reader",
+      "fintech solutions" ,
+      
+     ],
+
+    }
+
 
 const coreValues = [
   {

app/(website)/contact/page.tsx

@@ -12,6 +12,7 @@ import {
 import { COLORS } from "@/constants"; // Using COLORS constant
 import ContactForm from "@/components/ContactForm";
 
+
 // Define the structure for FAQ items
 interface FAQItem {
   id: number;

app/(website)/offerings/page.tsx

@@ -29,6 +29,7 @@ export const metadata: Metadata = {
     "fintech solutions",
     "IT consulting",
     "OMS",
+    "CVEvolve",
     "Owethu Managed Services",
     "Centurion",
     "Gauteng",

app/(website)/page.tsx

@@ -14,6 +14,7 @@ import FeaturedProductSection, {
 } from "./_components/FeaturedProductSection";
 import { getHome } from "@/lib/query/home";
 
+
 export default async function HomePage() {
   // Explicitly type the data variable, assuming getHome returns HeroSectionType or null/undefined
   const data = await getHome();

app/(website)/portal/page.tsx

@@ -8,6 +8,7 @@ export const metadata: Metadata = {
   description:
     "Our recruitment portal is currently under development. Stay tuned for updates on career opportunities at Owethu Managed Services.",
   robots: "noindex, nofollow", // Prevent indexing of the coming soon page
+
 };
 
 export default function RecruitmentPortalPage() {

app/(website)/services/page.tsx

@@ -25,6 +25,8 @@ export const metadata: Metadata = {
     "IT resource augmentation",
     "managed IT services",
     "OBSE",
+    "CVEvolve",
+    "bank statement extractor",
     "bank statement automation",
     "fintech solutions",
     "IT consulting",

app/(website)/tech-talk/page.tsx

@@ -11,6 +11,7 @@ export const metadata: Metadata = {
   alternates: {
     canonical: "/tech-talk",
   },
+  
   openGraph: {
     title: "OMS TechTalk | Insights & Innovation",
     description: "Stay updated with tech insights from OMS.",

app/layout.tsx

@@ -19,6 +19,7 @@ export const metadata: Metadata = {
     "Owethu Managed Services (OMS) provides expert IT solutions in Centurion & South Africa, including resource augmentation, project management, custom software development, and the OBSE financial analysis tool.", // Include Keywords, Location, USP
   keywords: [
     "Owethu Managed Services",
+    "OMS",
     "OBSE",
     "IT solutions South Africa",
     "resource augmentation",
@@ -27,6 +28,7 @@ export const metadata: Metadata = {
     "OBSE",
     "financial data analysis",
     "IT services Centurion",
+    "digital transformation",
   ], // Add relevant keywords
   alternates: {
     canonical: "/", // Assuming this is the root URL

components/Footer.tsx

@@ -1,9 +1,10 @@
 // components/Footer.tsx
 import React from "react";
 import Link from "next/link";
-import { FaLinkedin, FaInstagram } from "react-icons/fa";
+import { FaLinkedin, FaInstagram, FaYoutube } from "react-icons/fa";
 import Image from "next/image";
 
+
 const omsLogoUrl = "/oms-logo.svg"; // Ensure this exists in /public
 // const omsLogoDarkUrl = "/oms-logo-dark.svg"; // Optional dark mode logo
 
@@ -127,7 +128,7 @@ const Footer = () => {
             {/* Social Icons - Use muted bright color, primary on hover */}
             <div className="flex space-x-4 mt-4">
               <a
-                href="https://linkedin.com"
+                href="https://www.linkedin.com/company/owethu-managed-services-oms"
                 target="_blank"
                 rel="noopener noreferrer"
                 className="text-[var(--oms-white)]/70 hover:text-primary transition-colors"
@@ -135,8 +136,9 @@ const Footer = () => {
               >
                 <FaLinkedin size={24} />
               </a>
+               
               <a
-                href="https://instagram.com"
+                href="https://www.instagram.com/owethumanagedservices_oms"
                 target="_blank"
                 rel="noopener noreferrer"
                 className="text-[var(--oms-white)]/70 hover:text-primary transition-colors"
@@ -144,6 +146,17 @@ const Footer = () => {
               >
                 <FaInstagram size={24} />
               </a>
+
+              <a
+                href="https://www.youtube.com/@OwethuManagedServices-africa"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="text-[var(--oms-white)]/70 hover:text-primary transition-colors"
+                aria-label="YouTube"
+              >
+                <FaYoutube size={24} />
+              </a>
+
             </div>
           </div>
 
@@ -223,6 +236,8 @@ const Footer = () => {
             >
               Privacy Policy
             </Link> */}
+
+        
             <a
               href="/Privacy-Policy/Recruitment-Privacy-Policy.pdf"
               className="hover:text-primary transition-colors"
@@ -236,6 +251,7 @@ const Footer = () => {
               PAIA & POPIA
             </a>
           </div>
+
         </div>
       </div>
     </footer>

components/HeaderClient.tsx

@@ -13,6 +13,7 @@ import {
   FiUsers,
   FiCpu,
   FiBox,
+  FiLayers
 } from "react-icons/fi";
 import ThemeToggle from "./ThemeToggle";
 
@@ -265,15 +266,16 @@ const HeaderClient = () => {
                     </div>
                   </div>
                 </div>
+
                 {/* Products */}
                 <div
-                  className={`group ${isActive("/obse") ? "active" : ""}`} // Add active class to group
+                  className={`group ${isActive("/products") ? "active" : ""}`} // Add active class to group
                   onMouseEnter={handleProductsMouseEnter}
                   onMouseLeave={handleProductsMouseLeave}
                 >
                   <button
                     className={`${megaMenuTriggerClasses} ${
-                      isActive("/obse") ? "after:w-full" : ""
+                      isActive("/products") ? "after:w-full" : ""
                     }`}
                   >
                     {" "}
@@ -283,7 +285,7 @@ const HeaderClient = () => {
                   </button>
                   <div
                     className={`
-                      absolute left-0 top-full w-full shadow-lg z-1000
+                      absolute left-0 top-full w-full shadow-lg z-40
                       bg-card border-x border-b border-border rounded-b-lg
                       opacity-0 invisible translate-y-[-10px]
                       ${
@@ -295,7 +297,7 @@ const HeaderClient = () => {
                     `}
                   >
                     <div className="container mx-auto px-4 sm:px-6 lg:px-8 py-5">
-                      <div className="max-w-md">
+                      <div className="grid grid-cols-1 md:grid-cols-2 gap-x-8 gap-y-6 max-w-xl">
                         <Link
                           href="/obse"
                           className={`${megaMenuItemClasses} ${
@@ -307,7 +309,44 @@ const HeaderClient = () => {
                           <FiBox className={megaMenuIconClasses} />
                           <div className={megaMenuTextWrapperClasses}>
                             <p className={megaMenuTitleClasses}>
+                                   
                               OBSE Platform
+
+                            </p>
+                          </div>
+                        </Link>
+                        {/* Add more service links here 
+                        <Link
+                          href="/services/project-management"
+                          className={`${megaMenuItemClasses} ${
+                            isActive("/services/project-management")
+                              ? "text-primary"
+                              : ""
+                          }`} // Apply active class
+                        >
+                          <FiBriefcase className={megaMenuIconClasses} />
+                          <div className={megaMenuTextWrapperClasses}>
+                            <p className={megaMenuTitleClasses}>
+                              Project Management
+                            </p>
+                          </div>
+                        </Link>
+                        */}
+                         <Link
+                          href="https://cvevolve.com/"
+                          target="_blank"
+                          className={`${megaMenuItemClasses} ${
+                            isActive("/obse") ? "text-primary" : ""
+                          }`}
+                        >
+                          {" "}
+                          {/* Apply active class */}
+                          <FiLayers className={megaMenuIconClasses} />
+                          <div className={megaMenuTextWrapperClasses}>
+                            <p className={megaMenuTitleClasses}>
+                                   
+                              CVEvolve
+                            
                             </p>
                           </div>
                         </Link>
@@ -315,6 +354,8 @@ const HeaderClient = () => {
                     </div>
                   </div>
                 </div>
+
+                
                 {/* Join Our Team */}
               
                 
@@ -425,6 +466,11 @@ const HeaderClient = () => {
             OBSE
           </DropdownLink>
 
+          {/* small screen investigation */}
+          <DropdownLink href="https://cvevolve.com" onClick={handleMobileLinkClick}>
+            CVEvolve    
+          </DropdownLink>
+
           {/* <span className="pt-3 pb-1 text-xs uppercase text-muted-foreground">
             Join Us
           </span>