src/components/Header.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

import React from 'react';
import { Link } from 'react-router-dom';

interface Props {
  navigation: {
    name: string;
    route: string;
  }[];
}

const Header: React.FC<Props> = ({ children, navigation }) => {
  return (
    <header className="bg-black text-white flex">
      {navigation.map(({ name, route }) => (
        <Link to={route} className="py-6 px-8 font-bold tracking-wide hover:underline">{name}</Link>
      ))}
    </header>
  );
};

export default Header;