\n })\n }\n}\n\nexport enum APIMethods {\n USER_LISTALL = \"LIST_USERS\",\n VAS_LISTALL = \"LIST_VAS\",\n TECDOC_GETCOUNTRIES = \"getCountries\",\n TECDOC_GETARTICLE = \"getArticleDirectSearchAllNumbersWithState\",\n TECDOC_GETBRANDDETAILS = \"getAmBrandAddress\",\n TECDOC_GETARTICLEDETAILS = \"getDirectArticlesByIds6\",\n TECDOC_ADDIPADDRESS = \"addDynamicAddress\",\n TECDOC_GETVEHICLELIST = \"getArticleLinkedAllLinkingTarget3\",\n TECDOC_GETVEHICLEDETAILSLIST = \"getVehicleByIds4\",\n TECDOC_GETVEHICLELISTIMMEDIATEATTRIBUTS = \"getArticleLinkedAllLinkingTargetsByIds3\",\n}\n","var map = {\n\t\"./de.json\": [\n\t\t755,\n\t\t59\n\t],\n\t\"./en.json\": [\n\t\t206\n\t],\n\t\"./es.json\": [\n\t\t756,\n\t\t60\n\t],\n\t\"./fr.json\": [\n\t\t757,\n\t\t61\n\t],\n\t\"./it.json\": [\n\t\t758,\n\t\t62\n\t]\n};\nfunction webpackAsyncContext(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\treturn Promise.resolve().then(function() {\n\t\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\t\te.code = 'MODULE_NOT_FOUND';\n\t\t\tthrow e;\n\t\t});\n\t}\n\n\tvar ids = map[req], id = ids[0];\n\treturn Promise.all(ids.slice(1).map(__webpack_require__.e)).then(function() {\n\t\treturn __webpack_require__.t(id, 3);\n\t});\n}\nwebpackAsyncContext.keys = function webpackAsyncContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackAsyncContext.id = 348;\nmodule.exports = webpackAsyncContext;","var map = {\n\t\"./af.json\": 596,\n\t\"./am.json\": 597,\n\t\"./ar.json\": 598,\n\t\"./az.json\": 599,\n\t\"./be.json\": 600,\n\t\"./bg.json\": 601,\n\t\"./bn.json\": 602,\n\t\"./br.json\": 603,\n\t\"./bs.json\": 604,\n\t\"./ca.json\": 605,\n\t\"./cs.json\": 606,\n\t\"./cy.json\": 607,\n\t\"./da.json\": 608,\n\t\"./de.json\": 609,\n\t\"./dv.json\": 610,\n\t\"./el.json\": 611,\n\t\"./en.json\": 612,\n\t\"./es.json\": 613,\n\t\"./et.json\": 614,\n\t\"./eu.json\": 615,\n\t\"./fa.json\": 616,\n\t\"./fi.json\": 617,\n\t\"./fr.json\": 618,\n\t\"./ga.json\": 619,\n\t\"./gl.json\": 620,\n\t\"./ha.json\": 621,\n\t\"./he.json\": 622,\n\t\"./hi.json\": 623,\n\t\"./hr.json\": 624,\n\t\"./hu.json\": 625,\n\t\"./hy.json\": 626,\n\t\"./id.json\": 627,\n\t\"./is.json\": 628,\n\t\"./it.json\": 629,\n\t\"./ja.json\": 630,\n\t\"./ka.json\": 631,\n\t\"./kk.json\": 632,\n\t\"./km.json\": 633,\n\t\"./ko.json\": 634,\n\t\"./ku.json\": 635,\n\t\"./ky.json\": 636,\n\t\"./lt.json\": 637,\n\t\"./lv.json\": 638,\n\t\"./mk.json\": 639,\n\t\"./ml.json\": 640,\n\t\"./mn.json\": 641,\n\t\"./mr.json\": 642,\n\t\"./ms.json\": 643,\n\t\"./nb.json\": 644,\n\t\"./nl.json\": 645,\n\t\"./nn.json\": 646,\n\t\"./no.json\": 647,\n\t\"./pl.json\": 648,\n\t\"./ps.json\": 649,\n\t\"./pt.json\": 650,\n\t\"./ro.json\": 651,\n\t\"./ru.json\": 652,\n\t\"./sd.json\": 653,\n\t\"./sk.json\": 654,\n\t\"./sl.json\": 655,\n\t\"./so.json\": 656,\n\t\"./sq.json\": 657,\n\t\"./sr.json\": 658,\n\t\"./sv.json\": 659,\n\t\"./sw.json\": 660,\n\t\"./ta.json\": 661,\n\t\"./tg.json\": 662,\n\t\"./th.json\": 663,\n\t\"./tr.json\": 664,\n\t\"./tt.json\": 665,\n\t\"./ug.json\": 666,\n\t\"./uk.json\": 667,\n\t\"./ur.json\": 668,\n\t\"./uz.json\": 669,\n\t\"./vi.json\": 670,\n\t\"./zh.json\": 671\n};\n\n\nfunction webpackContext(req) {\n\tvar id = webpackContextResolve(req);\n\treturn __webpack_require__(id);\n}\nfunction webpackContextResolve(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\te.code = 'MODULE_NOT_FOUND';\n\t\tthrow e;\n\t}\n\treturn map[req];\n}\nwebpackContext.keys = function webpackContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackContext.resolve = webpackContextResolve;\nmodule.exports = webpackContext;\nwebpackContext.id = 387;","import React, { useCallback, useRef } from \"react\"\nimport { Box, CircularProgress } from \"@mui/material\"\nimport { observer } from \"mobx-react\"\nimport { useEffect, useState } from \"react\"\n\nimport AccessDenied from \"../AccessDenied\"\n\nimport { useUserStore } from \"api/services/User\"\nimport { useMatchedRoute } from \"hooks\"\nimport { useLocation } from \"react-router-dom\"\nimport { TRoute } from \"types/Global\"\nimport { isAte, resultOrError } from \"utils/Global\"\nimport { routes as useRoutes } from \"../routes\"\n\nimport { useTranslation } from \"react-i18next\"\nimport { StyledContent } from \"../../components/Background/styles\"\nimport TopBar from \"components/TopBar\"\n\n/** set webpack public path as otherwise the chunks of translations are not loaded correctly. \n/ It is not taking a relative path but always a static one. The reason why it is determined here dynamically\n */\n__webpack_public_path__ = window.location.pathname\nif (\n __webpack_public_path__.endsWith(\".html\") ||\n __webpack_public_path__.endsWith(\".htm\")\n) {\n __webpack_public_path__ = __webpack_public_path__.substring(\n 0,\n __webpack_public_path__.lastIndexOf(\"/\") + 1\n )\n} else if (window.location.hostname.includes(\"continental-aftermarket.com\")) {\n __webpack_public_path__ = __webpack_public_path__.substring(\n 0,\n __webpack_public_path__.lastIndexOf(\"/\") + 1\n )\n} else if (!__webpack_public_path__.endsWith(\"/\")) {\n __webpack_public_path__ += \"/\"\n}\n\nconst hideSplashScreen = () => {\n const splashscreen = document.getElementById(\"app-splashscreen\")\n\n if (splashscreen) {\n splashscreen.className = \"\"\n setTimeout(() => {\n splashscreen.remove()\n }, 30)\n }\n}\nexport const namespace = __filename\n\nconst RootRouter = () => {\n const userStore = useUserStore()\n const portalContainerRef = useRef(null)\n\n const location = useLocation()\n const routes = [...useRoutes] as readonly TRoute[]\n const [fallbackRoute] = routes\n const { MatchedElement } = useMatchedRoute(routes, fallbackRoute.Component, {\n matchOnSubPath: true,\n })\n\n const { t } = useTranslation(\"app\")\n const [pageTitle, setPageTitle] = useState(\"\")\n\n const checkTopBarTitle = useCallback(() => {\n let translatedTitle\n\n switch (pageTitle) {\n case \"Start screen\":\n case \"Echtheitsüberprüfung\":\n translatedTitle = \"titleStartScreenTopBar\"\n break\n case \"MAPPCode Screen\":\n case \"MAPPCode-Bildschirm\":\n translatedTitle = \"titleMAPPCheckTopBar\"\n break\n case \"Authenticity Check\":\n case \"Echtheitsprüfung\":\n translatedTitle = \"titleAuthenticityTopBar\"\n break\n case \"Scan EAN-Code\":\n case \"EAN Code scannen\":\n case \"TecDoc Catalogue\":\n case \"TecDoc Katalog\":\n translatedTitle = \"titleEANCheckTopBar\"\n break\n case \"Counterfeit Report\":\n case \"Fälschungsbericht\":\n translatedTitle = \"titleCounterfeitTopBar\"\n break\n default:\n translatedTitle = \"titleStartScreenTopBar\"\n }\n\n return t(translatedTitle)\n }, [t, pageTitle])\n\n useEffect(() => {\n setPageTitle(t(`routes.${location.pathname}`))\n checkTopBarTitle()\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [location, t])\n\n const loadingApp = false\n const accessDenied = false\n // todo: animate\n useEffect(() => {\n hideSplashScreen()\n }, [])\n\n useEffect(() => {\n ;(async () => {\n if (!userStore.user) {\n const [, error] = await resultOrError(userStore.getOwnUser())\n if (error) {\n console.log(\"getOwnUser error\", error)\n }\n }\n })()\n }, [userStore])\n\n React.useEffect(() => {\n const root = document.getElementById(\"portal-container\")\n if (isAte) {\n // Set the --color-primary and --color-secondary variables\n root.style.setProperty(\"--color-primary\", \"#005CA9\") // Change to the color you want\n root.style.setProperty(\"--color-secondary\", \"#005CA9\") // Change to the color you want\n\n //root.style.fontFamily = \"Etelka Light, serif !important;\"\n const fontFace = new FontFace(\n \"Etelka Light\",\n `url(assets/fonts/EtelkaLight.woff) format(\"woff\")`\n )\n fontFace\n .load()\n .then(() => {\n document.fonts.add(fontFace)\n if (portalContainerRef.current) {\n portalContainerRef.current.style.fontFamily = \"Etelka Light\"\n portalContainerRef.current.style.fontWeight = 100\n portalContainerRef.current.style.fontStyle = \"normal\"\n }\n })\n .catch((error) => {\n console.log(\"Error loading Etelka Light font\", error)\n })\n } else {\n const fontFace = new FontFace(\n \"ContinentalStagSans-Light\",\n `url(assets/fonts/ContinentalStagSans-Light.woff2) format(\"woff2\")`\n )\n fontFace\n .load()\n .then(() => {\n document.fonts.add(fontFace)\n if (portalContainerRef.current) {\n portalContainerRef.current.style.fontFamily =\n \"ContinentalStagSans-Light\"\n portalContainerRef.current.style.fontWeight = 100\n portalContainerRef.current.style.fontStyle = \"normal\"\n }\n })\n .catch((error) => {\n console.log(\"Error loading ContinentalStagSans-Light font\", error)\n })\n }\n }, [])\n\n if (accessDenied) {\n return \n }\n\n return (\n \n {loadingApp ? (\n \n \n \n ) : (\n <>\n {/* {!isMobile && (\n <> */}\n \n {/* >\n )} */}\n {MatchedElement}\n >\n )}\n
\n )\n}\n\nexport default observer(RootRouter)\n","import * as React from \"react\"\nimport { useTranslation } from \"react-i18next\"\nimport { observer } from \"mobx-react\"\nimport consola from \"consola\"\n\nimport DangerousIcon from \"@mui/icons-material/Dangerous\"\nimport { Button, Typography } from \"@mui/material\"\nimport Box from \"@mui/material/Box\"\nimport { styled, useTheme } from \"@mui/material/styles\"\n\nimport cloud from \"@osapiens/cloud-interop/lib\"\n\nimport { isCloudEnv } from \"utils/env\"\n\nconst Container = styled(\"div\")(({ theme }) => ({\n display: \"flex\",\n flex: 4,\n justifyContent: \"space-evenly\",\n flexDirection: \"column\",\n alignItems: \"center\",\n overflowY: \"scroll\",\n background: `url(${\"\"}) repeat content-box`,\n}))\nconst AccessDenied: React.FC = () => {\n const { t } = useTranslation(\"app\")\n const theme = useTheme()\n\n const color = theme.palette.error.main\n React.useEffect(() => {\n // on screen leave\n return () => {\n // clearCache()\n }\n // eslint-disable-next-line\n }, [])\n\n // TODO: aldd all i18n texts to locales and refactor file\n\n const handleLogout = () => {\n if (isCloudEnv()) {\n cloud.navigation.logout()\n } else {\n consola.error(\n \"Logout not possible: Osapiens cloud interop API (window.parent.primingcloud) not available.\"\n )\n }\n }\n\n return (\n \n \n \n \n {t(\"AccessDenied\")}\n \n {t(\"speakToYourAdmin\")}\n \n \n \n \n )\n}\n\nexport default observer(AccessDenied)\n","import React, { useEffect, useMemo, useRef, useState } from \"react\"\nimport { observer } from \"mobx-react\"\n// https://qa.osapiens.cloud/portal/portal/webbundle/OneIDTestCustomer/BrandOS/MobileResponsePage/static/\n// https://qa.osapiens.cloud/portal/portal/webbundle/BrandOSMaster/BrandOS/MobileResponsePage-generic/static/\n// https://qa.osapiens.cloud/portal/portal/webbundle/BorgWarner/BrandOS/MobileResponsePage/static/\nimport {\n Box,\n CircularProgress,\n Container,\n Typography,\n useTheme,\n} from \"@mui/material\"\n\nimport CheckResultFlags from \"./components/CheckResultFlags\"\nimport { useAuthenticityCheckStore } from \"api/services/AuthenticityCheck\"\nimport ResponsiveBackground from \"../../components/ResponsiveBackground\"\nimport useScopedTranslation from \"../../hooks/useScopedTranslation\"\nimport en from \"./locales/en.json\"\nimport { SearchParameters } from \"../../types/BusinessObjects\"\nimport { isUndefined } from \"../../utils/util\"\nimport { checkGTIN, convertToHRF, getGeoLocation, isNumeric } from \"./util\"\nimport * as applicationIdentifiers from \"./ai.json\"\nimport Chip from \"@mui/material/Chip\"\nimport { styled } from \"@mui/system\"\nimport ContiSpecificButton from \"components/ContiSpecificButton\"\nimport { isCloudEnv } from \"utils/env\"\nimport { default as Conti_vehicle_use } from \"../../assets/images/CONTI_Loyalty_Program_Werbetrailer_sec22.jpg\"\nimport { default as Ate_vehicle_use } from \"../../assets/images/ATE_Loyalty_Program_Werbetrailer_sec22.jpg\"\nimport { basePath, isAte } from \"utils/Global\"\nimport { globalEndpoint } from \"types/Global\"\n\n// use this namespace also for subcomponents and for smaller subpages\nexport const namespace = __filename\n\nconst BlurredBackground = styled(\"div\")({\n position: \"relative\",\n width: \"100%\",\n // height: \"100%\",\n height: \"200px\",\n overflow: \"hidden\",\n background: `url(${\n !isAte ? Conti_vehicle_use : basePath + Ate_vehicle_use\n }) center/cover`,\n \"&:before\": {\n content: \"''\",\n position: \"absolute\",\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n filter: \"blur(5px)\",\n backgroundColor: \"rgba(0, 0, 0, 0.6)\", // Adjust the alpha value (last parameter) for darkness\n // background: `inherit`,\n },\n})\n\nconst OverlayContent = styled(\"div\")({\n position: \"absolute\",\n top: \"50%\",\n left: \"50%\",\n transform: \"translate(-50%, -50%)\",\n textAlign: \"center\",\n})\n\nconst AuthenticityCheck = () => {\n const { t, i18n } = useScopedTranslation(\n namespace,\n (locale) => import(`./locales/${locale}.json`),\n en\n )\n const theme = useTheme()\n const path = window.location.pathname.split(\"#\")[0]\n const search: SearchParameters =\n window.location.search &&\n window.location.search\n .slice(1)\n .split(\"&\")\n .map((p) => p.split(\"=\"))\n .reduce((obj, [key, value]) => ({ ...obj, [key]: value }), {})\n\n const lang = navigator.language.slice(0, 2)\n // sessionStorage.setItem(\"productCode\", \"(01)14006633314036(21)94YZPG084C6S\")\n const [productCode, setProductCode]: any = useState()\n // \"(01)14006633314036(21)94YZPG084C6S\"\n // useState(sessionStorage.getItem(\"productCode\"))\n const [latitude, setLatitude] = useState(null)\n const [longitude, setLongitude] = useState(null)\n const [geoLocationStatus, setGeoLocationStatus] = useState(\"INIT\")\n const [endpoint, setEndpoint] = useState(globalEndpoint)\n const loading = useRef(false)\n\n const authenticityCheckStore = useAuthenticityCheckStore()\n const { loadingAuthenticityCheckList, authenticityCheckList } =\n authenticityCheckStore\n console.log(\"windowLocationSearch\", window.location.search)\n\n const links = {\n en: \"https://www.continental-aftermarket.com/en-en/contact-authenticity-check-and-vehicle-use\",\n de: \"https://www.continental-aftermarket.com/de-de/kontakt-originalitaetspruefung-und-fahrzeugverwendung\",\n fr: \"https://www.continental-aftermarket.com/fr-fr/contacter-le-controle-doriginalite-et-lutilisation-du-vehicule\",\n es: \"https://www.continental-aftermarket.com/es-es/contacto-control-de-originalidad-y-uso-del-vehiculo\",\n it: \"https://www.continental-aftermarket.com/it-it/contatto-controllo-originalita-e-utilizzo-veicolo\",\n }\n\n const getQuerySearchReferrer = (ref) => {\n let queryString = ref.split(\"?\")[1]\n if (queryString) {\n return queryString\n } else {\n return console.log(\"no query search params on referrer\")\n }\n }\n getQuerySearchReferrer(window.document.referrer)\n\n const searchReferrer =\n getQuerySearchReferrer(window.document.referrer) &&\n getQuerySearchReferrer(window.document.referrer)\n .split(\"&\")\n .map((p) => p.split(\"=\"))\n .reduce((obj, [key, value]) => ({ ...obj, [key]: value }), {})\n\n const extractCode = (uid) => {\n if (uid.includes(\"%5dd2\")) {\n let stringBuilder = \"\"\n const codeArray = convertToHRF(uid, applicationIdentifiers)\n codeArray.forEach((ai) => {\n stringBuilder = stringBuilder + `(${ai.name})${ai.value}`\n })\n uid = stringBuilder\n } else if (uid.includes(\"%28\") && uid.includes(\"%29\")) {\n uid = uid.replaceAll(\"%28\", \"(\").replaceAll(\"%29\", \")\")\n }\n if (checkGTIN(uid)) return uid\n else return null\n }\n\n useEffect(() => {\n setProductCode(sessionStorage.getItem(\"productCode\"))\n return () => {\n sessionStorage.removeItem(\"productCode\")\n }\n }, [])\n\n useEffect(() => {\n const code = sessionStorage.getItem(\"code\")\n const gtin = sessionStorage.getItem(\"gtin\")\n const productCode = sessionStorage.getItem(\"productCode\")\n if (searchReferrer && isCloudEnv()) {\n if (\n productCode == null &&\n searchReferrer &&\n searchReferrer[\"gtin\"] &&\n searchReferrer[\"code\"]\n ) {\n setProductCode(\n `(01)${searchReferrer[\"gtin\"]}(21)${searchReferrer[\"code\"]}`\n )\n sessionStorage.setItem(\n \"productCode\",\n `(01)${searchReferrer[\"gtin\"]}(21)${searchReferrer[\"code\"]}`\n )\n } else {\n setProductCode(productCode)\n }\n // @ts-ignore\n } else if (search !== \"\" || path !== \"/\" || (code && gtin) || productCode) {\n if (\n productCode == null &&\n !code &&\n search &&\n search[\"gtin\"] &&\n search[\"code\"]\n ) {\n setProductCode(`(01)${search[\"gtin\"]}(21)${search[\"code\"]}`)\n sessionStorage.setItem(\n \"productCode\",\n `(01)${search[\"gtin\"]}(21)${search[\"code\"]}`\n )\n }\n if (code && gtin) {\n setProductCode(`(01)${gtin}(21)${code}`)\n sessionStorage.setItem(\"productCode\", `(01)${gtin}(21)${code}`)\n\n sessionStorage.removeItem(\"code\")\n sessionStorage.removeItem(\"gtin\")\n }\n if (productCode) {\n setProductCode(productCode)\n }\n const codeArray = path.split(\"/\")\n let stringBuilderProduct = \"\"\n\n if (codeArray?.length > 0) {\n if (!isUndefined(search.uid)) {\n const searchParameterGTIN = extractCode(search.uid)\n\n // check for old URL format\n if (searchParameterGTIN) {\n //setProductCode(searchParameterGTIN)\n sessionStorage.setItem(\"productCode\", searchParameterGTIN)\n\n const geoLocation = search.geo?.split(\"%2C\")\n if (geoLocation) {\n setLatitude(\n isNumeric(geoLocation[0]) ? parseFloat(geoLocation[0]) : null\n )\n setLongitude(\n isNumeric(geoLocation[1]) ? parseFloat(geoLocation[1]) : null\n )\n setGeoLocationStatus(\"TRACKED\")\n }\n\n !isUndefined(search.edp)\n ? setEndpoint(search.edp)\n : setEndpoint(globalEndpoint)\n } else {\n //setProductCode(\"Incorrect code format\")\n }\n } else {\n // check for digital link format\n for (let i = 0; i < codeArray.length; i++) {\n if (codeArray[i] === \"\") continue\n\n stringBuilderProduct = stringBuilderProduct.concat(\n i % 2 === 0 ? codeArray[i] : `(${codeArray[i]})`\n )\n }\n\n for (const ai in search) {\n stringBuilderProduct = stringBuilderProduct.concat(\n `(${ai})${search[ai]}`\n )\n }\n\n if (stringBuilderProduct !== \"\") {\n //setProductCode(stringBuilderProduct)\n sessionStorage.setItem(\"productCode\", stringBuilderProduct)\n }\n\n if (!checkGTIN(stringBuilderProduct)) {\n setGeoLocationStatus(\"TRACKED\")\n }\n }\n }\n }\n return () => {\n sessionStorage.removeItem(\"productCode\")\n }\n }, [path, search])\n\n useEffect(() => {\n if (\n !(geoLocationStatus === \"TRACKED\") &&\n productCode !== null &&\n !search.geo\n ) {\n getGeoLocation()\n .then((geoLocation) => {\n const [latitude, longitude] = geoLocation\n setLatitude(latitude)\n setLongitude(longitude)\n setGeoLocationStatus(\"TRACKED\")\n })\n .catch((err) => {\n console.log(\"Location failed: \" + err)\n setGeoLocationStatus(\"DENIED\")\n })\n }\n }, [productCode, geoLocationStatus, search.geo])\n\n useEffect(() => {\n if (latitude !== null && longitude !== null) {\n setGeoLocationStatus(\"TRACKED\")\n }\n }, [latitude, longitude, geoLocationStatus])\n\n useEffect(() => {\n if (\n !loading.current &&\n (geoLocationStatus === \"TRACKED\" || geoLocationStatus === \"DENIED\")\n ) {\n loading.current = true\n authenticityCheckStore\n .fetchAuthenticityCheckList(\n productCode,\n lang,\n latitude,\n longitude,\n endpoint\n )\n .then(() => {\n window.history.replaceState(null, \"\", \"/#/authenticity\")\n })\n .catch((e) => {\n loading.current = false\n console.log(e)\n })\n } else {\n console.log(\"Authenticity Check List\", authenticityCheckList)\n }\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [productCode, lang, latitude, longitude, geoLocationStatus])\n\n const authenticityResult = React.useMemo(() => {\n return authenticityCheckList\n }, [authenticityCheckList])\n const vasButtons = useMemo(() => {\n let buttons = []\n\n sessionStorage.setItem(\"organisation\", authenticityCheckList?.organization)\n\n if (authenticityCheckList.vas?.length > 0) {\n const sortedVasList = authenticityCheckList.vas.slice().sort((a, b) => {\n // if position is undefined the VAS should be at the end of the list\n const checkIfSet = (value) =>\n typeof value !== \"undefined\" ? value : 9999\n return (\n checkIfSet(a.screens[0].content.position) -\n checkIfSet(b.screens[0].content.position)\n )\n })\n Object.values(sortedVasList).forEach((item: any) => {\n if (buttons.length < 1) {\n buttons.push(\n \n )\n }\n })\n } else {\n if (buttons.length < 1) {\n buttons.push(\n \n )\n }\n }\n return buttons\n }, [authenticityCheckList])\n\n const isMobile = window.innerWidth < theme.tokens.breakpoints.breakpointTablet\n\n return (\n \n \n {loadingAuthenticityCheckList ||\n (geoLocationStatus === \"INIT\" && productCode) ? (\n \n \n \n ) : (\n <>\n \n \n \n \n \n theme.tokens.breakpoints.breakpointTablet\n ? 700\n : 600\n }\n color={theme.tokens.color.conti_typo}\n marginBottom=\"10px\"\n marginTop=\"10px\"\n sx={{\n fontSize:\n window.innerWidth <\n theme.tokens.breakpoints.breakpointTablet\n ? \"17px\"\n : isAte\n ? \"2.3rem\"\n : \"26px\",\n lineHeight: \"35px\",\n fontFamily: isAte\n ? \"Etelka Light\"\n : \"ContinentalStagSans-Light\",\n textShadow:\n \"2px 2px 20px rgba(0, 0, 0, 2), -2px -2px 20px rgba(0, 0, 0, 2)\",\n }}\n >\n {t(\"screenText2\")}\n \n {vasButtons}\n \n \n \n \n {t(\"resultText\")}\n \n \n \n \n \n \n \n {authenticityResult?.responseText}\n \n \n \n \n \n \n \n \n {t(\"mappCodeTitle\")}\n \n\n \n \n {authenticityResult?.code.replace(/\\(21\\)/g, \"\\n(21)\")}\n \n }\n />\n \n \n {authenticityResult?.codeFlag === \"RED\" && (\n \n \n {t(\"entryCorrect\")}\n \n \n {t(\"contactText\")}\n \n \n )}\n \n \n \n >\n )}\n \n \n )\n}\n\nexport default observer(AuthenticityCheck)\n","import { FlagTypes } from \"./types\"\nimport Image from \"components/Image\"\n\nconst CheckResultFlags: React.FC = ({ flag }) => {\n const imageStrings = {\n // GREEN:\"data:image/svg;base64,iVBORw0KGgoAAAANSUhEUgAAADQAAAAzCAYAAADYfStTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAR8SURBVHgB1ZpPTBxVHMe/b3aRiTSmB40HD06Vmqi1xcREa2IKiSZLe3DRg6Ax4El7KaCHnlRID7YXoVCjnkSjEY3ajQdLokmpF6MxdmuIXkg6PXgwJpb+o0u7zOvv93Znmc4O7Pzb2dnPBXbnze58+P3mN++9HwIxkf8kv710Ve8RQj4PqRlSyp7qIcM5TkCsQFgmoJnSkuegYVHfVioWXiusIAYEIqAkruh5+pRhIUWPhNyOsAgsQuLThUPzc4hAKKFqNEZJYiyShDcmXdUcsiR3cN5EQAIL7Z99eZTSaaIJIm5MSs/jpw59OR3kJN9CuQ8HDVGWJyWlFpLFRAf6/EZL8zMod2JoWNwUZ1sgwxj83f0zQ2N+BmcaDcjNDr5LNyuHXUfr4O/Ode/fheVTS2e2GrilUFVmAumht5HUpkIplLHZUspTqFrJjiK99HYfeMxc/mHpnPtAXZVT1YwLQPPLciR4xiE75OPu6ldf5W7idNplGL5Gfoy4379NiFMNrrlXmuHHiLuc11KOU42jgzYSYjj1Otev7yiMVya3GxEqYxhtJsNw6pU0vRYlzXFkBG2KEGI0P5VX970Sys0MjiBF0dn7wBOBxqsoZWgZAztCQqVbKnjz2TfwzoG38MqTLwY6z3YQ+akRsitdRApgmece3ld7ffi7I/jzn798nWsXB62ULbViBl2HW+aLX7/1LcOotMvqPRos9KLFeMl8/ts3CIqwZF4TmtyDFhKXDCMhjCzVBYN/TZquzi68/syrsckoBPZkycVAwrDMsRfexoN33197L7JMFS3MRPTeu+7BiaGjdEEGgtJMGcLwtafghGWODVQuqHJhhu9zmyyjCCzkpKvzTt9SScgwLGQGOeHfy//h8Mkj6ifgTyopGX64hopQEKmkZBQCpkab60WEwI8U328fDL6XjAxBm/8XMjtzu/eS2VMIwbW1Vfxy/nc1O95Gkbgj24F9Dz2N/1cv4dqNVVU8WMrm458/w9d/fI8m8pWg7apeehadRgTsyue8eJblqNm8/9NH+PHvM2gqAn2aXtaLqmcTAXf6MYnLEHq5VNQK43MrMuR95MRLiklKhvtLvK9QqXLUaEIMuKUSk2GqDmrXhxd5a5m183Htx/G9tPu+R5KToWcpdf528C8qQirtpDyOmOAIJShzW4bVHqy6pU9HLQ4twqRF6pz9oibEUQKsSbQZ3LZcGN/Y367brO+fHTrraMmnndq9Y1M3l5NlOdAOqaeucR197vfrhDh8VO3GkX4mnalm49nwou5YsTu3i/4Ird8R8kSSzOi8Z0Nu05bk8sLSYiqlKjITmx3esmmcOqkGMkzDtj5L7ex/9JKAxkuMlrT2q0XqIMlMNx7rk9wUNcQyyTfEeAEqy2LAqwB4jkdA+mdeGqMdyqa3LqtRmWza//o4UdHSqEEm4u/6qe42zSt1qzRttxmDnR8R1SxjMRm+cCgJXpPRJFNfLxXCiGx8VkxwS5DbGdzNEJrgBoDB28weSxJTfbEQRVjWBamJAq80o0g4uQX0wxjOz3n7hgAAAABJRU5ErkJggg==\",\n GREEN:\n \"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTIiIGhlaWdodD0iNTEiIHZpZXdCb3g9IjAgMCA1MiA1MSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3Qgd2lkdGg9IjUyIiBoZWlnaHQ9IjUxIiByeD0iMjUuNSIgZmlsbD0iIzQ4OTI1OCIvPgo8cGF0aCBkPSJNMTMuNSAyNUwyMi4xNzM1IDMzLjVMMzguNSAxNy41IiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjMiLz4KPC9zdmc+Cg==\",\n YELLOW:'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTIiIGhlaWdodD0iNTEiIHZpZXdCb3g9IjAgMCA1MiA1MSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3Qgd2lkdGg9IjUyIiBoZWlnaHQ9IjUxIiByeD0iMjUuNSIgZmlsbD0iI0Y3OTQwMCIvPgo8cGF0aCBkPSJNMjcuNTY4MiAxMy43MjczTDI3LjI3MjcgMzAuMzA2OEgyNC4xMjVMMjMuODI5NSAxMy43MjczSDI3LjU2ODJaTTI1LjcwNDUgMzcuMjE1OUMyNS4wNzU4IDM3LjIxNTkgMjQuNTM3OSAzNi45OTYyIDI0LjA5MDkgMzYuNTU2OEMyMy42NDM5IDM2LjEwOTggMjMuNDI0MiAzNS41NzIgMjMuNDMxOCAzNC45NDMyQzIzLjQyNDIgMzQuMzIyIDIzLjY0MzkgMzMuNzkxNyAyNC4wOTA5IDMzLjM1MjNDMjQuNTM3OSAzMi45MDUzIDI1LjA3NTggMzIuNjgxOCAyNS43MDQ1IDMyLjY4MThDMjYuMzE4MiAzMi42ODE4IDI2Ljg0ODUgMzIuOTA1MyAyNy4yOTU1IDMzLjM1MjNDMjcuNzQyNCAzMy43OTE3IDI3Ljk2OTcgMzQuMzIyIDI3Ljk3NzMgMzQuOTQzMkMyNy45Njk3IDM1LjM1OTggMjcuODU5OCAzNS43NDI0IDI3LjY0NzcgMzYuMDkwOUMyNy40NDMyIDM2LjQzMTggMjcuMTcwNSAzNi43MDQ1IDI2LjgyOTUgMzYuOTA5MUMyNi40ODg2IDM3LjExMzYgMjYuMTEzNiAzNy4yMTU5IDI1LjcwNDUgMzcuMjE1OVoiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo=',\n // \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACtWK6eAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAARMSURBVHhe7d0/r1RVFMbhhZEoiRRIhw2ddLaGxAKigV4/BR+IT4E9RAOFCbG1w84GKv4kXpKrmatwibshwbeZWftmzzxPQji7Og2/zDnJWodzb04V8EEfjb+BDxAIBAKBQCAQCAQCgUAgEAgEAoFAIBAIBAKBQCAQCAQCgUAgEAgEAoFAINjdRuHjO1VHT8YBztDFa1XX747DdnYXyIObVa8ejQOcoUs3qm49HIfteMSCQCAQCAQCgUAgEAgEAoFAIBAIBAKBQCAQCAQCgUAgEAgEAoFAIBAIBAKBQCAQCAQCgUAgEAgEAoFAIBAIBAKBQCAQCAQC3+btcvl21YUr49Ds+FnVi/vjwC6/zSuQLl/fq7r6/Tg0++PHql9/GAd8vHoFmz/HxQQz73VgBNJl83pcTDDzXgdGIF02R+Nigpn3OjAC6SKQvSCQLgLZCwLp4iV9Lwiki0D2gkC6CGQvCKTL5uW4mGDmvQ6MQLpsno+LCWbe68AIpMvJ03Exwcx7HRiBdPn39M8/x/9dd3p3j3f3ooVAOs0YATFm0kognQSyPIF0Opnwj3fGPQ6YQDr5BVmeQDrNmJEyh9VKIJ0EsjyBdJoxAmLMpJVAOnkHWZ5AOnnEWp5AOglkeQLpJJDlCaSTl/TlCaSTQJYnkE4CWZ5AOs3Y9LNN2EognWZs+tkmbCWQTjM2/WwTthJIp+6tQtuE7QTSrXMUxJhJO4F0E8jSBNKtc+PPNmE7gXTzC7I0gXTrnJUyh9VOIN0EsjSBdOscBTFm0k4g3byDLE0g3TxiLU0g3QSyNIF0E8jSBNLNS/rSBNJNIEsTSDeBLE0g3To3/mwTthNIt86NP9uE7QTSrXPjzzZhO4F069oqtE04hUBm6BgJMWYyhUBmEMiyBDJDx+afbcIpBDKDX5BlCWSGjpkpc1hTCGQGgSxLIDN0jIQYM5lCIDN4B1mWQGbwiLUsgcwgkGUJZAaBLEsgM3hJX9a5N6fG9XYe3Kx69WgceM/Hn1Z98uU47Mjfv1ed/DUOvOfSjapbD8dhOwJh/+wwEI9YEAgEAoFAIBAIBAKBQCAQCAQCgUAgEAgEAoFAYBary+XbVReujEOz42dVL+6PA4YVV/DNT1VffDsOzZ7+XPXLd+OAYUWYRCAQCAQCgUAgEAgEAoFAIBAIBAKBQCAQCAQCgUAgEAgEAoFAIBAIBAKBQCAQCAQCO+ldPvuq6vzn49Bs87Lq9W/jgI82QOKjDTCHQCAQCAQCgUAgEAgEAoFAIBAIBAKBQCAQCAQCgUAgEAgEAoFAIBAIBAKBQCAQCAQCgUAgEAgEAoFAIBAIBAKBQCAQCAQCgUAgEAgEAoFAIBAIBAKBQCAQCAQCgWB3/4nn4ztVR0/GAc7QxWtV1++Ow3Z2FwjsIY9YEAgEAoFAIBAIBAKBQCAQCAQCgUAgEAgEAoFAIBAIBAKBQCAQCAQCgUAg8L+q3gKwsGZ724BDPwAAAABJRU5ErkJggg==\",\n RED: 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTIiIGhlaWdodD0iNTEiIHZpZXdCb3g9IjAgMCA1MiA1MSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CjxyZWN0IHdpZHRoPSI1MiIgaGVpZ2h0PSI1MSIgcng9IjI1LjUiIGZpbGw9IiNDRjZBNkEiLz4KPHJlY3QgeD0iMTMuNSIgeT0iMTMuNSIgd2lkdGg9IjI1IiBoZWlnaHQ9IjI0IiBmaWxsPSJ1cmwoI3BhdHRlcm4wKSIvPgo8ZGVmcz4KPHBhdHRlcm4gaWQ9InBhdHRlcm4wIiBwYXR0ZXJuQ29udGVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgd2lkdGg9IjEiIGhlaWdodD0iMSI+Cjx1c2UgeGxpbms6aHJlZj0iI2ltYWdlMF8xNThfNDUxMiIgdHJhbnNmb3JtPSJtYXRyaXgoMC4wMSAwIDAgMC4wMTA0MTY3IDAuMDIgMCkiLz4KPC9wYXR0ZXJuPgo8aW1hZ2UgaWQ9ImltYWdlMF8xNThfNDUxMiIgd2lkdGg9Ijk2IiBoZWlnaHQ9Ijk2IiB4bGluazpocmVmPSJkYXRhOmltYWdlL3BuZztiYXNlNjQsaVZCT1J3MEtHZ29BQUFBTlNVaEVVZ0FBQUdBQUFBQmdDQVlBQUFEaW1IYzRBQUFBQ1hCSVdYTUFBQXNUQUFBTEV3RUFtcHdZQUFBQ1VFbEVRVlI0bk8yY1FVN2NRQkJGTzlzZ2RnRUd1RWcyT2V2Y2hCV0lSVllRSU1TblFNb0JYb1N3RlRFQzNEWWVWMWZWZitzWnFmczl0NjJadGwyS0VFSUlJWVFRUWdnaGhCQ1ZBQWZBRmpqTElnMDQ2K2Q4WUQyUXI4QUZMM1RBZVFrT3NBRWUramxmQW9jdHlDZERCRjdMeHl6Q08vSkRSK0J0K2V0SEdKRWZNZ0lmeTE4M1FuL3hxU0ZFQk9DOG4wc04yelVHZEFMY1o0aEEzWkcvL2x3elJLQlYrUmtpMExyOHlCSHdJajlpQkx6Smp4UUJyL0lqUk1DN2ZNOFJpQ0xmWXdTaXlmY1VnYWp5UFVRZ3V2eVdJNUJGZm9zUnlDYS9wUWhrbGI4VHdVUUEyZVZiaWtEeTdZUWcrWFppa0h3N1FVaStuU2drZnhvc0tFenlaOElDRVNUL2svQ0pDSksvRU15SUlQbTJOMEoxRXo4Yjh4ZnUwakJ0SlVoKzR4RTZIZmwyRVRySnQxc0puZVRiUmVna2YwRlFBRHZRS2NqTkx0cGI2RlMwMGo3eVJ5aUNvZndCUlpqNEVQUWpkZWl2Q092YlY5QUdqSjM4OHYrN3V1M0VTdjZBSWpSdzF4eGFDWHVWLzBlYjhzdkx2NXNndi9wMU9Gb0o0NEtPOXlWL1FCRU01UThvZ3FIOEFVV1lKLzl4eVZlZ3BZOWdLYjlrajlETC8yVXBQMjJFbHVTbmk5Q2kvRFFSWnNnL05SampwcFduTjlQSmIrbnB6VVVCanJ6SUR4ZWhsMzliT1pIZkxjZ1BFOEd6ZlBjUklzaDNHeUdTZkhjUklzcDNFMkdHL0UxeEJxMUd5Q0MvMlFqQUYrQzZja0RQdndlT1NxNW4xbjQrTzlyM2dINEFmMGNHOHVENXlKKzVFcDZBNzJVTlJpS0VrbDhaWVQzNUl4RkN5aCtKc0w3OGR5TGNBTjlLY0hnZHdVNytUb1NyRFBKM0lseWJ5eC9ZKzVXL1FUTE9XUWdoaEJCQ0NDR0VFTVU3L3dCbGorQ3ZzTkozSEFBQUFBQkpSVTVFcmtKZ2dnPT0iLz4KPC9kZWZzPgo8L3N2Zz4K'\n // \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACtWK6eAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAhWSURBVHhe7d1rcFRnGcDxZy/Z7GazATb3LElKRSmE2DKVIUy1CFiZXtBeuH5AKxpLDVRLi0VBsdoKxUGgtoNhjM5Q29qWzpTGGWnGKW2tdZjRD5oJo7a2jtOLIxRtkUu4xd3t0xlm3TzZW88me/6/L3mfl3za8M+ek3N21zMUJwDS8upXAGkQCGAgEMBAIICBQAADgQAGAgEMBAIYCAQwEAhgIBDAQCCAgUAAA4EABgIBDAQCGAgEMBTsFYXv3r5ETr8yoBNQPIHJbVK1/XGd8lOwQI4sbJPj/Yd0Aoon3D5NanoL88uaQyzAQCCAgUAAA4EABgIBDAQCGAgEMBAIYCAQwEAggIFAAAOBAAYCAQwEAhgIBDAQCGAgEMBAIICBQAADgQAGAgEMBAIYCAQwEAhgIBDAQCCAgUAAA4EABgIBDAQyWnj0K0YVAimi0IcnSWxbj7QcfF1a/3ZOWl8elJZfD0j9urvFP86v34ViIpAiqV21Vur2vyz+m1aKpz4W/0nEfxRlAfFMnibBrm9L7Pm3JNIxW78bxUIgRVDX9XWpWL9NxOfTnTTG10j0oeek8mOX6waKgUAcVnFpu4Tu2KzTCOLPKNUPPCXekM5wHIE4bMJt97x3OJWphokSXbpKBziNQBzkDYj4P/5pnTIXuupGXcFpBOKgQEurSHlQp8x5Jn1EV3AagTjIFwrrKjueyHhdwWkEAhgIBDAQiAM8Pkle9Bu3rEt3shQMSU3nVyU05UO6Aad4huJ0nZcjC9vkeP8hnZC4tyoyq0OqFneKf8Eikcoq/Yf8DL3xdxnc95C880S3nHrtDd3FhcLt06Smd0Cn/PAMUmCJZ4vojUukZf+fJPqL3yVvJSlUHAme2EUS/Mq3pP7A6xLr2ceV9g8YgRRQ5MorpfmZAYn88DHxTGnX3Q+Of/5npHrv75OhlLc26i4KiUAKIHHnbezBRyW65/nkzYZOS4TS0Pdq8h4vfqKFxcOZp8isWRLb/6r4r12mO0VSHpTQuvuk+ZFnpax+nG4iXwSSh+jSFRJ9+Dcijc26U3zejrnS+PSAhKdP1R3kg0ByVLf6Lonctyd+fFOmO6NH4vUlNY8dTJ4TIT8EkoP6NesldOcWnUapcESiu/cTSZ4IJEu1X+ySYKav5yi2YEiiu36ZfA0KckMgWaiaO18qNtyv0xgRfyap2f2r+Il7RDeQDQLJUPlFTTLh/ifjj9jYe8gS5yQN3X3Ji5jIDoFkIPEfq377XpHI2P3zqfeyDqm783s6IVMEkoHaNRvEM2Psv8NI8JZvcmtKlghkBIlbOEK3btRpjIsfHkbv6eFQKwsEMoLaTd05vUx2tPJccqlUf+5WnTASAjEkDkd88xbqVDrCXZt4K6EMEYhh3Jrv6qrE1NRL9Yqv6QALgQwj8b65/jnX6FR6Kr6wlp9+BniIhjF++WpdlajGZqmaM18HDIdA0kj8lSdw/QqdSldkUaeuMBwCSaNyZodItFan0uWfc7V4+JQFE4GkUTHvs7oqcZVVEpn9CR2QDoGkEeiYp6vSF5p9la6QDoGkSJx/eKd8VKfSVzZ9pq6QDoGkCE29pKSunI/EN517sywEkiLQ4rJ3Uo/WirdC1/g/BJKirKlVV+5RPvFiXSEVgaTw1brvDdjK6pp0hVQEksKT42d4jGXecOHeGrXUEEgKb7hSV+7hKSvXFVIRSCqf+y4tewv45tqlhkAAA4EABgIBDAQCGAgEMBAIYCAQwEAggIFAAAOBAAYCAQwEAhgIBDAQCGAgEMBAIICBQAADgQAGAgEMBAIYCAQwEAhgIBDAQCCAgUAAA4FcIPExAL6pM3Ryj8CM2bpCKgJRiThiPzsgnintuuMegaW3SMOGLTrhQgQS5w28F4d31id1x33KO++Sutu+oRPe5/pAPGUiTd29ro7jfaG135f6Net1QoKrA0nEEdvdK7651+kOgndsltovrdYJrg0k8Wm2TTseJY40Kjb+SGpuXqWTu7kykGQcOx8R/7XLdAepwt/ZJdXLb9bJvdwXiCcex9Ye8V+3XDcwnMp7e2TCInc/Tu4KJB5H45Yfi/+mlboBk9crVVt/LhNuWKwb7uOqQBrv3pn8mz+ykIjkBw/L+AXX6Ia7uCqQwA2f1xWy4i+T8BJ3/mJx5Uk6kCkCAQwEAhg8Q3G6zsuRhW1yvP+QTqNTS1+/CJ8JnpOzv+2TN9d16jS6hdunSU3vgE75cVUgcIdCBsIhFmAgEMBAIICBcxCHxHbuEU9Tq065GXzmCTn8kwd0wnA4SR+Dmp98UbyXX6FTbk7u2Cj/2nGvThgOJ+lj0Lk//1FXuTv9135dwSkE4pDjB/bpKkeDp+TYc0/rAKcQiEPeebZPhl77i07ZO7P3p3LuhA5wDIE45bzIvzd9WSSXU74j/5TD29bqACcRiIOOvfCCnNi6TqcMnTopR7uulzNHB3UDTiIQhx3etU1ObI4/G5yPP6WMYOg/b8vRlZ+SYwcP6g6cRiBFcLh7u7y9eKac/8OLupPi7Bk5+9QeeWvBJDn20ku6iWLgOkiRBS+eKBWXXSH+hmYZGjwpZ9/8h/z3YB+HVHngQiFg4EIh4BACAQwEAhgIBDAQCGAgEMBAIICBQAADgQAGAgEMBAIYCAQwEAhgIBDAQCCAgUAAA4EABgIBDAQCGAgEMBAIYCAQwEAggIFAAAOBAAYCAQwEAhgIBDAQCGAgEMBAIICBQAADgQAGAgEMBfsItndvXyKnXynMx14B+QhMbpOq7Y/rlJ+CBQKUIg6xAAOBAAYCAQwEAhgIBDAQCGAgEMBAIICBQAADgQAGAgEMBAIYCAQwEAhgIBDAQCCAgUCAYYn8DwllbjSJVozNAAAAAElFTkSuQmCC\",\n }\n\n return \n}\n\nexport default CheckResultFlags\n","import Tabs from \"../components/Tabs\"\nimport Info from \"./subpages/Info\"\nimport {\n mdiCar,\n mdiEarth,\n mdiFileImage,\n mdiFormatListBulletedSquare,\n mdiInformation,\n mdiOfficeBuilding,\n} from \"@mdi/js\"\nimport {\n Box,\n CircularProgress,\n Container,\n Typography,\n useTheme,\n} from \"@mui/material\"\nimport Vehicles from \"./subpages/Vehicles\"\nimport Manufacturer from \"./subpages/Manufacturer\"\nimport Documents from \"./subpages/Documents\"\nimport OE from \"./subpages/OE\"\nimport React, { useEffect, useState } from \"react\"\nimport CountrySelection from \"../components/CountrySelection\"\nimport ResponsiveBackground from \"../../../components/ResponsiveBackground\"\nimport { useTecDocStore } from \"../../../api/services/TecDoc\"\nimport i18next from \"i18next\"\nimport useScopedTranslation from \"../../../hooks/useScopedTranslation\"\nimport en from \"./locales/en.json\"\nimport tokens from \"themes/default/tokens\"\nimport Dialog from \"components/Dialog\"\nimport { useHistory } from \"react-router\"\nimport { uniq } from \"lodash\"\nimport { isAte } from \"utils/Global\"\nimport { scrolltToTop } from \"utils/util\"\n\nexport const namespace = __filename\n\nconst TecDoc = () => {\n const theme = useTheme()\n const history = useHistory()\n const lang = i18next.language\n const countryCatalogue = localStorage.getItem(\"countryCatalogueCode\") || \"de\"\n const [isHomeSelected, setIsHomeSelected] = useState(false)\n const { t } = useScopedTranslation(\n namespace,\n (locale) => import(`./locales/${locale}.json`),\n en\n )\n\n const tecDocStore = useTecDocStore()\n const { articleList, articleAttributes } = tecDocStore\n\n const [loading, setLoading] = useState(false)\n const [isDialogOpen, setIsDialogOpen] = useState(false)\n\n useEffect(() => {\n scrolltToTop()\n }, [])\n\n const handleLoading = (value: boolean) => {\n setLoading(value)\n }\n useEffect(() => {\n if (isHomeSelected) setIsHomeSelected(false)\n }, [isHomeSelected])\n\n function backToHome() {\n setIsHomeSelected(true)\n }\n\n useEffect(() => {\n if (!articleList) {\n tecDocStore\n // .fetchArticle(countryCatalogue, lang, 6, \"4006633056854\") // 4019064364931 / 4006633056854\n .fetchArticle(countryCatalogue, lang, 6, localStorage.getItem(\"data\"))\n // 4019064364931\n .catch((err) => {\n console.log(\"Error fetching articles\", err)\n setIsDialogOpen(true)\n })\n }\n return () => {\n localStorage.removeItem(\"data\")\n }\n }, [tecDocStore, countryCatalogue, lang, articleList])\n\n useEffect(() => {\n if (articleList && !articleAttributes) {\n tecDocStore\n .fetchArticleDetails(countryCatalogue, lang, articleList?.articleId)\n .catch((err) => {\n console.log(\"Error fetching articles\", err)\n setIsDialogOpen(true)\n })\n }\n }, [tecDocStore, articleList, countryCatalogue, lang, articleAttributes])\n\n const generalArticleNumber = React.useMemo(() => {\n const requiredKeys = [\"articleNo\"]\n let tempArticleList = []\n let tempDirectArticleList = []\n\n if (articleList) {\n tempArticleList = Object.entries(articleList).map((item) => {\n return {\n key: item[0],\n subItems: [\n {\n label: requiredKeys.includes(item[0]) ? t(item[0]) : item[0],\n content: String(item[1]),\n },\n ],\n }\n })\n }\n\n const tempGeneralArticleList = tempArticleList\n .concat(tempDirectArticleList)\n .filter((item) => requiredKeys.includes(item.key))\n\n return uniq(tempGeneralArticleList)\n .map((item) => item.subItems)\n .map((item) => item[0].content)\n }, [articleList, t])\n\n return (\n \n \n )\n}\n\nexport default TecDoc\n","import * as React from \"react\"\nimport { observer } from \"mobx-react\"\n\nimport { Box, useTheme } from \"@mui/material\"\n\nimport useScopedTranslation from \"hooks/useScopedTranslation\"\nimport en from \"./locales/en.json\"\nimport List, { ListTextItemTypes } from \"../../../components/List\"\nimport { useTecDocStore } from \"../../../../../api/services/TecDoc\"\nimport { useMemo } from \"react\"\nimport { uniq } from \"../../../util\"\nimport { createItemBorder } from \"../../../util\"\nimport ListHeading from \"../../../components/List/components/ListHeading\"\nexport const namespace = __filename\n\nconst Info: React.FC = () => {\n const theme = useTheme()\n const { t } = useScopedTranslation(\n namespace,\n (locale) => {\n return import(`./locales/${locale}.json`)\n },\n en\n )\n const tecDocStore = useTecDocStore()\n const {\n articleList,\n articleAttributes,\n directArticle,\n eanNumber,\n replacedNumber,\n } = tecDocStore\n\n const generalArticleItems = useMemo(() => {\n const requiredKeys = [\n \"articleName\",\n \"articleNo\",\n \"articleStateName\",\n \"eanNumber\",\n \"replacedNumber\",\n ]\n let tempArticleList: ListTextItemTypes[] = []\n let tempDirectArticleList: ListTextItemTypes[] = []\n let tempEanNumber: ListTextItemTypes[] = []\n let tempReplacedNumberList: ListTextItemTypes[] = []\n\n if (articleList) {\n tempArticleList = Object.entries(articleList).map((item) => {\n return {\n key: item[0],\n subItems: [\n {\n label: requiredKeys.includes(item[0]) ? t(item[0]) : item[0],\n content: String(item[1]),\n docType: item[1]?.docFileTypeName\n },\n ],\n }\n })\n }\n if (directArticle) {\n tempDirectArticleList = Object.entries(directArticle).map((item) => {\n return {\n key: item[0],\n subItems: [\n {\n label: requiredKeys.includes(item[0]) ? t(item[0]) : item[0],\n content: String(item[1]),\n docType: item[1]?.docFileTypeName\n },\n ],\n }\n })\n }\n if (eanNumber) {\n tempEanNumber = Object.entries(eanNumber).map((item) => {\n return {\n key: Object.keys(item[1])[0],\n subItems: [\n {\n label: t(Object.keys(item[1])[0]),\n content: String(item[1]?.eanNumber),\n docType: item[1]?.docFileTypeName\n },\n ],\n }\n })\n }\n\n if (replacedNumber) {\n tempReplacedNumberList = Object.entries(replacedNumber).map((item) => {\n return {\n key: Object.keys(item[1])[0],\n subItems: [\n {\n label: Object.keys(item[1])[0],\n content: String(item[1]?.replacedNumber),\n docType: item[1]?.docFileTypeName\n },\n ],\n }\n })\n }\n\n const tempGeneralArticleList = tempArticleList\n .concat(tempDirectArticleList, tempEanNumber, tempReplacedNumberList)\n .filter((item) => requiredKeys.includes(item.key))\n\n return uniq(tempGeneralArticleList)\n }, [articleList, directArticle, eanNumber, replacedNumber, t])\n\n const criteriaItems = useMemo(() => {\n let tempArticleAttributes: ListTextItemTypes[] = []\n if (articleAttributes) {\n tempArticleAttributes = Object.entries(articleAttributes).map((item) => {\n return {\n key: item[1]?.attrName,\n subItems: [\n {\n label: item[1]?.attrName,\n content: item[1]?.attrValue,\n docType: item[1]?.docFileTypeName,\n },\n ],\n }\n })\n }\n return tempArticleAttributes //.filter((item) => [\"articleName\", \"articleSearchNo\", \"articleNo\",].includes(item.label))\n }, [articleAttributes])\n\n return (\n \n \n \n \n
\n
\n \n )\n}\n\nexport default observer(Info)\n","import * as React from \"react\"\nimport { observer } from \"mobx-react\"\n\nimport { Box, useTheme } from \"@mui/material\"\n\nimport useScopedTranslation from \"hooks/useScopedTranslation\"\nimport en from \"./locales/en.json\"\nimport List, { ListTextItemTypes } from \"../../../components/List\"\nimport { useTecDocStore } from \"../../../../../api/services/TecDoc\"\nimport { useEffect, useMemo } from \"react\"\nimport { getDate, getDateSingle } from \"../../../util\"\nimport { createItemBorder, groupListByValue } from \"../../../util\"\nimport i18next from \"i18next\"\nimport ListHeading from \"../../../components/List/components/ListHeading\"\nexport const namespace = __filename\n\nconst Vehicles: React.FC<{ handleLoading: (value: boolean) => void }> = (\n props\n) => {\n const theme = useTheme()\n const lang = i18next.language\n const countryCatalogue = localStorage.getItem(\"countryCatalogueCode\") || \"de\"\n\n const { t } = useScopedTranslation(\n namespace,\n (locale) => import(`./locales/${locale}.json`),\n en\n )\n const tecDocStore = useTecDocStore()\n const {\n vehicleList,\n vehicleListImmediateAttributs,\n articleList,\n loadingVehicleList,\n loadingVehicleImmediateAttributs,\n } = tecDocStore\n\n useEffect(() => {\n props.handleLoading(loadingVehicleImmediateAttributs || loadingVehicleList)\n }, [loadingVehicleList, loadingVehicleImmediateAttributs, props])\n\n const vehicleLinkages = useMemo(() => {\n let tempArticleAttributes: ListTextItemTypes[] = []\n\n if (vehicleListImmediateAttributs) {\n tempArticleAttributes = Object.entries(vehicleListImmediateAttributs).map(\n (item) => {\n const linkedVehicles = item[1]?.linkedVehicles.array[0]\n const linkedArticleImmediateAttributs =\n item[1]?.linkedArticleImmediateAttributs.array\n\n const vehicleLabel = [\n {\n label: String(\n `${linkedVehicles?.modelDesc} ${linkedVehicles?.carDesc}`\n ),\n hasBoldLabel: true,\n autoWidth: true,\n },\n ]\n\n const immadiateAttributsLabel = linkedArticleImmediateAttributs\n ? Object.values(linkedArticleImmediateAttributs).map((item) => {\n return {\n label: String(`${item?.attrName}: `),\n content: String(\n item?.attrId === 20 || item?.attrId === 21\n ? getDateSingle(item?.attrValue)\n : item?.attrValue\n ),\n hasBoldLabel: false,\n }\n })\n : []\n\n const vehicleDetails = [\n {\n label: `${t(\"type\")}:`,\n content: String(linkedVehicles?.constructionType),\n },\n {\n label: `${t(\"yearOfConstruction\")}:`,\n content: String(\n getDate(\n linkedVehicles?.yearOfConstructionFrom,\n linkedVehicles?.yearOfConstructionTo\n )\n ),\n },\n {\n label: `${t(\"power\")}:`,\n content: `${linkedVehicles?.powerHpTo} ${t(\"units.hp\")}/${\n linkedVehicles?.powerKwTo\n } ${t(\"units.kw\")}`,\n },\n {\n label: `${t(\"cylinderCapacity\")}:`,\n content: `${linkedVehicles?.cylinderCapacity} ${t(\"units.ccm\")}`,\n },\n ]\n\n const seperator = [\n {\n label: \"separator\",\n separator: true,\n },\n ]\n\n return {\n key: String(linkedVehicles?.carId),\n brand: linkedVehicles?.manuDesc,\n subItems: [\n ...vehicleLabel,\n ...vehicleDetails,\n ...seperator,\n ...immadiateAttributsLabel,\n ],\n }\n }\n )\n }\n return Object.entries(groupListByValue(tempArticleAttributes, \"brand\")).map(\n (item) => {\n return (\n
\n )\n }\n ) //.filter((item) => [\"articleName\", \"articleSearchNo\", \"articleNo\",].includes(item.label))\n }, [vehicleListImmediateAttributs, t])\n\n useEffect(() => {\n if (articleList?.articleId && vehicleLinkages.length === 0) {\n tecDocStore\n .fetchVehicleList(countryCatalogue, lang, articleList.articleId)\n .catch((err) => console.log(\"Error fetching vehicles\", err))\n }\n }, [tecDocStore, articleList, vehicleLinkages, countryCatalogue, lang])\n\n useEffect(() => {\n if (vehicleList && vehicleLinkages.length === 0) {\n const linkedArticlePairs: {\n articleLinkId: number\n linkingTargetId: number\n }[] = vehicleList.map((item) => {\n return {\n articleLinkId: item.articleLinkId,\n linkingTargetId: item.linkingTargetId,\n }\n })\n\n tecDocStore\n .fetchVehicleListImmediateAttributs(\n countryCatalogue,\n lang,\n linkedArticlePairs,\n articleList.articleId\n )\n .catch((err) => console.log(\"Error fetching vehicle details\", err))\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [tecDocStore, vehicleList, vehicleLinkages, countryCatalogue, lang])\n\n return (\n \n \n {!(\n loadingVehicleImmediateAttributs ||\n loadingVehicleList ||\n vehicleList === null\n ) && (\n \n )}\n \n \n {vehicleLinkages}\n \n \n )\n}\n\nexport default observer(Vehicles)\n","import * as React from \"react\"\nimport { useEffect, useMemo } from \"react\"\nimport { observer } from \"mobx-react\"\n\nimport { Box, useTheme } from \"@mui/material\"\nimport { useTecDocStore } from \"api/services/TecDoc\"\nimport List from \"../../../components/List/List\"\nimport { ListTextItemTypes } from \"../../../components/List\"\nimport en from \"./locales/en.json\"\nimport useScopedTranslation from \"hooks/useScopedTranslation\"\nimport { createItemBorder } from \"../../../util\"\nimport i18next from \"i18next\"\nimport ListHeading from \"../../../components/List/components/ListHeading\"\n\nexport const namespace = __filename\n\nconst Manufacturer: React.FC = () => {\n const lang = i18next.language\n const countryCatalogue = localStorage.getItem(\"countryCatalogueCode\") || \"de\"\n const theme = useTheme()\n\n const tecDocStore = useTecDocStore()\n const { articleList, brandDetails } = tecDocStore\n const { t } = useScopedTranslation(\n namespace,\n (locale) => import(`./locales/${locale}.json`),\n en\n )\n\n useEffect(() => {\n if (!brandDetails){\n tecDocStore\n .fetchBrandDetails(countryCatalogue, lang, articleList?.brandNo)\n .catch((err) => console.log(\"Error fetching brand details\", err))\n }\n }, [tecDocStore, articleList])\n\n const brandItems = useMemo(() => {\n const requiredKeys = [\n \"name2\",\n \"street\",\n \"city\",\n \"zip\",\n \"mailbox\",\n \"wwwURL\",\n \"phone\",\n \"fax\",\n \"email\",\n ]\n let tempBrandDetails: ListTextItemTypes[] = []\n if (brandDetails) {\n tempBrandDetails = Object.entries(brandDetails).map((item) => {\n return {\n key: item[0],\n subItems: [\n {\n label: requiredKeys.includes(item[0]) ? t(item[0]) : item[0],\n content: item[1],\n docType: \"\"\n },\n ],\n }\n })\n }\n\n return tempBrandDetails\n .filter((item) => requiredKeys.includes(item?.key))\n .sort((a, b) =>\n requiredKeys.indexOf(a.key) > requiredKeys.indexOf(b.key) ? 1 : -1\n )\n }, [brandDetails, t])\n\n return (\n \n \n \n \n
\n \n )\n}\n\nexport default observer(Manufacturer)\n","import * as React from \"react\"\nimport { observer } from \"mobx-react\"\n\nimport { Box, Typography, useTheme } from \"@mui/material\"\nimport { useEffect } from \"react\"\nimport { useTecDocStore } from \"api/services/TecDoc\"\nimport List from \"../../../components/List/List\"\nimport { useMemo } from \"react\"\nimport { ListImageItemTypes, ListTextItemTypes } from \"../../../components/List\"\nimport useScopedTranslation from \"hooks/useScopedTranslation\"\nimport en from \"../Documents/locales/en.json\"\nimport ListHeading from \"../../../components/List/components/ListHeading\"\n\nexport const namespace = __filename\n\nconst Documents: React.FC = () => {\n const tecDocStore = useTecDocStore()\n let { articleDocuments, dynamicIpAdded } = tecDocStore\n\n const theme = useTheme()\n const { t } = useScopedTranslation(\n namespace,\n (locale) => import(`./locales/${locale}.json`),\n en\n )\n\n const getClientIp = async (): Promise => {\n try {\n return fetch(\"https://api.ipify.org?format=json\")\n .then((response) => {\n return response.json()\n })\n .then((res) => {\n return res.ip\n })\n .catch((err: any) => console.error(\"Problem fetching my IP\", err))\n } catch (error) {\n try {\n return fetch(\n \"https://geolocation-db.com/json/d802faa0-10bd-11ec-b2fe-47a0872c6708\"\n )\n .then((response) => {\n return response.json()\n })\n .then((res) => {\n return res.IPv4\n })\n .catch((err: any) => console.error(\"Problem fetching my IP\", err))\n } catch (error) {\n throw new Error(\"Problem fetching my IP\")\n }\n }\n }\n\n useEffect(() => {\n if (!dynamicIpAdded) {\n getClientIp().then((ip) => {\n tecDocStore\n .addPublicIP(ip)\n .catch((err) => console.log(\"Error fetching articles\", err))\n })\n }\n }, [dynamicIpAdded, tecDocStore])\n\n const brandItems = useMemo(() => {\n let tempDocumentDetails: ListImageItemTypes[] = []\n\n // articleDocuments = JSON.parse(JSON.stringify(articleDocuments))\n if (articleDocuments && dynamicIpAdded) {\n tempDocumentDetails = articleDocuments.map((item) => {\n return {\n key: item.docId,\n subItems: [\n {\n content: `https://webservice.tecalliance.services/pegasus-3-0/documents/22148/${item.docId}/0`,\n docType: item.docFileTypeName,\n docTypeName: item.docTypeName,\n },\n ],\n }\n })\n }\n return tempDocumentDetails\n }, [articleDocuments, dynamicIpAdded])\n\n return (\n \n \n \n \n\n {articleDocuments && articleDocuments.length > 0 ? (\n
\n ) : (\n {t(\"noData\")}\n )}\n \n )\n}\n\nexport default observer(Documents)\n","import * as React from \"react\"\nimport { observer } from \"mobx-react\"\n\nimport { Box, useTheme } from \"@mui/material\"\nimport { useTecDocStore } from \"api/services/TecDoc\"\nimport List from \"../../../components/List/List\"\nimport { useMemo } from \"react\"\nimport { ListTextItemTypes } from \"../../../components/List\"\nimport { createItemBorder, groupListByValue } from \"../../../util\"\nimport ListHeading from \"../../../components/List/components/ListHeading\"\nimport useScopedTranslation from \"../../../../../hooks/useScopedTranslation\"\nimport en from \"./locales/en.json\"\n\nexport const namespace = __filename\n\nconst OE: React.FC = () => {\n const tecDocStore = useTecDocStore()\n const { oeNumber } = tecDocStore\n const theme = useTheme()\n const { t } = useScopedTranslation(\n namespace,\n (locale) => import(`./locales/${locale}.json`),\n en\n )\n\n const oeLinkages = useMemo(() => {\n let tempOeLinkages: ListTextItemTypes[] = []\n if (oeNumber) {\n tempOeLinkages = oeNumber.map((item) => {\n return {\n brand: item.brandName,\n key: item.oeNumber,\n subItems: [\n {\n label: item.oeNumber,\n content: \"\",\n },\n ],\n }\n })\n }\n\n return Object.entries(groupListByValue(tempOeLinkages, \"brand\")).map(\n (item) => {\n return (\n
\n )\n }\n )\n }, [oeNumber])\n\n return (\n \n \n \n \n {oeLinkages}\n \n )\n}\n\nexport default observer(OE)\n","import * as React from \"react\"\nimport { observer } from \"mobx-react\"\n\nimport { Box, CircularProgress, Typography } from \"@mui/material\"\n\nimport useScopedTranslation from \"hooks/useScopedTranslation\"\nimport en from \"./locales/en.json\"\nimport List, { ListTextItemTypes } from \"../../../components/List\"\nimport { useTecDocStore } from \"../../../../../api/services/TecDoc\"\nimport { useEffect, useMemo, useState } from \"react\"\n\nimport { createItemBorder, getDate, groupListByValue } from \"../../../util\"\nimport { calculateDateRange } from \"../../util\"\nimport { VehicleSelectionProps } from \"./types\"\nimport i18next from \"i18next\"\nimport { isAte } from \"utils/Global\"\nexport const namespace = __filename\n\nconst VehicleSelection: React.FC = (props) => {\n const lang = i18next.language\n const countryCatalogue = localStorage.getItem(\"countryCatalogueCode\") || \"de\"\n\n const { step, handleStep } = props\n const { t } = useScopedTranslation(\n namespace,\n (locale) => import(`./locales/${locale}.json`),\n en\n )\n const tecDocStore = useTecDocStore()\n const {\n vehicleList,\n vehicleDetailsList,\n articleList,\n loadingVehicleList,\n loadingVehicleDetailsList,\n loadingArticleList,\n } = tecDocStore\n\n const [manufacturer, setManufacturer] = useState(\"\")\n const [model, setModel] = useState(\"\")\n const [typeKey, setTypeKey] = useState(\"\")\n\n const vehicleListByManu = useMemo(() => {\n let tempArticleAttributes: ListTextItemTypes[] = []\n if (vehicleDetailsList) {\n tempArticleAttributes = Object.entries(vehicleDetailsList).map((item) => {\n return {\n key: String(item[1]?.vehicleDetails.carId),\n brand: item[1]?.vehicleDetails.manuName,\n modelName: item[1]?.vehicleDetails.modelName,\n yearFrom: item[1]?.vehicleDetails.yearOfConstrFrom,\n yearTo: item[1]?.vehicleDetails.yearOfConstrTo,\n subItems: [\n {\n label: String(\n `${item[1]?.vehicleDetails.modelName} ${item[1]?.vehicleDetails.typeName}`\n ),\n hasBoldLabel: true,\n },\n {\n label: `${t(\"motorCodes\")}:`,\n content: item[1]?.motorCodes?.array\n .map((item) => item.motorCode)\n .toString(),\n },\n {\n label: `${t(\"yearOfConstruction\")}:`,\n content: getDate(\n item[1]?.vehicleDetails.yearOfConstrFrom,\n item[1]?.vehicleDetails.yearOfConstrTo\n ),\n },\n {\n label: `${t(\"power\")}:`,\n content: `${item[1]?.vehicleDetails.powerHpTo} ${t(\"units.hp\")}/${\n item[1]?.vehicleDetails.powerKwTo\n } ${t(\"units.kw\")}`,\n },\n {\n label: `${t(\"cylinderCapacity\")}:`,\n content: `${item[1]?.vehicleDetails.ccmTech} ${t(\"units.ccm\")}`,\n },\n ],\n }\n })\n }\n const tempListByBrand = Object.entries(\n groupListByValue(tempArticleAttributes, \"brand\")\n ) //.filter((item) => [\"articleName\", \"articleSearchNo\", \"articleNo\",].includes(item.label))\n const tempListByModelAndBrand = tempListByBrand.map((item) => {\n return {\n brand: item[0],\n modelsList: groupListByValue(item[1], \"modelName\"),\n }\n })\n return tempListByModelAndBrand //.filter((item) => [\"articleName\", \"articleSearchNo\", \"articleNo\",].includes(item.label))\n }, [vehicleDetailsList, t])\n\n const manufacturerList = useMemo(() => {\n return (\n {\n return {\n key: String(item.brand),\n brand: item.brand,\n subItems: [\n {\n label: String(item.brand),\n hasBoldLabel: true,\n },\n ],\n onClick: () => {\n setManufacturer(item.brand)\n handleStep(1)\n },\n }\n })\n )}\n />\n )\n }, [vehicleListByManu, handleStep])\n\n const modelList = useMemo(() => {\n if (vehicleListByManu) {\n const manuIndex = vehicleListByManu.findIndex(\n (p) => p.brand === manufacturer\n )\n\n return manuIndex >= 0 ? (\n {\n return {\n key: String(item[0]),\n subItems: [\n {\n label: String(`${manufacturer} ${item[0]}`),\n hasBoldLabel: true,\n },\n {\n label: String(calculateDateRange(item[1])),\n hasBoldLabel: false,\n },\n ],\n onClick: () => {\n setModel(item[0])\n handleStep(1)\n },\n }\n }\n )\n )}\n />\n ) : (\n <>>\n )\n }\n }, [vehicleListByManu, handleStep, manufacturer])\n\n const typeList = useMemo(() => {\n if (vehicleListByManu && step > 1) {\n console.log(model)\n\n const manuIndex = vehicleListByManu.findIndex(\n (p) => p.brand === manufacturer\n )\n\n // const tempTypeList = vehicleListByManu[0].modelsList[model]\n\n return manuIndex >= 0 ? (\n = 0\n ? createItemBorder(\n vehicleListByManu[manuIndex].modelsList[model].map((item) => {\n return {\n key: item.key,\n subItems: item.subItems,\n onClick: () => {\n setTypeKey(item.key)\n handleStep(1)\n },\n }\n })\n )\n : []\n }\n />\n ) : (\n <>>\n )\n }\n }, [vehicleListByManu, manufacturer, model, step, handleStep])\n/*\n const manualList = useMemo(() => {\n return (\n {\n return {\n key: String(item.brand),\n brand: item.brand,\n subItems: [\n {\n label: String(item.brand),\n hasBoldLabel: true,\n },\n ],\n onClick: () => {\n setManufacturer(item.brand)\n handleStep(1)\n },\n }\n })\n )}\n />\n )\n }, [vehicleListByManu, handleStep])\n*/\n useEffect(() => {\n tecDocStore\n .fetchArticle(countryCatalogue, lang, 6, \"4014486413878\") // 4019064364931\n .catch((err) => console.log(\"Error fetching articles\", err))\n }, [tecDocStore])\n\n useEffect(() => {\n if (articleList?.articleId) {\n tecDocStore\n .fetchVehicleList(countryCatalogue, lang, articleList.articleId)\n .catch((err) => console.log(\"Error fetching vehicles\", err))\n }\n }, [tecDocStore, articleList])\n\n useEffect(() => {\n if (vehicleList) {\n const vehicleIds = vehicleList.map((item) => item.linkingTargetId)\n\n tecDocStore\n .fetchVehicleDetailList(countryCatalogue, lang, vehicleIds)\n .catch((err) => console.log(\"Error fetching vehicle details\", err))\n }\n }, [tecDocStore, vehicleList])\n\n return (\n \n {loadingArticleList || loadingVehicleList || loadingVehicleDetailsList ? (\n \n \n \n ) : (\n \n \n {vehicleDetailsList?.length} {t(\"linkedVehicles\")}\n \n {(step === 0 && {manufacturerList}) ||\n (step === 1 && {modelList}) ||\n (step === 2 && {typeList})}\n \n )}\n \n )\n}\n\nexport default observer(VehicleSelection)\n","import {getDate} from \"../util\";\n\nexport const calculateDateRange = (list: any[]) =>{\n let minFrom = 999999\n let maxTo = 0\n list.forEach((item) => {\n if (item?.yearFrom < minFrom) minFrom = item?.yearFrom\n if (item?.yearTo > maxTo) maxTo = item?.yearTo\n })\n return getDate(minFrom, maxTo)\n}","import React from \"react\"\nimport { Box, Container, Typography, useTheme } from \"@mui/material\"\nimport ResponsiveBackground from \"components/ResponsiveBackground\"\nimport useScopedTranslation from \"hooks/useScopedTranslation\"\nimport en from \"./locales/en.json\"\nimport Link from \"components/Link\"\n\nexport const namespace = __filename\n\nconst CounterfeitReport = () => {\n const theme = useTheme()\n const { t, i18n } = useScopedTranslation(\n namespace,\n (locale) => import(`./locales/${locale}.json`),\n en\n )\n\n const links = {\n en: \"https://www.continental-aftermarket.com/en-en/contact-authenticity-check-and-vehicle-use\",\n de: \"https://www.continental-aftermarket.com/de-de/kontakt-originalitaetspruefung-und-fahrzeugverwendung\",\n fr: \"https://www.continental-aftermarket.com/fr-fr/contacter-le-controle-doriginalite-et-lutilisation-du-vehicule\",\n es: \"https://www.continental-aftermarket.com/es-es/contacto-control-de-originalidad-y-uso-del-vehiculo\",\n it: \"https://www.continental-aftermarket.com/it-it/contatto-controllo-originalita-e-utilizzo-veicolo\",\n }\n\n return (\n \n \n \n \n {t(\"contactEmail\")}\n \n \n \n \n \n )\n}\n\nexport default CounterfeitReport\n","import {\n Box,\n Button,\n Container,\n FormControl,\n Typography,\n useTheme,\n} from \"@mui/material\"\nimport React, { useEffect, useState } from \"react\"\nimport { generatePath, useHistory } from \"react-router-dom\"\nimport Dialog from \"../../../components/Dialog\"\nimport ResponsiveBackground from \"../../../components/ResponsiveBackground\"\n\nimport ArrowForwardIosIcon from \"@mui/icons-material/ArrowForwardIos\"\nimport InfoOutlinedIcon from \"@mui/icons-material/InfoOutlined\"\nimport ContiSpecificButton from \"components/ContiSpecificButton\"\nimport Html5QrcodePlugin from \"components/Html5-qrcode/Html5qrcodePlugin\"\nimport { EanScannerIos } from \"ean-scanner-ios\"\nimport \"ean-scanner-ios/dist/index.css\"\nimport useScopedTranslation from \"../../../hooks/useScopedTranslation\"\nimport en from \"./locales/en.json\"\nimport { StyledTextField } from \"./styles\"\n\nimport { ateEanCode, contiEanCode, isAte, isConti } from \"utils/Global\"\nimport { default as general_eancode_image } from \"../../../assets/images/general_eancode.png\"\n\nexport const namespace = __filename\n\nconst SecondScan = () => {\n const theme = useTheme()\n const history = useHistory()\n const { t } = useScopedTranslation(\n namespace,\n (locale) => import(`./locales/${locale}.json`),\n en\n )\n\n const isMobile = window.innerWidth < theme.tokens.breakpoints.breakpointTablet\n\n const [data, setData] = useState(\"\")\n const [scan, setScan] = useState(false)\n const [show, setShow] = useState(false)\n const [error, setError] = useState(\"\")\n const [eanCodeImg, setEanCodeImg] = React.useState(general_eancode_image)\n const [showInfo, setShowInfo] = useState(false)\n const [showTextField, setShowTextField] = useState(!isMobile ? true : null)\n const [showPlaceholder, setShowPlaceholder] = useState(true)\n\n //start quagga\n const [decodedText, setDecodedText] = useState(\"\" as string)\n const [scanList, setScanList] = useState([])\n\n const redirectLocation = (gtin) => {\n console.log(gtin)\n setError(\"\")\n history.replace({\n pathname: \"/scan\",\n search: \"ean=\" + gtin,\n })\n history.push({\n pathname: generatePath(\"/tecdoc\"),\n state: {\n gtin: gtin,\n },\n })\n }\n\n useEffect(() => {\n if (history.location.search) {\n const parameters = new URLSearchParams(history.location.search)\n const ean = parameters.get(\"ean\")\n if (ean && ean.length > 3) {\n setShowTextField(true)\n setDecodedText(parameters.get(\"ean\"))\n history.replace({\n pathname: \"/scan\",\n search: \"\",\n })\n }\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n const handleKeyDown = (event) => {\n if (event.key === \"Enter\") {\n eanCheck(decodedText ? decodedText : data) && redirectLocation(data)\n }\n }\n\n const onClickHandle = () => {\n eanCheck(decodedText ? decodedText : data) && redirectLocation(data)\n }\n\n const eanCheck = (input) => {\n if (!/^\\d{13}$/.test(input)) {\n setError(t(\"eanIncorrectLength\"))\n return false\n } else {\n setError(\"\")\n }\n\n // Calculate the check digit using the first 12 digits\n let checkDigit = 0\n for (let i = 0; i < 12; i += 2) {\n checkDigit += Number(input[i])\n checkDigit += Number(input[i + 1]) * 3\n }\n checkDigit = (10 - (checkDigit % 10)) % 10\n\n const isCorrectDigit = checkDigit === Number(input[12])\n !isCorrectDigit && setError(`${t(\"eanIncorrectCheck\")} ${checkDigit}`)\n return isCorrectDigit\n }\n\n useEffect(() => {\n if (isAte) {\n setEanCodeImg(ateEanCode)\n } else if (isConti) {\n setEanCodeImg(contiEanCode)\n } else {\n setEanCodeImg(contiEanCode)\n }\n }, [])\n\n const handleShowInfo = () => {\n setShowInfo(!showInfo)\n }\n\n //initiate ios scanner\n\n const getMostRepeated = (array) => {\n if (array.length === 0) return null\n let modeMap = {}\n let maxEl = array[0]\n let maxCount = 1\n for (let i = 0; i < array.length; i++) {\n let el = array[i]\n if (modeMap[el] == null) modeMap[el] = 1\n else modeMap[el]++\n if (modeMap[el] > maxCount) {\n maxEl = el\n maxCount = modeMap[el]\n }\n }\n return maxEl\n }\n\n //check operating system in order to render the functioning scanner\n const getScannerByOperatingSystem = () => {\n const userAgent = navigator.userAgent || navigator.vendor\n\n if (/android/i.test(userAgent)) {\n return (\n \n )\n }\n\n if (/iPad|iPhone|iPod/.test(userAgent)) {\n return (\n {\n if (\n (scanList.length === 2 && scanList[0] === scanList[1]) ||\n scanList.length > 3\n ) {\n const result = getMostRepeated(scanList)\n localStorage.setItem(\"data\", result)\n setDecodedText(result)\n setScan(false)\n setShowTextField(true)\n redirectLocation(result)\n } else {\n if (eanCheck(rawScan)) {\n setScanList([...scanList, rawScan])\n }\n }\n }}\n />\n )\n }\n\n return \"Unknown\"\n }\n\n //result scanning android system\n const onNewScanResultAndroid = (decodedTextNew, decodedResult) => {\n if (decodedTextNew) {\n localStorage.setItem(\"data\", decodedTextNew)\n setDecodedText(decodedTextNew)\n\n setScan(false)\n eanCheck(decodedTextNew ? decodedTextNew : data) &&\n redirectLocation(decodedTextNew)\n setShowTextField(true)\n }\n }\n const handleShowTextField = () => {\n setShowTextField(!showTextField)\n }\n\n const handleTextFieldChange = (e) => {\n setDecodedText(e.target.value)\n setData(e.target.value)\n localStorage.setItem(\"data\", e.target.value)\n }\n\n return (\n \n \n \n \n \n {window.innerWidth <\n theme.tokens.breakpoints.breakpointTablet + 200 && (\n <>\n {!isMobile && (\n \n {t(\"helpText\")}\n \n )}\n \n setScan(true)}\n isBarcode={true}\n >\n \n \n \n \n >\n )}\n\n \n {window.innerWidth >\n theme.tokens.breakpoints.breakpointTablet && (\n \n {t(\"helpTextTablet\")}\n \n )}\n \n \n \n theme.tokens.breakpoints.breakpointTablet\n }\n id=\"outlined-basic\"\n variant=\"outlined\"\n placeholder={showPlaceholder ? \"4 006633 444729\" : \"\"}\n onChange={handleTextFieldChange}\n value={decodedText}\n type={\"text\"}\n onKeyDown={handleKeyDown}\n InputLabelProps={{ shrink: false }}\n inputProps={{ min: 0, style: { textAlign: \"center\" } }}\n InputProps={{\n style: {\n borderRadius: \"30px\",\n marginTop: \"15px\",\n textAlign: \"center\",\n fontFamily: isAte\n ? \"Etelka Light\"\n : \"ContinentalStagSans-Light\",\n fontSize: \"18px\",\n lineHeight: \"26px\",\n letterSpacing: \"3px\",\n width: \"100%\",\n height:\n window.innerWidth <\n theme.tokens.breakpoints.breakpointTablet\n ? \"32px\"\n : undefined,\n minWidth: \"250px\",\n padding: null,\n backgroundColor: \"#ffff\",\n },\n }}\n style={{\n minWidth: \"200px\",\n }}\n onFocus={() => setShowPlaceholder(false)}\n onBlur={() => setShowPlaceholder(true)}\n />\n \n \n \n \n \n \n {error}\n \n \n \n\n \n \n \n \n \n\n \n {t(\"EANCodeInfo\")}\n \n \n \n \n {t(\"EANCodeInfoProduct\")}\n \n {showInfo ? (\n
\n ) : // \n null}\n \n \n\n \n \n \n )\n}\n\nexport default SecondScan\n","import {\n Html5Qrcode,\n Html5QrcodeScanType,\n Html5QrcodeScannerState,\n Html5QrcodeSupportedFormats,\n} from \"html5-qrcode\"\nimport { useEffect } from \"react\"\nimport \"./html5-qrcode.css\"\n\nconst qrcodeRegionId = \"reader\"\n\n// Creates the configuration object for Html5QrcodeScanner.\nconst createConfig = (props) => {\n let config = {\n fps: 15,\n qrbox: {\n width: 400,\n height: 300,\n },\n aspectRatio: undefined,\n disableFlip: undefined,\n // focusMode: \"continuous\",\n defaultZoomValueIfSupported: 1.7,\n showZoomSliderIfSupported: true,\n rememberLastUsedCamera: true,\n experimentalFeatures: {\n useBarCodeDetectorIfSupported: true,\n },\n // willReadFrequently: true,\n supportedScanTypes: [\n // Html5QrcodeScanType.SCAN_TYPE_FILE,\n Html5QrcodeScanType.SCAN_TYPE_CAMERA,\n ],\n formatsToSupport: [Html5QrcodeSupportedFormats.EAN_13],\n // videoConstraints: { facingMode: { exact: \"environment\" }, deviceId: cameraId },\n }\n if (props.fps) {\n config.fps = props.fps\n }\n if (props.qrbox) {\n config.qrbox = props.qrbox\n }\n if (props.aspectRatio) {\n config.aspectRatio = props.aspectRatio\n }\n if (props.disableFlip !== undefined) {\n config.disableFlip = props.disableFlip\n }\n return config\n}\n\n// const Html5QrcodePlugin = (props) => {\n// let cameraId = null\n// useEffect(() => {\n// // when component mounts\n\n// const verbose = props.verbose === true\n// // Suceess callback is required.\n// if (!props.qrCodeSuccessCallback) {\n// throw \"qrCodeSuccessCallback is required callback.\"\n// }\n\n// let html5QrcodeScanner = null\n// // const html5QrCode = new Html5Qrcode(\"reader\");\n// Html5Qrcode.getCameras().then((devices) => {\n// if (devices && devices.length) {\n// if (devices.length === 1) {\n// cameraId = devices[0].id\n// } else {\n// //check first for 2_0 camera as this is usally the default back one\n// for (const device of devices) {\n// const cameraLabel = device.label\n// if (\n// cameraLabel &&\n// (cameraLabel.toLowerCase().includes(\"2 0\") ||\n// cameraLabel.toLowerCase().includes(\"2.0\") ||\n// (cameraLabel.toLowerCase().includes(\"back\") &&\n// (cameraLabel.toLowerCase().includes(\"2 2\") ||\n// cameraLabel.toLowerCase().includes(\"2.2\"))))\n// ) {\n// cameraId = device.id\n// }\n// }\n// //if none is found take the first back one\n// if (cameraId == null) {\n// for (const device of devices) {\n// const cameraLabel = device.label\n// if (cameraLabel && cameraLabel.toLowerCase().includes(\"back\")) {\n// cameraId = device.id\n// }\n// }\n// }\n// }\n// }\n// })\n\n// // // html5QrCode.start(cameraId, config, props.qrCodeSuccessCallback, props.qrCodeErrorCallback)\n// // })\n\n// const config = createConfig(props, cameraId)\n// html5QrcodeScanner = new Html5QrcodeScanner(qrcodeRegionId, config, verbose)\n\n// html5QrcodeScanner.render(\n// props.qrCodeSuccessCallback,\n// props.qrCodeErrorCallback\n// )\n\n// setTimeout(function () {\n// html5QrcodeScanner.applyVideoConstraints({\n// focusMode: \"continuous\",\n// deviceId: cameraId,\n// // autoGainControl: true,\n// advanced: [{ zoom: 1.5 }],\n// facingMode: { exact: \"environment\" },\n// })\n// }, 2000)\n\n// // cleanup function when component will unmount\n// return () => {\n// html5QrcodeScanner.clear().catch((error) => {\n// console.error(\"Failed to clear html5QrcodeScanner. \", error)\n// })\n// }\n// }, [])\n\n// return \n// }\n\nconst Html5QrcodePlugin = (props) => {\n useEffect(() => {\n if (!props.qrCodeSuccessCallback) {\n throw new Error(\"qrCodeSuccessCallback is required callback.\")\n }\n\n const config = createConfig(props)\n\n const html5QrCode = new Html5Qrcode(qrcodeRegionId)\n Html5Qrcode.getCameras().then((devices) => {\n if (devices && devices.length) {\n let cameraId = devices[0].id // Default to the first camera if specific criteria are not met\n // Implement your logic to choose a cameraId based on your criteria\n // For example, choosing the first back camera\n if (devices.length === 1) {\n cameraId = devices[0].id\n } else {\n //check first for 2_0 camera as this is usally the default back one\n for (const device of devices) {\n const cameraLabel = device.label\n if (\n cameraLabel && cameraLabel.toLowerCase().includes(\"back\") &&\n (cameraLabel.toLowerCase().includes(\"2 0\") ||\n cameraLabel.toLowerCase().includes(\"2.0\") //||\n // cameraLabel.toLowerCase().includes(\"2 2\") ||\n // cameraLabel.toLowerCase().includes(\"2.2\")\n )\n ) {\n cameraId = device.id\n }\n }\n //if none is found take the first back one\n if (cameraId == null) {\n for (const device of devices) {\n const cameraLabel = device.label\n if (cameraLabel && cameraLabel.toLowerCase().includes(\"back\")) {\n cameraId = device.id\n }\n }\n }\n }\n\n html5QrCode\n .start(\n cameraId,\n config,\n props.qrCodeSuccessCallback,\n props.qrCodeErrorCallback\n )\n .catch((err) => {\n console.error(`Unable to start camera with ID ${cameraId}`, err)\n })\n\n let videoConfig = {\n focusMode: \"continuous\",\n // autoGainControl: true,\n advanced: [{ zoom: 1.7 }],\n // facingMode: { exact: \"environment\" },\n }\n startTimer(html5QrCode, videoConfig)\n }\n })\n\n return () => {\n if (html5QrCode.getState() === Html5QrcodeScannerState.SCANNING) {\n html5QrCode.stop().catch((error) => {\n console.error(\"Failed to stop html5QrCode. \", error)\n })\n }\n }\n }, [props])\n\n return \n}\n\nconst startTimer = (html5QrCode, videoConfig) => {\n setTimeout(function () {\n if (html5QrCode.getState() === Html5QrcodeScannerState.SCANNING) {\n html5QrCode.applyVideoConstraints(videoConfig)\n } else {\n startTimer(html5QrCode, videoConfig)\n }\n }, 2000)\n}\n\nexport default Html5QrcodePlugin\n","// A type of promise-like that resolves synchronously and supports only one observer\nexport const _Pact = /*#__PURE__*/(function() {\n\tfunction _Pact() {}\n\t_Pact.prototype.then = function(onFulfilled, onRejected) {\n\t\tconst result = new _Pact();\n\t\tconst state = this.s;\n\t\tif (state) {\n\t\t\tconst callback = state & 1 ? onFulfilled : onRejected;\n\t\t\tif (callback) {\n\t\t\t\ttry {\n\t\t\t\t\t_settle(result, 1, callback(this.v));\n\t\t\t\t} catch (e) {\n\t\t\t\t\t_settle(result, 2, e);\n\t\t\t\t}\n\t\t\t\treturn result;\n\t\t\t} else {\n\t\t\t\treturn this;\n\t\t\t}\n\t\t}\n\t\tthis.o = function(_this) {\n\t\t\ttry {\n\t\t\t\tconst value = _this.v;\n\t\t\t\tif (_this.s & 1) {\n\t\t\t\t\t_settle(result, 1, onFulfilled ? onFulfilled(value) : value);\n\t\t\t\t} else if (onRejected) {\n\t\t\t\t\t_settle(result, 1, onRejected(value));\n\t\t\t\t} else {\n\t\t\t\t\t_settle(result, 2, value);\n\t\t\t\t}\n\t\t\t} catch (e) {\n\t\t\t\t_settle(result, 2, e);\n\t\t\t}\n\t\t};\n\t\treturn result;\n\t}\n\treturn _Pact;\n})();\n\n// Settles a pact synchronously\nexport function _settle(pact, state, value) {\n\tif (!pact.s) {\n\t\tif (value instanceof _Pact) {\n\t\t\tif (value.s) {\n\t\t\t\tif (state & 1) {\n\t\t\t\t\tstate = value.s;\n\t\t\t\t}\n\t\t\t\tvalue = value.v;\n\t\t\t} else {\n\t\t\t\tvalue.o = _settle.bind(null, pact, state);\n\t\t\t\treturn;\n\t\t\t}\n\t\t}\n\t\tif (value && value.then) {\n\t\t\tvalue.then(_settle.bind(null, pact, state), _settle.bind(null, pact, 2));\n\t\t\treturn;\n\t\t}\n\t\tpact.s = state;\n\t\tpact.v = value;\n\t\tconst observer = pact.o;\n\t\tif (observer) {\n\t\t\tobserver(pact);\n\t\t}\n\t}\n}\n\nexport function _isSettledPact(thenable) {\n\treturn thenable instanceof _Pact && thenable.s & 1;\n}\n\n// Converts argument to a function that always returns a Promise\nexport function _async(f) {\n\treturn function() {\n\t\tfor (var args = [], i = 0; i < arguments.length; i++) {\n\t\t\targs[i] = arguments[i];\n\t\t}\n\t\ttry {\n\t\t\treturn Promise.resolve(f.apply(this, args));\n\t\t} catch(e) {\n\t\t\treturn Promise.reject(e);\n\t\t}\n\t}\n}\n\n// Awaits on a value that may or may not be a Promise (equivalent to the await keyword in ES2015, with continuations passed explicitly)\nexport function _await(value, then, direct) {\n\tif (direct) {\n\t\treturn then ? then(value) : value;\n\t}\n\tif (!value || !value.then) {\n\t\tvalue = Promise.resolve(value);\n\t}\n\treturn then ? value.then(then) : value;\n}\n\n// Awaits on a value that may or may not be a Promise, then ignores it\nexport function _awaitIgnored(value, direct) {\n\tif (!direct) {\n\t\treturn value && value.then ? value.then(_empty) : Promise.resolve();\n\t}\n}\n\n// Proceeds after a value has resolved, or proceeds immediately if the value is not thenable\nexport function _continue(value, then) {\n\treturn value && value.then ? value.then(then) : then(value);\n}\n\n// Proceeds after a value has resolved, or proceeds immediately if the value is not thenable\nexport function _continueIgnored(value) {\n\tif (value && value.then) {\n\t\treturn value.then(_empty);\n\t}\n}\n\n// Asynchronously iterate through an object that has a length property, passing the index as the first argument to the callback (even as the length property changes)\nexport function _forTo(array, body, check) {\n\tvar i = -1, pact, reject;\n\tfunction _cycle(result) {\n\t\ttry {\n\t\t\twhile (++i < array.length && (!check || !check())) {\n\t\t\t\tresult = body(i);\n\t\t\t\tif (result && result.then) {\n\t\t\t\t\tif (_isSettledPact(result)) {\n\t\t\t\t\t\tresult = result.v;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tresult.then(_cycle, reject || (reject = _settle.bind(null, pact = new _Pact(), 2)));\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t\tif (pact) {\n\t\t\t\t_settle(pact, 1, result);\n\t\t\t} else {\n\t\t\t\tpact = result;\n\t\t\t}\n\t\t} catch (e) {\n\t\t\t_settle(pact || (pact = new _Pact()), 2, e);\n\t\t}\n\t}\n\t_cycle();\n\treturn pact;\n}\n\n// Asynchronously iterate through an object's properties (including properties inherited from the prototype)\n// Uses a snapshot of the object's properties\nexport function _forIn(target, body, check) {\n\tvar keys = [];\n\tfor (var key in target) {\n\t\tkeys.push(key);\n\t}\n\treturn _forTo(keys, function(i) { return body(keys[i]); }, check);\n}\n\n// Asynchronously iterate through an object's own properties (excluding properties inherited from the prototype)\n// Uses a snapshot of the object's properties\nexport function _forOwn(target, body, check) {\n\tvar keys = [];\n\tfor (var key in target) {\n\t\tif (Object.prototype.hasOwnProperty.call(target, key)) {\n\t\t\tkeys.push(key);\n\t\t}\n\t}\n\treturn _forTo(keys, function(i) { return body(keys[i]); }, check);\n}\n\nexport const _iteratorSymbol = /*#__PURE__*/ typeof Symbol !== \"undefined\" ? (Symbol.iterator || (Symbol.iterator = Symbol(\"Symbol.iterator\"))) : \"@@iterator\";\n\n// Asynchronously iterate through an object's values\n// Uses for...of if the runtime supports it, otherwise iterates until length on a copy\nexport function _forOf(target, body, check) {\n\tif (typeof target[_iteratorSymbol] === \"function\") {\n\t\tvar iterator = target[_iteratorSymbol](), step, pact, reject;\n\t\tfunction _cycle(result) {\n\t\t\ttry {\n\t\t\t\twhile (!(step = iterator.next()).done && (!check || !check())) {\n\t\t\t\t\tresult = body(step.value);\n\t\t\t\t\tif (result && result.then) {\n\t\t\t\t\t\tif (_isSettledPact(result)) {\n\t\t\t\t\t\t\tresult = result.v;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tresult.then(_cycle, reject || (reject = _settle.bind(null, pact = new _Pact(), 2)));\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tif (pact) {\n\t\t\t\t\t_settle(pact, 1, result);\n\t\t\t\t} else {\n\t\t\t\t\tpact = result;\n\t\t\t\t}\n\t\t\t} catch (e) {\n\t\t\t\t_settle(pact || (pact = new _Pact()), 2, e);\n\t\t\t}\n\t\t}\n\t\t_cycle();\n\t\tif (iterator.return) {\n\t\t\tvar _fixup = function(value) {\n\t\t\t\ttry {\n\t\t\t\t\tif (!step.done) {\n\t\t\t\t\t\titerator.return();\n\t\t\t\t\t}\n\t\t\t\t} catch(e) {\n\t\t\t\t}\n\t\t\t\treturn value;\n\t\t\t}\n\t\t\tif (pact && pact.then) {\n\t\t\t\treturn pact.then(_fixup, function(e) {\n\t\t\t\t\tthrow _fixup(e);\n\t\t\t\t});\n\t\t\t}\n\t\t\t_fixup();\n\t\t}\n\t\treturn pact;\n\t}\n\t// No support for Symbol.iterator\n\tif (!(\"length\" in target)) {\n\t\tthrow new TypeError(\"Object is not iterable\");\n\t}\n\t// Handle live collections properly\n\tvar values = [];\n\tfor (var i = 0; i < target.length; i++) {\n\t\tvalues.push(target[i]);\n\t}\n\treturn _forTo(values, function(i) { return body(values[i]); }, check);\n}\n\nexport const _asyncIteratorSymbol = /*#__PURE__*/ typeof Symbol !== \"undefined\" ? (Symbol.asyncIterator || (Symbol.asyncIterator = Symbol(\"Symbol.asyncIterator\"))) : \"@@asyncIterator\";\n\n// Asynchronously iterate on a value using it's async iterator if present, or its synchronous iterator if missing\nexport function _forAwaitOf(target, body, check) {\n\tif (typeof target[_asyncIteratorSymbol] === \"function\") {\n\t\tvar pact = new _Pact();\n\t\tvar iterator = target[_asyncIteratorSymbol]();\n\t\titerator.next().then(_resumeAfterNext).then(void 0, _reject);\n\t\treturn pact;\n\t\tfunction _resumeAfterBody(result) {\n\t\t\tif (check && check()) {\n\t\t\t\treturn _settle(pact, 1, iterator.return ? iterator.return().then(function() { return result; }) : result);\n\t\t\t}\n\t\t\titerator.next().then(_resumeAfterNext).then(void 0, _reject);\n\t\t}\n\t\tfunction _resumeAfterNext(step) {\n\t\t\tif (step.done) {\n\t\t\t\t_settle(pact, 1);\n\t\t\t} else {\n\t\t\t\tPromise.resolve(body(step.value)).then(_resumeAfterBody).then(void 0, _reject);\n\t\t\t}\n\t\t}\n\t\tfunction _reject(error) {\n\t\t\t_settle(pact, 2, iterator.return ? iterator.return().then(function() { return error; }) : error);\n\t\t}\n\t}\n\treturn Promise.resolve(_forOf(target, function(value) { return Promise.resolve(value).then(body); }, check));\n}\n\n// Asynchronously implement a generic for loop\nexport function _for(test, update, body) {\n\tvar stage;\n\tfor (;;) {\n\t\tvar shouldContinue = test();\n\t\tif (_isSettledPact(shouldContinue)) {\n\t\t\tshouldContinue = shouldContinue.v;\n\t\t}\n\t\tif (!shouldContinue) {\n\t\t\treturn result;\n\t\t}\n\t\tif (shouldContinue.then) {\n\t\t\tstage = 0;\n\t\t\tbreak;\n\t\t}\n\t\tvar result = body();\n\t\tif (result && result.then) {\n\t\t\tif (_isSettledPact(result)) {\n\t\t\t\tresult = result.s;\n\t\t\t} else {\n\t\t\t\tstage = 1;\n\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\t\tif (update) {\n\t\t\tvar updateValue = update();\n\t\t\tif (updateValue && updateValue.then && !_isSettledPact(updateValue)) {\n\t\t\t\tstage = 2;\n\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\t}\n\tvar pact = new _Pact();\n\tvar reject = _settle.bind(null, pact, 2);\n\t(stage === 0 ? shouldContinue.then(_resumeAfterTest) : stage === 1 ? result.then(_resumeAfterBody) : updateValue.then(_resumeAfterUpdate)).then(void 0, reject);\n\treturn pact;\n\tfunction _resumeAfterBody(value) {\n\t\tresult = value;\n\t\tdo {\n\t\t\tif (update) {\n\t\t\t\tupdateValue = update();\n\t\t\t\tif (updateValue && updateValue.then && !_isSettledPact(updateValue)) {\n\t\t\t\t\tupdateValue.then(_resumeAfterUpdate).then(void 0, reject);\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t}\n\t\t\tshouldContinue = test();\n\t\t\tif (!shouldContinue || (_isSettledPact(shouldContinue) && !shouldContinue.v)) {\n\t\t\t\t_settle(pact, 1, result);\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif (shouldContinue.then) {\n\t\t\t\tshouldContinue.then(_resumeAfterTest).then(void 0, reject);\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tresult = body();\n\t\t\tif (_isSettledPact(result)) {\n\t\t\t\tresult = result.v;\n\t\t\t}\n\t\t} while (!result || !result.then);\n\t\tresult.then(_resumeAfterBody).then(void 0, reject);\n\t}\n\tfunction _resumeAfterTest(shouldContinue) {\n\t\tif (shouldContinue) {\n\t\t\tresult = body();\n\t\t\tif (result && result.then) {\n\t\t\t\tresult.then(_resumeAfterBody).then(void 0, reject);\n\t\t\t} else {\n\t\t\t\t_resumeAfterBody(result);\n\t\t\t}\n\t\t} else {\n\t\t\t_settle(pact, 1, result);\n\t\t}\n\t}\n\tfunction _resumeAfterUpdate() {\n\t\tif (shouldContinue = test()) {\n\t\t\tif (shouldContinue.then) {\n\t\t\t\tshouldContinue.then(_resumeAfterTest).then(void 0, reject);\n\t\t\t} else {\n\t\t\t\t_resumeAfterTest(shouldContinue);\n\t\t\t}\n\t\t} else {\n\t\t\t_settle(pact, 1, result);\n\t\t}\n\t}\n}\n\n// Asynchronously implement a do ... while loop\nexport function _do(body, test) {\n\tvar awaitBody;\n\tdo {\n\t\tvar result = body();\n\t\tif (result && result.then) {\n\t\t\tif (_isSettledPact(result)) {\n\t\t\t\tresult = result.v;\n\t\t\t} else {\n\t\t\t\tawaitBody = true;\n\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\t\tvar shouldContinue = test();\n\t\tif (_isSettledPact(shouldContinue)) {\n\t\t\tshouldContinue = shouldContinue.v;\n\t\t}\n\t\tif (!shouldContinue) {\n\t\t\treturn result;\n\t\t}\n\t} while (!shouldContinue.then);\n\tconst pact = new _Pact();\n\tconst reject = _settle.bind(null, pact, 2);\n\t(awaitBody ? result.then(_resumeAfterBody) : shouldContinue.then(_resumeAfterTest)).then(void 0, reject);\n\treturn pact;\n\tfunction _resumeAfterBody(value) {\n\t\tresult = value;\n\t\tfor (;;) {\n\t\t\tshouldContinue = test();\n\t\t\tif (_isSettledPact(shouldContinue)) {\n\t\t\t\tshouldContinue = shouldContinue.v;\n\t\t\t}\n\t\t\tif (!shouldContinue) {\n\t\t\t\tbreak;\n\t\t\t}\n\t\t\tif (shouldContinue.then) {\n\t\t\t\tshouldContinue.then(_resumeAfterTest).then(void 0, reject);\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tresult = body();\n\t\t\tif (result && result.then) {\n\t\t\t\tif (_isSettledPact(result)) {\n\t\t\t\t\tresult = result.v;\n\t\t\t\t} else {\n\t\t\t\t\tresult.then(_resumeAfterBody).then(void 0, reject);\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t_settle(pact, 1, result);\n\t}\n\tfunction _resumeAfterTest(shouldContinue) {\n\t\tif (shouldContinue) {\n\t\t\tdo {\n\t\t\t\tresult = body();\n\t\t\t\tif (result && result.then) {\n\t\t\t\t\tif (_isSettledPact(result)) {\n\t\t\t\t\t\tresult = result.v;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tresult.then(_resumeAfterBody).then(void 0, reject);\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tshouldContinue = test();\n\t\t\t\tif (_isSettledPact(shouldContinue)) {\n\t\t\t\t\tshouldContinue = shouldContinue.v;\n\t\t\t\t}\n\t\t\t\tif (!shouldContinue) {\n\t\t\t\t\t_settle(pact, 1, result);\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t} while (!shouldContinue.then);\n\t\t\tshouldContinue.then(_resumeAfterTest).then(void 0, reject);\n\t\t} else {\n\t\t\t_settle(pact, 1, result);\n\t\t}\n\t}\n}\n\n// Asynchronously implement a switch statement\nexport function _switch(discriminant, cases) {\n\tvar dispatchIndex = -1;\n\tvar awaitBody;\n\touter: {\n\t\tfor (var i = 0; i < cases.length; i++) {\n\t\t\tvar test = cases[i][0];\n\t\t\tif (test) {\n\t\t\t\tvar testValue = test();\n\t\t\t\tif (testValue && testValue.then) {\n\t\t\t\t\tbreak outer;\n\t\t\t\t}\n\t\t\t\tif (testValue === discriminant) {\n\t\t\t\t\tdispatchIndex = i;\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\t// Found the default case, set it as the pending dispatch case\n\t\t\t\tdispatchIndex = i;\n\t\t\t}\n\t\t}\n\t\tif (dispatchIndex !== -1) {\n\t\t\tdo {\n\t\t\t\tvar body = cases[dispatchIndex][1];\n\t\t\t\twhile (!body) {\n\t\t\t\t\tdispatchIndex++;\n\t\t\t\t\tbody = cases[dispatchIndex][1];\n\t\t\t\t}\n\t\t\t\tvar result = body();\n\t\t\t\tif (result && result.then) {\n\t\t\t\t\tawaitBody = true;\n\t\t\t\t\tbreak outer;\n\t\t\t\t}\n\t\t\t\tvar fallthroughCheck = cases[dispatchIndex][2];\n\t\t\t\tdispatchIndex++;\n\t\t\t} while (fallthroughCheck && !fallthroughCheck());\n\t\t\treturn result;\n\t\t}\n\t}\n\tconst pact = new _Pact();\n\tconst reject = _settle.bind(null, pact, 2);\n\t(awaitBody ? result.then(_resumeAfterBody) : testValue.then(_resumeAfterTest)).then(void 0, reject);\n\treturn pact;\n\tfunction _resumeAfterTest(value) {\n\t\tfor (;;) {\n\t\t\tif (value === discriminant) {\n\t\t\t\tdispatchIndex = i;\n\t\t\t\tbreak;\n\t\t\t}\n\t\t\tif (++i === cases.length) {\n\t\t\t\tif (dispatchIndex !== -1) {\n\t\t\t\t\tbreak;\n\t\t\t\t} else {\n\t\t\t\t\t_settle(pact, 1, result);\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t}\n\t\t\ttest = cases[i][0];\n\t\t\tif (test) {\n\t\t\t\tvalue = test();\n\t\t\t\tif (value && value.then) {\n\t\t\t\t\tvalue.then(_resumeAfterTest).then(void 0, reject);\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tdispatchIndex = i;\n\t\t\t}\n\t\t}\n\t\tdo {\n\t\t\tvar body = cases[dispatchIndex][1];\n\t\t\twhile (!body) {\n\t\t\t\tdispatchIndex++;\n\t\t\t\tbody = cases[dispatchIndex][1];\n\t\t\t}\n\t\t\tvar result = body();\n\t\t\tif (result && result.then) {\n\t\t\t\tresult.then(_resumeAfterBody).then(void 0, reject);\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tvar fallthroughCheck = cases[dispatchIndex][2];\n\t\t\tdispatchIndex++;\n\t\t} while (fallthroughCheck && !fallthroughCheck());\n\t\t_settle(pact, 1, result);\n\t}\n\tfunction _resumeAfterBody(result) {\n\t\tfor (;;) {\n\t\t\tvar fallthroughCheck = cases[dispatchIndex][2];\n\t\t\tif (!fallthroughCheck || fallthroughCheck()) {\n\t\t\t\tbreak;\n\t\t\t}\n\t\t\tdispatchIndex++;\n\t\t\tvar body = cases[dispatchIndex][1];\n\t\t\twhile (!body) {\n\t\t\t\tdispatchIndex++;\n\t\t\t\tbody = cases[dispatchIndex][1];\n\t\t\t}\n\t\t\tresult = body();\n\t\t\tif (result && result.then) {\n\t\t\t\tresult.then(_resumeAfterBody).then(void 0, reject);\n\t\t\t\treturn;\n\t\t\t}\n\t\t}\n\t\t_settle(pact, 1, result);\n\t}\n}\n\n// Asynchronously call a function and pass the result to explicitly passed continuations\nexport function _call(body, then, direct) {\n\tif (direct) {\n\t\treturn then ? then(body()) : body();\n\t}\n\ttry {\n\t\tvar result = Promise.resolve(body());\n\t\treturn then ? result.then(then) : result;\n\t} catch (e) {\n\t\treturn Promise.reject(e);\n\t}\n}\n\n// Asynchronously call a function and swallow the result\nexport function _callIgnored(body, direct) {\n\treturn _call(body, _empty, direct);\n}\n\n// Asynchronously call a function and pass the result to explicitly passed continuations\nexport function _invoke(body, then) {\n\tvar result = body();\n\tif (result && result.then) {\n\t\treturn result.then(then);\n\t}\n\treturn then(result);\n}\n\n// Asynchronously call a function and swallow the result\nexport function _invokeIgnored(body) {\n\tvar result = body();\n\tif (result && result.then) {\n\t\treturn result.then(_empty);\n\t}\n}\n\n// Asynchronously call a function and send errors to recovery continuation\nexport function _catch(body, recover) {\n\ttry {\n\t\tvar result = body();\n\t} catch(e) {\n\t\treturn recover(e);\n\t}\n\tif (result && result.then) {\n\t\treturn result.then(void 0, recover);\n\t}\n\treturn result;\n}\n\n// Asynchronously await a promise and pass the result to a finally continuation\nexport function _finallyRethrows(body, finalizer) {\n\ttry {\n\t\tvar result = body();\n\t} catch (e) {\n\t\treturn finalizer(true, e);\n\t}\n\tif (result && result.then) {\n\t\treturn result.then(finalizer.bind(null, false), finalizer.bind(null, true));\n\t}\n\treturn finalizer(false, result);\n}\n\n// Asynchronously await a promise and invoke a finally continuation that always overrides the result\nexport function _finally(body, finalizer) {\n\ttry {\n\t\tvar result = body();\n\t} catch (e) {\n\t\treturn finalizer();\n\t}\n\tif (result && result.then) {\n\t\treturn result.then(finalizer, finalizer);\n\t}\n\treturn finalizer();\n}\n\n// Rethrow or return a value from a finally continuation\nexport function _rethrow(thrown, value) {\n\tif (thrown)\n\t\tthrow value;\n\treturn value;\n}\n\n// Empty function to implement break and other control flow that ignores asynchronous results\nexport function _empty() {\n}\n\n// Sentinel value for early returns in generators \nexport const _earlyReturn = /*#__PURE__*/ {};\n\n// Asynchronously call a function and send errors to recovery continuation, skipping early returns\nexport function _catchInGenerator(body, recover) {\n\treturn _catch(body, function(e) {\n\t\tif (e === _earlyReturn) {\n\t\t\tthrow e;\n\t\t}\n\t\treturn recover(e);\n\t});\n}\n\n// Asynchronous generator class; accepts the entrypoint of the generator, to which it passes itself when the generator should start\nexport const _AsyncGenerator = /*#__PURE__*/(function() {\n\tfunction _AsyncGenerator(entry) {\n\t\tthis._entry = entry;\n\t\tthis._pact = null;\n\t\tthis._resolve = null;\n\t\tthis._return = null;\n\t\tthis._promise = null;\n\t}\n\n\tfunction _wrapReturnedValue(value) {\n\t\treturn { value: value, done: true };\n\t}\n\tfunction _wrapYieldedValue(value) {\n\t\treturn { value: value, done: false };\n\t}\n\n\t_AsyncGenerator.prototype._yield = function(value) {\n\t\t// Yield the value to the pending next call\n\t\tthis._resolve(value && value.then ? value.then(_wrapYieldedValue) : _wrapYieldedValue(value));\n\t\t// Return a pact for an upcoming next/return/throw call\n\t\treturn this._pact = new _Pact();\n\t};\n\t_AsyncGenerator.prototype.next = function(value) {\n\t\t// Advance the generator, starting it if it has yet to be started\n\t\tconst _this = this;\n\t\treturn _this._promise = new Promise(function (resolve) {\n\t\t\tconst _pact = _this._pact;\n\t\t\tif (_pact === null) {\n\t\t\t\tconst _entry = _this._entry;\n\t\t\t\tif (_entry === null) {\n\t\t\t\t\t// Generator is started, but not awaiting a yield expression\n\t\t\t\t\t// Abandon the next call!\n\t\t\t\t\treturn resolve(_this._promise);\n\t\t\t\t}\n\t\t\t\t// Start the generator\n\t\t\t\t_this._entry = null;\n\t\t\t\t_this._resolve = resolve;\n\t\t\t\tfunction returnValue(value) {\n\t\t\t\t\t_this._resolve(value && value.then ? value.then(_wrapReturnedValue) : _wrapReturnedValue(value));\n\t\t\t\t\t_this._pact = null;\n\t\t\t\t\t_this._resolve = null;\n\t\t\t\t}\n\t\t\t\tvar result = _entry(_this);\n\t\t\t\tif (result && result.then) {\n\t\t\t\t\tresult.then(returnValue, function(error) {\n\t\t\t\t\t\tif (error === _earlyReturn) {\n\t\t\t\t\t\t\treturnValue(_this._return);\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tconst pact = new _Pact();\n\t\t\t\t\t\t\t_this._resolve(pact);\n\t\t\t\t\t\t\t_this._pact = null;\n\t\t\t\t\t\t\t_this._resolve = null;\n\t\t\t\t\t\t\t_resolve(pact, 2, error);\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t} else {\n\t\t\t\t\treturnValue(result);\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\t// Generator is started and a yield expression is pending, settle it\n\t\t\t\t_this._pact = null;\n\t\t\t\t_this._resolve = resolve;\n\t\t\t\t_settle(_pact, 1, value);\n\t\t\t}\n\t\t});\n\t};\n\t_AsyncGenerator.prototype.return = function(value) {\n\t\t// Early return from the generator if started, otherwise abandons the generator\n\t\tconst _this = this;\n\t\treturn _this._promise = new Promise(function (resolve) {\n\t\t\tconst _pact = _this._pact;\n\t\t\tif (_pact === null) {\n\t\t\t\tif (_this._entry === null) {\n\t\t\t\t\t// Generator is started, but not awaiting a yield expression\n\t\t\t\t\t// Abandon the return call!\n\t\t\t\t\treturn resolve(_this._promise);\n\t\t\t\t}\n\t\t\t\t// Generator is not started, abandon it and return the specified value\n\t\t\t\t_this._entry = null;\n\t\t\t\treturn resolve(value && value.then ? value.then(_wrapReturnedValue) : _wrapReturnedValue(value));\n\t\t\t}\n\t\t\t// Settle the yield expression with a rejected \"early return\" value\n\t\t\t_this._return = value;\n\t\t\t_this._resolve = resolve;\n\t\t\t_this._pact = null;\n\t\t\t_settle(_pact, 2, _earlyReturn);\n\t\t});\n\t};\n\t_AsyncGenerator.prototype.throw = function(error) {\n\t\t// Inject an exception into the pending yield expression\n\t\tconst _this = this;\n\t\treturn _this._promise = new Promise(function (resolve, reject) {\n\t\t\tconst _pact = _this._pact;\n\t\t\tif (_pact === null) {\n\t\t\t\tif (_this._entry === null) {\n\t\t\t\t\t// Generator is started, but not awaiting a yield expression\n\t\t\t\t\t// Abandon the throw call!\n\t\t\t\t\treturn resolve(_this._promise);\n\t\t\t\t}\n\t\t\t\t// Generator is not started, abandon it and return a rejected Promise containing the error\n\t\t\t\t_this._entry = null;\n\t\t\t\treturn reject(error);\n\t\t\t}\n\t\t\t// Settle the yield expression with the value as a rejection\n\t\t\t_this._resolve = resolve;\n\t\t\t_this._pact = null;\n\t\t\t_settle(_pact, 2, error);\n\t\t});\n\t};\n\n\t_AsyncGenerator.prototype[_asyncIteratorSymbol] = function() {\n\t\treturn this;\n\t};\n\t\n\treturn _AsyncGenerator;\n})();\n","import React, { useEffect, useState, useRef } from \"react\"\nimport styles from \"./styles.module.css\"\nimport \"@georapbox/resize-observer-element/dist/resize-observer-defined\"\nimport { CapturePhoto } from \"@georapbox/capture-photo-element\"\nimport { BarcodeFormat, BrowserMultiFormatReader } from \"@zxing/library\"\nimport \"barcode-detector\"\n\nCapturePhoto.defineCustomElement()\nconst formats = [\"ean_13\"]\nconst zxingReader = new BrowserMultiFormatReader()\nconst barcodeDetector = new window.BarcodeDetector({ formats })\n\nexport function EanScannerIos({ onResult }) {\n const capturePhotoEl = useRef(null)\n const zoomLevelEl = useRef(null)\n const zoomControls = useRef(null)\n const scanFrameContainer = useRef(null)\n const scanFrameEl = useRef(null)\n const defineScript = useRef(null)\n\n const [capturePhotoVideoEl, setCapturePhotoVideoEl] = useState(null)\n const [scanResult, setScanResult] = useState(null)\n const [prevScannedCode, setPrevScannedCode] = useState(Infinity)\n const [prevScannedTime, setPrevScannedTime] = useState(0)\n const [resetScanIndicator, setResetScanIndicator] = useState(0)\n const [rafId, setRafId] = useState(null)\n const [shouldRepeatScan, setShouldRepeatScan] = useState(true)\n\n useEffect(() => {\n if (!defineScript.current || !capturePhotoEl.current) return\n\n capturePhotoEl.current.addEventListener(\n \"capture-photo:video-play\",\n handleCameraPlay,\n { once: true }\n )\n capturePhotoEl.current.addEventListener(\n \"capture-photo:error\",\n handleCameraError,\n { once: true }\n )\n\n return () => {\n capturePhotoEl.current.removeEventListener(\n \"capture-photo:video-play\",\n handleCameraPlay\n )\n capturePhotoEl.current.removeEventListener(\n \"capture-photo:error\",\n handleCameraError\n )\n }\n }, [defineScript, capturePhotoEl])\n\n const handleCameraPlay = (evt) => {\n const newCapturePhotoVideoEl =\n capturePhotoEl.current.shadowRoot.querySelector(\"video\")\n setCapturePhotoVideoEl(newCapturePhotoVideoEl)\n resizeScanFrame(evt.detail.video)\n scan()\n\n zxingReader.decodeFromVideoDevice(\n 0,\n newCapturePhotoVideoEl,\n (result, err) => {\n if (result && result.format == BarcodeFormat.EAN_13) {\n setScanResult({ ean_code: result.text })\n }\n }\n )\n\n const trackSettings = capturePhotoEl.current.getTrackSettings()\n const trackCapabilities = capturePhotoEl.current.getTrackCapabilities()\n\n if (trackSettings?.zoom && trackCapabilities?.zoom) {\n const minZoom = trackCapabilities?.zoom?.min || 0\n const maxZoom = trackCapabilities?.zoom?.max || 10\n let currentZoom = trackSettings?.zoom || 1\n if (maxZoom >= 2) {\n currentZoom = 2\n }\n capturePhotoEl.current.zoom = currentZoom\n\n zoomControls.current.hidden = false\n zoomLevelEl.current.textContent = currentZoom\n\n zoomControls.current.addEventListener(\"click\", (evt) => {\n const zoomInBtn = evt.target.closest('[data-action=\"zoom-in\"]')\n const zoomOutBtn = evt.target.closest('[data-action=\"zoom-out\"]')\n\n if (zoomInBtn && currentZoom < maxZoom) {\n currentZoom += 0.5\n }\n\n if (zoomOutBtn && currentZoom > minZoom) {\n currentZoom -= 0.5\n }\n\n zoomLevelEl.current.textContent = currentZoom\n\n capturePhotoEl.current.zoom = currentZoom\n })\n }\n }\n\n const handleCameraError = (evt) => {\n const error = evt.detail.error\n\n if (error.name === \"NotFoundError\") {\n // If the browser cannot find all media tracks with the specified types that meet the constraints given.\n return\n }\n\n const errorMessage =\n error.name === \"NotAllowedError\"\n ? \"Permission to use webcam was denied or video Autoplay is disabled. Reload the page to give appropriate permissions to webcam.\"\n : error.message\n\n scanFrameContainer.current.innerHTML = /* html */ `${errorMessage}
`\n }\n\n const resizeScanFrame = (videoEl) => {\n if (!videoEl) {\n return\n }\n\n const rect = videoEl.getBoundingClientRect()\n\n scanFrameEl.current.style.cssText = `width: ${rect.width}px; height: ${rect.height}px`\n }\n\n async function scan() {\n try {\n let barcode = {}\n barcode = await detectBarcode(capturePhotoVideoEl)\n window.cancelAnimationFrame(rafId)\n\n setScanResult({ ean_code: barcode.rawValue })\n } catch (err) {\n // fail quietly\n }\n\n if (shouldRepeatScan) {\n setRafId(window.requestAnimationFrame(() => scan()))\n }\n }\n\n const detectBarcode = (source) => {\n return new Promise((resolve, reject) => {\n barcodeDetector\n .detect(source)\n .then((results) => {\n if (Array.isArray(results) && results.length > 0) {\n resolve(results[0])\n } else {\n reject({\n message: \"Could not detect barcode from provided source.\",\n })\n }\n })\n .catch((err) => {\n reject(err)\n })\n })\n }\n\n useEffect(() => {\n if (!shouldRepeatScan || !scanResult) {\n return\n }\n\n if (resetScanIndicator !== null) {\n window.clearTimeout(resetScanIndicator)\n setResetScanIndicator(null)\n }\n scanFrameEl.current.querySelector(\"path\").style.stroke = \"limegreen\"\n const newResetScanIndicator = window.setTimeout(() => {\n scanFrameEl.current.querySelector(\"path\").style.stroke = \"white\"\n }, 750)\n setResetScanIndicator(newResetScanIndicator)\n\n if (prevScannedCode !== scanResult.ean_code) {\n setPrevScannedCode(scanResult.ean_code)\n setPrevScannedTime(Date.now())\n return\n } else if (Date.now() - prevScannedTime <= 500) {\n return\n }\n setPrevScannedCode(Infinity)\n\n onResult(scanResult.ean_code)\n return\n }, [scanResult])\n\n return (\n \n
\n
\n \n \n\n \n \n Switch camera\n \n\n \n\n \n
\n
\n\n
\n\n
\n
\n
\n \n \n \n\n
\n
\n
\n )\n}\n","import { styled } from \"@mui/material/styles\"\nimport Box from \"@mui/material/Box\"\nimport { TextField } from \"@mui/material\"\n\nconst StyledIcon = styled(Box)(({ theme, color }) => ({\n color: color.toString(),\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n minWidth: 0,\n marginInline: \"auto\",\n \"& svg\": {\n width: \"8rem\",\n height: \"8rem\",\n },\n [theme.breakpoints.down(\"md\")]: {\n minWidth: 0,\n width: \"8rem\",\n height: \"8rem\",\n \"& svg\": {\n width: \"8rem\",\n height: \"8rem\",\n },\n },\n}))\n\nconst StyledTextField = styled(TextField)(({ theme, color }) => ({\n \"& .MuiOutlinedInput-notchedOutline legend\": { display: \"none\" },\n}))\n\nexport { StyledIcon, StyledTextField }\n","import React, { useEffect } from \"react\"\nimport { observer } from \"mobx-react\"\nimport { styled } from \"@mui/system\"\nimport en from \"./locales/en.json\"\nimport { useHistory } from \"react-router-dom\"\nimport { Box, Container, Typography, useTheme } from \"@mui/material\"\nimport ResponsiveBackground from \"components/ResponsiveBackground\"\nimport useScopedTranslation from \"../../hooks/useScopedTranslation\"\nimport ContiSpecificButton from \"components/ContiSpecificButton\"\n// import en from \"./locales/en.json\"\nimport { useTecDocStore } from \"../../api/services/TecDoc\"\nimport { generatePath } from \"react-router-dom\"\nimport { isCloudEnv } from \"utils/env\"\nimport { default as Conti_original } from \"../../assets/images/Continental_Original.png\"\nimport { default as Ate_original } from \"../../assets/images/Ate_Original.jpg\"\n\nimport { default as Conti_vehicle_use } from \"../../assets/images/CONTI_Loyalty_Program_Werbetrailer_sec22.jpg\"\nimport { default as Ate_vehicle_use } from \"../../assets/images/ATE_Loyalty_Program_Werbetrailer_sec22.jpg\"\nimport { basePath, isAte } from \"utils/Global\"\nimport { convertSizeRem, scrolltToTop } from \"utils/util\"\n\n// use this namespace also for subcomponents and for smaller subpages\nexport const namespace = __filename\n\nconst StartScreen = () => {\n const { t } = useScopedTranslation(\n namespace,\n (locale) => import(`./locales/${locale}.json`),\n en\n )\n\n const theme = useTheme()\n const history = useHistory()\n const tecDocStore = useTecDocStore()\n\n const OriginalBackground = styled(\"div\")({\n position: \"relative\",\n width: \"100%\",\n // height: \"100%\",\n height: \"200px\",\n overflow: \"hidden\",\n background: `url(${!isAte ? Conti_original : basePath + Ate_original}) center/cover`,\n \"&:before\": {\n content: \"''\",\n position: \"absolute\",\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n backgroundColor: \"rgba(0, 0, 0, 0.6)\", // Adjust the alpha value (last parameter) for darkness\n filter: \"blur(5px)\",\n // background: `inherit`,\n // zIndex: -1\n },\n })\n\n const VehicleUsageBackground = styled(\"div\")({\n position: \"relative\",\n width: \"100%\",\n // height: \"100%\",\n height: \"200px\",\n overflow: \"hidden\",\n background: `url(${\n !isAte ? Conti_vehicle_use : basePath + Ate_vehicle_use\n }) center/cover`,\n \"&:before\": {\n content: \"''\",\n position: \"absolute\",\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n backgroundColor: \"rgba(0, 0, 0, 0.6)\", // Adjust the alpha value (last parameter) for darkness\n filter: \"blur(5px)\",\n // background: `inherit`,\n // zIndex: -1\n },\n })\n\n const OverlayContent = styled(\"div\")({\n position: \"absolute\",\n display: \"grid\",\n placeItems: \"center\",\n height: \"70%\",\n top: \"50%\",\n left: \"50%\",\n transform: \"translate(-50%, -50%)\",\n textAlign: \"center\",\n // marginTop: \"30px\",\n padding: \"10px\",\n width:\n window.innerWidth > theme.tokens.breakpoints.breakpointTablet\n ? \"280px\"\n : \"100%\",\n })\n\n useEffect(() => {\n const paramGtin = \"gtin\"\n const paramCode = \"code\"\n tecDocStore.reset()\n sessionStorage.clear()\n\n if (isCloudEnv()) {\n const referrerSearchParams = new URLSearchParams(\n new URL(document.referrer).search\n )\n if (\n referrerSearchParams.has(paramGtin) &&\n referrerSearchParams.has(paramCode)\n ) {\n history.push(generatePath(\"/authenticity\"))\n } else {\n console.log(\"does not exist in the referrer URL\")\n }\n } else {\n const url = new URL(window.location.href)\n const queryParams = url.searchParams\n const gtin = queryParams.get(paramGtin)\n const code = queryParams.get(paramCode)\n if (gtin && code) {\n sessionStorage.setItem(\"gtin\", gtin)\n sessionStorage.setItem(\"code\", code)\n history.push(generatePath(\"/authenticity\"))\n } else {\n console.log(\"does not exist in the href URL\")\n }\n }\n scrolltToTop()\n sessionStorage.removeItem(\"productCode\")\n sessionStorage.setItem(\"vasImage\", null)\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n return (\n \n \n \n \n {t(\"subTitle\")}\n \n \n \n \n \n theme.tokens.breakpoints.breakpointTablet\n ? 700\n : 600\n }\n fontSize={convertSizeRem(1.5)}\n color={theme.tokens.color.conti_typo}\n marginBottom=\"10px\"\n marginTop=\"10px\"\n sx={{\n textShadow:\n \"2px 2px 20px rgba(0, 0, 0, 1), -2px -2px 20px rgba(0, 0, 0, 1)\",\n }}\n >\n {t(\"screenText1\")}\n \n \n \n \n \n \n \n \n theme.tokens.breakpoints.breakpointTablet\n ? 700\n : 600\n }\n fontSize={convertSizeRem(1.5)}\n color={theme.tokens.color.conti_typo}\n marginBottom=\"10px\"\n marginTop=\"10px\"\n sx={{\n textShadow:\n \"2px 2px 10px rgba(0, 0, 0, 1), -2px -2px 10px rgba(0, 0, 0, 1)\",\n }}\n >\n {t(\"screenText2\")}\n \n \n \n \n \n \n \n )\n}\n\nexport default observer(StartScreen)\n","export default __webpack_public_path__ + \"static/media/Continental_Original.a81b400a.png\";","export default __webpack_public_path__ + \"static/media/Ate_Original.ccf3c608.jpg\";","import React, { useEffect, useState } from \"react\"\nimport { useHistory, generatePath } from \"react-router-dom\"\nimport InfoOutlinedIcon from \"@mui/icons-material/InfoOutlined\"\n\nimport {\n Box,\n Container,\n FormControl,\n Typography,\n useTheme,\n Link,\n} from \"@mui/material\"\nimport Dialog from \"../../../../components/Dialog\"\n\nimport { default as image_mappcode_2 } from \"../../../../assets/images/image_mappcode_2.png\"\nimport { default as image_mappcode_qr_ean } from \"../../../../assets/images/image_mappcode_qr_ean.png\"\nimport en from \"../../locales/en.json\"\n\nimport ResponsiveBackground from \"components/ResponsiveBackground\"\nimport { observer } from \"mobx-react\"\nimport TextField from \"@mui/material/TextField\"\nimport ContiSpecificButton from \"components/ContiSpecificButton\"\nimport useScopedTranslation from \"hooks/useScopedTranslation\"\nimport BarcodeScannerComponent from \"react-qr-barcode-scanner\"\nimport {\n ateMappCodeQrEan,\n contiMappCode,\n contiMappCodeQrEan,\n isAte,\n isConti,\n} from \"utils/Global\"\nimport { scrolltToTop } from \"utils/util\"\n\n// use this namespace also for subcomponents and for smaller subpages\nexport const namespace = __filename\n\nconst MAPPCodeScreen = () => {\n const { t } = useScopedTranslation(\n namespace,\n (locale) => import(`../../locales/${locale}.json`),\n en\n )\n\n const [data, setData] = React.useState(() =>\n localStorage.getItem(\"data\") ? localStorage.getItem(\"data\") : \"\"\n )\n const theme = useTheme()\n\n const isMobile = window.innerWidth < theme.tokens.breakpoints.breakpointTablet\n\n const [scan, setScan] = React.useState(false)\n const [mappCodeImg, setMapCodeImg] = React.useState(image_mappcode_2)\n const [eanCodeImg, setEanCodeImg] = React.useState(image_mappcode_qr_ean)\n const [show, setShow] = React.useState(false)\n const [error, setError] = React.useState(\"\")\n const [showInfo, setShowInfo] = React.useState(null)\n const [showPlaceholder, setShowPlaceholder] = React.useState(true)\n const [showTextField, setShowTextField] = React.useState(\n !isMobile ? true : false\n )\n\n const history = useHistory()\n\n const [productCode, setProductCode] = useState(\"\")\n const [tempProductCode, setTempProductCode] = useState(\"\")\n\n const handleKeyPress = (e) => {\n if (e.key === \"Enter\") {\n const finalProductCode = tempProductCode ? tempProductCode : productCode\n sessionStorage.setItem(\"productCode\", finalProductCode)\n history.push(\"/authenticity\")\n }\n }\n\n const onClickHandle = () => {\n const finalProductCode = tempProductCode ? tempProductCode : productCode\n sessionStorage.setItem(\"productCode\", finalProductCode)\n history.push(\"/authenticity\")\n }\n\n const redirectLocation = (gtin) => {\n setError(\"\")\n history.push(generatePath(\"/tecdoc\"))\n }\n\n const handleChange = (e) => {\n const inputValue = e.currentTarget.value\n\n if (\n (!inputValue.includes(\"(21)\") && !inputValue.includes(\"(01)\")) ||\n inputValue.length < 13\n ) {\n setTempProductCode(`(01)04068267000184(21)${inputValue}`)\n setProductCode(inputValue)\n } else {\n setProductCode(inputValue)\n }\n }\n\n useEffect(() => {\n if (isAte) {\n setEanCodeImg(ateMappCodeQrEan)\n setMapCodeImg(contiMappCode)\n } else if (isConti) {\n setEanCodeImg(contiMappCodeQrEan)\n setMapCodeImg(contiMappCode)\n } else {\n setEanCodeImg(contiMappCodeQrEan)\n setMapCodeImg(contiMappCode)\n }\n scrolltToTop()\n }, [])\n\n const handleShowInfo = () => {\n setShowInfo(!showInfo)\n }\n\n return (\n \n \n {isMobile ? (\n {t(\"textEtikett\")}\n ) : (\n \n \n {window.innerWidth <\n theme.tokens.breakpoints.breakpointTablet && (\n <>\n \n \n {t(\"mappCodeText\")}\n \n \n \n setScan(true)}\n >\n\n \n >\n )}\n \n \n {window.innerWidth <\n theme.tokens.breakpoints.breakpointTablet ? (\n setShowTextField(!showTextField)}\n color=\"#000\"\n >\n \n {t(\"manualEntry\")}\n \n \n ) : (\n \n {t(\"helpTextTablet\")}\n \n )}\n \n \n theme.tokens.breakpoints.breakpointTablet\n }\n id=\"outlined-basic\"\n variant=\"outlined\"\n placeholder={showPlaceholder ? \"965865841253\" : \"\"}\n value={productCode}\n inputProps={{ min: 0, style: { textAlign: \"center\" } }}\n InputProps={{\n style: {\n margin: \"15px 10px\",\n borderRadius: \"30px\",\n textAlign: \"center\",\n fontFamily: isAte\n ? \"Etelka Light\"\n : \"ContinentalStagSans-Light\",\n fontSize: \"18px\",\n lineHeight: \"26px\",\n letterSpacing: \"3px\",\n width: \"100%\",\n height:\n window.innerWidth <\n theme.tokens.breakpoints.breakpointTablet\n ? \"32px\"\n : undefined,\n backgroundColor: \"#ffff\",\n minWidth: \"250px\",\n },\n }}\n style={{}}\n onChange={handleChange}\n onKeyPress={handleKeyPress}\n onFocus={() => setShowPlaceholder(false)}\n onBlur={() => setShowPlaceholder(true)}\n />\n \n \n \n \n \n \n\n \n \n\n \n \n \n \n {t(\"infoMappCode\")}\n \n \n \n {showInfo && (\n <>\n \n {t(\"exampleLabelText\")}\n \n
\n\n \n {t(\"newLabelText\")}\n \n
\n \n {t(\"olderLabelText\")}\n \n >\n )}\n \n \n \n )}\n \n \n )\n}\n\nexport default observer(MAPPCodeScreen)\n","export default __webpack_public_path__ + \"static/media/image_mappcode_2.ab3e854d.png\";","export default __webpack_public_path__ + \"static/media/image_mappcode_qr_ean.fb8d4b0c.png\";","import React from \"react\"\nimport { debounce } from \"lodash\"\n\nconst useDebouncedSetter = (setter) =>\n React.useMemo(\n () =>\n debounce((value) => {\n setter(value)\n }),\n [setter]\n )\n\nexport default useDebouncedSetter\n","import { PathParams } from \"types/Global\"\n\nexport const validateParams = (\n path: ERoute,\n params: unknown\n): params is PathParams => {\n if (!(params instanceof Object)) return false\n\n const paramSet = new Set(Object.keys(params))\n\n // Validate params\n const requiredParams = path\n .split(\"/\")\n .filter((s) => s.startsWith(\":\"))\n .map((s) => s.substr(1))\n\n for (const param of requiredParams) {\n if (!paramSet.has(param)) return false\n }\n\n return true\n}\n\n// build a valid url with the path and its parameters\nexport const buildUrl = (\n path: ERoute,\n params: PathParams\n): string => {\n let ret: string = path\n\n // Upcast `params` to be used in string replacement.\n const paramObj: { [i: string]: string } = params\n\n for (const key of Object.keys(paramObj)) {\n ret = ret.replace(`:${key}`, paramObj[key])\n }\n\n return ret\n}\n","import React from \"react\"\nimport { Route, Switch, matchPath, useLocation } from \"react-router-dom\"\n\nimport { validateParams } from \"utils/router\"\n\nimport { TRoute, PathParams } from \"types/Global\"\nimport { Box, Fade, Grow, Slide } from \"@mui/material\"\n\ninterface UseMatchedRouteOptions {\n notFoundComponent?: React.FC\n matchOnSubPath?: boolean\n transition?:\n | \"none\"\n | \"fade\"\n | \"grow\"\n | \"slide-up\"\n | \"slide-down\"\n | \"slide-left\"\n | \"slide-right\"\n}\n\nconst useMatchedRoute = (\n routes: ReadonlyArray,\n fallbackComponent?: React.FC,\n options?: UseMatchedRouteOptions\n): {\n route: TRoute\n params: PathParams | null\n MatchedElement: JSX.Element\n} => {\n const {\n notFoundComponent,\n matchOnSubPath,\n transition = \"fade\",\n } = options || {}\n const location = useLocation()\n // `exact`, `sensitive` and `strict` options are set to true\n // to ensure type safety.\n const results = routes\n .map(\n (\n route: TRoute\n ): {\n route: TRoute\n match: any | null\n } => ({\n route,\n match: matchPath(location.pathname, {\n path: route.path,\n sensitive: !matchOnSubPath,\n }),\n })\n )\n .filter(({ match }) => !!match && (matchOnSubPath ? true : match.isExact))\n const [firstResult] = results\n const { match, route } = firstResult || {}\n const Fallback = fallbackComponent\n const NotFound = notFoundComponent || (() => <>not found>)\n\n const Transition: React.FC<{ match: any }> = React.useMemo(() => {\n if (transition === \"fade\") {\n const FadeTransition: React.FC<{ match: any }> = ({\n children,\n match,\n }) => (\n \n {children}\n \n )\n\n return FadeTransition\n }\n\n if (transition === \"grow\") {\n const GrowTransition: React.FC<{ match: any }> = ({\n children,\n match,\n }) => (\n \n {children}\n \n )\n\n return GrowTransition\n }\n\n if (transition.startsWith(\"slide\")) {\n const [, direction] = transition.split(\"-\")\n const SlideTransition: React.FC<{ match: any }> = ({\n children,\n match,\n }) => (\n \n {children}\n \n )\n\n return SlideTransition\n }\n return (({ children }) => children) as React.FC<{ match: any }>\n }, [transition])\n return {\n route: route,\n params:\n match && validateParams(route.path, match.params) ? match.params : {},\n MatchedElement: (\n \n {matchOnSubPath &&\n routes.map(({ path, Component: RouteComponent }, i) => (\n \n {({ match }) => (\n \n \n \n )}\n \n ))}\n {routes.map(({ path, Component: RouteComponent }, i) => (\n \n {({ match }) => (\n \n \n \n )}\n \n ))}\n {Fallback && (\n \n \n \n )}\n {!Fallback && (\n \n \n \n )}\n \n ),\n }\n}\n\nexport default useMatchedRoute\n","import { styled } from \"@mui/material/styles\"\nimport { Button } from \"@mui/material\"\n\nexport const StyledButton = styled(Button)(({ theme }) => ({\n margin: theme.spacing(0.5),\n textTransform: 'none',\n [theme.breakpoints.down(\"md\")]: {\n fontSize: theme.spacing(1.6)\n },\n}))\n","import { StyledButton } from \"./styles\"\nimport { Box } from \"@mui/material\"\nimport React, { useCallback } from \"react\"\nimport { ButtonProps } from \"./types\"\nimport { generatePath, useHistory } from \"react-router-dom\"\n\nconst Button: React.FC = (props) => {\n const { hidden, text, color, path, isDisabled, type, onClick } = props\n const history = useHistory()\n\n const handleClick = useCallback(() => {\n if (isDisabled || type !== undefined) {\n return\n } else if (path.includes(\"http\")) {\n const win = window.open(path, \"_blank\")\n if (win != null) {\n win.focus()\n }\n } else if (path?.length > 0) {\n history.push(generatePath(path))\n }\n }, [history, path, isDisabled, type])\n\n const buttonColor = () => {\n if (isDisabled) {\n return \"info\"\n } else {\n return color ? color : \"primary\"\n }\n }\n\n return (\n \n \n \n {text}\n \n
\n \n )\n}\n\nexport default Button\n","import React, { useEffect, useState } from \"react\"\nimport { Box, Container } from \"@mui/material\"\nimport Tabs from \"../components/Tabs/Tabs\"\nimport { mdiCar, mdiWeb } from \"@mdi/js\"\nimport CountrySelection from \"../components/CountrySelection\"\nimport VehicleSelection from \"./subpages/VehicleSelection\"\nimport Button from \"../../../components/Button\"\nimport { useTranslation } from \"react-i18next\"\nimport ResponsiveBackground from \"../../../components/ResponsiveBackground\"\nimport { useTheme } from \"@mui/material/styles\"\n\nconst TecRMI = (props) => {\n const [isHomeSelected, setIsHomeSelected] = useState(false)\n const { t } = useTranslation(\"app\")\n const theme = useTheme()\n\n const [step, setStep] = useState(0)\n\n useEffect(() => {\n if (isHomeSelected) setIsHomeSelected(false)\n }, [isHomeSelected])\n\n function backToHome() {\n setIsHomeSelected(true)\n }\n\n const handleStep = (value) => {\n setStep(step + value)\n }\n\n return (\n \n \n ,\n hasPadding: true,\n },\n {\n element: ,\n hasPadding: true,\n },\n ]}\n variant={\"horizontal\"}\n />\n {step === 0 ? (\n \n ) : (\n handleStep(-1)}>\n \n \n )}\n \n \n )\n}\n\nexport default TecRMI\n","import { ERoute, TRoute } from \"types/Global\"\nimport AuthenticityCheck from \"./AuthenticityCheck\"\nimport TecDoc from \"./ComplexVAS/TecDoc/TecDoc\"\nimport TecRMI from \"./ComplexVAS/TecRMI/TecRMI\"\nimport CounterfeitReport from \"./ComplexVAS/CounterfeitReport/CounterfeitReport\"\nimport SecondScan from \"./ComplexVAS/SecondScan/SecondScan\"\nimport StartScreen from \"./StartScreen\"\nimport MAPPCodeScreen from \"./StartScreen/subpages/MAPPCodeScreen\"\n\nexport const routes: TRoute[] = [\n {\n path: ERoute.ROOT,\n Component: StartScreen,\n },\n {\n path: ERoute.MAPPCodeScreen,\n Component: MAPPCodeScreen,\n },\n {\n path: ERoute.AUTHENTICITY_CHECK,\n Component: AuthenticityCheck,\n },\n {\n path: ERoute.COUNTERFEIT,\n Component: CounterfeitReport,\n },\n {\n path: ERoute.SECONDSCAN,\n Component: SecondScan,\n },\n {\n path: ERoute.TECDOC,\n Component: TecDoc,\n },\n {\n path: ERoute.TECRMI,\n Component: TecRMI,\n },\n]\n","import { styled } from \"@mui/material/styles\"\nimport { Typography } from \"@mui/material\"\n\nexport const StyledLink = styled(Typography)(({ theme, variant }) => ({\n textDecoration: \"none\",\n color: theme.tokens.color.link,\n \"&:hover\": {\n textDecoration: \"underline\",\n color: theme.palette.primary.main,\n cursor: \"pointer\",\n },\n \"&:active\": {\n color: theme.palette.primary.main,\n textDecoration: \"underline\",\n },\n [theme.breakpoints.down(\"md\")]: {\n fontSize:\n variant === \"body1\" ? \"0.8rem\" : variant === \"body2\" ? \" 0.5rem\" : \"1rem\",\n },\n [theme.breakpoints.up(\"md\")]: {\n fontSize:\n variant === \"body1\" ? \"1rem\" : variant === \"body2\" ? \" 0.875rem\" : \"1rem\",\n },\n}))\n","import { StyledLink } from \"./styles\"\nimport { Box } from \"@mui/material\"\nimport React, { useCallback } from \"react\"\nimport { LinkProps } from \"./types\"\nimport { generatePath, useHistory } from \"react-router-dom\"\nimport { useTheme } from \"@mui/material/styles\"\nimport { TypographyProps } from \"@mui/material/Typography/Typography\"\n\nconst Link: React.FC = (props) => {\n const { text, path, variant } = props\n const history = useHistory()\n const theme = useTheme()\n\n const handleClick = useCallback(() => {\n if (path.includes(\"http\") || path.includes(\"mailto\")) {\n window.open(path, '_blank').focus();\n } else {\n history.push(generatePath(path))\n }\n }, [history, path])\n\n return (\n \n \n {text}\n \n \n )\n}\n\nexport default Link\n","import ArrowBackOutlinedIcon from \"@mui/icons-material/ArrowBackOutlined\"\nimport { AppBar, Box, Divider, Toolbar, Typography } from \"@mui/material\"\nimport React from \"react\"\nimport { useHistory } from \"react-router-dom\"\nimport { useTecDocStore } from \"../../api/services/TecDoc\"\nimport { TopBarProps } from \"./types\"\nimport { isAte } from \"utils/Global\"\nimport { scrolltToTop } from \"utils/util\"\n\nconst TopBar: React.FC = (props) => {\n const [topMargin, setTopMargin] = React.useState(0)\n\n const { title } = props\n const history = useHistory()\n\n const tecDocStore = useTecDocStore()\n\n const handleOnClick = () => {\n const { pathname } = history.location\n\n switch (pathname) {\n case \"/scan\":\n history.push(\"/\")\n break\n case \"/tecdoc\":\n history.goBack()\n tecDocStore.reset()\n break\n case \"/authenticity\":\n history.push(\"/mappcodescreen\")\n break\n default:\n history.goBack()\n break\n }\n scrolltToTop()\n }\n\n React.useEffect(() => {\n const mainNav = document.querySelector(\".main-navigation\") as HTMLElement\n const metaNav = document.querySelector(\".meta-navigation\") as HTMLElement\n const ateMetaNav = document.getElementById(\"meta-bar\") as HTMLElement\n const ateLogoMetaNavBar = document.getElementById(\"nav-bar\") as HTMLElement\n\n const ateLogoMetaNav = document.getElementById(\"logo\") as HTMLElement\n\n if (mainNav && metaNav) {\n const mainNavHeight = mainNav.offsetHeight\n const metaNavHeight = metaNav.offsetHeight\n setTopMargin(mainNavHeight + metaNavHeight)\n }\n if (isAte && ateMetaNav) {\n const ateMainNavheight = ateMetaNav.offsetHeight\n const top = ateMetaNav.getBoundingClientRect().top\n if (ateLogoMetaNavBar) {\n const logoHeight = ateLogoMetaNavBar.offsetHeight\n const top = ateLogoMetaNavBar.getBoundingClientRect().top\n setTopMargin(logoHeight + top)\n \n }\n else if (ateLogoMetaNav) {\n const logoHeight = ateLogoMetaNav.offsetHeight\n if (logoHeight > ateMetaNav.offsetHeight) {\n setTopMargin(logoHeight + top)\n }\n } else {\n setTopMargin(ateMainNavheight + top)\n }\n }\n }, [])\n\n const validPaths = [\n \"/authenticity\",\n \"/scan\",\n \"/tecdoc\",\n \"/mappcodescreen\",\n \"/report\",\n ]\n\n return (\n \n \n {validPaths.includes(history.location.pathname) && (\n <>\n \n \n >\n )}\n {validPaths.includes(history.location.pathname) && (\n \n )}\n {title}\n \n \n )\n}\nexport default TopBar\n","import { ListTextItemTypes } from \"./components/List\"\n\nexport const createItemBorder = (array: ListTextItemTypes[]) => {\n if (array.length > 0) {\n array.map((item, index) => {\n return (item.hasBorder = array.length - 1 !== index)\n })\n }\n return array\n\n}\n\nexport const groupListByValue = (list, value) => {\n const groupedList: { key: [] } = Object()\n list.forEach((item) => {\n if (item[value] in groupedList) {\n groupedList[item[value]].push(item)\n } else {\n groupedList[item[value]] = [item]\n }\n })\n return groupedList\n}\n\nexport function uniq(a) {\n let seen = {}\n return a.filter(function (item) {\n return seen.hasOwnProperty(item.key) ? false : (seen[item.key] = true)\n })\n}\n\nexport const getDate = (from, to) => {\n let fromString =\n from.toString().slice(4, 6) + \".\" + from.toString().slice(0, 4)\n let toString = \"\"\n\n if (to !== undefined) {\n toString =\n \" - \" + to.toString().slice(4, 6) + \".\" + to.toString().slice(0, 4)\n }\n return fromString + toString\n}\n\nexport const getDateSingle = (date) => {\n return date.toString().slice(4, 6) + \".\" + date.toString().slice(0, 4)\n}\n\nexport const isValidUrl = (string) => {\n\n const expression = /[-a-zA-Z0-9@:%._~#=]{1,256}\\.[a-zA-Z0-9()]{1,6}\\b([-a-zA-Z0-9()@:%_.~#?&/=]*)?/gi;\n const urlRegex = new RegExp(expression)\n const dateRegex = new RegExp('^(0[1-9]|1[0-2])\\\\.[0-9]{4}( - (0[1-9]|1[0-2])\\\\.[0-9]{4})?$')\n const numberRegex = new RegExp('^(\\\\d+(\\\\.\\\\d+)*(-\\\\d+(\\\\.\\\\d+)*)*)$')\n if (string.match(dateRegex) !== null || string.match(numberRegex) !== null) {\n return false\n }\n\n return string.match(urlRegex) !== null\n}\n","import { isAte } from \"utils/Global\"\nimport \"../../App.css\"\nimport { getVariableColor } from \"../util\"\nexport interface OsapiensColors {\n primary: string\n secondary: string\n success: string\n warning: string\n error: string\n info: string\n grey: string\n link: string\n lighten0: string\n lighten1: string\n lighten2: string\n lighten3: string\n lighten4: string\n lighten5: string\n lighten6: string\n darken0: string\n darken1: string\n darken2: string\n darken3: string\n darken4: string\n darken5: string\n darken6: string\n conti_yellow: string\n conti_typo: string\n conti_typo_button: string\n ate_blue: string\n}\n\nexport interface OsapiensFont {\n fontFamily: string\n fontStyle: string\n fontDisplay: string\n fontWeight: number\n src: string\n}\nexport interface ContiFont {\n fontFamily: string\n fontStyle: string\n fontDisplay: string\n fontWeight: number\n fontWeight_heavy: string\n src: string\n fontSize_C_H: string\n}\n\nexport interface OsapiensThemeTokens {\n style: {\n radius: number\n }\n color: OsapiensColors\n breakpoints: {\n breakpointXs: number\n breakpointSm: number\n breakpointMd: number\n breakpointLg: number\n breakpointXl: number\n breakpointMobile: number\n breakpointTablet: number\n breakpointLaptop: number\n breakpointDesktop: number\n }\n fonts: OsapiensFont[]\n fonts_Conti: ContiFont\n images: {\n background: string\n }\n tabbedHeader: {\n height: string\n }\n header: {\n height: string\n }\n}\n\nexport const colors: OsapiensColors = {\n primary: !(isAte) ? \"#FEA500\" : \"#005CA9\",\n secondary: !(isAte) ? \"#FEA500\" : \"#005CA9\",\n success: \"#90c62c\",\n warning: \"#eebf00\",\n error: \"#d55342\",\n info: \"#e0e0e0\",\n grey: \"rgba(51,51,51,0.7)\",\n link: \"#039be5\",\n lighten0: \"rgba(255, 255, 255, 0.03)\",\n lighten1: \"rgba(255, 255, 255, 0.05)\",\n lighten2: \"rgba(255, 255, 255, 0.12)\",\n lighten3: \"rgba(255, 255, 255, 0.24)\",\n lighten4: \"rgba(255, 255, 255, 0.38)\",\n lighten5: \"rgba(255, 255, 255, 0.5)\",\n lighten6: \"rgba(255, 255, 255, 0.85)\",\n darken0: \"rgba(0, 0, 0, 0.03)\",\n darken1: \"rgba(0, 0, 0, 0.07)\",\n darken2: \"rgba(0, 0, 0, 0.12)\",\n darken3: \"rgba(0, 0, 0, 0.24)\",\n darken4: \"rgba(0, 0, 0, 0.38)\",\n darken5: \"rgba(0, 0, 0, 0.5)\",\n darken6: \"rgba(0, 0, 0, 0.85)\",\n conti_yellow: \"#FEA500\",\n conti_typo: \"#FFFFFF\",\n conti_typo_button: \"#000000\",\n ate_blue: \"#005CA9\",\n}\n\nexport const fonts: OsapiensFont[] = [\n {\n fontFamily: \"FreeMono, monospace\",\n fontStyle: \"normal\",\n fontDisplay: \"swap\",\n fontWeight: 400,\n // eslint-disable-next-line\n src: `url(${require(\"!!url-loader!@mdi/font/fonts/materialdesignicons-webfont.woff2\")}) format('woff2')`,\n },\n]\nexport const fonts_Conti: ContiFont = {\n fontFamily: \"FreeMono, monospace\",\n fontStyle: \"normal\",\n fontDisplay: \"swap\",\n fontWeight: 400,\n fontWeight_heavy: \"600\",\n fontSize_C_H: \"18px\",\n // eslint-disable-next-line\n src: `url(${require(\"!!url-loader!@mdi/font/fonts/materialdesignicons-webfont.woff2\")}) format('woff2')`,\n}\n\nexport const tokens: OsapiensThemeTokens = {\n color: colors,\n style: {\n radius: 4,\n },\n breakpoints: {\n breakpointXs: 0,\n breakpointSm: 600,\n breakpointMd: 960,\n breakpointLg: 1280,\n breakpointXl: 1920,\n breakpointMobile: 340,\n breakpointTablet: 640,\n breakpointLaptop: 800,\n breakpointDesktop: 1024,\n },\n fonts,\n fonts_Conti: fonts_Conti,\n images: {\n background: \"transparent\", // require(\"!!url-loader!./assets/background-pattern.svg\"),\n },\n tabbedHeader: {\n height: \"80px\",\n },\n header: {\n height: \"0px\",\n },\n}\n\nexport default tokens\n","var map = {\n\t\"./App/index.tsx\": 680,\n\t\"./AuthenticityCheck/index.tsx\": 315,\n\t\"./CounterfeitReport/index.tsx\": 681,\n\t\"./TecDoc/index.tsx\": 61,\n\t\"./TecRMI/index.tsx\": 682,\n\t\"./User/index.tsx\": 314,\n\t\"./ValueAddedService/index.tsx\": 683\n};\n\n\nfunction webpackContext(req) {\n\tvar id = webpackContextResolve(req);\n\treturn __webpack_require__(id);\n}\nfunction webpackContextResolve(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\te.code = 'MODULE_NOT_FOUND';\n\t\tthrow e;\n\t}\n\treturn map[req];\n}\nwebpackContext.keys = function webpackContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackContext.resolve = webpackContextResolve;\nmodule.exports = webpackContext;\nwebpackContext.id = 479;","var map = {\n\t\"./de.json\": [\n\t\t699,\n\t\t3\n\t],\n\t\"./en.json\": [\n\t\t301\n\t],\n\t\"./es.json\": [\n\t\t700,\n\t\t4\n\t],\n\t\"./fr.json\": [\n\t\t701,\n\t\t5\n\t],\n\t\"./it.json\": [\n\t\t702,\n\t\t6\n\t],\n\t\"./ko.json\": [\n\t\t703,\n\t\t7\n\t],\n\t\"./pl.json\": [\n\t\t704,\n\t\t8\n\t],\n\t\"./pt.json\": [\n\t\t705,\n\t\t9\n\t],\n\t\"./ro.json\": [\n\t\t706,\n\t\t10\n\t],\n\t\"./tr.json\": [\n\t\t707,\n\t\t11\n\t],\n\t\"./zh.json\": [\n\t\t708,\n\t\t12\n\t]\n};\nfunction webpackAsyncContext(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\treturn Promise.resolve().then(function() {\n\t\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\t\te.code = 'MODULE_NOT_FOUND';\n\t\t\tthrow e;\n\t\t});\n\t}\n\n\tvar ids = map[req], id = ids[0];\n\treturn Promise.all(ids.slice(1).map(__webpack_require__.e)).then(function() {\n\t\treturn __webpack_require__.t(id, 3);\n\t});\n}\nwebpackAsyncContext.keys = function webpackAsyncContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackAsyncContext.id = 495;\nmodule.exports = webpackAsyncContext;","var map = {\n\t\"./de.json\": [\n\t\t709,\n\t\t35\n\t],\n\t\"./en.json\": [\n\t\t302\n\t],\n\t\"./es.json\": [\n\t\t710,\n\t\t36\n\t],\n\t\"./fr.json\": [\n\t\t711,\n\t\t37\n\t],\n\t\"./it.json\": [\n\t\t712,\n\t\t38\n\t]\n};\nfunction webpackAsyncContext(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\treturn Promise.resolve().then(function() {\n\t\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\t\te.code = 'MODULE_NOT_FOUND';\n\t\t\tthrow e;\n\t\t});\n\t}\n\n\tvar ids = map[req], id = ids[0];\n\treturn Promise.all(ids.slice(1).map(__webpack_require__.e)).then(function() {\n\t\treturn __webpack_require__.t(id, 3);\n\t});\n}\nwebpackAsyncContext.keys = function webpackAsyncContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackAsyncContext.id = 497;\nmodule.exports = webpackAsyncContext;","var map = {\n\t\"./de.json\": [\n\t\t713,\n\t\t47\n\t],\n\t\"./en.json\": [\n\t\t303\n\t],\n\t\"./es.json\": [\n\t\t714,\n\t\t48\n\t],\n\t\"./fr.json\": [\n\t\t715,\n\t\t49\n\t],\n\t\"./it.json\": [\n\t\t716,\n\t\t50\n\t]\n};\nfunction webpackAsyncContext(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\treturn Promise.resolve().then(function() {\n\t\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\t\te.code = 'MODULE_NOT_FOUND';\n\t\t\tthrow e;\n\t\t});\n\t}\n\n\tvar ids = map[req], id = ids[0];\n\treturn Promise.all(ids.slice(1).map(__webpack_require__.e)).then(function() {\n\t\treturn __webpack_require__.t(id, 3);\n\t});\n}\nwebpackAsyncContext.keys = function webpackAsyncContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackAsyncContext.id = 498;\nmodule.exports = webpackAsyncContext;","var map = {\n\t\"./de.json\": [\n\t\t717,\n\t\t39\n\t],\n\t\"./en.json\": [\n\t\t304\n\t],\n\t\"./es.json\": [\n\t\t718,\n\t\t40\n\t],\n\t\"./fr.json\": [\n\t\t719,\n\t\t41\n\t],\n\t\"./it.json\": [\n\t\t720,\n\t\t42\n\t]\n};\nfunction webpackAsyncContext(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\treturn Promise.resolve().then(function() {\n\t\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\t\te.code = 'MODULE_NOT_FOUND';\n\t\t\tthrow e;\n\t\t});\n\t}\n\n\tvar ids = map[req], id = ids[0];\n\treturn Promise.all(ids.slice(1).map(__webpack_require__.e)).then(function() {\n\t\treturn __webpack_require__.t(id, 3);\n\t});\n}\nwebpackAsyncContext.keys = function webpackAsyncContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackAsyncContext.id = 499;\nmodule.exports = webpackAsyncContext;","var map = {\n\t\"./de.json\": [\n\t\t721,\n\t\t31\n\t],\n\t\"./en.json\": [\n\t\t305\n\t],\n\t\"./es.json\": [\n\t\t722,\n\t\t32\n\t],\n\t\"./fr.json\": [\n\t\t723,\n\t\t33\n\t],\n\t\"./it.json\": [\n\t\t724,\n\t\t34\n\t]\n};\nfunction webpackAsyncContext(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\treturn Promise.resolve().then(function() {\n\t\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\t\te.code = 'MODULE_NOT_FOUND';\n\t\t\tthrow e;\n\t\t});\n\t}\n\n\tvar ids = map[req], id = ids[0];\n\treturn Promise.all(ids.slice(1).map(__webpack_require__.e)).then(function() {\n\t\treturn __webpack_require__.t(id, 3);\n\t});\n}\nwebpackAsyncContext.keys = function webpackAsyncContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackAsyncContext.id = 500;\nmodule.exports = webpackAsyncContext;","var map = {\n\t\"./de.json\": [\n\t\t725,\n\t\t43\n\t],\n\t\"./en.json\": [\n\t\t306\n\t],\n\t\"./es.json\": [\n\t\t726,\n\t\t44\n\t],\n\t\"./fr.json\": [\n\t\t727,\n\t\t45\n\t],\n\t\"./it.json\": [\n\t\t728,\n\t\t46\n\t]\n};\nfunction webpackAsyncContext(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\treturn Promise.resolve().then(function() {\n\t\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\t\te.code = 'MODULE_NOT_FOUND';\n\t\t\tthrow e;\n\t\t});\n\t}\n\n\tvar ids = map[req], id = ids[0];\n\treturn Promise.all(ids.slice(1).map(__webpack_require__.e)).then(function() {\n\t\treturn __webpack_require__.t(id, 3);\n\t});\n}\nwebpackAsyncContext.keys = function webpackAsyncContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackAsyncContext.id = 501;\nmodule.exports = webpackAsyncContext;","var map = {\n\t\"./de.json\": [\n\t\t729,\n\t\t55\n\t],\n\t\"./en.json\": [\n\t\t307\n\t],\n\t\"./es.json\": [\n\t\t730,\n\t\t56\n\t],\n\t\"./fr.json\": [\n\t\t731,\n\t\t57\n\t],\n\t\"./it.json\": [\n\t\t732,\n\t\t58\n\t]\n};\nfunction webpackAsyncContext(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\treturn Promise.resolve().then(function() {\n\t\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\t\te.code = 'MODULE_NOT_FOUND';\n\t\t\tthrow e;\n\t\t});\n\t}\n\n\tvar ids = map[req], id = ids[0];\n\treturn Promise.all(ids.slice(1).map(__webpack_require__.e)).then(function() {\n\t\treturn __webpack_require__.t(id, 3);\n\t});\n}\nwebpackAsyncContext.keys = function webpackAsyncContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackAsyncContext.id = 502;\nmodule.exports = webpackAsyncContext;","var map = {\n\t\"./de.json\": [\n\t\t733,\n\t\t27\n\t],\n\t\"./en.json\": [\n\t\t308\n\t],\n\t\"./es.json\": [\n\t\t734,\n\t\t28\n\t],\n\t\"./fr.json\": [\n\t\t735,\n\t\t29\n\t],\n\t\"./it.json\": [\n\t\t736,\n\t\t30\n\t]\n};\nfunction webpackAsyncContext(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\treturn Promise.resolve().then(function() {\n\t\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\t\te.code = 'MODULE_NOT_FOUND';\n\t\t\tthrow e;\n\t\t});\n\t}\n\n\tvar ids = map[req], id = ids[0];\n\treturn Promise.all(ids.slice(1).map(__webpack_require__.e)).then(function() {\n\t\treturn __webpack_require__.t(id, 3);\n\t});\n}\nwebpackAsyncContext.keys = function webpackAsyncContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackAsyncContext.id = 503;\nmodule.exports = webpackAsyncContext;","var map = {\n\t\"./de.json\": [\n\t\t737,\n\t\t51\n\t],\n\t\"./en.json\": [\n\t\t309\n\t],\n\t\"./es.json\": [\n\t\t738,\n\t\t52\n\t],\n\t\"./fr.json\": [\n\t\t739,\n\t\t53\n\t],\n\t\"./it.json\": [\n\t\t740,\n\t\t54\n\t]\n};\nfunction webpackAsyncContext(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\treturn Promise.resolve().then(function() {\n\t\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\t\te.code = 'MODULE_NOT_FOUND';\n\t\t\tthrow e;\n\t\t});\n\t}\n\n\tvar ids = map[req], id = ids[0];\n\treturn Promise.all(ids.slice(1).map(__webpack_require__.e)).then(function() {\n\t\treturn __webpack_require__.t(id, 3);\n\t});\n}\nwebpackAsyncContext.keys = function webpackAsyncContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackAsyncContext.id = 504;\nmodule.exports = webpackAsyncContext;","var map = {\n\t\"./de.json\": [\n\t\t741,\n\t\t13\n\t],\n\t\"./en.json\": [\n\t\t310\n\t],\n\t\"./es.json\": [\n\t\t742,\n\t\t14\n\t],\n\t\"./fr.json\": [\n\t\t743,\n\t\t15\n\t],\n\t\"./it.json\": [\n\t\t744,\n\t\t16\n\t],\n\t\"./ko.json\": [\n\t\t745,\n\t\t17\n\t],\n\t\"./pl.json\": [\n\t\t746,\n\t\t18\n\t],\n\t\"./pt.json\": [\n\t\t747,\n\t\t19\n\t],\n\t\"./ro.json\": [\n\t\t748,\n\t\t20\n\t],\n\t\"./tr.json\": [\n\t\t749,\n\t\t21\n\t],\n\t\"./zh.json\": [\n\t\t750,\n\t\t22\n\t]\n};\nfunction webpackAsyncContext(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\treturn Promise.resolve().then(function() {\n\t\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\t\te.code = 'MODULE_NOT_FOUND';\n\t\t\tthrow e;\n\t\t});\n\t}\n\n\tvar ids = map[req], id = ids[0];\n\treturn Promise.all(ids.slice(1).map(__webpack_require__.e)).then(function() {\n\t\treturn __webpack_require__.t(id, 3);\n\t});\n}\nwebpackAsyncContext.keys = function webpackAsyncContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackAsyncContext.id = 505;\nmodule.exports = webpackAsyncContext;","var map = {\n\t\"./de.json\": [\n\t\t751,\n\t\t23\n\t],\n\t\"./en.json\": [\n\t\t312\n\t],\n\t\"./es.json\": [\n\t\t752,\n\t\t24\n\t],\n\t\"./fr.json\": [\n\t\t753,\n\t\t25\n\t],\n\t\"./it.json\": [\n\t\t754,\n\t\t26\n\t]\n};\nfunction webpackAsyncContext(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\treturn Promise.resolve().then(function() {\n\t\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\t\te.code = 'MODULE_NOT_FOUND';\n\t\t\tthrow e;\n\t\t});\n\t}\n\n\tvar ids = map[req], id = ids[0];\n\treturn Promise.all(ids.slice(1).map(__webpack_require__.e)).then(function() {\n\t\treturn __webpack_require__.t(id, 3);\n\t});\n}\nwebpackAsyncContext.keys = function webpackAsyncContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackAsyncContext.id = 511;\nmodule.exports = webpackAsyncContext;","import i18next from \"i18next\"\nimport React from \"react\"\nimport { useTranslation } from \"react-i18next\"\n\nconst useScopedTranslation = (\n namespace: string,\n lazyLoadLocales: (locale) => Promise,\n defaultTranslations: any,\n defaultLanguage: string = \"en\"\n) => {\n const { t, i18n } = useTranslation(namespace)\n // load new translations on language switch\n React.useEffect(() => {\n // load default language directly\n if (!i18next.hasResourceBundle(defaultLanguage, namespace)) {\n i18next.addResourceBundle(defaultLanguage, namespace, defaultTranslations)\n }\n // lazy load foreign language on demand\n if (!i18next.hasResourceBundle(i18n.language, namespace)) {\n lazyLoadLocales(i18n.language).then((translations) => {\n i18next.addResourceBundle(i18n.language, namespace, translations)\n })\n }\n }, [\n t,\n i18n.language,\n defaultLanguage,\n namespace,\n defaultTranslations,\n lazyLoadLocales,\n ])\n\n return { t, i18n }\n}\n\nexport default useScopedTranslation\n","import { isAte } from \"utils/Global\"\n\nexport const isUndefined = (value) => {\n return typeof value === \"undefined\"\n}\n\nexport const scrolltToTop = () => {\n scrollToPos()\n setTimeout(() => {\n scrollToPos()\n }, 100)\n}\n\nconst scrollToPos = () => {\n const scrollAnchor = document.getElementById(\"scroll_anchor\")\n\n let topPos = 0\n let titleTop = 0\n\n const mainNav = document.querySelector(\".main-navigation\") as HTMLElement\n const metaNav = document.querySelector(\".meta-navigation\") as HTMLElement\n const ateMetaNav = document.getElementById(\"meta-bar\") as HTMLElement\n const ateLogoMetaNav = document.getElementById(\"logo\") as HTMLElement\n const ateLogoMetaNavBar = document.getElementById(\"nav-bar\") as HTMLElement\n\n if (mainNav && metaNav) {\n const mainNavHeight = mainNav.offsetHeight\n const metaNavHeight = metaNav.offsetHeight\n topPos = mainNavHeight + metaNavHeight\n }\n if (isAte && ateMetaNav) {\n const top = ateMetaNav.getBoundingClientRect().top\n const metaNavTop = ateMetaNav.offsetHeight + top\n let logoNavTop = 0\n let navBarTop = 0\n\n if (ateLogoMetaNav) {\n const logoHeight = ateLogoMetaNav.offsetHeight\n if (logoHeight > ateMetaNav.offsetHeight) {\n logoNavTop = logoHeight + top\n }\n }\n if (ateLogoMetaNavBar) {\n const logoHeight = ateLogoMetaNavBar.offsetHeight\n navBarTop = logoHeight + ateLogoMetaNavBar.getBoundingClientRect().top\n }\n topPos = Math.max(topPos, metaNavTop, logoNavTop, navBarTop)\n }\n\n let anchorTop = scrollAnchor.getBoundingClientRect().top\n if (anchorTop < 0) {\n anchorTop = 0\n }\n if (scrollAnchor) {\n let scrollAnchorTop = scrollAnchor.getBoundingClientRect().top\n scrollAnchorTop = scrollAnchorTop < 0 ? scrollAnchorTop : 0\n const scrollPos =\n window.scrollY + scrollAnchorTop + titleTop - topPos + anchorTop - 3\n window.scrollTo({ top: scrollPos, behavior: \"smooth\" })\n }\n}\n\nexport const convertSizeRem = (size) => {\n if (isAte) {\n return size * 1.5 + \"rem\"\n }\n return size + \"rem\"\n}\n","import { makeAutoObservable, runInAction } from \"mobx\"\nimport {\n ActionError,\n ActionResultStatus,\n ActionSuccess,\n QueryResponse,\n} from \"types/Global\"\nimport { resultOrError } from \"../../../utils/Global\"\nimport { APIMethods, call } from \"api/CloudAPI\"\nimport {\n ArticleAttributes,\n ArticleDocuments,\n ArticleInfo,\n BrandDetails,\n CountryInfo,\n DirectArticle,\n EanNumber,\n OENumber,\n ReplacedNumber,\n UsageNumber,\n VehicleDetails,\n VehicleImmediateAttributs,\n VehicleLink,\n} from \"../../../types/BusinessObjects\"\n\nclass TecDocStore {\n loadingCountryList = false\n countryList: CountryInfo[] = null\n\n loadingArticleList = false\n articleList: ArticleInfo = null\n\n loadingBrandDetails = false\n brandDetails: BrandDetails = null\n\n dynamicIpAdded = false\n\n loadingArticleDetailsList = false\n articleAttributes: ArticleAttributes = null\n directArticle: DirectArticle = null\n usageNumber: UsageNumber = null\n eanNumber: EanNumber = null\n oeNumber: OENumber[] = null\n articleDocuments: ArticleDocuments[] = null\n replacedNumber: ReplacedNumber = null\n\n loadingVehicleList = false\n vehicleList: VehicleLink[] = null\n\n loadingVehicleImmediateAttributs = false\n vehicleListImmediateAttributs: VehicleImmediateAttributs[] = null\n\n loadingVehicleDetailsList = false\n vehicleDetailsList: VehicleDetails[] = null\n\n // init function\n constructor() {\n makeAutoObservable(this)\n }\n reset() {\n this.loadingCountryList = false;\n this.countryList = null;\n\n this.loadingArticleList = false;\n this.articleList = null;\n\n this.loadingBrandDetails = false;\n this.brandDetails = null;\n\n this.dynamicIpAdded = false;\n\n this.loadingArticleDetailsList = false;\n this.articleAttributes = null;\n this.directArticle = null;\n this.usageNumber = null;\n this.eanNumber = null;\n this.oeNumber = null;\n this.articleDocuments = null;\n this.replacedNumber = null;\n\n this.loadingVehicleList = false;\n this.vehicleList = null;\n\n this.loadingVehicleImmediateAttributs = false;\n this.vehicleListImmediateAttributs = null;\n\n this.loadingVehicleDetailsList = false;\n this.vehicleDetailsList = null;\n }\n\n\n // actions\n async fetchCountries(lang: string) {\n this.loadingCountryList = true\n\n const body = {\n function: APIMethods.TECDOC_GETCOUNTRIES,\n payload: {\n lang,\n },\n }\n\n const [result, error]: any = await resultOrError>(\n call(\n \"TecDoc\",\n {\n ...body,\n },\n \"Continental_Aftermarket\",\n \"tecdoc@osapiens.com\",\n \"QASDFGHJKLÖ_\"\n )\n )\n\n if (result) {\n runInAction(() => {\n this.countryList = result.data.array\n this.loadingCountryList = false\n })\n return {\n status: ActionResultStatus.SUCCESS,\n result: result,\n } as ActionSuccess\n } else {\n runInAction(() => {\n this.loadingCountryList = false\n })\n return {\n status: ActionResultStatus.ERROR,\n error: error,\n } as ActionError\n }\n }\n\n // actions\n async fetchArticle(\n articleCountry: string,\n lang: string,\n numberType: number,\n articleNumber: string\n ) {\n this.loadingArticleList = true\n\n const body = {\n function: APIMethods.TECDOC_GETARTICLE,\n payload: {\n lang,\n articleCountry,\n numberType,\n articleNumber,\n },\n }\n\n const [result, error]: any = await resultOrError>(\n call(\n \"TecDoc\",\n {\n ...body,\n },\n \"Continental_Aftermarket\",\n \"tecdoc@osapiens.com\",\n \"QASDFGHJKLÖ_\"\n )\n )\n\n if (result) {\n runInAction(() => {\n this.loadingArticleList = false\n this.articleList = result.data.array[0]\n })\n return {\n status: ActionResultStatus.SUCCESS,\n result: result,\n } as ActionSuccess\n } else {\n runInAction(() => {\n this.loadingArticleList = false\n })\n return {\n status: ActionResultStatus.ERROR,\n error: error,\n } as ActionError\n }\n }\n\n async fetchBrandDetails(\n articleCountry: string,\n lang: string,\n brandNo: number\n ) {\n this.loadingBrandDetails = true\n\n const body = {\n function: APIMethods.TECDOC_GETBRANDDETAILS,\n payload: {\n lang,\n articleCountry,\n brandNo,\n },\n }\n\n const [result, error]: any = await resultOrError>(\n call(\n \"TecDoc\",\n {\n ...body,\n },\n \"Continental_Aftermarket\",\n \"tecdoc@osapiens.com\",\n \"QASDFGHJKLÖ_\"\n )\n )\n\n if (result) {\n runInAction(() => {\n this.brandDetails = result.data.array[0]\n this.loadingBrandDetails = false\n })\n return {\n status: ActionResultStatus.SUCCESS,\n result: result,\n } as ActionSuccess\n } else {\n runInAction(() => {\n this.loadingBrandDetails = false\n })\n return {\n status: ActionResultStatus.ERROR,\n error: error,\n } as ActionError\n }\n }\n\n async fetchArticleDetails(\n articleCountry: string,\n lang: string,\n articleId: number\n ) {\n this.loadingArticleDetailsList = true\n\n const body = {\n function: APIMethods.TECDOC_GETARTICLEDETAILS,\n payload: {\n lang,\n articleCountry,\n articleId: {\n array: [articleId],\n },\n attributs: true,\n basicData: true,\n documents: true,\n eanNumbers: true,\n oeNumbers: true,\n replacedNumbers: true,\n usageNumbers: true,\n },\n }\n\n const [result, error]: any = await resultOrError>(\n call(\n \"TecDoc\",\n {\n ...body,\n },\n \"Continental_Aftermarket\",\n \"tecdoc@osapiens.com\",\n \"QASDFGHJKLÖ_\"\n )\n )\n\n if (result) {\n runInAction(() => {\n this.loadingArticleDetailsList = false\n this.articleAttributes = result.data.array[0].articleAttributes?.array\n this.directArticle = result.data.array[0]?.directArticle\n this.eanNumber = result.data.array[0].eanNumber?.array\n this.replacedNumber = result.data.array[0].replacedNumber\n this.loadingArticleDetailsList = false\n this.articleDocuments = result.data.array[0].articleDocuments.array\n this.oeNumber = result.data.array[0].oenNumbers.array\n })\n return {\n status: ActionResultStatus.SUCCESS,\n result: result,\n } as ActionSuccess\n } else {\n runInAction(() => {\n this.loadingArticleDetailsList = false\n })\n return {\n status: ActionResultStatus.ERROR,\n error: error,\n } as ActionError\n }\n }\n\n async addPublicIP(address: string) {\n const body = {\n function: APIMethods.TECDOC_ADDIPADDRESS,\n payload: {\n address: address,\n validityHours: 1,\n },\n }\n\n const [result, error]: any = await resultOrError>(\n call(\n \"TecDoc\",\n {\n ...body,\n },\n \"Continental_Aftermarket\",\n \"tecdoc@osapiens.com\",\n \"QASDFGHJKLÖ_\"\n )\n )\n\n if (result) {\n runInAction(() => {\n this.dynamicIpAdded = result.hasOwnProperty(\"validityHours\")\n })\n return {\n status: ActionResultStatus.SUCCESS,\n result: result,\n } as ActionSuccess\n } else {\n runInAction(() => {\n console.log(\"Public IP could not be added\")\n })\n return {\n status: ActionResultStatus.ERROR,\n error: error,\n } as ActionError\n }\n }\n\n async fetchVehicleList(\n articleCountry: string,\n lang: string,\n articleId: number\n ) {\n this.loadingVehicleList = true\n\n const body = {\n function: APIMethods.TECDOC_GETVEHICLELIST,\n payload: {\n lang,\n articleCountry,\n articleId: articleId,\n linkingTargetType: \"PO\", // P: Passenger car O: Commercial vehicle\n },\n }\n\n const [result, error]: any = await resultOrError>(\n call(\n \"TecDoc\",\n {\n ...body,\n },\n \"Continental_Aftermarket\",\n \"tecdoc@osapiens.com\",\n \"QASDFGHJKLÖ_\"\n )\n )\n\n if (result) {\n runInAction(() => {\n this.vehicleList = result.data.array[0].articleLinkages?.array\n this.loadingVehicleList = false\n })\n return {\n status: ActionResultStatus.SUCCESS,\n result: result,\n } as ActionSuccess\n } else {\n runInAction(() => {\n this.loadingVehicleList = false\n })\n return {\n status: ActionResultStatus.ERROR,\n error: error,\n } as ActionError\n }\n }\n\n async fetchVehicleDetailList(\n articleCountry: string,\n lang: string,\n carIds: number[]\n ) {\n this.loadingVehicleDetailsList = true\n let detailedVehicleArray = []\n let lastResult = null\n\n while (carIds.length !== 0) {\n let tempVehicleIds = carIds.splice(0, 24)\n\n const body = {\n function: APIMethods.TECDOC_GETVEHICLEDETAILSLIST,\n payload: {\n lang,\n articleCountry,\n carIds: {\n array: tempVehicleIds,\n },\n countriesCarSelection: articleCountry,\n country: articleCountry,\n motorCodes: true,\n },\n }\n\n const [result, error]: any = await resultOrError>(\n call(\n \"TecDoc\",\n {\n ...body,\n },\n \"Continental_Aftermarket\",\n \"tecdoc@osapiens.com\",\n \"QASDFGHJKLÖ_\"\n )\n )\n\n if (result) {\n lastResult = result\n detailedVehicleArray = detailedVehicleArray.concat(result.data.array)\n } else {\n runInAction(() => {\n this.loadingVehicleDetailsList = false\n })\n return {\n status: ActionResultStatus.ERROR,\n error: error,\n } as ActionError\n }\n }\n if (detailedVehicleArray && lastResult) {\n runInAction(() => {\n this.vehicleDetailsList = detailedVehicleArray\n this.loadingVehicleDetailsList = false\n })\n return {\n status: ActionResultStatus.SUCCESS,\n result: lastResult,\n } as ActionSuccess\n }\n }\n\n async fetchVehicleListImmediateAttributs(\n articleCountry: string,\n lang: string,\n linkedArticlePairs: { articleLinkId: number; linkingTargetId: number }[],\n articleId: number\n ) {\n this.loadingVehicleImmediateAttributs = true\n let detailedVehicleArray = []\n let lastResult = null\n\n while (linkedArticlePairs.length !== 0) {\n let tempVehicleIds = linkedArticlePairs.splice(0, 24)\n\n const body = {\n function: APIMethods.TECDOC_GETVEHICLELISTIMMEDIATEATTRIBUTS,\n payload: {\n lang,\n articleCountry,\n linkedArticlePairs: {\n array: tempVehicleIds,\n },\n linkingTargetType: \"VOL\",\n country: articleCountry,\n immediateAttributs: true,\n articleId: articleId\n },\n }\n\n const [result, error]: any = await resultOrError>(\n call(\n \"TecDoc\",\n {\n ...body,\n },\n \"Continental_Aftermarket\",\n \"tecdoc@osapiens.com\",\n \"QASDFGHJKLÖ_\"\n )\n )\n\n if (result) {\n lastResult = result\n detailedVehicleArray = detailedVehicleArray.concat(result.data.array)\n } else {\n runInAction(() => {\n this.loadingVehicleImmediateAttributs= false\n })\n return {\n status: ActionResultStatus.ERROR,\n error: error,\n } as ActionError\n }\n }\n if (detailedVehicleArray && lastResult) {\n runInAction(() => {\n this.vehicleListImmediateAttributs = detailedVehicleArray\n this.loadingVehicleImmediateAttributs = false\n })\n return {\n status: ActionResultStatus.SUCCESS,\n result: lastResult,\n } as ActionSuccess\n }\n }\n}\n\nexport default TecDocStore\n","import React, { createContext, useContext } from \"react\"\n\nimport Store from \"./store\"\n\n/* \nCONTEXT / PROVIDER INIT\n*/\n\nconst TecDocStoreContext = createContext(null)\n\nexport const StoreProvider: React.FC = (props) => {\n const { children } = props\n\n return (\n \n {children}\n \n )\n}\n\n/* \nHOOK DEFINITION\n*/\n\nexport const useTecDocStore = () => useContext(TecDocStoreContext)\n","const requireAllServices = (ctx: any): React.FC[] => {\n const keys = ctx.keys()\n const modules = keys.map(ctx)\n\n return keys.map((key: string, index: number) => modules[index].StoreProvider)\n}\n\nconst getAllServices = (): React.FC[] => {\n return requireAllServices(\n require.context(\"api/services/\", true, /index\\.tsx$/)\n )\n}\n\nexport default getAllServices()\n","import { merge } from \"lodash\"\n\nimport { createTheme } from \"@mui/material/styles\"\n\n// import MaterialDesignIcons from \"!!url-loader!@mdi/font/fonts/materialdesignicons-webfont.woff2\"\nimport tokens, { fonts, OsapiensThemeTokens } from \"./tokens\"\nimport { isAte } from \"utils/Global\"\n\n// TODO: override styles of all anchor elements\n// a,\n// a:hover {\n// color: $primary;\n// }\n// a:visited {\n// color: adjust-color($color: $primary, $lightness: -20%);\n// }\n\ndeclare module \"@mui/material/styles\" {\n interface Theme {\n tokens: OsapiensThemeTokens\n }\n interface BreakpointOverrides {\n xs: true\n sm: true\n md: true\n lg: true\n xl: true\n mobile: true\n tablet: true\n laptop: true\n desktop: true\n }\n}\n\nconst commonTheme = {\n palette: {\n mode: \"light\",\n // change dinamically if it's ate or continental\n primary: {\n // light: tokens.color.primary, // will be calculated from palette.primary.main\n main: tokens.color.primary,\n // dark: tokens.color.primary, // will be calculated from palette.primary.main\n },\n secondary: {\n // light: tokens.color.secondary, // will be calculated from palette.primary.main\n main: tokens.color.secondary,\n // dark: tokens.color.secondary, // will be calculated from palette.primary.main\n },\n success: {\n // light: tokens.color.success, // will be calculated from palette.primary.main\n main: tokens.color.success,\n // dark: tokens.color.success, // will be calculated from palette.primary.main\n },\n warning: {\n // light: tokens.color.warning, // will be calculated from palette.primary.main\n main: tokens.color.warning,\n // dark: tokens.color.warning, // will be calculated from palette.primary.main\n },\n error: {\n // light: tokens.color.error, // will be calculated from palette.primary.main\n main: tokens.color.error,\n // dark: tokens.color.error, // will be calculated from palette.primary.main\n },\n grey: {\n main: tokens.color.grey,\n },\n info: {\n main: tokens.color.info,\n },\n link: {\n main: tokens.color.link,\n },\n // Used by `getContrastText()` to maximize the contrast between\n // the background and the text.\n contrastThreshold: 3,\n // Used by the functions below to shift a color's luminance by approximately\n // two indexes within its tonal palette.\n // E.g., shift from Red 500 to Red 300 or Red 700.\n tonalOffset: {\n light: 0.2,\n dark: 0.2,\n },\n },\n shape: {\n borderRadius: tokens.style.radius,\n },\n breakpoints: {\n values: {\n xs: tokens.breakpoints.breakpointXs,\n sm: tokens.breakpoints.breakpointSm,\n md: tokens.breakpoints.breakpointMd,\n lg: tokens.breakpoints.breakpointLg,\n xl: tokens.breakpoints.breakpointXl,\n mobile: tokens.breakpoints.breakpointMobile,\n tablet: tokens.breakpoints.breakpointTablet,\n laptop: tokens.breakpoints.breakpointLaptop,\n desktop: tokens.breakpoints.breakpointDesktop,\n },\n },\n overrides: {\n MuiCssBaseline: {\n \"@global\": {\n \"@font-face\": fonts,\n },\n },\n },\n}\n\nconst muiBaseTheme = createTheme()\n\nconst tokensLight: any = merge({}, commonTheme, {\n palette: {\n mode: \"light\",\n },\n typography: {\n allVariants: {\n fontFamily: isAte ? 'Etelka Light !important' : \"\" ,\n textTransform: 'none',\n fontSize: 16,\n },\n },\n tokens,\n})\n\nconst tokensDark: any = merge({}, commonTheme, {\n palette: {\n mode: \"dark\",\n background: {\n default: muiBaseTheme.palette.common.black,\n paper: muiBaseTheme.palette.grey[\"900\"],\n },\n },\n typography: {\n allVariants: {\n fontFamily: isAte ? 'Etelka Light !important' : \"\" ,\n textTransform: 'none',\n fontSize: 16,\n },\n },\n tokens,\n})\n\nconst osapiensTheme = {\n light: createTheme(tokensLight),\n dark: createTheme(tokensDark),\n}\n\nexport default osapiensTheme\n","import React from \"react\"\nimport i18n from \"i18next\"\nimport { initReactI18next } from \"react-i18next\"\nimport LanguageDetector from \"i18next-browser-languagedetector\"\nimport i18nCountries from \"i18n-iso-countries\"\nimport { cloneDeep } from \"lodash\"\nimport moment from \"moment\"\nimport \"moment/locale/de\"\n\nimport CountryFlag from \"@osapiens/react-ui/lib/ui/CountryFlag\"\nimport { CountryCode } from \"types/Formats\"\n\nimport de from \"./locales/de.json\"\nimport en from \"./locales/en.json\"\nimport es from \"./locales/es.json\"\nimport fr from \"./locales/fr.json\"\nimport it from \"./locales/it.json\"\nimport pl from \"./locales/pl.json\"\nimport pt from \"./locales/pt.json\"\nimport ro from \"./locales/ro.json\"\nimport tr from \"./locales/tr.json\"\nimport zh from \"./locales/zh.json\"\nimport ko from \"./locales/ko.json\"\n\nexport interface Language {\n locale: string\n name: string\n icon: JSX.Element\n}\n\nconst getBrowserLanguage = () => {\n // @ts-ignore\n const userLang = navigator.language || navigator.userLanguage\n return userLang ? userLang.split(\"-\")[0] : FALLBACK_LANGUAGE\n}\n\nconst browserLanguage = getBrowserLanguage()\nexport const FALLBACK_LANGUAGE = \"en\"\n\nexport const defaultTranslationModules = [\n { locale: \"de\", texts: de },\n { locale: \"en\", texts: en },\n { locale: \"es\", texts: es },\n { locale: \"fr\", texts: fr },\n { locale: \"it\", texts: it },\n { locale: \"pl\", texts: pl },\n { locale: \"pt\", texts: pt },\n { locale: \"ro\", texts: ro },\n { locale: \"tr\", texts: tr },\n { locale: \"zh\", texts: zh },\n { locale: \"ko\", texts: ko },\n]\nexport const defaultLanguages = defaultTranslationModules.map((m) => m.locale)\n\nconst resources = cloneDeep(\n Object.fromEntries(\n defaultTranslationModules.map((m) => [m.locale, { app: m.texts }])\n )\n)\n\nexport const getDefaultLanguages = (): Language[] => {\n const mappedLocaleNames = {\n en: \"English\",\n de: \"Deutsch\",\n fr: \"Français\",\n da: \"Dansk\",\n pl: \"Polski\",\n nl: \"Nederlands\",\n }\n\n return defaultLanguages.map(\n (locale) =>\n ({\n locale: locale,\n name:\n mappedLocaleNames[locale as keyof typeof mappedLocaleNames] || locale,\n icon: ,\n } as Language)\n )\n}\n\n// register defaultLanguages for country names\ndefaultLanguages.forEach((locale) =>\n i18nCountries.registerLocale(\n require(`i18n-iso-countries/langs/${locale}.json`)\n )\n)\n\ni18n\n .use(LanguageDetector)\n\n // pass the i18n instance to react-i18next.\n .use(initReactI18next)\n\n // init i18next\n // for all options read: https://www.i18next.com/overview/configuration-options\n .init({\n resources,\n debug: process.env.NODE_ENV === \"development\",\n ns: [\"app\"],\n defaultNS: \"app\",\n lng: browserLanguage || FALLBACK_LANGUAGE,\n fallbackLng: FALLBACK_LANGUAGE,\n interpolation: {\n escapeValue: false, // not needed for react as it escapes by default\n },\n react: {\n bindI18n: \"languageChanged\",\n bindI18nStore: \"added\",\n },\n })\n\nmoment.locale(i18n.language)\n\nlet SETUP_COMPLETED = {\n [FALLBACK_LANGUAGE]: false,\n}\nexport const isSetup = (language: string) => SETUP_COMPLETED[language]\nexport const setup = (language: string) => {\n if (isSetup(language) === false) {\n i18nCountries.registerLocale(\n require(`i18n-iso-countries/langs/${language}.json`)\n )\n }\n}\n\nexport default i18n\n","import React, { Suspense } from \"react\"\nimport { ErrorBoundary } from \"react-error-boundary\"\nimport { SnackbarProvider } from \"notistack\"\nimport { HTML5Backend } from \"react-dnd-html5-backend\"\nimport { DndProvider } from \"react-dnd\"\n\nimport { BrowserRouter } from \"react-router-dom\"\n\nimport services from \"api/services\"\n\nimport { CssBaseline } from \"@mui/material\"\nimport { ThemeProvider, styled } from \"@mui/material/styles\"\nimport StylesProvider from \"@mui/styles/StylesProvider\"\n\nimport AppComponent from \"pages/App/index\"\nimport ErrorBoundaryFallback from \"@osapiens/react-ui/lib/ui/ErrorBoundary\"\nimport { osapiens } from \"themes\"\n\nimport { FALLBACK_LANGUAGE, setup } from \"i18n\"\n\nimport \"./App.css\"\n\n// const theme = osapiens.light\nconst theme = osapiens.light\n\nconst PREFIX = \"App\"\n\nconst classes = {\n success: `${PREFIX}-success`,\n error: `${PREFIX}-error`,\n warning: `${PREFIX}-warning`,\n info: `${PREFIX}-info`,\n}\n\nconst StyledErrorBoundary = styled(ErrorBoundary)(({ theme }) => ({\n [`& .${classes.success}`]: { backgroundColor: theme.palette.success.main },\n [`& .${classes.error}`]: { backgroundColor: theme.palette.error.main },\n [`& .${classes.warning}`]: { backgroundColor: theme.palette.warning.main },\n [`& .${classes.info}`]: { backgroundColor: theme.palette.secondary.main },\n}))\n\nconst CombinedStoreProvider: React.FC<{ provider: React.FC[] }> = ({\n provider,\n children,\n}) => {\n const InitialNode: React.FC<{}> = ({ children }) => <>{children}>\n const NestedProvider = provider.reduce((Provider, ParentNode) => {\n return ({ children }) => (\n \n {children}\n \n )\n }, InitialNode)\n\n return {children}\n}\n\n// const updateFontFace = (fontFamily: string, fontUrl: string) => {\n// // Create a new style element\n// const styleElement = document.createElement('style');\n// styleElement.type = 'text/css';\n\n// // Construct the @font-face rule and universal font-family rule\n// const fontFaceRule = `\n// @font-face {\n// font-family: \"${fontFamily}\";\n// src: local(\"${fontFamily}\"), url(\"${fontUrl}\") format(\"opentype\");\n// }\n\n// * {\n// font-family: \"${fontFamily}\", serif !important;\n// }\n// `;\n\n// styleElement.textContent = fontFaceRule;\n\n// // Remove any existing custom font-face styles to prevent duplicates\n// const existingFontStyle = document.getElementById('dynamic-font-face');\n// if (existingFontStyle) {\n// existingFontStyle.parentNode.removeChild(existingFontStyle);\n// }\n\n// // Append the new style element to the head\n// styleElement.id = 'dynamic-font-face';\n// document.head.appendChild(styleElement);\n// }\n\nconst AppContainer = () => {\n React.useEffect(() => {\n // initialize i18n with fallback language if not done, yet\n setup(FALLBACK_LANGUAGE)\n }, [])\n\n return (\n \n loading...}>\n \n \n \n \n \n {/* Kickstart a simple scoped CSS baseline to build upon. */}\n {/* Required to override Material-UI's styles via CSS modules. */}\n \n \n \n \n \n \n \n \n \n \n \n )\n}\n\nexport default AppContainer\n","import consola from \"consola\"\n\n// This optional code is used to register a service worker.\n// register() is not called by default.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on subsequent visits to a page, after all the\n// existing tabs open on the page have been closed, since previously cached\n// resources are updated in the background.\n\n// To learn more about the benefits of this model and instructions on how to\n// opt-in, read https://bit.ly/CRA-PWA\n\nconst isLocalhost = Boolean(\n window.location.hostname === \"localhost\" ||\n // [::1] is the IPv6 localhost address.\n window.location.hostname === \"[::1]\" ||\n // 127.0.0.0/8 are considered localhost for IPv4.\n window.location.hostname.match(\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\n )\n)\n\ntype Config = {\n onSuccess?: (registration: ServiceWorkerRegistration) => void\n onUpdate?: (registration: ServiceWorkerRegistration) => void\n}\n\nexport function register(config?: Config) {\n if (process.env.NODE_ENV === \"production\" && \"serviceWorker\" in navigator) {\n // The URL constructor is available in all browsers that support SW.\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href)\n if (publicUrl.origin !== window.location.origin) {\n // Our service worker won't work if PUBLIC_URL is on a different origin\n // from what our page is served on. This might happen if a CDN is used to\n // serve assets; see https://github.com/facebook/create-react-app/issues/2374\n return\n }\n\n window.addEventListener(\"load\", () => {\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`\n\n if (isLocalhost) {\n // This is running on localhost. Let's check if a service worker still exists or not.\n checkValidServiceWorker(swUrl, config)\n\n // Add some additional logging to localhost, pointing developers to the\n // service worker/PWA documentation.\n navigator.serviceWorker.ready.then(() => {\n consola.info(\n \"This web app is being served cache-first by a service \" +\n \"worker. To learn more, visit https://bit.ly/CRA-PWA\"\n )\n })\n } else {\n // Is not localhost. Just register service worker\n registerValidSW(swUrl, config)\n }\n })\n }\n}\n\nfunction registerValidSW(swUrl: string, config?: Config) {\n navigator.serviceWorker\n .register(swUrl)\n .then((registration) => {\n registration.onupdatefound = () => {\n const installingWorker = registration.installing\n if (installingWorker == null) {\n return\n }\n installingWorker.onstatechange = () => {\n if (installingWorker.state === \"installed\") {\n if (navigator.serviceWorker.controller) {\n // At this point, the updated precached content has been fetched,\n // but the previous service worker will still serve the older\n // content until all client tabs are closed.\n consola.info(\n \"New content is available and will be used when all \" +\n \"tabs for this page are closed. See https://bit.ly/CRA-PWA.\"\n )\n\n // Execute callback\n if (config && config.onUpdate) {\n config.onUpdate(registration)\n }\n } else {\n // At this point, everything has been precached.\n // It's the perfect time to display a\n // \"Content is cached for offline use.\" message.\n consola.info(\"Content is cached for offline use.\")\n\n // Execute callback\n if (config && config.onSuccess) {\n config.onSuccess(registration)\n }\n }\n }\n }\n }\n })\n .catch((error) => {\n consola.error(\"Error during service worker registration:\", error)\n })\n}\n\nfunction checkValidServiceWorker(swUrl: string, config?: Config) {\n // Check if the service worker can be found. If it can't reload the page.\n fetch(swUrl, {\n headers: { \"Service-Worker\": \"script\" },\n })\n .then((response) => {\n // Ensure service worker exists, and that we really are getting a JS file.\n const contentType = response.headers.get(\"content-type\")\n if (\n response.status === 404 ||\n (contentType != null && contentType.indexOf(\"javascript\") === -1)\n ) {\n // No service worker found. Probably a different app. Reload the page.\n navigator.serviceWorker.ready.then((registration) => {\n registration.unregister().then(() => {\n window.location.reload()\n })\n })\n } else {\n // Service worker found. Proceed as normal.\n registerValidSW(swUrl, config)\n }\n })\n .catch(() => {\n consola.error(\n \"No internet connection found. App is running in offline mode.\"\n )\n })\n}\n\nexport function unregister() {\n if (\"serviceWorker\" in navigator) {\n navigator.serviceWorker.ready\n .then((registration) => {\n registration.unregister()\n })\n .catch((error) => {\n consola.error(error.message)\n })\n }\n}\n","import React from \"react\"\nimport ReactDOM from \"react-dom\"\n\n\nimport App from \"App\"\nimport * as serviceWorker from \"serviceWorker\"\nimport { isDevEnv } from \"utils/env\"\n\n/**\n * THIS IS A HOTFIX TO PREVENT CSS CONFLICTS WITH STYLESHEETS COMING FROM PRIMING CLOUD.\n */\n\nconst conflictList = [\"css/styles\", \"material\", \"materialize\"]\nconst conflictLinkedStyleSheets = Array.from(\n document.getElementsByTagName(\"link\")\n).filter((link) =>\n conflictList.some((conflictItem) => link.href.includes(conflictItem))\n)\nconst conflictStyleSheets = Array.from(\n document.getElementsByTagName(\"style\")\n).filter((link) => link.textContent.includes(\"PrimingCloud\"))\n\nfor (const styleSheet of [\n ...conflictLinkedStyleSheets,\n ...conflictStyleSheets,\n]) {\n try {\n document.head.removeChild(styleSheet)\n } catch {\n if ((styleSheet as HTMLLinkElement).href) {\n ;(styleSheet as HTMLLinkElement).href = \"\"\n }\n }\n}\n\n/**\n * END OF HOTFIX.\n */\n\nif (isDevEnv()) {\n document.title = `${document.title} (localhost)`\n\n // activate mobx logger\n require(\"mobx-logger\").enableLogging({\n action: true,\n reaction: false,\n transaction: true,\n compute: false,\n })\n}\n\nconst render = (App: any) =>\n ReactDOM.render(, document.getElementById(\"root\"))\n\nrender(App)\n\n// If you want your app to work offline and load faster, you can change\n// unregister() to register() below. Note this comes with some pitfalls.\n// Learn more about service workers: https://bit.ly/CRA-PWA\nserviceWorker.unregister()\n\nif (module.hot) {\n module.hot.accept(\"./App\", () => {\n const NextApp = require(\"./App\").default\n render(NextApp)\n })\n}\n","import { makeAutoObservable } from \"mobx\"\n\nexport default class AppStore {\n sidebarOpen: boolean = false\n\n // init function\n constructor() {\n makeAutoObservable(this)\n }\n}\n","import React, { createContext, useContext } from \"react\"\n\nimport Store from \"./store\"\n\n/* \nCONTEXT / PROVIDER INIT\n*/\n\nconst AppStoreContext = createContext(null)\n\nexport const StoreProvider: React.FC = (props) => {\n const { children } = props\n\n return (\n \n {children}\n \n )\n}\n\n/* \nHOOK DEFINITION\n*/\n\nexport const useAppStore = () => useContext(AppStoreContext)\n","import { makeAutoObservable, runInAction } from \"mobx\"\nimport {\n ActionError,\n ActionResultStatus,\n ActionSuccess,\n QueryResponse,\n} from \"types/Global\"\nimport { resultOrError } from \"../../../utils/Global\"\nimport { call } from \"../../CloudAPI\"\n\nclass CounterfeitReportStore {\n // lists\n loadingCounterfeitReportResponse = false\n counterfeitReportResponse = null\n\n // init function\n constructor() {\n makeAutoObservable(this)\n }\n\n // actions\n async sendReportEmail(\n email: string,\n firstName: string,\n lastName: string,\n companyName: string,\n street: string,\n postalCode: string,\n city: string,\n country: string,\n code: string,\n placeOfPurchase: string,\n dateOfPurchase: string,\n manufacturer: string,\n description: string,\n photos: string[],\n pdf: string[]\n ) {\n this.loadingCounterfeitReportResponse = true\n\n const body = {\n email,\n firstName,\n lastName,\n companyName,\n street,\n postalCode,\n city,\n country,\n code,\n placeOfPurchase,\n dateOfPurchase,\n manufacturer,\n description,\n photos,\n pdf,\n }\n\n const [result, error]: any = await resultOrError>(\n call(\n \"CounterfeitReport\",\n {\n ...body,\n },\n \"BrandOSMaster\",\n process.env.REACT_APP_API_AUTH_CHECK_USERNAME,\n process.env.REACT_APP_API_AUTH_CHECK_PASSWORD\n )\n )\n\n if (result) {\n runInAction(() => {\n this.counterfeitReportResponse = result\n this.loadingCounterfeitReportResponse = false\n })\n return {\n status: ActionResultStatus.SUCCESS,\n result: result,\n } as ActionSuccess\n } else {\n runInAction(() => {\n this.loadingCounterfeitReportResponse = false\n })\n return {\n status: ActionResultStatus.ERROR,\n error: error,\n } as ActionError\n }\n }\n}\n\nexport default CounterfeitReportStore\n","import React, { createContext, useContext } from \"react\"\n\nimport Store from \"./store\"\n\n/* \nCONTEXT / PROVIDER INIT\n*/\n\nconst CounterfeitReportContext = createContext(null)\n\nexport const StoreProvider: React.FC = (props) => {\n const { children } = props\n\n return (\n \n {children}\n \n )\n}\n\n/* \nHOOK DEFINITION\n*/\n\nexport const useCounterfeitReportStore = () => useContext(CounterfeitReportContext)\n","import { makeAutoObservable, runInAction } from \"mobx\"\nimport {\n ActionError,\n ActionResultStatus,\n ActionSuccess,\n QueryResponse,\n} from \"types/Global\"\nimport { resultOrError } from \"../../../utils/Global\"\nimport { APIMethods, call } from \"api/CloudAPI\"\nimport {\n ArticleAttributes,\n ArticleDocuments,\n ArticleInfo,\n BrandDetails, CountryInfo,\n DirectArticle,\n EanNumber,\n OENumber,\n ReplacedNumber,\n UsageNumber,\n VehicleDetails,\n VehicleLink,\n} from \"../../../types/BusinessObjects\"\n\nclass TecDocStore {\n loadingCountryList = false\n countryList: CountryInfo[] = null\n\n loadingArticleList = false\n articleList: ArticleInfo = null\n\n loadingBrandDetails = false\n brandDetails: BrandDetails = null\n\n loadingArticleDetailsList = false\n articleAttributes: ArticleAttributes = null\n directArticle: DirectArticle = null\n usageNumber: UsageNumber = null\n eanNumber: EanNumber = null\n oeNumber: OENumber[] = null\n articleDocuments: ArticleDocuments[] = null\n replacedNumber: ReplacedNumber = null\n\n loadingVehicleList = false\n vehicleList: VehicleLink[] = null\n\n loadingVehicleDetailsList = false\n vehicleDetailsList: VehicleDetails[] = null\n\n // init function\n constructor() {\n makeAutoObservable(this)\n }\n\n // actions\n async fetchCountries(\n lang: string,\n ) {\n this.loadingCountryList = true\n\n const body = {\n function: APIMethods.TECDOC_GETCOUNTRIES,\n payload: {\n lang,\n },\n }\n\n const [result, error]: any = await resultOrError>(\n call(\n \"TecDoc\",\n {\n ...body,\n },\n process.env.REACT_APP_API_CUSTOMER,\n \"\",\n process.env.REACT_APP_API_PASSWORD\n )\n )\n\n if (result) {\n runInAction(() => {\n this.countryList = result.data.array\n this.loadingCountryList = false\n })\n return {\n status: ActionResultStatus.SUCCESS,\n result: result,\n } as ActionSuccess\n } else {\n runInAction(() => {\n this.loadingCountryList = false\n })\n return {\n status: ActionResultStatus.ERROR,\n error: error,\n } as ActionError\n }\n }\n\n // actions\n async fetchArticle(\n articleCountry: string,\n lang: string,\n numberType: number,\n articleNumber: string\n ) {\n this.loadingArticleList = true\n\n const body = {\n function: APIMethods.TECDOC_GETARTICLE,\n payload: {\n lang,\n articleCountry,\n numberType,\n articleNumber,\n },\n }\n\n const [result, error]: any = await resultOrError>(\n call(\n \"TecDoc\",\n {\n ...body,\n },\n process.env.REACT_APP_API_CUSTOMER,\n \"\",\n process.env.REACT_APP_API_PASSWORD\n )\n )\n\n if (result) {\n runInAction(() => {\n this.articleList = result.data.array[0]\n this.loadingArticleList = false\n })\n return {\n status: ActionResultStatus.SUCCESS,\n result: result,\n } as ActionSuccess\n } else {\n runInAction(() => {\n this.loadingArticleList = false\n })\n return {\n status: ActionResultStatus.ERROR,\n error: error,\n } as ActionError\n }\n }\n\n async fetchBrandDetails(\n articleCountry: string,\n lang: string,\n brandNo: number\n ) {\n this.loadingBrandDetails = true\n\n const body = {\n function: APIMethods.TECDOC_GETBRANDDETAILS,\n payload: {\n lang,\n articleCountry,\n brandNo,\n },\n }\n\n const [result, error]: any = await resultOrError>(\n call(\n \"TecDoc\",\n {\n ...body,\n },\n process.env.REACT_APP_API_CUSTOMER,\n \"\",\n process.env.REACT_APP_API_PASSWORD\n )\n )\n\n if (result) {\n runInAction(() => {\n this.brandDetails = result.data.array[0]\n\n this.loadingBrandDetails = false\n })\n return {\n status: ActionResultStatus.SUCCESS,\n result: result,\n } as ActionSuccess\n } else {\n runInAction(() => {\n this.loadingBrandDetails = false\n })\n return {\n status: ActionResultStatus.ERROR,\n error: error,\n } as ActionError\n }\n }\n\n async fetchArticleDetails(\n articleCountry: string,\n lang: string,\n articleId: number\n ) {\n this.loadingArticleDetailsList = true\n\n const body = {\n function: APIMethods.TECDOC_GETARTICLEDETAILS,\n payload: {\n lang,\n articleCountry,\n articleId: {\n array: [articleId],\n },\n attributs: true,\n basicData: true,\n documents: true,\n eanNumbers: true,\n oeNumbers: true,\n replacedNumbers: true,\n usageNumbers: true,\n },\n }\n\n const [result, error]: any = await resultOrError>(\n call(\n \"TecDoc\",\n {\n ...body,\n },\n process.env.REACT_APP_API_CUSTOMER,\n \"\",\n process.env.REACT_APP_API_PASSWORD\n )\n )\n\n if (result) {\n runInAction(() => {\n this.articleAttributes = result.data.array[0].articleAttributes?.array\n this.directArticle = result.data.array[0]?.directArticle\n this.eanNumber = result.data.array[0].eanNumber?.array\n this.replacedNumber = result.data.array[0].replacedNumber\n this.loadingArticleDetailsList = false\n this.articleDocuments = result.data.array[0].articleDocuments.array\n this.oeNumber = result.data.array[0].oenNumbers.array\n })\n return {\n status: ActionResultStatus.SUCCESS,\n result: result,\n } as ActionSuccess\n } else {\n runInAction(() => {\n this.loadingArticleDetailsList = false\n })\n return {\n status: ActionResultStatus.ERROR,\n error: error,\n } as ActionError\n }\n }\n\n async fetchVehicleList(\n articleCountry: string,\n lang: string,\n articleId: number\n ) {\n this.loadingVehicleList = true\n\n const body = {\n function: APIMethods.TECDOC_GETVEHICLELIST,\n payload: {\n lang,\n articleCountry,\n articleId: articleId,\n linkingTargetType: \"PO\", // P: Passenger car O: Commercial vehicle\n },\n }\n\n const [result, error]: any = await resultOrError>(\n call(\n \"TecDoc\",\n {\n ...body,\n },\n process.env.REACT_APP_API_CUSTOMER,\n \"\",\n process.env.REACT_APP_API_PASSWORD\n )\n )\n\n if (result) {\n runInAction(() => {\n this.vehicleList = result.data.array[0].articleLinkages?.array\n this.loadingVehicleList = false\n })\n return {\n status: ActionResultStatus.SUCCESS,\n result: result,\n } as ActionSuccess\n } else {\n runInAction(() => {\n this.loadingVehicleList = false\n })\n return {\n status: ActionResultStatus.ERROR,\n error: error,\n } as ActionError\n }\n }\n\n async fetchVehicleDetailList(\n articleCountry: string,\n lang: string,\n carIds: number[]\n ) {\n this.loadingVehicleDetailsList = true\n let detailedVehicleArray = []\n let lastResult = null\n\n while (carIds.length !== 0) {\n let tempVehicleIds = carIds.splice(0, 24)\n\n const body = {\n function: APIMethods.TECDOC_GETVEHICLEDETAILSLIST,\n payload: {\n lang,\n articleCountry,\n carIds: {\n array: tempVehicleIds,\n },\n countriesCarSelection: articleCountry,\n country: articleCountry,\n motorCodes: true,\n },\n }\n\n const [result, error]: any = await resultOrError>(\n call(\n \"TecDoc\",\n {\n ...body,\n },\n process.env.REACT_APP_API_CUSTOMER,\n \"\",\n process.env.REACT_APP_API_PASSWORD\n )\n )\n\n if (result) {\n lastResult = result\n detailedVehicleArray = detailedVehicleArray.concat(result.data.array)\n } else {\n runInAction(() => {\n this.loadingVehicleDetailsList = false\n })\n return {\n status: ActionResultStatus.ERROR,\n error: error,\n } as ActionError\n }\n }\n if (detailedVehicleArray && lastResult) {\n runInAction(() => {\n this.vehicleDetailsList = detailedVehicleArray\n this.loadingVehicleDetailsList = false\n })\n return {\n status: ActionResultStatus.SUCCESS,\n result: lastResult,\n } as ActionSuccess\n }\n }\n}\n\nexport default TecDocStore\n","import React, { createContext, useContext } from \"react\"\n\nimport Store from \"./store\"\n\n/* \nCONTEXT / PROVIDER INIT\n*/\n\nconst TecDocStoreContext = createContext(null)\n\nexport const StoreProvider: React.FC = (props) => {\n const { children } = props\n\n return (\n \n {children}\n \n )\n}\n\n/* \nHOOK DEFINITION\n*/\n\nexport const useTecDocStore = () => useContext(TecDocStoreContext)\n","import { makeAutoObservable, runInAction } from \"mobx\"\nimport {\n ActionError,\n ActionResultStatus,\n ActionSuccess,\n QueryResponse,\n} from \"types/Global\"\nimport { resultOrError } from \"../../../utils/Global\"\nimport { APIMethods, call } from \"api/CloudAPI\"\nimport { ValueAddedService } from \"./types\"\n\nclass ValueAddedServiceStore {\n // lists\n loadingValueAddedServiceList = false\n valueAddedServiceList: ValueAddedService[] = []\n\n // init function\n constructor() {\n makeAutoObservable(this)\n }\n\n // actions\n async fetchValueAddedServices(sgtin: string) {\n this.loadingValueAddedServiceList = true\n\n const body = {\n request: APIMethods.VAS_LISTALL,\n // TODO remove hardcoded value\n data: {\n organizationID: \"Bosch\",\n },\n }\n\n const [result, error] = await resultOrError>(\n call(\n \"OrganizationRouter\",\n {\n ...body,\n },\n \"Bosch\",\n \"\",\n \"pass123\"\n )\n )\n\n if (result) {\n const vasList: ValueAddedService[] = []\n\n runInAction(() => {\n ;(result as ValueAddedService[]).forEach((item) => {\n if (item.gtins.indexOf(sgtin) > -1) {\n vasList.push(item)\n }\n })\n this.valueAddedServiceList = vasList\n this.loadingValueAddedServiceList = false\n })\n return {\n status: ActionResultStatus.SUCCESS,\n result: result,\n } as ActionSuccess\n } else {\n runInAction(() => {\n this.loadingValueAddedServiceList = false\n })\n return {\n status: ActionResultStatus.ERROR,\n error: error,\n } as ActionError\n }\n }\n}\n\nexport default ValueAddedServiceStore\n","import React, { createContext, useContext } from \"react\"\n\nimport Store from \"./store\"\n\n/* \nCONTEXT / PROVIDER INIT\n*/\n\nconst ValueAddedServiceStoreContext = createContext(null)\n\nexport const StoreProvider: React.FC = (props) => {\n const { children } = props\n\n return (\n \n {children}\n \n )\n}\n\n/* \nHOOK DEFINITION\n*/\n\nexport const useValueAddedServiceStore = () => useContext(ValueAddedServiceStoreContext)\n","import React from \"react\"\n\nimport { StyledListHeading } from \"./styles\"\nimport { Typography, useTheme } from \"@mui/material\"\nimport { ListHeadingTypes } from \"../types\"\nimport Icon from \"@mdi/react\"\nimport { mdiChevronDown, mdiChevronUp } from \"@mdi/js\"\nimport tokens from \"themes/default/tokens\"\nimport { isAte } from \"utils/Global\"\nimport { convertSizeRem } from \"utils/util\"\n\nconst ListHeading: React.FC = (props) => {\n const { title, caret, variant } = props\n const theme = useTheme()\n\n return (\n \n \n {title}\n \n {caret !== \"NONE\" && (\n \n )}\n \n )\n}\n\nexport default ListHeading\n","import React from \"react\"\nimport { Box, BoxProps } from \"@mui/material\"\n\n// eslint-disable-next-line\nimport svgURL from \"!!url-loader!./images/osapiens-dark.svg\"\nimport useTheme from \"@mui/material/styles/useTheme\"\nimport {StyledBackground} from \"./styles\";\n\ninterface BackgroundProps {}\n\nconst Background: React.FC = (props) => {\n const { children } = props\n const { palette } = useTheme()\n const backgroundPattern =\n process.env.REACT_APP_API_LAYOUT === \"osapiens\"\n ? {\n backgroundImage: `url(${svgURL})`,\n backgroundRepeat: \"repeat\",\n }\n : {}\n\n return (\n \n \n {children}\n \n \n )\n}\n\nexport default Background\n","export default \"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMjAuNCIgaGVpZ2h0PSIxMjAuNiIgdmlld0JveD0iMCAwIDEyMC40IDEyMC42Ij4KICA8ZyBpZD0iZ3JvdXAiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC04NS44NTIgLTY5LjAwOCkiIG9wYWNpdHk9IjAuMDI1Ij4KICAgIDxnIGlkPSJwYXR0ZXJuIiBzdHlsZT0iaXNvbGF0aW9uOiBpc29sYXRlIj4KICAgICAgPHBhdGggZD0iTTEzLjEsNDguODYyQTI2LjE3NywyNi4xNzcsMCwwLDEsMTkuNDE0LjkwNiwyNS45MDksMjUuOTA5LDAsMCwxLDM2LjM4NywyLjA4MS45ODUuOTg1LDAsMCwxLDM1LjYxNiwzLjksMjQuMjA4LDI0LjIwOCwwLDAsMCwyLjgwOCwzMi40NTgsMjQuMjA3LDI0LjIwNywwLDAsMCw0Ny4xNTMsMzguM2EyNC4wNTgsMjQuMDU4LDAsMCwwLDIuNDE4LTE4LjM2OUEyNC42NjUsMjQuNjY1LDAsMCwwLDQ4LjM3NiwxNi41YS45ODYuOTg2LDAsMSwxLDEuODA4LS43ODYsMjYuMjc2LDI2LjI3NiwwLDAsMSwxLjI5MSwzLjcsMjYuMTc3LDI2LjE3NywwLDAsMS0xOC41MSwzMi4wNjEsMjYuMzI3LDI2LjMyNywwLDAsMS02LjgxNy45QTI2LjAxNSwyNi4wMTUsMCwwLDEsMTMuMSw0OC44NjJaTTEwLjY3Nyw0MS43QTIxLjk0NCwyMS45NDQsMCwwLDEsNy41NDksMTQuNjE4Ljk4Ni45ODYsMCwxLDEsOS4yMjQsMTUuNjYsMTkuOTY5LDE5Ljk2OSwwLDEsMCwyNi4xODksNi4yMjdjLS4yMzcsMC0uNDc5LDAtLjcxNi4wMTJBLjk4Ni45ODYsMCwwLDEsMjUuNCw0LjI2OGMuMjU5LS4wMS41MjMtLjAxNC43ODQtLjAxNEEyMS45MzcsMjEuOTM3LDAsMCwxLDQxLjcsNDEuN2EyMS45MzUsMjEuOTM1LDAsMCwxLTMxLjAyNCwwWm0xMC45MzUsMS41NjdhLjk2OS45NjksMCwwLDEsLjUtMS44NzFBMTUuNzM5LDE1LjczOSwwLDEsMCwxMS4wNDgsMzAuNTE3YS45NjkuOTY5LDAsMCwxLTEuODYzLjUzM0ExNy43LDE3LjcsMCwxLDEsMjEuNjEyLDQzLjI3MVptNC42MjYtMy4xOTVoLS4wMjVhMTMuODQxLDEzLjg0MSwwLDAsMS01LjI3OS0yNi42MkExMy42ODcsMTMuNjg3LDAsMCwxLDI2LjIxMywxMi40aC4wMjVhMTMuODQyLDEzLjg0MiwwLDAsMSwxMy42MjksMTEuNDZjLjAwNi4wMjQuMDEyLjA0OS4wMTYuMDczYTE0LjAyNSwxNC4wMjUsMCwwLDEsMCw0LjYwN2MwLC4wMjUtLjAxLjA0OS0uMDE2LjA3M2ExMy44NDIsMTMuODQyLDAsMCwxLTEzLjYsMTEuNDZaTTI0Ljk3NSwxNC40M2ExMS45MTQsMTEuOTE0LDAsMCwwLTkuNzE1LDcuMjU4LDExLjksMTEuOSwwLDAsMCwyLjU4MywxMi45NTksMTEuNTY1LDExLjU2NSwwLDAsMCwuOTM4LjgzOSwxMS44NDMsMTEuODQzLDAsMCwwLDIuOTA2LDEuNzM0LDExLjk5MiwxMS45OTIsMCwwLDAsMy4yODkuODMzLDExLjgsMTEuOCwwLDAsMCw0LjIzNi0uMzEuNy43LDAsMCwxLC4wODgtLjAxOCwxMS44ODksMTEuODg5LDAsMCwwLDAtMjIuOTY4Yy0uMDI5LS4wMDYtLjA1OS0uMDEyLS4wODgtLjAyYTEyLjAxMiwxMi4wMTIsMCwwLDAtMi45NTUtLjM3N0ExMS43MTksMTEuNzE5LDAsMCwwLDI0Ljk3NSwxNC40M1oiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDg5Ljg1MSA3Mi44NzcpIiBmaWxsPSIjMDAwIiAvPgogICAgICA8cGF0aCBkYXRhLW5hbWU9ImxvZ28iIGQ9Ik0xMy4xLDQ4Ljg2NEEyNi4xNzgsMjYuMTc4LDAsMCwxLDE5LjQxMy45MDYsMjUuOTE1LDI1LjkxNSwwLDAsMSwzNi4zODYsMi4wODFhLjk4Ni45ODYsMCwwLDEtLjc3LDEuODE2QTI0LjIwNSwyNC4yMDUsMCwwLDAsMi44MDksMzIuNDU4LDI0LjIwNywyNC4yMDcsMCwwLDAsNDcuMTUyLDM4LjMsMjQuMDM5LDI0LjAzOSwwLDAsMCw0OS41NywxOS45MjhhMjQuMzM5LDI0LjMzOSwwLDAsMC0xLjE5Mi0zLjQyMi45ODYuOTg2LDAsMSwxLDEuODA4LS43ODgsMjYuNSwyNi41LDAsMCwxLDEuMjksMy43LDI2LjE3NSwyNi4xNzUsMCwwLDEtMTguNTEsMzIuMDYsMjYuMzM2LDI2LjMzNiwwLDAsMS02LjgxOS45QTI2LjAyMiwyNi4wMjIsMCwwLDEsMTMuMSw0OC44NjRaTTEwLjY3OCw0MS43QTIxLjkzOCwyMS45MzgsMCwwLDEsNy41NTEsMTQuNjE3Ljk4NS45ODUsMCwxLDEsOS4yMjQsMTUuNjYsMTkuOTY5LDE5Ljk2OSwwLDEsMCwyNi4xOSw2LjIyNmMtLjIzOSwwLS40OCwwLS43MTcuMDEyYS45ODYuOTg2LDAsMCwxLS4wNjktMS45N2MuMjYxLS4wMDguNTI0LS4wMTQuNzg2LS4wMTRBMjEuOTM3LDIxLjkzNywwLDAsMSw0MS43LDQxLjdhMjEuOTMyLDIxLjkzMiwwLDAsMS0zMS4wMjMsMFptMTAuOTM3LDEuNTY3YS45NjguOTY4LDAsMSwxLC41LTEuODcxQTE1LjczNSwxNS43MzUsMCwxLDAsMTEuMDQ4LDMwLjUxNmEuOTY5Ljk2OSwwLDEsMS0xLjg2My41MzUsMTcuNywxNy43LDAsMSwxLDEyLjQyOSwxMi4yMlptNC42MjUtMy4yaC0uMDI2YTEzLjgzNSwxMy44MzUsMCwwLDEsMC0yNy42N2guMDI2QTEzLjg0MSwxMy44NDEsMCwwLDEsMzkuODY5LDIzLjg2NWMuMDA2LjAyNC4wMS4wNDkuMDE0LjA3M2ExNC4wMjUsMTQuMDI1LDAsMCwxLDAsNC42MDdjMCwuMDI0LS4wMDguMDQ5LS4wMTQuMDczYTEzLjg0MSwxMy44NDEsMCwwLDEtMTMuNiwxMS40NTlaTTI0Ljk3NiwxNC40M0ExMS44NSwxMS44NSwwLDAsMCwxNC40MjgsMjQuOTc4YTExLjk4LDExLjk4LDAsMCwwLS4wNjksMS4yNjQsMTEuNTg3LDExLjU4NywwLDAsMCwuMDY5LDEuMjY0QTExLjczLDExLjczLDAsMCwwLDE2Ljk5MywzMy43YTEyLjIxLDEyLjIxLDAsMCwwLC44NDkuOTQ4cS40NDcuNDQzLjkzOC44NGExMS43ODQsMTEuNzg0LDAsMCwwLDYuMiwyLjU2NiwxMi4zNzMsMTIuMzczLDAsMCwwLDEuMjguMDY5LDEyLjEzNCwxMi4xMzQsMCwwLDAsMi45NTYtLjM3OS43MjEuNzIxLDAsMCwxLC4wODktLjAxOCwxMS45LDExLjksMCwwLDAsOC43NS0xMC4yMiwxMS42MjksMTEuNjI5LDAsMCwwLDAtMi41MjdBMTEuOTA5LDExLjkwOSwwLDAsMCwyOS4zLDE0Ljc1NmEuNzIxLjcyMSwwLDAsMS0uMDg5LS4wMTgsMTIuMDI1LDEyLjAyNSwwLDAsMC0yLjk1Ni0uMzc3QTExLjg1MiwxMS44NTIsMCwwLDAsMjQuOTc2LDE0LjQzWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTQ5Ljg1MSAxMzMuMjQpIiBmaWxsPSIjMDAwIi8+CiAgICA8L2c+CiAgICA8cmVjdCBpZD0iYm91bmRyaWVzIiB3aWR0aD0iMTIwLjQiIGhlaWdodD0iMTIwLjYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDg1Ljg1MiA2OS4wMDgpIiBmaWxsPSJub25lIi8+CiAgPC9nPgo8L3N2Zz4K\"","import { styled } from \"@mui/material/styles\"\nimport Background from \"../Background\";\n\nexport const StyledBackground = styled(Background)(({ theme }) => ({\n overflowY: \"auto\",\n overflowX: \"hidden\",\n paddingInline: theme.spacing(4),\n [theme.breakpoints.down(\"sm\")]: {\n paddingInline: theme.spacing(0),\n },\n\n}))","import {TypographyProps} from \"@mui/material\"\nimport React from \"react\"\nimport {TextProps} from \"./types\";\nimport {StyledBackground} from \"./styles\";\n\nconst ResponsiveBackground: React.FC = (props) => {\n return \n}\n\nexport default ResponsiveBackground\n","import { styled } from \"@mui/material/styles\"\nimport { Button } from \"@mui/material\"\n\nexport const StyledButton = styled(Button)(({ theme }) => ({\n textTransform: 'none',\n padding: \"10px 25px 10px 25px\",\n backgroundColor: theme.tokens.color.primary,\n color: theme.tokens.color.conti_typo_button,\n borderRadius: \"40px\",\n [theme.breakpoints.down(\"md\")]: {\n fontSize: theme.spacing(1.6)\n },\n '&:hover': {\n backgroundColor: \"grey\",\n color: \"#fff\",\n },\n}))\n\n","import { StyledButton } from \"./styles\"\nimport { Box, Typography } from \"@mui/material\"\nimport React, { useCallback, useEffect } from \"react\"\nimport { ButtonProps } from \"./types\"\nimport { generatePath, useHistory } from \"react-router-dom\"\nimport ArrowForwardIosIcon from \"@mui/icons-material/ArrowForwardIos\"\nimport QrCodeScannerIcon from \"@mui/icons-material/QrCodeScanner\"\n// import Image from \"../Image\"\n// import { default as barcode } from \"../../assets/icons/Barcode.svg\"\n// import { default as barcode_conti } from \"../../assets/icons/Barcode_conti.svg\"\nimport { default as general_eancode_image } from \"../../assets/images/general_eancode.png\"\n// import { default as general_eancode_image_ate } from \"../../assets/images/general_eancode_ate.png\"\nimport {\n barcodeIconBase64,\n isAte,\n} from \"utils/Global\"\nimport { StyledBox, StyledImage } from \"components/Image/styles\"\nimport { scrolltToTop } from \"utils/util\"\n\nconst Button: React.FC = (props) => {\n const {\n hidden,\n text,\n path,\n isDisabled,\n type,\n onClick,\n isForwardIcon,\n isScannIcon,\n isBarcode,\n isOvverride,\n isFlexFlow,\n width,\n } = props\n const history = useHistory()\n\n\n const handleClick = useCallback(() => {\n if (isDisabled || type !== undefined) {\n return\n } else if (path.includes(\"http\")) {\n const win = window.open(path, \"_blank\")\n if (win != null) {\n win.focus()\n }\n } else if (path?.length > 0) {\n scrolltToTop()\n const currentPath = history.location.pathname\n history.push({\n pathname: generatePath(path),\n previous: currentPath,\n })\n }\n }, [history, path, isDisabled, type])\n\n const isOnClickOvverride = useCallback(() => {\n if (isDisabled || type !== undefined) {\n return\n } else if (path.includes(\"http\")) {\n const win = window.open(path, \"_blank\")\n if (win != null) {\n win.focus()\n }\n } else if (path?.length > 0) {\n scrolltToTop()\n const currentPath = history.location.pathname\n sessionStorage.setItem(\"imageVas\", general_eancode_image)\n history.push({\n pathname: generatePath(path),\n previous: currentPath,\n })\n }\n }, [history, path, isDisabled, type])\n\n const checkProps = () => {\n scrolltToTop()\n if (isOvverride) return isOnClickOvverride\n if (onClick) return onClick\n else return handleClick\n }\n\n return (\n \n \n
\n \n {text}\n \n {isForwardIcon && }\n {isScannIcon && }\n {isBarcode && (\n \n {\" \"}\n {\" \"}\n \n )}\n {/* {isBarcode && } */}\n \n
\n \n )\n}\n\nexport default Button\n","export const isCloudEnv = () => !!window.parent.primingcloud\nexport const isDevEnv = () => process.env.NODE_ENV === \"development\"\nexport const isProdEnv = () => process.env.NODE_ENV === \"production\"\n"],"sourceRoot":""}