components/editor/header.tsx

import HFLogo from "assets/hf-logo.svg";
import Image from "next/image";

export const EditorHeader = () => {
  return (
    <header className="px-6 py-2.5 border border-slate-950 bg-slate-950 flex justify-between items-center">
      <Image src={HFLogo} alt="Hugging Face Logo" width={34} height={34} />
      <p className="text-gray-300 font-code text-sm font-semibold">
        Hugging Face API
      </p>
      <div className="flex items-center justify-end gap-3">
        <div className="bg-teal-600 w-3 h-3 rounded-full" />
        <div className="bg-indigo-600 w-3 h-3 rounded-full" />
        <div className="bg-purple-500 w-3 h-3 rounded-full" />
      </div>
    </header>
  );
};