{"version":3,"sources":["webpack:///./Scripts/Components/HeaderServiceRating.js"],"names":["LIPSCORE_API_KEY","globalThis","lipscoreApiKey","LIPSCORE_LOCALE","lipscoreLocale","Star","starState","viewBox","className","width","height","style","fillRule","fill","transform","d","rating","setRating","useState","useEffect","fetch","then","res","json","lipscore","ratingInt","parseFloat","roundedRatingInt","Math","round","formattedRating","formatRating","catch","err","console","log","getStarState","index","diff","Array","from","length","map","_","idx","key"],"mappings":"+HACA,MAAMA,EAAmBC,WAAWC,eAC9BC,EAAkBF,WAAWG,eAQ7BC,EAAO,EAAGC,eACd,uBACEC,QAAQ,cACRC,UAAY,kDACVF,EACK,iBAAgBA,0BAAkCA,IACnD,IAENG,MAAM,OACNC,OAAO,OACPC,MAAO,CAAEC,SAAU,UAAWC,KAAM,YAEpC,qBAAGC,UAAU,6CACX,wBAAMC,EAAE,oHAEV,qBACEP,UAAU,0BACVM,UAAU,iCAEV,wBAAMC,EAAE,yIAyDd,EApD4B,KAC1B,MAAOC,EAAQC,IAAaC,iBAe5BC,gBAAU,MACHnB,GAAqBG,IA5CrBiB,MADM,gEAA+DpB,gEAA+EG,KACzIkB,MAAMC,GAAQA,EAAIC,SAiD/BF,MAAML,GAnBWA,KACpB,IAAKA,EAAOQ,SACV,OAGF,MACMC,EAAYC,WAAWV,EAAOQ,UAC9BG,EAAmBC,KAAKC,MAAkB,GAAZJ,GAAkB,GAChDK,EAAkBF,KAAKC,MAAOF,EAHpB,EAGkD,IAAM,GAExEV,EAAUa,EAAgB,EASNC,CAAaf,KAC9BgB,OAAOC,GAAQC,QAAQC,IAAIF,IAAK,GAClC,IAEH,MAAMG,EAAgBC,IACpB,QAAsB,IAAXrB,EAAwB,OAEnC,MAAMsB,EAAOtB,EAASqB,EACtB,OAAIC,EAAO,GAAKA,EAAO,EACd,aACEA,GAAQ,EACV,gBADF,CAGS,EAGlB,OAAOtB,EACL,gCACE,uBAAKR,UAAU,mCAAmCQ,GAClD,uBAAKR,UAAU,8CACb,uBAAKA,UAAU,mCACZ+B,MAAMC,KAAK,CAAEC,OA1EJ,IA0E2BC,KAAI,CAACC,EAAGC,IAC3C,gBAACvC,EAAI,CAACC,UAAW8B,EAAaQ,GAAMC,IAAM,kBAAiBD,WAKjE,IAAI,C","file":"923.2f1c8dffe90d5d8739ce.js","sourcesContent":["import React, { useEffect, useState } from 'react';\nconst LIPSCORE_API_KEY = globalThis.lipscoreApiKey;\nconst LIPSCORE_LOCALE = globalThis.lipscoreLocale;\nconst STAR_AMOUNT = 5;\n\nconst fetchRating = () => {\n  const url = `https://wapi.lipscore.com/initial_data/products/show?api_key=${LIPSCORE_API_KEY}&internal_id=service_review&widgets=srw_t&translate_to_lang=${LIPSCORE_LOCALE}`;\n  return fetch(url).then((res) => res.json());\n};\n\nconst Star = ({ starState }) => (\n  <svg\n    viewBox=\"0 0 19 18.1\"\n    className={`lipscore-rating-star lipscore-svg-rating-star ${\n      starState\n        ? `lipscore-star-${starState} lipscore-rating-star-${starState}`\n        : ''\n    }`}\n    width=\"20px\"\n    height=\"20px\"\n    style={{ fillRule: 'evenodd', fill: '#251e19' }}\n  >\n    <g transform=\"matrix(0.896868,0,0,0.983811,-0.279534,0)\">\n      <path d=\"M11.573,1.193L11.573,15.61L10.916,15.3L4.362,18.388L5.558,11.752L0.312,7.024L7.605,6.01L10.916,0L11.573,1.193Z\"></path>\n    </g>\n    <g\n      className=\"lipscore-star-last-half\"\n      transform=\"matrix(1,0,0,1,-133.489,-464)\"\n    >\n      <path d=\"M142.989,464.021L143,464L145.97,469.912L152.511,470.91L147.805,475.561L148.878,482.09L143,479.052L142.989,479.058L142.989,464.021Z\"></path>\n    </g>\n  </svg>\n);\n\nconst HeaderServiceRating = () => {\n  const [rating, setRating] = useState();\n\n  const formatRating = (rating) => {\n    if (!rating.lipscore) {\n      return;\n    }\n\n    const diviser = 2;\n    const ratingInt = parseFloat(rating.lipscore);\n    const roundedRatingInt = Math.round(ratingInt * 10) / 10;\n    const formattedRating = Math.round((roundedRatingInt / diviser) * 10) / 10;\n\n    setRating(formattedRating);\n  };\n\n  useEffect(() => {\n    if (!LIPSCORE_API_KEY && !LIPSCORE_LOCALE) {\n      return;\n    }\n\n    fetchRating()\n      .then((rating) => formatRating(rating))\n      .catch((err) => console.log(err));\n  }, []);\n\n  const getStarState = (index) => {\n    if (typeof rating === 'undefined') return undefined;\n\n    const diff = rating - index;\n    if (diff > 0 && diff < 1) {\n      return 'incomplete';\n    } else if (diff <= 0) {\n      return 'inactive';\n    }\n    return undefined;\n  };\n\n  return rating ? (\n    <>\n      <div className=\"lipscore-service-reviews__score\">{rating}</div>\n      <div className=\"lipscore-service-reviews__stars-and-amount\">\n        <div className=\"lipscore-service-reviews__stars\">\n          {Array.from({ length: STAR_AMOUNT }).map((_, idx) => (\n            <Star starState={getStarState(idx)} key={`lipscore-stars-${idx}`} />\n          ))}\n        </div>\n      </div>\n    </>\n  ) : null;\n};\n\nexport default HeaderServiceRating;\n"],"sourceRoot":""}