file.txt

import { Routes, Route } from 'react-router-dom';
import Dashboard from '../pages/admin/dashboard';
import Services from '../pages/admin/addServices';
import Projects from '../pages/admin/addProjects';
import BlogPosts from '../pages/admin/addBlog';
import JobApplications from '../pages/admin/viewApplications';
import Messages from '../pages/admin/messageView';
import AdminViewHeader from '../components/admin-view-header'

function AdminViewRoutes() {
  return (
    <>
    <div className="flex">
      <div className="flex-grow p-4">
        <AdminViewHeader />
        <Routes>
          <Route path="/" element={<Dashboard />} />
          <Route path="services" element={<Services />} />
          <Route path="projects" element={<Projects />} />
          <Route path="blog-posts" element={<BlogPosts />} />
          <Route path="job-applications" element={<JobApplications />} />
          <Route path="messages" element={<Messages />} />
        </Routes>
      </div>
    </div>
    </>
  );
}

export default AdminViewRoutes;









_________________________________________________________________________________________________________________________________________



import React, { useState } from 'react';
import { Link } from 'react-router-dom';
import '../assests/styles/rootlayout.css';

function AdminViewHeader() {
    const [isActive, setIsActive] = useState(false);

    const toggleMenu = () => {
        setIsActive(!isActive);
    };

    return (
        <>
            <header className="header">
                <div className="logo">Tiibu Co. Ltd</div>
                <div className="menu-icon" onClick={toggleMenu}>
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
                        <line x1="3" y1="12" x2="21" y2="12"></line>
                        <line x1="3" y1="6" x2="21" y2="6"></line>
                        <line x1="3" y1="18" x2="21" y2="18"></line>
                    </svg>
                </div>
                <nav className={`nav-menu ${isActive ? 'active' : ''}`}>
                    <ul>
                                <ul>
                                    <li><Link to="/dashboard">Dashboard</Link></li>
                                    <li><Link to="/dashboard/services">Services</Link></li>
                                    <li><Link to="/dashboard/projects">Projects</Link></li>
                                    <li><Link to="/dashboard/blog-posts">Blog Posts</Link></li>
                                    <li><Link to="/dashboard/job-applications">Job Applications</Link></li>
                                    <li><Link to="/dashboard/messages">Messages</Link></li>
                                </ul>
                    </ul>
                </nav>
            </header>
        </>
    );
}

export default AdminViewHeader;