import React from "react";

const Layout: React.FC = () => {
  return (
    <>
      <div data-tauri-drag-region className="titlebar">
        <div className="titlebar-button relative group">
          <img
            src="/close.svg"
            alt="close"
            className="relative z-10 w-4 h-4 group-hover:hidden"
          />
          <img
            src="/close_hover.svg"
            alt="close hover"
            className="relative z-10 w-4 h-4 hidden group-hover:inline"
          />
        </div>

        <div className="titlebar-button relative group">
          <img
            src="/minimize.svg"
            alt="minimize"
            className="relative z-10 w-4 h-4 group-hover:hidden"
          />
          <img
            src="/minimize_hover.svg"
            alt="minimize hover"
            className="relative z-10 w-4 h-4 hidden group-hover:inline"
          />
        </div>

        <div className="titlebar-button relative group">
          <img
            src="/maximize.svg"
            alt="maximize"
            className="relative z-10 w-4 h-4 group-hover:hidden"
          />
          <img
            src="/maximize_hover.svg"
            alt="maximize hover"
            className="relative z-10 w-4 h-4 hidden group-hover:inline"
          />
        </div>
      </div>
    </>
  );
};

export default Layout;