import Image from "next/image";
import Link from "next/link";
import React from "react";

function Logo({ isAbsolute, matchedCity }) {
  const siteName =
    matchedCity?.site_name ||
    (matchedCity?.name ? `${matchedCity.name} نوبت` : "نوبت ۷۲۴");
  return (
    <Link
      href="/"
      aria-label={isAbsolute ? undefined : siteName}
      aria-hidden={isAbsolute ? true : undefined}
      tabIndex={isAbsolute ? -1 : undefined}
      className={isAbsolute ? "absolute right-[32px] top-0" : ""}
    >
      <div className="flex items-center justify-start gap-[5px]">
        <Image
          className="w-[20px] h-[20px] sm:w-[23px] sm:h-[23px] md:w-[26px] md:h-[26px] lg:w-[30px] lg:h-[30px]"
          src="/nobat724.svg"
          width={30}
          height={30}
          alt=""
        />
        <p className="text-[#526CAC] text-[14px] lg:text-[16px] font-bold">
          {siteName}
        </p>
      </div>
    </Link>
  );
}

export default Logo;