| 1 | import FooterLink from './FooterLink'; |
| 2 | |
| 3 | const footerSections = [ |
| 4 | { |
| 5 | title: 'Product', |
| 6 | links: ['Features', 'Pricing', 'Changelog', 'Docs', 'API Reference'], |
| 7 | }, |
| 8 | { |
| 9 | title: 'Company', |
| 10 | links: ['About', 'Blog', 'Careers', 'Press', 'Partners'], |
| 11 | }, |
| 12 | { |
| 13 | title: 'Support', |
| 14 | links: ['Help Center', 'Contact', 'Status', 'Community', 'Security'], |
| 15 | }, |
| 16 | { |
| 17 | title: 'Legal', |
| 18 | links: ['Privacy', 'Terms', 'Cookie Policy', 'Licenses', 'GDPR'], |
| 19 | }, |
| 20 | ]; |
| 21 | |
| 22 | export default function Footer() { |
| 23 | return ( |
| 24 | <footer className="app-footer"> |
| 25 | <div className="footer-grid"> |
| 26 | {footerSections.map(section => ( |
| 27 | <div key={section.title} className="footer-section"> |
| 28 | <h4>{section.title}</h4> |
| 29 | <ul> |
| 30 | {section.links.map(link => ( |
| 31 | <li key={link}> |
| 32 | <FooterLink |
| 33 | href={'/' + link.toLowerCase().replace(/\s+/g, '-')}> |
| 34 | {link} |
| 35 | </FooterLink> |
| 36 | </li> |
| 37 | ))} |
| 38 | </ul> |
| 39 | </div> |
| 40 | ))} |
| 41 | </div> |
| 42 | <div className="footer-bottom"> |
| 43 | <p>© 2026 Acme Inc. All rights reserved.</p> |
| 44 | </div> |
| 45 | </footer> |
| 46 | ); |
| 47 | } |