import React from 'react';
import { cn } from '../../utils/classNames';

const navLinkClass = 'text-sm font-medium text-app-muted transition-colors hover:text-app-text';

interface WebNavigationLinksProps {
  compact?: boolean;
}

const WebNavigationLinks: React.FC<WebNavigationLinksProps> = ({ compact = false }) => {
  return (
    <ul className={cn('flex items-center', compact ? 'gap-3' : 'gap-5')}>
      <li>
        <a href="https://actionpanelai.com/" className={navLinkClass}>Website</a>
      </li>
      <li>
        <a href="https://actionpanelai.com/privacy" className={navLinkClass}>Privacy</a>
      </li>
      <li>
        <a href="https://actionpanelai.com/terms" className={navLinkClass}>Terms</a>
      </li>
    </ul>
  );
};

export default React.memo(WebNavigationLinks);