type DividerLabelProps = {
  label?: string;
  sideMargins?: string;
  isClient?: boolean;
};

function DividerLabel({ label, sideMargins, isClient }: DividerLabelProps) {
  const background = isClient ? "bg-others-mistyGray dark:bg-jet" : "bg-white";
  const textColor = isClient ? "text-black dark:text-white" : "text-gray-800";

  return (
    <div className="relative">
      <div aria-hidden className="absolute inset-0 flex items-center pt-8">
        <hr
          className={`${
            sideMargins ?? "mx-16"
          } w-full border-t border-gray-200`}
        />
      </div>
      {label && (
        <div className="relative flex justify-center pt-8">
          <span
            className={`${background} ${textColor} px-2 text-xs font-medium`}
          >
            {label}
          </span>
        </div>
      )}
    </div>
  );
}

export default DividerLabel;
