import { isEmpty } from "lodash";
import React, { useContext } from "react";
import SettingsContext from "../settings-context";
import HTMLComment from "react-html-comment";

interface IconProps {
  name: string;
  className?: string;
  title?: string;
  width?: number;
  height?: number;
}

const Icon: React.FC<IconProps> = ({
  name, className, title, width, height
}) => {
  const { icons } = useContext(SettingsContext);

  if (icons) {
    return (
      <svg
        className={["icon", `icon--${name}`, className]
          .filter((className) => !isEmpty(className))
          .join(" ")}
        width={width}
        height={height}
      >
        {title && <title>{title}</title>}
        <use href={`${icons}#${name}`}></use>
      </svg>
    );
  }

  switch (name) {
    case "ui-chevron":
      return (<svg className={["icon", `icon--${name}`, className]
        .filter((className) => !isEmpty(className))
        .join(" ")}
        width={width}
        height={height}
        viewBox="0 0 320 512"
      >
        <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
        {title && <title>{title}</title>}
        <path d="M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z"/>
      </svg>);

    case "ui-error":
      return (<svg className={["icon", `icon--${name}`, className]
        .filter((className) => !isEmpty(className))
        .join(" ")}
        width={width}
        height={height}
        viewBox="0 0 512 512"
      >
        <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
        {title && <title>{title}</title>}
        <path d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24l0 112c0 13.3-10.7 24-24 24s-24-10.7-24-24l0-112c0-13.3 10.7-24 24-24zM224 352a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z"/>
      </svg>);

    case "ui-tel":
      return (<svg className={["icon", `icon--${name}`, className]
        .filter((className) => !isEmpty(className))
        .join(" ")}
        width={width}
        height={height}
        viewBox="0 0 512 512"
      >
        <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
        {title && <title>{title}</title>}
        <path d="M164.9 24.6c-7.7-18.6-28-28.5-47.4-23.2l-88 24C12.1 30.2 0 46 0 64C0 311.4 200.6 512 448 512c18 0 33.8-12.1 38.6-29.5l24-88c5.3-19.4-4.6-39.7-23.2-47.4l-96-40c-16.3-6.8-35.2-2.1-46.3 11.6L304.7 368C234.3 334.7 177.3 277.7 144 207.3L193.3 167c13.7-11.2 18.4-30 11.6-46.3l-40-96z"/>
      </svg>);

    case "ui-mail":
      return (<svg className={["icon", `icon--${name}`, className]
        .filter((className) => !isEmpty(className))
        .join(" ")}
        width={width}
        height={height}
        viewBox="0 0 512 512"
      >
        <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
        {title && <title>{title}</title>}
        <path d="M48 64C21.5 64 0 85.5 0 112c0 15.1 7.1 29.3 19.2 38.4L236.8 313.6c11.4 8.5 27 8.5 38.4 0L492.8 150.4c12.1-9.1 19.2-23.3 19.2-38.4c0-26.5-21.5-48-48-48L48 64zM0 176L0 384c0 35.3 28.7 64 64 64l384 0c35.3 0 64-28.7 64-64l0-208L294.4 339.2c-22.8 17.1-54 17.1-76.8 0L0 176z"/>
      </svg>);

    case "ui-home":

    case "ui-filter":
      return (<svg className={["icon", `icon--${name}`, className]
        .filter((className) => !isEmpty(className))
        .join(" ")}
        width={width}
        height={height}
        viewBox="0 0 10.701 9.698"
      >
        {/* <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." /> */}
        {title && <title>{title}</title>}
        <g id="filter-solid" transform="translate(-2.667 -5.333)">
          <path id="Path_54" data-name="Path 54" d="M9.355,15.031V10.517l3.836-3.846a.605.605,0,0,0,.177-.435V5.668a.334.334,0,0,0-.334-.334H3a.334.334,0,0,0-.334.334v.558a.6.6,0,0,0,.177.425L6.68,10.544v3.411Z" transform="translate(0 0)" fill="#12aad8"/>
          <path id="Path_55" data-name="Path 55" d="M13.194,5.333H2.827a.174.174,0,0,0-.161.174v.575A.445.445,0,0,0,2.8,6.4L6.81,10.413v3.344l2.425,1.207V10.406l4.013-4.013a.451.451,0,0,0,.12-.3V5.507a.174.174,0,0,0-.174-.174Z" />
        </g>
      </svg>);

    case "ui-close":
      return (<svg className={["icon", `icon--${name}`, className]
        .filter((className) => !isEmpty(className))
        .join(" ")}
        width={width}
        height={height}
        viewBox="0 0 384 512"
      >
        <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
        {title && <title>{title}</title>}
        <path d="M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z"/>
      </svg>);

    case "ui-ticket":
      return (<svg className={["icon", `icon--${name}`, className]
        .filter((className) => !isEmpty(className))
        .join(" ")}
        width={width}
        height={height}
        viewBox="0 0 20 20"
      >
        {/* <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." /> */}
        {title && <title>{title}</title>}
        <g id="ticket" transform="translate(0.439 1.629)">
            <path id="Path_14" data-name="Path 14" d="M12.125,5.335l3.751,3.751L9.086,15.875,5.335,12.125Zm-2.5,11.62L16.955,9.62a.745.745,0,0,0,0-1.068l-4.3-4.3a.774.774,0,0,0-1.068,0L4.255,11.59a.745.745,0,0,0,0,1.068l4.3,4.3a.774.774,0,0,0,1.068,0ZM20.172,9.395,9.406,20.172a1.533,1.533,0,0,1-2.148,0l-1.5-1.5a2.293,2.293,0,0,0,0-3.228,2.2,2.2,0,0,0-1.614-.665,2.2,2.2,0,0,0-1.614.665l-1.484-1.5a1.533,1.533,0,0,1,0-2.148L11.816,1.05a1.533,1.533,0,0,1,2.148,0l1.484,1.484a2.2,2.2,0,0,0-.665,1.614,2.2,2.2,0,0,0,.665,1.614,2.293,2.293,0,0,0,3.228,0l1.5,1.484a1.533,1.533,0,0,1,0,2.148Z" transform="translate(-1.05 -2.24)"/>
        </g>
      </svg>);

    case "ui-payback":
      return (<svg className={["icon", `icon--${name}`, className]
        .filter((className) => !isEmpty(className))
        .join(" ")}
        width={width}
        height={height}
        viewBox="0 0 20 20.154"
      >
        {/* <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." /> */}
        {title && <title>{title}</title>}
        <g id="layer1" transform="translate(-205.148 -293.014)">
            <path id="path453469" d="M223.472,306.895a1.674,1.674,0,0,0-1.188.487l-1.971,1.972a1.67,1.67,0,0,0-.978-.726l-4.652-1.247a2.766,2.766,0,0,0-2.182.331l-2.9,1.832-.235-.408a1.089,1.089,0,0,0-1.471-.394l-2.209,1.274a1.089,1.089,0,0,0-.394,1.471l3.291,5.7a1.088,1.088,0,0,0,1.47.4l2.209-1.276a1.09,1.09,0,0,0,.395-1.471l-.043-.076,1.258-.85,4.63.911a1.742,1.742,0,0,0,1.653-.514c1.493-1.527,2.988-3.048,4.505-4.544l0,0a1.675,1.675,0,0,0-1.189-2.863Zm0,1.332a.336.336,0,0,1,.238.1.323.323,0,0,1,0,.476c-1.525,1.5-3.024,3.031-4.518,4.559a1.847,1.847,0,0,1-.433.134l-4.9-.963a.672.672,0,0,0-.507.1l-1.411.954-1.667-2.886,2.947-1.858a1.411,1.411,0,0,1,1.118-.171l4.652,1.247a.336.336,0,1,1-.175.65l-2.92-.782a.672.672,0,0,0-.348,1.3l2.92.782a1.693,1.693,0,0,0,1.741-.572.672.672,0,0,0,.177-.118l2.85-2.852A.336.336,0,0,1,223.472,308.226Zm-15.14,1.812.325.564a.615.615,0,0,0,.253.438l2.445,4.235-1.745,1.008-3.024-5.237Z" transform="translate(0 -4.554)"  fill-rule="evenodd"/>
            <path id="path453459" d="M223.672,301.014a.672.672,0,1,0,0,1.344h1.344a.672.672,0,1,0,0-1.344Z" transform="translate(-5.857 -2.625)"  fill-rule="evenodd"/>
            <path id="path453437" d="M223.672,297.014a.672.672,0,0,0,0,1.344h1.344a.672.672,0,0,0,0-1.344Z" transform="translate(-5.857 -1.312)"  fill-rule="evenodd"/>
            <path id="rect18334" d="M222.7,293.014a4.7,4.7,0,1,0,4.7,4.7A4.714,4.714,0,0,0,222.7,293.014Zm0,1.344a3.359,3.359,0,1,1-3.359,3.359A3.349,3.349,0,0,1,222.7,294.357Z" transform="translate(-4.217)"  fill-rule="evenodd"/>
        </g>
      </svg>);

    case "ui-backpack":
      return (<svg className={["icon", `icon--${name}`, className]
        .filter((className) => !isEmpty(className))
        .join(" ")}
        width={width}
        height={height}
        viewBox="0 0 14.499 16.11"
      >
        {/* <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." /> */}
        {title && <title>{title}</title>}
        <path id="Path_2" data-name="Path 2" d="M22.444,28.805A.805.805,0,0,0,21.639,28H16.806a.806.806,0,0,0-.806.806v1.611h6.444ZM16,32.027h6.444v2.417H16Z" transform="translate(-11.972 -18.334)" />
        <path id="Path_3" data-name="Path 3" d="M20.5,12.055a4.837,4.837,0,0,0-4.028-4.761V6.417A2.419,2.419,0,0,0,14.055,4H12.444a2.419,2.419,0,0,0-2.417,2.417v.878A4.837,4.837,0,0,0,6,12.055V18.5A1.613,1.613,0,0,0,7.611,20.11h.806V14.472a2.419,2.419,0,0,1,2.417-2.417h4.833a2.419,2.419,0,0,1,2.417,2.417V20.11h.806A1.613,1.613,0,0,0,20.5,18.5ZM11.639,6.417a.806.806,0,0,1,.806-.806h1.611a.805.805,0,0,1,.805.806v.806H11.639Z" transform="translate(-6 -4)"/>
      </svg>);

    case "ui-suitcase":
      return (<svg className={["icon", `icon--${name}`, className]
        .filter((className) => !isEmpty(className))
        .join(" ")}
        width={width}
        height={height}
        viewBox="0 0 15.992 13.708"
      >
        {/* <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." /> */}
        {title && <title>{title}</title>}
        <path id="Path_21" data-name="Path 21" d="M5.712,2.285h4.569V1.142H5.712Zm-3.141,0V13.708H2a1.924,1.924,0,0,1-1.41-.589A1.924,1.924,0,0,1,0,11.709V4.284a1.924,1.924,0,0,1,.589-1.41A1.924,1.924,0,0,1,2,2.285Zm10,0V13.708H3.427V2.285H4.569V.857A.826.826,0,0,1,4.819.25.826.826,0,0,1,5.426,0h5.14a.826.826,0,0,1,.607.25.826.826,0,0,1,.25.607V2.285Zm3.427,2v7.425a2.011,2.011,0,0,1-2,2h-.571V2.285h.571a1.924,1.924,0,0,1,1.41.589A1.924,1.924,0,0,1,15.992,4.284Z" transform="translate(0 0)"/>
      </svg>);

    case "ui-business-lounge":
      return (<svg className={["icon", `icon--${name}`, className]
        .filter((className) => !isEmpty(className))
        .join(" ")}
        width={width}
        height={height}
        viewBox="0 0 20 19.999"
      >
        {/* <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." /> */}
        {title && <title>{title}</title>}
        <g id="waiting-room-svgrepo-com" transform="translate(0 -0.008)">
            <g id="Group_46" data-name="Group 46" transform="translate(0 0.008)">
            <g id="Group_45" data-name="Group 45" transform="translate(0)">
                <path id="Path_33" data-name="Path 33" d="M65.683,110.007a1.667,1.667,0,1,0-1.667-1.667A1.666,1.666,0,0,0,65.683,110.007Z" transform="translate(-61.515 -102.507)" />
                <path id="Path_34" data-name="Path 34" d="M6.25,242.2H2.418L.824,235.025a.417.417,0,1,0-.814.181l1.657,7.455v2.454a.417.417,0,1,0,.833,0v-2.083H5v2.083a.417.417,0,1,0,.833,0v-2.083h.417a.417.417,0,0,0,0-.833Z" transform="translate(0 -225.532)" />
                <path id="Path_35" data-name="Path 35" d="M281.933.008a4.583,4.583,0,1,0,4.583,4.583A4.588,4.588,0,0,0,281.933.008Zm1.667,5h-1.667a.417.417,0,0,1-.417-.417v-2.5a.417.417,0,0,1,.833,0V4.175h1.25a.417.417,0,1,1,0,.833Z" transform="translate(-266.516 -0.008)" />
                <path id="Path_36" data-name="Path 36" d="M70.265,218.341H67.348v-3.333a1.667,1.667,0,0,0-3.333,0v4.583a1.251,1.251,0,0,0,1.25,1.25h3.75v2.917a1.25,1.25,0,1,0,2.5,0v-4.167A1.251,1.251,0,0,0,70.265,218.341Z" transform="translate(-61.514 -205.008)" />
            </g>
            </g>
        </g>
      </svg>);

    case "ui-shopping-bag":
      return (<svg className={["icon", `icon--${name}`, className]
        .filter((className) => !isEmpty(className))
        .join(" ")}
        width={width}
        height={height}
        viewBox="0 0 13.299 14.65"
      >
        {/* <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." /> */}
        {title && <title>{title}</title>}
        <path id="Path_22" data-name="Path 22" d="M9.135.6A3.523,3.523,0,0,0,5.612,4.123V5.691A2.455,2.455,0,0,0,5,5.869,2.967,2.967,0,0,0,3.842,6.8,6.951,6.951,0,0,0,3,9.393c-.452,2.056-.678,3.083-.392,3.885A2.967,2.967,0,0,0,3.835,14.8c.721.451,1.774.451,3.878.451h2.843c2.1,0,3.157,0,3.878-.451a2.967,2.967,0,0,0,1.223-1.521c.285-.8.059-1.829-.392-3.885a6.951,6.951,0,0,0-.837-2.59,2.967,2.967,0,0,0-1.162-.934,2.456,2.456,0,0,0-.608-.178V4.123A3.523,3.523,0,0,0,9.135.6Zm2.411,5.012V4.123a2.411,2.411,0,0,0-4.821,0V5.612c.287,0,.613,0,.989,0h2.843C10.933,5.607,11.259,5.607,11.546,5.612ZM6.168,8.574a.742.742,0,1,0-.742-.742A.742.742,0,0,0,6.168,8.574Zm6.676-.742A.742.742,0,1,1,12.1,7.09.742.742,0,0,1,12.844,7.832Z" transform="translate(-2.486 -0.6)" fill-rule="evenodd"/>
      </svg>);

    case "ui-priority":
      return (<svg className={["icon", `icon--${name}`, className]
        .filter((className) => !isEmpty(className))
        .join(" ")}
        width={width}
        height={height}
        viewBox="0 0 20 17.533"
      >
        {/* <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." /> */}
        {title && <title>{title}</title>}
        <g id="list-high-priority" transform="translate(-1.5 -2.552)">
            <path id="Path_24" data-name="Path 24" d="M24,39H34v1.333H24Z" transform="translate(-12.5 -20.249)" />
            <path id="Path_25" data-name="Path 25" d="M24,29H34v1.333H24Z" transform="translate(-12.5 -14.694)" />
            <path id="Path_26" data-name="Path 26" d="M24,19H34v1.333H24Z" transform="translate(-12.5 -9.138)" />
            <path id="Path_27" data-name="Path 27" d="M30.75,9h7v1.333h-7Z" transform="translate(-16.25 -3.583)" />
            <path id="Path_28" data-name="Path 28" d="M13.417,6.043,7.8,2.551V5.418H7.551a5.544,5.544,0,0,0-4.326,2.2A8.164,8.164,0,0,0,1.5,12.751a8.164,8.164,0,0,0,1.725,5.133,5.544,5.544,0,0,0,4.326,2.2H9.833V18.751H7.551c-2.6,0-4.718-2.692-4.718-6s2.117-6,4.718-6H7.8V9.635ZM9.133,4.95l1.783,1.109L9.133,7.2Z" />
        </g>
      </svg>);

    case "ui-tooltip":
      return (<svg className={["icon", `icon--${name}`, className]
        .filter((className) => !isEmpty(className))
        .join(" ")}
        width={width}
        height={height}
        viewBox="0 0 512 512"
      >
        <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
        {title && <title>{title}</title>}
        <path d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336l24 0 0-64-24 0c-13.3 0-24-10.7-24-24s10.7-24 24-24l48 0c13.3 0 24 10.7 24 24l0 88 8 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-80 0c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z"/>
      </svg>);

    case "ui-qsm-location":
      return (<svg className={["icon", `icon--${name}`, className]
        .filter((className) => !isEmpty(className))
        .join(" ")}
        width={width}
        height={height}
        viewBox="0 0 384 512"
      >
        <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
        {title && <title>{title}</title>}
        <path d="M215.7 499.2C267 435 384 279.4 384 192C384 86 298 0 192 0S0 86 0 192c0 87.4 117 243 168.3 307.2c12.3 15.3 35.1 15.3 47.4 0zM192 128a64 64 0 1 1 0 128 64 64 0 1 1 0-128z"/>
      </svg>);

    case "ui-plane-depart":
      return (<svg className={["icon", `icon--${name}`, className]
        .filter((className) => !isEmpty(className))
        .join(" ")}
        width={width}
        height={height}
        viewBox="0 0 640 512"
      >
        <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
        {title && <title>{title}</title>}
        <path d="M381 114.9L186.1 41.8c-16.7-6.2-35.2-5.3-51.1 2.7L89.1 67.4C78 73 77.2 88.5 87.6 95.2l146.9 94.5L136 240 77.8 214.1c-8.7-3.9-18.8-3.7-27.3 .6L18.3 230.8c-9.3 4.7-11.8 16.8-5 24.7l73.1 85.3c6.1 7.1 15 11.2 24.3 11.2l137.7 0c5 0 9.9-1.2 14.3-3.4L535.6 212.2c46.5-23.3 82.5-63.3 100.8-112C645.9 75 627.2 48 600.2 48l-57.4 0c-20.2 0-40.2 4.8-58.2 14L381 114.9zM0 480c0 17.7 14.3 32 32 32l576 0c17.7 0 32-14.3 32-32s-14.3-32-32-32L32 448c-17.7 0-32 14.3-32 32z"/>
      </svg>);

    case "ui-plane-arrive":
      return (<svg className={["icon", `icon--${name}`, className]
        .filter((className) => !isEmpty(className))
        .join(" ")}
        width={width}
        height={height}
        viewBox="0 0 640 512"
      >
        <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
        {title && <title>{title}</title>}
        <path d="M.3 166.9L0 68C0 57.7 9.5 50.1 19.5 52.3l35.6 7.9c10.6 2.3 19.2 9.9 23 20L96 128l127.3 37.6L181.8 20.4C178.9 10.2 186.6 0 197.2 0l40.1 0c11.6 0 22.2 6.2 27.9 16.3l109 193.8 107.2 31.7c15.9 4.7 30.8 12.5 43.7 22.8l34.4 27.6c24 19.2 18.1 57.3-10.7 68.2c-41.2 15.6-86.2 18.1-128.8 7L121.7 289.8c-11.1-2.9-21.2-8.7-29.3-16.9L9.5 189.4c-5.9-6-9.3-14.1-9.3-22.5zM32 448l576 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 512c-17.7 0-32-14.3-32-32s14.3-32 32-32zm96-80a32 32 0 1 1 64 0 32 32 0 1 1 -64 0zm128-16a32 32 0 1 1 0 64 32 32 0 1 1 0-64z"/>
      </svg>);

    case "ui-clock":
      return (<svg className={["icon", `icon--${name}`, className]
        .filter((className) => !isEmpty(className))
        .join(" ")}
        width={width}
        height={height}
        viewBox="0 0 19 19"
      >
        {/* <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." /> */}
        {title && <title>{title}</title>}
        <g id="Group_56" data-name="Group 56" transform="translate(-390 -665)">
            <circle id="Ellipse_5" data-name="Ellipse 5" cx="9.5" cy="9.5" r="9.5" transform="translate(390 665)" fill="#fff"/>
            <g id="time" transform="translate(391.211 666.211)">
            <path id="Path_11" data-name="Path 11" d="M8.289,13.578a5.289,5.289,0,1,1,5.289-5.289A5.289,5.289,0,0,1,8.289,13.578Zm0-9.823a4.534,4.534,0,1,0,4.534,4.534A4.534,4.534,0,0,0,8.289,3.756Z" transform="translate(0 0)"/>
            <path id="Path_12" data-name="Path 12" d="M24.612,16.167,22.5,14.055V10.5h.756v3.241l1.889,1.893Z" transform="translate(-14.589 -5.611)"/>
            </g>
        </g>
      </svg>);

    default:
      return null;
  }

};

export default Icon;