import React from "react";
import { IntegrationLogoSvgWrapper, SvgLogoProps } from "./wrapper";

export const OktaSvg = ({
  color = "#007dc1",
  square,
  ...rest
}: SvgLogoProps) => {
  const viewBox = square ? "0 0 32 32" : "0 0 95 32";
  const path = square ? (
    <path
      fill={color}
      d="M16 0C7.185 0 0 7.1335 0 16C0 24.8665 7.134 32 16 32C24.866 32 32 24.866 32 16C32 7.134 24.815 0 16 0ZM16 24C11.567 24 8 20.433 8 16C8 11.567 11.567 8 16 8C20.433 8 24 11.567 24 16C24 20.433 20.433 24 16 24Z"
    />
  ) : (
    <path
      fill={color}
      d="M11.9477 8.02854C5.36504 8.02854 0 13.3555 0 19.9762C0 23.1449 1.25877 26.1839 3.49939 28.4245C5.74002 30.6651 8.77896 31.9239 11.9477 31.9239C15.1164 31.9239 18.1553 30.6651 20.396 28.4245C22.6366 26.1839 23.8954 23.1449 23.8954 19.9762C23.8954 13.3555 18.5303 8.02854 11.9477 8.02854V8.02854ZM11.9477 25.9501C8.63733 25.9501 5.97384 23.2866 5.97384 19.9762C5.97384 16.6659 8.63733 14.0024 11.9477 14.0024C15.258 14.0024 17.9215 16.6659 17.9215 19.9762C17.9215 23.2866 15.258 25.9501 11.9477 25.9501ZM32.9132 23.9715C32.9132 23.0202 34.0547 22.5636 34.7015 23.2485L42.654 31.5434C42.7301 31.6195 42.8062 31.7337 43.0725 31.8098C43.1867 31.8478 43.3769 31.8478 43.5672 31.8478H48.9703C49.9215 31.8478 50.2259 30.7444 49.7693 30.1736L40.8276 21.0416L40.371 20.547C39.3436 19.3294 39.4578 18.8728 40.6373 17.6171L47.7527 9.74078C48.2093 9.17004 47.9049 8.06659 46.9156 8.06659H42.0452C41.8549 8.06659 41.7027 8.06659 41.5886 8.10464C41.2842 8.18074 41.2081 8.29489 41.132 8.37099C41.0939 8.40904 37.1748 12.6326 34.7776 15.22C34.1308 15.9429 32.9512 15.4483 32.9512 14.497V0.951249C32.9512 0.26635 32.3805 0 31.9239 0H27.9287C27.2438 0 26.9013 0.456599 26.9013 0.875148V30.9346C26.9013 31.6195 27.4721 31.8098 27.9287 31.8098H31.9239C32.5327 31.8098 32.9512 31.3532 32.9512 30.8966V30.5922L32.9132 23.9715ZM65.4839 30.7824L65.0654 26.7872C64.9893 26.2545 64.4946 25.874 63.9619 25.9501L63.0487 26.0262C59.8526 26.0262 57.2652 23.5149 57.113 20.3948V15.1819C57.113 14.5351 57.5696 14.0404 58.2164 14.0404H63.5434C63.9239 14.0404 64.4946 13.736 64.4946 13.0131V9.24614C64.4946 8.52319 64.038 8.10464 63.6195 8.10464H58.2545C57.6457 8.10464 57.113 7.64804 57.113 7.03924V0.989298C57.113 0.608798 56.8466 0.0380494 56.0856 0.0380494H52.1284C51.6338 0.0380494 51.1391 0.342449 51.1391 0.951249V20.3948C51.2913 26.8252 56.5803 32 63.0868 32C63.6195 32 64.1522 31.9619 64.6849 31.8858C65.1415 31.8097 65.56 31.3151 65.4839 30.7824V30.7824ZM94.2497 25.7598C90.8633 25.7598 90.3686 24.5422 90.3686 20.0143V9.09394C90.3686 8.71344 90.1023 8.06659 89.3413 8.06659H85.346C84.8514 8.06659 84.3187 8.44709 84.3187 9.09394V9.58858C82.5684 8.59929 80.5898 8.02854 78.4209 8.02854C71.8383 8.02854 66.4732 13.3555 66.4732 19.9762C66.4697 21.5462 66.7764 23.1014 67.3756 24.5526C67.9747 26.0037 68.8547 27.3222 69.9648 28.4323C71.075 29.5425 72.3934 30.4224 73.8446 31.0216C75.2957 31.6208 76.8509 31.9274 78.4209 31.9239C81.3888 31.9239 84.0904 30.8585 86.1831 29.0702C87.3246 30.7824 89.113 31.9239 91.9286 31.9239C92.4233 31.9239 94.9726 32 94.9726 30.8205V26.5589C94.9346 26.1784 94.6302 25.7598 94.2497 25.7598V25.7598ZM78.4209 25.9501C75.1106 25.9501 72.4471 23.2866 72.4471 19.9762C72.4471 16.6659 75.1106 14.0024 78.4209 14.0024C81.7313 14.0024 84.3948 16.6659 84.3948 19.9762C84.3567 23.2866 81.6932 25.9501 78.4209 25.9501Z"
    />
  );

  return (
    <IntegrationLogoSvgWrapper viewBox={viewBox} {...rest}>
      <title>Okta integration logo</title>
      {path}
    </IntegrationLogoSvgWrapper>
  );
};
