FeedTabs.tsx 706 B

1234567891011121314151617181920212223242526272829303132
  1. 'use client';
  2. import Link from 'next/link';
  3. import { usePathname } from 'next/navigation';
  4. const TABS = [
  5. { href: '/feed/all', label: '전체' },
  6. { href: '/feed/foryou', label: '추천' },
  7. { href: '/feed/following', label: '팔로잉' }
  8. ] as const;
  9. export default function FeedTabs() {
  10. const pathname = usePathname();
  11. return (
  12. <nav className="feed__tabs" aria-label="피드 탭">
  13. {TABS.map((tab) => {
  14. const active = pathname === tab.href;
  15. return (
  16. <Link
  17. key={tab.href}
  18. href={tab.href}
  19. className={`feed__tab${active ? ' feed__tab--active' : ''}`}
  20. aria-current={active ? 'page' : undefined}
  21. >
  22. {tab.label}
  23. </Link>
  24. );
  25. })}
  26. </nav>
  27. );
  28. }