import { Link } from 'react-router'

import { NotificationIcon } from '~/components/icons/notification'
import { APP } from '~/data/meta'

export const Navbar = () => {
  return (
    <div className="flex h-20 items-center justify-between border-b border-[#ECECEC] bg-white px-10 py-5">
      <Link
        to="/news"
        className="h-full"
      >
        <img
          src={APP.logo}
          alt={APP.title}
          className="h-3/4 w-auto sm:h-full"
        />
      </Link>
      <div>
        <NotificationIcon
          className="text-[#B0C3CC]"
          showBadge={true}
        />
      </div>
    </div>
  )
}