PublicLayout.jsx

Go to the documentation of this file.

import { Link, useNavigate } from 'react-router-dom';
import './PublicLayout.css';
 
function PublicLayout({ children }) {
  const navigate = useNavigate();
  const token = localStorage.getItem('token');
 
  return (
    <div className="public-layout">
      <header className="public-header">
        <div className="header-container">
          <div className="logo">
            <Link to="/">
              <h1>IBG MSP Platform</h1>
            </Link>
          </div>
          <nav className="public-nav">
            <Link to="/" className="nav-link">Home</Link>
            <Link to="/docs" className="nav-link">Documentation</Link>
            {token ? (
              <button 
                onClick={() => navigate('/dashboard')} 
                className="btn-primary"
              >
                Dashboard
              </button>
            ) : (
              <Link to="/login" className="btn-primary">Login</Link>
            )}
          </nav>
        </div>
      </header>
 
      <main className="public-main">
        {children}
      </main>
 
      <footer className="public-footer">
        <div className="footer-container">
          <div className="footer-section">
            <h3>IBG MSP Platform</h3>
            <p>Complete remote monitoring and management for modern MSPs.</p>
          </div>
          <div className="footer-section">
            <h4>Platform</h4>
            <ul>
              <li><Link to="/docs">Documentation</Link></li>
              <li><Link to="/login">Login</Link></li>
              <li><Link to="/about">About</Link></li>
            </ul>
          </div>
          <div className="footer-section">
            <h4>Support</h4>
            <ul>
              <li><Link to="/docs/contact-support">Contact Us</Link></li>
              <li><Link to="/docs/faq">FAQ</Link></li>
              <li><Link to="/docs/troubleshooting">Get Help</Link></li>
            </ul>
          </div>
          <div className="footer-section">
            <h4>Legal</h4>
            <ul>
              <li><Link to="/privacy">Privacy Policy</Link></li>
              <li><Link to="/terms">Terms of Service</Link></li>
              <li><Link to="/security">Security</Link></li>
            </ul>
          </div>
        </div>
        <div className="footer-bottom">
          <p>&copy; {new Date().getFullYear()} IBG MSP Platform. All rights reserved.</p>
        </div>
      </footer>
    </div>
  );
}
 
export default PublicLayout;