\n
\n);\n\nexport const IconVideos = ({ className, color = '#ffffff' }) => (\n - \n {menu.map((item, i) => {\n if (item.hideIfPermission && hasAccessAny(item.hideIfPermission)) return null;\n return (\n
- \n {item.path ? (\n
\n {item.name}\n \n ) : (\n \n {item.name}\n \n )}\n \n );\n })}\n
- \n {openCourses &&\n openCourses.map((item, index) => {\n const coursePath = `${path}/courses/${item.id}`;\n const isCourseUnlocked = item.status !== LESSON_STATUSES.notStarted;\n const isActive = item.id === activeCourse && isCourseUnlocked;\n const Icon = isCourseUnlocked ? IconPlay : IconCourseLock;\n const isAllLessonsPassed = item.lessons\n .slice(0, item.lessons.length - 2)\n .every(l => l.status === 1);\n return (\n
- \n
{item.name}\n \n {isActive && (\n - \n {item.lessons &&\n item.lessons.map((lesson, index) => {\n const isLessonUnlocked =\n lesson.status === LESSON_STATUSES.inProgress ||\n lesson.status === LESSON_STATUSES.completed;\n return (\n
- \n
\n );\n })}\n - \n
- \n
- \n
\n My Subscriptions\n \n \n - \n
\n Available Plans\n \n \n
\n
\n \n \n 
\n \n {!account ||\n (isVisitorUser && (\n
\n \n
\n ))}\n {account && !isVisitorUser && (\n \n 
\n
\n \n \n Sign In\n \n \n Sign Up\n \n
\n \n \n
\n )}\n \n 
\n
\n \n {account.firstName} {account.lastName}\n \n \n \n Log out\n
\n \n
\n - \n {isEvent && event && (\n
- \n \n\n\n\n
\n RSNA 2020 \n \n )}\n {navs &&\n navs.map(nav => {\n const Icon = nav.icon;\n const isActive = activeState === nav.path;\n if (nav.hideIfPermission && hasAccessAny(nav.hideIfPermission)) return null;\n if (nav.permission && !hasAccess(nav.permission)) return null;\n if (nav.isProducts && !user?.lastAssignedEntity?.length) return null;\n return (\n - \n \n\n {/* {isActive && nav.name === 'Faculty' &&\n\n
\n } */}\n {isActive && nav.name === 'My Transcript' && (\n \n )}\n {isActive && nav.name === 'Subscriptions' && (\n \n )}\n {isActive && nav.menu && }\n \n );\n })}\n
\n Global Medical Education Breast & Skeletal Health\n
\n \n );\n};\n\nconst mapStateToProps = ({ account, authors, courses }) => ({\n account,\n authors,\n courses,\n});\n\nexport default connect(\n mapStateToProps,\n { logout },\n)(SideBar);\n","import { useEffect } from 'react';\n\nconst useOutsideClick = (ref, handler) => {\n useEffect(() => {\n const listener = event => {\n if (!ref.current || ref.current.contains(event.target)) {\n return;\n }\n\n handler(event);\n };\n\n document.addEventListener('mousedown', listener);\n\n return () => {\n document.removeEventListener('mousedown', listener);\n };\n }, [ref, handler]);\n};\n\nexport default useOutsideClick;\n","export const navigation = [\n {\n name: 'Faculty',\n path: 'authors',\n },\n {\n name: 'About',\n path: 'about',\n permission: 'vip_user',\n },\n {\n name: 'Support',\n permission: 'vip_user',\n menu: [\n {\n name: 'FAQ',\n path: 'faq',\n },\n {\n name: 'Contact',\n path: 'contacts',\n },\n {\n name: 'All Requests',\n path: 'messages/list',\n hideIfPermission: ['visitor_user'],\n },\n {\n name: 'Privacy Policy',\n link: 'https://www.hologic.com/privacy-policy',\n },\n {\n name: 'System Reqs.',\n path: 'requirements',\n },\n ],\n },\n];\n","/* eslint-disable react/jsx-no-target-blank */\n/* eslint-disable jsx-a11y/anchor-is-valid */\n/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React, { useRef, useState } from 'react';\nimport topLogo from 'assets/ACE-logo.svg';\nimport topLogoRSNA from 'assets/RSNA_logo.svg';\nimport useOutsideClick from 'shared/hooks/useOutsideClick';\nimport { Link, NavLink } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { IconArrowDown } from 'shared/components/Icons';\nimport { logout } from 'app/Auth/actions';\nimport { hasAccess, hasAccessAny } from 'utils/permissionHelper';\nimport { getEventId, getEventUrl, onOpenExternalUrl } from 'utils/appHelpers';\nimport { navigation } from './configs';\n\nconst HeaderNav = ({ openAdmin }) => {\n const eventId = getEventId();\n const dispatch = useDispatch();\n const [accountMenu, setAccountMenu] = useState();\n const [dropMenu, setDropMenu] = useState();\n const accountMenuEl = useRef();\n const dropMenuEl = useRef();\n const account = useSelector(state => state.account);\n const events = useSelector(state => state.events);\n const event = events && eventId ? events[eventId] : null;\n const isVisitorUser = hasAccess('visitor_user');\n\n const logoutProfile = e => {\n e.preventDefault();\n dispatch(logout());\n };\n\n useOutsideClick(accountMenuEl, () => setAccountMenu(false));\n useOutsideClick(dropMenuEl, () => setDropMenu(false));\n\n const isEvent = hasAccess('event_user');\n const path = isEvent ? getEventUrl() : '';\n const homeUrl = isEvent ? getEventUrl(true) : '/home';\n\n return (\n \n \n \n Sign In\n \n \n \n \n Sign Up\n \n \n \n )}\n \n
\n \n \n );\n};\n\nexport default HeaderNav;\n","import { useLayoutEffect, useState } from 'react';\n\nconst useWindowSize = () => {\n const [size, setSize] = useState([0, 0]);\n useLayoutEffect(() => {\n function updateSize() {\n setSize([window.innerWidth, window.innerHeight]);\n }\n window.addEventListener('resize', updateSize);\n updateSize();\n return () => window.removeEventListener('resize', updateSize);\n }, []);\n return size;\n};\n\nexport default useWindowSize;\n","export default __webpack_public_path__ + \"static/media/home-icon-2.d3f56506.svg\";","import React from 'react';\nimport Icon2 from 'assets/home-icon-2.svg';\nimport { IconArrowRight } from 'shared/components/Icons';\n\nconst DashBoxEvents = ({ onOpenUrl }) => {\n return (\n \n \n \n {nav.name}\n \n \n );\n })}\n {!isVisitorUser && (\n \n setAccountMenu(!accountMenu)}\n ref={accountMenuEl}\n >\n
{account.lastName}\n \n
\n \n )}\n {isVisitorUser && (\n <>\n \n \n \n \n
\n \n );\n return (\n - \n {isEvent && event &&
- \n
\n {dropMenu && (\n - \n {nav.menu.map((item, i) => {\n if (item.hideIfPermission && hasAccessAny(item.hideIfPermission))\n return null;\n return (\n
- \n {item.path ? (\n
\n {item.name}\n \n ) : (\n \n );\n })}\n
- \n {item.path ? (\n
\n 
\n
\n \n {account.firstName} {account.lastName}\n \n
- \n
- \n
\n Profile\n \n \n {(hasAccess('kol_user') || hasAccess('admin_access')) && (\n - \n
- \n \n Log out\n \n \n
\n
\n );\n};\n\nexport default DashBoxEvents;\n","export default __webpack_public_path__ + \"static/media/white-logo.680fa4d2.svg\";","/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React from 'react';\nimport dashLogo from 'assets/white-logo.svg';\n\nconst DashBoxInfo = () => {\n return (\n \n Upcoming Events\n 
\n
\n \n {\n e.preventDefault();\n onOpenUrl('https://hologiced.com/events/', e);\n }}\n >\n Show More\n
\n Medical Education Events
\n\n
\n );\n};\n\nexport default DashBoxInfo;\n// Welcome to Breast & Skeletal Health’s Advanced Continuing Education Portal for Physicians!\n","/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React from 'react';\nimport iconBreast from 'assets/dash/spec-breast.png';\nimport iconScreening from 'assets/dash/spec-screening.png';\nimport iconSurgery from 'assets/dash/spec-surgery.png';\nimport iconSkeletal from 'assets/dash/spec-skeletal.png';\nimport { useHistory } from 'react-router';\n\nconst DashBoxSpeciality = () => {\n const history = useHistory();\n\n const goToCourses = type => {\n history.push(`/allcourses/${type}`);\n };\n\n return (\n \n 
\n
\n \n Welcome to
Breast & Skeletal
Health’s Advanced
Continuing\n Education Portal for Physicians!\n
\n
\n );\n};\n\nexport default DashBoxSpeciality;\n","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIsAAABwCAYAAAAuTIMlAAAAAXNSR0IArs4c6QAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAi6ADAAQAAAABAAAAcAAAAACW+GIKAAAOWUlEQVR4Ae2de/BVVRXHfz8VQTGEyleiJA8d8Q1aFkbTkI4YTRFDL189xMZnOj2Mmukfs7FmcMZGHK20kiF0zNJC+MMeSKDgqxFBSSsdhBj5AYWA8qbPl+51jse9zn2cvfe99/fba+Y755y191lr7XXW3e9zbvfevXsP6urqugxcDY4Ce0Gi5AF5QLHwAripu7t7bjfBciUXt4FukCh5wOWBnTBPV7C8xMlIV47ESx7IeOCW/bh4T4aRTpMHLA8crGDZY6UmfvJAxgN7FCyJkgfq8sABRi7VNqeBTUZ6YvdOD2j08zFwj6t4VrAo71qGSxtcNyVe7/UAA54eq3RFzVBRmiUv8TvfA+YUSgqIzn+40UqQgiWaqztfUQqWzn+G0UpQ1MGNZkRS1LwH6JCqj/EucCDYyqDkzealFd+ZapZi/3RCqtb2ngbLwQKCZ1Qoo1PNEsqzEeQSGBNRo0XgKh3ByRPwT6CGWVdl+jqmmsWXJ1sj51KH2sHwxjv4pVkpWEq7sKUCrCZnVwirUrCE8GoEmTQ16kKMMFStNPil2ClYSrmvpTePQ/uhDgu2wtMeJe+UgsW7S6MJnGZoup/O7W4jrRQ7BUsp97XmZpogzalMdmjXqvFvHHwvrBQsXtwYXcgxaDzYofV1eJpzCUIpWIK4NbhQBYuLXoO5xZXgg5eCxYcX48v4gKHyVfhvGGml2SlYSruwJQImGFoX0bkNtqc6BYvh9XZl07nVS4EfMuybb/C9sFOweHFjVCGaX9Eqc556qFWW5pk+r1Ow+PRmHFnaUO2iRS6mT14KFp/eDCyLJkjP64OGmsUG3xs7BYs3V0YRpMm4YYamZQbfGzsFizdXRhF0CFqsOZYg60HZUqVgyXqj/c8vwMT+DjO10UlzLEEpBUtQ93oX/gVDYrDFw6y+FCxZb7TxOZ1bNUHWZNzsGKanYInhZT86RiKmn0PUenjPOfjeWSlYvLs0mMDDDMlaPNxppHllp2Dx6s6gwtYY0lXjDDHSvLJTsHh1Z1BhLyJdtUieNDq6OM8McZ2CJYRXA8hk3Uc79u82RE8z+F7ZKVi8ujO4sF+gYbdDyyhGS/osbVBKwRLUvd6Fr0ai1Xc53ru2nMAULDmHtPnlDux72bDxJIPvjZ2CxZsrwwuqvOLxN0PThw2+N3YKFm+ujCboUUPT2QbfGzsFizdXRhO0wNA0gk7u+400L+wULF7cGE8ITdF/0Wa9G3ROSEtSsIT0bjjZ1l7bj4RT2dWVgiWkd8PJXmKIPpmmaH8jrTQ7BUtpF7ZEwD8Mre+Gf5CRVpp9QGkJhgAiXO/ijgDaN7qKttb8crMhIrFtD7jWiJS7GixBXmENWbM8hPGqLheD5QTPWI6J/HhA2yhdpNXnQa4EH7wgwUJg/BzjPg5Uu2hV9HAwG752eyUq6QFqadUcKxxi+sE71cH3wvIeLATEACz7qsO6o+EFi3qHvqZZlGF/cBgYBjR/MRwMBYOA+W37phU2d+Mi47ZgM7kh+ixWALaLkw0f/59NMCjQvwL0fo5qRvloL9C6zL7vn5BnBr9ua/hKtii0EC1fc2gKtkYUIli0hK69F3nZGtIJbUc8fDWVcvzXwfACA99bSf8M9yzg/EaCxpp+LxDjJekJQ8oYbNsPu7x/TcGqBQw76mIrUPQRvDypPdU3WtuKcKz6UY+AW0FRoGTtVtBPAPqi9TXZhFjnBIOGz5sd+vThZNeHCR1ZG2N5DxYKoZpllcMM6WqrP+/kQQ/FJnUUy8x8zkDOXY7yxmBtNJS4vrJgZK2f7T1YKqpdey7UZ1Enty2IB6yaTtsUjy1pkORcirxpJeU0c7v1lafOqFkqJf6XUfIxBr8V7JtReq4nxWqWfkrAnO5JXr1ithkZBxr8UuxQNcvjhlXBeuqGPiebh6p+yiXOxHLMH5S7veG7txt35AcXRrbG2EGEYsKTQMPN/HD5bB5UP/o1UV6KKnDFdNI0simiDSQq6JcB9QE0A11rDmMC5Tuc8lkzrIjwSvJxNAoSLDjrZZwmZ+cfiNpSdSpdfZoohcYuzZ18t4ay50kfQzne9svl3knw7wOS4SJNSH4fXO1KDMCznp8GGd4pVDMkQ/9tWHuCwY/FPrGGojWkn5cPFN0Dby6Hy3ReQFMIqv4F6T6TLD1WX6aU7pDB8k/DsjMMfiz2UTUU/ZCgUMA4ibQ5JGiB1CI1Wfka1cpblm/VcJvKCnbdHzJYnnYphDfe4Mdia9KqiJ4tSqykqU9mkUZGsdbAFJgu0rKEdwoZLH8yrB1PNa3RSKtID7OINANdi1rdQe/Ch1rJd9Vg/4GvfbreKWSw6NfnMlpV56XeS1K/wJ4aWUfUSFdyUb9rD+lv1iGjbBa9+uEK/GdoKusJ+Ib1BwsWDFaP/PeGRdP4ZQTTbeisstdXT4zj9QZ/Hxu7NZo7vyCPHlQtHQW31530aSNnURNp3FIfO/QDewAz9EvL03EwXFVoPl+I65U1hJ5JQNwD3vGrhaf3iReAd6RlZP6ZH8qWzLX3U+zoh9AphuD5Br80O3SwPIOFripZHcDPl7a+CQE8SDVDtRx6MXke46FMBacDBdD34D0Hipop/TBuBKHpWBS4OtFq9v8eTDlOWA/ytBuG9VmqhmxBzry88Mr1Do7W0K8hHY1mRu8RYGfFjqLDnkq+XUWZMmlPNWpLM/nRd0FGZ/b0eS4GNiOzeg/3T8wKzJzPDF2zyIYrgWv0oKq0VR1d1S5Wf4qkt0jLFZolLWp23srMya3Zi4DnVq2sWsVaiS5tTvBgodp/BSsfNSy9gsit90EYIhpnY5Oai2nAmmVuVKjWaO5G7qxGb2w0P/7SniArWGZjg2wJQsGDpWL1rw3rT4b/DSMtKBunbkTBZz0peQU513qSVUvMt8igWjlPG2A8mGf6vI4VLJoif8VhuKr5b/NracnIiIBZjP7xoEwN81vuPxVZrq2kJPkj/NQfaZ80JM7ChiDzK1V9UYKFQmxDoX55mnvJk6rV6/LMWNfY9ld0nQHUh3GN3CxT1O/5DvdPAUGHyhkDJnE+OnOdPf1d9iLIOdEadDRUNRo9A8Fq4CKNNs6t5m3FEf39wPFAL8NppGbRGhJUGx4NVDNGIXQNAZuBi9bCtLYrNGQfcszRkBcF9VjDr28rhkwl70KQ16tO7o+BfuEtIezTiO1FcCF2qhY8BQwDGoqqQ7wRKH1FJS+nUekKtB3i0Kjaeio2BW2C9unFMVFqlmoh0XcfsOhXJEQfHVVta9cjPtHbkBYtJcHV4W2qOMgya5YofZac1erNW/RFEiZbiX2RXwkEdaIt0oturnksK3/T/OjBQsFWYe1FwFVtqnmahYPOarpEve/GGyiS5Y+H8efcaEXmwURthlQwdOrFc01NW/QSCdrP2qcJH0y2HARfSzJWEDXtN2S2VTOkvazqlI0DK41SjYS/DMOPMdJ7PZuyj6WQPyso6LX48cmCdO9J0ZuhagkoqHZ0XQNccy/KNgrMwWnv00VfIso8gvJq3kRzUC5ajP9muhJC8loWLCoUBf4jB025a2jqItU+f8B5faZJoqzHUWYtCFq16nbSpoLo1NJgqZT2IY63FZR8DGnP4sThBXl6RRJlPImC/AVY0wca9WjGeG1LCoyB0Tu4roJixx2giFaReJ7r3t7Ao2zqWG4ocMA20rTdIyhV7HCZMVMjk7YIFnkAWx5xWZnjXR7UWy0QTvkuz5XRdXlLDNNQbI6G2i1YBmCsOrW16H4yWG16DJ960UEZBoMHQNFalHbr/Qjkl0i82JAXgp7OCJaq4Risz1fUoh4yTAIHV+/rlCM2a57pc8BaWCVpH6npmQmiBIr8h66OCxY58wZQi7RavRgM7aBA0f5fzSHtBLXo+tjlwqDOCpZKhHdjuF4yX1fLo6RvAWq+tPOuLQnbTgS/BBtBLdJWhJYMj9HbecFSfeIYPxpoaUBtdy3aTgY1YWNBy+dmsKE/OAXcCep9Q0DTBNoe0RJCd+cGizxGAbQx6SegXlKHUetLl4EDY3tdOsF1QLVIUeeV5LfR7VxFtzfrH/R3drBUC0NB9L7MCtAIrSXzg+AqcBrw3llEpoJjHJgO5gPXdARsk14g5RPAu21V39V7xAYzWFpuXL2FUD5mLudxmEeBZnD8EhgCam1tPJI8n6qAQ9er3C85j4GngPbPvgE0jb4D7ETPW8sP5JV8+Um/eEGbprV7Tus25wBt+BZkS6O0iRtmg+nofL3Rm2PnVydyPUrzC1Zy1pEUoCe2QfXqw26NgG4GF9Z7jyOfps8VJMKuCvQKqAJI15p2PwgoELQbTUGjowJGgWNNy5NUk2aR45ugBz8He9enphW5DPh1Iiz9mPJ0e0fVLFnrcfBqri+icFpXugpo9KCH2AjpwQvZva1HNyKgwbwKRL3bcwf2L23w3pZnb4eFxFJOwOlLwMUI0WrtXWAN2A3ahVR7KbDvBKOx9cug4wJFzuzYmkXGZ4kHoJVYjX4O43gm0F4ZVamtIr2D9DC4HSzDvg2tMsSX3l4TLFWH8FDUz9InNTQq0fqROp8fBWcBvaClvkYIUhOzHDwNFoDHsGUdx15DvS5Ysk+Gh/Uq17Mr0HyNap0J4HygbYu6VvAI8oU6rGqaNQKqjrLU2VcHVEd1etWsaNSktyxfAkuA9qAsRJ86yr2WenWw5J9apda5F/69BI4C41CgYfAgMAAoaMQTFDQKki1gM9DwWkGyFYi3BXk69hnqU8GSfao8aHWC9ZahkKgOD3T8aKiOMqYsnjxQVLNom4Cq5UR9ywNmTFgJqnHUeVObnahvecCKicJ5luysZt9yVyqt0wOqQVK/xemaxMx5oFuBomFhouSBWh7YpWDRmkWi5IFaHpijzsxtYDC4BGhyKlHyQNUDGuC8Bm5iXurx/wEBX2YaGtqzlQAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHAAAABwCAYAAADG4PRLAAAAAXNSR0IArs4c6QAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAcKADAAQAAAABAAAAcAAAAAD9SnOLAAAPBklEQVR4Ae2dCaxcVRnHW0CE0iJLkU1aHpSlrAVZUkAiVAl1oZpgQAwIEYgbQZRoYtRgoiZEEyFpGyKYojEEMcE2AgYXlqpQliqlbAUKr49XutgVCnQB6u9XZ9rJvFnucubOeTPzJb/embnnnvud7z9nv/M6YkTPtkVg69atO8PH4SnYBEvhZuiDD/TCFHEEEGgknAGK9z6UzdevwJWwZ8RF6G7XEGcM3A7vQrUp4gq4Gnbu7khFWnqEOQHWQT1TxHmwb2xF2Ck2h9rkzyXc90MN7j2Sc0fD3g3StOVU1wtIrRpF5L+QIPqKKFFZ1wuIGifB+ASqLCPNmwnSFZqkJ+CIEZ8m4s0GJ1tJ8wi8Uag6CW7W1QLSfO5BjM5MEKc1pPkbvJMgbaFJulpAIj0RxjWJuLVvPjw0cuRIX0dl3S7gKaixTxNFNnP+HrAPjM52yesRzZB5uNRUHqGlOZbT6oavy+/THrdw7eo0NaQ0+jyV60ZDI1vLydlp8m6UWehzuQXEoSkwDXYDa3QZBwZpXpu23jXV56rfv8S1F8BbkNQOJ+FkMK9Gdj/ivdYoQTvPhRDQ1YmLoFlT1MpyOgk/FJ5NcZMvkXZCgvSPJUjTtiTNvn1JHFtEonbPj1xo/jnNojW4qZHuOhJdD0l2GfZvmuFwTkAwxsICaLe5Xun2z0TYA8r96Ahe7wL6eTrMhFqL1nxc0/r59EQI8WUPLvX2QmbNmYL5rZ8DTojbbY4YX4CnYAnYJ9pNjAWbyxPgYEhUU0mnvQ+Pw00wh/5wI8doLLeAlgQRLdy10ZQKl/DFkel7YM1RRI9Zy6uIq+Gf8Ct4GCGjmNRnLRBl2GEI+HXezdjxSUe/UszFcDfcCY5Q30RQa3/hFkrAqXh+X+Het/+G1kJHqS6zzYNnYCViFrZiE0pA+xb7nSD5kc9wMsWyqV4KTmMehHvhhSKEDBJwmtADcHgAkgzLSdaxppjvgtMqW6RfwNOtFDKUgM7D7As89mxHBDbwcjZMh4UI+faOU2FehRJwV9yxBnb2pDdbzK2Vy8GpliPYBQjpQCiIObQOYfYB0rOhEbCSHAhXwy1wPl1OqLiHGXSUHLIGOkmO1awJmn2UQ34n+SvA+Z2Tc3clXM/dD3YH+/O880eyGGL9fHI+tdAlyNymgyHMlY00qxsh7pkmD5usQXCU+Cg8BM/BOgK5veXgi2g8XBjvg0lwMhwL48GBml1F3m7HvL4J10BuCyWgBftgbm/CZ2Cts2X4I/wZ/gOrEK1cG3m7w/jc2mmNlCdLLYvN3zHwUTgXJoOPYmQV0uuOgniMgu4PmyEmc8F6NrgQnfvLRR7+dmIvOBluhTWQ1X4Qj3p4QiksVCzmroRPWf8I3GQObuTrbymOgtvAH8H4Yxjvm8T07bjgTuXJEIcuS+J5AWkM4otwKWRt4lKFgvscDz8Gt9Teg0amf3MgrvkyDk1v5HWB55Zxr8shd5OZRkXvB5PghzAA9WrjWs5dBcGmEWn8rJkWZ/aEJyAG+wlOtDU43H88zIItUG338IF7k8EsdzODQ47MZoFzQIOXO0/yyGJPc9HZjCTXp72YMjjnO6SE0wXNacdL5Ldy27sU/5CfU6pz4KswEcx/CVxLfk5fglnuYOOsw+spYLs+Chw4OBH2aFNWTXnKYaF8LZWTZgvvF6GSZn5uIv3FBMd1x1SG/x/hgstgKjjn2wucZqyCB+EG8n2BY2ojb+MwAYzLIvJZlzqTJhc0C0yTy/9/Gkcrg+1rRaik8rNy2mqhnJMqpseyoOVj+UtQKXhZeNO4aPxrApRqlxy/FexmOAvMrzoeLgA8Cp8i7zc49iyWCCCec7o7oNnI8W3SfDYWv6v9sDZ0q9n0nwdJYpAkTVviGK1jBUTjHO7h4nUzs3le0CxRu853s4DnEvTqPq+WDo/w4ZJaJ3qftSkC9GmjYDU0M/vHaW1ys3fbehFAFP8qRZKns11VcechWuvWJvQkFHEa08yeYPrgxm+01q0CnpFQkSC75gnvlSlZ1wlIk+gK0ScSRssVlKit6wREDZvPcQlVmYLg5bXRhJcUm8xlq8xG4VyhuDJzBuEv7CfLn9FvraiVdan2XcG5pOU+hrSzue47HOeR7/bnZ2rlP+w+o2BngzvMsdgqHHE/cMgAhc/cs/syuGeYxtzb2wB/gmlwMLiF5hps2y3JRLaukxTiUE7eCafXTVTsCXcR3Fa6Ef4CjiDHwJHwGXDXwYeUspbbxe3XYT4sBHcp+mEAVlBDfVyxUMtakG1OIqBzpBlwKcTSnyriMnDfbT34mKB9Xh+ErDU2py6z2VyvhNdAQV128/HFJQjqbxRbakn7gppO4OBbiPg8J92Pc+8rBvNLeRBY0yot15e1MqPSa5tpvxxyBPjFUVQfTTQeNtWPcXwAHiZW1tLglrtQOGnTdBvsH9y7zslwI0VZDHY3v0FMa2sQC9HsvYgnbwbxpnMzce7p5vH34Xq+9MHmlyEEHMQp+4CeNY+A3cwlML550mQpcgtIc+Bv3pYku10vFRHYF3yEI4jlGsRUeOBAZriagw9Hq04PPDoQMS6jwQec9gZrTu4vO3lojjtcIAhioQR8JYg3xWaymds5l3sQ5sEA+OCSo0inG06RFPDDcBjYh50EfeBDVnksWB8YSkALP1zMudlcmA4K50/MHCXWNQYdCmotNPAKOBUugONhJ0hrq9NeUC+91Tm3UcAJZLIIshQm9/0TZmDz+C+4CcH+mvCauskos/PAifB5+CQcDvZvu0KjuFrDL8SHORxzW6MbJc6cwowlsXMbh8uxmX2cXy5r3O8JnA/sBjXK72T+FDgbJsOJsB9Ux7fsy3n4EWwuyH3yGQXwj8vl+b0cl7fEXIj+O5wKLW8dvAccAP43Pv5i6TmofHTDH7d8C2yS4zEdgrSr/FzSUlO8hWA/1Rbj3rvB58CflP0DLoKg4lVX8UwFxSm/3a+Ci8axmAOFr4Tqa2IpVLUfoZoV2/b3qzNv43v9uR3ua6MPhdw6lICFOJviJm4n/ZTal3g7h1ZkNBwOweZoKfzNnDSUgDbFoeaUmQtTutDa51+ZX5s0I0T7OGkfBxfmX+b9FRDjiBr3WmAUdldYDjHYRpy4MGkxSTsOFlc57lPbPprhnC5qC1UDLWje5aVQgVpJRg6oktqlJOyrSrw3779R4/OqZO1/G0pAmxuXmmIwBUy0P0kNs9l38l09Gve9k/FJELWFEtBvbNHNjX2dy1JuZzllcGXDFZcFkEhA0rmCcgDUMudrihi1hRp4HEgpq7/FIQru1GQT+HSZgxJZU4HLYr73qIgeHYFaC5OYX7xGLYc7EVFbKAGzTuCtRW7rrAeDPwhLwdrk8XXwc7d53DFQTPEaj+8y2nT/Lqu5XdSo5YilX69bvlACHsYdDKQ1phI/M9AKYK1QmH4YqDiu4PV6hDBd0eZf1rCprGeWJWoLJaDCzARF+i8oSvloE/dWmwTi1g1NARvFwD42amvkfBrHb0egWWkuiCStg5hGTWiQ+DDatZYfCC6sm+dc4mV/ntuCOIgz9mXD0RzENGpCDXpqQzAHdPtAeY/wY7y2mxkFnnOb6TLitpjXuSyIgLk8aNPFBNAplA8jN6qBp5HuRNI8R7C3rauWxNmZzxTeEazsAY5Yj4bTQOF87bladgYf+qsnd+YX1UqQ9LOuFZAAGVxrWKMY2MT+Fv5AsJdzdFDmyNTR61g4CA4GR+F+GeoJxqkhdhSfXEu+30XEDUPOdvMH1hJwdaiucf4QmAtu/DYyz7ur/g74V5tca/V9s+tI0tC83jVYa2tma/Tty5xpkRcSAJszm6+JYDBOhhPgPc5N5ds9yOtaZu3xmmYLEJ73HhLSzHc8HIef8/Ez0zgiWgEplAW0n7F/GVOBge+DI8BmyMFBuS/zmrI5h/NvW1/H0b8UuD1AfKYYF4NPkbXT9MNyeMw0ZYlCQALqgMI5mX1SuU/x6HvXKq1himS/o6D6XSkWb4eYeU6BW2AG97gXEW0C7aeuhMuhWR4kabnpT2Y/CheQAHpPhfCb50jNZsyapFiK6FBb7MOsgQqR1bzeIfwx8DXu/SJHBxxngvdqt9kquFyYecUns/K1Sl4Sx6A5UnN4PhoURoGcxB4HimaNajR853THm+ItB/9Q7dyspQ1WAxHPpu6LMB76SkebQYfcwe5DXp1imyjIXbAgT4FCBtam7iqwhgWt2XkKGOG11jy3vm6C26h97sRktjz9S/VNV/DBHeBkt2e1I7CMj2fCZLgR8YxZLgtaU2hGJ+HNLHD5KWjeuUqZ7WIHFm4krwFribv862AD+PlGKH9ZLauVwemAZi3bDG+D1w+CAyj/W1avDWYhm1Cdeh7uBwcrofMmy0JsC3dZCPNKRwP/GrixbPC3IIICRWHBawm10JWQB8B1xOFkTqTnw3R4ApaC+5jRiIU/xRgi3gV51wrJohBzyc3/wOoacNrTMwLhNoyrHjGbXzB/7uWX7dieahURICD+X3v3Qcy2Eue+DW68DlsLOY3YHgT6DUdnv4PyKG37uUhe6NcNMANfHSUOW2uJgKVoPMbx1Qgj8w4+fQ/hZoKrIcPaWimgw+5/Q0yjOGve3eAqSEdYKwV0wvsUOKGNxWwRbi018bH4lMuPlglYCtIzeBdLH+PKykPwJHSMtUzAUoRe4ujCbQzmUph/9zroUla7C9ZqAQcpYO4F20BBcj3z2UB5RZNNqwX0266IMZiLz26gdpS1VECaK0egSyKJmH3gsJ82VMeypQKWbhZLH7gL/nTcWmcRAronFoPtjhM+4tFRVoSARdwjiSg+bHVIkoTDKY3NSqutqH1B+1v7OAdOLiK4e74YnPe5v+eiQizNOa6EsSIEPDSMq0NycVlMkdwtd4Wlv3R00OTrAXiDgZSDl461lgrIVo0P6E4IFD2X5FaCj+E9DT72oHBrQSGd520qjXx52R3WUgEJ4ZEwLkEobf40a4uPNohNYT88UuJxjgPdJhBlbmgtE5Da5+DlLDiohgcKZhPo8pZrpe5cWLteAR+Msna9DKs6vQmkjLmsZQLilY/PT4MxJQ/dh3NZzYGFQnm0//LhoUFQwA29GkYUUlgrBbyw5McvOc4Ha5U1TSFd1uq6/ooyB7f/AW/7vn4C26WeAAAAAElFTkSuQmCC\"","import React from 'react';\n\nconst Loading = ({ classView, classSpinner }) => (\n \n
\n \n 
\n
\n \n Breast
Screening\n
\n 
\n
\n \n Breast
Diagnostics\n
\n
\n \n 
\n
\n \n Breast
Surgery\n
\n 
\n
\n Skeletal
\n\n {!banners && \n {banners.map(item => {\n const isVideo = item.contentType === 2;\n const settings = {\n url: item.target,\n width: '100%',\n height: 289,\n controls: true,\n playing: isPlaying,\n light: true,\n playIcon: (\n {\n setIsPlaying(true);\n slider.current.slickPause();\n }}\n >\n \n 
\n
\n ),\n onPlay: () => {\n setIsPlaying(true);\n slider.current.slickPause();\n },\n onPause: p => startSlide(p),\n };\n\n if (isVideo) {\n return \n \n \n {isVideo && (\n \n
\n \n );\n })}\n \n )}\n \n );\n};\n\nexport default DashImageSlider;\n","/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React, { useState } from 'react';\nimport { useSelector } from 'react-redux';\nimport { useHistory } from 'react-router';\nimport Slider from 'react-slick';\nimport { IconArrowRight, IconCoursesNew } from 'shared/components/Icons';\nimport { findCourseFirstLesson } from 'utils/appHelpers';\nimport { DEFAULT_IMG_URLS } from 'configs/constants';\n\nconst DashBoxCourses = () => {\n const [activeSlide, setActiveSlide] = useState(0);\n const courses = useSelector(item => item.courses);\n const history = useHistory();\n\n const sliderSettings = {\n arrows: false,\n dots: false,\n speed: 500,\n infinite: true,\n slidesToShow: 1,\n slidesToScroll: 1,\n autoplaySpeed: 5000,\n className: 'home-courses-slide',\n autoplay: true,\n beforeChange: next => setActiveSlide(next),\n };\n\n const courseClickHandle = course => {\n findCourseFirstLesson(course, history);\n };\n\n const item = courses && courses?.[activeSlide];\n\n return (\n \n {courses && (\n \n {courses.map(item => {\n return (\n \n )}\n \n
\n \n );\n};\n\nexport default DashBoxCourses;\n","import React from 'react';\n\nconst ProgressBar = ({ progress, className = '' }) => (\n \n
\n );\n })}\n \n Available Courses\n
\n \n {\n e.stopPropagation();\n e.preventDefault();\n history.push('/allcourses');\n }}\n >\n Show More\n
\n {item?.name}
\n\n
\n \n {!hidePlay && (\n
\n \n {isLoading ?
\n )}\n {hasProgress && (\n \n
\n )}\n \n \n {bindDurationMinutes(item.watchedVideoDuration)} /{' '}\n {bindDurationMinutes(item.totalVideoDuration)}\n \n
\n \n \n {item.completedCases} / {item.totalCases}
\n \n
\n \n );\n};\n\nexport default CourseItem;\n","/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React from 'react';\nimport { useState } from 'react';\nimport { useSelector } from 'react-redux';\nimport { useHistory } from 'react-router';\nimport Slider from 'react-slick';\nimport CourseItem from 'shared/components/CourseItem';\nimport { IconArrowRight, IconTranscript } from 'shared/components/Icons';\nimport { courseSubsStatuses, findCourseFirstLesson } from 'utils/appHelpers';\n\nconst DashBoxTranscript = () => {\n const [activeSlide, setActiveSlide] = useState(0);\n const history = useHistory();\n const courses = useSelector(item => item.courses);\n const transcripts = courses.filter(item => courseSubsStatuses(item.status, 'active'));\n\n const sliderSettings = {\n arrows: false,\n dots: false,\n speed: 500,\n infinite: true,\n slidesToShow: 1,\n slidesToScroll: 1,\n autoplaySpeed: 5000,\n className: 'home-courses-slide',\n autoplay: true,\n beforeChange: next => {\n setActiveSlide(next + 1);\n },\n };\n\n const courseClickHandle = course => {\n findCourseFirstLesson(course, history);\n };\n\n const item = transcripts && transcripts[activeSlide];\n\n return (\n {item.name}
\n{item.description}
\n {hasProgress && (\n <>\n\n {item.progress}%\n
\n {getEndOfSubs(item.expire, item.expirable)}\n
\n \n )}\n\n {transcripts && (\n \n {transcripts.map(item => {\n return (\n \n )}\n \n
\n \n );\n};\n\nexport default DashBoxTranscript;\n","/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React from 'react';\nimport { useState } from 'react';\nimport { Api } from 'utils/connectors';\nimport { useEffect } from 'react';\nimport { useSnackbar } from 'notistack';\nimport Loading from 'shared/components/Loading';\nimport Slider from 'react-slick';\nimport moment from 'moment';\nimport { getError } from 'utils/appHelpers';\n\nconst DashBoxEvent = ({ onOpenUrl }) => {\n const { enqueueSnackbar } = useSnackbar();\n const [events, setEvents] = useState();\n\n const sliderSettings = {\n arrows: false,\n dots: false,\n speed: 500,\n infinite: true,\n slidesToShow: 1,\n slidesToScroll: 1,\n autoplaySpeed: 5000,\n className: 'home-events-slide',\n autoplay: true,\n };\n\n const openEventPage = event => {\n // Temporary closed the click for 1st event\n if (event.id === 1) {\n return;\n }\n onOpenUrl(`${window.location.origin}/events/${event.id}`);\n };\n\n const getEvents = async () => {\n try {\n const { data } = await Api.get('/events/events');\n setEvents(data.data.results);\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n useEffect(() => {\n getEvents();\n }, []);\n\n if (!events) return \n
\n );\n })}\n \n My Transcript\n
\n \n {\n e.stopPropagation();\n e.preventDefault();\n history.push('/courses');\n }}\n >\n Show More\n
\n \n
\n );\n })}\n \n \n {event.banners.map(item => {\n return (\n \n
\n \n 
\n
\n );\n })}\n \n
\n {event.subject}
\n \n \n Hologic Webinars
\n \n Hologic Webinars
\n
{label}
\n \n {!isExpired && (\n\n {moment(event.startDate).format('MMMM DD')} -{' '}\n {moment(event.endDate).format('MM/DD/YYYY')}\n
\n )}\n\n {authors && (\n \n {authors.map((item, i) => {\n return (\n
\n );\n })}\n \n )}\n \n
\n \n {item.map(author => {\n const prof = author.profession ? `, ${author.profession}` : '';\n const secondRow = `${author.surname}${prof}`;\n return (\n \n
\n );\n })}\n \n 
\n
\n \n {author.name}\n
\n {secondRow}\n
\n
\n \n );\n};\n\nexport default DashBoxAuthors;\n","import React from 'react';\nimport { IconArrowRight } from 'shared/components/Icons';\n\nconst DashBoxMarketing = ({ onOpenUrl }) => {\n return (\n \n Faculty\n
\n \n {\n e.stopPropagation();\n e.preventDefault();\n history.push('/authors');\n }}\n >\n Show More\n
\n \n
\n );\n};\n\nexport default DashBoxMarketing;\n","import React from 'react';\nimport useWindowSize from 'shared/hooks/useWindowSize';\nimport { getSize } from 'utils/appHelpers';\nimport DashBoxEvents from './components/DashBoxEvents';\nimport DashBoxInfo from './components/DashBoxInfo';\nimport DashBoxSpeciality from './components/DashBoxSpeciality';\nimport DashImageSlider from './components/DashImageSlider';\nimport { confirmAlert } from 'react-confirm-alert';\nimport DashBoxCourses from './components/DashBoxCourses';\nimport DashBoxTranscript from './components/DashBoxTranscript';\nimport DashBoxEvent from './components/DashBoxEvent';\nimport DashBoxAuthors from './components/DashBoxAuthors';\nimport { hasAccess } from 'utils/permissionHelper';\nimport DashBoxMarketing from './components/DashBoxMarketing';\n\nconst Home = () => {\n const isVisitorUser = hasAccess('visitor_user');\n const [width] = useWindowSize();\n\n const onOpenUrl = (url, e) => {\n if (e) e.preventDefault();\n if (!url) return;\n confirmAlert({\n message:\n 'A new browser tab will now be opened. You can close it at any time and come back to this tab to continue.',\n buttons: [\n {\n label: 'Continue',\n onClick: () => window.open(url, '_blank'),\n },\n {\n label: 'Cancel',\n },\n ],\n });\n };\n\n const zoom = getSize(width < 780 ? 780 : width, 1, 1);\n\n const dashStyles = {\n transform: `scale(${zoom})`,\n transformOrigin: `top center`,\n marginLeft: (1366 * zoom - 1366) / 2,\n marginRight: (1366 * zoom - 1366) / 2,\n MozTransform: `scale(${zoom},${zoom})`,\n MozTransformOrigin: 'top center',\n };\n\n return (\n \n
\n Hologic Products
\n\n {\n e.preventDefault();\n onOpenUrl('https://www.hologic.com/womens-health', e);\n }}\n >\n Show More\n
\n \n
\n );\n};\n\nexport default Home;\n","import React from 'react';\nimport { connect } from 'react-redux';\nimport { Api } from 'utils/connectors';\nimport { useSnackbar } from 'notistack';\nimport { getError } from 'utils/appHelpers';\nimport { getAndUpdateProfile } from 'app/Auth/actions';\n\nconst UserImage = ({ url, userId, getAndUpdateProfile }) => {\n const { enqueueSnackbar } = useSnackbar();\n\n const uploadImage = async ({ target }) => {\n const file = target.files[0];\n const formData = new FormData();\n formData.append('file', file);\n\n try {\n await Api.post(`/api/image/uploaduserimage/${userId}`, formData);\n await getAndUpdateProfile();\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n return (\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n {!isVisitorUser && (\n \n
\n \n
\n )}\n \n
\n \n
\n \n
\n \n
\n \n
\n \n 
\n \n \n
\n );\n};\n\nexport default connect(\n null,\n { getAndUpdateProfile },\n)(UserImage);\n","import React, { memo } from 'react';\n\nconst Button = ({\n children,\n disabled,\n type = 'button',\n className = '',\n onClick,\n disabledClassName,\n}) => (\n {icon}
}\n \n {topLabel && }\n \n {label && }\n {items &&\n items.length &&\n items.map((item, index) => {\n const { code, id } = item;\n const value = useProperty ? item[useProperty] : code || id;\n return (\n \n );\n })}\n \n {hasCustomRightIcon && }\n
\n ),\n);\n\nexport default Select;\n","export const countries = [\n { name: 'United States', iso: 'US', iso3: 'USA', numCode: 840, phoneCode: 1, id: 226 },\n { name: 'Australia', iso: 'AU', iso3: 'AUS', numCode: 36, phoneCode: 61, id: 13 },\n { name: 'New Zealand', iso: 'NZ', iso3: 'NZL', numCode: 554, phoneCode: 64, id: 153 },\n { name: 'Afghanistan', iso: 'AF', iso3: 'AFG', numCode: 4, phoneCode: 93, id: 1 },\n { name: 'Albania', iso: 'AL', iso3: 'ALB', numCode: 8, phoneCode: 355, id: 2 },\n { name: 'Algeria', iso: 'DZ', iso3: 'DZA', numCode: 12, phoneCode: 213, id: 3 },\n { name: 'American Samoa', iso: 'AS', iso3: 'ASM', numCode: 16, phoneCode: 1684, id: 4 },\n { name: 'Andorra', iso: 'AD', iso3: 'AND', numCode: 20, phoneCode: 376, id: 5 },\n { name: 'Angola', iso: 'AO', iso3: 'AGO', numCode: 24, phoneCode: 244, id: 6 },\n { name: 'Anguilla', iso: 'AI', iso3: 'AIA', numCode: 660, phoneCode: 1264, id: 7 },\n { name: 'Antarctica', iso: 'AQ', iso3: null, numCode: null, phoneCode: 0, id: 8 },\n { name: 'Antigua and Barbuda', iso: 'AG', iso3: 'ATG', numCode: 28, phoneCode: 1268, id: 9 },\n { name: 'Argentina', iso: 'AR', iso3: 'ARG', numCode: 32, phoneCode: 54, id: 10 },\n { name: 'Armenia', iso: 'AM', iso3: 'ARM', numCode: 51, phoneCode: 374, id: 11 },\n { name: 'Aruba', iso: 'AW', iso3: 'ABW', numCode: 533, phoneCode: 297, id: 12 },\n { name: 'Australia', iso: 'AU', iso3: 'AUS', numCode: 36, phoneCode: 61, id: 13 },\n { name: 'Austria', iso: 'AT', iso3: 'AUT', numCode: 40, phoneCode: 43, id: 14 },\n { name: 'Azerbaijan', iso: 'AZ', iso3: 'AZE', numCode: 31, phoneCode: 994, id: 15 },\n { name: 'Bahamas', iso: 'BS', iso3: 'BHS', numCode: 44, phoneCode: 1242, id: 16 },\n { name: 'Bahrain', iso: 'BH', iso3: 'BHR', numCode: 48, phoneCode: 973, id: 17 },\n { name: 'Bangladesh', iso: 'BD', iso3: 'BGD', numCode: 50, phoneCode: 880, id: 18 },\n { name: 'Barbados', iso: 'BB', iso3: 'BRB', numCode: 52, phoneCode: 1246, id: 19 },\n { name: 'Belarus', iso: 'BY', iso3: 'BLR', numCode: 112, phoneCode: 375, id: 20 },\n { name: 'Belgium', iso: 'BE', iso3: 'BEL', numCode: 56, phoneCode: 32, id: 21 },\n { name: 'Belize', iso: 'BZ', iso3: 'BLZ', numCode: 84, phoneCode: 501, id: 22 },\n { name: 'Benin', iso: 'BJ', iso3: 'BEN', numCode: 204, phoneCode: 229, id: 23 },\n { name: 'Bermuda', iso: 'BM', iso3: 'BMU', numCode: 60, phoneCode: 1441, id: 24 },\n { name: 'Bhutan', iso: 'BT', iso3: 'BTN', numCode: 64, phoneCode: 975, id: 25 },\n { name: 'Bolivia', iso: 'BO', iso3: 'BOL', numCode: 68, phoneCode: 591, id: 26 },\n { name: 'Bosnia and Herzegovina', iso: 'BA', iso3: 'BIH', numCode: 70, phoneCode: 387, id: 27 },\n { name: 'Botswana', iso: 'BW', iso3: 'BWA', numCode: 72, phoneCode: 267, id: 28 },\n { name: 'Bouvet Island', iso: 'BV', iso3: null, numCode: null, phoneCode: 0, id: 29 },\n { name: 'Brazil', iso: 'BR', iso3: 'BRA', numCode: 76, phoneCode: 55, id: 30 },\n {\n name: 'British Indian Ocean Territory',\n iso: 'IO',\n iso3: null,\n numCode: null,\n phoneCode: 246,\n id: 31,\n },\n { name: 'Brunei Darussalam', iso: 'BN', iso3: 'BRN', numCode: 96, phoneCode: 673, id: 32 },\n { name: 'Bulgaria', iso: 'BG', iso3: 'BGR', numCode: 100, phoneCode: 359, id: 33 },\n { name: 'Burkina Faso', iso: 'BF', iso3: 'BFA', numCode: 854, phoneCode: 226, id: 34 },\n { name: 'Burundi', iso: 'BI', iso3: 'BDI', numCode: 108, phoneCode: 257, id: 35 },\n { name: 'Cambodia', iso: 'KH', iso3: 'KHM', numCode: 116, phoneCode: 855, id: 36 },\n { name: 'Cameroon', iso: 'CM', iso3: 'CMR', numCode: 120, phoneCode: 237, id: 37 },\n { name: 'Canada', iso: 'CA', iso3: 'CAN', numCode: 124, phoneCode: 1, id: 38 },\n { name: 'Cape Verde', iso: 'CV', iso3: 'CPV', numCode: 132, phoneCode: 238, id: 39 },\n { name: 'Cayman Islands', iso: 'KY', iso3: 'CYM', numCode: 136, phoneCode: 1345, id: 40 },\n {\n name: 'Central African Republic',\n iso: 'CF',\n iso3: 'CAF',\n numCode: 140,\n phoneCode: 236,\n id: 41,\n },\n { name: 'Chad', iso: 'TD', iso3: 'TCD', numCode: 148, phoneCode: 235, id: 42 },\n { name: 'Chile', iso: 'CL', iso3: 'CHL', numCode: 152, phoneCode: 56, id: 43 },\n { name: 'China', iso: 'CN', iso3: 'CHN', numCode: 156, phoneCode: 86, id: 44 },\n { name: 'Christmas Island', iso: 'CX', iso3: null, numCode: null, phoneCode: 61, id: 45 },\n {\n name: 'Cocos (Keeling) Islands',\n iso: 'CC',\n iso3: null,\n numCode: null,\n phoneCode: 672,\n id: 46,\n },\n { name: 'Colombia', iso: 'CO', iso3: 'COL', numCode: 170, phoneCode: 57, id: 47 },\n { name: 'Comoros', iso: 'KM', iso3: 'COM', numCode: 174, phoneCode: 269, id: 48 },\n { name: 'Congo', iso: 'CG', iso3: 'COG', numCode: 178, phoneCode: 242, id: 49 },\n {\n name: 'Congo, the Democratic Republic of the',\n iso: 'CD',\n iso3: 'COD',\n numCode: 180,\n phoneCode: 242,\n id: 50,\n },\n { name: 'Cook Islands', iso: 'CK', iso3: 'COK', numCode: 184, phoneCode: 682, id: 51 },\n { name: 'Costa Rica', iso: 'CR', iso3: 'CRI', numCode: 188, phoneCode: 506, id: 52 },\n { name: \"Cote D'Ivoire\", iso: 'CI', iso3: 'CIV', numCode: 384, phoneCode: 225, id: 53 },\n { name: 'Croatia', iso: 'HR', iso3: 'HRV', numCode: 191, phoneCode: 385, id: 54 },\n { name: 'Cuba', iso: 'CU', iso3: 'CUB', numCode: 192, phoneCode: 53, id: 55 },\n { name: 'Cyprus', iso: 'CY', iso3: 'CYP', numCode: 196, phoneCode: 357, id: 56 },\n { name: 'Czech Republic', iso: 'CZ', iso3: 'CZE', numCode: 203, phoneCode: 420, id: 57 },\n { name: 'Denmark', iso: 'DK', iso3: 'DNK', numCode: 208, phoneCode: 45, id: 58 },\n { name: 'Djibouti', iso: 'DJ', iso3: 'DJI', numCode: 262, phoneCode: 253, id: 59 },\n { name: 'Dominica', iso: 'DM', iso3: 'DMA', numCode: 212, phoneCode: 1767, id: 60 },\n { name: 'Dominican Republic', iso: 'DO', iso3: 'DOM', numCode: 214, phoneCode: 1809, id: 61 },\n { name: 'Ecuador', iso: 'EC', iso3: 'ECU', numCode: 218, phoneCode: 593, id: 62 },\n { name: 'Egypt', iso: 'EG', iso3: 'EGY', numCode: 818, phoneCode: 20, id: 63 },\n { name: 'El Salvador', iso: 'SV', iso3: 'SLV', numCode: 222, phoneCode: 503, id: 64 },\n { name: 'Equatorial Guinea', iso: 'GQ', iso3: 'GNQ', numCode: 226, phoneCode: 240, id: 65 },\n { name: 'Eritrea', iso: 'ER', iso3: 'ERI', numCode: 232, phoneCode: 291, id: 66 },\n { name: 'Estonia', iso: 'EE', iso3: 'EST', numCode: 233, phoneCode: 372, id: 67 },\n { name: 'Ethiopia', iso: 'ET', iso3: 'ETH', numCode: 231, phoneCode: 251, id: 68 },\n {\n name: 'Falkland Islands (Malvinas)',\n iso: 'FK',\n iso3: 'FLK',\n numCode: 238,\n phoneCode: 500,\n id: 69,\n },\n { name: 'Faroe Islands', iso: 'FO', iso3: 'FRO', numCode: 234, phoneCode: 298, id: 70 },\n { name: 'Fiji', iso: 'FJ', iso3: 'FJI', numCode: 242, phoneCode: 679, id: 71 },\n { name: 'Finland', iso: 'FI', iso3: 'FIN', numCode: 246, phoneCode: 358, id: 72 },\n { name: 'France', iso: 'FR', iso3: 'FRA', numCode: 250, phoneCode: 33, id: 73 },\n { name: 'French Guiana', iso: 'GF', iso3: 'GUF', numCode: 254, phoneCode: 594, id: 74 },\n { name: 'French Polynesia', iso: 'PF', iso3: 'PYF', numCode: 258, phoneCode: 689, id: 75 },\n {\n name: 'French Southern Territories',\n iso: 'TF',\n iso3: null,\n numCode: null,\n phoneCode: 0,\n id: 76,\n },\n { name: 'Gabon', iso: 'GA', iso3: 'GAB', numCode: 266, phoneCode: 241, id: 77 },\n { name: 'Gambia', iso: 'GM', iso3: 'GMB', numCode: 270, phoneCode: 220, id: 78 },\n { name: 'Georgia', iso: 'GE', iso3: 'GEO', numCode: 268, phoneCode: 995, id: 79 },\n { name: 'Germany', iso: 'DE', iso3: 'DEU', numCode: 276, phoneCode: 49, id: 80 },\n { name: 'Ghana', iso: 'GH', iso3: 'GHA', numCode: 288, phoneCode: 233, id: 81 },\n { name: 'Gibraltar', iso: 'GI', iso3: 'GIB', numCode: 292, phoneCode: 350, id: 82 },\n { name: 'Greece', iso: 'GR', iso3: 'GRC', numCode: 300, phoneCode: 30, id: 83 },\n { name: 'Greenland', iso: 'GL', iso3: 'GRL', numCode: 304, phoneCode: 299, id: 84 },\n { name: 'Grenada', iso: 'GD', iso3: 'GRD', numCode: 308, phoneCode: 1473, id: 85 },\n { name: 'Guadeloupe', iso: 'GP', iso3: 'GLP', numCode: 312, phoneCode: 590, id: 86 },\n { name: 'Guam', iso: 'GU', iso3: 'GUM', numCode: 316, phoneCode: 1671, id: 87 },\n { name: 'Guatemala', iso: 'GT', iso3: 'GTM', numCode: 320, phoneCode: 502, id: 88 },\n { name: 'Guinea', iso: 'GN', iso3: 'GIN', numCode: 324, phoneCode: 224, id: 89 },\n { name: 'Guinea-Bissau', iso: 'GW', iso3: 'GNB', numCode: 624, phoneCode: 245, id: 90 },\n { name: 'Guyana', iso: 'GY', iso3: 'GUY', numCode: 328, phoneCode: 592, id: 91 },\n { name: 'Haiti', iso: 'HT', iso3: 'HTI', numCode: 332, phoneCode: 509, id: 92 },\n {\n name: 'Heard Island and Mcdonald Islands',\n iso: 'HM',\n iso3: null,\n numCode: null,\n phoneCode: 0,\n id: 93,\n },\n {\n name: 'Holy See (Vatican City State)',\n iso: 'VA',\n iso3: 'VAT',\n numCode: 336,\n phoneCode: 39,\n id: 94,\n },\n { name: 'Honduras', iso: 'HN', iso3: 'HND', numCode: 340, phoneCode: 504, id: 95 },\n { name: 'Hong Kong', iso: 'HK', iso3: 'HKG', numCode: 344, phoneCode: 852, id: 96 },\n { name: 'Hungary', iso: 'HU', iso3: 'HUN', numCode: 348, phoneCode: 36, id: 97 },\n { name: 'Iceland', iso: 'IS', iso3: 'ISL', numCode: 352, phoneCode: 354, id: 98 },\n { name: 'India', iso: 'IN', iso3: 'IND', numCode: 356, phoneCode: 91, id: 99 },\n { name: 'Indonesia', iso: 'ID', iso3: 'IDN', numCode: 360, phoneCode: 62, id: 100 },\n {\n name: 'Iran, Islamic Republic of',\n iso: 'IR',\n iso3: 'IRN',\n numCode: 364,\n phoneCode: 98,\n id: 101,\n },\n { name: 'Iraq', iso: 'IQ', iso3: 'IRQ', numCode: 368, phoneCode: 964, id: 102 },\n { name: 'Ireland', iso: 'IE', iso3: 'IRL', numCode: 372, phoneCode: 353, id: 103 },\n { name: 'Israel', iso: 'IL', iso3: 'ISR', numCode: 376, phoneCode: 972, id: 104 },\n { name: 'Italy', iso: 'IT', iso3: 'ITA', numCode: 380, phoneCode: 39, id: 105 },\n { name: 'Jamaica', iso: 'JM', iso3: 'JAM', numCode: 388, phoneCode: 1876, id: 106 },\n { name: 'Japan', iso: 'JP', iso3: 'JPN', numCode: 392, phoneCode: 81, id: 107 },\n { name: 'Jordan', iso: 'JO', iso3: 'JOR', numCode: 400, phoneCode: 962, id: 108 },\n { name: 'Kazakhstan', iso: 'KZ', iso3: 'KAZ', numCode: 398, phoneCode: 7, id: 109 },\n { name: 'Kenya', iso: 'KE', iso3: 'KEN', numCode: 404, phoneCode: 254, id: 110 },\n { name: 'Kiribati', iso: 'KI', iso3: 'KIR', numCode: 296, phoneCode: 686, id: 111 },\n {\n name: \"Korea, Democratic People's Republic of\",\n iso: 'KP',\n iso3: 'PRK',\n numCode: 408,\n phoneCode: 850,\n id: 112,\n },\n { name: 'Korea, Republic of', iso: 'KR', iso3: 'KOR', numCode: 410, phoneCode: 82, id: 113 },\n { name: 'Kuwait', iso: 'KW', iso3: 'KWT', numCode: 414, phoneCode: 965, id: 114 },\n { name: 'Kyrgyzstan', iso: 'KG', iso3: 'KGZ', numCode: 417, phoneCode: 996, id: 115 },\n {\n name: \"Lao People's Democratic Republic\",\n iso: 'LA',\n iso3: 'LAO',\n numCode: 418,\n phoneCode: 856,\n id: 116,\n },\n { name: 'Latvia', iso: 'LV', iso3: 'LVA', numCode: 428, phoneCode: 371, id: 117 },\n { name: 'Lebanon', iso: 'LB', iso3: 'LBN', numCode: 422, phoneCode: 961, id: 118 },\n { name: 'Lesotho', iso: 'LS', iso3: 'LSO', numCode: 426, phoneCode: 266, id: 119 },\n { name: 'Liberia', iso: 'LR', iso3: 'LBR', numCode: 430, phoneCode: 231, id: 120 },\n {\n name: 'Libyan Arab Jamahiriya',\n iso: 'LY',\n iso3: 'LBY',\n numCode: 434,\n phoneCode: 218,\n id: 121,\n },\n { name: 'Liechtenstein', iso: 'LI', iso3: 'LIE', numCode: 438, phoneCode: 423, id: 122 },\n { name: 'Lithuania', iso: 'LT', iso3: 'LTU', numCode: 440, phoneCode: 370, id: 123 },\n { name: 'Luxembourg', iso: 'LU', iso3: 'LUX', numCode: 442, phoneCode: 352, id: 124 },\n { name: 'Macao', iso: 'MO', iso3: 'MAC', numCode: 446, phoneCode: 853, id: 125 },\n {\n name: 'Macedonia, the Former Yugoslav Republic of',\n iso: 'MK',\n iso3: 'MKD',\n numCode: 807,\n phoneCode: 389,\n id: 126,\n },\n { name: 'Madagascar', iso: 'MG', iso3: 'MDG', numCode: 450, phoneCode: 261, id: 127 },\n { name: 'Malawi', iso: 'MW', iso3: 'MWI', numCode: 454, phoneCode: 265, id: 128 },\n { name: 'Malaysia', iso: 'MY', iso3: 'MYS', numCode: 458, phoneCode: 60, id: 129 },\n { name: 'Maldives', iso: 'MV', iso3: 'MDV', numCode: 462, phoneCode: 960, id: 130 },\n { name: 'Mali', iso: 'ML', iso3: 'MLI', numCode: 466, phoneCode: 223, id: 131 },\n { name: 'Malta', iso: 'MT', iso3: 'MLT', numCode: 470, phoneCode: 356, id: 132 },\n { name: 'Marshall Islands', iso: 'MH', iso3: 'MHL', numCode: 584, phoneCode: 692, id: 133 },\n { name: 'Martinique', iso: 'MQ', iso3: 'MTQ', numCode: 474, phoneCode: 596, id: 134 },\n { name: 'Mauritania', iso: 'MR', iso3: 'MRT', numCode: 478, phoneCode: 222, id: 135 },\n { name: 'Mauritius', iso: 'MU', iso3: 'MUS', numCode: 480, phoneCode: 230, id: 136 },\n { name: 'Mayotte', iso: 'YT', iso3: null, numCode: null, phoneCode: 269, id: 137 },\n { name: 'Mexico', iso: 'MX', iso3: 'MEX', numCode: 484, phoneCode: 52, id: 138 },\n {\n name: 'Micronesia, Federated States of',\n iso: 'FM',\n iso3: 'FSM',\n numCode: 583,\n phoneCode: 691,\n id: 139,\n },\n { name: 'Moldova, Republic of', iso: 'MD', iso3: 'MDA', numCode: 498, phoneCode: 373, id: 140 },\n { name: 'Monaco', iso: 'MC', iso3: 'MCO', numCode: 492, phoneCode: 377, id: 141 },\n { name: 'Mongolia', iso: 'MN', iso3: 'MNG', numCode: 496, phoneCode: 976, id: 142 },\n { name: 'Montserrat', iso: 'MS', iso3: 'MSR', numCode: 500, phoneCode: 1664, id: 143 },\n { name: 'Morocco', iso: 'MA', iso3: 'MAR', numCode: 504, phoneCode: 212, id: 144 },\n { name: 'Mozambique', iso: 'MZ', iso3: 'MOZ', numCode: 508, phoneCode: 258, id: 145 },\n { name: 'Myanmar', iso: 'MM', iso3: 'MMR', numCode: 104, phoneCode: 95, id: 146 },\n { name: 'Namibia', iso: 'NA', iso3: 'NAM', numCode: 516, phoneCode: 264, id: 147 },\n { name: 'Nauru', iso: 'NR', iso3: 'NRU', numCode: 520, phoneCode: 674, id: 148 },\n { name: 'Nepal', iso: 'NP', iso3: 'NPL', numCode: 524, phoneCode: 977, id: 149 },\n { name: 'Netherlands', iso: 'NL', iso3: 'NLD', numCode: 528, phoneCode: 31, id: 150 },\n { name: 'Netherlands Antilles', iso: 'AN', iso3: 'ANT', numCode: 530, phoneCode: 599, id: 151 },\n { name: 'New Caledonia', iso: 'NC', iso3: 'NCL', numCode: 540, phoneCode: 687, id: 152 },\n { name: 'Nicaragua', iso: 'NI', iso3: 'NIC', numCode: 558, phoneCode: 505, id: 154 },\n { name: 'Niger', iso: 'NE', iso3: 'NER', numCode: 562, phoneCode: 227, id: 155 },\n { name: 'Nigeria', iso: 'NG', iso3: 'NGA', numCode: 566, phoneCode: 234, id: 156 },\n { name: 'Niue', iso: 'NU', iso3: 'NIU', numCode: 570, phoneCode: 683, id: 157 },\n { name: 'Norfolk Island', iso: 'NF', iso3: 'NFK', numCode: 574, phoneCode: 672, id: 158 },\n {\n name: 'Northern Mariana Islands',\n iso: 'MP',\n iso3: 'MNP',\n numCode: 580,\n phoneCode: 1670,\n id: 159,\n },\n { name: 'Norway', iso: 'NO', iso3: 'NOR', numCode: 578, phoneCode: 47, id: 160 },\n { name: 'Oman', iso: 'OM', iso3: 'OMN', numCode: 512, phoneCode: 968, id: 161 },\n { name: 'Pakistan', iso: 'PK', iso3: 'PAK', numCode: 586, phoneCode: 92, id: 162 },\n { name: 'Palau', iso: 'PW', iso3: 'PLW', numCode: 585, phoneCode: 680, id: 163 },\n {\n name: 'Palestinian Territory, Occupied',\n iso: 'PS',\n iso3: null,\n numCode: null,\n phoneCode: 970,\n id: 164,\n },\n { name: 'Panama', iso: 'PA', iso3: 'PAN', numCode: 591, phoneCode: 507, id: 165 },\n { name: 'Papua New Guinea', iso: 'PG', iso3: 'PNG', numCode: 598, phoneCode: 675, id: 166 },\n { name: 'Paraguay', iso: 'PY', iso3: 'PRY', numCode: 600, phoneCode: 595, id: 167 },\n { name: 'Peru', iso: 'PE', iso3: 'PER', numCode: 604, phoneCode: 51, id: 168 },\n { name: 'Philippines', iso: 'PH', iso3: 'PHL', numCode: 608, phoneCode: 63, id: 169 },\n { name: 'Pitcairn', iso: 'PN', iso3: 'PCN', numCode: 612, phoneCode: 0, id: 170 },\n { name: 'Poland', iso: 'PL', iso3: 'POL', numCode: 616, phoneCode: 48, id: 171 },\n { name: 'Portugal', iso: 'PT', iso3: 'PRT', numCode: 620, phoneCode: 351, id: 172 },\n { name: 'Puerto Rico', iso: 'PR', iso3: 'PRI', numCode: 630, phoneCode: 1787, id: 173 },\n { name: 'Qatar', iso: 'QA', iso3: 'QAT', numCode: 634, phoneCode: 974, id: 174 },\n { name: 'Reunion', iso: 'RE', iso3: 'REU', numCode: 638, phoneCode: 262, id: 175 },\n { name: 'Romania', iso: 'RO', iso3: 'ROM', numCode: 642, phoneCode: 40, id: 176 },\n { name: 'Russian Federation', iso: 'RU', iso3: 'RUS', numCode: 643, phoneCode: 70, id: 177 },\n { name: 'Rwanda', iso: 'RW', iso3: 'RWA', numCode: 646, phoneCode: 250, id: 178 },\n { name: 'Saint Helena', iso: 'SH', iso3: 'SHN', numCode: 654, phoneCode: 290, id: 179 },\n {\n name: 'Saint Kitts and Nevis',\n iso: 'KN',\n iso3: 'KNA',\n numCode: 659,\n phoneCode: 1869,\n id: 180,\n },\n { name: 'Saint Lucia', iso: 'LC', iso3: 'LCA', numCode: 662, phoneCode: 1758, id: 181 },\n {\n name: 'Saint Pierre and Miquelon',\n iso: 'PM',\n iso3: 'SPM',\n numCode: 666,\n phoneCode: 508,\n id: 182,\n },\n {\n name: 'Saint Vincent and the Grenadines',\n iso: 'VC',\n iso3: 'VCT',\n numCode: 670,\n phoneCode: 1784,\n id: 183,\n },\n { name: 'Samoa', iso: 'WS', iso3: 'WSM', numCode: 882, phoneCode: 684, id: 184 },\n { name: 'San Marino', iso: 'SM', iso3: 'SMR', numCode: 674, phoneCode: 378, id: 185 },\n {\n name: 'Sao Tome and Principe',\n iso: 'ST',\n iso3: 'STP',\n numCode: 678,\n phoneCode: 239,\n id: 186,\n },\n { name: 'Saudi Arabia', iso: 'SA', iso3: 'SAU', numCode: 682, phoneCode: 966, id: 187 },\n { name: 'Senegal', iso: 'SN', iso3: 'SEN', numCode: 686, phoneCode: 221, id: 188 },\n {\n name: 'Serbia and Montenegro',\n iso: 'CS',\n iso3: null,\n numCode: null,\n phoneCode: 381,\n id: 189,\n },\n { name: 'Seychelles', iso: 'SC', iso3: 'SYC', numCode: 690, phoneCode: 248, id: 190 },\n { name: 'Sierra Leone', iso: 'SL', iso3: 'SLE', numCode: 694, phoneCode: 232, id: 191 },\n { name: 'Singapore', iso: 'SG', iso3: 'SGP', numCode: 702, phoneCode: 65, id: 192 },\n { name: 'Slovakia', iso: 'SK', iso3: 'SVK', numCode: 703, phoneCode: 421, id: 193 },\n { name: 'Slovenia', iso: 'SI', iso3: 'SVN', numCode: 705, phoneCode: 386, id: 194 },\n { name: 'Solomon Islands', iso: 'SB', iso3: 'SLB', numCode: 90, phoneCode: 677, id: 195 },\n { name: 'Somalia', iso: 'SO', iso3: 'SOM', numCode: 706, phoneCode: 252, id: 196 },\n { name: 'South Africa', iso: 'ZA', iso3: 'ZAF', numCode: 710, phoneCode: 27, id: 197 },\n {\n name: 'South Georgia and the South Sandwich Islands',\n iso: 'GS',\n iso3: null,\n numCode: null,\n phoneCode: 0,\n id: 198,\n },\n { name: 'Spain', iso: 'ES', iso3: 'ESP', numCode: 724, phoneCode: 34, id: 199 },\n { name: 'Sri Lanka', iso: 'LK', iso3: 'LKA', numCode: 144, phoneCode: 94, id: 200 },\n { name: 'Sudan', iso: 'SD', iso3: 'SDN', numCode: 736, phoneCode: 249, id: 201 },\n { name: 'Suriname', iso: 'SR', iso3: 'SUR', numCode: 740, phoneCode: 597, id: 202 },\n {\n name: 'Svalbard and Jan Mayen',\n iso: 'SJ',\n iso3: 'SJM',\n numCode: 744,\n phoneCode: 47,\n id: 203,\n },\n { name: 'Swaziland', iso: 'SZ', iso3: 'SWZ', numCode: 748, phoneCode: 268, id: 204 },\n { name: 'Sweden', iso: 'SE', iso3: 'SWE', numCode: 752, phoneCode: 46, id: 205 },\n { name: 'Switzerland', iso: 'CH', iso3: 'CHE', numCode: 756, phoneCode: 41, id: 206 },\n { name: 'Syrian Arab Republic', iso: 'SY', iso3: 'SYR', numCode: 760, phoneCode: 963, id: 207 },\n {\n name: 'Taiwan, Province of China',\n iso: 'TW',\n iso3: 'TWN',\n numCode: 158,\n phoneCode: 886,\n id: 208,\n },\n { name: 'Tajikistan', iso: 'TJ', iso3: 'TJK', numCode: 762, phoneCode: 992, id: 209 },\n {\n name: 'Tanzania, United Republic of',\n iso: 'TZ',\n iso3: 'TZA',\n numCode: 834,\n phoneCode: 255,\n id: 210,\n },\n { name: 'Thailand', iso: 'TH', iso3: 'THA', numCode: 764, phoneCode: 66, id: 211 },\n { name: 'Timor-Leste', iso: 'TL', iso3: null, numCode: null, phoneCode: 670, id: 212 },\n { name: 'Togo', iso: 'TG', iso3: 'TGO', numCode: 768, phoneCode: 228, id: 213 },\n { name: 'Tokelau', iso: 'TK', iso3: 'TKL', numCode: 772, phoneCode: 690, id: 214 },\n { name: 'Tonga', iso: 'TO', iso3: 'TON', numCode: 776, phoneCode: 676, id: 215 },\n { name: 'Trinidad and Tobago', iso: 'TT', iso3: 'TTO', numCode: 780, phoneCode: 1868, id: 216 },\n { name: 'Tunisia', iso: 'TN', iso3: 'TUN', numCode: 788, phoneCode: 216, id: 217 },\n { name: 'Turkey', iso: 'TR', iso3: 'TUR', numCode: 792, phoneCode: 90, id: 218 },\n { name: 'Turkmenistan', iso: 'TM', iso3: 'TKM', numCode: 795, phoneCode: 7370, id: 219 },\n {\n name: 'Turks and Caicos Islands',\n iso: 'TC',\n iso3: 'TCA',\n numCode: 796,\n phoneCode: 1649,\n id: 220,\n },\n { name: 'Tuvalu', iso: 'TV', iso3: 'TUV', numCode: 798, phoneCode: 688, id: 221 },\n { name: 'Uganda', iso: 'UG', iso3: 'UGA', numCode: 800, phoneCode: 256, id: 222 },\n { name: 'Ukraine', iso: 'UA', iso3: 'UKR', numCode: 804, phoneCode: 380, id: 223 },\n { name: 'United Arab Emirates', iso: 'AE', iso3: 'ARE', numCode: 784, phoneCode: 971, id: 224 },\n { name: 'United Kingdom', iso: 'GB', iso3: 'GBR', numCode: 826, phoneCode: 44, id: 225 },\n {\n name: 'United States Minor Outlying Islands',\n iso: 'UM',\n iso3: null,\n numCode: null,\n phoneCode: 1,\n id: 227,\n },\n { name: 'Uruguay', iso: 'UY', iso3: 'URY', numCode: 858, phoneCode: 598, id: 228 },\n { name: 'Uzbekistan', iso: 'UZ', iso3: 'UZB', numCode: 860, phoneCode: 998, id: 229 },\n { name: 'Vanuatu', iso: 'VU', iso3: 'VUT', numCode: 548, phoneCode: 678, id: 230 },\n { name: 'Venezuela', iso: 'VE', iso3: 'VEN', numCode: 862, phoneCode: 58, id: 231 },\n { name: 'Viet Nam', iso: 'VN', iso3: 'VNM', numCode: 704, phoneCode: 84, id: 232 },\n {\n name: 'Virgin Islands, British',\n iso: 'VG',\n iso3: 'VGB',\n numCode: 92,\n phoneCode: 1284,\n id: 233,\n },\n {\n name: 'Virgin Islands, U.s.',\n iso: 'VI',\n iso3: 'VIR',\n numCode: 850,\n phoneCode: 1340,\n id: 234,\n },\n { name: 'Wallis and Futuna', iso: 'WF', iso3: 'WLF', numCode: 876, phoneCode: 681, id: 235 },\n { name: 'Western Sahara', iso: 'EH', iso3: 'ESH', numCode: 732, phoneCode: 212, id: 236 },\n { name: 'Yemen', iso: 'YE', iso3: 'YEM', numCode: 887, phoneCode: 967, id: 237 },\n { name: 'Zambia', iso: 'ZM', iso3: 'ZMB', numCode: 894, phoneCode: 260, id: 238 },\n { name: 'Zimbabwe', iso: 'ZW', iso3: 'ZWE', numCode: 716, phoneCode: 263, id: 239 },\n];\n\nexport const degrees = [\n { name: 'MD', code: 'MD' },\n { name: 'DO', code: 'DO' },\n { name: 'PhD', code: 'PhD' },\n { name: 'MBBS', code: 'MBBS' },\n { name: 'MS', code: 'MS' },\n { name: 'PA', code: 'PA' },\n { name: 'RN', code: 'RN' },\n { name: 'RT', code: 'RT' },\n { name: 'Other', code: 'Other' },\n];\n\nexport const specialty = [\n { name: 'Surgery', code: 'Surgery' },\n { name: 'Radiology', code: 'Radiology' },\n { name: 'Fellowship in Radiology', code: 'Fellowship in Radiology' },\n { name: 'Oncology', code: 'Oncology' },\n { name: 'Radiation Oncology', code: 'Radiation Oncology' },\n { name: 'Medical Physics', code: 'Medical Physics' },\n { name: 'Internal Medicine', code: 'Internal Medicine' },\n { name: 'Dosimetry', code: 'Dosimetry' },\n { name: 'Other', code: 'Other' },\n];\n\nexport const states = [\n { name: 'Alabama', code: 'AL' },\n { name: 'Alaska', code: 'AK' },\n { name: 'American Samoa', code: 'AS' },\n { name: 'Arizona', code: 'AZ' },\n { name: 'Arkansas', code: 'AR' },\n { name: 'California', code: 'CA' },\n { name: 'Colorado', code: 'CO' },\n { name: 'Connecticut', code: 'CT' },\n { name: 'Delaware', code: 'DE' },\n { name: 'District Of Columbia', code: 'DC' },\n { name: 'Federated States Of Micronesia', code: 'FM' },\n { name: 'Florida', code: 'FL' },\n { name: 'Georgia', code: 'GA' },\n { name: 'Guam', code: 'GU' },\n { name: 'Hawaii', code: 'HI' },\n { name: 'Idaho', code: 'ID' },\n { name: 'Illinois', code: 'IL' },\n { name: 'Indiana', code: 'IN' },\n { name: 'Iowa', code: 'IA' },\n { name: 'Kansas', code: 'KS' },\n { name: 'Kentucky', code: 'KY' },\n { name: 'Louisiana', code: 'LA' },\n { name: 'Maine', code: 'ME' },\n { name: 'Marshall Islands', code: 'MH' },\n { name: 'Maryland', code: 'MD' },\n { name: 'Massachusetts', code: 'MA' },\n { name: 'Michigan', code: 'MI' },\n { name: 'Minnesota', code: 'MN' },\n { name: 'Mississippi', code: 'MS' },\n { name: 'Missouri', code: 'MO' },\n { name: 'Montana', code: 'MT' },\n { name: 'Nebraska', code: 'NE' },\n { name: 'Nevada', code: 'NV' },\n { name: 'New Hampshire', code: 'NH' },\n { name: 'New Jersey', code: 'NJ' },\n { name: 'New Mexico', code: 'NM' },\n { name: 'New York', code: 'NY' },\n { name: 'North Carolina', code: 'NC' },\n { name: 'North Dakota', code: 'ND' },\n { name: 'Northern Mariana Islands', code: 'MP' },\n { name: 'Ohio', code: 'OH' },\n { name: 'Oklahoma', code: 'OK' },\n { name: 'Oregon', code: 'OR' },\n { name: 'Palau', code: 'PW' },\n { name: 'Pennsylvania', code: 'PA' },\n { name: 'Puerto Rico', code: 'PR' },\n { name: 'Rhode Island', code: 'RI' },\n { name: 'South Carolina', code: 'SC' },\n { name: 'South Dakota', code: 'SD' },\n { name: 'Tennessee', code: 'TN' },\n { name: 'Texas', code: 'TX' },\n { name: 'Utah', code: 'UT' },\n { name: 'Vermont', code: 'VT' },\n { name: 'Virgin Islands', code: 'VI' },\n { name: 'Virginia', code: 'VA' },\n { name: 'Washington', code: 'WA' },\n { name: 'West Virginia', code: 'WV' },\n { name: 'Wisconsin', code: 'WI' },\n { name: 'Wyoming', code: 'WY' },\n];\n\nexport const COUNTRY_ID_OBJ = {\n us: 226,\n aus: 13,\n};\n\nexport const TOKEN_RESPONSE_CODES = {\n invalidInvitationToken: 106,\n expiredInvitationToken: 107,\n expiredConfirmationCode: 108,\n};\n","import React, { useState, useEffect } from 'react';\nimport Button from 'shared/components/Button';\nimport InputGroup from 'shared/components/InputGroup';\nimport Select from 'shared/components/Select';\nimport { connect } from 'react-redux';\nimport { useSnackbar } from 'notistack';\nimport { specialty, countries, degrees } from 'app/Auth/routes/Register/configs';\nimport { Api } from 'utils/connectors';\nimport { getError } from 'utils/appHelpers';\nimport { getAndUpdateProfile } from 'app/Auth/actions';\n\nconst Settings = ({ data, getAndUpdateProfile, isEventUser }) => {\n const { enqueueSnackbar } = useSnackbar();\n const profile = data.learnerProfile || {};\n const [fetch, setFecth] = useState(false);\n const [isEdit, toggleEdit] = useState(false);\n const [info, setInfo] = useState({\n firstName: data.firstName || '',\n lastName: data.lastName || '',\n email: data.email || '',\n imageUrl: data.imageUrl || '',\n countryId: data.countryId || '',\n });\n\n const [learner, setLearner] = useState({\n speciality: profile.speciality || '',\n phone: profile.phone || '',\n city: profile.city || '',\n state: profile.state || '',\n address: profile.address || '',\n zipCode: profile.zipCode || '',\n prefferedNameOnCertificate: profile.prefferedNameOnCertificate || '',\n institution: profile.institution || '',\n degree: profile.degree || '',\n });\n\n const handleInfoChange = ({ target }) => {\n setInfo({ ...info, [target.name]: target.value });\n };\n\n const handleLearnerChange = ({ target }) => {\n setLearner({ ...learner, [target.name]: target.value });\n };\n\n const onSubmitHandle = async () => {\n try {\n setFecth(true);\n const body = { userId: data.id, ...info, learnerProfile: learner };\n await Api.post('/auth/edituser', body);\n await getAndUpdateProfile();\n enqueueSnackbar('Successfully updated', { variant: 'success' });\n toggleEdit(false);\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n } finally {\n setFecth(false);\n }\n };\n\n const findFromList = (id, list) => {\n const item = list.find(v => v.id === Number(id));\n return item ? item.name : '-';\n };\n\n useEffect(() => {\n getAndUpdateProfile();\n }, [getAndUpdateProfile]);\n\n return (\n <>\n - \n
- \n Name:\n\n {isEdit ? (\n\n \n
- \n Surname:\n\n {isEdit ? (\n\n \n {!isEventUser && (\n <>\n
- \n Profession:\n\n {isEdit ? (\n\n \n
- \n Degree:\n\n {isEdit ? (\n\n \n \n )}\n
- \n Email:\n\n {isEdit ? (\n\n \n {!isEventUser && (\n <>\n
- \n Phone:\n\n {isEdit ? (\n\n \n
- \n Address:\n\n {isEdit ? (\n\n \n
- \n City:\n\n {isEdit ? (\n\n \n
- \n State/Province:\n\n {isEdit ? (\n\n \n
- \n Country:\n\n {isEdit ? (\n\n \n
- \n ZIP Code:\n\n {isEdit ? (\n\n \n
- \n Name on Certificate:\n\n {isEdit ? (\n\n \n \n )}\n
- \n Hospital/Clinic:\n\n {isEdit ? (\n\n \n
\n {isEdit ? (\n <>\n \n \n \n ) : (\n \n )}\n
\n \n );\n};\n\nexport default connect(\n null,\n { getAndUpdateProfile },\n)(Settings);\n","export default __webpack_public_path__ + \"static/media/smile_green.29a16b47.svg\";","export default __webpack_public_path__ + \"static/media/smile_yellow.6be91da7.svg\";","export default __webpack_public_path__ + \"static/media/smile_red.238b2f3d.svg\";","import React from 'react';\nimport IconSmileGreen from 'assets/smile_green.svg';\nimport IconSmileYellow from 'assets/smile_yellow.svg';\nimport IconSmileRed from 'assets/smile_red.svg';\n\nexport const SIconResolution = ({ data, className }) => {\n return (\n \n
\n );\n};\n\nexport default connect(\n null,\n { triggerDiagnosticsTest },\n)(Status);\n","/* eslint-disable jsx-a11y/no-static-element-interactions */\n/* eslint-disable jsx-a11y/anchor-is-valid */\nimport React from 'react';\nimport { useHistory } from 'react-router-dom';\nimport { IconArrowRight } from 'shared/components/Icons';\nimport { courseSubsStatuses, getEndOfSubs, getEventUrl } from 'utils/appHelpers';\nimport ProgressBar from 'shared/components/ProgressBar';\nimport { hasAccess } from 'utils/permissionHelper';\nimport { useSelector } from 'react-redux';\n\nconst SubscriptionStatus = ({ subscriptions }) => {\n const history = useHistory();\n const courses = useSelector(state => state.courses);\n const all = courses.filter(item => courseSubsStatuses(item.status, 'active'));\n const path = hasAccess('event_user') ? getEventUrl() : '';\n\n const goToProgress = (id, e) => {\n e.preventDefault();\n history.push(`${path}/courses/progress/${id}`, { from: 'account' });\n };\n\n return (\n Recent Connection and Device Test:
\n\n
\n - \n {headers.map(item => (\n
- \n {item.label}:\n {showValue(data?.[item.key], item.key)}\n \n ))}\n
- \n \n \n
\n \n \n );\n })}\n
\n );\n};\n\nexport default SubscriptionStatus;\n","import React, { useState } from 'react';\nimport Button from 'shared/components/Button';\nimport { ChangePasswordModal } from '.';\n\nconst PasswordManage = ({ email }) => {\n const [open, toggleModal] = useState(false);\n return (\n <>\n \n
\n {all.map(item => {\n return (\n \n
\n Course:
\n\n
\n Expiration:
\n\n
\n \n Progress:
\n\n
\n \n {item.name}\n
\n \n {getEndOfSubs(item.endDate, item.expirable)}\n
\n \n {!item.isOpened ? (\n
\n \n {item.progress}%\n
\n No Progress Available\n
\n )}\n\n \n More Info
\n - \n
- \n Change Password:\n\n \n\n \n
\n {children} {!hideArrow &&
\n \n);\n\nexport default memo(ButtonLine);\n","import React, { useState, useEffect } from 'react';\nimport { Api } from 'utils/connectors';\nimport InputGroup from 'shared/components/InputGroup';\nimport ButtonLine from 'shared/components/ButtonLine';\nimport { IconLock } from 'shared/components/Icons';\nimport { getError } from 'utils/appHelpers';\n\nconst ChangePasswordModal = ({ email, onClose }) => {\n const [fetch, setFetch] = useState(false);\n const [success, setSuccess] = useState(false);\n const [form, setForm] = useState({\n curPassword: '',\n newPassword: '',\n cnfPassword: '',\n });\n const [backError, setBackError] = useState(false);\n const [errors, setErrors] = useState({\n curPassword: null,\n newPassword: null,\n });\n\n const handleChange = e => setForm({ ...form, [e.target.name]: e.target.value });\n\n const requestForPasswordChange = async () => {\n try {\n setFetch(true);\n const body = { email, curPassword: form.curPassword, newPassword: form.newPassword };\n await Api.post(`/auth/changepassword`, body);\n setSuccess(true);\n } catch (err) {\n setBackError(getError(err));\n } finally {\n setFetch(false);\n }\n };\n\n const validateSubmission = e => {\n e.preventDefault();\n const { curPassword, newPassword, cnfPassword } = form;\n const newErrors = JSON.parse(JSON.stringify(errors));\n if (!curPassword) {\n newErrors.curPassword = 'Enter current password!';\n } else if (curPassword && newErrors.curPassword) {\n newErrors.curPassword = null;\n } else if (!newPassword || !cnfPassword || newPassword !== cnfPassword) {\n newErrors.newPassword = 'Password Missmatch!';\n } else if (newPassword && cnfPassword && newPassword === cnfPassword && newErrors.newPassword) {\n newErrors.newPassword = null;\n }\n setErrors(newErrors);\n };\n\n const handleSubmit = () => {\n const { curPassword, newPassword, cnfPassword } = form;\n const existingErrors = !!Object.values(errors).join('').length;\n if (curPassword && newPassword && cnfPassword && !existingErrors) {\n requestForPasswordChange();\n }\n };\n\n useEffect(handleSubmit, [errors]);\n\n return (\n \n
\n );\n};\n\nexport default ChangePasswordModal;\n","import React, { memo } from 'react';\nimport { Link } from 'react-router-dom';\nimport { IconRight } from './Icons';\n\nconst LinkIcon = ({ children, to, className, color = '#131f6b' }) => (\n \n {children} \n
\n \n \n
\n \n {!success ? (\n <>\n
\n Change Password
\nPlease enter your current password
\n \n \n ) : (\nYour password has been changed
\n )}\n\n
\n );\n};\n\nexport default EntityInfoBlock;\n","import React from 'react';\n\nconst ButtonLoading = ({ text }) => {\n return (\n <>\n \n {text || 'Loading'}\n \n );\n};\n\nexport default ButtonLoading;\n","import React, { useState } from 'react';\nimport { useSnackbar } from 'notistack';\nimport { Api } from 'utils/connectors';\nimport { IconClose } from 'shared/components/Icons';\nimport InputGroup from 'shared/components/InputGroup';\nimport { getError } from 'utils/appHelpers';\nimport ButtonLoading from 'shared/components/ButtonLoading';\n\nconst LicenseManageModal = ({ data, onRefreshData, onClose }) => {\n const { enqueueSnackbar } = useSnackbar();\n const [newKey, setNewKey] = useState('');\n const [fetch, setFetch] = useState(false);\n const [remove, setRemove] = useState(false);\n\n const onRemoveKey = async id => {\n try {\n setRemove(id);\n const { data } = await Api.post(`/auth/removelicense/${id}`);\n if (onRefreshData) await onRefreshData();\n enqueueSnackbar(data.message, { variant: 'success' });\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n } finally {\n setRemove(false);\n }\n };\n\n const onAddNewKay = async () => {\n try {\n setFetch(true);\n await Api.post('/auth/addlicense', { licenseKeys: [newKey] });\n if (onRefreshData) await onRefreshData();\n setNewKey('');\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n } finally {\n setFetch(false);\n }\n };\n\n return (\n <>\n \n 
\n
\n \n
\n \n
\n Entity Name:
\n{entity.name}
\n\n
\n Entity Address:
\n{entity.address}
\n\n
\n \n \n );\n};\n\nexport default LicenseManageModal;\n","import React, { useState } from 'react';\nimport ReactModal from 'react-modal';\nimport ButtonLine from 'shared/components/ButtonLine';\nimport LicenseManageModal from './LicenseManageModal';\n\nconst LicensesBlock = ({ data, getLicenses }) => {\n const [open, toggleModal] = useState(false);\n return (\n \n
\n\n Manage Registration Codes
\n \n
\n \n
\n Registration Codes:
\n\n {data && data.length ? (\n data.map(item => {\n return (\n \n
\n );\n })\n ) : (\n {item.licenseKey}
\n \n
\n \n \n {remove === item.id && (\n \n )}\n REMOVE\n \n
\n No Active Keys
\n )}\n New Registration Code
\n\n setNewKey(target.value.trim())}\n />\n
\n \n \n {fetch ?
\n \n {data && data.length ? (\n <>\n \n \n );\n })}\n \n ) : (\n \n toggleModal(false)}\n />\n \n
\n );\n};\n\nexport default LicensesBlock;\n","import React from 'react';\nimport moment from 'moment';\nimport { HOST } from 'configs';\n\nconst CopyRightInfo = () => {\n return (\n \n
\n {data.map(item => {\n return (\n \n
\n Registration Codes:
\n\n
\n Course:
\n\n
\n Source:
\n\n
\n \n {item.licenseKey}\n
\n \n \n {item.subscription && item.subscription.title}\n \n
\n {item?.entity ? 'Entity' : 'User'}
\n No Registration Codes Available
\n )}\n \n toggleModal(true)} className='btn-line-blue py-0'>\n Manage Registration Codes\n \n
\n \n Copyright {moment().format('YYYY')} Hologic, In\n Version: {HOST.API.VERSION}\n
\n );\n};\n\nexport default CopyRightInfo;\n","import React, { useEffect, useState } from 'react';\nimport { connect } from 'react-redux';\nimport { UserImage, Settings, Status, SubscriptionStatus, PasswordManage } from './components';\nimport LinkIcon from 'shared/components/LinkIcon';\nimport { Api } from 'utils/connectors';\nimport { getError } from 'utils/appHelpers';\nimport { useSnackbar } from 'notistack';\nimport { getAndUpdateProfile } from 'app/Auth/actions';\nimport { hasAccess } from 'utils/permissionHelper';\n// import accessImg from 'assets/events/accesslogo_dark.svg';\nimport EntityInfoBlock from './components/EntityInfoBlock';\nimport LicensesBlock from './components/LicensesBlock';\nimport CopyRightInfo from 'shared/components/CopyRightInfo';\n\nconst Profile = ({ account, getAndUpdateProfile }) => {\n const { enqueueSnackbar } = useSnackbar();\n const { imageUrl, subscriptions, email, connections } = account;\n // const [changeCode, setChangeCode] = useState(false);\n // const [code, setCode] = useState((learnerProfile && learnerProfile.registrationKey) || '');\n const [licenses, setLicenses] = useState([]);\n const certs = account.userCertificates || [];\n\n // const onChangeClick = async () => {\n // try {\n // const { data } = await Api.post('auth/updatekey', { uniqueKey: code });\n // await getAndUpdateProfile();\n // enqueueSnackbar(data.message, { variant: 'success' });\n // } catch (err) {\n // enqueueSnackbar(getError(err), { variant: 'error' });\n // } finally {\n // setChangeCode(false);\n // }\n // };\n\n const getLicenses = async () => {\n try {\n const { data } = await Api.get('/auth/getlicenses');\n setLicenses(data.data);\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n // const onClickAccessVip = () => {\n // const isAlreadyVIP = account.userType !== 6;\n // let win;\n // if (isAlreadyVIP) {\n // win = window.open('/allcourses', '_blank');\n // } else {\n // win = window.open('/register', '_blank');\n // }\n // win.focus();\n // };\n\n const isEventUser = hasAccess('event_user');\n\n useEffect(() => {\n getLicenses();\n //eslint-disable-next-line\n }, []);\n\n return (\n \n
\n );\n};\n\nconst mapStateToProps = ({ account }) => ({ account });\n\nexport default connect(\n mapStateToProps,\n { getAndUpdateProfile },\n)(Profile);\n","import React from 'react';\nimport { getEventUrl } from 'utils/appHelpers';\nimport { hasAccess } from 'utils/permissionHelper';\nimport { IconArrowLeft } from './components/Icons';\n\nconst BackButton = ({ history, route, noBackRoute, className, onClick }) => {\n const path = hasAccess('event_user') ? getEventUrl() : '';\n\n const handleBackClick = () => {\n if (route) {\n history.push(`${path}${route}`);\n return;\n }\n if (!history.goBack && noBackRoute) history.push(`${path}${noBackRoute}`);\n else history.goBack();\n };\n\n return (\n \n
\n My Profile
\n\n
\n \n
\n \n
\n {account.entities && (\n <>\n {account.entities.map((entity, idx) => (\n \n
\n \n
\n {!!subscriptions.length && !isEventUser && (\n \n
\n )}\n {/* {!isEventUser && (\n \n
\n )} */}\n {!isEventUser && (\n \n
\n {changeCode && (\n \n )}\n \n Registration Code:
\n \n {changeCode ? (\n setCode(target.value)}\n />\n ) : learnerProfile ? (\n learnerProfile.registrationKey || '-'\n ) : (\n '-'\n )}\n
\n \n
\n )}\n \n
\n {!!certs.length && (\n \n )}\n Certificates:
\n {certs.length}
\n \n
\n {!isEventUser && (\n \n
\n )}\n \n setOpen(!open)}\n role='presentation'\n >\n 
\n {value\n ? `${moment(value.start).format('MM/DD/YYYY')} - ${moment(value.end).format(\n 'MM/DD/YYYY',\n )}`\n : 'Not Selected'}\n {open ?
\n {/* {open && (\n \n {\n onChange(values);\n setOpen(false);\n }}\n value={value}\n />\n
\n )} */}\n \n {\n onChange(values);\n setOpen(false);\n }}\n value={value}\n />\n
\n \n );\n};\n\nexport default DateRange;\n","import React, { useCallback, useEffect, useState } from 'react';\nimport moment from 'moment';\nimport BackButton from 'shared/BackButton';\nimport DateRange from 'shared/components/DateRangePicker';\nimport { duplicate, getError } from 'utils/appHelpers';\nimport { IconArrowLeft, IconArrowRight, IconClose, IconSearch } from 'shared/components/Icons';\nimport {\n SIconResolution,\n SIconLatency,\n SIconBandwidth,\n} from 'shared/components/StatisticTestIcons';\nimport ReactPaginate from 'react-paginate';\nimport Loading from 'shared/components/Loading';\nimport { useSnackbar } from 'notistack';\nimport { Api } from 'utils/connectors';\n\nconst structureDateFilter = body => {\n const filter = JSON.parse(JSON.stringify(body));\n if (filter.date) {\n filter.startDate = moment(filter.date.start).format('MM.DD.YYYY');\n filter.endDate = moment(filter.date.end).format('MM.DD.YYYY');\n delete filter.date;\n }\n\n return filter;\n};\n\nconst DiagnosticsHistory = ({ history }) => {\n const [dateRange, setDateRange] = useState(null);\n const { enqueueSnackbar } = useSnackbar();\n const [initialData, setInitialData] = useState(null);\n const [fetching, setFetching] = useState(false);\n const [data, setData] = useState(null);\n const [page, setPage] = useState(0);\n const [pageCount, setPageCount] = useState(0);\n\n const generateData = useCallback(() => {\n let copiedData = duplicate(initialData);\n const modifiedData = [];\n const parseData = data => {\n try {\n return JSON.parse(data);\n } catch (e) {\n return {};\n }\n };\n\n copiedData.forEach(item => {\n if (!item.testData) return;\n const parsedData = parseData(item.testData);\n if (!parsedData) return;\n parsedData.ip = item.hostAddress;\n parsedData.resolution = parsedData.resolution || null;\n parsedData.bandwidth = parsedData.bandwidth || null;\n parsedData.latency = parsedData.latency || null;\n parsedData.browser = parsedData.browser || '';\n parsedData.os = parsedData.os || '';\n parsedData.id = item.id;\n parsedData.date = moment(item.dateTime).format('MM/DD/YYYY') || 'Unknown';\n modifiedData.push(parsedData);\n });\n setData(modifiedData);\n }, [initialData]);\n\n const getUserTestHistory = async () => {\n try {\n setFetching(true);\n const params = {\n page: page + 1,\n limit: 8,\n orderKey: 'dateTime',\n order: false,\n ...structureDateFilter({ date: dateRange }),\n };\n const { data } = await Api.get(`/common/getconnectiontest`, { params });\n setPageCount(Math.ceil(data.data.count / 8));\n setInitialData(data.data.results);\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n } finally {\n setFetching(false);\n }\n };\n\n const onPageChange = ({ selected }) => {\n setPage(selected);\n };\n\n useEffect(() => {\n getUserTestHistory();\n //eslint-disable-next-line\n }, [page, dateRange]);\n\n useEffect(() => {\n if (initialData) generateData(initialData);\n }, [generateData, initialData]);\n\n return (\n \n
\n );\n};\n\nexport default DiagnosticsHistory;\n","import React, { memo } from 'react';\n\nconst CheckBox = ({ name, label, value, onChange, className, checked }) => {\n return (\n \n
\n \n
\n \n
\n {!fetching && (\n \n \n \n
\n
\n )}\n {fetching && | \n #\n | \nDate | \nResolution | \nLatency | \nBandwidth | \nIP Address | \nBrowser | \nOS Info | \n||
|---|---|---|---|---|---|---|---|---|---|
| \n {index + 1}\n | \n{date} | \n\n \n {resolution\n ? `Screen: ${resolution.screen}, Window: ${resolution.window}`\n : '-'}\n \n | \n \n \n {latency\n ? `Avg: ${latency.avg}ms, Min: ${latency.min}ms, Max: ${latency.max}ms`\n : '-'}\n \n | \n \n \n {bandwidth\n ? `Received ${Number(bandwidth.received).toFixed(2)} MB in ${Number(\n bandwidth.duration,\n ).toFixed(2)}s`\n : '-'}\n \n | \n {ip || '-'} | \n{browser || '-'} | \n40 ? 'font-size-10' : ''}`}>\n {os || '-'}\n | \n||
| \n \n \n | \n |||||||||
\n
\n );\n};\n\nexport default memo(CheckBox);\n","import React, { useEffect, useState } from 'react';\nimport { connect } from 'react-redux';\nimport { getCourses } from '../Courses/actions';\nimport { findCourseFirstLesson, getError } from 'utils/appHelpers';\nimport { IconCoursesNew } from 'shared/components/Icons';\nimport CourseItem from 'shared/components/CourseItem';\nimport { useSnackbar } from 'notistack';\nimport { Api } from 'utils/connectors';\nimport CheckBox from 'shared/components/CheckBox';\nimport CreatableSelect from 'react-select/creatable';\nimport { hasAccess } from 'utils/permissionHelper';\nimport {\n API_RESPONSE_STATUS_CODES,\n COURSE_TYPES,\n COURSE_TYPES_BY_TYPENAME,\n} from 'configs/constants';\n\nconst customStyles = {\n placeholder: (provided, state) => ({\n ...provided,\n fontWeight: 300,\n color: '#dddddd',\n }),\n};\n\nconst Courses = ({ courses, history, getCourses, match, location }) => {\n const isEvent = hasAccess('event_user');\n const { type } = match.params;\n const { enqueueSnackbar } = useSnackbar();\n const [franch, setFranch] = useState();\n const [types, setTypes] = useState(type ? [Number(type)] : []);\n const [courseTags, setCourseTags] = useState([]);\n const [tags, setTags] = useState([]);\n\n const isVisitorUser = hasAccess('visitor_user');\n\n const getFranchises = async () => {\n try {\n const { data } = await Api.get('/common/franchise');\n setFranch(data.data);\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n const getTags = async () => {\n try {\n const { data } = await Api.get('/tag/Tags', {\n params: {\n limit: 1000,\n },\n });\n setCourseTags(data.data.results);\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n const handleFilterChange = id => {\n const newTypes = [...types];\n if (newTypes.includes(Number(id))) {\n newTypes.splice(newTypes.indexOf(id), 1);\n } else {\n newTypes.push(Number(id));\n }\n setTypes(newTypes);\n };\n\n const courseClickHandle = async course => {\n history.push(`/allcourses/details/${course.id}`);\n };\n\n useEffect(() => {\n getCourses();\n getFranchises();\n getTags();\n //eslint-disable-next-line\n }, [getCourses]);\n\n const filteredCourses = courses.filter(item => {\n const hasType = types.length;\n const hasTag = tags.length;\n if (!hasType && !hasTag) return item;\n let result = false;\n\n if (hasType && !hasTag) {\n if (types.length && item.franchises && item.franchises.length) {\n result = types.filter(x => item.franchises.includes(x)).length;\n }\n } else if (!hasType && hasTag) {\n if (tags.length && item.courseTagsIds && item.courseTagsIds.length) {\n result = tags.filter(x => item.courseTagsIds.includes(x.id)).length;\n }\n } else {\n result =\n types.filter(x => item.franchises.includes(x)).length &&\n tags.filter(x => item.courseTagsIds.includes(x.id)).length;\n }\n\n return result;\n });\n\n const getOnlyCaseTypeLessonsCourses = courses => {\n return courses.filter(course => {\n if (course.lessons.some(l => l.type === 'cases')) {\n return true;\n }\n return false;\n });\n };\n\n return (\n \n
\n );\n};\n\nconst mapStateToProps = ({ courses }) => ({\n courses,\n});\n\nexport default connect(\n mapStateToProps,\n { getCourses },\n)(Courses);\n","export default __webpack_public_path__ + \"static/media/certificate.33f12be0.png\";","import React, { useEffect } from 'react';\nimport { connect } from 'react-redux';\nimport { getCourses } from '../Courses/actions';\nimport { courseSubsStatuses, findCourseFirstLesson } from 'utils/appHelpers';\nimport { IconCourses } from 'shared/components/Icons';\nimport certificate from 'assets/certificate.png';\nimport { hasAccess } from 'utils/permissionHelper';\nimport CourseItem from 'shared/components/CourseItem';\n\nconst Transcript = props => {\n const { courses, history, getCourses, marketingCourses } = props;\n const all = courses.filter(item => courseSubsStatuses(item.status, 'active'));\n const notCompletedCourses = all.filter(item => item.progress < 100);\n const completedCourses = all.filter(item => item.progress >= 100);\n const isEventUser = hasAccess('event_user');\n\n const activeMarketingCourses =\n marketingCourses?.length &&\n marketingCourses.filter(course => courseSubsStatuses(course?.status, 'active'));\n\n const courseClickHandle = course => {\n findCourseFirstLesson(course, history);\n };\n\n const marketingCourseClickHandle = course => {\n history.push(`/marketing-courses/${course.id}`);\n };\n\n const goToCertificates = () => {\n history.push('/profile/certificate');\n };\n\n useEffect(() => {\n getCourses();\n }, [getCourses]);\n\n return (\n \n
\n \n \n
\n \n
\n \n
\n \n {franch &&\n franch.map(item => (\n
\n \n setTags(data)}\n options={courseTags}\n isMulti\n getOptionLabel={o => o.name}\n getOptionValue={o => o.id}\n placeholder='Search with tags'\n />\n
\n \n {filteredCourses.map(item => (\n
\n \n Please note that all products and technologies may not be available in all markets.\n
\n {!isEvent && (\n\n Please click on the course thumbnail for course details and to enroll in a course.\n
\n )}\n\n
\n {!!activeMarketingCourses?.length && (\n \n
\n \n \n
\n \n
\n \n )}\n Enrolled
\n\n {notCompletedCourses.map(item => (\n
\n {!isEventUser && (\n <>\n Completed
\n\n {completedCourses.map(item => (\n
\n Certificate
\n\n \n 
\n
\n Certificates
\n\n
\n )}\n \n );\n};\n\nconst mapStateToProps = ({ courses, marketingCourses }) => ({\n courses,\n marketingCourses,\n});\n\nexport default connect(\n mapStateToProps,\n { getCourses },\n)(Transcript);\n","/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React, { useState } from 'react';\nimport { connect, useSelector } from 'react-redux';\nimport { useHistory } from 'react-router';\nimport Modal from 'react-modal';\nimport { confirmAlert } from 'react-confirm-alert';\nimport { useSnackbar } from 'notistack';\nimport InputGroup from 'shared/components/InputGroup';\nimport { Api } from 'utils/connectors';\nimport { IconKey, IconRight } from 'shared/components/Icons';\nimport { findCourseFirstLesson, getError } from 'utils/appHelpers';\n// import keyImage from 'assets/keyimage.png';\nimport { getCourses } from 'app/Main/routes/Courses/actions';\nimport ButtonLoading from './ButtonLoading';\n\nconst SubscriptionModal = ({\n data,\n onModalClose,\n onSuccess,\n getCourses,\n isFellowCourse,\n radiologist8HourCourseId,\n}) => {\n const userId = useSelector(item => item.account.id);\n const { enqueueSnackbar } = useSnackbar();\n const [fetching, setFetching] = useState(false);\n const history = useHistory();\n const keyReq = data && data.keyRequired;\n const [form, setForm] = useState({\n key: '',\n medicalLicenseNumber: '',\n npiNumber: '',\n });\n\n const subscribe = async () => {\n setFetching(true);\n try {\n if (isFellowCourse && !form.key.includes('FELLOW')) {\n confirmAlert({\n customUI: ({ onClose }) => {\n return (\n Marketing Materials
\n\n {activeMarketingCourses.map(item => (\n
\n \n
\n );\n },\n className: 'md custom-alert-container',\n });\n return;\n }\n const res = await Api.post('/subscription/subscribe', {\n subscriptionId: data.id,\n uniqueKey: form.key,\n medicalLicenseNumber: form.medicalLicenseNumber,\n npiNumber: form.npiNumber,\n userId,\n });\n await getCourses();\n if (onSuccess) onSuccess(true);\n enqueueSnackbar(res.data.message, { variant: 'success' });\n onModalClose();\n if (!keyReq && data.courses && data.courses[0]) {\n const course = data.courses[0];\n course.status = 1;\n findCourseFirstLesson(course, history);\n }\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n } finally {\n setFetching(false);\n }\n };\n\n const onHandleForm = ({ target }, trim) => {\n const value = trim ? target.value.trim() : target.value;\n setForm({ ...form, [target.name]: value });\n };\n\n if (!data) return null;\n\n const formValid = form.key && form.npiNumber && form.medicalLicenseNumber;\n\n return (\n \n This course is intended for Fellows only. Your code indicates you may be looking\n for this course\n
\n \n
\n {data.name}
\n\n Duration\n {data.time} hours\n
\n \n Parts\n {data.totalCourses} parts\n
\n \n Course Duration\n {data.days} days\n
\n \n Faculty\n {data.totalAuthors || data.authors.length} Faculty\n
\n {!!keyReq && (\n <>\n \n {\n onHandleForm(e, true);\n }}\n />\n
\n \n
\n \n
\n \n
\n \n
\n \n )}\n \n
\n \n
\n );\n};\n\nexport default memo(RadioBox);\n","import React from 'react';\nimport ProgressBar from 'shared/components/ProgressBar';\nimport { IconRight, IconKey, IconLock } from 'shared/components/Icons';\nimport { Link } from 'react-router-dom';\nimport { courseSubsStatuses } from 'utils/appHelpers';\n\nconst subsTypes = {\n 1: 'Opened',\n 2: 'Paid',\n 3: (\n <>\n \n
\n );\n};\n\nexport default SubscriptionItem;\n","import { useState, useEffect } from 'react';\n\nconst useDebounce = (value, delay) => {\n const [debouncedValue, setDebouncedValue] = useState(value);\n\n useEffect(() => {\n const handler = setTimeout(() => {\n setDebouncedValue(value);\n }, delay);\n\n return () => {\n clearTimeout(handler);\n };\n }, [value, delay]);\n\n return debouncedValue;\n};\n\nexport default useDebounce;\n","export default __webpack_public_path__ + \"static/media/video.adc569ac.jpg\";","import { formatCourseAuthors } from 'app/Main/routes/Authors/actions';\nimport { formatCourseData } from 'app/Main/routes/Courses/actions';\n\nimport placeholder from 'assets/video.jpg';\n\nconst findSubscriptionAuthors = courses => {\n if (!courses) return [];\n let result = [];\n courses.forEach(({ course }) => {\n if (course) {\n const authors = formatCourseAuthors(course.courseAuthors || []);\n result = [...result, ...authors];\n }\n });\n return result;\n};\n\nexport const formatSubscription = data => {\n return {\n id: data.id,\n name: data.title,\n type: data.subscriptionType,\n questions: data.testQuestions,\n image: data.imageUrl || placeholder,\n info: data.description,\n days: data.courseDuration,\n time: data.planDuration,\n authors: findSubscriptionAuthors(data.courses),\n userSubs: data.userSubscription || (data.userSubscriptions ? data.userSubscriptions[0] : null),\n courses: formatCourseData(data.courses),\n totalCourses: data.totalCourses,\n totalAuthors: data.totalAuthors,\n isSystem: data.isSystem,\n expirable: data.expirable,\n keyRequired: data.keyRequired,\n };\n};\n","import React, { useState, useEffect, useCallback } from 'react';\nimport { useSnackbar } from 'notistack';\nimport { IconSubscription, IconSearch } from 'shared/components/Icons';\nimport SubscriptionModal from 'shared/components/SubscriptionModal';\nimport RadioBox from 'shared/components/RadioBox';\nimport SubscriptionItem from './components/SubscriptionItem';\nimport ReactPaginate from 'react-paginate';\nimport { Api } from 'utils/connectors';\nimport { getError, courseSubsStatuses } from 'utils/appHelpers';\nimport useDebounce from 'shared/hooks/useDebounce';\nimport { formatSubscription } from 'utils/formatHelpers';\nimport Loading from 'shared/components/Loading';\n\nconst limit = 5;\n\nconst Subscriptions = ({ match }) => {\n const { enqueueSnackbar } = useSnackbar();\n const isAllSubscriptions = !!match.params.type;\n const [userSubs, setUserSubs] = useState([]);\n const [pendingSubs, setPendingSubs] = useState([]);\n const [fetch, setFetch] = useState(false);\n const [subs, setSubs] = useState([]);\n const [search, setSearch] = useState('');\n const [page, setPage] = useState(0);\n const [pageCount, setPageCount] = useState(0);\n const [filter, setFilter] = useState('all');\n const [modalData, setModalData] = useState(null);\n const debouncedSearch = useDebounce(search, 500);\n\n const getSubscriptions = useCallback(async () => {\n try {\n setFetch(true);\n const status = filter === 'all' ? null : filter;\n const params = { page: page + 1, limit, type: status, search: debouncedSearch };\n const { data } = await Api.get('/subscription/getsubscriptions', { params });\n const tempData = data.data.results.map(item => formatSubscription(item));\n setSubs(tempData);\n setPageCount(Math.ceil(data.data.count / limit));\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n setPageCount(0);\n } finally {\n setFetch(false);\n }\n }, [debouncedSearch, enqueueSnackbar, filter, page]);\n\n const getUserSubscription = useCallback(async () => {\n try {\n const { data } = await Api.get(`/subscription/getusersubscriptions`);\n const tempData = data.data.map(item => formatSubscription(item));\n const userSubsData = tempData.filter(\n item => !courseSubsStatuses(item.userSubs.userSubscriptionStatus, 'pending'),\n );\n const pendingSubsData = tempData.filter(item =>\n courseSubsStatuses(item.userSubs.userSubscriptionStatus, 'pending'),\n );\n setUserSubs(userSubsData);\n setPendingSubs(pendingSubsData);\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n }, [enqueueSnackbar]);\n\n const handleFilterChange = ({ target }) => {\n setFilter(target.value);\n setPage(0);\n };\n\n const handleSearchChange = ({ target }) => {\n setSearch(target.value);\n };\n\n const onPageChange = ({ selected }) => {\n setPage(selected);\n };\n\n const onSubscribeSuccess = () => {\n setSubs([]);\n setUserSubs([]);\n getUserSubscription();\n getSubscriptions();\n };\n\n useEffect(() => {\n getUserSubscription();\n }, [getUserSubscription]);\n\n useEffect(() => {\n getSubscriptions();\n }, [page, debouncedSearch, getSubscriptions]);\n\n return (\n <>\n \n
\n {isSubscribed && !isPending && (\n \n {isDisabled && (\n 
\n
\n \n
\n )}\n \n
\n {item.name}
\n- \n
- {subsTypes[item.type] || '-'} \n
- {item.time} hours \n
- {item.totalCourses || 0} Courses \n
- {item.expirable ? `${item.days} days` : 'No Expiration'} \n
- \n More info\n \n
\n
\n )}\n {isSubscribed && isPending && (\n \n \n Start:\n {userCourse.startDate.substr(0, 10)}\n \n {userCourse.progress === 100 && (\n \n End:\n {userCourse.endDate.substr(0, 10)}\n \n )}\n
\n \n Progress {userCourse.progress || 0}%\n
\n Request Sent
\n )}\n {!isSubscribed && (\n \n \n
\n )}\n \n
\n \n \n
\n \n {!isAllSubscriptions && (\n
\n {modalData && (\n \n
\n )}\n {isAllSubscriptions && (\n My Subscriptions
\n {userSubs &&\n userSubs.map((item, index) => (\nRequested Subscriptions
\n )}\n {pendingSubs &&\n pendingSubs.map((item, index) => (\n\n
\n )}\n Available Plans
\n\n
\n {fetch && \n
\n \n
\n \n {subs &&\n subs.map((item, index) => (\n setModalData(item)}\n />\n ))}\n
\n )}\n {subs && !subs.length && !fetch && (\n Subscriptions not found
\n )}\n {pageCount > 1 && (\n \n })
\n
\n \n {author.name} {author.surname}\n \n {author.profession}
\n {!isShort && (\n <>\n{author.description}
\n \n {/*\n \n {data.map(item => (\n \n
\n );\n};\n\nexport default AuthorsList;\n","import React, { useState } from 'react';\nimport { bindDuration } from 'utils/appHelpers';\n\nconst CoursesList = ({ data }) => {\n const [activeIndex, setActiveIndex] = useState(0);\n\n const toggleAccordion = index => setActiveIndex(activeIndex === index ? null : index);\n\n if (!data || !data.length) return null;\n return (\n \n {data.map((item, index) => (\n
\n );\n};\n\nexport default CoursesList;\n","import React, { useEffect, useState, useCallback } from 'react';\nimport { connect } from 'react-redux';\nimport { useSnackbar } from 'notistack';\nimport { IconRight, IconKey } from 'shared/components/Icons';\nimport { Api } from 'utils/connectors';\nimport { getError, courseSubsStatuses } from 'utils/appHelpers';\nimport { formatSubscription } from 'utils/formatHelpers';\nimport SubscriptionModal from 'shared/components/SubscriptionModal';\nimport Loading from 'shared/components/Loading';\nimport ProgressBar from 'shared/components/ProgressBar';\nimport AuthorsList from './components/AuthorsList';\nimport CoursesList from './components/CoursesList';\nimport ButtonLoading from 'shared/components/ButtonLoading';\nimport { getCourses } from '../Courses/actions';\nimport BackButton from 'shared/BackButton';\n\nconst subsTypes = {\n 1: 'Opened',\n 2: 'Paid',\n 3: (\n <>\n - \n
- \n
- \n {item.lessons.map(lesson => (\n
- \n {lesson.name}\n {bindDuration(lesson.duration)}\n \n ))}\n
\n )}\n
\n
\n \n \n
\n \n
\n {item.name}
\n\n
\n lesson: {item.lessons.length || 0}
\n Faculty: {item.authors.length || 0}
\n {item.description}
\n \n {activeIndex === index && (\n\n
\n \n \n
\n \n
\n {modalData && (\n \n
\n {subscription.info}
\nFaculty
\n {subscription.authors && subscription.authors.length > 0 && (\nCourses
\n {subscription.courses && subscription.courses.length > 0 && (\n\n
\n \n 
\n
\n \n {subscription.name}\n
\n{subsTypes[subscription.type] || '-'}
\n \n Duration\n {subscription.time} hours\n
\n \n Parts\n {subscription.courses ? subscription.courses.length : '0'} parts\n
\n \n Validity\n {subscription.expirable ? `${subscription.days} days` : 'No Expiration'}\n
\n \n Faculty\n {subscription.authors.length} Faculty\n
\n {isDeclined && (\n \n setModalData(subscription)}\n >\n Subscribe now
\n )}\n {isAccepted && (\n <>\n \n
\n \n \n Start On:\n {subscription.userSubs.startDate.substr(0, 10)}\n \n {!!subscription.expirable && (\n \n End On:\n {subscription.userSubs.endDate.substr(0, 10)}\n \n )}\n
\n\n \n \n Progress {subscription.userSubs.progress || 0}%\n \n
\n \n \n {fetch ?
\n \n )}\n {isPending && Request Sent
}\n \n {children}\n
\n );\n};\nconst DropdownBody = ({ children }) => {\n return {children}
;\n};\n\nconst DropDown = ({ children, className = '' }) => {\n const [open, toggleDropdown] = useState(false);\n\n useEffect(() => {\n if (open) listenToOutsideClick(toggleDropdown);\n }, [open]);\n\n return (\n \n {cloneElement(children[0], { onClick: () => toggleDropdown(!open) })}\n {open && children[1]}\n
\n );\n};\n\nexport { DropDown, DropdownHeader, DropdownBody };\n","import React from 'react';\nimport { Link } from 'react-router-dom';\nimport { IconAuthorsNew } from 'shared/components/Icons';\nimport { DropDown, DropdownHeader, DropdownBody } from 'shared/components/DropDown';\nimport { hasAccess } from 'utils/permissionHelper';\nimport { getEventUrl } from 'utils/appHelpers';\n\nconst avatarPlaceholder =\n 'https://i1.wp.com/ggrmlawfirm.com/wp-content/uploads/avatar-placeholder.png?fit=256%2C256&ssl=1';\n\nconst AuthorsDropdown = ({ data = [] }) => {\n const path = hasAccess('event_user') ? getEventUrl() : '';\n return (\n - \n {data.length > 0 &&\n data.map(item => {\n const { id, name = '', surname, profession = '', image } = item;\n return (\n
- \n \n \n\n
\n
\n \n {name} {surname}\n \n {profession}\n
\n \n \n );\n })}\n {!data.length && - No results found... }\n
\n {!isEventUser && (\n \n Progress \n Quiz \n Certificate
\n );\n};\nexport default CourseHeaderRightNav;\n","import React from 'react';\nimport AuthorsDropdown from './AuthorsDropdown';\nimport BackButton from 'shared/BackButton';\nimport CourseHeaderRightNav from './CourseHeaderRightNav';\nimport { hasAccess } from 'utils/permissionHelper';\n\nconst HeaderSection = ({ course, history }) => {\n return (\n \n
\n );\n};\nexport default HeaderSection;\n","import React from 'react';\n\nconst InfoSection = ({ info }) => (\n \n
\n {course.name}
\n \n
\n \n
\n);\nexport default InfoSection;\n","import React from 'react';\nimport {\n IconPlayFill,\n IconLock,\n IconVideos,\n CircleFillIcon,\n NumberQuestionSignIcon,\n} from 'shared/components/Icons';\nimport { bindDuration, getEventUrl } from 'utils/appHelpers';\nimport { hasAccess } from 'utils/permissionHelper';\nimport { DEFAULT_IMG_URLS, LESSON_STATUSES } from 'configs/constants';\n\nconst LessonsListSection = ({ lessons, activeLesson, history, courseId }) => {\n const path = hasAccess('event_user') ? getEventUrl() : '';\n\n const lessonClickHandle = (lesson, e) => {\n if (lesson.status === LESSON_STATUSES.notStarted) {\n e.preventDefault();\n return;\n }\n\n const isPLayButton = e.target?.ariaLabel === 'lessonPlay';\n\n if (!isPLayButton) {\n history.push(`${path}/courses/${courseId}/${lesson.type}/${lesson.id}`);\n return;\n }\n\n const lessonPath = `${path}/courses/${courseId}/${lesson.type}/${lesson.id}`;\n\n if (lesson.type === 'cases') {\n history.push(`${lessonPath}/play`);\n } else if (lesson.type === 'video') {\n history.push(`${lessonPath}/auto`);\n } else {\n history.push(`${lessonPath}`);\n }\n\n window.scrollTo(0, 0);\n };\n\n return (\n Info:
\n{info}
\n\n {lessons &&\n lessons\n .sort((l1, l2) => l1.lessonOrder - l2.lessonOrder)\n .map(lesson => {\n const active = lesson.id === activeLesson.id;\n const isLessonUnlocked =\n lesson.status === LESSON_STATUSES.inProgress ||\n lesson.status === LESSON_STATUSES.completed;\n const isFeedback = lesson.type === 'feedback';\n const isQuiz = lesson.type === 'quiz';\n const UnlockedIcon = active ? IconPlayFill : CircleFillIcon;\n const Icon = isLessonUnlocked ? UnlockedIcon : IconLock;\n return (\n \n \n {lesson.episodes && (\n \n {lesson.episodes.length}{' '}\n {isQuiz ?
\n )}\n \n );\n })}\n \n );\n};\n\nexport default LessonsListSection;\n","import React, { useRef, useState, useEffect } from 'react';\nimport { useDispatch, connect } from 'react-redux';\nimport { useHistory } from 'react-router-dom';\nimport { Player, BigPlayButton } from 'video-react';\nimport { IconPlayFill, IconLock, CircleFillIcon } from 'shared/components/Icons';\nimport { Api } from 'utils/connectors';\nimport { onCourseUpdate, getCourses } from 'app/Main/routes/Courses/actions';\nimport { bindDuration, isMobileDevice } from 'utils/appHelpers';\nimport { LESSON_STATUSES } from 'configs/constants';\n\nlet activeTime = 0;\nlet lastSendTime = 0;\nlet checkTime = 0;\nlet videoFinish = false;\n\nconst TypeVideo = ({ lesson, course, getCourses, action }) => {\n const history = useHistory();\n const dispatch = useDispatch();\n const [activePart, setActivePart] = useState(lesson.episodes[0]);\n const player = useRef(null);\n const videoSettings = {\n src: lesson.url || lesson.contentUrl,\n fluid: false,\n preload: 'auto',\n height: 465,\n };\n\n const epsiodeTimes = lesson.episodes.map(item => item.time);\n\n const navigateToNextLesson = () => {\n const currentLessonIndex = course.lessons.findIndex(l => l.id === lesson.id);\n const nextLesson = course.lessons[currentLessonIndex + 1];\n if (nextLesson) {\n history.push(`/courses/${course.id}/${nextLesson.type}/${nextLesson.id}`);\n }\n };\n\n const updateLessonsTimeAndEpisode = episodeId => {\n const tempCourse = { ...course };\n const lessonIndex = tempCourse.lessons.findIndex(item => item.id === lesson.id);\n const tempLesson = tempCourse.lessons[lessonIndex];\n const episodeIndex = tempLesson.episodes.findIndex(item => item.id === episodeId);\n const tempEpisode = tempLesson.episodes[episodeIndex];\n tempLesson.completed = activeTime;\n tempEpisode.status = 1;\n if (!videoFinish) dispatch(onCourseUpdate(tempCourse));\n };\n\n const autoSelectEpisode = ({ currentTime, seeking }) => {\n const videoTime = Math.ceil(currentTime);\n if (!videoTime || videoTime === checkTime || seeking) return;\n let activeKey = 0;\n checkTime = videoTime;\n epsiodeTimes.forEach((item, key) => {\n if (checkTime >= item) activeKey = key;\n });\n updateLessonsTimeAndEpisode(lesson.episodes[activeKey].id);\n setActivePart(lesson.episodes[activeKey]);\n };\n\n const sendLessonTime = async (time, videoFinished, isSkipEpisode) => {\n const completed = time > lesson.duration ? lesson.duration : time;\n const body = { lessonId: lesson.id, completed, courseId: course.id };\n if (videoFinished) {\n await Api.post('/courses/updateuserlesson', body);\n if (isSkipEpisode) {\n const tempCourse = { ...course };\n const lessonIndex = tempCourse.lessons.findIndex(item => item.id === lesson.id);\n tempCourse.lessons[lessonIndex].status = LESSON_STATUSES.completed;\n const nextLesson = tempCourse.lessons[lessonIndex + 1];\n if (nextLesson) {\n nextLesson.status = LESSON_STATUSES.inProgress;\n dispatch(onCourseUpdate(tempCourse));\n }\n } else {\n await getCourses();\n navigateToNextLesson();\n }\n } else {\n Api.post('/courses/updateuserlesson', body);\n }\n };\n\n const updateLessonTime = time => {\n const sendTime = Math.ceil(time);\n if (sendTime % 5 === 0 && sendTime > activeTime && sendTime !== lastSendTime) {\n lastSendTime = sendTime;\n sendLessonTime(sendTime);\n }\n };\n\n const handleCanSkipEpisode = () => {\n const epsiodeIndex = lesson.episodes.findIndex(i => i.id === activePart.id);\n const nextEpisode = lesson.episodes[epsiodeIndex + 1];\n if (nextEpisode) {\n activeTime = nextEpisode.time;\n updateLessonsTimeAndEpisode(nextEpisode.id);\n } else {\n activeTime = lesson.duration;\n sendLessonTime(lesson.duration, true, true);\n }\n };\n\n const handleStateChange = async nextState => {\n autoSelectEpisode(nextState);\n if (nextState.currentTime > activeTime) {\n if (!nextState.seeking) {\n activeTime = Math.max(activeTime, nextState.currentTime);\n if (activePart.canSkipAfter && activeTime >= activePart.canSkipAfter) {\n handleCanSkipEpisode();\n }\n updateLessonTime(activeTime);\n if (Math.ceil(activeTime) === Math.ceil(nextState.duration) && !videoFinish) {\n videoFinish = true;\n await sendLessonTime(Math.ceil(nextState.duration), true);\n navigateToNextLesson();\n }\n } else {\n player.current.seek(activeTime);\n }\n }\n };\n\n const handlePartSelect = episode => {\n if (episode.status !== 1) return;\n player.current.seek(episode.time);\n setActivePart(episode);\n };\n\n const setLastViewedTime = lesson => {\n if (lesson.completed < lesson.duration) player.current.seek(lesson.completed);\n };\n\n const lessonStartLog = () => {\n Api.post('/courses/lesson/start', {\n courseId: course.id,\n lessonId: lesson.id,\n });\n };\n\n useEffect(() => {\n activeTime = lesson.completed || 0;\n setLastViewedTime(lesson);\n const subs = player.current.subscribeToStateChange(handleStateChange);\n const pCurrent = player.current;\n if (action && action === 'auto') {\n pCurrent.play();\n }\n return function cleanup() {\n pCurrent.pause();\n subs();\n };\n //eslint-disable-next-line\n }, [lesson]);\n\n useEffect(() => {\n activeTime = lesson.completed || 0;\n lastSendTime = 0;\n checkTime = 0;\n videoFinish = false;\n }, [lesson]);\n\n useEffect(() => {\n if (!course.isMarketingMaterial) lessonStartLog();\n //eslint-disable-next-line\n }, []);\n\n return (\n <>\n \n
\n {!isFeedback && (\n \n
\n \n
\n {lesson.name}
\n{lesson.description}
\n{bindDuration(isQuiz ? lesson.duration * 60 : lesson.duration)}
\n\n \n
\n {course?.isMarketingMaterial && isMobileDevice() && (\n \n
\n )}\n {!(course.isMarketingMaterial && isMobileDevice()) && (\n \n
\n \n
\n {lesson.title}
\n{lesson.info}
\n\n
\n \n )}\n \n );\n};\n\nexport default connect(\n null,\n { getCourses },\n)(TypeVideo);\n","import React, { useState, createRef, useEffect } from 'react';\nimport { useDispatch, connect } from 'react-redux';\nimport { Document, Page, pdfjs } from 'react-pdf';\nimport { Api } from 'utils/connectors';\nimport { onCourseUpdate, getCourses } from 'app/Main/routes/Courses/actions';\nimport { isMobileDevice } from 'utils/appHelpers';\nimport { CircleFillIcon, VideoPlayCircleNotAllowedIcon } from 'shared/components/Icons';\n\nconst pdfVersion = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.js`;\npdfjs.GlobalWorkerOptions.workerSrc = pdfVersion;\n\nconst TypePDF = ({ lesson, course, getCourses }) => {\n const dispatch = useDispatch();\n const [page, setPage] = useState(1);\n const [pages, setPages] = useState([]);\n\n const pdfContainerRef = createRef();\n let scrollingOffset = 0;\n let PDFNode = null;\n const width = window.innerWidth - 230 - 310;\n\n const updateLessonsTimeAndEpisode = page => {\n const tempCourse = { ...course };\n const lessonIndex = tempCourse.lessons.findIndex(item => item.id === lesson.id);\n const tempLesson = tempCourse.lessons[lessonIndex];\n tempLesson.completed = page;\n dispatch(onCourseUpdate(tempCourse));\n };\n\n const sendLessonTime = page => {\n const body = { lessonId: lesson.id, completed: page, courseId: course.id };\n Api.post('/courses/updateuserlesson', body);\n updateLessonsTimeAndEpisode(page);\n getCourses();\n };\n\n const onDocumentLoadSuccess = document => {\n const { numPages } = document;\n setPages(new Array(numPages).fill(1));\n };\n\n const selectPage = index => {\n if (!PDFNode) {\n PDFNode = Array.from(pdfContainerRef.current.children).find(\n elem => elem.className === 'react-pdf__Document' && elem,\n );\n }\n setTimeout(() => {\n PDFNode.scrollTop = 0;\n setPage(index + 1);\n }, 0);\n };\n\n const handlePdfScrolling = () => {\n if (pages.length < 2) return;\n if (!PDFNode) {\n PDFNode = Array.from(pdfContainerRef.current.children).find(\n elem => elem.className === 'react-pdf__Document' && elem,\n );\n }\n const { scrollHeight, scrollTop, clientHeight } = PDFNode;\n const scrolledTillEnd = scrollTop + clientHeight >= scrollHeight;\n\n setTimeout(() => {\n const nextCondition = scrollingOffset < scrollTop && scrolledTillEnd && page !== pages.length;\n const prevCondition = scrollingOffset > scrollTop && scrollTop === 0 && page !== 1;\n if (nextCondition) {\n PDFNode.scrollTop = 1;\n setPage(page + 1);\n } else if (prevCondition) {\n PDFNode.scrollTop = scrollHeight - clientHeight - 1;\n setPage(page - 1);\n }\n scrollingOffset = scrollTop;\n }, 0);\n };\n\n useEffect(() => {\n if (page > lesson.completed) {\n sendLessonTime(page);\n }\n //eslint-disable-next-line\n }, [page]);\n\n return (\n <>\n {course.isMarketingMaterial && isMobileDevice() ? (\n {lesson.name} - Chapters
\n\n {lesson.episodes &&\n lesson.episodes.map((item, index) => {\n const active =\n item.status === LESSON_STATUSES.inProgress ||\n item.status === LESSON_STATUSES.completed;\n const Icon = active ? IconPlayFill : IconLock;\n const selected = activePart && activePart.name === item.name ? 'active' : '';\n const disabled = !active ? 'disabled' : '';\n return (\n handlePartSelect(item)}\n role='button'\n tabIndex='-1'\n key={item.name + index}\n className={`part-item d-flex align-items-center px-3 ${disabled} ${selected}`}\n >\n
\n );\n })}\n \n
\n \n
\n {item.name}
\n{bindDuration(item.time)}
\n\n
\n ) : (\n <>\n \n 
\n )}\n
\n {course?.isMarketingMaterial && isMobileDevice() && (\n No Image
\n ) : (\n \n
\n )}\n \n
\n \n
\n {lesson.title}
\n{lesson.info}
\n\n
\n \n \n )}\n \n );\n};\n\nexport default connect(\n null,\n { getCourses },\n)(TypePDF);\n","export default __webpack_public_path__ + \"static/media/case_placeholder.71a1988e.jpg\";","import React from 'react';\nimport { Link } from 'react-router-dom';\nimport placeholder from 'assets/case_placeholder.jpg';\nimport {\n CircleFillIcon,\n IconPlayFill,\n VideoPlayCircleNotAllowedIcon,\n} from 'shared/components/Icons';\nimport { hasAccess } from 'utils/permissionHelper';\nimport { getEventUrl, isMobileDevice } from 'utils/appHelpers';\n\nconst TypeCases = ({ lesson, course }) => {\n const path = hasAccess('event_user') ? getEventUrl() : '';\n const isLinkActive = !(course?.isMarketingMaterial && isMobileDevice());\n\n return (\n <>\n {lesson.name} - Chapters
\n\n {pages.map((item, index) => (\n selectPage(index)}\n role='button'\n tabIndex='-1'\n key={index}\n className={`part-item d-flex align-items-center px-3 ${\n index + 1 === page ? 'active' : ''\n }`}\n >\n
\n ))}\n \n
\n Page N{index + 1}
\n\n {isLinkActive ? (\n \n
\n {!isLinkActive && (\n \n
\n )}\n \n );\n};\n\nexport default TypeCases;\n","import React, { useEffect } from 'react';\nimport { connect } from 'react-redux';\nimport { Api } from 'utils/connectors';\nimport { getCourses } from 'app/Main/routes/Courses/actions';\nimport { useSnackbar } from 'notistack';\nimport { getError, isMobileDevice } from 'utils/appHelpers';\nimport { CircleFillIcon } from 'shared/components/Icons';\n\nconst TypeImage = ({ lesson, getCourses, params, course }) => {\n const { enqueueSnackbar } = useSnackbar();\n const updateLesson = async () => {\n try {\n const body = {\n lessonId: Number(params?.lessonId) || lesson?.id,\n completed: 1,\n courseId: course.id,\n };\n await Api.post('/courses/updateuserlesson', body);\n getCourses();\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n useEffect(() => {\n if (!course.isMarketingMaterial && !course.isOpened) updateLesson();\n\n //eslint-disable-next-line\n }, []);\n\n return (\n \n
\n \n
\n {lesson.title}
\n{lesson.info}
\n\n
\n )}\n \n );\n};\n\nexport default connect(\n null,\n { getCourses },\n)(TypeImage);\n","export const QUESTION_TYPES_OBJ = {\n radio: 'radio',\n multi: 'multi',\n yesno: 'yesno',\n 'image-category': 'image-category',\n};\n\nexport const QUIZ_STATUS_OBJ = {\n 1: 'InProgress',\n 2: 'Success',\n 3: 'Failure',\n 4: 'Terminated',\n 5: 'Expired',\n};\n\nexport const QUIZ_STATUSES = {\n InProgress: 1,\n Success: 2,\n Failure: 3,\n Terminated: 4,\n Expired: 5,\n};\n\nexport const QUIZ_START_DESC_OBJ = {\n Pending: 'Your quiz is in progress. Press to Continue',\n Expired: 'Your quiz was expired. Click start to try to pass the quiz newly',\n Completed: 'You have successfully completed this quiz.',\n};\n\nexport const QUIZ_ANSWER_STATUS_OBJ = {\n 1: 'Pending',\n 2: 'Success',\n 3: 'Failure',\n 4: 'NoAnswer',\n 5: 'Expired',\n};\n\nexport const ANSWER_STATUSES = {\n Pending: 1,\n Success: 2,\n Failure: 3,\n NoAnswer: 4,\n Expired: 5,\n};\n\nexport const ENGLISH_UPPERCASE_LETTERS = [\n 'A',\n 'B',\n 'C',\n 'D',\n 'E',\n 'F',\n 'G',\n 'H',\n 'I',\n 'J',\n 'K',\n 'L',\n 'M',\n 'N',\n 'O',\n 'P',\n 'Q',\n 'R',\n 'S',\n 'T',\n 'U',\n 'V',\n 'W',\n 'X',\n 'Y',\n 'Z',\n];\n","import React from 'react';\nimport Button from 'shared/components/Button';\nimport { QuizIcon } from 'shared/components/Icons';\nimport { QUIZ_ANSWER_STATUS_OBJ, QUIZ_START_DESC_OBJ, QUIZ_STATUSES } from '../constants';\n\nexport const QuizStart = ({ handleOpenStartModal, handleContinue, status, isLessonCompleted }) => {\n const isInProgress = status === QUIZ_STATUSES.InProgress;\n return (\n \n
\n \n
\n {lesson.title}
\n{lesson.info}
\n\n
\n );\n};\n","import React, { useState, useEffect, useRef } from 'react';\nimport { bindDuration } from 'utils/appHelpers';\n\nexport const CountDown = ({\n timeLimit,\n questionTimeLimit,\n question,\n pingToBackend,\n passedDuration,\n onTimeEnded,\n isModalOpen,\n isQuestionTimer,\n passedSecondsRef,\n passedSecondsOnQuestionRef,\n}) => {\n const [leftSeconds, setLeftSeconds] = useState(timeLimit * 60 - passedDuration);\n const [leftSecondsOnQuestion, setLeftSecondsOnQuestion] = useState(\n questionTimeLimit * 60 - question.duration,\n );\n\n const timerIdRef = useRef(null);\n\n const startInterval = () => {\n timerIdRef.current = setInterval(async () => {\n if (!isQuestionTimer) {\n passedSecondsRef.current += 1;\n setLeftSeconds(prev => prev - 1);\n if (passedSecondsRef.current % 10 === 0) {\n pingToBackend({\n passedSeconds: passedSecondsRef.current,\n passedSecondsOnQuestion: passedSecondsOnQuestionRef.current,\n });\n }\n }\n\n if (questionTimeLimit && passedSecondsOnQuestionRef.current !== questionTimeLimit * 60) {\n if (isQuestionTimer) {\n passedSecondsOnQuestionRef.current += 1;\n setLeftSecondsOnQuestion(prev => prev - 1);\n if (passedSecondsOnQuestionRef.current % 10 === 0) {\n pingToBackend({\n passedSeconds: passedSecondsRef.current,\n passedSecondsOnQuestion: passedSecondsOnQuestionRef.current,\n });\n }\n }\n }\n }, 1000);\n };\n\n useEffect(() => {\n if (timeLimit && !isModalOpen) {\n startInterval();\n } else {\n clearInterval(timerIdRef.current);\n timerIdRef.current = null;\n }\n\n return () => {\n clearInterval(timerIdRef.current);\n };\n }, [timeLimit, leftSeconds, onTimeEnded, pingToBackend, isModalOpen]);\n\n useEffect(() => {\n passedSecondsOnQuestionRef.current = 0;\n }, [question.id]);\n\n return (\n <>\n {!!timeLimit && !isQuestionTimer && (\n \n \n {isInProgress ? 'Continue' : 'Start'}\n \n
\n \n {isLessonCompleted\n ? QUIZ_START_DESC_OBJ.Completed\n : QUIZ_START_DESC_OBJ[QUIZ_ANSWER_STATUS_OBJ[status]] ||\n 'Press start to pass the quiz. It is recommended to read the quiz details on the quiz pre-start modal.'}\n
\n{bindDuration(leftSeconds)}
\n )}\n {!!questionTimeLimit && isQuestionTimer && (\n {bindDuration(leftSecondsOnQuestion)}
\n )}\n \n );\n};\n","/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React, { useEffect, useRef } from 'react';\nimport { bindDurationSecondsGettingMins } from 'utils/appHelpers';\nimport { QUIZ_ANSWER_STATUS_OBJ } from '../constants';\nimport { CountDown } from './CountDown';\n\nexport const QuizFlow = ({\n quiz,\n lesson,\n startTime,\n onClickLeave,\n currentStep,\n passedQuestions,\n isQuizInProgress,\n question,\n passedDuration = 0,\n questionPassedDuration = 0,\n isQuizCompleted,\n isModalOpen,\n handleSkipStep,\n passingThresholdStep,\n quizUsage,\n}) => {\n const backendPingInterval = 10;\n const sortedPassedQuestions = passedQuestions\n ? passedQuestions.slice().sort((a, b) => a?.step - b?.step)\n : [];\n\n // Use refs to hold these values\n const passedSecondsRef = useRef(passedDuration);\n const passedSecondsOnQuestionRef = useRef(questionPassedDuration);\n\n const getIsCurrentQuestion = idx => currentStep === idx;\n\n const steps = quiz?.steps ? [...quiz.steps] : [...(lesson.steps || [])];\n if (sortedPassedQuestions.length) {\n steps.splice(0, sortedPassedQuestions.length, ...sortedPassedQuestions);\n }\n\n const passThresholdIdx = passingThresholdStep;\n const flowSteps = [{ type: 'start' }, ...steps, { type: 'results' }];\n const getIsBreakPoint = idx =>\n idx === passThresholdIdx ||\n idx === 0 ||\n idx === flowSteps.length - 1 ||\n (isQuizInProgress && idx === currentStep);\n const passedStep = isQuizCompleted ? steps.length + 3 : isQuizInProgress ? currentStep + 1 : 1;\n const isQuizNotStarted = !isQuizInProgress && !isQuizCompleted;\n\n useEffect(() => {\n passedSecondsOnQuestionRef.current = 0;\n }, [question?.id]);\n\n useEffect(() => {\n passedSecondsRef.current = 0;\n }, [isQuizInProgress]);\n\n return (\n \n
\n );\n};\n","export default \"data:image/png;base64,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\"","/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport Button from 'shared/components/Button';\nimport Logo from 'assets/logos/ACE-logo_final-White.png';\nimport {\n BatteryIcon,\n DurationIcon,\n ModalCloseIcon,\n NumberIcon,\n PassThresholdIcon,\n TerminateLeaveIcon,\n TimeLimitIcon,\n} from 'shared/components/Icons';\n\nexport const QuizStartModal = ({\n isOpen,\n onClose,\n onStart,\n lesson,\n passedDuration = 0,\n currentAttempt,\n}) => {\n if (!isOpen) return null;\n\n return ReactDOM.createPortal(\n \n
\n Quiz Flow
\n {isQuizInProgress && (\n\n Leave Quiz\n
\n )}\n \n
\n \n {flowSteps.map((step, idx) => {\n return (\n \n \n {passedQuestions && (\n <>\n {QUIZ_ANSWER_STATUS_OBJ[(step.question?.userAnswerStatus)] === 'Success' && (\n
\n {idx !== flowSteps.length - 1 && (\n \n Correct\n
\n )}\n {QUIZ_ANSWER_STATUS_OBJ[(step.question?.userAnswerStatus)] === 'Failure' && (\n \n Incorrect\n
\n )}\n {QUIZ_ANSWER_STATUS_OBJ[(step.question?.userAnswerStatus)] === 'NoAnswer' && (\n \n Not Answered\n
\n )}\n {QUIZ_ANSWER_STATUS_OBJ[(step.question?.userAnswerStatus)] === 'Expired' && (\n \n Expired\n
\n )}\n \n )}\n \n {!!question?.timeLimit && getIsCurrentQuestion(idx) && (\n \n
\n\n {idx === passThresholdIdx && passThresholdIdx <= flowSteps.length - 2 && (\n \n Passing Threshold\n
\n )}\n {idx === flowSteps.length - 1 && (\n <>\n {isQuizCompleted && }\n \n Results\n
\n \n )}\n {getIsCurrentQuestion(idx) && isQuizInProgress && (\n {currentStep}
\n )}\n idx + 1 && 'passed'}`} />\n )}\n \n );\n })}\n
\n \n
,\n document.getElementById('root'),\n );\n};\n","/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React from 'react';\nimport { CSS } from '@dnd-kit/utilities';\nimport { useSortable } from '@dnd-kit/sortable';\n\nexport const SortableImgItem = props => {\n const {\n name,\n id,\n url,\n imageUrl,\n activeItemId,\n overItemId,\n size = 'medium',\n handleSelectItem = () => {},\n isSelected,\n isActiveDragging,\n } = props;\n const { attributes, listeners, setNodeRef, transform, transition } = useSortable({\n id,\n });\n\n const style = {\n transform: CSS.Transform.toString(transform),\n transition,\n };\n\n return (\n e.stopPropagation()}>\n
\n \n 
\n \n
\n \n Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla pharetra aliquet lectus\n malesuada pulvinar.{' '}\n
\n\n
\n \n
\n Before you begin
\n\n Each Answer will be submitted by clicking next. You can't go back to change your\n answers. There are answers for which individual time limit and if you not submit\n before limit ends the answer will be considered as wrong.\n
\n\n
\n Overview
\n\n The details about the quiz duration, time limit etc. are shown below.\n
\n\n
\n \n
\n \n \n
\n \n
\n {lesson.steps?.length}\n \n
\n \n
\n \n {currentAttempt}/{lesson.attempts}\n \n \n
\n \n
\n {lesson.passingThreshold}%\n \n
\n \n
\n \n
\n \n {lesson.timeLimit\n ? `~${(lesson.timeLimit - passedDuration / 60).toFixed(0)} min`\n : 'No Limit'}\n \n \n
\n \n
\n {lesson.timeLimit ? `${lesson.timeLimit} min` : 'No Limit'}\n \n
\n \n
\n {lesson.terminateOnLeave ? 'Yes' : 'No'}\n \n \n {\n onStart();\n onClose();\n }}\n >\n Start\n \n
\n \n
\n );\n};\n","import React from 'react';\nimport { useDroppable } from '@dnd-kit/core';\n\nexport const DroppableUncategorizedArea = ({ children, handleScroll, id }) => {\n const { setNodeRef: setFirstDroppableRef } = useDroppable({\n id,\n });\n return (\n \n {!column.isEditing &&
\n {column.columnName}
}\n\n {children}\n
\n \n
\n );\n};\n","import React, { useState } from 'react';\nimport { ENGLISH_UPPERCASE_LETTERS } from '../constants';\n\nexport const RadioTypeQuestion = ({ question, setAnswer, currentStep }) => {\n const [selectedAnswerId, setSelectedAnswerId] = useState(null);\n\n const handleRadioChange = (idx, id) => {\n setSelectedAnswerId(id);\n setAnswer([question.answersMulti[idx].answer]);\n };\n\n return (\n <>\n \n
\n \n {currentStep}\n
\n {question?.title}
\n \n {currentStep}/{questionsCount}\n \n\n {!!question.type && (\n
\n \n {\n let currentAnswer = [...(answer || [])];\n if (question.type === QUESTION_TYPES_OBJ['image-category']) {\n currentAnswer = (answer || []).map(a => ({\n category: a.name,\n imageIds: a.items.map(img => img.imageId),\n }));\n }\n setAnswer(null);\n handleSubmitAnswer(currentAnswer, question?.type);\n }}\n className={`btn-blue btn-quiz-main`}\n disabled={isRequired && !answer?.length}\n >\n {currentStep === questionsCount ? 'Finish' : 'Next'}\n \n
\n \n Answer Type:\n Text Single Select\n
\n \n {question.answersMulti.map((answer, idx) => {\n const isSelected = selectedAnswerId === answer.questionAnswerId;\n return (\n
\n \n );\n};\n","import React, { useState } from 'react';\nimport { ENGLISH_UPPERCASE_LETTERS } from '../constants';\nimport { QuestionMultiCheckIcon } from 'shared/components/Icons';\n\nexport const MultiTypeQuestion = ({ question, setAnswer, currentStep }) => {\n const [selectedAnswers, setSelectedAnswers] = useState([]); // It's now an array to store multiple selections\n\n const handleCheckboxChange = (idx, id) => {\n if (selectedAnswers.includes(id)) {\n setSelectedAnswers(selectedAnswers.filter(item => item !== id));\n setAnswer(prevAnswers => {\n return (prevAnswers || []).filter(a => a !== question.answersMulti[idx].answer);\n });\n } else {\n setSelectedAnswers([...selectedAnswers, id]);\n setAnswer(prevAnswers => [...(prevAnswers || []), question.answersMulti[idx].answer]);\n }\n };\n\n return (\n <>\n \n handleRadioChange(idx, answer.questionAnswerId)}\n />\n \n
\n );\n })}\n \n Answer Type:\n Text Multiple Select\n
\n \n {question.answersMulti.map((answer, idx) => {\n const isSelected = selectedAnswers.includes(answer.questionAnswerId);\n return (\n
\n \n );\n};\n","import React, { useState } from 'react';\nimport { ENGLISH_UPPERCASE_LETTERS } from '../constants';\n\nexport const BooleanTypeQuestion = ({ question, setAnswer, currentStep }) => {\n const [selectedAnswerId, setSelectedAnswerId] = useState(null);\n\n const handleRadioChange = (idx, id) => {\n setSelectedAnswerId(id);\n setAnswer([question.answersMulti[idx].answer]);\n };\n\n return (\n <>\n \n handleCheckboxChange(idx, answer.questionAnswerId)}\n />\n \n
\n );\n })}\n \n Answer Type:\n Boolean Type Select\n
\n \n {question.answersMulti.map((answer, idx) => {\n const isSelected = selectedAnswerId === answer.questionAnswerId;\n return (\n
\n \n );\n};\n","import React, { useEffect, useState } from 'react';\nimport {\n DndContext,\n KeyboardSensor,\n PointerSensor,\n useSensor,\n useSensors,\n DragOverlay,\n} from '@dnd-kit/core';\nimport {\n arrayMove,\n SortableContext,\n sortableKeyboardCoordinates,\n rectSortingStrategy,\n} from '@dnd-kit/sortable';\n\nimport { SortableImgItem } from './components/SortableImageItem';\nimport { Column } from './components/Column';\nimport { DroppableUncategorizedArea } from './components/DroppableUncategorizedArea';\nimport { scrollVerticallyToContainerEnd } from 'utils/domHelpers';\n\nconst getCategories = ansImageCategories => {\n const resCats = [];\n ansImageCategories.forEach((imgCat, idx) => {\n if (!resCats.some(cat => cat.name === imgCat.category)) {\n resCats.push({ name: imgCat.category, id: idx + 1, items: [] });\n }\n });\n return resCats;\n};\n\nexport const ImageTypeQuestion = props => {\n const { handleSelectStep, question, setAnswer, currentStep } = props;\n\n const [imageColumns, setImageColumns] = useState(\n question.imageAnswers.map((col, idx) => ({\n ...col,\n items: [],\n id: idx + 1,\n name: col.columnName,\n })),\n );\n const [unCategorizedImages, setUnCategorizedImages] = useState(\n question.imageAnswers\n .map(iA => [...iA.rightAnswers.map(a => ({ ...a, id: a.questionAnswerId }))])\n .flat(),\n );\n const [hasStepsContainerScroll, setHasStepsContainerScroll] = useState(false);\n const [isDroppedFromColumn, setIsDroppedFromColumn] = useState(false);\n const [isScrolled, setIsScrolled] = useState(false);\n const [isAtEnd, setIsAtEnd] = useState(false);\n const [activeItemId, setActiveItemId] = useState(null);\n const [overItemId, setOverItemId] = useState(null);\n const [selectedItemIdFromColumn, setSelectedItemIdFromColumn] = useState(null);\n const [selectedImg, setSelectedImg] = useState('');\n\n const allColumnItems = imageColumns.map(c => c.items).flat();\n const unCategorizedRowId = 'uncategorized_row';\n let animationFrameId = null;\n\n const sensors = useSensors(\n useSensor(PointerSensor, {\n activationConstraint: {\n delay: 100,\n tolerance: 5,\n },\n }),\n useSensor(KeyboardSensor, {\n coordinateGetter: sortableKeyboardCoordinates,\n }),\n );\n\n // Helper to get over column index\n const getOverColumnIndex = overId =>\n imageColumns.findIndex(\n column => column.id === overId || column.items.some(item => item.id === overId),\n );\n\n // Helper function to handle drag from a column to unCategorizedImages\n const handleFromColumnToUncategorized = (active, over) => {\n // Find the item in the column\n const columnIndex = imageColumns.findIndex(column =>\n column.items.some(item => item.id === active.id),\n );\n const itemIndex = imageColumns[columnIndex].items.findIndex(item => item.id === active.id);\n const item = imageColumns[columnIndex].items[itemIndex];\n\n // Remove from the column\n imageColumns[columnIndex].items.splice(itemIndex, 1);\n\n // Find the index in unCategorizedImages where the item will be inserted\n const indexToInsertAt = unCategorizedImages.findIndex(item => item.id === over.id);\n\n // Insert into unCategorizedImages\n const updatedUnCategorizedImages = [...unCategorizedImages];\n updatedUnCategorizedImages.splice(indexToInsertAt, 0, item);\n\n // Update state\n // setQuizConfigObj(updatedUnCategorizedImages); // Update this function to set unCategorizedImages\n setAnswer(imageColumns);\n setImageColumns(imageColumns);\n setUnCategorizedImages(updatedUnCategorizedImages);\n };\n\n // Helper function to handle drag from unCategorizedImages to a column\n const handleFromUncategorizedToColumn = (active, over) => {\n // Find the item and remove it from unCategorizedImages\n const item = unCategorizedImages.find(image => image.id === active.id);\n const overColumnIndex = getOverColumnIndex(over.id);\n\n // Add to the new column\n const updatedColumnItems = [...imageColumns[overColumnIndex].items, item];\n const updatedColumns = [...imageColumns];\n updatedColumns[overColumnIndex].items = updatedColumnItems;\n\n // Update state\n const updatedUnCategorizedImages = [...unCategorizedImages];\n const itemIdx = updatedUnCategorizedImages.findIndex(image => image.id === active.id);\n updatedUnCategorizedImages.splice(itemIdx, 1);\n setAnswer(updatedColumns);\n setImageColumns(updatedColumns);\n setUnCategorizedImages(updatedUnCategorizedImages);\n scrollVerticallyToContainerEnd(`column_body_items_block${imageColumns?.[overColumnIndex]?.id}`);\n };\n\n const handleFromColumnToColumn = (active, over) => {\n const fromColumnIndex = imageColumns.findIndex(column =>\n column.items.some(item => item.id === active.id),\n );\n const itemIndex = imageColumns[fromColumnIndex].items.findIndex(item => item.id === active.id);\n const item = imageColumns[fromColumnIndex].items[itemIndex];\n const overColumnIndex = getOverColumnIndex(over.id);\n\n // Remove from the fromColumn\n imageColumns[fromColumnIndex].items.splice(itemIndex, 1);\n\n // Insert into the new column\n const updatedColumnItems = [...imageColumns[overColumnIndex].items, item];\n const updatedColumns = [...imageColumns];\n updatedColumns[overColumnIndex].items = updatedColumnItems;\n\n // Update state\n setAnswer(imageColumns);\n scrollVerticallyToContainerEnd(`column_body_items_block${imageColumns?.[overColumnIndex]?.id}`);\n };\n\n const handleSortInUncategorizedList = (active, over) => {\n const fromIndex = unCategorizedImages.findIndex(item => item.id === active.id);\n const toIndex = unCategorizedImages.findIndex(item => item.id === over.id);\n\n // Reorder the items\n const updatedUnCategorizedImages = arrayMove(unCategorizedImages, fromIndex, toIndex);\n\n // Update state\n setUnCategorizedImages(updatedUnCategorizedImages);\n };\n\n const handleSortInsideColumn = (active, over) => {\n const fromIndex = imageColumns.findIndex(col => col.id === active.id);\n const toIndex = imageColumns.findIndex(col => col.id === over.id);\n const updatedColumns = arrayMove(imageColumns, fromIndex, toIndex);\n\n setAnswer(updatedColumns);\n };\n\n const handleDragEnd = event => {\n const { active, over } = event;\n\n // Reset these regardless of whether or not `over` is null.\n setActiveItemId(null);\n setOverItemId(null);\n\n // If drop is outside any container, return\n if (!over) {\n return;\n }\n\n // Check if dragged from unCategorizedImages\n const isFromUnCategorized = unCategorizedImages.some(item => item.id === active.id);\n // Check is dragged from a column\n const isFromAColumn = allColumnItems.some(item => item.id === active.id);\n // Check if dropped on unCategorizedImages\n const isOverUnCategorized = unCategorizedImages.some(item => item.id === over.id);\n const isOveredEmptyUnCategorizedRow = over.id === unCategorizedRowId;\n // Check if dropped on a column\n const overColumnIndex = imageColumns.findIndex(\n column => column.id === over.id || column.items.some(item => item.id === over.id),\n );\n const isOverColumn = overColumnIndex !== -1;\n // Dropped on the uncategorized list from a column\n if (isFromAColumn && isOverUnCategorized) {\n handleFromColumnToUncategorized(active, over);\n }\n\n if (isFromUnCategorized && isOverColumn) {\n handleFromUncategorizedToColumn(active, over);\n if (selectedItemIdFromColumn === active.id) {\n setSelectedItemIdFromColumn(null);\n }\n }\n if (isFromAColumn && isOverColumn) {\n handleFromColumnToColumn(active, over);\n }\n\n if (isFromUnCategorized && isOverUnCategorized) {\n handleSortInUncategorizedList(active, over);\n }\n if (\n imageColumns.some(col => col.id === active.id) &&\n imageColumns.some(col => col.id === over.id)\n ) {\n handleSortInsideColumn(active, over);\n }\n if (isFromAColumn && isOveredEmptyUnCategorizedRow) {\n handleFromColumnToUncategorized(active, over);\n }\n };\n\n const handleDragStart = event => {\n const { active, over } = event;\n const isFromAColumn = allColumnItems.some(item => item.id === active.id);\n setIsDroppedFromColumn(isFromAColumn);\n setActiveItemId(active.id);\n };\n\n const handleDragOver = ({ over }) => {\n setOverItemId(over?.id ? over.id : null);\n };\n\n const handleDragCancel = () => {\n setActiveItemId(null);\n };\n\n const handleScroll = e => {\n if (animationFrameId) {\n cancelAnimationFrame(animationFrameId);\n }\n\n const element = e.target;\n animationFrameId = requestAnimationFrame(() => {\n setIsScrolled(element.scrollLeft > 0);\n\n const totalScrollWidth = element.scrollWidth - element.clientWidth;\n setIsAtEnd(element.scrollLeft >= totalScrollWidth);\n });\n };\n\n const handleSelectItem = id => {\n const allImageAnswerOptions = question.imageAnswers.map(a => [...a.rightAnswers]).flat();\n const currentItem = allImageAnswerOptions.find(item => item.questionAnswerId === id);\n if (currentItem) setSelectedImg(currentItem);\n };\n\n const handleSelectItemFromColumn = id => {\n const allImageAnswerOptions = question.imageAnswers.map(a => [...a.rightAnswers]).flat();\n const currentItem = allImageAnswerOptions.find(item => item.questionAnswerId === id);\n setSelectedItemIdFromColumn(id === selectedItemIdFromColumn ? null : id);\n if (currentItem) setSelectedImg(currentItem);\n };\n\n useEffect(() => {\n const stepsContainer = document.getElementById('img_cat_edit_columns');\n if (stepsContainer) {\n setHasStepsContainerScroll(stepsContainer?.scrollWidth > stepsContainer?.clientWidth);\n }\n }, [unCategorizedImages]);\n\n useEffect(() => {\n return () => {\n if (animationFrameId) {\n cancelAnimationFrame(animationFrameId);\n }\n };\n }, []);\n\n return (\n <>\n \n handleRadioChange(idx, answer.questionAnswerId)}\n />\n \n
\n );\n })}\n \n \n Sort the items by dragging them to the appropriate boxes.{' '}\n \n {selectedImg.description}\n
\n \n \n \n col.id)} strategy={rectSortingStrategy}>\n \n id === activeItemId) && overItemId\n }\n id={column.id}\n key={columnIndex}\n className={`${imageColumns.length < 3 && 'wide'}`}\n >\n item.id)}\n strategy={rectSortingStrategy}\n >\n \n \n {column.items.map((item, index) => (\n
\n \n \n );\n })}\n \n \n \n {hasStepsContainerScroll && isScrolled && }\n {hasStepsContainerScroll && !isAtEnd && }\n
\n {imageColumns.map((column, columnIndex) => {\n return (\n \n \n \n {unCategorizedImages.map((item, index) => {\n return (\n \n \n
\n \n {!imageColumns.some(({ id }) => id === activeItemId) && (\n \n
,\n document.getElementById('root'),\n );\n};\n","import React from 'react';\nimport Button from 'shared/components/Button';\nimport { ANSWER_STATUSES } from '../constants';\nimport { bindDurationShowFull } from 'utils/appHelpers';\n\nexport const QuizSuccess = ({\n handleShowAnswers,\n handleClose,\n quizCompeteDetails,\n gotQuizCompletionOnMount,\n}) => {\n const answeredSteps = quizCompeteDetails?.userQuiz?.quiz?.steps.filter(s => s.question);\n const correctAnswersCount =\n answeredSteps &&\n answeredSteps.filter(s => s.question.userAnswerStatus === ANSWER_STATUSES.Success).length;\n const inCorrectAnswersCount =\n answeredSteps &&\n answeredSteps.filter(s => s.question.userAnswerStatus === ANSWER_STATUSES.Failure).length;\n const totalAnswersCount = quizCompeteDetails?.userQuiz?.quiz?.steps?.length;\n const passedPercent = ((correctAnswersCount / totalAnswersCount) * 100).toFixed(0);\n return (\n e.stopPropagation()}>\n
\n \n \n \n
\n \n It is a long established fact that a reader will be distracted by the readable content\n of a page when looking at its layout. The point of using Lorem Ipsum is that it has a\n more-or-less normal distribution of letters\n
\n\n
\n \n
\n Before closing the quiz
\n\n You need to terminate quiz before you leave. This will be considered as failed\n attempt.\n
\n\n
\n Overview
\n\n It is a long established fact that a reader will be disastracted by the\n
\n\n
\n \n
\n \n \n
\n \n
\n {lesson.steps.length}\n \n
\n \n
\n \n {currentAttempt || 1}/{lesson.attempts}\n \n \n
\n \n
\n {lesson.passingThreshold}%\n \n
\n \n
\n \n
\n \n {lesson.timeLimit ? `~${(passedDuration / 60).toFixed(1)} min` : 'No limit'}\n \n \n
\n \n
\n \n {lesson.timeLimit\n ? `${bindDuration(passedDuration)}/${lesson.timeLimit} min`\n : 'No Limit'}\n \n \n
\n \n
\n {lesson.terminateOnLeave ? 'Yes' : 'No'}\n \n \n {\n onTerminate();\n onClose();\n }}\n >\n Terminate\n \n
\n \n
\n );\n};\n","import React from 'react';\nimport Button from 'shared/components/Button';\nimport { ANSWER_STATUSES } from '../constants';\nimport { bindDurationShowFull } from 'utils/appHelpers';\n\nexport const QuizFailure = ({\n handleRetakeQuiz,\n handleRetakeCourse,\n quizCompeteDetails,\n totalAttemptsCount,\n showWhatIsWrong,\n handleClickOk,\n handleShowAnswers,\n currentAttempt,\n}) => {\n const answeredSteps = quizCompeteDetails?.userQuiz?.quiz?.steps.filter(s => s.question);\n const correctAnswersCount =\n answeredSteps &&\n answeredSteps.filter(s => s.question.userAnswerStatus === ANSWER_STATUSES.Success).length;\n const inCorrectAnswersCount =\n answeredSteps &&\n answeredSteps.filter(s => s.question.userAnswerStatus === ANSWER_STATUSES.Failure).length;\n const totalAnswersCount = quizCompeteDetails?.userQuiz?.quiz?.steps?.length;\n const passedPercent = ((correctAnswersCount / totalAnswersCount) * 100).toFixed(0);\n return (\n \n
\n \n
\n {`Your Result: ${correctAnswersCount}/${totalAnswersCount} points (${passedPercent}%)`}
\n\n
\n \n
\n \n Status: Passed\n
\n \n Time:{' '}\n \n {quizCompeteDetails.userQuiz.duration\n ? `${bindDurationShowFull(quizCompeteDetails.userQuiz.duration)} min`\n : 'No Limit'}\n \n
\n \n Correct answers: {correctAnswersCount}\n
\n \n Incorrect answers: {inCorrectAnswersCount}\n
\n \n
\n \n {gotQuizCompletionOnMount ? 'Quiz Passed' : 'Congratulations!'}\n
\nyou’ve successfully passed the quiz
\n\n \n \n
\n \n
\n );\n};\n","/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React, { useState } from 'react';\n\nconst QuizViewImageColumn = ({ column, columnsCount, handleSelectImg, selectedImg }) => {\n const { columnName, rightAnswers, userAnswers } = column;\n const incorrectUserAnswers = userAnswers.filter(\n ({ imageId }) => !rightAnswers.some(rA => rA.imageId === imageId),\n );\n return (\n \n
\n \n
\n {`Your Result: ${correctAnswersCount}/${totalAnswersCount} points (${passedPercent}%)`}
\n\n
\n {!!showWhatIsWrong && (\n \n )}\n \n
\n \n Status: Not Passed\n
\n \n Time:{' '}\n \n {quizCompeteDetails.userQuiz.duration\n ? `${bindDurationShowFull(quizCompeteDetails.userQuiz.duration)} min`\n : 'No Limit'}\n \n
\n \n Correct answers: {correctAnswersCount}\n
\n \n Incorrect answers: {inCorrectAnswersCount}\n
\n \n Attempt number:{' '}\n \n {currentAttempt}/{totalAttemptsCount}\n \n
\n \n
\n Oops...
\nyou’re almost there... Try it again!
\n\n {quizCompeteDetails.attempts === totalAttemptsCount ? (\n \n ) : (\n \n )}\n \n
\n \n
\n \n \n );\n};\n\nexport const ImageTypeView = ({ question }) => {\n const [selectedImg, setSelectedImg] = useState(null);\n const handleSelectImg = imgItem => {\n setSelectedImg(imgItem.imageId === selectedImg?.imageId ? null : imgItem);\n };\n return (\n <>\n {columnName}
\n \n handleSelectImg(imgItem)}\n key={idx}\n className={`img_item ${selectedImg?.imageId === imgItem.imageId && 'selected'}`}\n >\n {isAnsweredByUser && }\n 
\n
\n );\n })}\n \n {rightAnswers?.length &&\n rightAnswers.map((imgItem, idx) => {\n const isAnsweredByUser = userAnswers.some(\n ({ imageId }) => imageId === imgItem.imageId,\n );\n return (\n handleSelectImg(imgItem)}\n key={idx}\n className={`img_item ${selectedImg?.imageId === imgItem.imageId && 'selected'}`}\n >\n {isAnsweredByUser && }\n \n
\n );\n })}\n {!!incorrectUserAnswers?.length &&\n incorrectUserAnswers.map((imgItem, idx) => {\n const isAnsweredByUser = userAnswers.some(\n ({ imageId }) => imageId === imgItem.imageId,\n );\n return (\n \n \n Sort the items by dragging them to the appropriate boxes.{' '}\n \n {selectedImg && selectedImg.description}\n
\n \n {question.imageAnswers &&\n question.imageAnswers.map((column, colIdx) => {\n return (\n
\n \n );\n};\n","import React, { useState } from 'react';\nimport { RadioTypeView } from './components/RadioTypeView';\nimport { MultiTypeView } from './components/MultiTypeView';\nimport { BooleanTypeView } from './components/BooleanTypeView';\nimport { ImageTypeView } from './components/ImageTypeView';\nimport Button from 'shared/components/Button';\nimport { ANSWER_STATUSES } from '../../constants';\n\nconst QuestionViewComponent = {\n radio: RadioTypeView,\n multi: MultiTypeView,\n yesno: BooleanTypeView,\n ['image-category']: ImageTypeView,\n};\n\nconst QuizResults = ({ results = [], totalLength }) => {\n const [currentStep, setCurrentStep] = useState(0);\n\n const nextStep = () => {\n if (currentStep < results.length - 1) {\n setCurrentStep(prev => prev + 1);\n }\n };\n\n const prevStep = () => {\n if (currentStep > 0) {\n setCurrentStep(prev => prev - 1);\n }\n };\n\n const currentResult = results[currentStep];\n const isSucceed = currentResult.status === ANSWER_STATUSES.Success;\n const isFailed = currentResult.status === ANSWER_STATUSES.Failure;\n const isExpired = currentResult.status === ANSWER_STATUSES.Expired;\n const isNotAnswered = currentResult.status === ANSWER_STATUSES.NoAnswer;\n const QuestionComponent = QuestionViewComponent[currentResult.type];\n\n return (\n \n
\n );\n};\n\nexport default QuizResults;\n","import React from 'react';\nimport { ENGLISH_UPPERCASE_LETTERS } from '../../../constants';\nimport { QuestionMultiCheckIcon } from 'shared/components/Icons';\n\nexport const RadioTypeView = ({ question }) => {\n return (\n \n
\n \n {currentStep + 1}\n \n {currentStep + 1}\n \n /{totalLength}\n \n
\n {currentResult?.title}
\n \n\n {isExpired &&
\n TIME
}\n \n \n Back\n \n \n Next\n \n
\n \n
\n );\n};\n","import React from 'react';\nimport { QuestionMultiCheckIcon } from 'shared/components/Icons';\nimport { ENGLISH_UPPERCASE_LETTERS } from '../../../constants';\n\nexport const MultiTypeView = ({ question }) => {\n return (\n \n Answer Type:\n Text Single Select\n
\n \n {question.answersMulti.map((answer, idx) => {\n const isSelectedByUser = answer.isUserAnswer;\n const isRightAnswer = answer.isRightAnswer;\n return (\n
\n \n \n
\n );\n })}\n \n
\n );\n};\n","import React from 'react';\nimport { QuestionMultiCheckIcon } from 'shared/components/Icons';\nimport { ENGLISH_UPPERCASE_LETTERS } from '../../../constants';\n\nexport const BooleanTypeView = ({ question }) => {\n return (\n \n Answer Type:\n Text Multiple Select\n
\n \n {question.answersMulti.map((answer, idx) => {\n const isSelectedByUser = answer.isUserAnswer;\n const isRightAnswer = answer.isRightAnswer;\n return (\n
\n \n \n
\n );\n })}\n \n
\n );\n};\n","import React from 'react';\nimport ReactDOM from 'react-dom';\n\nconst OfflineModal = ({ isOpen, countdown }) => {\n if (!isOpen) return null;\n\n return ReactDOM.createPortal(\n \n Answer Type:\n Boolean Type Select\n
\n \n {question.answersMulti.map((answer, idx) => {\n const isSelectedByUser = answer.isUserAnswer;\n const isRightAnswer = answer.isRightAnswer;\n return (\n
\n \n \n
\n );\n })}\n \n
,\n document.getElementById('modal-root'),\n );\n};\n\nexport default OfflineModal;\n","import React, { useEffect, useRef, useState } from 'react';\nimport { connect } from 'react-redux';\n\nimport { getCourses } from 'app/Main/routes/Courses/actions';\nimport { QuizStart } from './components/QuizStart';\nimport { QuizFlow } from './components/QuizFlow';\nimport { QuizStartModal } from './components/QuizStartModal';\nimport { QuestionContainer } from './components/QuestionContainer';\nimport { QuizTerminateModal } from './components/QuizTerminateModal';\nimport { QuizSuccess } from './components/QuizSuccess';\nimport { QuizFailure } from './components/QuizFailure';\nimport { QUESTION_TYPES_OBJ, QUIZ_STATUSES } from './constants';\nimport QuizResults from './components/QuizResults';\nimport OfflineModal from './components/OfflineModal';\nimport { Api } from 'utils/connectors';\nimport { useSnackbar } from 'notistack';\nimport { getError, getEventUrl } from 'utils/appHelpers';\nimport { hasAccess } from 'utils/permissionHelper';\nimport { LESSON_STATUSES } from 'configs/constants';\nimport Loading from 'shared/components/Loading';\n\nconst TypeQuiz = ({ history, lesson, course, currentLessons, setLesson, lessonId, getCourses }) => {\n const { enqueueSnackbar } = useSnackbar();\n const [isModalOpen, setIsModalOpen] = useState(false);\n const [isOpenTerminateModal, setIsOpenTerminateModal] = useState(false);\n const [answer, setAnswer] = useState(null);\n const [isOfflineModalOpen, setIsOfflineModalOpen] = useState(false);\n const [offlineCountdown, setOfflineCountdown] = useState(60);\n const [quiz, setQuiz] = useState(null);\n const [quizStartTime, setQuizStartTime] = useState(null);\n const [currentQuizQuestion, setCurrentQuizQuestion] = useState(null);\n const [isQuizInProgress, setIsQuizInProgress] = useState(false);\n const [isQuizCompleted, setIsQuizCompleted] = useState(false);\n const [currentStep, setCurrentStep] = useState(1);\n const [passedQuestions, setPassedQuestions] = useState(null);\n const [currentAttempt, setCurrentAttempt] = useState(1);\n const [lastQuizDetails, setLastQuizDetails] = useState({});\n const [quizCompeteDetails, setQuizCompleteDetails] = useState(null);\n const [passingThresholdStep, setPassingThresholdStep] = useState(null);\n const [isShowResults, setIsShowResults] = useState(false);\n const [quizUsageSeconds, setQuizUsageSeconds] = useState(0);\n const [isFetching, setIsFetching] = useState(false);\n const [gotQuizCompletionOnMount, setIsGotQuizCompletionOnMount] = useState(false);\n\n const isLessonCompleted = lesson?.status === LESSON_STATUSES.completed;\n\n const offlineTimerRef = useRef(null);\n\n const path = hasAccess('event_user') ? getEventUrl() : '';\n\n const answerResults =\n quizCompeteDetails?.userQuiz?.quiz?.steps &&\n quizCompeteDetails.userQuiz.quiz.steps\n .filter(s => s.question)\n .map(step => ({\n ...step.question,\n status: step?.question?.userAnswerStatus,\n }));\n\n const handleOpenStartModal = () => {\n setIsModalOpen(true);\n };\n\n const handleOpenTerminateModal = () => {\n setIsOpenTerminateModal(true);\n };\n\n const handleOffline = () => {\n setIsOfflineModalOpen(true);\n offlineTimerRef.current = setInterval(() => {\n setOfflineCountdown(prev => {\n if (prev === 1) {\n clearInterval(offlineTimerRef.current);\n history.goBack();\n return 0;\n }\n return prev - 1;\n });\n }, 1000);\n };\n\n const handleOnline = () => {\n setIsOfflineModalOpen(false);\n clearInterval(offlineTimerRef.current);\n setOfflineCountdown(60);\n handleStartQuiz();\n };\n\n const handleShowResults = () => {\n setIsShowResults(true);\n };\n\n const getQuizDetails = async isOnMount => {\n try {\n setIsFetching(true);\n const { data } = await Api.get(`/courses/${course.id}/user-quizes`);\n setLastQuizDetails(\n data?.data?.userQuiz?.status === QUIZ_STATUSES.InProgress ? data.data?.userQuiz : {},\n );\n setCurrentAttempt(data?.data?.totalAttempts || currentAttempt);\n if (data?.data?.userQuiz?.status === QUIZ_STATUSES.Success) {\n setQuizCompleteDetails(data.data);\n setQuiz(data.data?.userQuiz?.quiz);\n setPassedQuestions(data.data.userQuiz.quiz.steps.filter(step => !!step.question));\n setIsQuizCompleted(true);\n if (isOnMount) {\n setIsGotQuizCompletionOnMount(true);\n }\n if (data?.data?.totalAttempts === data?.data?.userQuiz?.attempts || !isOnMount) {\n await getCourses();\n }\n }\n setIsFetching(false);\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n const handleStartQuiz = async () => {\n try {\n const { data } = await Api.post(`/courses/${course.id}/quiz/start`);\n const currStep = data.data.userQuiz.currentStep;\n const currentQuestion = {\n ...data.data.userQuiz.quiz.steps.find(({ step }) => step === currStep)?.question,\n timeLimit: data.data.userQuiz.quiz.steps.find(({ step }) => step === currStep)?.timeLimit,\n };\n setQuiz(data.data.userQuiz.quiz);\n setPassedQuestions(data.data.userQuiz.quiz.steps.filter(step => !!step.question));\n setCurrentQuizQuestion(currentQuestion);\n setQuizStartTime(data.data.userQuiz.startedAt);\n setQuizUsageSeconds(data?.data?.userQuiz?.duration);\n setPassingThresholdStep(data.data.userQuiz.passingThresholdStep);\n setCurrentStep(currStep);\n if (data.data.userQuiz.status === QUIZ_STATUSES.Success) {\n setIsQuizInProgress(false);\n setIsQuizCompleted(true);\n setQuizCompleteDetails(data.data);\n setCurrentStep(data.data.userQuiz.quiz.steps.length + 1);\n await getCourses();\n } else {\n setIsQuizCompleted(false);\n setIsQuizInProgress(true);\n setQuizCompleteDetails({});\n }\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n const handleSkipStep = async () => {\n try {\n const res = await Api.post(`/courses/${course.id}/quiz/no-answer`, {\n questionId: currentQuizQuestion.id,\n });\n const { data } = res;\n const currStep = data.data.userQuiz.currentStep;\n const currentQuestion = {\n ...data.data.userQuiz.quiz.steps.find(({ step }) => step === currStep)?.question,\n timeLimit: data.data.userQuiz.quiz.steps.find(({ step }) => step === currStep)?.timeLimit,\n };\n setQuiz(data.data.userQuiz.quiz);\n setPassedQuestions(data.data.userQuiz.quiz.steps.filter(step => !!step.question));\n setCurrentQuizQuestion(currentQuestion);\n setCurrentStep(currStep);\n if (res?.status === 200) {\n setQuizCompleteDetails(res.data.data);\n setIsQuizCompleted(true);\n setIsQuizInProgress(false);\n setQuizStartTime(null);\n setCurrentQuizQuestion(null);\n setCurrentStep(1);\n getQuizDetails();\n }\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n const quizUsage = async ({ passedSeconds, passedSecondsOnQuestion }) => {\n try {\n const { data } = await Api.post(`/courses/${course.id}/quiz/usage`, {\n usage: passedSeconds,\n answerUsage: { questionId: currentQuizQuestion.id, usage: passedSecondsOnQuestion },\n });\n setQuizUsageSeconds(data?.data?.usage);\n } catch (err) {\n const { data } = err.response.data;\n const currStep = data?.userQuiz?.currentStep;\n const currentQuestion = {\n ...data?.userQuiz?.quiz?.steps?.find(({ step }) => step === currStep)?.question,\n timeLimit: data?.userQuiz?.quiz?.steps.find(({ step }) => step === currStep)?.timeLimit,\n };\n if (data?.userQuiz?.status === QUIZ_STATUSES.Expired) {\n setIsQuizCompleted(true);\n setIsQuizInProgress(false);\n }\n setPassingThresholdStep(data?.userQuiz?.passingThresholdStep);\n setQuiz(data?.userQuiz?.quiz);\n setQuizCompleteDetails(data);\n setPassedQuestions(data?.userQuiz?.quiz?.steps.filter(step => !!step.question));\n setCurrentQuizQuestion(currentQuestion);\n setCurrentStep(currStep);\n getQuizDetails();\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n const handleSubmitAnswer = async (answer, questionType) => {\n if (!answer.length) {\n handleSkipStep();\n return;\n }\n try {\n const body = {\n questionId: currentQuizQuestion.id,\n imageAnswer: questionType === QUESTION_TYPES_OBJ['image-category'] ? answer : null,\n answer: questionType !== QUESTION_TYPES_OBJ['image-category'] ? answer : null,\n };\n\n const res = await Api.post(`/courses/${course.id}/quiz/answer`, body);\n const { data } = res;\n const currStep = data.data.userQuiz.currentStep;\n const currentQuestion = {\n ...data.data.userQuiz.quiz.steps.find(({ step }) => step === currStep)?.question,\n timeLimit: data.data.userQuiz.quiz.steps.find(({ step }) => step === currStep)?.timeLimit,\n };\n setQuiz(data.data.userQuiz.quiz);\n setPassedQuestions(data.data.userQuiz.quiz.steps.filter(step => !!step.question));\n setPassingThresholdStep(data.data.userQuiz.passingThresholdStep);\n setCurrentQuizQuestion(currentQuestion);\n setCurrentStep(currStep);\n if (res?.status === 200) {\n setQuizCompleteDetails(res.data.data);\n setIsQuizCompleted(true);\n setIsQuizInProgress(false);\n setQuizStartTime(null);\n setCurrentQuizQuestion(null);\n setCurrentStep(1);\n getQuizDetails();\n }\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n const handleTerminateQuiz = async () => {\n try {\n const res = await Api.post(`/courses/${course.id}/quiz/terminate`);\n setQuizStartTime(null);\n setIsQuizInProgress(false);\n setCurrentQuizQuestion(null);\n setIsQuizCompleted(false);\n setPassedQuestions(null);\n setCurrentStep(1);\n enqueueSnackbar(res.data.message, { variant: 'success' });\n getQuizDetails();\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n const handleResetQuiz = () => {\n setQuizStartTime(null);\n setIsQuizInProgress(false);\n setCurrentQuizQuestion(null);\n setIsQuizCompleted(false);\n setPassedQuestions(null);\n setCurrentStep(1);\n setQuiz({});\n };\n\n const handleRetakeCourse = () => {\n const firstLesson = currentLessons[0];\n const lessonPath = `${path}/courses/${course.id}/${firstLesson.type}/${firstLesson.id}`;\n history.push(lessonPath);\n };\n\n const handleClose = () => {\n const lastLesson = currentLessons[currentLessons.length - 1];\n const lessonPath = `${path}/courses/${course.id}/${lastLesson.type}/${lastLesson.id}`;\n history.push(lessonPath);\n };\n\n const handleGoToCourses = () => history.push('/courses');\n\n useEffect(() => {\n if (course) {\n const currLesson = currentLessons.find(lesson => lesson.id === Number(lessonId));\n setLesson(currLesson);\n setCurrentAttempt(currLesson?.attempt);\n if (currLesson) {\n setPassingThresholdStep(\n Math.ceil((currLesson.steps?.length * currLesson.passingThreshold) / 100),\n );\n }\n }\n //eslint-disable-next-line\n }, []);\n\n useEffect(() => {\n getQuizDetails(true);\n return () => {\n setQuizStartTime(null);\n setIsQuizInProgress(false);\n setCurrentQuizQuestion(null);\n setIsQuizCompleted(false);\n setPassedQuestions(null);\n setCurrentStep(1);\n setIsShowResults(false);\n };\n }, []);\n\n useEffect(() => {\n const handleBeforeUnload = e => {\n if (isQuizInProgress) {\n e.preventDefault();\n e.returnValue = 'The quiz will be terminated as you leave! Are you sure you want to leave?';\n return 'The quiz will be terminated as you leave! Are you sure you want to leave?';\n }\n };\n\n if (lesson.terminateOnLeave) {\n window.addEventListener('beforeunload', handleBeforeUnload);\n }\n\n return () => {\n if (lesson.terminateOnLeave) window.removeEventListener('beforeunload', handleBeforeUnload);\n };\n }, [isQuizInProgress]);\n\n useEffect(() => {\n // Only attach listeners if the quiz is in progress and not completed\n if (isQuizInProgress && !isQuizCompleted) {\n window.addEventListener('offline', handleOffline);\n window.addEventListener('online', handleOnline);\n }\n\n return () => {\n window.removeEventListener('offline', handleOffline);\n window.removeEventListener('online', handleOnline);\n clearInterval(offlineTimerRef.current);\n };\n }, [isQuizInProgress, isQuizCompleted]);\n\n useEffect(() => {\n if (isQuizInProgress && lesson.terminateOnLeave) {\n const unblock = history.block((location, action) => {\n // If navigating within the app, show your custom modal\n if (action !== 'PUSH' && action !== 'REPLACE') {\n return; // Allow 'POP' navigation actions (like back button)\n }\n\n handleOpenTerminateModal();\n return false; // Block the navigation\n });\n\n return () => {\n unblock(); // Stop blocking when component unmounts or condition changes\n };\n }\n }, [isQuizInProgress]);\n\n useEffect(() => {\n if (offlineCountdown === 0) {\n handleResetQuiz();\n }\n }, [offlineCountdown]);\n\n return (\n <>\n \n
\n You are offline!
\n\n You'll be redirected as time will end unless you come back online.\n
\n{countdown}
\n \n
\n )}\n {(isLessonCompleted || isQuizCompleted) && (\n <>\n {isFetching && (\n \n
\n )}\n {quizCompeteDetails?.userQuiz?.status === QUIZ_STATUSES.Success &&\n !isShowResults &&\n !isFetching && (\n \n
\n )}\n {(quizCompeteDetails?.userQuiz?.status === QUIZ_STATUSES.Failure ||\n quizCompeteDetails?.userQuiz?.status === QUIZ_STATUSES.Expired) &&\n !isShowResults &&\n !isFetching &&\n !gotQuizCompletionOnMount && (\n \n
\n )}\n \n )}\n {isShowResults && (\n \n
\n )}\n \n
\n \n );\n};\n\nexport default connect(\n null,\n { getCourses },\n)(TypeQuiz);\n","import React from 'react';\nimport BackButton from 'shared/BackButton';\nimport CourseHeaderRightNav from '../CourseView/components/CourseHeaderRightNav';\n\nconst CourseHeader = ({ history, course }) => (\n \n
\n);\nexport default CourseHeader;\n","import React, { useEffect, useState } from 'react';\nconst rates = [0, 1, 2, 3, 4];\n\nconst StarRating = ({ onClick, rate = null, isDisabled }) => {\n const [value, setValue] = useState(rate);\n\n const onRate = v => {\n const result = 5 - v;\n setValue(result);\n onClick(result);\n };\n\n useEffect(() => {\n setValue(rate);\n }, [rate]);\n\n return (\n \n
\n \n
\n );\n};\n\nexport default StarRating;\n","import React, { useEffect, useState } from 'react';\nimport { useSnackbar } from 'notistack';\nimport { getError } from 'utils/appHelpers';\nimport { Api } from 'utils/connectors';\nimport FeedbackHeader from './FeedbackHeader';\nimport ButtonLine from 'shared/components/ButtonLine';\nimport { useDispatch } from 'react-redux';\nimport moment from 'moment';\n\nimport FeedCheckbox from './components/FeedCheckbox';\nimport FeedRating from './components/FeedRating';\nimport FeedSelect from './components/FeedSelect';\nimport FeedText from './components/FeedText';\nimport Loading from 'shared/components/Loading';\nimport { getCourses } from '../Courses/actions';\nimport { useHistory } from 'react-router';\nimport { LESSON_STATUSES } from 'configs/constants';\n\nconst feedItemsComp = {\n rating: FeedRating,\n radio: FeedSelect,\n checkbox: FeedCheckbox,\n text: FeedText,\n};\n\nconst CourseFeedback = ({ match, lesson, course }) => {\n const history = useHistory();\n const dispatch = useDispatch();\n const { courseId } = match.params;\n const { enqueueSnackbar } = useSnackbar();\n const [userFeedBack, setUserFeedBack] = useState();\n const [feedItems, setFeedItems] = useState();\n const [fetch, setFetch] = useState(false);\n const [answers, setAnswers] = useState({});\n const courseCompleted =\n lesson &&\n (lesson.status === LESSON_STATUSES.inProgress || lesson.status === LESSON_STATUSES.completed);\n\n const getUserFeedback = async () => {\n try {\n const { data } = await Api.get(`/feedback/getuserfeedbacks/me/${courseId}`);\n const res = {};\n data.data.forEach(item => {\n res[item.courseFeedbackId] = item.value;\n });\n setAnswers(res);\n setUserFeedBack(data.data);\n } catch (err) {\n setUserFeedBack([]);\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n const getCourseFeedback = async () => {\n try {\n const { data } = await Api.get(`/feedback/getcoursefeedbacks/${courseId}`);\n const res = data.data.map(item => ({ ...item.feedback, id: item.id }));\n setFeedItems(res);\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n const updateLesson = async () => {\n try {\n const body = { lessonId: Number(lesson.id), completed: 1, courseId: course.id };\n await Api.post('/courses/updateuserlesson', body);\n dispatch(getCourses());\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n const handleSubmit = async e => {\n e.preventDefault();\n try {\n setFetch(true);\n const feedbacks = Object.keys(answers).map(item => ({\n courseFeedbackId: item,\n value: answers[item],\n }));\n const body = { feedbacks };\n const { data } = await Api.post('/feedback/set', body);\n updateLesson();\n getUserFeedback();\n enqueueSnackbar(data.message, { variant: 'success' });\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n } finally {\n setFetch(false);\n }\n };\n\n const handleChange = data => {\n const tempAnswers = { ...answers };\n tempAnswers[data.id] = data.value;\n setAnswers(tempAnswers);\n };\n\n useEffect(() => {\n if (courseCompleted) {\n getUserFeedback();\n getCourseFeedback();\n }\n //eslint-disable-next-line\n }, [courseCompleted]);\n\n if ((!feedItems || !userFeedBack) && courseCompleted) return \n {rates.map(v => (\n = 5 - v ? 'active' : ''}`}\n key={v}\n onClick={() => onRate(v)}\n role='presentation'\n >\n ☆\n \n ))}\n
\n \n
\n );\n }\n\n return (\n \n No Evaluation is available for this course\n
\n \n
\n );\n};\n\nexport default CourseFeedback;\n","import React from 'react';\nimport StarRating from 'shared/components/StarRating';\n\nconst FeedRating = ({ data, onChange, answers, isDisabled }) => {\n return (\n \n \n
\n )}\n {!courseCompleted && (\n \n Course evaluation will be available after completion of the course.\n
\n )}\n \n \n
\n \n \n
\n \n {!isAnswered ? (\n
\n \n \n
\n \n {!isAnswered\n ? items.map(item => (\n
\n \n \n {item.name}\n \n
\n ))\n : items.map(item => (\n \n {answers[data.id] && answers[data.id] !== 'false' ? 'Yes' : 'No'}\n
\n ))}\n \n \n
\n {!isAnswered ? (\n \n \n {fetch ? \n \n )}\n {isSent && (\n <>\n
\n );\n};\n\nexport default connect(\n null,\n { getCourses },\n)(ExpiredView);\n","import React from 'react';\n\nconst TagsViewBlock = ({ tags }) => {\n if (!tags || !tags.length) return null;\n return (\n Usage period has expired
\n {!isSent && (\n <>\nYou can request to extend access by one additional period.
\n\n A request will be sent to “{course.name}” subscription administrator\n
\nYour request to extend usage period has been sent.
\n\n You will receive a notification as soon as course administrator changes your access\n period.\n
\n \n )}\n\n
\n );\n};\n\nexport default TagsViewBlock;\n","import React from 'react';\nimport { IconWarning } from './Icons';\n\nconst NoAccessCourse = ({ className }) => {\n return (\n <>\n Tags
\n\n {tags &&\n tags.map(item => {\n const tag = item.tag || item;\n return (\n
\n \n {tag.name}\n
\n );\n })}\n \n \n
\n \n
\n \n You don’t have access to this content. Please, contact the sharing person
directly\n to solve the issue.\n
\n
\n);\nexport default InfoSection;\n","import React from 'react';\nimport { IconPlayFill, IconVideos } from 'shared/components/Icons';\nimport { bindDuration } from 'utils/appHelpers';\nimport { DEFAULT_IMG_URLS } from 'configs/constants';\n\nconst LessonsListSection = ({ lessons, activeLesson, setActiveLesson }) => {\n const lessonClickHandle = (lesson, e) => {\n setActiveLesson(lesson);\n };\n\n return (\n Info:
\n{info}
\n\n {lessons &&\n lessons\n .sort((l1, l2) => l1.lessonOrder - l2.lessonOrder)\n .map((item, i) => {\n const lesson = item.lesson;\n const Icon = IconPlayFill;\n const active =\n (lesson?.id || lesson.title) === (activeLesson?.id || activeLesson?.title);\n const isFeedback = lesson.contentType === 5;\n return (\n \n
\n );\n })}\n \n );\n};\n\nexport default LessonsListSection;\n","import React from 'react';\n\nconst EmptyView = ({ text, Icon }) => {\n return (\n \n
\n {!isFeedback && (\n \n
\n \n 
\n
\n \n
\n {lesson.title}
\n{lesson.info || lesson.description}
\n\n {lesson.episodes && (\n \n {lesson.episodes.length}
\n )}\n {bindDuration(lesson.duration)}
}\n\n
\n );\n};\n\nexport default EmptyView;\n","/* eslint-disable consistent-return */\nimport React, { useRef, useState, useEffect } from 'react';\nimport { Player, BigPlayButton } from 'video-react';\nimport { IconPlayFill, IconLock, IconVideo } from 'shared/components/Icons';\nimport { bindDuration, getEpisodeStartTime } from 'utils/appHelpers';\nimport EmptyView from '../EmptyView';\n\nlet checkTime = 0;\n\nconst TypeVideo = ({ lesson }) => {\n const [activePart, setActivePart] = useState(lesson.episodes?.length && lesson.episodes[0]);\n const player = useRef(null);\n\n const videoSettings = {\n src: lesson.contentUrl,\n fluid: false,\n preload: 'auto',\n height: 465,\n };\n\n const epsiodeTimes = lesson.episodes?.map(item => item.startFrom);\n\n const autoSelectEpisode = ({ currentTime, seeking }) => {\n const videoTime = Math.ceil(currentTime);\n if (\n !videoTime ||\n videoTime === checkTime ||\n seeking ||\n !lesson.episodes ||\n !lesson.episodes.length\n )\n return;\n let activeKey = 0;\n checkTime = videoTime;\n epsiodeTimes?.forEach((item, key) => {\n if (checkTime >= item) activeKey = key;\n });\n setActivePart(lesson.episodes[activeKey]);\n };\n\n const handlePartSelect = episode => {\n player.current.seek(episode.startFrom);\n setActivePart(episode);\n };\n\n useEffect(() => {\n const subs = player.current?.subscribeToStateChange(autoSelectEpisode);\n if (lesson.contentUrl) {\n return function cleanup() {\n player.current.pause();\n subs();\n };\n }\n //eslint-disable-next-line\n }, [lesson]);\n\n const episodes = lesson.episodes ? lesson.episodes.filter(i => i.duration) : [];\n\n return (\n <>\n \n
\n {text}
\n \n {lesson.contentUrl && (\n \n \n )}\n {!lesson.contentUrl && (\n
\n \n
\n \n \n );\n};\n\nexport default TypeVideo;\n","import React, { useState, useRef } from 'react';\nimport EmptyView from '../EmptyView';\nimport { Document, Page, pdfjs } from 'react-pdf';\nimport { IconPdf } from 'shared/components/Icons';\n\nconst pdfVersion = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.js`;\npdfjs.GlobalWorkerOptions.workerSrc = pdfVersion;\n\nconst TypePDF = ({ lesson }) => {\n const [page, setPage] = useState(1);\n const [pages, setPages] = useState([]);\n const pdfContainerRef = useRef();\n const scrollingOffset = useRef();\n const width = window.innerWidth - 230 - 310;\n\n const onDocumentLoadSuccess = document => {\n const { numPages } = document;\n setPages(new Array(numPages).fill(1));\n };\n\n const selectPage = index => {\n setTimeout(() => {\n const elementPDF = document.querySelector('.react-pdf__Document');\n if (elementPDF) elementPDF.scrollTop = 0;\n setPage(index + 1);\n }, 0);\n };\n\n const handlePdfScrolling = () => {\n if (pages.length < 2) return;\n const elementPDF = document.querySelector('.react-pdf__Document');\n if (!elementPDF) return;\n const { scrollHeight, scrollTop, clientHeight } = elementPDF;\n const scrolledTillEnd = scrollTop + clientHeight >= scrollHeight;\n\n setTimeout(() => {\n const nextCondition =\n scrollingOffset.current < scrollTop && scrolledTillEnd && page !== pages.length;\n const prevCondition = scrollingOffset.current > scrollTop && scrollTop === 0 && page !== 1;\n if (nextCondition) {\n elementPDF.scrollTop = 1;\n setPage(page + 1);\n } else if (prevCondition) {\n elementPDF.scrollTop = scrollHeight - clientHeight - 1;\n setPage(page - 1);\n }\n scrollingOffset.current = scrollTop;\n }, 0);\n };\n\n return (\n <>\n {lesson.title} - Chapters
\n\n {episodes &&\n episodes.map((item, index) => {\n const active = true;\n const Icon = active ? IconPlayFill : IconLock;\n const selected = activePart && activePart.title === item.title ? 'active' : '';\n const disabled = !active ? 'disabled' : '';\n const startTime = getEpisodeStartTime(episodes, index, true);\n return (\n handlePartSelect(item)}\n role='button'\n tabIndex='-1'\n key={item.title + index}\n className={`part-item d-flex align-items-center px-3 ${disabled} ${selected}`}\n >\n
\n );\n })}\n \n
\n \n
\n {item.title}
\n{bindDuration(startTime)}
\n\n {lesson.contentUrl && (\n
\n \n \n
\n )}\n {!lesson.contentUrl && (\n \n
\n )}\n \n
\n \n \n );\n};\n\nexport default TypePDF;\n","import React from 'react';\nimport placeholder from 'assets/case_placeholder.jpg';\nimport { IconDicom, IconPlayFill } from 'shared/components/Icons';\nimport EmptyView from '../EmptyView';\n\nconst TypeCases = ({ lesson, onCasePlayClick }) => {\n const cases = lesson.episodes;\n return (\n {lesson.title} - Chapters
\n\n {pages.map((item, index) => (\n selectPage(index)}\n role='button'\n tabIndex='-1'\n key={index}\n className={`part-item d-flex align-items-center px-3 ${\n index + 1 === page ? 'active' : ''\n }`}\n >\n
\n ))}\n \n
\n Page N{index + 1}
\n\n {lesson.activeCases?.length === 0 && (\n
\n );\n};\n\nexport default TypeCases;\n","import React from 'react';\nimport EmptyView from '../EmptyView';\nimport { IconImage } from 'shared/components/Icons';\n\nconst TypeImage = ({ lesson }) => {\n const hasContentImage = lesson.contentUrl || lesson.url;\n return (\n <>\n {hasContentImage && (\n \n 
\n
\n )}\n {!hasContentImage && (\n \n
\n )}\n \n );\n};\n\nexport default TypeImage;\n","import React, { useEffect, useState } from 'react';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { useParams } from 'react-router-dom';\nimport { useSnackbar } from 'notistack';\nimport moment from 'moment';\nimport ButtonLine from 'shared/components/ButtonLine';\nimport { IconNotification } from 'shared/components/Icons';\nimport FeedCheckbox from './components/FeedCheckbox';\nimport FeedRating from './components/FeedRating';\nimport FeedSelect from './components/FeedSelect';\nimport FeedText from './components/FeedText';\nimport { getError } from 'utils/appHelpers';\nimport { Api } from 'utils/connectors';\nimport { getCourses } from 'app/Main/routes/Courses/actions';\n\nconst feedItemsComp = {\n rating: FeedRating,\n radio: FeedSelect,\n checkbox: FeedCheckbox,\n text: FeedText,\n};\n\nconst TypeEvaluation = ({ course }) => {\n const { enqueueSnackbar } = useSnackbar();\n const user = useSelector(state => state.account);\n const [answers, setAnswers] = useState({});\n const [fetch, setFetch] = useState(false);\n const [userFeedBack, setUserFeedBack] = useState([]);\n const [lesson, setLesson] = useState();\n\n const dispatch = useDispatch();\n const params = useParams();\n const courseId = params?.id;\n const lessonId = params?.lessonId;\n const isCourseIdShareToken = isNaN(courseId);\n\n const hasFeedback = !!course.courseFeedbacks?.length;\n const isAnswered = userFeedBack && userFeedBack.length;\n\n const handleChange = data => {\n const tempAnswers = { ...answers };\n tempAnswers[data.feedbackItemId] = data.value;\n setAnswers(tempAnswers);\n };\n\n const getUserFeedback = async () => {\n try {\n const { data } = await Api.get(\n `/feedback/getuserfeedbacks/me/${\n isCourseIdShareToken ? course?.id : courseId || course?.id\n }`,\n );\n const res = {};\n data.data.forEach(item => {\n res[item.courseFeedbackId] = item.value;\n });\n setAnswers(res);\n setUserFeedBack(data.data);\n } catch (err) {\n setUserFeedBack([]);\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n const onFormSubmit = async e => {\n e.preventDefault();\n try {\n setFetch(true);\n const feedbacks = Object.keys(answers).map(item => ({\n courseFeedbackId: item,\n value: answers[item],\n }));\n const body = { feedbacks };\n const { data } = await Api.post('/feedback/set', body);\n dispatch(getCourses());\n getUserFeedback();\n enqueueSnackbar(data.message, { variant: 'success' });\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n } finally {\n setFetch(false);\n }\n };\n\n useEffect(() => {\n getUserFeedback();\n }, [user]);\n\n useEffect(() => {\n if (course) setLesson(course?.lessons?.find(lesson => lesson.id === Number(lessonId)));\n //eslint-disable-next-line\n }, [params]);\n\n return (\n \n {hasFeedback && (\n
\n );\n};\n\nexport default TypeEvaluation;\n","import React from 'react';\nimport StarRating from 'shared/components/StarRating';\n\nconst FeedRating = ({ index, data, onChange, answers, isDisabled }) => {\n return (\n \n \n {!!isAnswered && (\n \n \n )}\n
\n )}\n {!hasFeedback && (\n \n \n
\n \n {userFeedBack[0] ? moment(userFeedBack[0].createdAt).format('MM/DD/YYYY') : '-'}\n
\n \n
\n )}\n \n Feedback form is not configured yet.
Please, add content to see the preview.\n
\n \n
\n \n \n
\n \n {!isAnswered ? (\n
\n \n \n
\n \n {!isAnswered\n ? items &&\n items.map(item => (\n
\n \n
\n ))\n : items &&\n items.map(item => {\n return (\n \n {answers[index] && answers[index] !== 'false' ? 'Yes' : 'No'}\n
\n );\n })}\n \n \n
\n {!isAnswered ? (\n \n
\n );\n};\n\nexport default TagsViewBlock;\n","import { LESSON_STATUSES } from 'configs/constants';\n\nexport const zoomImageMouseClick = (cornerstone, element, bool, scale, e) => {\n const step = 0.05;\n const viewport = cornerstone.getViewport(element);\n viewport.scale -= bool ? -step : step;\n if (scale) viewport.scale = scale;\n cornerstone.setViewport(element, viewport);\n return false;\n};\n\nexport const getDefaultImageScale = (element, image) => {\n const { clientWidth, clientHeight } = element;\n const { width, height } = image;\n if (width > height) return width > clientWidth ? clientWidth / width : clientHeight / height;\n else return clientHeight / height;\n};\n\nexport const maximazeElement = (cornerstone, element, toggle) => {\n element.classList[toggle ? 'toggle' : 'add']('maximize');\n cornerstone.fitToWindow(element);\n cornerstone.resize(element);\n};\n\nconst getCompletedSteps = (episodes, id) => {\n let body = episodes.filter(item => item.caseId === id);\n body = body.sort((a, b) => a.orderNum - b.orderNum);\n const result = [];\n body.forEach((item, index) => {\n if (item.status === LESSON_STATUSES.inProgress || item.status === LESSON_STATUSES.completed)\n result.push(index);\n });\n return result;\n};\n\nconst setFindings = (data, userLessonId) => {\n try {\n if (data && data.length) {\n data = data.map(f => {\n f.vectorData = JSON.parse(f.vectorData);\n f.vectorData = f.vectorData.map(i => ({ ...i, x: i.pointX, y: i.pointY }));\n return f;\n });\n return data.filter(item => userLessonId === item.userLessonId)[0];\n } else return null;\n } catch (err) {\n return null;\n }\n};\n\nconst checkDicomNameOnViews = (name, newTpe, views) => {\n if (!views[name]) return name;\n const { dicomImageType: currentType } = views[name];\n if (currentType === 'i2d') return false;\n if (currentType === 'g2d' && newTpe === 'r2d') return false;\n return name;\n};\n\nconst getDicomDataName = dicomItem => {\n const { imageLaterality, viewPosition, dicomImageType } = dicomItem;\n const types = { '3dq': '_3DQ', i2d: '_2D', g2d: '_2D', r2d: '_2D', tomo: '_TOMO', sub: '_TOMO' };\n const type = types[dicomImageType];\n return `${imageLaterality}${viewPosition}${type}`;\n};\n\nexport const generateViewerData = (data, lesson) => {\n const result = [];\n const views = {};\n data.caseDicomItems.forEach(({ dicomItem }, index) => {\n const tempName = getDicomDataName(dicomItem);\n const name = checkDicomNameOnViews(tempName, dicomItem.dicomImageType, views);\n if (!name) return;\n views[name] = {\n name,\n position: name[0] === 'R' ? 'right' : 'left',\n protocolName: dicomItem.protocolName,\n imageLaterality: dicomItem.imageLaterality,\n viewPosition: dicomItem.viewPosition,\n dicomImageType: dicomItem.dicomImageType,\n id: dicomItem.id,\n patient: {\n name: dicomItem.patientName,\n age: dicomItem.patientAge,\n sex: dicomItem.patientSex,\n id: dicomItem.patientId,\n birthDate: dicomItem.patientBirthDate,\n },\n images: dicomItem.dicomItemImages.map(img => {\n const emptyFinding = {\n caseId: data.id,\n dicomId: dicomItem.id,\n imageId: img.id,\n userLessonId: lesson.userLessonId,\n };\n return {\n id: img.id,\n url: img.lutUrl || img.url,\n finding: setFindings(img.vectorDatas, lesson.userLessonId),\n emptyFinding,\n geniusAIDataList: img.geniusAIDataList,\n };\n }),\n };\n });\n const completed_steps = getCompletedSteps(lesson.episodes, data.id);\n result.push({ id: data.id, name: data.title, completed_steps, views });\n return result;\n};\n\n(function(target) {\n if (!target || !target.prototype) return;\n target.prototype.arrow = function(startX, startY, endX, endY, controlPoints) {\n var dx = endX - startX;\n var dy = endY - startY;\n var len = Math.sqrt(dx * dx + dy * dy);\n var sin = dy / len;\n var cos = dx / len;\n var a = [];\n a.push(0, 0);\n for (var i = 0; i < controlPoints.length; i += 2) {\n var x1 = controlPoints[i];\n var y1 = controlPoints[i + 1];\n a.push(x1 < 0 ? len + x1 : x1, y1);\n }\n a.push(len, 0);\n for (var j = controlPoints.length; j > 0; j -= 2) {\n var x2 = controlPoints[j - 2];\n var y2 = controlPoints[j - 1];\n a.push(x2 < 0 ? len + x2 : x2, -y2);\n }\n a.push(0, 0);\n for (var k = 0; k < a.length; k += 2) {\n var x3 = a[k] * cos - a[k + 1] * sin + startX;\n var y3 = a[k] * sin + a[k + 1] * cos + startY;\n if (i === 0) this.moveTo(x3, y3);\n else this.lineTo(x3, y3);\n }\n };\n})(CanvasRenderingContext2D);\n\nexport const drawArrow = (c, viewport, e) => {\n c.lineWidth = 1;\n c.strokeStyle = '#00b5ec';\n c.fillStyle = '#00b5ec';\n c.setTransform(1, 0, 0, 1, 10, 0);\n\n c.translate(0, 0);\n c.beginPath();\n c.arrow(50, 50, 0, 0, [0, 2, -10, 2, -10, 5]);\n\n c.fill();\n};\n\nexport const getFindingsCoordinates = points => {\n if (!points || !points.data) return null;\n try {\n const result = points.data.map(i => {\n const item = i.handles.end;\n return { pointX: item.x, pointY: item.y };\n });\n return JSON.stringify(result);\n } catch (err) {\n return null;\n }\n};\n\nexport const createFindingEventData = ({ x, y }) => {\n return {\n visible: true,\n active: true,\n color: undefined,\n invalidated: true,\n handles: {\n end: {\n x,\n y,\n highlight: true,\n active: true,\n },\n },\n };\n};\n\nexport const createGenuieEventData = ({ x, y, shape, percentage }) => {\n return {\n visible: true,\n active: true,\n color: undefined,\n invalidated: true,\n handles: {\n end: {\n x,\n y,\n percentage: percentage,\n shape: shape,\n highlight: true,\n active: true,\n },\n },\n };\n};\n\nexport const getDicomImagesObj = images => {\n const result = {};\n images.forEach(item => {\n result[item.url] = item;\n });\n return result;\n};\n\nexport const sumShapes = (images, shape) => {\n let sum = 0;\n images.forEach(item => {\n if (item.geniusAIDataList && item.geniusAIDataList.length) {\n const shapes = item.geniusAIDataList.filter(i => Number(i.shape) === Number(shape));\n sum += shapes ? shapes.length : 0;\n }\n });\n return sum;\n};\n","export default __webpack_public_path__ + \"static/media/1n.3d8a8f8d.svg\";","export default __webpack_public_path__ + \"static/media/1s.8133eeef.svg\";","export default __webpack_public_path__ + \"static/media/1p.997e7292.svg\";","export default __webpack_public_path__ + \"static/media/1ps.d360f5bb.svg\";","export default __webpack_public_path__ + \"static/media/2n.82ae194a.svg\";","export default __webpack_public_path__ + \"static/media/2s.0553ca14.svg\";","export default __webpack_public_path__ + \"static/media/2p.08f4ee6a.svg\";","export default __webpack_public_path__ + \"static/media/2ps.e14a8de7.svg\";","export default __webpack_public_path__ + \"static/media/3n.ab78d6d2.svg\";","export default __webpack_public_path__ + \"static/media/3s.f2ac7237.svg\";","export default __webpack_public_path__ + \"static/media/3p.9afb207e.svg\";","export default __webpack_public_path__ + \"static/media/3ps.af5584af.svg\";","export default __webpack_public_path__ + \"static/media/4n.e692a18d.svg\";","export default __webpack_public_path__ + \"static/media/4s.e440f2f3.svg\";","export default __webpack_public_path__ + \"static/media/4p.0738b555.svg\";","export default __webpack_public_path__ + \"static/media/4ps.c52e9bb8.svg\";","export default __webpack_public_path__ + \"static/media/5n.f8956da8.svg\";","export default __webpack_public_path__ + \"static/media/5s.91fac24b.svg\";","export default __webpack_public_path__ + \"static/media/5p.8f2d2562.svg\";","export default __webpack_public_path__ + \"static/media/5ps.4cc5571a.svg\";","export default __webpack_public_path__ + \"static/media/6n.8d04a150.svg\";","export default __webpack_public_path__ + \"static/media/6s.442e0709.svg\";","export default __webpack_public_path__ + \"static/media/6p.8ff09964.svg\";","export default __webpack_public_path__ + \"static/media/6ps.24c75292.svg\";","export default __webpack_public_path__ + \"static/media/7n.b1798722.svg\";","export default __webpack_public_path__ + \"static/media/7s.1cf21eb2.svg\";","export default __webpack_public_path__ + \"static/media/7p.14eb7ee8.svg\";","export default __webpack_public_path__ + \"static/media/7ps.9e5f0f2d.svg\";","export default __webpack_public_path__ + \"static/media/8n.de3f7d2c.svg\";","export default __webpack_public_path__ + \"static/media/8s.a8570d99.svg\";","export default __webpack_public_path__ + \"static/media/8p.a01921f6.svg\";","export default __webpack_public_path__ + \"static/media/8ps.5155c21f.svg\";","export default __webpack_public_path__ + \"static/media/9n.b47f982b.svg\";","export default __webpack_public_path__ + \"static/media/9s.0bafdf0a.svg\";","export default __webpack_public_path__ + \"static/media/9p.d9c363a7.svg\";","export default __webpack_public_path__ + \"static/media/9ps.67b49787.svg\";","export default __webpack_public_path__ + \"static/media/11n.c6802432.svg\";","export default __webpack_public_path__ + \"static/media/11s.b00c9cd2.svg\";","export default __webpack_public_path__ + \"static/media/11p.b55d9464.svg\";","export default __webpack_public_path__ + \"static/media/11ps.d6ddb562.svg\";","export default __webpack_public_path__ + \"static/media/12n.7318717c.svg\";","export default __webpack_public_path__ + \"static/media/12s.cc420426.svg\";","export default __webpack_public_path__ + \"static/media/12p.d1b2c74a.svg\";","export default __webpack_public_path__ + \"static/media/12ps.a09149b9.svg\";","export default __webpack_public_path__ + \"static/media/heatmapn.637323d9.svg\";","export default __webpack_public_path__ + \"static/media/heatmaps.8811c071.svg\";","export default __webpack_public_path__ + \"static/media/1p.083d9c5d.svg\";","export default __webpack_public_path__ + \"static/media/1a.ffc6ed4a.svg\";","export default __webpack_public_path__ + \"static/media/2p.c886a429.svg\";","export default __webpack_public_path__ + \"static/media/2a.1f36729f.svg\";","export default __webpack_public_path__ + \"static/media/4p.e4abf33b.svg\";","export default __webpack_public_path__ + \"static/media/4a.343ef825.svg\";","export default __webpack_public_path__ + \"static/media/5p.fba6bffc.svg\";","export default __webpack_public_path__ + \"static/media/5a.fc4fdc8a.svg\";","export default __webpack_public_path__ + \"static/media/6p.8b034a1f.svg\";","export default __webpack_public_path__ + \"static/media/6a.5fd8d6f1.svg\";","export default __webpack_public_path__ + \"static/media/7p.8c67ad2e.svg\";","export default __webpack_public_path__ + \"static/media/7a.cff7a8a9.svg\";","export default __webpack_public_path__ + \"static/media/8p.c2c2fa61.svg\";","export default __webpack_public_path__ + \"static/media/8a.01e0a731.svg\";","export default __webpack_public_path__ + \"static/media/9p.5fbd2803.svg\";","export default __webpack_public_path__ + \"static/media/9a.a5b7bde8.svg\";","export default __webpack_public_path__ + \"static/media/10p.4bfc3d5d.svg\";","import step1Icon from 'assets/stepsnew/1n.svg';\nimport step1IconActive from 'assets/stepsnew/1s.svg';\nimport step1IconPassed from 'assets/stepsnew/1p.svg';\nimport step1IconPActive from 'assets/stepsnew/1ps.svg';\n\nimport step2Icon from 'assets/stepsnew/2n.svg';\nimport step2IconActive from 'assets/stepsnew/2s.svg';\nimport step2IconPassed from 'assets/stepsnew/2p.svg';\nimport step2IconPActive from 'assets/stepsnew/2ps.svg';\n\nimport step3Icon from 'assets/stepsnew/3n.svg';\nimport step3IconActive from 'assets/stepsnew/3s.svg';\nimport step3IconPassed from 'assets/stepsnew/3p.svg';\nimport step3IconPActive from 'assets/stepsnew/3ps.svg';\n\nimport step4Icon from 'assets/stepsnew/4n.svg';\nimport step4IconActive from 'assets/stepsnew/4s.svg';\nimport step4IconPassed from 'assets/stepsnew/4p.svg';\nimport step4IconPActive from 'assets/stepsnew/4ps.svg';\n\nimport step5Icon from 'assets/stepsnew/5n.svg';\nimport step5IconActive from 'assets/stepsnew/5s.svg';\nimport step5IconPassed from 'assets/stepsnew/5p.svg';\nimport step5IconPActive from 'assets/stepsnew/5ps.svg';\n\nimport step6Icon from 'assets/stepsnew/6n.svg';\nimport step6IconActive from 'assets/stepsnew/6s.svg';\nimport step6IconPassed from 'assets/stepsnew/6p.svg';\nimport step6IconPActive from 'assets/stepsnew/6ps.svg';\n\nimport step7Icon from 'assets/stepsnew/7n.svg';\nimport step7IconActive from 'assets/stepsnew/7s.svg';\nimport step7IconPassed from 'assets/stepsnew/7p.svg';\nimport step7IconPActive from 'assets/stepsnew/7ps.svg';\n\nimport step8Icon from 'assets/stepsnew/8n.svg';\nimport step8IconActive from 'assets/stepsnew/8s.svg';\nimport step8IconPassed from 'assets/stepsnew/8p.svg';\nimport step8IconPActive from 'assets/stepsnew/8ps.svg';\n\nimport step9Icon from 'assets/stepsnew/9n.svg';\nimport step9IconActive from 'assets/stepsnew/9s.svg';\nimport step9IconPassed from 'assets/stepsnew/9p.svg';\nimport step9IconPActive from 'assets/stepsnew/9ps.svg';\n\nimport step11Icon from 'assets/stepsnew/11n.svg';\nimport step11IconActive from 'assets/stepsnew/11s.svg';\nimport step11IconPassed from 'assets/stepsnew/11p.svg';\nimport step11IconPActive from 'assets/stepsnew/11ps.svg';\n\n// import step10Icon from 'assets/steps/11p.svg';\n// import step10IconActive from 'assets/steps/11a.svg';\nimport step12Icon from 'assets/stepsnew/12n.svg';\nimport step12IconActive from 'assets/stepsnew/12s.svg';\nimport step12IconPassed from 'assets/stepsnew/12p.svg';\nimport step12IconPActive from 'assets/stepsnew/12ps.svg';\n\nimport heatmapIcon from 'assets/stepsnew/heatmapn.svg';\nimport heatmapIconActive from 'assets/stepsnew/heatmaps.svg';\nimport heatmapIconPassed from 'assets/stepsnew/heatmaps.svg';\nimport heatmapIconPActive from 'assets/stepsnew/heatmaps.svg';\n\nimport tool1Icon from 'assets/tools/1p.svg';\nimport tool1IconActive from 'assets/tools/1a.svg';\nimport tool2Icon from 'assets/tools/2p.svg';\nimport tool2IconActive from 'assets/tools/2a.svg';\n// import tool3Icon from 'assets/tools/3p.svg';\n// import tool3IconActive from 'assets/tools/3a.svg';\nimport tool4Icon from 'assets/tools/4p.svg';\nimport tool4IconActive from 'assets/tools/4a.svg';\nimport tool5Icon from 'assets/tools/5p.svg';\nimport tool5IconActive from 'assets/tools/5a.svg';\nimport tool6Icon from 'assets/tools/6p.svg';\nimport tool6IconActive from 'assets/tools/6a.svg';\nimport tool7Icon from 'assets/tools/7p.svg';\nimport tool7IconActive from 'assets/tools/7a.svg';\nimport tool8Icon from 'assets/tools/8p.svg';\nimport tool8IconActive from 'assets/tools/8a.svg';\nimport tool9Icon from 'assets/tools/9p.svg';\nimport tool9IconActive from 'assets/tools/9a.svg';\nimport tool10Icon from 'assets/tools/10p.svg';\nimport tool10IconActive from 'assets/tools/10p.svg';\n\nimport { IconGenuineCross, IconGenuineFlake, IconGenuineTriangle } from 'shared/components/Icons';\n\nexport const genuieShapes = [\n { icon: IconGenuineTriangle, shape: 2 },\n { icon: IconGenuineCross, shape: 1 },\n { icon: IconGenuineFlake, shape: 3 },\n];\n\nexport const steps = [\n {\n id: 1,\n name: '2D CC/MLO Views',\n icon: step1Icon,\n iconActive: step1IconActive,\n iconPassed: step1IconPassed,\n iconPassedActive: step1IconPActive,\n views: {\n RCC: {\n active: true,\n position: 'right',\n thumbpos: 'left',\n key: 'RCC',\n has_switcher: true,\n dataType: '2D',\n },\n LCC: {\n active: true,\n position: 'left',\n thumbpos: 'right',\n key: 'LCC',\n has_switcher: true,\n dataType: '2D',\n },\n RMLO: {\n active: true,\n position: 'right',\n thumbpos: 'left',\n key: 'RMLO',\n has_switcher: true,\n dataType: '2D',\n },\n LMLO: {\n active: true,\n position: 'left',\n thumbpos: 'right',\n key: 'LMLO',\n has_switcher: true,\n dataType: '2D',\n },\n },\n },\n {\n id: 2,\n name: '2D CC Views',\n icon: step2Icon,\n iconActive: step2IconActive,\n iconPassed: step2IconPassed,\n iconPassedActive: step2IconPActive,\n views: {\n RCC: {\n active: true,\n position: 'right',\n thumbpos: 'left',\n has_switcher: true,\n dataType: '2D',\n key: 'RCC',\n },\n LCC: {\n active: true,\n position: 'left',\n thumbpos: 'right',\n has_switcher: true,\n dataType: '2D',\n key: 'LCC',\n },\n },\n },\n {\n id: 3,\n name: '2D MLO Views',\n icon: step3Icon,\n iconActive: step3IconActive,\n iconPassed: step3IconPassed,\n iconPassedActive: step3IconPActive,\n views: {\n RMLO: {\n active: true,\n key: 'RMLO',\n position: 'right',\n thumbpos: 'left',\n has_switcher: true,\n dataType: '2D',\n },\n LMLO: {\n active: true,\n key: 'LMLO',\n position: 'left',\n thumbpos: 'right',\n has_switcher: true,\n dataType: '2D',\n },\n },\n },\n {\n id: 4,\n name: '2D/3D RCC Views',\n icon: step4Icon,\n iconActive: step4IconActive,\n iconPassed: step4IconPassed,\n iconPassedActive: step4IconPActive,\n views: {\n RCC: {\n active: true,\n key: 'RCC',\n position: 'right',\n thumbpos: 'left',\n has_switcher: true,\n dataType: '2D',\n },\n RCC_L: {\n active: true,\n key: 'RCC',\n layers: true,\n position: 'left',\n thumbpos: 'left',\n has_switcher: true,\n dataType: '3DQ',\n },\n },\n },\n {\n id: 5,\n name: '2D/3D RMLO Views',\n icon: step5Icon,\n iconActive: step5IconActive,\n iconPassed: step5IconPassed,\n iconPassedActive: step5IconPActive,\n views: {\n RMLO: {\n active: true,\n key: 'RMLO',\n position: 'right',\n thumbpos: 'left',\n has_switcher: true,\n dataType: '2D',\n },\n RMLO_L: {\n active: true,\n key: 'RMLO',\n layers: true,\n position: 'right',\n thumbpos: 'left',\n has_switcher: true,\n dataType: '3DQ',\n },\n },\n },\n {\n id: 6,\n name: '2D/3D LCC Views',\n icon: step6Icon,\n iconActive: step6IconActive,\n iconPassed: step6IconPassed,\n iconPassedActive: step6IconPActive,\n views: {\n LCC: {\n active: true,\n key: 'LCC',\n position: 'right',\n thumbpos: 'right',\n has_switcher: true,\n dataType: '2D',\n },\n LCC_L: {\n active: true,\n key: 'LCC',\n layers: true,\n position: 'left',\n thumbpos: 'right',\n has_switcher: true,\n dataType: '3DQ',\n },\n },\n },\n {\n id: 7,\n name: '2D/3D LMLO Views',\n icon: step7Icon,\n iconActive: step7IconActive,\n iconPassed: step7IconPassed,\n iconPassedActive: step7IconPActive,\n views: {\n LMLO: {\n active: true,\n key: 'LMLO',\n position: 'right',\n thumbpos: 'right',\n has_switcher: true,\n dataType: '2D',\n },\n LMLO_L: {\n active: true,\n key: 'LMLO',\n layers: true,\n position: 'left',\n thumbpos: 'right',\n has_switcher: true,\n dataType: '3DQ',\n },\n },\n },\n {\n id: 8,\n name: '2D/3D stacked R CC/MLO, Toggle (T) between modes',\n icon: step8Icon,\n iconActive: step8IconActive,\n iconPassed: step8IconPassed,\n iconPassedActive: step8IconPActive,\n views: {\n RCC: {\n active: true,\n key: 'RCC',\n layers: true,\n has_switcher: true,\n dataType: '2D',\n position: 'left',\n thumbpos: 'left',\n },\n RMLO: {\n active: true,\n key: 'RMLO',\n layers: true,\n has_switcher: true,\n dataType: '2D',\n position: 'left',\n thumbpos: 'left',\n },\n },\n },\n {\n id: 9,\n name: '2D/3D stacked L CC/MLO, Toggle (T) between modes',\n icon: step9Icon,\n iconActive: step9IconActive,\n iconPassed: step9IconPassed,\n iconPassedActive: step9IconPActive,\n views: {\n LMLO: {\n active: true,\n key: 'LMLO',\n layers: true,\n has_switcher: true,\n dataType: '2D',\n position: 'right',\n thumbpos: 'right',\n },\n LCC: {\n active: true,\n key: 'LCC',\n layers: true,\n has_switcher: true,\n dataType: '2D',\n position: 'left',\n thumbpos: 'right',\n },\n },\n },\n {\n id: 11,\n name: 'question',\n icon: step11Icon,\n iconActive: step11IconActive,\n iconPassed: step11IconPassed,\n iconPassedActive: step11IconPActive,\n type: 'modal',\n views: {},\n disabled_no_active: 9,\n },\n {\n id: 12,\n name: 'heatmap',\n icon: heatmapIcon,\n iconActive: heatmapIconActive,\n iconPassed: heatmapIconPassed,\n iconPassedActive: heatmapIconPActive,\n type: 'modal',\n views: {},\n disabled_no_active: 10,\n },\n {\n id: 13,\n name: 'explanator',\n icon: step12Icon,\n iconActive: step12IconActive,\n iconPassed: step12IconPassed,\n iconPassedActive: step12IconPActive,\n type: 'modal',\n views: {},\n disabled_no_active: 10,\n },\n];\n\nexport const tools = [\n {\n name: 'FT',\n title: 'Show/Hide Finding Tool',\n icon: tool1Icon,\n iconActive: tool1IconActive,\n type: 'findingToggle',\n cursor: 'default',\n height: 23,\n onTimeAction: true,\n canStayActive: true,\n noResetFindings: true,\n },\n {\n name: 'F',\n title: 'Activate Finding Tool',\n icon: tool2Icon,\n iconActive: tool2IconActive,\n type: 'finding',\n cursor: 'arrow',\n height: 23,\n onTimeAction: false,\n },\n {\n name: 'FR',\n title: 'Reset Finding Tool',\n icon: tool10Icon,\n iconActive: tool10IconActive,\n type: 'findingReset',\n cursor: 'default',\n height: 23,\n onTimeAction: true,\n },\n {\n type: 'separator',\n },\n {\n name: 'R',\n title: 'Reset Viewers',\n icon: tool4Icon,\n iconActive: tool4IconActive,\n type: 'reset',\n cursor: 'default',\n onTimeAction: true,\n },\n {\n name: 'P',\n title: 'Activate Panning Tool',\n icon: tool5Icon,\n iconActive: tool5IconActive,\n type: 'pan',\n cursor: 'pan',\n onTimeAction: false,\n },\n {\n name: 'I Z',\n title: 'Activate Interactive Zoom',\n icon: tool6Icon,\n iconActive: tool6IconActive,\n type: 'zoomInteractive',\n cursor: 'izoom',\n onTimeAction: false,\n },\n {\n name: 'Z 1:1',\n title: 'Activate 1:1 Tool',\n icon: tool7Icon,\n iconActive: tool7IconActive,\n type: 'zoom1_1',\n cursor: 'fullzoom',\n onTimeAction: false,\n },\n {\n name: 'M',\n title: 'Activate Magnifier Tool',\n icon: tool8Icon,\n iconActive: tool8IconActive,\n type: 'zoomMagnifier',\n cursor: 'mzoom',\n onTimeAction: false,\n },\n {\n name: 'W/L',\n title:\n 'Activate Window/Level Tool (W; for presets move mouse over viewer and press numeric keys 1, 2, 3, ...)',\n icon: tool9Icon,\n iconActive: tool9IconActive,\n type: 'windowLevel',\n cursor: 'wlevel',\n onTimeAction: false,\n },\n];\n\nexport const getToolByType = type => {\n return tools.find(item => item.type === type);\n};\n\nexport const getDefaultType = (type, datas) => {\n if (type === '3DQ' && !datas['3DQ'] && datas['tomo']) return 'tomo';\n return type;\n};\n","export default __webpack_public_path__ + \"static/media/2p.1d75b871.svg\";","export default __webpack_public_path__ + \"static/media/4a.8302ecaa.svg\";","import React, { useRef } from 'react';\nimport { openFullscreen, closeFullscreen } from 'utils/appHelpers';\n\nimport iconMax from 'assets/arrows/2p.svg';\nimport iconMin from 'assets/arrows/4a.svg';\nimport BackButton from 'shared/BackButton';\nimport useOutsideClick from 'shared/hooks/useOutsideClick';\nimport { saveToStore, getFromStore } from 'utils/storeHelpers';\n\nconst ControlArea = ({\n tools,\n course,\n fullScreen,\n activeTool,\n setActiveTool,\n history,\n viewerOptions,\n disabled,\n}) => {\n const toolClickHandle = item => {\n const state =\n item.type === activeTool.type && !item.onTimeAction ? { type: 'none' } : { ...item };\n setActiveTool(state);\n };\n\n const tooltipRef = useRef();\n\n useOutsideClick(tooltipRef, () => tooltipRef.current.classList.remove('hover'));\n\n return (\n {title}
\n\n {tags &&\n tags.map((item, i) => {\n const tag = item.tag || item;\n return (\n
\n \n {tag.label || tag.name}\n
\n );\n })}\n \n
\n );\n};\n\nexport default ControlArea;\n","export default __webpack_public_path__ + \"static/media/caseLeft.2fe26188.svg\";","export default __webpack_public_path__ + \"static/media/caseRight.a83a8fb9.svg\";","import React from 'react';\nimport CaseLeftIcon from 'assets/arrows/caseLeft.svg';\nimport CaseRightIcon from 'assets/arrows/caseRight.svg';\n\nconst Switcher = ({ name, previews, next, disabled, current, allCount, highlightNext }) => {\n return (\n \n
\n \n {!fullScreen && history && {\n tooltipRef.current.classList.remove('hover');\n saveToStore('viewerToolTip', true);\n }}\n >\n 
\n e.stopPropagation()}\n >\n {fullScreen ? 'Normal ' : 'Full '}Screen\n
\n Click this button to\n {fullScreen ? ' turn off the full screen' : ' display the viewer in full screen'}\n \n \n {course &&
\n \n Click this button to\n {fullScreen ? ' turn off the full screen' : ' display the viewer in full screen'}\n \n \n {course &&
{course.title}
}\n\n
\n \n
\n \n {tools.map(item => {\n const isSeparator = item.type === 'separator';\n const canActive = viewerOptions && viewerOptions.canBeActive[item.type];\n const isActive = (activeTool.type === item.type && !item.onTimeAction) || canActive;\n if (isSeparator) return ;\n return (\n \n {item.icon && (\n
\n \n \n allCount || disabled}\n >\n 
\n \n
\n );\n};\n\nexport default Switcher;\n","export default __webpack_public_path__ + \"static/media/3p.a659a691.svg\";","export default __webpack_public_path__ + \"static/media/stepLeft.aa8b0a8b.svg\";","export default __webpack_public_path__ + \"static/media/stepRight.143feca5.svg\";","import React, { useEffect } from 'react';\nimport Switcher from './Switcher';\nimport { IconAbout } from 'shared/components/Icons';\nimport checkIcon from 'assets/arrows/3p.svg';\nimport StepLeftIcon from 'assets/arrows/stepLeft.svg';\nimport StepRightIcon from 'assets/arrows/stepRight.svg';\n\nconst StepsArea = ({\n cases,\n steps,\n completedSteps,\n activeCase,\n activeStep,\n changeActiveCase,\n changeActiveStep,\n setActiveStep,\n onHelpModalOpen,\n}) => {\n const isLastCase = activeCase === cases.length - 1;\n const isLastStep = activeStep === steps.length - 1;\n const highlightNextCase = isLastStep && !isLastCase;\n\n const handleStepChange = bool => {\n setActiveStep(current => {\n const disabledPrev = current - 1 < 0;\n const disabledNext = Number(current) + 2 > steps.length;\n if ((bool && !disabledNext) || (!bool && !disabledPrev)) {\n changeActiveStep(current - (bool ? -1 : 1));\n }\n if (bool && disabledNext && !isLastCase) {\n handleCaseChange(true);\n }\n return current;\n });\n };\n\n const handleCaseChange = bool => {\n changeActiveCase(activeCase - (bool ? -1 : 1));\n changeActiveStep(0);\n };\n\n const disabledPrev = () => {\n return activeStep - 1 < 0;\n };\n\n // const goToFeedback = () => {\n // history.push(getFeedbackUrl(reduxCourse));\n // };\n\n const handleUserKeyPress = event => {\n const { keyCode } = event;\n if (keyCode === 37) handleStepChange(false);\n if (keyCode === 39) handleStepChange(true);\n };\n\n useEffect(() => {\n window.addEventListener('keydown', handleUserKeyPress);\n return () => {\n window.removeEventListener('keydown', handleUserKeyPress);\n };\n //eslint-disable-next-line\n }, []);\n\n return (\n \n {name} {current + 1} of {allCount}\n
\n\n
\n );\n};\n\nexport default StepsArea;\n","export default __webpack_public_path__ + \"static/media/4p.52d5b854.svg\";","export default \"data:image/png;base64,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\"","export default __webpack_public_path__ + \"static/media/casechange.651fb364.png\";","import React from 'react';\n\nimport iconMagnifier from 'assets/tools/8p.svg';\nimport iconToggle from 'assets/tools/7p.svg';\nimport iconInteractiveZoom from 'assets/tools/6p.svg';\nimport iconMove from 'assets/tools/5p.svg';\nimport iconReset from 'assets/tools/4p.svg';\nimport iconBrightness from 'assets/tools/9p.svg';\nimport iconFinding from 'assets/tools/2p.svg';\nimport iconMaximize from 'assets/arrows/2p.svg';\nimport iconMinimize from 'assets/arrows/4p.svg';\nimport iconStudyOverview from 'assets/stepsnew/1n.svg';\nimport iconCC from 'assets/stepsnew/2n.svg';\nimport iconMLO from 'assets/stepsnew/3n.svg';\nimport iconCCRight2D from 'assets/stepsnew/4n.svg';\nimport iconMLORight2D from 'assets/stepsnew/5n.svg';\nimport iconCCLeft2D from 'assets/stepsnew/6n.svg';\nimport iconMLOLeft2D from 'assets/stepsnew/7n.svg';\nimport iconRightBrest from 'assets/stepsnew/8n.svg';\nimport iconLeftBrest from 'assets/stepsnew/9n.svg';\nimport iconAssessment from 'assets/stepsnew/11n.svg';\nimport iconDiagnostic from 'assets/stepsnew/heatmapn.svg';\nimport iconComments from 'assets/stepsnew/12n.svg';\n\n// Temporary Icons\n// import iconStructuredRoaming from 'assets/temp_icons/icon_quadrant_roaming.png';\n// import iconInvert from 'assets/tools/9p.svg';\n// import iconStack from 'assets/temp_icons/icon_stack.png';\nimport iconFindingsShow from 'assets/tools/1p.svg';\nimport iconFindingsDelete from 'assets/tools/10p.svg';\nimport iconSteps from 'assets/stepchange.png';\nimport iconCases from 'assets/casechange.png';\n// contact, print\n\nexport const viewerDialogJson = {\n zoomAndMagnificationTool: [\n {\n description: 'Magnifier',\n icon: iconMagnifier,\n buttons: [], // ['R'],\n },\n {\n description: 'Interactive zoom',\n icon: iconInteractiveZoom,\n buttons: [], // ['Z'],\n },\n {\n description:\n 'Full resolution mode: Clicking on the image will show in original full resolution. By clicking on it again, will toggle back to fit to viewer mode.',\n icon: iconToggle,\n buttons: [], // ['Shift', 'Z'],\n },\n {\n description: 'Maximize viewer',\n icon: iconMaximize,\n buttons: [], // ['Shift', 'M'],\n },\n // {\n // description:\n // 'Structured roaming: Moves through zoomed views to make sure the whole tissue is displayed.',\n // icon: iconStructuredRoaming,\n // buttons: [], // ['TAB'],\n // },\n {\n description: 'Panning/moving image (also via right mouse button)',\n icon: iconMove,\n buttons: [], // ['P'],\n },\n {\n description: 'Reset viewers: Changes zoom and window/level to initial values',\n icon: iconReset,\n buttons: [], // ['Shift', 'R'],\n },\n ],\n otherTools: [\n {\n description: 'Change window/level settings',\n icon: iconBrightness,\n buttons: [], // ['W'],\n },\n // {\n // description: 'Invert images',\n // icon: iconInvert,\n // buttons: [], // ['I'],\n // },\n // {\n // description: 'Stacking/Slicing (also via ↑ / ↓ or scroll wheel) ',\n // icon: iconStack,\n // buttons: [], // ['↑', '↓', 'S'],\n // },\n {\n description: 'Finding tool: Allows to place arrows at regions of interest.',\n icon: iconFinding,\n buttons: [], // ['F'],\n },\n {\n description: 'Show Markings',\n icon: iconFindingsShow,\n buttons: [], // ['Shift', 'F'],\n },\n {\n description: 'Delete Markings',\n icon: iconFindingsDelete,\n buttons: [], // ['Shift', 'F'],\n },\n ],\n navigation: [\n {\n description: 'Full screen on',\n icon: iconMaximize,\n buttons: [], // ['0'],\n },\n {\n description: 'Full screen off',\n icon: iconMinimize,\n buttons: [], // ['0', 'Esc'],\n isSlash: true,\n },\n {\n description:\n 'Hanging Protocol: Right (next) and left (prior) icons to step you through the images for that patient',\n icon: iconSteps,\n buttons: [], // ['←', '→'],\n width: '130px',\n isSlash: true,\n },\n {\n description:\n 'Case Navigation: Right (next) and left (prior) icons to navigate through the course',\n icon: iconCases,\n buttons: [],\n width: '130px',\n },\n ],\n hangingProtocols: [\n {\n className: 'col-4',\n childs: [\n {\n description: 'Study overview',\n icon: iconStudyOverview,\n buttons: [],\n width: '70px',\n },\n {\n description: 'CC Right/Left',\n icon: iconCC,\n buttons: [],\n },\n {\n description: 'MLO Right/Left',\n icon: iconMLO,\n buttons: [],\n },\n {\n description: 'CC Right 2D/Tomo',\n icon: iconCCRight2D,\n buttons: [],\n },\n {\n description: 'MLO Right 2D/Tomo',\n icon: iconMLORight2D,\n buttons: [],\n },\n {\n description: 'CC Left 2D/Tomo',\n icon: iconCCLeft2D,\n buttons: [],\n },\n {\n description: 'MLO Left 2D/Tomo',\n icon: iconMLOLeft2D,\n buttons: [],\n },\n ],\n },\n {\n className: 'flex-fill',\n childs: [\n {\n description: 'Right breast of interest',\n icon: iconRightBrest,\n buttons: [],\n },\n {\n description: 'Left breast of interest',\n icon: iconLeftBrest,\n buttons: [],\n },\n {\n description: 'Assessment (if available)',\n icon: iconAssessment,\n buttons: [],\n },\n {\n description: 'Expert’s findings and comments',\n icon: iconComments,\n buttons: [],\n },\n {\n description: 'Diagnostic images (if available)',\n icon: iconDiagnostic,\n buttons: [],\n },\n ],\n },\n ],\n caseAccessment: [\n Cases may be assessed only when all mandatory hangings were reviewed.,\n \n Open the reporting page via click on\n \n \n
\n \n \n 
\n \n {steps.map((item, index) => {\n const isActive = completedSteps.includes(index);\n const isExplanator = item.name === 'explanator';\n // const isHeatmap = item.name === 'heatmap';\n const isNeedToDone =\n activeStep >= 9 &&\n completedSteps.length < 10 &&\n !isActive &&\n activeStep !== index &&\n !isExplanator;\n return (\n changeActiveStep(index)}\n >\n {isActive && 
}\n {item.icon && (\n steps.length}\n >\n 
\n \n
\n \n
\n);\n\nexport default ZoomAndMagnificationTools;\n","import React from 'react';\nimport { viewerDialogJson } from './../config/consts';\nconst { otherTools } = viewerDialogJson;\n\nconst OtherTools = () => (\n \n Generally, a double click into an image will magnify it-usually to the available size of the\n viewer. Mammograms\n
are magnified to 1;1,i.e., original size.\n
\n \n {description}\n {buttons.map((btn, index) => (\n \n ))}\n
\n {otherTools.map(({ icon, description, buttons }, index) => {\n return (\n
\n);\n\nexport default OtherTools;\n","import React from 'react';\nimport { viewerDialogJson } from './../config/consts';\nconst { navigation } = viewerDialogJson;\n\nconst Navigation = () => (\n \n \n {description}\n {buttons.map((btn, index) => (\n \n ))}\n
\n {navigation.map(({ icon, description, buttons = [], isSlash, width }, index) => {\n return (\n
\n);\n\nexport default Navigation;\n","import React from 'react';\nimport { viewerDialogJson } from './../config/consts';\nconst { hangingProtocols } = viewerDialogJson;\n\nconst HangingProtocols = () => (\n \n \n {description}\n {buttons.map((btn, index) => (\n \n ))}\n
\n
\n);\n\nexport default HangingProtocols;\n","import React from 'react';\nimport { viewerDialogJson } from './../config/consts';\nconst { caseAccessment } = viewerDialogJson;\n\nconst CaseAccessment = () => {\n return (\n \n {hangingProtocols.map((group, groupIndex) => (\n
\n \n {group.childs.map(({ icon, description, buttons = [], isSlash, width }, childIndex) => {\n return (\n \n 
\n {description}\n {buttons.map((btn, btnIndex) => (\n \n ))}\n \n );\n })}\n
\n ))}\n \n Note: The current (screening) study is always displayed first.\n
\n\n For hangings with viewers with multiple images: All images in a hanging can be toggled by\n clicking the tab icon.\n
\n- \n {caseAccessment.map((item, index) => (\n
- \n {item}\n \n ))}\n
\n {faq.map(({ q, a, variants }, qIndex) => (\n
\n );\n};\n\nexport default FAQ;\n","/* eslint-disable react/jsx-no-duplicate-props */\n/* eslint-disable jsx-a11y/anchor-is-valid */\nimport { HOST } from 'configs';\nimport React from 'react';\n\nconst Print = () => {\n return (\n \n
\n ))}\n \n Q: {q}\n
\nA: {a}
\n {variants && variants.length > 0 && (\n- \n {variants.map((variant, vIndex) => (\n
- {variant} \n ))}\n
\n \n Click here to open printable PDF help file in a new browser tab.\n \n
\n );\n};\n\nexport default Print;\n","import React, { useState } from 'react';\nimport Modal from 'react-modal';\nimport { AppBar, Tabs, Tab } from '@material-ui/core';\nimport {\n ZoomAndMagnificationTools,\n OtherTools,\n Navigation,\n HangingProtocols,\n CaseAccessment,\n // FAQ,\n Print,\n} from './components';\n\nconst modalStyles = {\n overlay: {\n // backgroundColor: '#000000',\n backgroundColor: 'rgba(0, 0, 0, 0.75)',\n },\n};\n\nconst tabs = [\n {\n label: 'Zoom and Magnification Tools',\n component: Radiologist Training - Online Help
\n{tabs[tab].component}
\n \n );\n};\n\nexport default HelpModal;\n","import React from 'react';\n\nconst getSmallerSize = imageWidth => {\n return Number((imageWidth / 50).toFixed());\n};\n\nconst Thumbnail = ({ viewport }) => {\n if (!viewport || !viewport.image) return null;\n const { scale, initialScale, translation, rotation, vflip, hflip } = viewport;\n const smallNum = getSmallerSize(viewport.image.width);\n const width = viewport.image.width / smallNum;\n const height = viewport.image.height / smallNum;\n const coreSize = {\n width: (initialScale * width) / scale,\n height: (initialScale * height) / scale,\n };\n const corePos = {\n transform: `translate(${-(translation.x / smallNum)}px, ${-(translation.y / smallNum)}px)`,\n };\n const imageStyle = {\n backgroundImage: `url('${viewport.image.imageId}')`,\n transform: `rotate(${rotation}deg) rotateX(${vflip ? 180 : 0}deg) rotateY(${\n hflip ? 180 : 0\n }deg)`,\n };\n if (coreSize.width > 100 || initialScale >= scale) return null;\n return (\n \n \n \n
\n );\n};\n\nexport default Thumbnail;\n","export default __webpack_public_path__ + \"static/media/pause.a12d8b2f.svg\";","export default __webpack_public_path__ + \"static/media/speed.f967b66e.svg\";","import React, { useState } from 'react';\nimport ReactModal from 'react-modal';\nimport { IconClose } from 'shared/components/Icons';\n\nexport const getPrePostSliceItems = (index, pre, post) => {\n let prePostSlicesIndexes = [];\n if (post) {\n for (let i = index + 1; i <= index + post; i += 1) {\n prePostSlicesIndexes.push(i);\n }\n }\n if (pre) {\n for (let i = index - 1; i >= index - pre; i -= 1) {\n prePostSlicesIndexes.push(i);\n }\n }\n return { prePostSlicesIndexes };\n};\n\nexport const getImagesPrePostSlices = images => {\n let result = new Set();\n images.forEach((img, index) => {\n const hasGeniusShapes = !!img.geniusAIDataList?.length;\n if (!hasGeniusShapes) return;\n const { prePostSlicesIndexes } = getPrePostSliceItems(index, img.preSlices, img.postSlices);\n result = new Set([...result, ...prePostSlicesIndexes]);\n });\n return [...result];\n};\n\nexport const getPrimarySlices = images => {\n const result = new Set();\n images.forEach((img, index) => {\n const hasGeniusShapes = !!img.geniusAIDataList?.length;\n if (hasGeniusShapes || (hasGeniusShapes && (!!img.preSlices || !!img.postSlices))) {\n result.add(index);\n }\n });\n return [...result];\n};\n\nexport const getImagesSortedSlices = images => {\n const all = [];\n images.forEach((img, index) => {\n const hasGeniusShapes = !!img.geniusAIDataList?.length;\n if (!hasGeniusShapes) return;\n const { prePostSlicesIndexes } = getPrePostSliceItems(index - 1, img.preSlices, img.postSlices);\n all.push([...new Set([index, ...prePostSlicesIndexes])]);\n });\n return all;\n};\n\nconst PrePostSlices = ({ onSaveSlice, activeImage, imagesCount, playing }) => {\n const [activeTab, setActiveTab] = useState('preSlices');\n const [modalState, setModalState] = useState(false);\n const [imageData, setImageData] = useState();\n\n const onOpenModal = () => {\n setImageData({ index: activeImage.index, image: { ...activeImage } });\n setModalState(true);\n };\n\n const onSliceChange = ({ e }) => {\n const tempData = { ...imageData };\n imageData.image[activeTab] = e.target.value;\n setImageData(tempData);\n };\n\n const onChangeSliceNumber = increase => {\n const tempData = { ...imageData };\n imageData.image[activeTab] += increase ? 1 : -1;\n setImageData(tempData);\n };\n\n const onSaveHandle = () => {\n setModalState(false);\n onSaveSlice({ ...imageData });\n };\n\n const currentValue = imageData ? imageData.image[activeTab] : 0;\n\n const minuseButtonDisabled = currentValue === 0;\n const addButtonDisabled =\n (activeTab === 'postSlices' && imageData?.index + currentValue >= imagesCount) ||\n (activeTab === 'preSlices' && imageData?.index - currentValue <= 0);\n\n const getChosenSlices = () => {\n const { prePostSlicesIndexes } = getPrePostSliceItems(\n imageData.index,\n imageData.image.preSlices,\n imageData.image.postSlices,\n );\n const slices = [...prePostSlicesIndexes];\n return slices.join(',');\n };\n\n const hasGeniusShapes = !!activeImage?.geniusAIDataList?.length;\n\n return (\n \n {!playing && (\n \n )}\n {imageData && (\n \n \n )}\n
\n );\n};\n\nexport default PrePostSlices;\n","/* eslint-disable no-console */\nimport React, { useState, useEffect, useRef } from 'react';\nimport Slider from 'react-rangeslider';\nimport 'react-rangeslider/umd/rangeslider.min.css';\nimport { IconAiPlay, IconPlayFill, IconSliceNext, IconSlicePrev } from 'shared/components/Icons';\nimport Loading from 'shared/components/Loading';\nimport pause from 'assets/pause.svg';\nimport speedIcon from 'assets/speed.svg';\nimport { getImagesPrePostSlices, getImagesSortedSlices, getPrimarySlices } from './PrePostSlices';\n\nconst stackWords = {\n CC: { top: 'H', bottom: 'F' },\n MLO: { top: 'M', bottom: 'L' },\n};\n\nconst speeds = [\n { name: 'Low', value: 160 },\n { name: 'Medium', value: 80 },\n { name: 'High', value: 40 },\n];\n\nconst modes = [\n { name: 'Genius AI Mode', value: 'genius' },\n { name: 'Normal Mode', value: 'normal' },\n];\n\nconst StackControl = ({\n cornerstoneTools,\n element,\n cornerstone,\n imageType,\n setActiveTool,\n className,\n images,\n play,\n setPlay,\n isGenuine,\n}) => {\n const stackEl = useRef();\n const [speed, setSpeed] = useState(80);\n const [mode, setMode] = useState('normal');\n const [fetch, setFetch] = useState(false);\n const isAIMode = mode === 'genius';\n\n const playIndex = useRef({ index: 0, increase: true, images: undefined });\n const scale = useRef(0);\n const playInterval = useRef();\n\n const primarySlices = isAIMode ? getPrimarySlices(images) : [];\n const allPrePostSlices = isAIMode ? getImagesPrePostSlices(images) : [];\n const allSortedSlices = isAIMode ? getImagesSortedSlices(images) : [];\n const hasNextSlice = primarySlices.indexOf(playIndex.current.index) < primarySlices.length - 1;\n const hasPrevSlice = primarySlices.indexOf(playIndex.current.index) !== 0;\n\n const getStackData = () => {\n const stackData = cornerstoneTools.getToolState(element, 'stack');\n const { currentImageIdIndex, imageIds } = stackData.data[0];\n return { currentImageIdIndex, imageIds };\n };\n\n const { imageIds } = getStackData();\n\n const changeHandle = index => {\n if (fetch || play) return;\n if (!playIndex.current.images) {\n loadAllImages();\n return;\n }\n playIndex.current.index = index;\n scale.current = index;\n changeStackImage(playIndex.current.images, index);\n };\n\n const changeStackImage = (images, index) => {\n if (images[index] !== undefined) {\n const viewport = cornerstone.getViewport(element);\n const stackData = cornerstoneTools.getToolState(element, 'stack');\n stackData.data[0].currentImageIdIndex = Number(index);\n cornerstone.displayImage(element, images[index], viewport);\n }\n };\n\n const playStack = images => {\n try {\n let { index, increase } = playIndex.current;\n index += increase ? 1 : -1;\n if (!imageIds[index]) {\n increase = !increase;\n index += increase ? 2 : -2;\n }\n changeStackImage(images, index);\n playIndex.current.index = index;\n playIndex.current.increase = increase;\n } catch (err) {\n console.log(err);\n }\n };\n\n const playStackSlices = images => {\n try {\n let { index, increase } = playIndex.current;\n const activeSlice = allSortedSlices.findIndex(i => i.includes(index));\n const nearPrimary = activeSlice !== -1 ? allSortedSlices[activeSlice] : allSortedSlices[0];\n const sliceImages = [...(nearPrimary || [])].sort((a, b) => a - b);\n const currentIndex = sliceImages.indexOf(index);\n index = sliceImages[currentIndex === -1 ? 0 : currentIndex + (increase ? 1 : -1)];\n if (!imageIds[index]) {\n increase = !increase;\n index = sliceImages[currentIndex === -1 ? 0 : currentIndex + (increase ? 1 : -1)];\n }\n changeStackImage(images, index);\n playIndex.current.index = index;\n playIndex.current.increase = increase;\n } catch (err) {\n console.log(err);\n }\n };\n\n const setPlayInterval = (speed, changedToAIMode) => {\n if (changedToAIMode || isAIMode) {\n playInterval.current = setInterval(playStackSlices, speed, playIndex.current.images);\n } else {\n playInterval.current = setInterval(playStack, speed, playIndex.current.images);\n }\n };\n\n const loadAllImages = async play => {\n setFetch(true);\n if (!playIndex.current.images) {\n const { imageIds } = getStackData();\n const imageLoads = imageIds.map(async item => await cornerstone.loadAndCacheImage(item));\n const images = await Promise.all(imageLoads);\n playIndex.current.images = images;\n }\n setFetch(false);\n if (play) setPlayInterval(speed);\n };\n\n const onElementScroll = e => {\n e.preventDefault();\n\n if (!playIndex.current.images) {\n if (fetch || play) return;\n loadAllImages();\n return;\n }\n\n const { imageIds } = getStackData();\n scale.current += e.deltaY * -0.01;\n scale.current = Math.min(Math.max(0, scale.current), imageIds.length);\n\n if (playIndex.current.index !== Math.floor(scale.current)) {\n changeHandle(Math.floor(scale.current));\n }\n };\n\n const onChangeStart = () => {\n setActiveTool({ type: 'remove' });\n };\n\n const handleUserKeyPress = event => {\n const { keyCode } = event;\n if (keyCode === 32)\n setPlay(p => {\n return !p;\n });\n };\n\n const stopPlayerUnmount = () => {\n window.removeEventListener('keydown', handleUserKeyPress);\n setPlay(false);\n clearInterval(playInterval.current);\n playIndex.current = { index: 0, increase: true, images: undefined };\n };\n\n const onSpeedChange = async value => {\n setSpeed(value);\n if (play) {\n clearInterval(playInterval.current);\n setPlayInterval(value);\n }\n };\n\n const onPlayerModeChanges = value => {\n setMode(value);\n if (play) {\n clearInterval(playInterval.current);\n setPlayInterval(speed, value === 'genius');\n }\n };\n\n const renderLines = length => {\n const lines = [];\n for (let index = length - 1; index >= 0; index--) {\n const hasGenuie = images[index]?.geniusAIDataList?.length > 0;\n const hasPrimarySlice =\n hasGenuie || (hasGenuie && (!!images[index]?.postSlices || images[index].preSlices));\n const hasPrePostSlice = !hasPrimarySlice && allPrePostSlices.includes(index);\n lines.push(\n \n
\n \n
\n \n
\n \n Add Pre/Post Slices
\n\n Please, indicate how many pre-slices you want to mark for{' '}\n Slice {imageData.index + 1}.\n
\n\n
\n \n setActiveTab('preSlices')}\n className={`btn slice-tab ${activeTab === 'preSlices' ? 'active' : ''}`}\n >\n Pre Slice\n \n setActiveTab('postSlices')}\n className={`btn slice-tab ml-3 ${activeTab === 'postSlices' ? 'active' : ''}`}\n >\n Post Slice\n \n
\n \n onChangeSliceNumber(false)}\n className='btn btn-slice-change'\n >\n -\n \n onChangeSliceNumber(true)}\n className='btn btn-slice-change'\n >\n +\n \n
\n \n
\n \n Chosen Slices: {getChosenSlices()}\n
\n\n \n
\n \n {renderLines(imageIds.length)}\n
\n \n 
\n
\n \n {speeds.map(item => (\n onSpeedChange(item.value)}\n >\n {item.name}\n \n ))}\n
\n \n {\n setPlay(p => !p);\n e.preventDefault();\n e.stopPropagation();\n }}\n >\n {fetch ? (\n 
\n ) : (\n
\n \n {modes.map(item => (\n onPlayerModeChanges(item.value)}\n >\n {item.name}\n \n ))}\n
\n )}\n {stackWords[imageType].top}
\n {stackWords[imageType].bottom}
\n \n {Number(getStackData().currentImageIdIndex) + 1}/{imageIds.length}\n
\n {isAIMode && (\n \n \n \n
\n )}\n Buffering in Process
\n \n {play && isAIMode && (\n \n
\n )}\n \n );\n};\n\nexport default StackControl;\n","/**\n * Triggers a CustomEvent.\n * @public\n * @method triggerEvent\n *\n * @param {EventTarget} el The element or EventTarget to trigger the event upon.\n * @param {String} type The event type name.\n * @param {Object|null} [detail=null] The event data to be sent.\n * @returns {Boolean} The return value is false if at least one event listener called preventDefault(). Otherwise it returns true.\n */\nexport default function triggerEvent(el, type, detail = null) {\n let event;\n\n // This check is needed to polyfill CustomEvent on IE11-\n if (typeof window.CustomEvent === 'function') {\n event = new CustomEvent(type, {\n detail,\n cancelable: true,\n });\n } else {\n event = document.createEvent('CustomEvent');\n event.initCustomEvent(type, true, true, detail);\n }\n\n return el.dispatchEvent(event);\n}\n","/* eslint-disable consistent-return */\nimport * as cornerstone from 'cornerstone-core';\nimport uuidv4 from './../util/uuidv4.js';\nimport triggerEvent from './../util/triggerEvent.js';\n\n/**\n * Implements an imageId specific tool state management strategy. This means that\n * Measurements data is tied to a specific imageId and only visible for enabled elements\n * That are displaying that imageId.\n * @public\n * @constructor newImageIdSpecificToolStateManager\n * @memberof StateManagement\n *\n * @returns {Object} An imageIdSpecificToolStateManager instance.\n */\nfunction newImageIdSpecificToolStateManager() {\n let toolState = {};\n\n // Here we add tool state, this is done by tools as well\n // As modules that restore saved state\n\n function saveImageIdToolState(imageId) {\n return toolState[imageId];\n }\n\n function restoreImageIdToolState(imageId, imageIdToolState) {\n toolState[imageId] = imageIdToolState;\n }\n\n function saveToolState() {\n return toolState;\n }\n\n function restoreToolState(savedToolState) {\n toolState = savedToolState;\n }\n\n // Here we add tool state, this is done by tools as well\n // As modules that restore saved state\n function addElementToolState(element, toolType, data) {\n const enabledElement = cornerstone.getEnabledElement(element);\n\n // If we don't have an image for this element exit early\n if (!enabledElement.image) {\n return;\n }\n addImageIdToolState(enabledElement.image.imageId, toolType, data);\n }\n\n function addImageIdToolState(imageId, toolType, data) {\n // If we don't have any tool state for this imageId, add an empty object\n if (toolState.hasOwnProperty(imageId) === false) {\n toolState[imageId] = {};\n }\n\n const imageIdToolState = toolState[imageId];\n\n // If we don't have tool state for this type of tool, add an empty object\n if (imageIdToolState.hasOwnProperty(toolType) === false) {\n imageIdToolState[toolType] = {\n data: [],\n };\n }\n\n const toolData = imageIdToolState[toolType];\n\n // Finally, add this new tool to the state\n toolData.data.push(data);\n }\n\n function getElementToolState(element, toolType) {\n const enabledElement = cornerstone.getEnabledElement(element);\n\n // If the element does not have an image return undefined.\n if (!enabledElement.image) {\n return;\n }\n\n return getImageIdToolState(enabledElement.image.imageId, toolType);\n }\n\n // Here you can get state - used by tools as well as modules\n // That save state persistently\n function getImageIdToolState(imageId, toolType) {\n // If we don't have any tool state for this imageId, return undefined\n if (toolState.hasOwnProperty(imageId) === false) {\n return;\n }\n\n const imageIdToolState = toolState[imageId];\n\n // If we don't have tool state for this type of tool, return undefined\n if (imageIdToolState.hasOwnProperty(toolType) === false) {\n return;\n }\n\n return imageIdToolState[toolType];\n }\n\n // Clears all tool data from this toolStateManager.\n function clearElementToolState(element) {\n const enabledElement = cornerstone.getEnabledElement(element);\n\n if (!enabledElement.image) {\n return;\n }\n clearImageIdToolState(enabledElement.image.imageId);\n }\n\n function clearImageIdToolState(imageId) {\n if (toolState.hasOwnProperty(imageId) === false) {\n return;\n }\n\n delete toolState[imageId];\n }\n\n return {\n get: getElementToolState,\n add: addElementToolState,\n clear: clearElementToolState,\n getImageIdToolState,\n addImageIdToolState,\n clearImageIdToolState,\n saveImageIdToolState,\n restoreImageIdToolState,\n saveToolState,\n restoreToolState,\n toolState,\n };\n}\n\n// A global imageIdSpecificToolStateManager - the most common case is to share state between all\n// Visible enabled images\nconst globalImageIdSpecificToolStateManager = newImageIdSpecificToolStateManager();\n\n/**\n * Returns the toolstate for a specific element.\n * @public\n * @function getElementToolStateManager\n *\n * @param {HTMLElement} element The element.\n * @returns {Object} The toolState.\n */\nfunction getElementToolStateManager(element) {\n const enabledElement = cornerstone.getEnabledElement(element);\n // If the enabledElement has no toolStateManager, create a default one for it\n // NOTE: This makes state management element specific\n\n if (enabledElement.toolStateManager === undefined) {\n enabledElement.toolStateManager = globalImageIdSpecificToolStateManager;\n }\n\n return enabledElement.toolStateManager;\n}\n\n/**\n * Adds tool state to the toolStateManager, this is done by tools as well\n * as modules that restore saved state.\n * @public\n * @method addToolState\n *\n * @param {HTMLElement} element The element.\n * @param {string} toolType The toolType of the state.\n * @param {Object} measurementData The data to store in the state.\n * @returns {undefined}\n */\nfunction addToolState(element, toolType, measurementData) {\n const toolStateManager = getElementToolStateManager(element);\n\n measurementData.uuid = measurementData.uuid || uuidv4();\n toolStateManager.add(element, toolType, measurementData);\n\n const eventType = 'cornerstonetoolsmeasurementremoved';\n const eventData = {\n toolType,\n element,\n measurementData,\n };\n\n triggerEvent(element, eventType, eventData);\n}\n\n/**\n * Returns tool specific state of an element. Used by tools as well as modules\n * that save state persistently\n * @export\n * @public\n * @method\n * @name getToolState\n *\n * @param {HTMLElement} element The element.\n * @param {string} toolType The toolType of the state.\n * @returns {Object} The element's state for the given toolType.\n */\nfunction getToolState(element, toolType) {\n const toolStateManager = getElementToolStateManager(element);\n\n return toolStateManager.get(element, toolType);\n}\n\n/**\n * Removes specific tool state from the toolStateManager.\n * @public\n * @method removeToolState\n *\n * @param {HTMLElement} element The element.\n * @param {string} toolType The toolType of the state.\n * @param {Object} data The data to remove from the toolStateManager.\n * @returns {undefined}\n */\nfunction removeToolState(element, toolType, data) {\n const toolStateManager = getElementToolStateManager(element);\n const toolData = toolStateManager.get(element, toolType);\n\n if (!toolData || !toolData.data || !toolData.data.length) {\n return;\n }\n\n // Find this tool data\n let indexOfData = -1;\n\n for (let i = 0; i < toolData.data.length; i++) {\n if (toolData.data[i] === data) {\n indexOfData = i;\n }\n }\n\n if (indexOfData !== -1) {\n toolData.data.splice(indexOfData, 1);\n\n const eventType = 'cornerstonetoolsmeasurementremoved';\n const eventData = {\n toolType,\n element,\n measurementData: data,\n };\n\n triggerEvent(element, eventType, eventData);\n }\n}\n\nexport { getToolState, addToolState, removeToolState };\n","/* eslint-disable */\nexport default function uuidv4() {\n return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {\n let r = (Math.random() * 16) | 0,\n v = c == 'x' ? r : (r & 0x3) | 0x8;\n\n return v.toString(16);\n });\n}\n","let defaultColor = 'white';\nlet activeColor = 'greenyellow';\nlet fillColor = 'transparent';\n\nfunction setFillColor(color) {\n fillColor = color;\n}\n\nfunction getFillColor() {\n return fillColor;\n}\n\nfunction setToolColor(color) {\n defaultColor = color;\n}\n\nfunction getToolColor() {\n return defaultColor;\n}\n\nfunction setActiveColor(color) {\n activeColor = color;\n}\n\nfunction getActiveColor() {\n return activeColor;\n}\n\nfunction getColorIfActive(data) {\n if (data.color) {\n return data.color;\n }\n\n return data.active ? activeColor : defaultColor;\n}\n\nconst toolColors = {\n setFillColor,\n getFillColor,\n setToolColor,\n getToolColor,\n setActiveColor,\n getActiveColor,\n getColorIfActive,\n};\n\nexport default toolColors;\n","/* eslint-disable import/no-anonymous-default-export */\n/**\n * This function manages the {@link https://www.w3.org/TR/2dcontext/#the-canvas-state|save/restore}\n * pattern for working in a new context state stack. The parameter `fn` is passed the `context` and can\n * execute any API calls in a clean stack.\n * @public\n * @method draw\n * @memberof Drawing\n *\n * @param {CanvasRenderingContext2D} context - Target Canvas\n * @param {ContextFn} fn - A function which performs drawing operations within the given context.\n * @returns {undefined}\n */\nexport default function(context, fn) {\n context.save();\n fn(context);\n context.restore();\n}\n","let defaultWidth = 1;\nlet activeWidth = 2;\n\nfunction setToolWidth(width) {\n defaultWidth = width;\n}\n\nfunction getToolWidth() {\n return defaultWidth;\n}\n\nfunction setActiveWidth(width) {\n activeWidth = width;\n}\n\nfunction getActiveWidth() {\n return activeWidth;\n}\n\nconst toolStyle = {\n setToolWidth,\n getToolWidth,\n setActiveWidth,\n getActiveWidth,\n};\n\nexport default toolStyle;\n","/* eslint-disable import/no-anonymous-default-export */\nimport toolStyle from './../stateManagement/toolStyle.js';\n\n/**\n * This function manages the beginPath/stroke pattern for working with\n * {@link https://www.w3.org/TR/2dcontext/#drawing-paths-to-the-canvas|path objects}.\n *\n * @public\n * @function path\n * @memberof Drawing\n *\n * @param {CanvasRenderingContext2D} context - Context to add path to\n * @param {Object} [options={}] - Drawing Options\n * @param {StrokeStyle} [options.color] - The stroke style of the path.\n * @param {number} [options.lineWidth] - The width of lines in the path. If null, no line width is set.\n * If undefined then toolStyle.getToolWidth() is set.\n * @param {FillStyle} [options.fillStyle] - The style to fill the path with. If undefined then no filling is done.\n * @param {Number[]} [options.lineDash] - The {@link https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/setLineDash|dash pattern}\n * to use on the lines.\n * @param {boolean} [options.shouldDrawLines = true] Whether context.stroke should be evoked.\n * @param {ContextFn} fn - A drawing function to execute with the provided stroke pattern.\n * @returns {undefined}\n */\nexport default function(context, options = {}, fn) {\n const { color, lineWidth, fillStyle, lineDash, shouldDrawLines = true } = options;\n\n context.beginPath();\n context.strokeStyle = color || context.strokeStyle;\n\n context.lineWidth =\n lineWidth || (lineWidth === undefined && toolStyle.getToolWidth()) || context.lineWidth;\n if (lineDash) {\n context.setLineDash(lineDash);\n }\n\n fn(context);\n\n if (fillStyle) {\n context.fillStyle = fillStyle;\n context.fill();\n }\n\n if (shouldDrawLines) {\n context.stroke();\n }\n\n if (lineDash) {\n context.setLineDash([]);\n }\n}\n","import * as cornerstone from 'cornerstone-core';\nimport toolStyle from './../stateManagement/toolStyle.js';\nimport toolColors from './../stateManagement/toolColors.js';\nimport path from './path.js';\n\nconst drawArrow = (c, { x, y }) => {\n c.setTransform(1, 0, 0, 1, 10, 0);\n c.translate(x - 8, y + 4);\n c.arrow(30, 20, 0, 0, [0, 2, -10, 2, -10, 5]);\n};\n\nconst drawFlake = (c, { x, y }, percent) => {\n x -= 12;\n y -= 12;\n\n if (percent) {\n c.font = '16px Roboto';\n c.fillStyle = '#EDD500';\n c.fillText(`${percent}%`, x, y - 5);\n }\n\n c.setTransform(1.33333, 0, 0, 1.33333, x, y);\n c.setTransform(1, 0, 0, 1, x, y);\n c.setTransform(1, 0, 0, 1, x + 8.5, y + 8.475);\n c.setTransform(1, 0, 0, 1, x + 10.025, y);\n c.beginPath();\n c.moveTo(0, 0);\n c.lineTo(4, 0);\n c.lineTo(4, 24);\n c.lineTo(0, 24);\n c.closePath();\n c.fillStyle = '#EDD500';\n c.fill('nonzero');\n c.setTransform(1, 0, 0, 1, x + 8.5, y + 6.719);\n c.beginPath();\n c.moveTo(13.57, -2.5);\n c.lineTo(15.551, 1.108);\n c.lineTo(-6.519, 14.477);\n c.lineTo(-8.5, 10.869);\n c.lineTo(13.57, -2.5);\n c.closePath();\n c.fill('nonzero');\n c.beginPath();\n c.moveTo(-6.519, -2.5);\n c.lineTo(-8.5, 1.108);\n c.lineTo(13.57, 14.408);\n c.lineTo(15.551, 10.8);\n c.lineTo(-6.519, -2.5);\n c.closePath();\n c.fill('nonzero');\n};\n\nconst drawCross = (c, { x, y }, percent) => {\n x -= 12;\n y -= 12;\n\n if (percent) {\n c.font = '16px Roboto';\n c.fillStyle = '#EDD500';\n c.fillText(`${percent}%`, x, y - 5);\n }\n\n c.setTransform(1.33333, 0, 0, 1.33333, x, y);\n c.setTransform(1, 0, 0, 1, x, y);\n c.setTransform(1, 0, 0, 1, x + 5.9, y + 6);\n c.setTransform(1, 0, 0, 1, x + 8.159, y);\n c.beginPath();\n c.moveTo(0, 12);\n c.bezierCurveTo(0, 5.37258, 1.71967, 0, 3.841, 0);\n c.bezierCurveTo(5.96233, 0, 7.682, 5.37258, 7.682, 12);\n c.bezierCurveTo(7.682, 18.62742, 5.96233, 24, 3.841, 24);\n c.bezierCurveTo(1.71967, 24, 0, 18.62742, 0, 12);\n c.fillStyle = '#EDD500';\n c.fill('nonzero');\n c.setTransform(1, 0, 0, 1, x + 5.9, y + 2.427);\n c.beginPath();\n c.moveTo(18.1, 10.141);\n c.bezierCurveTo(14.52911, 12.50002, 10.37702, 13.82904, 6.1, 13.982);\n c.bezierCurveTo(1.82298, 13.82904, -2.3291, 12.50002, -5.9, 10.141);\n c.bezierCurveTo(-2.32911, 7.78198, 1.82299, 6.45296, 6.1, 6.3);\n c.bezierCurveTo(10.37702, 6.45296, 14.5291, 7.78198, 18.1, 10.141);\n // c.closePath();\n c.fill('nonzero');\n};\n\nconst drawTriangle = (c, { x, y }, percent) => {\n if (percent) {\n c.font = '16px Roboto';\n c.fillStyle = '#EDD500';\n c.fillText(`${percent}%`, x - 10, y - 20);\n }\n\n const side = 26;\n const h = side * (Math.sqrt(3) / 2);\n\n c.fillStyle = '#EDD500';\n\n // c.save();\n c.translate(x, y);\n\n // c.beginPath();\n\n c.moveTo(0, -h / 2);\n c.lineTo(-side / 2, h / 2);\n c.lineTo(side / 2, h / 2);\n c.lineTo(0, -h / 2);\n c.stroke();\n c.fill();\n};\n\nconst shapeMaps = {\n arrow: drawArrow,\n 3: drawFlake,\n 1: drawCross,\n 2: drawTriangle,\n};\n\nconst drawHandles = (context, evtDetail, handles, options = {}) => {\n const element = evtDetail.element;\n const defaultColor = toolColors.getToolColor();\n\n context.strokeStyle = options.color || defaultColor;\n\n const handleKeys = Object.keys(handles);\n\n for (let i = 0; i < handleKeys.length; i++) {\n const handleKey = handleKeys[i];\n const handle = handles[handleKey];\n\n if (handle.drawnIndependently === true) {\n continue;\n }\n\n if (options.drawHandlesIfActive === true && !handle.active) {\n continue;\n }\n\n const lineWidth = handle.active ? toolStyle.getActiveWidth() : toolStyle.getToolWidth();\n const fillStyle = options.fill;\n const shape = handle.shape || 'arrow';\n\n path(\n context,\n {\n lineWidth,\n fillStyle,\n },\n context => {\n const handleCanvasCoords = cornerstone.pixelToCanvas(element, handle);\n shapeMaps[shape](context, handleCanvasCoords, handle.percentage);\n },\n );\n }\n};\n\nexport default drawHandles;\n","/* eslint-disable import/no-anonymous-default-export */\n/**\n * Create a new {@link CanvasRenderingContext2D|context} object for the given {@link HTMLCanvasElement|canvas}\n * and set the transform to the {@link https://www.w3.org/TR/2dcontext/#transformations|identity transform}.\n *\n * @public\n * @function getNewContext\n * @memberof Drawing\n *\n * @param {HTMLCanvasElement} canvas - Canvas you would like the context for\n * @returns {CanvasRenderingContext2D} - The provided canvas's 2d context\n */\nexport default function(canvas) {\n const context = canvas.getContext('2d');\n\n context.setTransform(1, 0, 0, 1, 0, 0);\n\n return context;\n}\n","import toolColors from './../stateManagement/toolColors.js';\n\nconst configuration = {\n iconSize: 16,\n viewBox: {\n x: 16,\n y: 16,\n },\n mousePoint: {\n x: 8,\n y: 8,\n },\n mousePointerGroupString: `\n \n \n {showGenuie && (\n
\n )}\n {viewportState && \n {genuieShapes.map((item, i) => {\n const Icon = item.icon;\n const shapesCount = sumShapes(dicomData.images, item.shape);\n return (\n \n );\n })}\n
\n )}\n \n
\n )}\n {step.has_switcher && (\n \n \n \n 0{dicomData.patient.age}Y {dicomData.imageLaterality} {dicomData.viewPosition}\n \n
\n \n
\n )}\n {/* {viewportState && (\n \n {switchers.map(item => (\n setStackControl(item.value)}\n className={stackControl === item.value ? 'active' : ''}\n >\n {item.name}\n \n ))}\n
\n \n No Image Available\n
\n )}\n \n );\n};\n\nexport default CanvasView;\n","import React, { useEffect, useState, useRef, Fragment } from 'react';\nimport Loading from 'shared/components/Loading';\nimport { getError } from 'utils/appHelpers';\nimport { Api } from 'utils/connectors';\nimport { useSnackbar } from 'notistack';\n\nconst Input = ({ forId, type, name, label, value, onChange, className, checked, disabled }) => {\n const inputRef = useRef();\n const active = inputRef.current && inputRef.current.checked;\n\n return (\n \n This step is not required for this case\n
\n );\n }\n\n if (isDisabled) {\n return (\n \n You must first review all steps of the hanging protocol as indicated below\n
\n );\n }\n\n if (!initialForm) return \n
\n \n );\n};\n\nexport default QuestionaryModal;\n","import React from 'react';\n\nconst InformationPart = ({ data, caseId, activeStep }) => {\n const stepComment = data.answers[activeStep] && data.answers[activeStep].title;\n return (\n \n
\n Score the most suspicious finding
\n\n \n Submit Assessment\n \n
\n \n \n
\n );\n};\n\nexport default InformationPart;\n","import step2Icon from 'assets/stepsnew/2n.svg';\nimport step2IconActive from 'assets/stepsnew/2s.svg';\nimport step2IconPassed from 'assets/stepsnew/2p.svg';\nimport step2IconPActive from 'assets/stepsnew/2ps.svg';\n\nimport step3Icon from 'assets/stepsnew/3n.svg';\nimport step3IconActive from 'assets/stepsnew/3s.svg';\nimport step3IconPassed from 'assets/stepsnew/3p.svg';\nimport step3IconPActive from 'assets/stepsnew/3ps.svg';\n\nimport step4Icon from 'assets/stepsnew/4n.svg';\nimport step4IconActive from 'assets/stepsnew/4s.svg';\nimport step4IconPassed from 'assets/stepsnew/4p.svg';\nimport step4IconPActive from 'assets/stepsnew/4ps.svg';\n\nimport tool4Icon from 'assets/tools/4p.svg';\nimport tool4IconActive from 'assets/tools/4a.svg';\nimport tool5Icon from 'assets/tools/5p.svg';\nimport tool5IconActive from 'assets/tools/5a.svg';\nimport tool6Icon from 'assets/tools/6p.svg';\nimport tool6IconActive from 'assets/tools/6a.svg';\nimport tool7Icon from 'assets/tools/7p.svg';\nimport tool7IconActive from 'assets/tools/7a.svg';\nimport tool8Icon from 'assets/tools/8p.svg';\nimport tool8IconActive from 'assets/tools/8a.svg';\nimport tool9Icon from 'assets/tools/9p.svg';\nimport tool9IconActive from 'assets/tools/9a.svg';\n\nconst dicomTypes = {\n '3dq': '3DQ',\n i2d: '2D',\n g2d: '2D',\n r2d: '2D',\n tomo: 'tomo',\n sub: 'tomo',\n};\n\nexport const stepsProperties = {\n RCC: {\n active: true,\n position: 'right',\n thumbpos: 'left',\n has_switcher: false,\n dataType: '2D',\n key: 'RCC',\n },\n LCC: {\n active: true,\n position: 'left',\n thumbpos: 'right',\n has_switcher: false,\n dataType: '2D',\n key: 'LCC',\n },\n RMLO: {\n active: true,\n key: 'RMLO',\n position: 'right',\n thumbpos: 'left',\n has_switcher: false,\n dataType: '2D',\n },\n LMLO: {\n active: true,\n key: 'LMLO',\n position: 'left',\n thumbpos: 'right',\n has_switcher: false,\n dataType: '2D',\n },\n};\n\nexport const answerSteps = [\n {\n id: 1,\n name: '2D CC Views',\n icon: step2Icon,\n iconActive: step2IconActive,\n iconPassed: step2IconPassed,\n iconPassedActive: step2IconPActive,\n },\n {\n id: 2,\n name: '2D MLO Views',\n icon: step3Icon,\n iconActive: step3IconActive,\n iconPassed: step3IconPassed,\n iconPassedActive: step3IconPActive,\n },\n {\n id: 3,\n name: '2D/3D RCC Views',\n icon: step4Icon,\n iconActive: step4IconActive,\n iconPassed: step4IconPassed,\n iconPassedActive: step4IconPActive,\n },\n];\n\nexport const answerTools = [\n {\n name: 'R',\n title: 'Reset Viewers',\n icon: tool4Icon,\n iconActive: tool4IconActive,\n type: 'reset',\n cursor: 'default',\n onTimeAction: true,\n },\n {\n name: 'P',\n title: 'Activate Panning Tool',\n icon: tool5Icon,\n iconActive: tool5IconActive,\n type: 'pan',\n cursor: 'pan',\n onTimeAction: false,\n },\n {\n name: 'I Z',\n title: 'Activate Interactive Zoom',\n icon: tool6Icon,\n iconActive: tool6IconActive,\n type: 'zoomInteractive',\n cursor: 'izoom',\n onTimeAction: false,\n },\n {\n name: 'Z 1:1',\n title: 'Activate 1:1 Tool',\n icon: tool7Icon,\n iconActive: tool7IconActive,\n type: 'zoom1_1',\n cursor: 'fullzoom',\n onTimeAction: false,\n },\n {\n name: 'M',\n title: 'Activate Magnifier Tool',\n icon: tool8Icon,\n iconActive: tool8IconActive,\n type: 'zoomMagnifier',\n cursor: 'mzoom',\n onTimeAction: false,\n },\n {\n name: 'W/L',\n title:\n 'Activate Window/Level Tool (W; for presets move mouse over viewer and press numeric keys 1, 2, 3, ...)',\n icon: tool9Icon,\n iconActive: tool9IconActive,\n type: 'windowLevel',\n cursor: 'wlevel',\n onTimeAction: false,\n },\n];\n\nexport const getToolByType = type => {\n return answerTools.find(item => item.type === type);\n};\n\nexport const mergeSteps = (views, backSteps) => {\n if (!backSteps || !backSteps.length) return [];\n return answerSteps.map((item, index) => {\n const step = backSteps[index];\n item.stepType = step.stepType;\n if (step.stepType === 'case') {\n const left = step.caseLeftFrame;\n const right = step.caseRightFrame;\n const leftDicom = Object.values(views).find(d => d.images.find(i => i.id === left.imageId));\n const rightDicom = Object.values(views).find(d => d.images.find(i => i.id === right.imageId));\n item.views = {};\n if (leftDicom) {\n const { imageLaterality, viewPosition, images, dicomImageType } = leftDicom;\n const imageIndex = images.findIndex(i => i.id === left.imageId);\n const dataType = dicomTypes[dicomImageType];\n const name = `${imageLaterality}${viewPosition}`;\n item.views[`${dataType}_${name}`] = {\n ...stepsProperties[name],\n imageIndex,\n dataType: dataType,\n };\n }\n if (rightDicom) {\n const { imageLaterality, viewPosition, images, dicomImageType } = rightDicom;\n const imageIndex = images.findIndex(i => i.id === right.imageId);\n const dataType = dicomTypes[dicomImageType];\n const name = `${imageLaterality}${viewPosition}`;\n item.views[`${dataType}_${name}`] = {\n ...stepsProperties[name],\n imageIndex,\n dataType: dataType,\n };\n }\n } else {\n item.views = {\n image: step.imageUrl,\n };\n }\n return item;\n });\n};\n","export default __webpack_public_path__ + \"static/media/step1.1b4f2141.png\";","export default __webpack_public_path__ + \"static/media/step2.2422a523.png\";","export default __webpack_public_path__ + \"static/media/step3.03921edc.png\";","/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React, { useEffect, useState } from 'react';\nimport { getDefaultType } from '../../../configs';\nimport CanvasView from '../../CanvasView';\nimport ControlArea from '../../ControlArea';\nimport { answerTools } from '../configs';\nimport step1Icon from 'assets/answers/step1.png';\nimport step2Icon from 'assets/answers/step2.png';\nimport step3Icon from 'assets/answers/step3.png';\n\nconst mock = [step1Icon, step2Icon, step3Icon];\n\nconst AnswerViewer = ({ data, mergedSteps, activeStep, setActiveStep }) => {\n const [activeTool, setActiveTool] = useState({});\n const [fullScreen, setFullScreen] = useState(!!document.fullscreenElement);\n\n const fullScreenChange = () => {\n document.addEventListener('fullscreenchange', e => {\n setFullScreen(!!document.fullscreenElement);\n });\n };\n\n useEffect(() => {\n fullScreenChange();\n //eslint-disable-next-line\n }, []);\n\n if (!mergedSteps || !mergedSteps[activeStep]) {\n return (\n \n
\n CASE #{caseId}:
\n {data.sections && data.sections.length ? (\n\n {data &&\n data.sections &&\n data.sections.map((item, i) => {\n return (\n
\n ) : (\n \n
\n );\n })}\n \n {item.title}\n
\n- \n {item.items &&\n item.items.map((row, i) => {\n return
- {row.text} ;\n })}\n
\n No information provided for this case\n
\n )}\n \n {stepComment && (\n
\n \n {stepComment}\n
\n )}\n \n No answers frame provided for this case\n
\n );\n }\n\n const activeStepData = mergedSteps[activeStep];\n\n const activeStepIsImage = activeStepData && activeStepData.stepType === 'image';\n const stepViews = mergedSteps[activeStep].views;\n const stepViewsData = Object.keys(stepViews);\n const viewsCount = Object.values(stepViews).length;\n\n const viewSizesForced = () => {\n return {\n width: (window.innerWidth - (fullScreen ? 548 : 240 + 530)) / viewsCount,\n height: window.innerHeight - 370,\n };\n };\n\n const getImage = index => {\n try {\n const step = mergedSteps[index];\n const { key, dataType, imageIndex = 0 } = step.views[Object.keys(step.views)[0]];\n const dicomTypeData = {\n tomo: data[`${key}_TOMO`],\n '2D': data[`${key}_2D`],\n '3DQ': data[`${key}_3DQ`],\n };\n\n const control = getDefaultType(dataType, dicomTypeData);\n const dicomData = dicomTypeData[control];\n return step.stepType === 'image' ? step.views.image : dicomData.images[imageIndex].url;\n } catch (err) {\n return mock[index];\n }\n };\n\n return (\n \n
\n \n \n );\n};\n\nexport default AnswerViewer;\n","import React from 'react';\n\nconst DisabledPart = () => {\n return (\n \n setActiveTool(tool)}\n tools={answerTools}\n disabled={activeStepIsImage}\n />\n setActiveTool(tool)}\n fullScreen={fullScreen}\n viewsCount={viewsCount}\n viewSizesForced={viewSizesForced}\n currentImageIndex={item.imageIndex}\n />\n );\n })}\n
\n \n {stepViewsData.map((key, index) => {\n const item = stepViews[key];\n if (activeStepIsImage) {\n return (\n \n 
;\n
\n );\n }\n return (\n \n
\n \n {[0, 1, 2].map(index => {\n return (\n setActiveStep(index)}\n className={`pointer flex-fill ${activeStep === index ? 'active' : ''}`}\n >\n })
\n
\n );\n })}\n \n You must first review all steps of the hanging protocol as indicated below\n
\n );\n};\n\nexport default DisabledPart;\n","import React, { useEffect, useState } from 'react';\nimport { useSnackbar } from 'notistack';\nimport InformationPart from './components/InformationPart';\nimport AnswerViewer from './components/AnswerViewer';\nimport DisabledPart from './components/DisabledPart';\nimport { getError } from 'utils/appHelpers';\nimport { Api } from 'utils/connectors';\nimport Loading from 'shared/components/Loading';\nimport { mergeSteps } from './configs';\n\nconst ExplanationModal = ({ isDisabled, updateStep, caseData, caseId, caseViews }) => {\n const { enqueueSnackbar } = useSnackbar();\n const [fetch, setFetch] = useState(false);\n const [data, setData] = useState();\n const [activeStep, setActiveStep] = useState(0);\n\n const sendUpdate = async () => {\n await updateStep(10);\n };\n\n const getAnswersData = async () => {\n try {\n setFetch(true);\n const { data } = await Api.get(`/cases/getanswers/${caseId}`);\n data.data.mergedSteps = mergeSteps(caseViews, data.data.answers);\n setData(data.data);\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n } finally {\n setFetch(false);\n }\n };\n\n useEffect(() => {\n if (!isDisabled) sendUpdate();\n getAnswersData();\n //eslint-disable-next-line\n }, []);\n\n if (isDisabled) return No Answers Provided for this lesson
\n );\n\n return (\n \n
\n );\n};\n\nexport default ExplanationModal;\n","const findPosition = oElement => {\n if (typeof oElement.offsetParent != 'undefined') {\n for (var posX = 0, posY = 0; oElement; oElement = oElement.offsetParent) {\n posX += oElement.offsetLeft;\n posY += oElement.offsetTop;\n }\n return [posX, posY];\n } else {\n return [oElement.x, oElement.y];\n }\n};\n\nexport const getCoordinates = (e, el) => {\n let PosX = 0;\n let PosY = 0;\n let ImgPos;\n ImgPos = findPosition(el);\n if (!e) e = window.event;\n if (e.pageX || e.pageY) {\n PosX = e.pageX;\n PosY = e.pageY;\n } else if (e.clientX || e.clientY) {\n PosX = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;\n PosY = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;\n }\n PosX -= ImgPos[0];\n PosY -= ImgPos[1];\n return { x: PosX, y: PosY };\n};\n","import React, { useEffect, useRef, useState } from 'react';\nimport { useSnackbar } from 'notistack';\nimport { getCoordinates } from './utils';\nimport { getError } from 'utils/appHelpers';\nimport Loading from 'shared/components/Loading';\nimport { Api } from 'utils/connectors';\n\nconst getCirclePostions = (pos, imgEl) => {\n if (!pos || !imgEl || !imgEl.current) return {};\n const { naturalWidth, naturalHeight, clientWidth, clientHeight } = imgEl.current;\n const widthScale = pos.x / naturalWidth;\n const heightScale = pos.y / naturalHeight;\n const res = {\n left: widthScale * clientWidth,\n top: heightScale * clientHeight,\n };\n return res;\n};\n\nconst HeatmapModal = ({ caseId, lesson, caseViews, updateStep, isDisabled, isOpened }) => {\n const { enqueueSnackbar } = useSnackbar();\n const [positions, setPositions] = useState();\n const [fetch, setFetching] = useState();\n const [dicom, setDicom] = useState();\n const imgEl = useRef();\n\n const selectText = positions\n ? 'Thank you, your selection is submitted.'\n : 'Please select by one mouse click a most probable calcification you may notice.';\n\n const onMouseDownOnImage = async e => {\n if (positions) return;\n try {\n const cords = getCoordinates(e, imgEl.current);\n const { naturalWidth, naturalHeight, clientWidth, clientHeight } = imgEl.current;\n const widthScale = cords.x / clientWidth;\n const heightScale = cords.y / clientHeight;\n const pos = {\n x: widthScale * naturalWidth,\n y: heightScale * naturalHeight,\n };\n setPositions(pos);\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n const getHeatMapImage = async () => {\n try {\n setFetching(true);\n if (lesson.caseHeatmaps) {\n const heatmap = lesson.caseHeatmaps[caseId];\n const dicom = Object.values(caseViews).find(i => i.id === heatmap.dicomId);\n if (!dicom) return;\n const image = dicom.images.find(i => i.id === heatmap.imageId);\n dicom.url = image.url;\n if (!isOpened) await updateStep(11);\n setDicom(dicom);\n } else {\n const { data } = await Api.get(`/cases/getheatmaps/${lesson.id}/${caseId}`);\n const dicom = data.data && data.data[0];\n setDicom(dicom);\n }\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n } finally {\n setFetching(false);\n }\n };\n\n useEffect(() => {\n getHeatMapImage();\n //eslint-disable-next-line\n }, []);\n\n if (isDisabled)\n return (\n \n
\n \n
\n \n You must first review all steps of the hanging protocol as indicated below\n
\n );\n\n if (fetch) return \n This step is not required for this case\n
\n );\n }\n\n return (\n \n
\n );\n};\n\nexport default HeatmapModal;\n","import React, { useEffect, useState } from 'react';\nimport Loading from 'shared/components/Loading';\nimport { generateViewerData } from './utils';\nimport { getError } from 'utils/appHelpers';\nimport { Api } from 'utils/connectors';\nimport { useSnackbar } from 'notistack';\nimport { steps as initialSteps, tools } from './configs';\nimport { useHistory } from 'react-router';\nimport { useSelector } from 'react-redux';\n\nimport ControlArea from './components/ControlArea';\nimport StepsArea from './components/StepsArea';\nimport HelpModal from './components/HelpModal';\nimport CanvasView from './components/CanvasView';\nimport QuestionaryModal from './components/QuestionaryModal';\nimport ExplanationModal from './components/ExplanationModal';\nimport HeatmapModal from './components/HeatmapModal';\n\nconst TypeCasesPlay = ({ lesson, fullData }) => {\n const { enqueueSnackbar } = useSnackbar();\n const history = useHistory();\n const viewerOptions = useSelector(state => state.viewerOptions);\n const [fetch, setFetch] = useState();\n const [activeCase, setActiveCase] = useState(0);\n const [activeStep, setActiveStep] = useState(0);\n const [course, setCourse] = useState(fullData);\n\n const [activeTool, setActiveTool] = useState({});\n const [fullScreen, setFullScreen] = useState(false);\n const [openHelpModal, setOpenHelpModal] = useState(false);\n\n const lessonCases = lesson && (lesson.cases || lesson.activeCases);\n\n const fullScreenChange = () => {\n document.addEventListener('fullscreenchange', e => {\n setFullScreen(!!document.fullscreenElement);\n });\n };\n\n const handelActiveToolChange = tool => {\n setActiveTool(tool);\n };\n\n const stepChangeHandler = async step => {\n const isModal = step === 9 || step === 10 || step === 11;\n if (isModal) setActiveTool({});\n if (!completedSteps.includes(step) && !isModal) {\n completedSteps.push(step);\n }\n setActiveStep(step);\n };\n\n const getCases = async () => {\n try {\n if (!lessonCases || !lessonCases.length) return;\n const { caseId, caseUniqueId } = lessonCases[activeCase];\n const endpoint = `/cases/getcasebyid/${caseUniqueId || caseId}?lut=1&dicomType=all`;\n const { data } = await Api.get(endpoint);\n const cases = generateViewerData(data.data, lesson);\n setCourse({ title: lesson.title, lesson, cases });\n if (!cases[0].completed_steps.includes(0)) {\n cases[0].completed_steps.push(0);\n }\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n const onCaseChange = async value => {\n try {\n if (!course.cases[value]) {\n setFetch(true);\n const { caseId, caseUniqueId } = lessonCases[value];\n const endpoint = `/cases/getcasebyid/${caseUniqueId || caseId}?lut=1&dicomType=all`;\n const { data } = await Api.get(endpoint);\n const caseData = generateViewerData(data.data, lesson);\n const cases = [...course.cases, ...caseData];\n if (!cases[value].completed_steps.includes(0)) {\n cases[value].completed_steps.push(0);\n }\n setCourse({ ...course, cases });\n setActiveCase(value);\n setFetch(false);\n } else {\n setActiveCase(value);\n }\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n useEffect(() => {\n fullScreenChange();\n if (!course) getCases();\n //eslint-disable-next-line\n }, []);\n\n if (!course || fetch) return \n
\n Calcification Selection
\n\n
\n {selectText}
\n\n
\n \n \n {!isModal &&\n stepViewsData.map((item, index) => (\n {}}\n viewerOptions={viewerOptions}\n />\n ))}\n {isModal && (\n <>\n {steps[activeStep].name === 'question' && (\n {}}\n caseData={selectedCase}\n caseId={selectedCase.caseId}\n caseViews={caseViews}\n />\n )}\n {steps[activeStep].name === 'heatmap' && (\n {\n completedSteps.push(step);\n }}\n />\n )}\n \n )}\n
\n - \n {data.length > 0 &&\n data.map((item, index) => {\n const { name = '', surname, profession = '', imageUrl } = item.authorProfile;\n return (\n
- \n \n\n\n\n
\n
\n \n {name} {surname}\n \n {profession}\n
\n \n );\n })}\n {!data.length && - No results found... }\n
\n
\n );\n};\nexport default HeaderSection;\n","import React, { useEffect, useState } from 'react';\nimport InfoSection from './components/InfoSection';\nimport LessonsListSection from './components/LessonsListSection';\nimport TypeVideo from './components/TypeVIdeo';\nimport TypePDF from './components/TypePDF';\nimport TypeCases from './components/TypeCases';\nimport TypeImage from './components/TypeImage';\nimport TypeEvaluation from './components/TypeEvaluation';\nimport Loading from 'shared/components/Loading';\nimport TagsViewBlock from './components/TagsViewBlock';\nimport TypeCasesPlay from './components/TypeCasesPlay';\nimport EmptyView from './components/EmptyView';\nimport { IconSelectLesson } from 'shared/components/Icons';\nimport HeaderSection from './components/HeaderSection';\n\nconst viewsComponents = {\n 1: TypeVideo,\n 2: TypePDF,\n 3: TypeCases,\n 4: TypeImage,\n};\n\nconst CoursePreview = ({ course }) => {\n const [isViewer, setIsViewer] = useState();\n const [activeLesson, setActiveLesson] = useState();\n\n const onCasePlayClick = () => {\n setIsViewer(true);\n };\n\n useEffect(() => {\n if (course && course.courseLessons) {\n setActiveLesson(course.courseLessons.length && course.courseLessons[0].lesson);\n }\n }, [course]);\n\n if (!course) return \n
\n \n {hasBack &&
\n {!course?.isMarketingMaterial && (\n \n
\n )}\n \n
\n );\n }\n\n if (isViewer) {\n return (\n \n
\n Please add 1 lesson at least.
\n\n {\n setIsViewer(false);\n }}\n />\n
\n );\n }\n\n if (isFeedback) {\n return (\n \n {\n setActiveLesson(course.courseLessons.length && course.courseLessons[0].lesson);\n }}\n />\n
\n );\n }\n\n return (\n \n
\n );\n};\n\nexport default CoursePreview;\n","import React, { useEffect, useState } from 'react';\nimport { useHistory } from 'react-router';\nimport { connect, useSelector } from 'react-redux';\nimport moment from 'moment';\n\nimport { findCourseFirstLesson, getEndOfSubs, isMobileDevice } from 'utils/appHelpers';\nimport HeaderSection from './components/HeaderSection';\nimport InfoSection from './components/InfoSection';\nimport LessonsListSection from './components/LessonsListSection';\nimport TypeVideo from './components/TypeVIdeo';\nimport TypePDF from './components/TypePDF';\nimport TypeCases from './components/TypeCases';\nimport TypeImage from './components/TypeImage';\nimport TypeQuiz from './components/TypeQuiz';\nimport Loading from 'shared/components/Loading';\nimport CourseFeedback from '../CourseFeedback';\nimport ProgressBar from 'shared/components/ProgressBar';\nimport ExpiredView from './components/ExpiredView';\nimport TagsViewBlock from 'shared/components/TagsViewBlock';\nimport NoAccessCourse from 'shared/components/NoAccessCourse';\n\nimport logo from 'assets/ace-logo-tsp.png';\nimport CourseHeader from '../CourseFeedback/FeedbackHeader';\nimport { getCourses } from '../Courses/actions';\nimport { Api } from 'utils/connectors';\nimport CoursePreview from 'app/PublicCourseView/CoursePreview';\n\nconst viewsComponents = {\n video: TypeVideo,\n pdf: TypePDF,\n cases: TypeCases,\n image: TypeImage,\n quiz: TypeQuiz,\n};\n\nconst CourseView = ({ match, location, getCourses }) => {\n const courses = useSelector(state => state.courses);\n const marketingCourses = useSelector(state => state.marketingCourses);\n const history = useHistory();\n const quizAccessBlocked = location.state?.quizAccessBlocked;\n const needGetCourses = location.state?.needGetCourses;\n const [lesson, setLesson] = useState();\n\n const { courseId, type, lessonId, action } = match.params;\n\n const courseIdOrSharedToken = courseId;\n const isCourseIdShareToken = isNaN(courseId);\n const course = [...courses, ...marketingCourses]?.find(item =>\n isCourseIdShareToken\n ? item.accessToken === courseIdOrSharedToken\n : item.id === Number(courseId),\n );\n\n const [sharedCourse, setSharedCourse] = useState(null);\n\n const onCasePlayClick = () => {};\n\n const getSharedCourseData = async () => {\n try {\n const { data } = await Api.get(`/courses/shared/course/${courseIdOrSharedToken}`);\n sessionStorage.setItem('courseSharedToken', courseIdOrSharedToken);\n setSharedCourse(data.data);\n } catch (err) {\n history.push('/no-web-access');\n }\n };\n\n useEffect(() => {\n if (course) {\n const activeLesson =\n course?.lessons?.find(lesson => lesson.id === Number(lessonId)) || course?.lessons?.[0];\n setLesson(activeLesson);\n if (!type || !lessonId) {\n if (activeLesson) {\n history.replace(`/courses/${courseId}/${activeLesson.type}/${activeLesson.id}`);\n }\n }\n }\n //eslint-disable-next-line\n }, [match.params]);\n\n useEffect(() => {\n if (isCourseIdShareToken) {\n getSharedCourseData();\n }\n }, [courseIdOrSharedToken]);\n\n useEffect(() => {\n if (needGetCourses) getCourses();\n }, [needGetCourses]);\n\n if (isCourseIdShareToken) return \n {!LessonView &&
\n \n
\n \n
\n \n
\n \n
\n );\n\n if (type === 'feedback') {\n return \n
\n );\n }\n\n if (\n ((!lesson || lesson.id !== Number(lessonId)) && !isCourseIdShareToken) ||\n (isCourseIdShareToken && !course)\n ) {\n return You need to complete all lessons to access quiz.
\n \n
\n );\n }\n\n return (\n \n
\n {!!course?.courseLessons?.[0]?.lesson && (\n \n
\n \n 
\n
\n \n
\n );\n};\n\nconst mapStateToProps = state => ({\n courses: state.courses,\n});\n\nconst mapDispatchToProps = {\n getCourses,\n};\n\nexport default connect(\n mapStateToProps,\n mapDispatchToProps,\n)(CourseView);\n","import React, { useState } from 'react';\nimport { connect } from 'react-redux';\nimport AuthorBox from 'shared/components/AuthorBox';\nimport { IconAuthorsNew } from 'shared/components/Icons';\n\nconst Authors = ({ authors }) => {\n const [active, setActive] = useState();\n\n const onSeeMoreClick = (index, e) => {\n e.preventDefault();\n setActive(active === index ? '' : index);\n };\n\n return (\n <>\n \n
\n \n
\n \n
\n \n
\n \n {!isOpened && (\n
\n \n
\n )}\n {getEndOfSubs(course.expire, course.expirable)}
\n\n
\n \n \n
\n \n
\n \n );\n};\n\nconst mapStateToProps = ({ authors }) => ({\n authors,\n});\n\nexport default connect(\n mapStateToProps,\n {},\n)(Authors);\n","import SideBar from 'app/Main/components/SideBar';\nimport React from 'react';\n\nconst PublicWrapper = ({ children, hasNotNav }) => {\n return (\n \n {authors &&\n authors.map((item, index) => (\n
\n \n
\n );\n};\n\nexport default PublicWrapper;\n","/* eslint-disable jsx-a11y/no-noninteractive-element-to-interactive-role */\nimport React from 'react';\nimport { IconAbout } from 'shared/components/Icons';\nimport { confirmAlert } from 'react-confirm-alert';\nimport CopyRightInfo from 'shared/components/CopyRightInfo';\nimport PublicWrapper from 'shared/components/layouts/PublicWrapper';\nimport { useSelector } from 'react-redux';\n\nconst specialities = [\n {\n id: 1,\n name: 'GYN SURGICAL',\n desc:\n 'Minimally invasive GYN treatment options for women who suffer from abnormal uterine bleeding.',\n img: 'https://hologiced.com/wp-content/uploads/2018/06/uterus-1-1.png',\n link: 'https://hologiced.com/gyn-surgical/',\n },\n {\n id: 2,\n name: 'DIAGNOSTIC',\n desc:\n 'Innovative technology for cervical cancer screening, testing for STIs and vulvovaginal infections, and preterm labor assessment.',\n img: 'https://hologiced.com/wp-content/uploads/2018/06/diagnostic-icon.svg',\n link: 'https://hologiced.com/diagnostic/',\n },\n {\n id: 3,\n name: 'BREAST',\n desc:\n 'Life-saving solutions accelerated by cutting edge science for early detection, more certain diagnosis and accurate, compassionate treatment',\n img: 'https://hologiced.com/wp-content/uploads/2018/06/breast-icon.svg',\n link: 'https://hologiced.com/breast-health/',\n },\n {\n id: 4,\n name: 'SKELETAL',\n desc:\n 'Clinical images that enable doctors to make more informed diagnoses and treatment decisions in time to have a positive impact on patient’s health.',\n img: 'https://hologiced.com/wp-content/uploads/2018/06/skeletal-icon.svg',\n link: 'https://hologiced.com/skeletal-health/',\n },\n];\n\nconst About = () => {\n const isAuth = useSelector(state => state.isAuthenticated);\n\n const goWithLink = (url, e) => {\n e.preventDefault();\n if (!url) return;\n confirmAlert({\n message:\n 'A new browser tab will now be opened. You can close it at any time and come back to this tab to continue.',\n buttons: [\n {\n label: 'Continue',\n onClick: () => window.open(url, '_blank'),\n },\n {\n label: 'Close',\n },\n ],\n });\n };\n\n const Wrapper = isAuth ? React.Fragment : PublicWrapper;\n\n return (\n \n {!hasNotNav && (\n \n )}\n \n {children}\n \n
\n \n
\n \n \n
\n \n
\n \n \n
\n \n The mission of Hologic Medical Education is to improve patient care through excellence\n in education, communication of clinical and scientific evidence, and partnerships with\n the healthcare community.\n
\n\n AREAS OF SPECIALTY\n
\n\n {specialities.map(item => (\n \n {item.name}\n \n
\n ))}\n \n \n 
\n
\n {item.desc}
\n\n
\n );\n};\n\nexport default Contacts;\n","import React, { useState, useEffect, useCallback } from 'react';\nimport BackButton from 'shared/BackButton';\nimport { useSnackbar } from 'notistack';\nimport { getError } from 'utils/appHelpers';\nimport { Api } from 'utils/connectors';\nimport { IconSearch } from 'shared/components/Icons';\nimport ReactPaginate from 'react-paginate';\nimport moment from 'moment';\n\nconst limit = 8;\n\nconst Messages = ({ history }) => {\n const { enqueueSnackbar } = useSnackbar();\n const [fetch, setFetch] = useState(false);\n const [data, setData] = useState(null);\n const [page, setPage] = useState(0);\n const [pageCount, setPageCount] = useState(0);\n\n const getMessages = useCallback(async () => {\n try {\n setFetch(true);\n const params = { page: page + 1, limit };\n const { data } = await Api.get('/common/getusercontacts', { params });\n setData(data.data.results);\n setPageCount(Math.ceil(data.data.count / limit));\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n setPageCount(0);\n } finally {\n setFetch(false);\n }\n }, [enqueueSnackbar, page]);\n\n const onPageChange = ({ selected }) => {\n setPage(selected);\n };\n\n useEffect(() => {\n getMessages();\n }, [page, getMessages]);\n\n return (\n \n
\n \n \n
\n \n
\n \n \n
\n \n {/*
\n \n
*/}\n \n Didn't find a solution to your problem?
\n For US customers please contact through the support form or direct email at{' '}\n \n Selenia.Support@hologic.com\n \n .
\n
\n For Australia or New Zealand customers please contact through the support form
{' '}\n or direct email at{' '}\n \n ANZonlinevirtualtomo@hologic.com\n \n .
\n
© 2013-2020 Hologic, Inc.
\n\n
\n );\n};\n\nexport default Messages;\n","import React, { useEffect, useState } from 'react';\nimport { IconEducation } from 'shared/components/Icons';\nimport { Api } from 'utils/connectors';\nimport Loading from 'shared/components/Loading';\n\nconst PrivacyAndPolicy = () => {\n const [html, setHtml] = useState();\n\n const getPrivacyData = async () => {\n const { data } = await Api.get('/common/privacy');\n setHtml(data);\n };\n\n useEffect(() => {\n getPrivacyData();\n }, []);\n\n if (!html) return \n
\n \n
\n \n \n \n
\n {pageCount > 1 && (\n
\n | \n Date \n | \n \n Ticket Number \n | \n \n Name \n | \n \n Reply-To \n | \n \n Category \n | \n \n Description \n | \n |
|---|---|---|---|---|---|---|
| \n \n {item.createdAt ? moment(item.createdAt).format('MM/DD/YYYY') : ''}\n \n | \n \n {item.ticketSeq || '-'} \n | \n \n {item.name || 'Unknown'} \n | \n \n {item.email || '-'} \n | \n \n {item.category || '-'} \n | \n \n {item.text} \n | \n |
| \n \n \n | \n ||||||
\n
\n \n \n
\n \n
\n \n );\n};\n\nexport default PrivacyAndPolicy;\n","import React from 'react';\n\nimport iconMagnifier from 'assets/tools/8p.svg';\nimport iconToggle from 'assets/tools/7p.svg';\nimport iconInteractiveZoom from 'assets/tools/6p.svg';\nimport iconMove from 'assets/tools/5p.svg';\nimport iconReset from 'assets/tools/4p.svg';\nimport iconBrightness from 'assets/tools/9p.svg';\nimport iconFinding from 'assets/tools/2p.svg';\nimport iconMaximize from 'assets/arrows/2p.svg';\nimport iconMinimize from 'assets/arrows/4p.svg';\nimport iconStudyOverview from 'assets/stepsnew/1n.svg';\nimport iconCC from 'assets/stepsnew/2n.svg';\nimport iconMLO from 'assets/stepsnew/3n.svg';\nimport iconCCRight2D from 'assets/stepsnew/4n.svg';\nimport iconMLORight2D from 'assets/stepsnew/5n.svg';\nimport iconCCLeft2D from 'assets/stepsnew/6n.svg';\nimport iconMLOLeft2D from 'assets/stepsnew/7n.svg';\nimport iconRightBrest from 'assets/stepsnew/8n.svg';\nimport iconLeftBrest from 'assets/stepsnew/9n.svg';\nimport iconAssessment from 'assets/stepsnew/11n.svg';\nimport iconDiagnostic from 'assets/stepsnew/heatmapn.svg';\nimport iconComments from 'assets/stepsnew/12n.svg';\n\n// Temporary Icons\n// import iconStructuredRoaming from 'assets/temp_icons/icon_quadrant_roaming.png';\n// import iconInvert from 'assets/tools/9p.svg';\n// import iconStack from 'assets/temp_icons/icon_stack.png';\nimport iconFindingsShow from 'assets/tools/1p.svg';\nimport iconFindingsDelete from 'assets/tools/10p.svg';\nimport iconSteps from 'assets/stepchange.png';\nimport iconCases from 'assets/casechange.png';\n// contact, print\n\nexport const viewerDialogJson = {\n zoomAndMagnificationTool: [\n {\n description: 'Magnifier',\n icon: iconMagnifier,\n buttons: [], // ['R'],\n },\n {\n description: 'Interactive zoom',\n icon: iconInteractiveZoom,\n buttons: [], // ['Z'],\n },\n {\n description:\n 'Full resolution mode: Clicking on the image will show in original full resolution. By clicking on it again, will toggle back to fit to viewer mode.',\n icon: iconToggle,\n buttons: [], // ['Shift', 'Z'],\n },\n {\n description: 'Maximize viewer',\n icon: iconMaximize,\n buttons: [], // ['Shift', 'M'],\n },\n // {\n // description:\n // 'Structured roaming: Moves through zoomed views to make sure the whole tissue is displayed.',\n // icon: iconStructuredRoaming,\n // buttons: [], // ['TAB'],\n // },\n {\n description: 'Panning/moving image (also via right mouse button)',\n icon: iconMove,\n buttons: [], // ['P'],\n },\n {\n description: 'Reset viewers: Changes zoom and window/level to initial values',\n icon: iconReset,\n buttons: [], // ['Shift', 'R'],\n },\n ],\n otherTools: [\n {\n description: 'Change window/level settings',\n icon: iconBrightness,\n buttons: [], // ['W'],\n },\n // {\n // description: 'Invert images',\n // icon: iconInvert,\n // buttons: [], // ['I'],\n // },\n // {\n // description: 'Stacking/Slicing (also via ↑ / ↓ or scroll wheel) ',\n // icon: iconStack,\n // buttons: [], // ['↑', '↓', 'S'],\n // },\n {\n description: 'Finding tool: Allows to place arrows at regions of interest.',\n icon: iconFinding,\n buttons: [], // ['F'],\n },\n {\n description: 'Show Markings',\n icon: iconFindingsShow,\n buttons: [], // ['Shift', 'F'],\n },\n {\n description: 'Delete Markings',\n icon: iconFindingsDelete,\n buttons: [], // ['Shift', 'F'],\n },\n ],\n navigation: [\n {\n description: 'Full screen on',\n icon: iconMaximize,\n buttons: [], // ['0'],\n },\n {\n description: 'Full screen off',\n icon: iconMinimize,\n buttons: [], // ['0', 'Esc'],\n isSlash: true,\n },\n {\n description:\n 'Hanging Protocol: Right (next) and left (prior) icons to step you through the images for that patient',\n icon: iconSteps,\n buttons: [], // ['←', '→'],\n width: '130px',\n isSlash: true,\n },\n {\n description:\n 'Case Navigation: Right (next) and left (prior) icons to navigate through the course',\n icon: iconCases,\n buttons: [],\n width: '130px',\n },\n ],\n hangingProtocols: [\n {\n className: 'col-4',\n childs: [\n {\n description: 'Study overview',\n icon: iconStudyOverview,\n buttons: [],\n width: '70px',\n },\n {\n description: 'CC Right/Left',\n icon: iconCC,\n buttons: [],\n },\n {\n description: 'MLO Right/Left',\n icon: iconMLO,\n buttons: [],\n },\n {\n description: 'CC Right 2D/Tomo',\n icon: iconCCRight2D,\n buttons: [],\n },\n {\n description: 'MLO Right 2D/Tomo',\n icon: iconMLORight2D,\n buttons: [],\n },\n {\n description: 'CC Left 2D/Tomo',\n icon: iconCCLeft2D,\n buttons: [],\n },\n {\n description: 'MLO Left 2D/Tomo',\n icon: iconMLOLeft2D,\n buttons: [],\n },\n ],\n },\n {\n className: 'flex-fill',\n childs: [\n {\n description: 'Right breast of interest',\n icon: iconRightBrest,\n buttons: [],\n },\n {\n description: 'Left breast of interest',\n icon: iconLeftBrest,\n buttons: [],\n },\n {\n description: 'Assessment (if available)',\n icon: iconAssessment,\n buttons: [],\n },\n {\n description: 'Expert’s findings and comments',\n icon: iconComments,\n buttons: [],\n },\n {\n description: 'Diagnostic images (if available)',\n icon: iconDiagnostic,\n buttons: [],\n },\n ],\n },\n ],\n caseAccessment: [\n Cases may be assessed only when all mandatory hangings were reviewed.,\n \n Open the reporting page via click on\n \n
\n);\n\nexport default ZoomAndMagnificationTools;\n","import React from 'react';\nimport { viewerDialogJson } from './../config/consts';\nconst { otherTools } = viewerDialogJson;\n\nconst OtherTools = () => (\n \n Generally, a double click into an image will magnify it-usually to the available size of the\n viewer. Mammograms\n
are magnified to 1;1,i.e., original size.\n
\n \n {description}\n {buttons.map((btn, index) => (\n \n ))}\n
\n {otherTools.map(({ icon, description, buttons }, index) => {\n return (\n
\n);\n\nexport default OtherTools;\n","import React from 'react';\nimport { viewerDialogJson } from './../config/consts';\nconst { navigation } = viewerDialogJson;\n\nconst Navigation = () => (\n \n \n {description}\n {buttons.map((btn, index) => (\n \n ))}\n
\n {navigation.map(({ icon, description, buttons = [], isSlash, width }, index) => {\n return (\n
\n);\n\nexport default Navigation;\n","import React from 'react';\nimport { viewerDialogJson } from './../config/consts';\nconst { hangingProtocols } = viewerDialogJson;\n\nconst HangingProtocols = () => (\n \n \n {description}\n {buttons.map((btn, index) => (\n \n ))}\n
\n
\n);\n\nexport default HangingProtocols;\n","import React from 'react';\nimport { viewerDialogJson } from './../config/consts';\nconst { caseAccessment } = viewerDialogJson;\n\nconst CaseAccessment = () => {\n return (\n \n {hangingProtocols.map((group, groupIndex) => (\n
\n \n {group.childs.map(({ icon, description, buttons = [], isSlash, width }, childIndex) => {\n return (\n \n \n {description}\n {buttons.map((btn, btnIndex) => (\n \n ))}\n \n );\n })}\n
\n ))}\n \n Note: The current (screening) study is always displayed first.\n
\n\n For hangings with viewers with multiple images: All images in a hanging can be toggled by\n clicking the tab icon.\n
\n- \n {caseAccessment.map((item, index) => (\n
- \n {item}\n \n ))}\n
\n {faq.map(({ q, a, variants }, qIndex) => (\n
\n );\n};\n\nexport default FAQ;\n","/* eslint-disable react/jsx-no-duplicate-props */\n/* eslint-disable jsx-a11y/anchor-is-valid */\nimport { HOST } from 'configs';\nimport React from 'react';\n\nconst Print = () => {\n return (\n \n
\n ))}\n \n Q: {q}\n
\nA: {a}
\n {variants && variants.length > 0 && (\n- \n {variants.map((variant, vIndex) => (\n
- {variant} \n ))}\n
\n \n Click here to open printable PDF help file in a new browser tab.\n \n
\n );\n};\n\nexport default Print;\n","import React, { useState } from 'react';\nimport Modal from 'react-modal';\nimport { AppBar, Tabs, Tab } from '@material-ui/core';\nimport {\n ZoomAndMagnificationTools,\n OtherTools,\n Navigation,\n HangingProtocols,\n CaseAccessment,\n // FAQ,\n Print,\n} from './components';\n\nconst modalStyles = {\n overlay: {\n // backgroundColor: '#000000',\n backgroundColor: 'rgba(0, 0, 0, 0.75)',\n },\n};\n\nconst tabs = [\n {\n label: 'Zoom and Magnification Tools',\n component: Radiologist Training - Online Help
\n{tabs[tab].component}
\n \n );\n};\n\nexport default HelpModal;\n","import React, { useEffect, useState, useRef, Fragment } from 'react';\nimport { useSnackbar } from 'notistack';\nimport { Api } from 'utils/connectors';\nimport Loading from 'shared/components/Loading';\nimport { getError } from 'utils/appHelpers';\n\nconst Input = ({ forId, type, name, label, value, onChange, className, checked, disabled }) => {\n const inputRef = useRef();\n const active = inputRef.current && inputRef.current.checked;\n\n return (\n \n This step is not required for this case\n
\n );\n }\n\n if (isDisabled) {\n return (\n \n You must first review all steps of the hanging protocol as indicated below\n
\n );\n }\n\n if (!initialForm) return \n
\n \n );\n};\n\nexport default QuestionaryModal;\n","import React from 'react';\n\nconst InformationPart = ({ data, caseId, activeStep }) => {\n const stepComment = data.answers[activeStep] && data.answers[activeStep].title;\n return (\n \n
\n Score the most suspicious finding
\n\n \n Submit Assessment\n \n
\n \n \n
\n \n );\n};\n\nexport default InformationPart;\n","import step1Icon from 'assets/stepsnew/1n.svg';\nimport step1IconActive from 'assets/stepsnew/1s.svg';\nimport step1IconPassed from 'assets/stepsnew/1p.svg';\nimport step1IconPActive from 'assets/stepsnew/1ps.svg';\n\nimport step2Icon from 'assets/stepsnew/2n.svg';\nimport step2IconActive from 'assets/stepsnew/2s.svg';\nimport step2IconPassed from 'assets/stepsnew/2p.svg';\nimport step2IconPActive from 'assets/stepsnew/2ps.svg';\n\nimport step3Icon from 'assets/stepsnew/3n.svg';\nimport step3IconActive from 'assets/stepsnew/3s.svg';\nimport step3IconPassed from 'assets/stepsnew/3p.svg';\nimport step3IconPActive from 'assets/stepsnew/3ps.svg';\n\nimport step4Icon from 'assets/stepsnew/4n.svg';\nimport step4IconActive from 'assets/stepsnew/4s.svg';\nimport step4IconPassed from 'assets/stepsnew/4p.svg';\nimport step4IconPActive from 'assets/stepsnew/4ps.svg';\n\nimport step5Icon from 'assets/stepsnew/5n.svg';\nimport step5IconActive from 'assets/stepsnew/5s.svg';\nimport step5IconPassed from 'assets/stepsnew/5p.svg';\nimport step5IconPActive from 'assets/stepsnew/5ps.svg';\n\nimport step6Icon from 'assets/stepsnew/6n.svg';\nimport step6IconActive from 'assets/stepsnew/6s.svg';\nimport step6IconPassed from 'assets/stepsnew/6p.svg';\nimport step6IconPActive from 'assets/stepsnew/6ps.svg';\n\nimport step7Icon from 'assets/stepsnew/7n.svg';\nimport step7IconActive from 'assets/stepsnew/7s.svg';\nimport step7IconPassed from 'assets/stepsnew/7p.svg';\nimport step7IconPActive from 'assets/stepsnew/7ps.svg';\n\nimport step8Icon from 'assets/stepsnew/8n.svg';\nimport step8IconActive from 'assets/stepsnew/8s.svg';\nimport step8IconPassed from 'assets/stepsnew/8p.svg';\nimport step8IconPActive from 'assets/stepsnew/8ps.svg';\n\nimport step9Icon from 'assets/stepsnew/9n.svg';\nimport step9IconActive from 'assets/stepsnew/9s.svg';\nimport step9IconPassed from 'assets/stepsnew/9p.svg';\nimport step9IconPActive from 'assets/stepsnew/9ps.svg';\n\nimport step11Icon from 'assets/stepsnew/11n.svg';\nimport step11IconActive from 'assets/stepsnew/11s.svg';\nimport step11IconPassed from 'assets/stepsnew/11p.svg';\nimport step11IconPActive from 'assets/stepsnew/11ps.svg';\n\n// import step10Icon from 'assets/steps/11p.svg';\n// import step10IconActive from 'assets/steps/11a.svg';\nimport step12Icon from 'assets/stepsnew/12n.svg';\nimport step12IconActive from 'assets/stepsnew/12s.svg';\nimport step12IconPassed from 'assets/stepsnew/12p.svg';\nimport step12IconPActive from 'assets/stepsnew/12ps.svg';\n\nimport heatmapIcon from 'assets/stepsnew/heatmapn.svg';\nimport heatmapIconActive from 'assets/stepsnew/heatmaps.svg';\nimport heatmapIconPassed from 'assets/stepsnew/heatmaps.svg';\nimport heatmapIconPActive from 'assets/stepsnew/heatmaps.svg';\n\nimport tool1Icon from 'assets/tools/1p.svg';\nimport tool1IconActive from 'assets/tools/1a.svg';\nimport tool2Icon from 'assets/tools/2p.svg';\nimport tool2IconActive from 'assets/tools/2a.svg';\n// import tool3Icon from 'assets/tools/3p.svg';\n// import tool3IconActive from 'assets/tools/3a.svg';\nimport tool4Icon from 'assets/tools/4p.svg';\nimport tool4IconActive from 'assets/tools/4a.svg';\nimport tool5Icon from 'assets/tools/5p.svg';\nimport tool5IconActive from 'assets/tools/5a.svg';\nimport tool6Icon from 'assets/tools/6p.svg';\nimport tool6IconActive from 'assets/tools/6a.svg';\nimport tool7Icon from 'assets/tools/7p.svg';\nimport tool7IconActive from 'assets/tools/7a.svg';\nimport tool8Icon from 'assets/tools/8p.svg';\nimport tool8IconActive from 'assets/tools/8a.svg';\nimport tool9Icon from 'assets/tools/9p.svg';\nimport tool9IconActive from 'assets/tools/9a.svg';\nimport tool10Icon from 'assets/tools/10p.svg';\nimport tool10IconActive from 'assets/tools/10p.svg';\n\nimport { IconGenuineCross, IconGenuineFlake, IconGenuineTriangle } from 'shared/components/Icons';\n\nexport const genuieShapes = [\n { icon: IconGenuineTriangle, shape: 2 },\n { icon: IconGenuineCross, shape: 1 },\n { icon: IconGenuineFlake, shape: 3 },\n];\n\nexport const steps = [\n {\n id: 1,\n name: '2D CC/MLO Views',\n icon: step1Icon,\n iconActive: step1IconActive,\n iconPassed: step1IconPassed,\n iconPassedActive: step1IconPActive,\n views: {\n RCC: {\n active: true,\n position: 'right',\n thumbpos: 'left',\n key: 'RCC',\n has_switcher: true,\n dataType: '2D',\n },\n LCC: {\n active: true,\n position: 'left',\n thumbpos: 'right',\n key: 'LCC',\n has_switcher: true,\n dataType: '2D',\n },\n RMLO: {\n active: true,\n position: 'right',\n thumbpos: 'left',\n key: 'RMLO',\n has_switcher: true,\n dataType: '2D',\n },\n LMLO: {\n active: true,\n position: 'left',\n thumbpos: 'right',\n key: 'LMLO',\n has_switcher: true,\n dataType: '2D',\n },\n },\n },\n {\n id: 2,\n name: '2D CC Views',\n icon: step2Icon,\n iconActive: step2IconActive,\n iconPassed: step2IconPassed,\n iconPassedActive: step2IconPActive,\n views: {\n RCC: {\n active: true,\n position: 'right',\n thumbpos: 'left',\n has_switcher: true,\n dataType: '2D',\n key: 'RCC',\n },\n LCC: {\n active: true,\n position: 'left',\n thumbpos: 'right',\n has_switcher: true,\n dataType: '2D',\n key: 'LCC',\n },\n },\n },\n {\n id: 3,\n name: '2D MLO Views',\n icon: step3Icon,\n iconActive: step3IconActive,\n iconPassed: step3IconPassed,\n iconPassedActive: step3IconPActive,\n views: {\n RMLO: {\n active: true,\n key: 'RMLO',\n position: 'right',\n thumbpos: 'left',\n has_switcher: true,\n dataType: '2D',\n },\n LMLO: {\n active: true,\n key: 'LMLO',\n position: 'left',\n thumbpos: 'right',\n has_switcher: true,\n dataType: '2D',\n },\n },\n },\n {\n id: 4,\n name: '2D/3D RCC Views',\n icon: step4Icon,\n iconActive: step4IconActive,\n iconPassed: step4IconPassed,\n iconPassedActive: step4IconPActive,\n views: {\n RCC: {\n active: true,\n key: 'RCC',\n position: 'right',\n thumbpos: 'left',\n has_switcher: true,\n dataType: '2D',\n },\n RCC_L: {\n active: true,\n key: 'RCC',\n layers: true,\n position: 'left',\n thumbpos: 'left',\n has_switcher: true,\n dataType: '3DQ',\n },\n },\n },\n {\n id: 5,\n name: '2D/3D RMLO Views',\n icon: step5Icon,\n iconActive: step5IconActive,\n iconPassed: step5IconPassed,\n iconPassedActive: step5IconPActive,\n views: {\n RMLO: {\n active: true,\n key: 'RMLO',\n position: 'right',\n thumbpos: 'left',\n has_switcher: true,\n dataType: '2D',\n },\n RMLO_L: {\n active: true,\n key: 'RMLO',\n layers: true,\n position: 'right',\n thumbpos: 'left',\n has_switcher: true,\n dataType: '3DQ',\n },\n },\n },\n {\n id: 6,\n name: '2D/3D LCC Views',\n icon: step6Icon,\n iconActive: step6IconActive,\n iconPassed: step6IconPassed,\n iconPassedActive: step6IconPActive,\n views: {\n LCC: {\n active: true,\n key: 'LCC',\n position: 'right',\n thumbpos: 'right',\n has_switcher: true,\n dataType: '2D',\n },\n LCC_L: {\n active: true,\n key: 'LCC',\n layers: true,\n position: 'left',\n thumbpos: 'right',\n has_switcher: true,\n dataType: '3DQ',\n },\n },\n },\n {\n id: 7,\n name: '2D/3D LMLO Views',\n icon: step7Icon,\n iconActive: step7IconActive,\n iconPassed: step7IconPassed,\n iconPassedActive: step7IconPActive,\n views: {\n LMLO: {\n active: true,\n key: 'LMLO',\n position: 'right',\n thumbpos: 'right',\n has_switcher: true,\n dataType: '2D',\n },\n LMLO_L: {\n active: true,\n key: 'LMLO',\n layers: true,\n position: 'left',\n thumbpos: 'right',\n has_switcher: true,\n dataType: '3DQ',\n },\n },\n },\n {\n id: 8,\n name: '2D/3D stacked R CC/MLO, Toggle (T) between modes',\n icon: step8Icon,\n iconActive: step8IconActive,\n iconPassed: step8IconPassed,\n iconPassedActive: step8IconPActive,\n views: {\n RCC: {\n active: true,\n key: 'RCC',\n layers: true,\n has_switcher: true,\n dataType: '2D',\n position: 'left',\n thumbpos: 'left',\n },\n RMLO: {\n active: true,\n key: 'RMLO',\n layers: true,\n has_switcher: true,\n dataType: '2D',\n position: 'left',\n thumbpos: 'left',\n },\n },\n },\n {\n id: 9,\n name: '2D/3D stacked L CC/MLO, Toggle (T) between modes',\n icon: step9Icon,\n iconActive: step9IconActive,\n iconPassed: step9IconPassed,\n iconPassedActive: step9IconPActive,\n views: {\n LMLO: {\n active: true,\n key: 'LMLO',\n layers: true,\n has_switcher: true,\n dataType: '2D',\n position: 'right',\n thumbpos: 'right',\n },\n LCC: {\n active: true,\n key: 'LCC',\n layers: true,\n has_switcher: true,\n dataType: '2D',\n position: 'left',\n thumbpos: 'right',\n },\n },\n },\n {\n id: 11,\n name: 'question',\n icon: step11Icon,\n iconActive: step11IconActive,\n iconPassed: step11IconPassed,\n iconPassedActive: step11IconPActive,\n type: 'modal',\n views: {},\n disabled_no_active: 9,\n },\n {\n id: 12,\n name: 'heatmap',\n icon: heatmapIcon,\n iconActive: heatmapIconActive,\n iconPassed: heatmapIconPassed,\n iconPassedActive: heatmapIconPActive,\n type: 'modal',\n views: {},\n disabled_no_active: 10,\n },\n {\n id: 13,\n name: 'explanator',\n icon: step12Icon,\n iconActive: step12IconActive,\n iconPassed: step12IconPassed,\n iconPassedActive: step12IconPActive,\n type: 'modal',\n views: {},\n disabled_no_active: 10,\n },\n];\n\nexport const tools = [\n {\n name: 'FT',\n title: 'Show/Hide Finding Tool',\n icon: tool1Icon,\n iconActive: tool1IconActive,\n type: 'findingToggle',\n cursor: 'default',\n height: 23,\n onTimeAction: true,\n canStayActive: true,\n noResetFindings: true,\n },\n {\n name: 'F',\n title: 'Activate Finding Tool',\n icon: tool2Icon,\n iconActive: tool2IconActive,\n type: 'finding',\n cursor: 'arrow',\n height: 23,\n onTimeAction: false,\n },\n {\n name: 'FR',\n title: 'Reset Finding Tool',\n icon: tool10Icon,\n iconActive: tool10IconActive,\n type: 'findingReset',\n cursor: 'default',\n height: 23,\n onTimeAction: true,\n },\n {\n type: 'separator',\n },\n {\n name: 'R',\n title: 'Reset Viewers',\n icon: tool4Icon,\n iconActive: tool4IconActive,\n type: 'reset',\n cursor: 'default',\n onTimeAction: true,\n },\n {\n name: 'P',\n title: 'Activate Panning Tool',\n icon: tool5Icon,\n iconActive: tool5IconActive,\n type: 'pan',\n cursor: 'pan',\n onTimeAction: false,\n },\n {\n name: 'I Z',\n title: 'Activate Interactive Zoom',\n icon: tool6Icon,\n iconActive: tool6IconActive,\n type: 'zoomInteractive',\n cursor: 'izoom',\n onTimeAction: false,\n },\n {\n name: 'Z 1:1',\n title: 'Activate 1:1 Tool',\n icon: tool7Icon,\n iconActive: tool7IconActive,\n type: 'zoom1_1',\n cursor: 'fullzoom',\n onTimeAction: false,\n },\n {\n name: 'M',\n title: 'Activate Magnifier Tool',\n icon: tool8Icon,\n iconActive: tool8IconActive,\n type: 'zoomMagnifier',\n cursor: 'mzoom',\n onTimeAction: false,\n },\n {\n name: 'W/L',\n title:\n 'Activate Window/Level Tool (W; for presets move mouse over viewer and press numeric keys 1, 2, 3, ...)',\n icon: tool9Icon,\n iconActive: tool9IconActive,\n type: 'windowLevel',\n cursor: 'wlevel',\n onTimeAction: false,\n },\n];\n\nexport const getToolByType = type => {\n return tools.find(item => item.type === type);\n};\n\nexport const getDefaultType = (type, datas) => {\n if (type === '3DQ' && !datas['3DQ'] && datas['tomo']) return 'tomo';\n return type;\n};\n","import { LESSON_STATUSES } from 'configs/constants';\n\n/* eslint-disable no-console */\nexport const zoomImageMouseClick = (cornerstone, element, bool, scale, e) => {\n const step = 0.05;\n const viewport = cornerstone.getViewport(element);\n viewport.scale -= bool ? -step : step;\n if (scale) viewport.scale = scale;\n cornerstone.setViewport(element, viewport);\n return false;\n};\n\nexport const getDefaultImageScale = (element, image) => {\n const { clientWidth, clientHeight } = element;\n const { width, height } = image;\n if (width > height) return width > clientWidth ? clientWidth / width : clientHeight / height;\n else return clientHeight / height;\n};\n\nexport const maximazeElement = (cornerstone, element, toggle) => {\n element.classList[toggle ? 'toggle' : 'add']('maximize');\n cornerstone.fitToWindow(element);\n cornerstone.resize(element);\n};\n\nconst getCompletedSteps = (episodes, id) => {\n let body = episodes.filter(item => item.caseId === id);\n body = body.sort((a, b) => a.orderNum - b.orderNum);\n const result = [];\n body.forEach((item, index) => {\n if (item.status === LESSON_STATUSES.inProgress || item.status === LESSON_STATUSES.completed)\n result.push(index);\n });\n return result;\n};\n\nconst setFindings = (data, userLessonId) => {\n try {\n if (data && data.length) {\n data = data.map(f => {\n f.vectorData = JSON.parse(f.vectorData);\n f.vectorData = f.vectorData.map(i => ({ ...i, x: i.pointX, y: i.pointY }));\n return f;\n });\n return data.filter(item => userLessonId === item.userLessonId)[0];\n } else return null;\n } catch (err) {\n return null;\n }\n};\n\nconst checkDicomNameOnViews = (name, newTpe, views) => {\n if (!views[name]) return name;\n const { dicomImageType: currentType } = views[name];\n if (currentType === 'i2d') return false;\n if (currentType === 'g2d' && newTpe === 'r2d') return false;\n return name;\n};\n\nconst getDicomDataName = dicomItem => {\n const { imageLaterality, viewPosition, dicomImageType } = dicomItem;\n const types = { '3dq': '_3DQ', i2d: '_2D', g2d: '_2D', r2d: '_2D', tomo: '_TOMO', sub: '_TOMO' };\n const type = types[dicomImageType];\n return `${imageLaterality}${viewPosition}${type}`;\n};\n\nexport const generateViewerData = (data, lesson) => {\n const result = [];\n const views = {};\n data.caseDicomItems.forEach(({ dicomItem }, index) => {\n const tempName = getDicomDataName(dicomItem);\n const name = checkDicomNameOnViews(tempName, dicomItem.dicomImageType, views);\n if (!name) return;\n views[name] = {\n name,\n position: name[0] === 'R' ? 'right' : 'left',\n protocolName: dicomItem.protocolName,\n imageLaterality: dicomItem.imageLaterality,\n viewPosition: dicomItem.viewPosition,\n dicomImageType: dicomItem.dicomImageType,\n id: dicomItem.id,\n patient: {\n name: dicomItem.patientName,\n age: dicomItem.patientAge,\n sex: dicomItem.patientSex,\n id: dicomItem.patientId,\n birthDate: dicomItem.patientBirthDate,\n },\n images: dicomItem.dicomItemImages.map(img => {\n const emptyFinding = {\n caseId: data.id,\n dicomId: dicomItem.id,\n imageId: img.id,\n userLessonId: lesson.userLessonId,\n };\n return {\n id: img.id,\n url: img.lutUrl || img.url,\n finding: setFindings(img.vectorDatas, lesson.userLessonId),\n emptyFinding,\n geniusAIDataList: img.geniusAIDataList,\n preSlices: img.preSlices,\n postSlices: img.postSlices,\n };\n }),\n };\n });\n const completed_steps = getCompletedSteps(lesson.episodes, data.id);\n result.push({ id: data.id, name: data.title, completed_steps, views });\n return result;\n};\n\n(function(target) {\n if (!target || !target.prototype) return;\n target.prototype.arrow = function(startX, startY, endX, endY, controlPoints) {\n var dx = endX - startX;\n var dy = endY - startY;\n var len = Math.sqrt(dx * dx + dy * dy);\n var sin = dy / len;\n var cos = dx / len;\n var a = [];\n a.push(0, 0);\n for (var i = 0; i < controlPoints.length; i += 2) {\n var x1 = controlPoints[i];\n var y1 = controlPoints[i + 1];\n a.push(x1 < 0 ? len + x1 : x1, y1);\n }\n a.push(len, 0);\n for (var j = controlPoints.length; j > 0; j -= 2) {\n var x2 = controlPoints[j - 2];\n var y2 = controlPoints[j - 1];\n a.push(x2 < 0 ? len + x2 : x2, -y2);\n }\n a.push(0, 0);\n for (var k = 0; k < a.length; k += 2) {\n var x3 = a[k] * cos - a[k + 1] * sin + startX;\n var y3 = a[k] * sin + a[k + 1] * cos + startY;\n if (i === 0) this.moveTo(x3, y3);\n else this.lineTo(x3, y3);\n }\n };\n})(CanvasRenderingContext2D);\n\nexport const drawArrow = (c, viewport, e) => {\n c.lineWidth = 1;\n c.strokeStyle = '#00b5ec';\n c.fillStyle = '#00b5ec';\n c.setTransform(1, 0, 0, 1, 10, 0);\n\n c.translate(0, 0);\n c.beginPath();\n c.arrow(50, 50, 0, 0, [0, 2, -10, 2, -10, 5]);\n\n c.fill();\n};\n\nexport const getFindingsCoordinates = points => {\n if (!points || !points.data) return null;\n try {\n const result = points.data.map(i => {\n const item = i.handles.end;\n return { pointX: item.x, pointY: item.y };\n });\n return JSON.stringify(result);\n } catch (err) {\n console.log(err);\n return null;\n }\n};\n\nexport const createFindingEventData = ({ x, y }) => {\n return {\n visible: true,\n active: true,\n color: undefined,\n invalidated: true,\n handles: {\n end: {\n x,\n y,\n highlight: true,\n active: true,\n },\n },\n };\n};\n\nexport const createGenuieEventData = ({ x, y, shape, percentage }) => {\n return {\n visible: true,\n active: true,\n color: undefined,\n invalidated: true,\n handles: {\n end: {\n x,\n y,\n percentage: percentage,\n shape: shape,\n highlight: true,\n active: true,\n },\n },\n };\n};\n\nexport const getDicomImagesObj = images => {\n const result = {};\n images.forEach(item => {\n result[item.url] = item;\n });\n return result;\n};\n\nexport const sumShapes = (images, shape) => {\n let sum = 0;\n images.forEach(item => {\n if (item.geniusAIDataList && item.geniusAIDataList.length) {\n const shapes = item.geniusAIDataList.filter(i => Number(i.shape) === Number(shape));\n sum += shapes ? shapes.length : 0;\n }\n });\n return sum;\n};\n","import React from 'react';\n\nconst getSmallerSize = imageWidth => {\n return Number((imageWidth / 50).toFixed());\n};\n\nconst Thumbnail = ({ viewport }) => {\n if (!viewport || !viewport.image) return null;\n const { scale, initialScale, translation, rotation, vflip, hflip } = viewport;\n const smallNum = getSmallerSize(viewport.image.width);\n const width = viewport.image.width / smallNum;\n const height = viewport.image.height / smallNum;\n const coreSize = {\n width: (initialScale * width) / scale,\n height: (initialScale * height) / scale,\n };\n const corePos = {\n transform: `translate(${-(translation.x / smallNum)}px, ${-(translation.y / smallNum)}px)`,\n };\n const imageStyle = {\n backgroundImage: `url('${viewport.image.imageId}')`,\n transform: `rotate(${rotation}deg) rotateX(${vflip ? 180 : 0}deg) rotateY(${\n hflip ? 180 : 0\n }deg)`,\n };\n if (coreSize.width > 100 || initialScale >= scale) return null;\n return (\n \n
\n CASE #{caseId}:
\n {data.sections && data.sections.length ? (\n\n {data &&\n data.sections &&\n data.sections.map((item, i) => {\n return (\n
\n ) : (\n \n
\n );\n })}\n \n {item.title}\n
\n- \n {item.items &&\n item.items.map((row, i) => {\n return
- {row.text} ;\n })}\n
\n No information provided for this case\n
\n )}\n \n {stepComment && (\n \n {stepComment}\n
\n )}\n \n \n \n
\n );\n};\n\nexport default Thumbnail;\n","import React, { useState } from 'react';\nimport ReactModal from 'react-modal';\nimport { IconClose } from 'shared/components/Icons';\n\nexport const getPrePostSliceItems = (index, pre, post) => {\n let prePostSlicesIndexes = [];\n if (post) {\n for (let i = index + 1; i <= index + post; i += 1) {\n prePostSlicesIndexes.push(i);\n }\n }\n if (pre) {\n for (let i = index - 1; i >= index - pre; i -= 1) {\n prePostSlicesIndexes.push(i);\n }\n }\n return { prePostSlicesIndexes };\n};\n\nexport const getImagesPrePostSlices = images => {\n let result = new Set();\n images.forEach((img, index) => {\n const hasGeniusShapes = !!img.geniusAIDataList?.length;\n if (!hasGeniusShapes) return;\n const { prePostSlicesIndexes } = getPrePostSliceItems(index, img.preSlices, img.postSlices);\n result = new Set([...result, ...prePostSlicesIndexes]);\n });\n return [...result];\n};\n\nexport const getPrimarySlices = images => {\n const result = new Set();\n images.forEach((img, index) => {\n const hasGeniusShapes = !!img.geniusAIDataList?.length;\n if (hasGeniusShapes || (hasGeniusShapes && (!!img.preSlices || !!img.postSlices))) {\n result.add(index);\n }\n });\n return [...result];\n};\n\nexport const getImagesSortedSlices = images => {\n const all = [];\n images.forEach((img, index) => {\n const hasGeniusShapes = !!img.geniusAIDataList?.length;\n if (!hasGeniusShapes) return;\n const { prePostSlicesIndexes } = getPrePostSliceItems(index, img.preSlices, img.postSlices);\n all.push([...new Set([index, ...prePostSlicesIndexes])]);\n });\n return all;\n};\n\nconst PrePostSlices = ({ onSaveSlice, activeImage, imagesCount, playing }) => {\n const [activeTab, setActiveTab] = useState('preSlices');\n const [modalState, setModalState] = useState(false);\n const [imageData, setImageData] = useState();\n\n const onOpenModal = () => {\n setImageData({ index: activeImage.index, image: { ...activeImage } });\n setModalState(true);\n };\n\n const onSliceChange = ({ e }) => {\n const tempData = { ...imageData };\n imageData.image[activeTab] = e.target.value;\n setImageData(tempData);\n };\n\n const onChangeSliceNumber = increase => {\n const tempData = { ...imageData };\n imageData.image[activeTab] += increase ? 1 : -1;\n setImageData(tempData);\n };\n\n const onSaveHandle = () => {\n setModalState(false);\n onSaveSlice({ ...imageData });\n };\n\n const currentValue = imageData ? imageData.image[activeTab] : 0;\n\n const minuseButtonDisabled = currentValue === 0;\n const addButtonDisabled =\n (activeTab === 'postSlices' && imageData?.index + currentValue >= imagesCount) ||\n (activeTab === 'preSlices' && imageData?.index - currentValue <= 0);\n\n const getChosenSlices = () => {\n const { prePostSlicesIndexes } = getPrePostSliceItems(\n imageData.index,\n imageData.image.preSlices,\n imageData.image.postSlices,\n );\n const slices = [...prePostSlicesIndexes];\n return slices.join(',');\n };\n\n const hasGeniusShapes = !!activeImage?.geniusAIDataList?.length;\n\n return (\n \n {!playing && (\n \n )}\n {imageData && (\n \n \n )}\n
\n );\n};\n\nexport default PrePostSlices;\n","/* eslint-disable no-console */\nimport React, { useState, useEffect, useRef } from 'react';\nimport Slider from 'react-rangeslider';\nimport 'react-rangeslider/umd/rangeslider.min.css';\nimport { IconAiPlay, IconPlayFill, IconSliceNext, IconSlicePrev } from 'shared/components/Icons';\nimport Loading from 'shared/components/Loading';\nimport pause from 'assets/pause.svg';\nimport speedIcon from 'assets/speed.svg';\nimport { getImagesPrePostSlices, getImagesSortedSlices, getPrimarySlices } from './PrePostSlices';\n\nconst stackWords = {\n CC: { top: 'H', bottom: 'F' },\n MLO: { top: 'M', bottom: 'L' },\n};\n\nconst speeds = [\n { name: 'Low', value: 160 },\n { name: 'Medium', value: 80 },\n { name: 'High', value: 40 },\n];\n\nconst modes = [\n { name: 'Genius AI Mode', value: 'genius' },\n { name: 'Normal Mode', value: 'normal' },\n];\n\nconst StackControl = ({\n cornerstoneTools,\n element,\n cornerstone,\n imageType,\n setActiveTool,\n className,\n images,\n play,\n setPlay,\n isGenuine,\n}) => {\n const stackEl = useRef();\n const [speed, setSpeed] = useState(80);\n const [mode, setMode] = useState('normal');\n const [fetch, setFetch] = useState(false);\n const isAIMode = mode === 'genius';\n\n const playIndex = useRef({ index: 0, increase: true, images: undefined });\n const scale = useRef(0);\n const playInterval = useRef();\n\n const primarySlices = isAIMode ? getPrimarySlices(images) : [];\n const allPrePostSlices = isAIMode ? getImagesPrePostSlices(images) : [];\n const allSortedSlices = isAIMode ? getImagesSortedSlices(images) : [];\n const hasNextSlice = primarySlices.indexOf(playIndex.current.index) < primarySlices.length - 1;\n const hasPrevSlice = primarySlices.indexOf(playIndex.current.index) !== 0;\n\n const getStackData = () => {\n const stackData = cornerstoneTools.getToolState(element, 'stack');\n const { currentImageIdIndex, imageIds } = stackData.data[0];\n return { currentImageIdIndex, imageIds };\n };\n\n const { imageIds } = getStackData();\n\n const changeHandle = index => {\n if (fetch || play) return;\n if (!playIndex.current.images) {\n loadAllImages();\n return;\n }\n playIndex.current.index = index;\n scale.current = index;\n changeStackImage(playIndex.current.images, index);\n };\n\n const changeStackImage = (images, index) => {\n if (images[index] !== undefined) {\n const viewport = cornerstone.getViewport(element);\n const stackData = cornerstoneTools.getToolState(element, 'stack');\n stackData.data[0].currentImageIdIndex = Number(index);\n cornerstone.displayImage(element, images[index], viewport);\n }\n };\n\n const playStack = images => {\n try {\n let { index, increase } = playIndex.current;\n index += increase ? 1 : -1;\n if (!imageIds[index]) {\n increase = !increase;\n index += increase ? 2 : -2;\n }\n changeStackImage(images, index);\n playIndex.current.index = index;\n playIndex.current.increase = increase;\n } catch (err) {\n console.log(err);\n }\n };\n\n const playStackSlices = images => {\n try {\n let { index, increase } = playIndex.current;\n const activeSlice = allSortedSlices.findIndex(i => i.includes(index));\n const nearPrimary = activeSlice !== -1 ? allSortedSlices[activeSlice] : allSortedSlices[0];\n const sliceImages = [...(nearPrimary || [])].sort((a, b) => a - b);\n const currentIndex = sliceImages.indexOf(index);\n index = sliceImages[currentIndex === -1 ? 0 : currentIndex + (increase ? 1 : -1)];\n if (!imageIds[index]) {\n increase = !increase;\n index = sliceImages[currentIndex === -1 ? 0 : currentIndex + (increase ? 1 : -1)];\n }\n changeStackImage(images, index);\n playIndex.current.index = index;\n playIndex.current.increase = increase;\n } catch (err) {\n console.log(err);\n }\n };\n\n const setPlayInterval = (speed, changedToAIMode) => {\n if (changedToAIMode || isAIMode) {\n playInterval.current = setInterval(playStackSlices, speed, playIndex.current.images);\n } else {\n playInterval.current = setInterval(playStack, speed, playIndex.current.images);\n }\n };\n\n const loadAllImages = async play => {\n setFetch(true);\n if (!playIndex.current.images) {\n const { imageIds } = getStackData();\n const imageLoads = imageIds.map(async item => await cornerstone.loadAndCacheImage(item));\n const images = await Promise.all(imageLoads);\n playIndex.current.images = images;\n }\n setFetch(false);\n if (play) setPlayInterval(speed);\n };\n\n const onElementScroll = e => {\n e.preventDefault();\n\n if (!playIndex.current.images) {\n if (fetch || play) return;\n loadAllImages();\n return;\n }\n\n const { imageIds } = getStackData();\n scale.current += e.deltaY * -0.01;\n scale.current = Math.min(Math.max(0, scale.current), imageIds.length);\n\n if (playIndex.current.index !== Math.floor(scale.current)) {\n changeHandle(Math.floor(scale.current));\n }\n };\n\n const onChangeStart = () => {\n // setActiveTool({ type: 'remove' });\n };\n\n const handleUserKeyPress = event => {\n const { keyCode } = event;\n if (keyCode === 32)\n setPlay(p => {\n return !p;\n });\n };\n\n const stopPlayerUnmount = () => {\n window.removeEventListener('keydown', handleUserKeyPress);\n setPlay(false);\n clearInterval(playInterval.current);\n playIndex.current = { index: 0, increase: true, images: undefined };\n };\n\n const onSpeedChange = async value => {\n setSpeed(value);\n if (play) {\n clearInterval(playInterval.current);\n setPlayInterval(value);\n }\n };\n\n const onPlayerModeChanges = value => {\n setMode(value);\n if (play) {\n clearInterval(playInterval.current);\n setPlayInterval(speed, value === 'genius');\n }\n };\n\n const renderLines = length => {\n const lines = [];\n for (let index = length - 1; index >= 0; index--) {\n const hasGenuie = images?.[index]?.geniusAIDataList?.length > 0;\n const hasPrimarySlice =\n hasGenuie || (hasGenuie && (!!images?.[index]?.postSlices || images?.[index]?.preSlices));\n const hasPrePostSlice = !hasPrimarySlice && allPrePostSlices.includes(index);\n lines.push(\n \n
\n \n
\n \n
\n \n Add Pre/Post Slices
\n\n Please, indicate how many pre-slices you want to mark for{' '}\n Slice {imageData.index + 1}.\n
\n\n
\n \n setActiveTab('preSlices')}\n className={`btn slice-tab ${activeTab === 'preSlices' ? 'active' : ''}`}\n >\n Pre Slice\n \n setActiveTab('postSlices')}\n className={`btn slice-tab ml-3 ${activeTab === 'postSlices' ? 'active' : ''}`}\n >\n Post Slice\n \n
\n \n onChangeSliceNumber(false)}\n className='btn btn-slice-change'\n >\n -\n \n onChangeSliceNumber(true)}\n className='btn btn-slice-change'\n >\n +\n \n
\n \n
\n \n Chosen Slices: {getChosenSlices()}\n
\n\n \n
\n \n {renderLines(imageIds.length)}\n
\n \n \n
\n \n {speeds.map(item => (\n onSpeedChange(item.value)}\n >\n {item.name}\n \n ))}\n
\n \n {\n setPlay(p => !p);\n e.preventDefault();\n e.stopPropagation();\n }}\n >\n {fetch ? (\n
\n \n {modes.map(item => (\n onPlayerModeChanges(item.value)}\n >\n {item.name}\n \n ))}\n
\n )}\n {stackWords[imageType].top}
\n {stackWords[imageType].bottom}
\n \n {Number(getStackData().currentImageIdIndex) + 1}/{imageIds.length}\n
\n {isAIMode && (\n \n \n \n
\n )}\n Buffering in Process
\n \n {play && isAIMode && (\n \n
\n )}\n \n );\n};\n\nexport default StackControl;\n","/**\n * Triggers a CustomEvent.\n * @public\n * @method triggerEvent\n *\n * @param {EventTarget} el The element or EventTarget to trigger the event upon.\n * @param {String} type The event type name.\n * @param {Object|null} [detail=null] The event data to be sent.\n * @returns {Boolean} The return value is false if at least one event listener called preventDefault(). Otherwise it returns true.\n */\nexport default function triggerEvent(el, type, detail = null) {\n let event;\n\n // This check is needed to polyfill CustomEvent on IE11-\n if (typeof window.CustomEvent === 'function') {\n event = new CustomEvent(type, {\n detail,\n cancelable: true,\n });\n } else {\n event = document.createEvent('CustomEvent');\n event.initCustomEvent(type, true, true, detail);\n }\n\n return el.dispatchEvent(event);\n}\n","/* eslint-disable consistent-return */\nimport * as cornerstone from 'cornerstone-core';\nimport uuidv4 from './../util/uuidv4.js';\nimport triggerEvent from './../util/triggerEvent.js';\n\n/**\n * Implements an imageId specific tool state management strategy. This means that\n * Measurements data is tied to a specific imageId and only visible for enabled elements\n * That are displaying that imageId.\n * @public\n * @constructor newImageIdSpecificToolStateManager\n * @memberof StateManagement\n *\n * @returns {Object} An imageIdSpecificToolStateManager instance.\n */\nfunction newImageIdSpecificToolStateManager() {\n let toolState = {};\n\n // Here we add tool state, this is done by tools as well\n // As modules that restore saved state\n\n function saveImageIdToolState(imageId) {\n return toolState[imageId];\n }\n\n function restoreImageIdToolState(imageId, imageIdToolState) {\n toolState[imageId] = imageIdToolState;\n }\n\n function saveToolState() {\n return toolState;\n }\n\n function restoreToolState(savedToolState) {\n toolState = savedToolState;\n }\n\n // Here we add tool state, this is done by tools as well\n // As modules that restore saved state\n function addElementToolState(element, toolType, data) {\n const enabledElement = cornerstone.getEnabledElement(element);\n\n // If we don't have an image for this element exit early\n if (!enabledElement.image) {\n return;\n }\n addImageIdToolState(enabledElement.image.imageId, toolType, data);\n }\n\n function addImageIdToolState(imageId, toolType, data) {\n // If we don't have any tool state for this imageId, add an empty object\n if (toolState.hasOwnProperty(imageId) === false) {\n toolState[imageId] = {};\n }\n\n const imageIdToolState = toolState[imageId];\n\n // If we don't have tool state for this type of tool, add an empty object\n if (imageIdToolState.hasOwnProperty(toolType) === false) {\n imageIdToolState[toolType] = {\n data: [],\n };\n }\n\n const toolData = imageIdToolState[toolType];\n\n // Finally, add this new tool to the state\n toolData.data.push(data);\n }\n\n function getElementToolState(element, toolType) {\n const enabledElement = cornerstone.getEnabledElement(element);\n\n // If the element does not have an image return undefined.\n if (!enabledElement.image) {\n return;\n }\n\n return getImageIdToolState(enabledElement.image.imageId, toolType);\n }\n\n // Here you can get state - used by tools as well as modules\n // That save state persistently\n function getImageIdToolState(imageId, toolType) {\n // If we don't have any tool state for this imageId, return undefined\n if (toolState.hasOwnProperty(imageId) === false) {\n return;\n }\n\n const imageIdToolState = toolState[imageId];\n\n // If we don't have tool state for this type of tool, return undefined\n if (imageIdToolState.hasOwnProperty(toolType) === false) {\n return;\n }\n\n return imageIdToolState[toolType];\n }\n\n // Clears all tool data from this toolStateManager.\n function clearElementToolState(element) {\n const enabledElement = cornerstone.getEnabledElement(element);\n\n if (!enabledElement.image) {\n return;\n }\n clearImageIdToolState(enabledElement.image.imageId);\n }\n\n function clearImageIdToolState(imageId) {\n if (toolState.hasOwnProperty(imageId) === false) {\n return;\n }\n\n delete toolState[imageId];\n }\n\n return {\n get: getElementToolState,\n add: addElementToolState,\n clear: clearElementToolState,\n getImageIdToolState,\n addImageIdToolState,\n clearImageIdToolState,\n saveImageIdToolState,\n restoreImageIdToolState,\n saveToolState,\n restoreToolState,\n toolState,\n };\n}\n\n// A global imageIdSpecificToolStateManager - the most common case is to share state between all\n// Visible enabled images\nconst globalImageIdSpecificToolStateManager = newImageIdSpecificToolStateManager();\n\n/**\n * Returns the toolstate for a specific element.\n * @public\n * @function getElementToolStateManager\n *\n * @param {HTMLElement} element The element.\n * @returns {Object} The toolState.\n */\nfunction getElementToolStateManager(element) {\n const enabledElement = cornerstone.getEnabledElement(element);\n // If the enabledElement has no toolStateManager, create a default one for it\n // NOTE: This makes state management element specific\n\n if (enabledElement.toolStateManager === undefined) {\n enabledElement.toolStateManager = globalImageIdSpecificToolStateManager;\n }\n\n return enabledElement.toolStateManager;\n}\n\n/**\n * Adds tool state to the toolStateManager, this is done by tools as well\n * as modules that restore saved state.\n * @public\n * @method addToolState\n *\n * @param {HTMLElement} element The element.\n * @param {string} toolType The toolType of the state.\n * @param {Object} measurementData The data to store in the state.\n * @returns {undefined}\n */\nfunction addToolState(element, toolType, measurementData) {\n const toolStateManager = getElementToolStateManager(element);\n\n measurementData.uuid = measurementData.uuid || uuidv4();\n toolStateManager.add(element, toolType, measurementData);\n\n const eventType = 'cornerstonetoolsmeasurementremoved';\n const eventData = {\n toolType,\n element,\n measurementData,\n };\n\n triggerEvent(element, eventType, eventData);\n}\n\n/**\n * Returns tool specific state of an element. Used by tools as well as modules\n * that save state persistently\n * @export\n * @public\n * @method\n * @name getToolState\n *\n * @param {HTMLElement} element The element.\n * @param {string} toolType The toolType of the state.\n * @returns {Object} The element's state for the given toolType.\n */\nfunction getToolState(element, toolType) {\n const toolStateManager = getElementToolStateManager(element);\n\n return toolStateManager.get(element, toolType);\n}\n\n/**\n * Removes specific tool state from the toolStateManager.\n * @public\n * @method removeToolState\n *\n * @param {HTMLElement} element The element.\n * @param {string} toolType The toolType of the state.\n * @param {Object} data The data to remove from the toolStateManager.\n * @returns {undefined}\n */\nfunction removeToolState(element, toolType, data) {\n const toolStateManager = getElementToolStateManager(element);\n const toolData = toolStateManager.get(element, toolType);\n\n if (!toolData || !toolData.data || !toolData.data.length) {\n return;\n }\n\n // Find this tool data\n let indexOfData = -1;\n\n for (let i = 0; i < toolData.data.length; i++) {\n if (toolData.data[i] === data) {\n indexOfData = i;\n }\n }\n\n if (indexOfData !== -1) {\n toolData.data.splice(indexOfData, 1);\n\n const eventType = 'cornerstonetoolsmeasurementremoved';\n const eventData = {\n toolType,\n element,\n measurementData: data,\n };\n\n triggerEvent(element, eventType, eventData);\n }\n}\n\nexport { getToolState, addToolState, removeToolState };\n","let defaultColor = 'white';\nlet activeColor = 'greenyellow';\nlet fillColor = 'transparent';\n\nfunction setFillColor(color) {\n fillColor = color;\n}\n\nfunction getFillColor() {\n return fillColor;\n}\n\nfunction setToolColor(color) {\n defaultColor = color;\n}\n\nfunction getToolColor() {\n return defaultColor;\n}\n\nfunction setActiveColor(color) {\n activeColor = color;\n}\n\nfunction getActiveColor() {\n return activeColor;\n}\n\nfunction getColorIfActive(data) {\n if (data.color) {\n return data.color;\n }\n\n return data.active ? activeColor : defaultColor;\n}\n\nconst toolColors = {\n setFillColor,\n getFillColor,\n setToolColor,\n getToolColor,\n setActiveColor,\n getActiveColor,\n getColorIfActive,\n};\n\nexport default toolColors;\n","/* eslint-disable import/no-anonymous-default-export */\n/**\n * This function manages the {@link https://www.w3.org/TR/2dcontext/#the-canvas-state|save/restore}\n * pattern for working in a new context state stack. The parameter `fn` is passed the `context` and can\n * execute any API calls in a clean stack.\n * @public\n * @method draw\n * @memberof Drawing\n *\n * @param {CanvasRenderingContext2D} context - Target Canvas\n * @param {ContextFn} fn - A function which performs drawing operations within the given context.\n * @returns {undefined}\n */\nexport default function(context, fn) {\n context.save();\n fn(context);\n context.restore();\n}\n","let defaultWidth = 1;\nlet activeWidth = 2;\n\nfunction setToolWidth(width) {\n defaultWidth = width;\n}\n\nfunction getToolWidth() {\n return defaultWidth;\n}\n\nfunction setActiveWidth(width) {\n activeWidth = width;\n}\n\nfunction getActiveWidth() {\n return activeWidth;\n}\n\nconst toolStyle = {\n setToolWidth,\n getToolWidth,\n setActiveWidth,\n getActiveWidth,\n};\n\nexport default toolStyle;\n","/* eslint-disable import/no-anonymous-default-export */\nimport toolStyle from './../stateManagement/toolStyle.js';\n\n/**\n * This function manages the beginPath/stroke pattern for working with\n * {@link https://www.w3.org/TR/2dcontext/#drawing-paths-to-the-canvas|path objects}.\n *\n * @public\n * @function path\n * @memberof Drawing\n *\n * @param {CanvasRenderingContext2D} context - Context to add path to\n * @param {Object} [options={}] - Drawing Options\n * @param {StrokeStyle} [options.color] - The stroke style of the path.\n * @param {number} [options.lineWidth] - The width of lines in the path. If null, no line width is set.\n * If undefined then toolStyle.getToolWidth() is set.\n * @param {FillStyle} [options.fillStyle] - The style to fill the path with. If undefined then no filling is done.\n * @param {Number[]} [options.lineDash] - The {@link https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/setLineDash|dash pattern}\n * to use on the lines.\n * @param {boolean} [options.shouldDrawLines = true] Whether context.stroke should be evoked.\n * @param {ContextFn} fn - A drawing function to execute with the provided stroke pattern.\n * @returns {undefined}\n */\nexport default function(context, options = {}, fn) {\n const { color, lineWidth, fillStyle, lineDash, shouldDrawLines = true } = options;\n\n context.beginPath();\n context.strokeStyle = color || context.strokeStyle;\n\n context.lineWidth =\n lineWidth || (lineWidth === undefined && toolStyle.getToolWidth()) || context.lineWidth;\n if (lineDash) {\n context.setLineDash(lineDash);\n }\n\n fn(context);\n\n if (fillStyle) {\n context.fillStyle = fillStyle;\n context.fill();\n }\n\n if (shouldDrawLines) {\n context.stroke();\n }\n\n if (lineDash) {\n context.setLineDash([]);\n }\n}\n","import * as cornerstone from 'cornerstone-core';\nimport toolStyle from './../stateManagement/toolStyle.js';\nimport toolColors from './../stateManagement/toolColors.js';\nimport path from './path.js';\n\nconst drawArrow = (c, { x, y }) => {\n c.setTransform(1, 0, 0, 1, 10, 0);\n c.translate(x - 8, y + 4);\n c.arrow(30, 20, 0, 0, [0, 2, -10, 2, -10, 5]);\n};\n\nconst drawFlake = (c, { x, y }, percent) => {\n x -= 12;\n y -= 12;\n\n if (percent) {\n c.font = '16px Roboto';\n c.fillStyle = '#EDD500';\n c.fillText(`${percent}%`, x, y - 5);\n }\n\n c.setTransform(1.33333, 0, 0, 1.33333, x, y);\n c.setTransform(1, 0, 0, 1, x, y);\n c.setTransform(1, 0, 0, 1, x + 8.5, y + 8.475);\n c.setTransform(1, 0, 0, 1, x + 10.025, y);\n c.beginPath();\n c.moveTo(0, 0);\n c.lineTo(4, 0);\n c.lineTo(4, 24);\n c.lineTo(0, 24);\n c.closePath();\n c.fillStyle = '#EDD500';\n c.fill('nonzero');\n c.setTransform(1, 0, 0, 1, x + 8.5, y + 6.719);\n c.beginPath();\n c.moveTo(13.57, -2.5);\n c.lineTo(15.551, 1.108);\n c.lineTo(-6.519, 14.477);\n c.lineTo(-8.5, 10.869);\n c.lineTo(13.57, -2.5);\n c.closePath();\n c.fill('nonzero');\n c.beginPath();\n c.moveTo(-6.519, -2.5);\n c.lineTo(-8.5, 1.108);\n c.lineTo(13.57, 14.408);\n c.lineTo(15.551, 10.8);\n c.lineTo(-6.519, -2.5);\n c.closePath();\n c.fill('nonzero');\n};\n\nconst drawCross = (c, { x, y }, percent) => {\n x -= 12;\n y -= 12;\n\n if (percent) {\n c.font = '16px Roboto';\n c.fillStyle = '#EDD500';\n c.fillText(`${percent}%`, x, y - 5);\n }\n\n c.setTransform(1.33333, 0, 0, 1.33333, x, y);\n c.setTransform(1, 0, 0, 1, x, y);\n c.setTransform(1, 0, 0, 1, x + 5.9, y + 6);\n c.setTransform(1, 0, 0, 1, x + 8.159, y);\n c.beginPath();\n c.moveTo(0, 12);\n c.bezierCurveTo(0, 5.37258, 1.71967, 0, 3.841, 0);\n c.bezierCurveTo(5.96233, 0, 7.682, 5.37258, 7.682, 12);\n c.bezierCurveTo(7.682, 18.62742, 5.96233, 24, 3.841, 24);\n c.bezierCurveTo(1.71967, 24, 0, 18.62742, 0, 12);\n c.fillStyle = '#EDD500';\n c.fill('nonzero');\n c.setTransform(1, 0, 0, 1, x + 5.9, y + 2.427);\n c.beginPath();\n c.moveTo(18.1, 10.141);\n c.bezierCurveTo(14.52911, 12.50002, 10.37702, 13.82904, 6.1, 13.982);\n c.bezierCurveTo(1.82298, 13.82904, -2.3291, 12.50002, -5.9, 10.141);\n c.bezierCurveTo(-2.32911, 7.78198, 1.82299, 6.45296, 6.1, 6.3);\n c.bezierCurveTo(10.37702, 6.45296, 14.5291, 7.78198, 18.1, 10.141);\n // c.closePath();\n c.fill('nonzero');\n};\n\nconst drawTriangle = (c, { x, y }, percent) => {\n if (percent) {\n c.font = '16px Roboto';\n c.fillStyle = '#EDD500';\n c.fillText(`${percent}%`, x - 10, y - 20);\n }\n\n const side = 26;\n const h = side * (Math.sqrt(3) / 2);\n\n c.fillStyle = '#EDD500';\n\n // c.save();\n c.translate(x, y);\n\n // c.beginPath();\n\n c.moveTo(0, -h / 2);\n c.lineTo(-side / 2, h / 2);\n c.lineTo(side / 2, h / 2);\n c.lineTo(0, -h / 2);\n c.stroke();\n c.fill();\n};\n\nconst shapeMaps = {\n arrow: drawArrow,\n 3: drawFlake,\n 1: drawCross,\n 2: drawTriangle,\n};\n\nconst drawHandles = (context, evtDetail, handles, options = {}) => {\n const element = evtDetail.element;\n const defaultColor = toolColors.getToolColor();\n\n context.strokeStyle = options.color || defaultColor;\n\n const handleKeys = Object.keys(handles);\n\n for (let i = 0; i < handleKeys.length; i++) {\n const handleKey = handleKeys[i];\n const handle = handles[handleKey];\n\n if (handle.drawnIndependently === true) {\n continue;\n }\n\n if (options.drawHandlesIfActive === true && !handle.active) {\n continue;\n }\n\n const lineWidth = handle.active ? toolStyle.getActiveWidth() : toolStyle.getToolWidth();\n const fillStyle = options.fill;\n const shape = handle.shape || 'arrow';\n\n path(\n context,\n {\n lineWidth,\n fillStyle,\n },\n context => {\n const handleCanvasCoords = cornerstone.pixelToCanvas(element, handle);\n shapeMaps[shape](context, handleCanvasCoords, handle.percentage);\n },\n );\n }\n};\n\nexport default drawHandles;\n","/* eslint-disable import/no-anonymous-default-export */\n/**\n * Create a new {@link CanvasRenderingContext2D|context} object for the given {@link HTMLCanvasElement|canvas}\n * and set the transform to the {@link https://www.w3.org/TR/2dcontext/#transformations|identity transform}.\n *\n * @public\n * @function getNewContext\n * @memberof Drawing\n *\n * @param {HTMLCanvasElement} canvas - Canvas you would like the context for\n * @returns {CanvasRenderingContext2D} - The provided canvas's 2d context\n */\nexport default function(canvas) {\n const context = canvas.getContext('2d');\n\n context.setTransform(1, 0, 0, 1, 0, 0);\n\n return context;\n}\n","import toolColors from './../stateManagement/toolColors.js';\n\nconst configuration = {\n iconSize: 16,\n viewBox: {\n x: 16,\n y: 16,\n },\n mousePoint: {\n x: 8,\n y: 8,\n },\n mousePointerGroupString: `\n \n \n {showGenuie && (\n
\n )}\n {viewportState && \n {genuieShapes.map((item, i) => {\n const Icon = item.icon;\n const shapesCount = sumShapes(dicomData.images, item.shape);\n return (\n \n );\n })}\n
\n )}\n \n
\n )}\n {step.has_switcher && (\n \n \n \n 0{dicomData.patient.age}Y {dicomData.imageLaterality} {dicomData.viewPosition}\n \n
\n \n
\n )}\n {/* {viewportState && (\n \n {switchers.map(item => (\n setStackControl(item.value)}\n className={stackControl === item.value ? 'active' : ''}\n >\n {item.name}\n \n ))}\n
\n \n No Image Available\n
\n )}\n \n );\n};\n\nexport default CanvasView;\n","import React, { useRef } from 'react';\nimport { openFullscreen, closeFullscreen } from 'utils/appHelpers';\n\nimport iconMax from 'assets/arrows/2p.svg';\nimport iconMin from 'assets/arrows/4a.svg';\nimport BackButton from 'shared/BackButton';\nimport useOutsideClick from 'shared/hooks/useOutsideClick';\nimport { saveToStore, getFromStore } from 'utils/storeHelpers';\n\nconst ControlArea = ({\n tools,\n course,\n fullScreen,\n activeTool,\n setActiveTool,\n history,\n viewerOptions,\n disabled,\n}) => {\n const toolClickHandle = item => {\n const state =\n item.type === activeTool.type && !item.onTimeAction ? { type: 'none' } : { ...item };\n setActiveTool(state);\n };\n\n const tooltipRef = useRef();\n\n useOutsideClick(tooltipRef, () => tooltipRef.current.classList.remove('hover'));\n\n return (\n \n
\n );\n};\n\nexport default ControlArea;\n","import step2Icon from 'assets/stepsnew/2n.svg';\nimport step2IconActive from 'assets/stepsnew/2s.svg';\nimport step2IconPassed from 'assets/stepsnew/2p.svg';\nimport step2IconPActive from 'assets/stepsnew/2ps.svg';\n\nimport step3Icon from 'assets/stepsnew/3n.svg';\nimport step3IconActive from 'assets/stepsnew/3s.svg';\nimport step3IconPassed from 'assets/stepsnew/3p.svg';\nimport step3IconPActive from 'assets/stepsnew/3ps.svg';\n\nimport step4Icon from 'assets/stepsnew/4n.svg';\nimport step4IconActive from 'assets/stepsnew/4s.svg';\nimport step4IconPassed from 'assets/stepsnew/4p.svg';\nimport step4IconPActive from 'assets/stepsnew/4ps.svg';\n\nimport tool4Icon from 'assets/tools/4p.svg';\nimport tool4IconActive from 'assets/tools/4a.svg';\nimport tool5Icon from 'assets/tools/5p.svg';\nimport tool5IconActive from 'assets/tools/5a.svg';\nimport tool6Icon from 'assets/tools/6p.svg';\nimport tool6IconActive from 'assets/tools/6a.svg';\nimport tool7Icon from 'assets/tools/7p.svg';\nimport tool7IconActive from 'assets/tools/7a.svg';\nimport tool8Icon from 'assets/tools/8p.svg';\nimport tool8IconActive from 'assets/tools/8a.svg';\nimport tool9Icon from 'assets/tools/9p.svg';\nimport tool9IconActive from 'assets/tools/9a.svg';\n\nconst dicomTypes = {\n '3dq': '3DQ',\n i2d: '2D',\n g2d: '2D',\n r2d: '2D',\n tomo: 'tomo',\n sub: 'tomo',\n};\n\nexport const stepsProperties = {\n RCC: {\n active: true,\n position: 'right',\n thumbpos: 'left',\n has_switcher: false,\n dataType: '2D',\n key: 'RCC',\n },\n LCC: {\n active: true,\n position: 'left',\n thumbpos: 'right',\n has_switcher: false,\n dataType: '2D',\n key: 'LCC',\n },\n RMLO: {\n active: true,\n key: 'RMLO',\n position: 'right',\n thumbpos: 'left',\n has_switcher: false,\n dataType: '2D',\n },\n LMLO: {\n active: true,\n key: 'LMLO',\n position: 'left',\n thumbpos: 'right',\n has_switcher: false,\n dataType: '2D',\n },\n};\n\nexport const answerSteps = [\n {\n id: 1,\n name: '2D CC Views',\n icon: step2Icon,\n iconActive: step2IconActive,\n iconPassed: step2IconPassed,\n iconPassedActive: step2IconPActive,\n },\n {\n id: 2,\n name: '2D MLO Views',\n icon: step3Icon,\n iconActive: step3IconActive,\n iconPassed: step3IconPassed,\n iconPassedActive: step3IconPActive,\n },\n {\n id: 3,\n name: '2D/3D RCC Views',\n icon: step4Icon,\n iconActive: step4IconActive,\n iconPassed: step4IconPassed,\n iconPassedActive: step4IconPActive,\n },\n];\n\nexport const answerTools = [\n {\n name: 'R',\n title: 'Reset Viewers',\n icon: tool4Icon,\n iconActive: tool4IconActive,\n type: 'reset',\n cursor: 'default',\n onTimeAction: true,\n },\n {\n name: 'P',\n title: 'Activate Panning Tool',\n icon: tool5Icon,\n iconActive: tool5IconActive,\n type: 'pan',\n cursor: 'pan',\n onTimeAction: false,\n },\n {\n name: 'I Z',\n title: 'Activate Interactive Zoom',\n icon: tool6Icon,\n iconActive: tool6IconActive,\n type: 'zoomInteractive',\n cursor: 'izoom',\n onTimeAction: false,\n },\n {\n name: 'Z 1:1',\n title: 'Activate 1:1 Tool',\n icon: tool7Icon,\n iconActive: tool7IconActive,\n type: 'zoom1_1',\n cursor: 'fullzoom',\n onTimeAction: false,\n },\n {\n name: 'M',\n title: 'Activate Magnifier Tool',\n icon: tool8Icon,\n iconActive: tool8IconActive,\n type: 'zoomMagnifier',\n cursor: 'mzoom',\n onTimeAction: false,\n },\n {\n name: 'W/L',\n title:\n 'Activate Window/Level Tool (W; for presets move mouse over viewer and press numeric keys 1, 2, 3, ...)',\n icon: tool9Icon,\n iconActive: tool9IconActive,\n type: 'windowLevel',\n cursor: 'wlevel',\n onTimeAction: false,\n },\n];\n\nexport const getToolByType = type => {\n return answerTools.find(item => item.type === type);\n};\n\nexport const mergeSteps = (views, backSteps) => {\n if (!backSteps || !backSteps.length) return [];\n const result = backSteps.map((item, index) => {\n const step = backSteps[index];\n item.stepType = step.stepType;\n if (step.stepType === 'case') {\n const left = step.caseLeftFrame;\n const right = step.caseRightFrame;\n const leftDicom = Object.values(views).find(d => d.images.find(i => i.id === left.imageId));\n const rightDicom = Object.values(views).find(d => d.images.find(i => i.id === right.imageId));\n item.views = {};\n if (leftDicom) {\n const { imageLaterality, viewPosition, images, dicomImageType } = leftDicom;\n const imageIndex = images.findIndex(i => i.id === left.imageId);\n const dataType = dicomTypes[dicomImageType];\n const name = `${imageLaterality}${viewPosition}`;\n item.views[`${dataType}_${name}_left`] = {\n ...stepsProperties[name],\n imageIndex,\n dataType: dataType,\n };\n }\n if (rightDicom) {\n const { imageLaterality, viewPosition, images, dicomImageType } = rightDicom;\n const imageIndex = images.findIndex(i => i.id === right.imageId);\n const dataType = dicomTypes[dicomImageType];\n const name = `${imageLaterality}${viewPosition}`;\n item.views[`${dataType}_${name}_right`] = {\n ...stepsProperties[name],\n imageIndex,\n dataType: dataType,\n };\n }\n } else {\n item.views = {\n image: step.imageUrl,\n };\n }\n return item;\n });\n const cleaned = result.filter(\n i =>\n (i.stepType === 'image' && i.imageUrl) ||\n (i.stepType === 'case' && Object.keys(i.views).length),\n );\n\n return cleaned;\n};\n","/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React, { useEffect, useRef, useState } from 'react';\n\nimport { getDefaultType } from '../../../configs';\nimport CanvasView from '../../CanvasView';\nimport ControlArea from '../../ControlArea';\nimport { answerTools } from '../configs';\nimport { createArrayWithIncrementingNumbers } from 'utils/createHelpers';\nimport { LeftArrow, RightArrow } from 'shared/components/Icons';\nimport { IconCase, IconDicomSmall } from 'shared/components/Icons';\n\nimport step1Icon from 'assets/answers/step1.png';\nimport step2Icon from 'assets/answers/step2.png';\nimport step3Icon from 'assets/answers/step3.png';\n\nconst mock = [step1Icon, step2Icon, step3Icon];\n\nconst AnswerViewer = ({ data, mergedSteps, activeStep, setActiveStep }) => {\n const [activeTool, setActiveTool] = useState({});\n const [fullScreen, setFullScreen] = useState(!!document.fullscreenElement);\n const [isScrollAtStart, setIsScrollAtStart] = useState(true);\n const [isScrollAtEnd, setIsScrollAtEnd] = useState(false);\n\n const scrollContainerRef = useRef(null);\n\n const stepsArr = createArrayWithIncrementingNumbers(mergedSteps?.length);\n\n const isListOverThree = stepsArr?.length > 3;\n\n const fullScreenChange = () => {\n document.addEventListener('fullscreenchange', e => {\n setFullScreen(!!document.fullscreenElement);\n });\n };\n\n const scrollLeft = () => {\n if (scrollContainerRef.current) {\n scrollContainerRef.current.scrollTo({\n left: scrollContainerRef.current.scrollLeft - 400,\n behavior: 'smooth',\n });\n }\n };\n\n const scrollRight = () => {\n if (scrollContainerRef.current) {\n scrollContainerRef.current.scrollTo({\n left: scrollContainerRef.current.scrollLeft + 400,\n behavior: 'smooth',\n });\n }\n };\n\n useEffect(() => {\n fullScreenChange();\n //eslint-disable-next-line\n }, []);\n\n if (!mergedSteps || !mergedSteps[activeStep]) {\n return (\n \n
\n \n {!fullScreen && history && {\n tooltipRef.current.classList.remove('hover');\n saveToStore('viewerToolTip', true);\n }}\n >\n \n e.stopPropagation()}\n >\n {fullScreen ? 'Normal ' : 'Full '}Screen\n
\n Click this button to\n {fullScreen ? ' turn off the full screen' : ' display the viewer in full screen'}\n \n \n {course &&
\n \n Click this button to\n {fullScreen ? ' turn off the full screen' : ' display the viewer in full screen'}\n \n \n {course &&
{course.title}
}\n\n
\n \n
\n \n {tools.map(item => {\n const isSeparator = item.type === 'separator';\n const canActive = viewerOptions && viewerOptions.canBeActive[item.type];\n const isActive = (activeTool.type === item.type && !item.onTimeAction) || canActive;\n if (isSeparator) return ;\n return (\n \n {item.icon && (\n
\n \n No answers frame provided for this case\n
\n );\n }\n\n const activeStepData = mergedSteps[activeStep];\n\n const activeStepIsImage = activeStepData && activeStepData.stepType === 'image';\n const stepViews = mergedSteps[activeStep].views;\n const stepViewsData = Object.keys(stepViews);\n const viewsCount = Object.values(stepViews).length;\n\n const viewSizesForced = () => {\n return {\n width: (window.innerWidth - (fullScreen ? 548 : 240 + 530)) / viewsCount,\n height: window.innerHeight - 290,\n };\n };\n\n const getImage = index => {\n try {\n const step = mergedSteps[index];\n const { key, dataType, imageIndex = 0 } = step.views[Object.keys(step.views)[0]];\n const dicomTypeData = {\n tomo: data[`${key}_TOMO`],\n '2D': data[`${key}_2D`],\n '3DQ': data[`${key}_3DQ`],\n };\n\n const control = getDefaultType(dataType, dicomTypeData);\n const dicomData = dicomTypeData[control];\n return step.stepType === 'image' ? step.views.image : dicomData.images[imageIndex].url;\n } catch (err) {\n return mock[index];\n }\n };\n\n const getType = index => {\n try {\n const step = mergedSteps[index];\n return step.stepType;\n } catch (err) {\n return mock[index];\n }\n };\n\n const handleScroll = event => {\n const { scrollWidth, scrollLeft, clientWidth } = event.target;\n const isAtStart = scrollLeft === 0;\n const isAtEnd = scrollLeft + clientWidth === scrollWidth;\n setIsScrollAtStart(isAtStart);\n setIsScrollAtEnd(isAtEnd);\n };\n\n return (\n \n setActiveStep(index)}\n className={`position-relative pointer flex-fill ${\n activeStep === index ? 'active' : ''\n }`}\n >\n \n
\n );\n })}\n {isListOverThree && (\n \n setActiveTool(tool)}\n tools={answerTools}\n disabled={activeStepIsImage}\n />\n
\n \n {stepViewsData.map((key, index) => {\n const item = stepViews[key];\n if (activeStepIsImage) {\n return (\n \n ;\n
\n );\n }\n return (\n \n setActiveTool(tool)}\n fullScreen={fullScreen}\n viewsCount={viewsCount}\n viewSizesForced={viewSizesForced}\n currentImageIndex={item.imageIndex}\n />\n
\n );\n })}\n \n \n {isListOverThree && (\n \n
\n )}\n {stepsArr.map(index => {\n return (\n \n {\n
\n \n {getType(index) === 'case' ? (\n
\n }\n \n You must first review all steps of the hanging protocol as indicated below\n
\n );\n};\n\nexport default DisabledPart;\n","import React, { useEffect, useState } from 'react';\nimport { useSnackbar } from 'notistack';\nimport { useDispatch } from 'react-redux';\nimport { getCourses } from 'app/Main/routes/Courses/actions';\nimport InformationPart from './components/InformationPart';\nimport AnswerViewer from './components/AnswerViewer';\nimport DisabledPart from './components/DisabledPart';\nimport { getError } from 'utils/appHelpers';\nimport { Api } from 'utils/connectors';\nimport Loading from 'shared/components/Loading';\nimport { mergeSteps } from './configs';\n\nconst ExplanationModal = ({ isDisabled, updateStep, caseData, caseId, caseViews }) => {\n const { enqueueSnackbar } = useSnackbar();\n const dispatch = useDispatch();\n const [fetch, setFetch] = useState(false);\n const [data, setData] = useState();\n const [activeStep, setActiveStep] = useState(0);\n\n const sendUpdate = async () => {\n await updateStep(10);\n dispatch(getCourses());\n };\n\n const getAnswersData = async () => {\n try {\n setFetch(true);\n const { data } = await Api.get(`/cases/getanswers/${caseId}`);\n data.data.mergedSteps = mergeSteps(caseViews, data.data.answers);\n setData(data.data);\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n } finally {\n setFetch(false);\n }\n };\n\n useEffect(() => {\n if (!isDisabled) sendUpdate();\n getAnswersData();\n //eslint-disable-next-line\n }, []);\n\n if (isDisabled) return No Answers Provided for this lesson
\n );\n\n return (\n \n
\n );\n};\n\nexport default ExplanationModal;\n","import React from 'react';\nimport CaseLeftIcon from 'assets/arrows/caseLeft.svg';\nimport CaseRightIcon from 'assets/arrows/caseRight.svg';\n\nconst Switcher = ({ name, previews, next, disabled, current, allCount, highlightNext }) => {\n return (\n \n
\n \n
\n \n \n allCount || disabled}\n >\n \n \n
\n );\n};\n\nexport default Switcher;\n","import React, { useEffect } from 'react';\nimport Switcher from './Switcher';\nimport { IconAbout } from 'shared/components/Icons';\nimport checkIcon from 'assets/arrows/3p.svg';\nimport StepLeftIcon from 'assets/arrows/stepLeft.svg';\nimport StepRightIcon from 'assets/arrows/stepRight.svg';\n\nconst StepsArea = ({\n reduxLesson,\n steps,\n completedSteps,\n activeCase,\n activeStep,\n changeActiveCase,\n changeActiveStep,\n setActiveStep,\n onHelpModalOpen,\n}) => {\n const isLastCase = activeCase === reduxLesson.caseIds.length - 1;\n const isLastStep = activeStep === steps.length - 1;\n const highlightNextCase = isLastStep && !isLastCase;\n\n const handleStepChange = bool => {\n setActiveStep(current => {\n const disabledPrev = current - 1 < 0;\n const disabledNext = Number(current) + 2 > steps.length;\n if ((bool && !disabledNext) || (!bool && !disabledPrev)) {\n changeActiveStep(current - (bool ? -1 : 1));\n }\n if (bool && disabledNext && !isLastCase) {\n handleCaseChange(true);\n }\n return current;\n });\n };\n\n const handleCaseChange = bool => {\n changeActiveCase(activeCase - (bool ? -1 : 1));\n changeActiveStep(0);\n };\n\n const disabledPrev = () => {\n return activeStep - 1 < 0;\n };\n\n // const goToFeedback = () => {\n // history.push(getFeedbackUrl(reduxCourse));\n // };\n\n const handleUserKeyPress = event => {\n const { keyCode } = event;\n if (keyCode === 37) handleStepChange(false);\n if (keyCode === 39) handleStepChange(true);\n };\n\n useEffect(() => {\n window.addEventListener('keydown', handleUserKeyPress);\n return () => {\n window.removeEventListener('keydown', handleUserKeyPress);\n };\n //eslint-disable-next-line\n }, []);\n\n return (\n \n {name} {current + 1} of {allCount}\n
\n\n
\n );\n};\n\nexport default StepsArea;\n","const findPosition = oElement => {\n if (typeof oElement.offsetParent != 'undefined') {\n for (var posX = 0, posY = 0; oElement; oElement = oElement.offsetParent) {\n posX += oElement.offsetLeft;\n posY += oElement.offsetTop;\n }\n return [posX, posY];\n } else {\n return [oElement.x, oElement.y];\n }\n};\n\nexport const getCoordinates = (e, el) => {\n let PosX = 0;\n let PosY = 0;\n let ImgPos;\n ImgPos = findPosition(el);\n if (!e) e = window.event;\n if (e.pageX || e.pageY) {\n PosX = e.pageX;\n PosY = e.pageY;\n } else if (e.clientX || e.clientY) {\n PosX = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;\n PosY = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;\n }\n PosX -= ImgPos[0];\n PosY -= ImgPos[1];\n return { x: PosX, y: PosY };\n};\n","import React, { useEffect, useRef, useState } from 'react';\nimport { useSnackbar } from 'notistack';\nimport { getCoordinates } from './utils';\nimport { getError } from 'utils/appHelpers';\nimport { Api } from 'utils/connectors';\nimport Loading from 'shared/components/Loading';\n\nconst getCirclePostions = (pos, imgEl) => {\n if (!pos || !imgEl || !imgEl.current) return {};\n const { naturalWidth, naturalHeight, clientWidth, clientHeight } = imgEl.current;\n const widthScale = pos.x / naturalWidth;\n const heightScale = pos.y / naturalHeight;\n const res = {\n left: widthScale * clientWidth,\n top: heightScale * clientHeight,\n };\n return res;\n};\n\nconst HeatmapModal = ({ caseId, lessonId, userLessonId, updateStep, isDisabled, isOpened }) => {\n const { enqueueSnackbar } = useSnackbar();\n const [positions, setPositions] = useState();\n const [fetch, setFetching] = useState();\n const [dicom, setDicom] = useState();\n const imgEl = useRef();\n\n const selectText = positions\n ? 'Thank you, your selection is submitted.'\n : 'Please select by one mouse click a most probable calcification you may notice.';\n\n const onMouseDownOnImage = async e => {\n if (positions) return;\n try {\n const cords = getCoordinates(e, imgEl.current);\n const { naturalWidth, naturalHeight, clientWidth, clientHeight } = imgEl.current;\n const widthScale = cords.x / clientWidth;\n const heightScale = cords.y / clientHeight;\n const pos = {\n x: widthScale * naturalWidth,\n y: heightScale * naturalHeight,\n };\n const { caseId, dicomId, imageId } = dicom;\n await Api.post(`/dicom/saveheatmapdata`, { ...pos, userLessonId, caseId, dicomId, imageId });\n setPositions(pos);\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n const getHeatMapImage = async () => {\n try {\n setFetching(true);\n const { data } = await Api.get(`/cases/getheatmaps/${lessonId}/${caseId}`);\n const dicom = data.data && data.data[0];\n if (!dicom) return;\n const points = await Api.get(`/dicom/lessonheatmapdata/${userLessonId}/${caseId}`);\n const point = points.data.data && points.data.data[0];\n if (!isOpened) await updateStep(11);\n setDicom(dicom);\n if (point) {\n setTimeout(setPositions, 500, point);\n }\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n } finally {\n setFetching(false);\n }\n };\n\n useEffect(() => {\n getHeatMapImage();\n //eslint-disable-next-line\n }, []);\n\n if (isDisabled)\n return (\n \n \n
\n \n \n \n \n {steps.map((item, index) => {\n const isActive = completedSteps.includes(index);\n const isExplanator = item.name === 'explanator';\n // const isHeatmap = item.name === 'heatmap';\n const isNeedToDone =\n activeStep >= 9 &&\n completedSteps.length < 10 &&\n !isActive &&\n activeStep !== index &&\n !isExplanator;\n return (\n changeActiveStep(index)}\n >\n {isActive && }\n {item.icon && (\n steps.length}\n >\n \n \n
\n \n You must first review all steps of the hanging protocol as indicated below\n
\n );\n\n if (fetch) return \n This step is not required for this case\n
\n );\n }\n\n return (\n \n
\n );\n};\n\nexport default HeatmapModal;\n","import React, { useState, useEffect } from 'react';\nimport { useSelector, useDispatch } from 'react-redux';\nimport HelpModal from './components/HelpModal/';\nimport QuestionaryModal from './components/QuestionaryModal/';\nimport ExplanationModal from './components/ExplanationModal/';\nimport ControlArea from './components/ControlArea';\nimport StepsArea from './components/StepsArea';\nimport CanvasView from './components/CanvasView';\nimport { steps as initialSteps, tools } from './configs';\n\nimport './style.scss';\nimport { Api } from 'utils/connectors';\nimport { generateViewerData } from './utils';\nimport Loading from 'shared/components/Loading';\nimport { onCourseUpdate } from '../Courses/actions';\nimport HeatmapModal from './components/HeatmapModal';\nimport { removeFromStore } from 'utils/storeHelpers';\nimport { getError } from 'utils/appHelpers';\nimport { useSnackbar } from 'notistack';\n\nconst Viewer = ({ match, history }) => {\n const { enqueueSnackbar } = useSnackbar();\n const courses = useSelector(store => store.courses);\n const viewerOptions = useSelector(state => state.viewerOptions);\n const dispatch = useDispatch();\n const { courseId, lessonId } = match.params;\n\n const [activeTool, setActiveTool] = useState({});\n const [fullScreen, setFullScreen] = useState(false);\n\n const [fetch, setFetch] = useState();\n const [course, setCourse] = useState();\n const [activeCase, setActiveCase] = useState(0);\n const [activeStep, setActiveStep] = useState(0);\n\n const [openHelpModal, setOpenHelpModal] = useState(false);\n\n const reduxCourse = courses.find(item => item.id === Number(courseId));\n const reduxLesson =\n reduxCourse && reduxCourse.lessons.find(lesson => lesson.id === Number(lessonId));\n\n const activeCaseId = reduxLesson?.caseIds?.[activeCase]?.caseId || 0;\n const activeCaseEpisodes =\n reduxLesson?.episodes?.length && reduxLesson.episodes.filter(ep => ep.caseId === activeCaseId);\n const sortedActiveCaseEpisodes =\n activeCaseEpisodes &&\n [...activeCaseEpisodes].sort((ep1, ep2) => {\n return ep1.orderNum - ep2.orderNum;\n });\n\n const fullScreenChange = () => {\n document.addEventListener('fullscreenchange', e => {\n setFullScreen(!!document.fullscreenElement);\n });\n };\n\n const handelActiveToolChange = tool => {\n setActiveTool(tool);\n if (tool && tool.type === 'findingReset') resetFinding();\n };\n\n const getCases = async () => {\n if (!reduxLesson || !reduxLesson.caseIds || !reduxLesson.caseIds.length) return;\n const { caseId, caseUniqueId } = reduxLesson.caseIds[activeCase];\n const endpoint = `/cases/getcasebyid/${caseUniqueId || caseId}?lut=1&dicomType=all`;\n const { data } = await Api.get(endpoint);\n const cases = generateViewerData(data.data, reduxLesson);\n setCourse({\n title: reduxLesson.name,\n lesson: reduxLesson,\n cases,\n });\n // Update first step\n if (!cases[0].completed_steps.includes(0)) {\n updateDicomStepData(0);\n }\n };\n\n const onCaseChange = async value => {\n if (!course.cases[value]) {\n setFetch(true);\n const { caseId, caseUniqueId } = reduxLesson.caseIds[value];\n const endpoint = `/cases/getcasebyid/${caseUniqueId || caseId}?lut=1&dicomType=all`;\n const { data } = await Api.get(endpoint);\n const caseData = generateViewerData(data.data, reduxLesson);\n const cases = [...course.cases, ...caseData];\n if (!cases[value].completed_steps.includes(0)) {\n updateDicomStepData(0, caseId);\n cases[value].completed_steps.push(0);\n }\n await setCourse({ ...course, cases });\n await setActiveCase(value);\n setFetch(false);\n } else {\n setActiveCase(value);\n }\n };\n\n const updateLessonsEpisode = index => {\n const tempCourse = { ...reduxCourse };\n const lessonIndex = tempCourse.lessons.findIndex(item => item.id === Number(lessonId));\n const tempLesson = tempCourse.lessons[lessonIndex];\n const tempEpisode = tempLesson.episodes.find(\n ep => ep.id === sortedActiveCaseEpisodes[index].id,\n );\n if (tempEpisode) {\n tempEpisode.status = 1;\n dispatch(onCourseUpdate(tempCourse));\n }\n };\n\n const updateDicomStepData = async (step, id) => {\n const caseId = id || reduxLesson.caseIds[activeCase].caseId;\n const body = {\n lessonId,\n completed: 1,\n step: step + 1,\n caseId: Number(caseId),\n courseId: reduxCourse?.id,\n };\n await Api.post('/courses/updateuserlesson', body);\n updateLessonsEpisode(step);\n };\n\n const updateAndAddCompletedStep = async step => {\n await updateDicomStepData(step);\n completedSteps.push(step);\n };\n\n const stepChangeHandler = async step => {\n const isModal = step === 9 || step === 10 || step === 11;\n if (isModal) setActiveTool({});\n if (!completedSteps.includes(step) && !isModal) {\n await updateAndAddCompletedStep(step);\n }\n setActiveStep(step);\n };\n\n const updateFinding = async body => {\n await Api.post('/dicom/savedicomvectordata', body);\n };\n\n const resetFinding = async () => {\n try {\n const body = {\n userLessonId: reduxLesson.userLessonId,\n caseId: Number(reduxLesson.caseIds[activeCase].caseId),\n };\n await Api.delete('/dicom/dicomvectordata', {\n data: body,\n });\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n const lessonStartLog = () => {\n Api.post('/courses/lesson/start', {\n courseId: reduxCourse.id,\n lessonId: reduxLesson.id,\n });\n };\n\n useEffect(() => {\n fullScreenChange();\n getCases();\n removeFromStore('viewerToolTip');\n lessonStartLog();\n //eslint-disable-next-line\n }, []);\n\n if (!course || fetch) return \n
\n Calcification Selection
\n\n
\n {selectText}
\n\n
\n \n \n {!isModal &&\n stepViewsData.map((item, index) => (\n
\n \n
\n );\n};\n\nexport default TestViewer;\n","import React from 'react';\nimport * as IconList from 'shared/components/Icons';\n\nconst Icons = () => {\n const keys = Object.keys(IconList);\n const bindKey = key => `<${key} />`;\n\n const copyToClipboard = str => {\n const el = document.createElement('textarea');\n el.value = `<${str} />`;\n document.body.appendChild(el);\n el.select();\n document.execCommand('copy');\n document.body.removeChild(el);\n };\n\n return (\n \n \n
\n \n
\n \n \n
\n \n
\n );\n};\n\nexport default Icons;\n","import React from 'react';\n\nconst ViewAlert = ({ data, optimalSettings, minimalSettings }) => {\n const { innerWidth, innerHeight } = data;\n return (\n <>\n {innerWidth >= optimalSettings.width && innerHeight >= optimalSettings.height ? (\n - \n {keys.map(key => {\n const Icon = IconList[key];\n return (\n
- \n \n\n
\n \n {bindKey(key)}\n\n\n\n \n );\n })}\n
Passed
\n ) : innerWidth >= minimalSettings.width && innerHeight >= minimalSettings.height ? (\n\n The optimal resolutions is {optimalSettings.width}x{optimalSettings.height}.\n
\n ) : (\n\n The window size is too small, for optimal image quality.\n
\n Hint: Maximize the browser window.\n
\n
\n \n Screen resolution:\n ({`${width}x${height}`})\n
\n\n Window resolution:\n ({`${innerWidth}x${innerHeight}`})\n
\n\n
\n );\n },\n);\n\nexport default Feedback;\n","export const MAX_WAIT_TIME = 7000;\n","import React from 'react';\nimport { MAX_WAIT_TIME } from '../../constants';\n\nconst ViewResult = ({ data }) => {\n const { min, max, avg } = data;\n const localMin = min > MAX_WAIT_TIME ? MAX_WAIT_TIME : min?.toFixed(0);\n const localMax = max > MAX_WAIT_TIME ? MAX_WAIT_TIME : max?.toFixed(0);\n const localAvg = avg > MAX_WAIT_TIME ? MAX_WAIT_TIME : avg?.toFixed(0);\n return (\n <>\n {!min && !max && !avg ? (\n No Response\n ) : (\n \n (Average: {avg > MAX_WAIT_TIME && `>`} {localAvg}ms, Min:{' '}\n {min > MAX_WAIT_TIME && `>`} {localMin}ms, Max: {max > MAX_WAIT_TIME && `>`}{' '}\n {localMax}ms)\n \n )}\n \n );\n};\n\nexport default ViewResult;\n","import React, { useEffect, useState, memo } from 'react';\nimport { Api } from 'utils/connectors';\nimport { getError } from 'utils/appHelpers';\nimport { useSnackbar } from 'notistack';\nimport { useDispatch } from 'react-redux';\nimport { setDiagnosticData } from '../../actions';\nimport SpinnerLoading from './../SpinnerLoading';\nimport Feedback from './../Feedback';\nimport ViewResult from './ViewResult';\nimport { MAX_WAIT_TIME } from '../../constants';\n\nconst threshold = 3; // This is the minimal threshold to count MIN, MAX and AVG\nconst repeatLimit = 2;\nconst limit = threshold + repeatLimit;\n\n// Latency\nconst settings = {\n optimal: 5000,\n minimal: 5000,\n timeout: MAX_WAIT_TIME,\n};\n\nconst requestUrl = '/common/test-latency';\n\nconst LatencyTest = () => {\n const { enqueueSnackbar } = useSnackbar();\n const dispatch = useDispatch();\n const [result, setResult] = useState(null);\n const [aborted, setAborted] = useState(false);\n\n const checkNetworkConnection = () => {\n if (result) return;\n\n const promises = [];\n\n for (let i = 1; i <= limit; i++) {\n promises.push(\n new Promise((resolve, reject) => {\n const start = performance.now();\n const timeoutId = setTimeout(() => {\n resolve(settings.timeout);\n }, settings.timeout);\n\n Api.get(requestUrl, { timeout: settings.timeout })\n .then(res => {\n clearTimeout(timeoutId);\n const millis = performance.now() - start;\n resolve(Math.round(millis % 60000));\n })\n .catch(err => {\n clearTimeout(timeoutId);\n reject(err);\n });\n }),\n );\n }\n\n Promise.allSettled(promises)\n .then(results => {\n const successfulResults = results.filter(r => r.status === 'fulfilled').map(r => r.value);\n const allTimedOut = successfulResults.every(res => res === MAX_WAIT_TIME);\n\n if (allTimedOut) throw new Error('All latency tests failed or timed out.');\n\n if (successfulResults.length > 0 && !allTimedOut) {\n // Process successful results\n let sorted = [...successfulResults];\n sorted.sort((a, b) => a - b);\n const avg = Math.round(sorted.reduce((a, b) => a + b) / sorted.length);\n const min = sorted[0];\n const max = sorted[sorted.length - 1];\n dispatch(\n setDiagnosticData({ latency: { avg, min, max, success: avg <= settings.optimal } }),\n );\n setResult({ avg, min, max, success: avg <= settings.optimal });\n }\n })\n .catch(err => {\n // Handle errors if all promises are rejected\n dispatch(setDiagnosticData({ failed: true, latencyTimedOut: true }));\n setAborted(true);\n setResult({ success: false });\n dispatch(setDiagnosticData({ latency: { success: false } }));\n enqueueSnackbar(getError(err), { variant: 'error' });\n });\n };\n\n useEffect(() => {\n checkNetworkConnection();\n }, [result]);\n\n return (\n <>\n {feedback[feedbackKey].text}
\n\n
\n \n Latency:\n \n {result ?
\n Hint: Try other internet connection.\n \n }\n aborted={aborted}\n />\n \n );\n};\n\nexport default memo(LatencyTest);\n","import React from 'react';\n\nconst ViewResult = ({ data, stoppedEarly, maxWaitTime }) => {\n const { received, duration } = data;\n const showingDuration = stoppedEarly ? Math.ceil(maxWaitTime) : duration?.toFixed(1);\n return (\n \n received {received} MB {duration > maxWaitTime ? '>' : 'in'} {showingDuration}s\n \n );\n};\n\nexport default ViewResult;\n","import React, { useState, useEffect, memo } from 'react';\n// import { useSelector } from 'react-redux';\nimport { useDispatch } from 'react-redux';\nimport { setDiagnosticData } from '../../actions';\nimport SpinnerLoading from './../SpinnerLoading';\nimport Feedback from './../Feedback';\nimport ViewResult from './ViewResult';\nimport { HOST } from 'configs';\n\nconst imageFile = `${HOST.API.CONTENT}/test/bw-test1.jpg`;\nconst downloadSize = 5083725; //bytes;\n\n// Bandwidth duration\nconst settings = {\n optimal: 8,\n minimal: 5,\n timeout: 35000,\n};\n\nconst minDownloadSpeed = settings.minimal / 8;\nconst minimalBandwidthBytesPerSecond = minDownloadSpeed * 1024 * 1024; // Convert Mbps to bytes per second\n\n// Calculate max wait time (in seconds)\nconst maxBandwidthWaitTime = downloadSize / minimalBandwidthBytesPerSecond;\n\nsettings.minimal = maxBandwidthWaitTime;\nsettings.optimal = (maxBandwidthWaitTime * 2) / 3;\n\nconst BandwidthTest = ({ stoppedEarly, setStoppedEarly }) => {\n // Check wether the bandwith data is exists in the redux store\n // const testCompleted = useSelector(state => state.diagnosticData.bandwidth);\n const dispatch = useDispatch();\n const [result, setResult] = useState(null);\n const [aborted, setAborted] = useState(false);\n\n const checkBandwidth = () => {\n if (aborted) return;\n\n let startTime, intervalId;\n const download = new Image();\n\n download.onload = function() {\n clearInterval(intervalId); // Clear the interval when the image loads successfully\n showResults((new Date().getTime() - startTime) / 1000);\n };\n\n download.onerror = function(err, msg) {\n clearInterval(intervalId); // Clear the interval in case of an error\n setAborted(true);\n };\n\n const checkDuration = () => {\n const currentDuration = (new Date().getTime() - startTime) / 1000;\n if (currentDuration > maxBandwidthWaitTime) {\n clearInterval(intervalId); // Stop the interval check\n download.src = ''; // Stop downloading the image\n showResults(currentDuration, true); // Pass true to indicate the test was stopped\n }\n };\n\n startTime = new Date().getTime();\n const cacheBuster = '?nnn=' + startTime;\n download.src = imageFile + cacheBuster;\n\n intervalId = setInterval(checkDuration, 100); // Start the interval check loop\n\n function showResults(duration, stoppedEarly = false) {\n const result = {\n received: 5.2,\n duration,\n success: duration <= settings.optimal,\n failed: duration > settings.minimal,\n };\n setStoppedEarly(stoppedEarly);\n setResult(result);\n }\n };\n\n useEffect(() => {\n if (result) {\n dispatch(setDiagnosticData({ bandwidth: result }));\n }\n }, [dispatch, result]);\n\n useEffect(() => {\n if (aborted && !stoppedEarly) {\n dispatch(setDiagnosticData({ failed: true }));\n }\n }, [aborted, dispatch]);\n\n useEffect(() => {\n checkBandwidth();\n //eslint-disable-next-line\n }, []);\n\n return (\n <>\n
\n
\n \n Bandwidth:\n \n {aborted && !stoppedEarly ? (\n 'No Response.'\n ) : result ? (\n
\n Hint: Try other internet connection.\n \n }\n aborted={aborted}\n />\n \n );\n};\n\nexport default memo(BandwidthTest);\n","import React, { useState, useEffect, useCallback } from 'react';\nimport { useSnackbar } from 'notistack';\nimport { useSelector, useDispatch } from 'react-redux';\nimport { setDiagnosticData } from './actions';\nimport { Api } from 'utils/connectors';\nimport { getError } from 'utils/appHelpers';\nimport { IconRight } from 'shared/components/Icons';\nimport { ResolutionTest, LatencyTest, BandwidthTest } from './components';\nimport Modal from 'react-modal';\nimport SpinnerLoading from './components/SpinnerLoading';\nimport Feedback from './components/Feedback';\nimport { saveToStore } from 'utils/storeHelpers';\n\nnavigator.userAgentVersion = (function() {\n var ua = navigator.userAgent;\n var tem;\n var M = ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\\/))\\/?\\s*(\\d+)/i) || [];\n if (/trident/i.test(M[1])) {\n tem = /\\brv[ :]+(\\d+)/g.exec(ua) || [];\n return 'IE ' + (tem[1] || '');\n }\n if (M[1] === 'Chrome') {\n tem = ua.match(/\\b(OPR|Edge)\\/(\\d+)/);\n if (tem != null)\n return tem\n .slice(1)\n .join(' ')\n .replace('OPR', 'Opera');\n }\n M = M[2] ? [M[1], M[2]] : [navigator.appName, navigator.appVersion, '-?'];\n if ((tem = ua.match(/version\\/(\\d+)/i)) != null) M.splice(1, 1, tem[1]);\n return M.join(' ');\n})();\n\nnavigator.userOsInfo = (function() {\n var OSName = 'Unknown';\n if (window.navigator.userAgent.indexOf('Windows NT 10.0') !== -1) OSName = 'Windows 10';\n if (window.navigator.userAgent.indexOf('Windows NT 6.2') !== -1) OSName = 'Windows 8';\n if (window.navigator.userAgent.indexOf('Windows NT 6.1') !== -1) OSName = 'Windows 7';\n if (window.navigator.userAgent.indexOf('Windows NT 6.0') !== -1) OSName = 'Windows Vista';\n if (window.navigator.userAgent.indexOf('Windows NT 5.1') !== -1) OSName = 'Windows XP';\n if (window.navigator.userAgent.indexOf('Windows NT 5.0') !== -1) OSName = 'Windows 2000';\n if (window.navigator.userAgent.indexOf('Mac') !== -1) OSName = 'Mac/OS';\n if (window.navigator.userAgent.indexOf('X11') !== -1) OSName = 'UNIX';\n if (window.navigator.userAgent.indexOf('Linux') !== -1) OSName = 'Linux';\n return OSName;\n})();\n\nlet fetching = false;\n\nconst ConnectionAndDeviceTestModal = ({ isOpen, onFinish }) => {\n const { enqueueSnackbar } = useSnackbar();\n const dispatch = useDispatch();\n const storageData = useSelector(state => state.diagnosticData);\n\n const [finished, setFinished] = useState(false);\n const [requestConfirmation, setRequestConfirmation] = useState(false);\n const [disabled, setDisabled] = useState(false);\n const [stoppedEarly, setStoppedEarly] = useState(false);\n\n const sendConnectionAndTestResults = useCallback(async () => {\n if (fetching) return;\n fetching = true;\n const result = {\n testData: JSON.stringify({\n ...storageData,\n browser: navigator.userAgentVersion,\n os: navigator.userOsInfo,\n }),\n };\n try {\n await Api.post('/common/saveconnectiontest', { ...result });\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n fetching = false;\n }, [enqueueSnackbar, storageData]);\n\n const defineStorageKey = () => {\n saveToStore('connectionAndDeviceTested', true);\n };\n\n const finishAndCloseDialog = () => {\n defineStorageKey();\n dispatch(\n setDiagnosticData({\n resolution: null,\n latency: null,\n bandwidth: null,\n failed: false,\n }),\n );\n onFinish();\n };\n\n const setLoadingWidth = () => {\n const width = storageData.failed\n ? 100\n : (100 / 3) * Object.values(storageData).filter(v => v && v !== true).length; //objects count only\n return `${width}%`;\n };\n\n const setRequirementsCheckbox = () => {\n const { bandwidth, latency, resolution, failed } = storageData;\n const allSuccess =\n bandwidth &&\n bandwidth.success &&\n latency &&\n latency.success &&\n resolution &&\n resolution.success &&\n !failed;\n setDisabled(!allSuccess);\n setRequestConfirmation(!allSuccess);\n };\n\n const manageSuccess = useCallback(() => {\n const { resolution, latency, bandwidth } = storageData;\n const success = resolution.success && latency.success && bandwidth.success;\n setFinished(true);\n sendConnectionAndTestResults();\n if (!success) setRequirementsCheckbox();\n //eslint-disable-next-line\n }, [sendConnectionAndTestResults, storageData]);\n\n const manageFailure = useCallback(() => {\n setRequirementsCheckbox();\n //eslint-disable-next-line\n }, []);\n\n useEffect(() => {\n const { resolution, latency, bandwidth } = storageData;\n if (storageData.failed) manageFailure();\n if (resolution && latency && bandwidth) manageSuccess();\n }, [storageData, manageFailure, manageSuccess]);\n\n return (\n
\n
\n Connection Test
\n\n
\n \n
\n \n Connection to server:\n \n {!storageData.latency ? (\n
\n {requestConfirmation && (\n \n Continue\n
\n \n );\n};\n\nexport default ConnectionAndDeviceTestModal;\n","import React from 'react';\nimport { useLocation } from 'react-router';\nimport BackButton from 'shared/BackButton';\nimport CourseHeaderRightNav from '../CourseView/components/CourseHeaderRightNav';\n\nconst ProgressHeader = ({ course, history }) => {\n const location = useLocation();\n const isFromAccount = location.state && location.state.from === 'account';\n const options = {\n [isFromAccount ? 'noBackRoute' : 'route']: `/courses/${course.id}`,\n };\n\n return (\n \n setDisabled(!e.target.checked)}\n />\n \n
\n )}\n {(finished || requestConfirmation) && (\n \n
\n \n
\n );\n};\nexport default ProgressHeader;\n","import React from 'react';\n\nconst ProgressIncorectBar = ({ progress, correctProgress, className = '', isDICOM }) => {\n const hasInccorect =\n correctProgress !== null && correctProgress !== undefined && correctProgress !== 100;\n const incorrect = isDICOM\n ? progress - (progress * correctProgress) / 100\n : progress - (correctProgress || 0);\n const correct = isDICOM\n ? (progress * correctProgress) / 100\n : progress - (hasInccorect ? incorrect : 0);\n const isCompleted = progress >= 100;\n const status =\n !isCompleted && !hasInccorect\n ? 'progress'\n : isCompleted && !hasInccorect\n ? 'completed'\n : 'correct';\n return (\n \n \n {hasInccorect && (\n \n )}\n \n );\n};\n\nexport default ProgressIncorectBar;\n","import React, { useEffect } from 'react';\nimport { connect, useSelector } from 'react-redux';\nimport ProgressHeader from './ProgressHeader';\nimport ProgressIncorectBar from 'shared/components/ProgressIncorectBar';\nimport { getCourses } from './../Courses/actions/index';\n\nconst CourseProgress = ({ match, history, getCourses }) => {\n const courses = useSelector(state => state.courses);\n const course = courses.find(item => item.id === Number(match.params.id));\n\n useEffect(() => {\n getCourses();\n }, [getCourses]);\n\n if (course.isOpened) {\n return (\n \n
\n {!isFromAccount && \n
\n {course.name}\n \n
\n );\n }\n\n return (\n <>\n \n No Progress is available for this course\n
\n \n
\n - \n {course.lessons &&\n course.lessons.map(lesson => {\n const { id, name, startDate, endDate, progress, correctProgress } = lesson;\n const isCompleted = progress && progress >= 100;\n const isDICOM = lesson.type === 'cases';\n\n return (\n
- \n
\n
\n \n \n {startDate ? `Start ${startDate}` : 'Not Started'}\n \n {!!isCompleted && (\n {endDate && `End ${endDate}`}\n )}\n
\n \n
\n \n \n );\n};\n\nexport default connect(\n null,\n { getCourses },\n)(CourseProgress);\n","import React from 'react';\nimport BackButton from 'shared/BackButton';\nimport { getEventUrl } from 'utils/appHelpers';\nimport { hasAccess } from 'utils/permissionHelper';\nimport CourseHeaderRightNav from '../CourseView/components/CourseHeaderRightNav';\n\nconst ProgressHeader = ({ course, history, file }) => {\n const path = hasAccess('event_user') ? getEventUrl() : '';\n return (\n \n \n
\n \n
\n \n \n \n Correct Answers\n
\n \n \n Lesson In Progress\n
\n \n \n
\n \n
\n \n \n \n Incorrect Answers\n
\n \n \n Completed Lesson\n
\n \n
\n );\n};\nexport default ProgressHeader;\n","import React from 'react';\nimport { useSelector } from 'react-redux';\nimport CourseHeader from './CourseHeader';\nimport { Document, Page, pdfjs } from 'react-pdf';\n\nconst pdfVersion = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.js`;\npdfjs.GlobalWorkerOptions.workerSrc = pdfVersion;\n\nconst CourseCertificate = ({ history, match }) => {\n const { id } = match.params;\n const courses = useSelector(store => store.courses);\n const course = courses.find(item => item.id === Number(id));\n const file = course.certificateUrl;\n\n if (!course.isCertificateAvailable) {\n return (\n \n
\n \n
\n {file && (\n \n \n Download Certificate\n \n (.Pdf 184kb)\n
\n )}\n \n
\n );\n }\n\n return (\n No Certificate is available for this course
\n \n \n \n )}\n {!file && (\n
\n );\n};\n\nexport default CourseCertificate;\n","import React from 'react';\nimport Slider from 'react-slick';\nimport AuthorBox from 'shared/components/AuthorBox';\n\nconst sliderSettings = {\n speed: 500,\n infinite: true,\n slidesToShow: 4,\n slidesToScroll: 1,\n};\n\nconst AuthorsList = ({ data }) => {\n sliderSettings.slidesToShow = data.length < 4 ? data.length : 4;\n const col = data.length < 4 ? data.length * 3 : 12;\n\n return (\n \n Your certificate will be available after completion of the course.\n
\n )}\n \n \n {data.map(item => (\n \n
\n );\n};\n\nexport default AuthorsList;\n","import { DEFAULT_IMG_URLS } from 'configs/constants';\nimport React, { useState } from 'react';\nimport { bindDuration } from 'utils/appHelpers';\n\nconst LessonsList = ({ data }) => {\n const [activeIndex, setActiveIndex] = useState(0);\n\n const toggleAccordion = index => setActiveIndex(activeIndex === index ? null : index);\n\n if (!data || !data.length) return null;\n\n return (\n \n {data\n .sort((l1, l2) => l1.lessonOrder - l2.lessonOrder)\n .map((item, index) => (\n
\n );\n};\n\nexport default LessonsList;\n","import React, { useState, useEffect } from 'react';\nimport { connect, useSelector } from 'react-redux';\nimport { confirmAlert } from 'react-confirm-alert';\nimport { useSnackbar } from 'notistack';\n\nimport { COUNTRY_ID_OBJ } from 'app/Auth/routes/Register/configs';\nimport {\n courseSubsStatuses,\n findCourseFirstLesson,\n findCourseFirstLessonAndRedirect,\n getError,\n} from 'utils/appHelpers';\nimport { formatSubscription } from 'utils/formatHelpers';\nimport { Api } from 'utils/connectors';\nimport { getFromStore } from 'utils/storeHelpers';\n\nimport AuthorsList from './components/AuthorsList';\nimport LessonsList from './components/LessonsList';\nimport { getCourses } from '../Courses/actions';\nimport BackButton from 'shared/BackButton';\nimport { IconKey, IconLock } from 'shared/components/Icons';\nimport TagsViewBlock from 'shared/components/TagsViewBlock';\nimport SubscriptionModal from 'shared/components/SubscriptionModal';\nimport ProgressBar from 'shared/components/ProgressBar';\nimport ButtonLoading from 'shared/components/ButtonLoading';\nimport Loading from 'shared/components/Loading';\nimport { API_RESPONSE_STATUS_CODES } from 'configs/constants';\n\nconst subsTypes = {\n 1: 'No Key Required',\n 2: 'Paid',\n 3: (\n <>\n - \n
- \n
- \n {item.episodes.map(epi => (\n
- \n {epi.name}\n \n {epi.duration || epi.timeLimit\n ? bindDuration(epi.duration || epi.timeLimit)\n : 'No time limit'}\n \n \n ))}\n
\n )}\n
\n
\n \n 
\n
\n \n
\n {item.name}
\n\n
\n \n duration:{' '}\n {item.duration || item.timeLimit\n ? bindDuration(item.duration || item.timeLimit)\n : 'No Limit'}\n
\n chapters: {item.episodes.length || 0}
\n type: {item.type}
\n {item.description}
\n \n {activeIndex === index && (\n\n setModalData(false)}\n onSuccess={fetchData}\n isFellowCourse={course?.name?.startsWith('Breast Fellow')}\n radiologist8HourCourseId={radiologist8HourCourseId}\n />\n )}\n
\n );\n};\n\nconst mapStateToProps = state => ({\n courses: state.courses,\n});\n\nconst mapDispatchToProps = {\n getCourses,\n};\n\nexport default connect(\n mapStateToProps,\n mapDispatchToProps,\n)(CourseDetails);\n","import React from 'react';\nimport BackButton from 'shared/BackButton';\n\nconst CertificateHeader = ({ history }) => {\n return (\n \n
\n \n
\n {course.name}
\n \n
\n {modalData && (\n \n
\n \n \n
\n {course.description && (\n
\n \n
\n {course.description && (\n \n About course\n {course.description}\n
\n )}\n {course.authors && course.authors.length > 0 && (\n Lessons
\n {course.lessons && course.lessons.length > 0 &&\n
\n \n {!!course?.image && 
}\n
\n \n {course.name}*\n
\n\n Registration Code\n {subsTypes[subscription.keyRequired ? 3 : subscription.type] || '-'}\n
\n \n Parts\n {course.lessons ? course.lessons.length : '0'} parts\n
\n \n Faculty\n {course.authors.length} Faculty\n
\n \n Validity Period\n {subscription.expirable ? `${subscription.days} days` : 'No Expiration'}\n
\n {isDeclined && !isEventType && (\n \n setModalData(subscription)}\n >\n Enroll\n \n
\n )}\n {isAccepted && (\n <>\n \n
\n {!isEventType && (\n \n \n Start to:\n {subscription.userSubs.startDate.substr(0, 10)}\n \n {!!subscription.expirable && (\n \n End to:\n {subscription.userSubs.endDate.substr(0, 10)}\n \n )}\n
\n\n \n \n Progress {subscription.userSubs.progress || 0}%\n \n
\n \n \n {fetch ?
\n )}\n \n )}\n {isPending && Request Sent
}\n \n * To get access to this course you first need to enroll\n
\n\n
\n );\n};\n\nexport default CertificateHeader;\n","import React, { useEffect } from 'react';\nimport CertificateHeader from './components/CertificateHeader';\nimport certificate from 'assets/certificate.png';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { getAndUpdateProfile } from '../../../Auth/actions/index';\n\nconst UserCertificate = ({ history }) => {\n const dispatch = useDispatch();\n const account = useSelector(state => state.account);\n const data = account.userCertificates || [];\n\n useEffect(() => {\n dispatch(getAndUpdateProfile());\n //eslint-disable-next-line\n }, []);\n\n return (\n \n
\n \n
\n );\n};\n\nexport default UserCertificate;\n","import React, { useEffect } from 'react';\nimport { connect } from 'react-redux';\nimport { triggerDiagnosticsTest } from 'app/Main/components/ConnectionAndDeviceTestModal/actions';\nimport Loading from 'shared/components/Loading';\nimport { removeFromStore } from 'utils/storeHelpers';\n\nconst ConnectionTest = ({ history, triggerDiagnosticsTest }) => {\n useEffect(() => {\n removeFromStore('connectionAndDeviceTested');\n triggerDiagnosticsTest();\n history.goBack();\n }, [history, triggerDiagnosticsTest]);\n return \n Certificate will be available after completion of the course.\n
\n )}\n {!!data.length && (\n\n {data.map(item => (\n
\n )}\n \n \n
\n ))}\n \n \n Download\n \n {item.title}\n
\n - \n
- \n 1. My Transcript > Click on this link on the left-hand banner. Your\n certificate(s) will be under Certificates.\n \n
- \n 2. Click on your picture above your name in the left-hand banner. Scroll down to{' '}\n Certificates. Click See.\n \n
- \n
- \n ● Google Chrome (min version 79.0.3945)\n \n
- \n ● Mozilla Firefox (min version 78.0)\n \n
- \n ● Safari (Mac) (min version 13)\n \n
- \n ● Microsoft Edge (min version 79.0.309)\n \n
- ● Internet Explorer is no longer supported \n
- \n
- ● Memory: 2 GB or more Memory: 2 GB or more \n
- ● Storage: 8 GB or more free space Storage: 8 GB or more free space \n
- \n ● Monitor/Display: at least 13\" monitor with resolution 1600 x 900 or better\n Monitor/Display: at least 13\" monitor with resolution 1600 x 900 or better\n \n
- ● Internet: 8 Mb/s or better Internet: 8 Mb/s or better \n
\n
\n );\n};\n\nexport default FAQ;\n","/* eslint-disable no-console */\nimport React, { useRef, useEffect, useState } from 'react';\nimport * as cornerstone from 'cornerstone-core';\nimport { HOST } from 'configs';\n\nconst original = `${\n HOST.API.CONTENT\n}/dicom/2018_CHDI2D_107_BTOJPEGLossless_MG_L_MLO_TomoHD_24X29_20180331_/img_1_lut.jpg`;\n\nconst TestViewerWL = () => {\n const [imageUrl, setImageUrl] = useState(\n `${\n HOST.API.CONTENT\n }/dicom/2018_CHDI2D_107_BTOJPEGLossless_MG_L_MLO_TomoHD_24X29_20180331_/img_1.jpg`,\n );\n const [voi, setVoi] = useState({\n windowCenter: 0,\n windowWidth: 0,\n });\n const el1 = useRef(null);\n const el2 = useRef(null);\n\n const onImageRendered = () => {\n try {\n const viewport = cornerstone.getViewport(el1.current);\n setVoi(viewport.voi);\n } catch (err) {\n console.log(err);\n }\n };\n\n const onWindowResize = () => {\n cornerstone.resize(el1.current);\n };\n\n const loadImage = async (element, url) => {\n const image = await cornerstone.loadAndCacheImage(url || imageUrl);\n const viewportOptions = { pixelReplication: false, image };\n await cornerstone.displayImage(element, image, viewportOptions);\n };\n\n const initElement = async element => {\n await cornerstone.enable(element);\n await cornerstone.resize(element);\n element.addEventListener('cornerstoneimagerendered', onImageRendered);\n window.addEventListener('resize', onWindowResize);\n };\n\n const initData = async (element, url) => {\n await loadImage(element, url);\n await cornerstone.fitToWindow(element);\n await cornerstone.resize(element);\n };\n\n const unmountElement = async () => {\n // element.current.removeEventListener('cornerstoneimagerendered', onImageRendered);\n // window.removeEventListener('resize', onWindowResize);\n // cornerstone.disable(el1.current);\n };\n\n const onImageChange = e => {\n e.preventDefault();\n initData(el1.current);\n };\n\n const onChangeVoi = ({ target }) => {\n const body = { ...voi, [target.name]: target.value };\n setVoi(body);\n const viewport = cornerstone.getViewport(el1.current);\n viewport.voi = body;\n cornerstone.setViewport(el1.current, viewport);\n };\n\n const onChangeVoiSubmit = e => {\n e.preventDefault();\n const viewport = cornerstone.getViewport(el1.current);\n viewport.voi = voi;\n cornerstone.setViewport(el1.current, viewport);\n };\n\n useEffect(() => {\n initElement(el1.current);\n initElement(el2.current);\n return () => unmountElement();\n //eslint-disable-next-line\n }, []);\n\n useEffect(() => {\n initData(el1.current);\n initData(el2.current, original);\n //eslint-disable-next-line\n }, []);\n\n return (\n \n
\n \n \n
\n \n
\n \n {data.map((item, index) => {\n if (item.header)\n return (\n
\n \n
\n );\n return (\n {item.header}
\n- \n
{item.title}
\n \n {activeIndex === index && {item.content}
}\n \n
\n );\n};\n\nexport default TestViewerWL;\n","import React from 'react';\nimport { IconCourses } from 'shared/components/Icons';\n\nconst Requirements = () => {\n return (\n \n \n \n
\n \n
\n \n \n
\n \n \n
\n \n
\n );\n};\n\nexport default Requirements;\n","import React from 'react';\nimport moment from 'moment';\n\nconst EventLine = ({ label, value, className }) => (\n \n
\n \n \n
\n \n
\n
\n
\n
\n Browser
\n\n ● Chrome (min version 79.0.3945)\n
\n\n ● Mozilla Firefox (min version 78.0)\n
\n\n ● Safari Mac (min version 13)\n
\n\n ● Microsoft Edge (min version 79.0.309)\n
\n\n
Hardware
\n● Standard laptop, desktop computer or iPad
\n● Resolution of at least 1366×768
\n\n
Internet Connection
\n● No firewall blocking ACE domain (hologicace.com)
\n● Bandwidth 7 MBits/s connection
\n\n
Software
\n● Google Chrome
\n● Mozilla Firefox
\n● Safari (Mac)
\n● Microsoft Edge
\n\n {label}\n {value}\n
\n);\n\nconst getMapUrl = item => {\n return `https://maps.google.com/maps?q=${item.lat},${item.lng}&hl=es&z=14&&output=embed`;\n};\n\nconst entranceType = {\n 0: 'Open',\n 1: 'Invitation',\n 2: 'Registration',\n};\n\nconst eventTypes = {\n 0: 'Webinar',\n 1: 'TradeShow',\n};\n\nconst typeNames = {\n 0: 'Online',\n 1: 'Offline',\n};\n\nconst EventInfo = ({ event }) => {\n const isWebinar = eventTypes[event.eventType] === 'Webinar';\n\n return (\n \n
\n );\n};\n\nexport default EventInfo;\n","/* eslint-disable jsx-a11y/no-noninteractive-element-to-interactive-role */\nimport React, { useEffect } from 'react';\nimport { useSnackbar } from 'notistack';\nimport { IconAbout } from 'shared/components/Icons';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { getError, getEventId } from 'utils/appHelpers';\nimport { onGetEvents } from 'app/Events/actions';\nimport { Api } from 'utils/connectors';\nimport Loading from 'shared/components/Loading';\nimport EventInfo from 'app/Events/routes/EventLanding/components/EventInfo';\n\nconst AboutEvent = () => {\n const { enqueueSnackbar } = useSnackbar();\n const dispatch = useDispatch();\n const events = useSelector(state => state.events);\n const id = getEventId();\n const event = events[id];\n\n const getEventData = async id => {\n try {\n const { data } = await Api.get(`/events/event/${id}`);\n dispatch(onGetEvents({ ...events, [id]: data.data }));\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n useEffect(() => {\n getEventData(id);\n //eslint-disable-next-line\n }, [])\n\n if (!event) return \n
\n \n
\n {!isWebinar && (\n \n
\n )}\n \n
\n );\n};\n\nexport default AboutEvent;\n","export default __webpack_public_path__ + \"static/media/kol_icon.47fa6254.svg\";","import { useRef, useEffect } from 'react';\n\n/**\n * A hook that keeps track of the previous value of a state or Redux state.\n *\n * @param value - The current value of the state.\n * @returns The previous value of the state.\n */\nexport const usePrevious = value => {\n const ref = useRef();\n\n useEffect(() => {\n ref.current = value;\n }, [value]);\n\n return ref.current;\n};\n","import React from 'react';\nimport { connect, useSelector } from 'react-redux';\nimport AuthorsList from './../CourseDetails/components/AuthorsList';\nimport LessonsList from './../CourseDetails/components/LessonsList';\nimport { IconKey, IconLock } from 'shared/components/Icons';\nimport TagsViewBlock from 'shared/components/TagsViewBlock';\nimport { useState } from 'react';\nimport { Api } from 'utils/connectors';\nimport {\n findCourseFirstLesson,\n findCourseFirstLessonAndRedirect,\n getError,\n} from 'utils/appHelpers';\nimport { useSnackbar } from 'notistack';\nimport { formatSubscription } from 'utils/formatHelpers';\nimport { useEffect } from 'react';\nimport Loading from 'shared/components/Loading';\nimport { formatCourseData, getCourses } from '../Courses/actions';\nimport { API_RESPONSE_STATUS_CODES } from 'configs/constants';\n\nconst subsTypes = {\n 1: 'No Key Required',\n 2: 'Paid',\n 3: (\n <>\n \n
\n \n \n
\n \n \n
\n \n *Not all products or technologies featured are available in all markets\n
\n\n
\n );\n};\n\nconst mapStateToProps = state => ({\n courses: state.courses,\n});\n\nconst mapDispatchToProps = {\n getCourses,\n};\n\nexport default connect(\n mapStateToProps,\n mapDispatchToProps,\n)(CourseDetailsPublic);\n","import React, { useState, useEffect } from 'react';\nimport { Route, Switch, Redirect } from 'react-router-dom';\nimport { connect, useSelector } from 'react-redux';\nimport { getAuthors } from './routes/Authors/actions';\nimport { getCourses, getMarketingCourses } from './routes/Courses/actions';\n\nimport SideBar from './components/SideBar/index';\nimport HeaderNav from './components/HeaderNav/index';\nimport Home from './routes/Home';\nimport Profile from './routes/Profile';\nimport DiagnosticsHistory from './routes/DiagnosticsHistory';\nimport Courses from './routes/Courses';\nimport Transcript from './routes/Transcript';\nimport Subscriptions from './routes/Subscriptions';\nimport SubscriptionView from './routes/SubscriptionView';\nimport CourseView from './routes/CourseView';\nimport Authors from './routes/Authors';\n// import AuthorView from './routes/AuthorView';\n// import Statistics from './routes/Statistics';\nimport About from './routes/About';\nimport Contacts from './routes/Contacts';\nimport Messages from './routes/Messages';\nimport PrivacyAndPolicy from './routes/PrivacyAndPolicy';\nimport Viewer from './routes/Viewer';\nimport TestViewer from './routes/TestViewer';\nimport Icons from './routes/Icons';\nimport Loading from 'shared/components/Loading';\nimport ConnectionAndDeviceTestModal from './components/ConnectionAndDeviceTestModal';\nimport CourseProgress from './routes/CourseProgress';\nimport CourseCertificate from './routes/CourseCertificate';\n// import CourseFeedback from './routes/CourseFeedback';\n// import CourseSubscriptions from './routes/CourseSubscriptions';\nimport CourseDetails from './routes/CourseDetails';\nimport { getAndUpdateProfile } from 'app/Auth/actions';\nimport UserCertificate from './routes/UserCertificate';\n// import FooterNav from 'shared/components/FooterNav';\nimport ConnectionTest from './routes/ConnectionTest';\nimport FAQ from './routes/FAQ';\nimport TestViewerWL from './routes/TestWL';\nimport Requirements from './routes/Requirements';\nimport { hasAccess, PRoute, WithTitleRoute } from 'utils/permissionHelper';\nimport AboutEvent from './routes/AboutEvent';\nimport { getLocalToken } from 'utils/tokenHelpers';\nimport { HOST } from 'configs';\nimport kolIcon from 'assets/kol_icon.svg';\nimport { getFromStore, removeFromStore } from 'utils/storeHelpers';\nimport { usePrevious } from 'shared/hooks/usePrevious';\nimport CourseDetailsPublic from './routes/CourseDetailsPublic';\n\nconst Main = ({\n getAuthors,\n getCourses,\n getMarketingCourses,\n getAndUpdateProfile,\n match,\n history,\n location,\n}) => {\n const [testing, setTesting] = useState(false);\n const authors = useSelector(item => item.authors);\n const courses = useSelector(item => item.courses);\n const marketingCourses = useSelector(item => item.marketingCourses);\n const connectionAndDeviceTest = useSelector(item => item.connectionAndDeviceTest);\n const user = useSelector(item => item.account);\n const previousUserId = usePrevious(user?.id);\n const path = match.path === '/' ? '' : match.path;\n const isViewer = window.location.pathname.includes('/play');\n const isHomePage = window.location.pathname.includes('/home');\n const redirectUrl = getFromStore('redirectUrl');\n const isVisitorUser = hasAccess('visitor_user');\n\n const finishTest = () => {\n setTesting(false);\n getAndUpdateProfile();\n };\n\n const openAdmin = () => {\n const token = getLocalToken();\n window.open(`${HOST.API.ADMIN_DOMAIN}/grant/kol?t=${token}`, '_blank');\n };\n\n useEffect(() => {\n if (!courses || user?.id !== previousUserId) getCourses();\n }, [courses, getCourses, isVisitorUser, user]);\n\n useEffect(() => {\n if (!marketingCourses) getMarketingCourses();\n }, [marketingCourses, getMarketingCourses]);\n\n useEffect(() => {\n if (!authors) getAuthors();\n if ((authors && courses, redirectUrl)) {\n history.push(redirectUrl);\n removeFromStore('redirectUrl');\n }\n //eslint-disable-next-line\n }, [authors, getAuthors, courses]);\n\n useEffect(() => {\n if (!getFromStore('connectionAndDeviceTested') && !isVisitorUser) setTesting(true);\n }, [connectionAndDeviceTest]);\n\n if (!authors || !courses) return \n
\n \n
\n \n
\n \n \n
\n {course.description && (\n
\n \n
\n {course.description && (\n \n About course\n {course.description}\n
\n )}\n {course.authors && course.authors.length > 0 && (\n Lessons
\n {course.lessons && course.lessons.length > 0 &&\n
\n \n \n
\n \n {course.name}*\n
\n\n Registration Code\n {subsTypes[subscription.type] || '-'}\n
\n \n Parts\n {course.lessons ? course.lessons.length : '0'} parts\n
\n \n Faculty\n {course.authors.length} Faculty\n
\n \n Validity Period\n \n {subscription.expirable ? `${subscription.days} days` : 'No Expiration'}\n \n
\n \n \n
\n \n * To get access to this course you first need to Sign In\n
\n\n
\n );\n};\n\nexport default connect(\n null,\n { getAuthors, getCourses, getMarketingCourses, getAndUpdateProfile },\n)(Main);\n","import React, { useRef, useEffect, useState } from 'react';\nimport { useSnackbar } from 'notistack';\nimport * as cornerstone from 'cornerstone-core';\nimport Select from 'shared/components/Select';\nimport { getError } from 'utils/appHelpers';\nimport { Api } from 'utils/connectors';\nimport cornerstoneTools from 'cornerstone-tools/dist/cornerstoneTools';\nimport Loading from 'shared/components/Loading';\n\nconst cases = [\n { id: 156, name: '3_AITomoSlice_101' },\n { id: 157, name: '3_AITomoSlice_103' },\n { id: 158, name: '3_AITomoSlice_104' },\n { id: 159, name: '3_AITomoSlice_105' },\n { id: 160, name: '3_AITomoSlice_108' },\n { id: 161, name: '3_AITomoSlice_109' },\n { id: 162, name: '3_AITomoSlice_111' },\n { id: 163, name: '3_AITomoSlice_112' },\n { id: 164, name: '3_AITomoSlice_113' },\n { id: 165, name: '3_AITomoSlice_114' },\n { id: 166, name: '3_AITomoSlice_116' },\n { id: 167, name: '3_AITomoSlice_118' },\n { id: 168, name: '3_AITomoSlice_119' },\n { id: 169, name: '3_AITomoSlice_120' },\n];\n\nconst PublicViewer = () => {\n const { enqueueSnackbar } = useSnackbar();\n const [activeCase, setActiveCase] = useState(156);\n const [activeImage, setActiveImage] = useState();\n const [dicomItems, setDicomItems] = useState();\n const [fetch, setFetch] = useState(false);\n const el1 = useRef(null);\n\n const getCaseImages = async () => {\n try {\n setFetch(true);\n const { data } = await Api.get(`/cases/getcasebyid/${activeCase}`);\n const items = data.data.caseDicomItems.map(({ dicomItem }) => {\n return {\n id: dicomItem.dicomItemImages ? dicomItem.dicomItemImages[0].url : '',\n name: dicomItem.fileName,\n };\n });\n setDicomItems(items);\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n } finally {\n setFetch(false);\n }\n };\n\n const onWindowResize = () => {\n cornerstone.resize(el1.current);\n };\n\n const loadImage = async url => {\n const image = await cornerstone.loadAndCacheImage(url);\n const viewportOptions = { pixelReplication: false, image };\n await cornerstone.displayImage(el1.current, image, viewportOptions);\n };\n\n const initElement = async () => {\n await cornerstone.enable(el1.current);\n await cornerstone.resize(el1.current);\n window.addEventListener('resize', onWindowResize);\n const options = {\n configuration: {\n invert: false,\n preventZoomOutsideImage: false,\n minScale: 0.01,\n maxScale: 5.0,\n },\n };\n cornerstoneTools.addToolForElement(el1.current, cornerstoneTools.ZoomMouseWheelTool, options);\n cornerstoneTools.addTool(cornerstoneTools.PanTool);\n cornerstoneTools.setToolActive('Pan', { mouseButtonMask: 1 });\n cornerstoneTools.setToolActive('ZoomMouseWheel', { mouseButtonMask: 1 });\n };\n\n const initData = async url => {\n await loadImage(url);\n await cornerstone.fitToWindow(el1.current);\n await cornerstone.resize(el1.current);\n };\n\n useEffect(() => {\n initElement();\n //eslint-disable-next-line\n }, []);\n\n useEffect(() => {\n getCaseImages(activeCase);\n //eslint-disable-next-line\n }, [activeCase]);\n\n useEffect(() => {\n if (activeImage) initData(activeImage);\n //eslint-disable-next-line\n }, [activeImage]);\n\n return (\n \n {!isHomePage && !(isVisitorUser && isDirectAccessToRoute && isCourseDetailsPage) && (\n \n )}\n \n {isHomePage && \n \n \n {testing &&
\n \n \n
\n )}\n \n
\n );\n};\n\nexport default PublicViewer;\n","/* eslint-disable jsx-a11y/no-static-element-interactions */\n/* eslint-disable jsx-a11y/anchor-is-valid */\nimport React, { useRef, useState } from 'react';\nimport logo from 'assets/white-logo.svg';\n// import accessImg from 'assets/events/accesslogo.svg';\nimport { NavLink } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { IconArrowDown } from 'shared/components/Icons';\nimport { logout } from 'app/Auth/actions';\nimport useOutsideClick from 'shared/hooks/useOutsideClick';\nimport { hasAccess } from 'utils/permissionHelper';\n\nconst EventHeader = ({ eventId, name }) => {\n const dispatch = useDispatch();\n // const account = useSelector(state => state.account);\n // const [dropMenu, setDropMenu] = useState();\n const [accountMenu, setAccountMenu] = useState();\n const isAuthUser = useSelector(state => state.isAuthenticated);\n const isVisitorUser = hasAccess('visitor_user');\n const isAuth = isAuthUser && !isVisitorUser;\n // const dropMenuEl = useRef();\n const accountMenuEl = useRef();\n\n const homeUrl = `/events/${name}`;\n\n const logoutProfile = e => {\n e.preventDefault();\n dispatch(logout());\n };\n\n // const onClickAccessVip = () => {\n // const isAlreadyVIP = account.userType !== 6;\n // let win;\n // if (isAlreadyVIP) {\n // win = window.open('/allcourses', '_blank');\n // } else {\n // win = window.open('/register', '_blank');\n // }\n // win.focus();\n // };\n\n // useOutsideClick(dropMenuEl, () => setDropMenu(false));\n useOutsideClick(accountMenuEl, () => setAccountMenu(false));\n\n return (\n \n {fetch && setActiveCase(target.value)}\n />\n {dicomItems && (\n setActiveImage(target.value)}\n />\n )}\n
\n \n
\n \n \n
\n \n {/*
\n \n \n );\n};\n\nexport default EventHeader;\n","export default __webpack_public_path__ + \"static/media/location.1204077f.svg\";","export default __webpack_public_path__ + \"static/media/calendar.9d44fad7.svg\";","export default __webpack_public_path__ + \"static/media/speakers.51a396cf.svg\";","/* eslint-disable jsx-a11y/no-static-element-interactions */\n/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */\nimport React from 'react';\nimport moment from 'moment';\nimport { scrollToEl } from 'utils/appHelpers';\n// import Icon1 from 'assets/home-icon-1.svg';\n// import Icon2 from 'assets/home-icon-2.svg';\n// import { IconArrowRight } from 'shared/components/Icons';\n// import { useHistory } from 'react-router';\nimport FooterIcon1 from 'assets/events/location.svg';\nimport FooterIcon2 from 'assets/events/calendar.svg';\nimport FooterIcon3 from 'assets/events/speakers.svg';\n// import FooterIcon4 from 'assets/events/seats.svg';\nimport Slider from 'react-slick';\n// import { useSelector } from 'react-redux';\n\nconst sliderSettings = {\n arrows: false,\n dots: false,\n speed: 500,\n infinite: true,\n slidesToShow: 1,\n slidesToScroll: 1,\n autoplaySpeed: 7000,\n className: 'event-slide',\n autoplay: true,\n};\n\nconst EventBanner = ({ event }) => {\n // const isAuth = useSelector(state => state.isAuthenticated);\n // const account = useSelector(state => state.account);\n // const history = useHistory();\n // const openUrl = url => {\n // window.open(url, '_blank');\n // };\n\n // const onClickStart = () => {\n // if (isAuth) {\n // history.push(`/events/${event.id}/dashboard/allcourses`);\n // } else {\n // history.push(`/events/${event.id}/register`);\n // }\n // };\n\n // const onClickAccessVip = () => {\n // const isAlreadyVIP = account.userType !== 6;\n // let win;\n // if (isAlreadyVIP) {\n // win = window.open('/allcourses', '_blank');\n // } else {\n // win = window.open('/register', '_blank');\n // }\n // win.focus();\n // };\n\n // const isExpired = moment(event.endDate).diff(new Date()) <= 0;\n\n return (\n */}\n {/* */}\n {/* {!!isAuth && (\n \n )} */}\n {/*
*/}\n \n \n \n Register\n \n \n )}\n {!isAuth && (\n \n \n Login\n \n \n )}\n {!!isAuth && (\n \n setAccountMenu(!accountMenu)}\n ref={accountMenuEl}\n >\n Account
\n \n )}\n \n \n \n
\n */}\n {!isAuth && (\n - \n
- \n
\n Home\n \n \n {!!isAuth && (\n - \n
Available Courses \n \n )}\n {/* - \n
\n {dropMenu && (\n - \n
- \n 360 Tour\n \n
- \n AR Guide\n \n
- \n AR Equipment\n \n
- \n Online Classroom\n \n
- \n
- \n
- \n \n Log out\n \n \n
\n \n {event.banners.map(item => {\n return (\n \n
\n \n
\n \n
\n \n \n
*/}\n \n
\n - \n
- scrollToEl('aboutSection')}>About \n
- scrollToEl('noncmeSection')}>Non-CME \n
- scrollToEl('cmeSection')}>CME \n
- scrollToEl('speakersSection')}>Faculty \n {/*
- scrollToEl('programSection')}>Program */}\n
\n {/* \n
\n \n 
\n WEBINARS\n
\n \n \n LIVE EVENTS\n
\n \n {/* */}\n {/* {!!isAuth && (\n \n )} */}\n
\n {event?.name}
\n \n \n
\n );\n })}\n \n
\n \n \n );\n};\n\nexport default EventBanner;\n","import React from 'react';\n\nconst EventAbout = ({ event }) => {\n return (\n - \n
- \n
\n
\n\nWorldwide
\nOnline Event
\n \n - \n
\n
\n\n{moment(event.startDate).format('MM/DD/YYYY')}
\n{moment(event.endDate).format('MM/DD/YYYY')}
\n \n - \n
\n
\n\n{event.programs.length} Programs
\n{event.speakers.length} Faculty
\n \n {/* - \n
\n
\n\n\n {event.capacity < 1 ? 'No Limit' : `${event.capacity} Seats`}\n
\nHurry up, register!
\n */}\n
\n
\n );\n};\n\nexport default EventAbout;\n","/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React, { useState } from 'react';\nimport { IconArrowDown, IconArrowUp } from 'shared/components/Icons';\n\nconst EventSpeakers = ({ event }) => {\n const [open, setOpen] = useState(false);\n\n return (\n \n
\n About Event
\n \n\n *Not all products or technologies featured are available in all markets\n
\n\n
\n );\n};\n\nexport default EventSpeakers;\n","/* eslint-disable jsx-a11y/no-static-element-interactions */\n/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */\nimport React from 'react';\nimport { IconCirclePlay, IconLock } from 'shared/components/Icons';\n\nconst EventCME = ({ event }) => {\n const openItemUrl = url => {\n window.open(url, '_blank');\n };\n\n return (\n \n
\n Faculty
\n\n {event.speakers &&\n event.speakers.map((data, index) => {\n const item = data.authorProfile || {};\n return (\n
\n \n
\n );\n })}\n \n
\n \n
\n \n {item.name} {item.surname}, {item.profession}\n
\n{item.info}
\n setOpen(!open)}>\n {!open ?
\n \n
\n \n );\n};\n\nexport default EventCME;\n","/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */\n/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React from 'react';\nimport { useSelector } from 'react-redux';\nimport { IconCirclePlay, IconLock } from 'shared/components/Icons';\nimport { saveToStore } from 'utils/storeHelpers';\n\nconst EventCourses = ({ event }) => {\n const isAuth = useSelector(state => state.isAuthenticated);\n\n const openItemUrl = () => {\n if (!isAuth) saveToStore('redirect', `/events/${event.id}/dashboard/allcourses`);\n const url = isAuth\n ? `/events/${event.eventUrl}/dashboard/allcourses`\n : `/events/${event.eventUrl}/login`;\n window.open(url, '_blank');\n };\n\n return (\n \n
\n \n CME\n Courses\n
\n\n {event.cmEs &&\n event.cmEs.map(item => {\n const Icon = false ? IconLock : IconCirclePlay;\n return (\n
\n );\n })}\n \n 
\n
\n \n \n \n
\n \n World Class CME is accredited by the Accreditation Council for Continuing Medical\n Education for Physicians and designates this activity for a maximum of 1 AMA PRA Category\n 1 Credit™. Attendees should claim only the credit commensurate with the extent of their\n participation in the activity. This activity is supported by an educational grant from\n Hologic.\n
\n\n
\n \n \n );\n};\n\nexport default EventCourses;\n","export default __webpack_public_path__ + \"static/media/fb.4420d86f.svg\";","export default __webpack_public_path__ + \"static/media/twitter.b40321b7.svg\";","export default __webpack_public_path__ + \"static/media/linkedin.9016e7e5.svg\";","export default __webpack_public_path__ + \"static/media/footer-image.dd6e9f93.png\";","import React from 'react';\nimport img1 from 'assets/events/fb.svg';\nimport img2 from 'assets/events/twitter.svg';\nimport img3 from 'assets/events/linkedin.svg';\nimport footerImg from 'assets/events/footer-image.png';\n\nconst soc = [\n {\n img: img1,\n url: 'https://www.facebook.com/Hologic',\n },\n {\n img: img2,\n url: 'https://twitter.com/Hologic',\n },\n {\n img: img3,\n url: 'https://www.linkedin.com/company/hologic',\n },\n];\n\nconst EventFooter = ({ event }) => {\n return (\n \n
\n );\n })}\n \n Non-CME\n Courses\n
\n\n {event.courses &&\n event.courses.map(item => {\n const Icon = item.isLocked ? IconLock : IconCirclePlay;\n return (\n \n \n
\n \n \n
\n \n \n Open\n \n
\n \n {item.title}\n
\n{item.description}
\n\n
\n );\n};\n\nexport default EventFooter;\n","import React, { useEffect } from 'react';\nimport { useSnackbar } from 'notistack';\nimport { getError } from 'utils/appHelpers';\nimport { Api } from 'utils/connectors';\nimport Loading from 'shared/components/Loading';\nimport EventHeader from './components/EventHeader';\nimport EventBanner from './components/EventBanner';\n// import EventInfo from './components/EventInfo';\nimport EventAbout from './components/EventAbout';\nimport EventSpeakers from './components/EventSpeakers';\n// import EventPrograms from './components/EventPrograms';\nimport EventCME from './components/EventCME';\nimport EventCourses from './components/EventCourses';\nimport EventFooter from './components/EventFooter';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { onGetEvents } from 'app/Events/actions';\n\nconst EventLanding = ({ match }) => {\n const dispatch = useDispatch();\n const events = useSelector(state => state.events);\n const { name } = match.params;\n const event = events[name];\n const { enqueueSnackbar } = useSnackbar();\n\n const getEventData = async ({ name }) => {\n try {\n const key = name;\n const endpoint = `/events/event-url/${name}`;\n\n const { data } = await Api.get(endpoint);\n const evtId = data?.data?.id;\n const res = await Api.get(`/events/event/courses/${evtId}`);\n\n data.data.courses = res.data.data.courses;\n dispatch(onGetEvents({ ...events, [key]: data.data }));\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n useEffect(() => {\n if (name) getEventData({ name });\n //eslint-disable-next-line\n }, []);\n\n if (!event) return \n
\n About Hologic
\n\n From detection to treatment, Hologic is your trusted breast and skeletal health expert.\n We’re
\n committed to delivering clinically proven solutions across the continuum of care, to\n improve
outcomes, reduce costs and increase patient satisfaction. Let us help you\n deliver exceptional breast
and skeletal care to all women over the course of their\n lifetime.\n
\n 
\n
\n \n
\n © COPYRIGHT 2020 HOLOGIC, INC.
\n- \n {soc.map((item, i) => (\n
- \n \n \n ))}\n
\n
\n );\n};\n\nexport default EventLanding;\n","export default __webpack_public_path__ + \"static/media/ACE-logo-blue.8a26e656.svg\";","import { loginUser } from 'app/Auth/actions';\nimport React, { useState } from 'react';\nimport { useDispatch } from 'react-redux';\nimport ButtonLine from 'shared/components/ButtonLine';\nimport { IconMail, IconPassword } from 'shared/components/Icons';\nimport InputGroup from 'shared/components/InputGroup';\nimport { getError } from 'utils/appHelpers';\nimport { Api } from 'utils/connectors';\nimport { getFromStore } from 'utils/storeHelpers';\nimport EventHeader from '../EventLanding/components/EventHeader';\nimport blueLogo from 'assets/ACE-logo-blue.svg';\n\nconst EventLogin = ({ match, history }) => {\n const hasRedirect = getFromStore('redirect');\n const { id, name } = match.params;\n const dispatch = useDispatch();\n const [error, setError] = useState();\n const [fetch, setFetch] = useState();\n const [auth, setAuth] = useState({\n email: '',\n password: '',\n eventId: id,\n eventUrl: name,\n });\n\n const handleSubmit = async e => {\n e.preventDefault();\n setFetch(true);\n try {\n const res = await Api.post('/auth/login', auth);\n if (res.data.data.pendingConfirmation) {\n history.push({ pathname: 'email-verification', state: { email: auth.email } });\n return;\n }\n await dispatch(loginUser(res.data, history, `/events/${name}`));\n setFetch(false);\n } catch (err) {\n setError(getError(err));\n setFetch(false);\n }\n };\n\n const handleChange = ({ target }) => {\n const { name, value } = target;\n const tempAuth = { ...auth };\n tempAuth[name] = value;\n setAuth(tempAuth);\n };\n\n return (\n \n
\n );\n};\n\nexport default EventLogin;\n","import React from 'react';\n\nconst AuthPage = ({ children, className = '' }) => {\n return \n
\n \n
\n \n 
\n
\n \n {children}
;\n};\n\nexport default AuthPage;\n","import React, { useState } from 'react';\nimport InputGroup from 'shared/components/InputGroup';\nimport { getError } from 'utils/appHelpers';\nimport { Api } from 'utils/connectors';\nimport EventHeader from '../EventLanding/components/EventHeader';\nimport Select from 'shared/components/Select';\nimport { countries, degrees, specialty, states } from 'app/Auth/routes/Register/configs';\nimport blueLogo from 'assets/ACE-logo-blue.svg';\nimport AuthPage from 'app/Auth/components/AuthPage';\nimport Button from 'shared/components/Button';\n\nconst EventRegister = ({ match, history }) => {\n const { id, name } = match.params;\n const [error, setError] = useState();\n const [fetch, setFetch] = useState();\n const [isConfirm, setIsConfirm] = useState(false);\n const [form, setForm] = useState({\n fname: '',\n lname: '',\n email: '',\n institution: '',\n countryId: '',\n city: '',\n address: '',\n phone: '',\n zipCode: '',\n degree: '',\n specialty: '',\n prefferedNameOnCertificate: '',\n password: '',\n rpassword: '',\n state: '',\n eventId: Number(id),\n eventUrl: name,\n });\n\n const areAllRequiredFieldsFilled = () => {\n const requiredFields = [\n 'fname',\n 'lname',\n 'degree',\n 'specialty',\n 'email',\n 'password',\n 'rpassword',\n 'institution',\n 'countryId',\n 'city',\n 'state',\n 'zipCode',\n 'address',\n 'phone',\n ];\n return requiredFields.every(field => Boolean(form[field]));\n };\n\n const handleSubmit = async e => {\n e.preventDefault();\n setFetch(true);\n try {\n const body = {\n email: form.email,\n password: form.password,\n firstname: form.fname,\n lastname: form.lname,\n usertype: 1,\n countryid: form.countryId,\n eventUrl: name,\n learnerprofile: {\n state: form.state,\n institution: form.institution,\n city: form.city,\n address: form.address,\n zipCode: form.zipCode,\n phone: form.phone,\n degree: form.degree,\n profession: form.specialty,\n prefferedNameOnCertificate: form.prefferedNameOnCertificate,\n },\n };\n await Api.post('/auth/register', body);\n history.push({\n pathname: `/events/${name}/email-verification`,\n state: { email: form.email },\n });\n setIsConfirm(true);\n } catch (err) {\n setError(getError(err));\n } finally {\n setFetch(false);\n }\n };\n\n const handleChange = ({ target }) => {\n const { name, value } = target;\n const tempForm = { ...form };\n tempForm[name] = value;\n setForm(tempForm);\n };\n\n const isCountryUs = form.countryId === '226';\n const passwordMatch = form.password === form.rpassword;\n\n return (\n \n \n \n \n
\n );\n};\n\nexport default EventRegister;\n","import React, { useState, createRef, useEffect } from 'react';\n\nconst CodeVerificationInputs = ({ onCodeChange, onPaste, onEnter }) => {\n const [inputs, setInputs] = useState(Array(6).fill(''));\n const elements = Array(6)\n .fill()\n .map((_, idx) => createRef());\n\n const focusNext = (idx, str) => {\n if (str && idx < 5) {\n elements[idx + 1].current.focus();\n }\n };\n\n const handleChange = (str, idx) => {\n if (!str || str.match(/[0-9]/)) {\n setInputs(inputs.map((s, index) => (index === idx ? str : s)));\n focusNext(idx, str);\n onCodeChange(idx, str); // Notify the parent component of the change\n }\n };\n\n const handlePaste = e => {\n e.preventDefault();\n const pastedData = e.clipboardData.getData('text');\n if (\n pastedData &&\n pastedData.length === 6 &&\n pastedData.split('').every(char => !Number.isNaN(parseInt(char, 10)))\n ) {\n const pastedArray = pastedData.split('');\n setInputs(pastedArray);\n onPaste(pastedArray); // Pass the pasted array to the parent component\n elements[5].current.focus();\n }\n };\n\n useEffect(() => {\n elements[0].current.focus();\n }, []);\n\n return (\n \n \n
\n \n
\n );\n};\n\nexport default CodeVerificationInputs;\n","import React, { useEffect, useState } from 'react';\nimport { Link } from 'react-router-dom';\nimport { connect } from 'react-redux';\nimport { useSnackbar } from 'notistack';\n\nimport Button from 'shared/components/Button';\nimport { Api } from 'utils/connectors';\nimport { getError } from 'utils/appHelpers';\nimport { loginUser } from '../../../Auth/actions';\n\nimport topLogo from 'assets/ACE-logo-blue.svg';\nimport CodeVerificationInputs from 'app/Auth/components/CodeVerificationInputs';\nimport { TOKEN_RESPONSE_CODES } from 'app/Auth/routes/Register/configs';\nimport EventHeader from '../EventLanding/components/EventHeader';\n\nconst EventEmailVerification = ({\n loginUser,\n history,\n location,\n match,\n title = 'Confirmation Code',\n subTitle = 'Please enter the code which we have sent to your email.',\n className = '',\n}) => {\n const { enqueueSnackbar } = useSnackbar();\n const { name } = match.params;\n const [verificationCode, setVerificationCode] = useState(Array(6).fill(''));\n const [user, setUser] = useState();\n const [isFetching, setIsFetching] = useState(false);\n const [error, setError] = useState();\n const [isCodeExpired, setIsCodeExpired] = useState(false);\n\n const regCode = match.params.code;\n const registeringUserEmail = location?.state?.email;\n const isForgotPassword = location?.state?.isForgotPassword;\n\n const allInputsFilled = verificationCode.every(code => code !== '');\n\n const getUserdata = async code => {\n try {\n const { data } = await Api.get(`/auth/getinviteuser/${code}`);\n if (data.data.invitation.email) {\n setUser({\n fname: data.data.invitation.firstName,\n lname: data.data.invitation.lastName,\n email: data.data.invitation.email,\n });\n }\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n history.push('/login');\n }\n };\n\n const handleCodeChange = (idx, val) => {\n const code = [...verificationCode];\n code[idx] = val;\n setVerificationCode(code);\n };\n\n const handlePaste = pastedArray => {\n setVerificationCode(pastedArray);\n };\n\n const handleResendCode = async () => {\n try {\n await Api.post('/auth/resend-confirmation-code', {\n email: user?.email || registeringUserEmail,\n });\n enqueueSnackbar('Successfully sent!', { variant: 'success' });\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n }\n };\n\n const handleSubmit = async () => {\n try {\n setIsFetching(true);\n if (isForgotPassword) {\n const res = await Api.post('/auth/confirm-forgot-email', {\n email: user?.email || registeringUserEmail,\n code: verificationCode?.join(''),\n });\n if (res.status === 200) {\n history.push({ pathname: `/auth/reset/${res.data.data}` });\n }\n } else {\n const res = await Api.post('/auth/confirm-activation/', {\n email: user?.email || registeringUserEmail,\n code: verificationCode?.join(''),\n });\n await loginUser(res.data, history, `/events/${name}`);\n }\n } catch (err) {\n if (err.response.data.data === TOKEN_RESPONSE_CODES.expiredConfirmationCode) {\n setIsCodeExpired(true);\n }\n setError(getError(err));\n }\n setIsFetching(false);\n };\n\n useEffect(() => {\n if (regCode) getUserdata(regCode);\n }, [regCode]);\n\n return (\n \n {inputs.slice(0, 3).map((input, idx) => (\n {\n if (e.key === 'Enter') {\n onEnter();\n }\n }}\n onPaste={handlePaste}\n onChange={e => handleChange(e.target.value, idx)}\n maxLength={1}\n style={{ width: '30px', height: '30px', textAlign: 'center', border: '1px solid gray' }}\n ref={elements[idx]}\n />\n ))}\n
\n \n {inputs.slice(3, 6).map((input, idx) => (\n {\n if (e.key === 'Enter') {\n onEnter();\n }\n }}\n onPaste={handlePaste}\n onChange={e => handleChange(e.target.value, idx + 3)}\n maxLength={1}\n style={{ width: '30px', height: '30px', textAlign: 'center', border: '1px solid gray' }}\n ref={elements[idx + 3]}\n />\n ))}\n
\n \n
\n );\n};\n\nexport default connect(\n null,\n { loginUser },\n)(EventEmailVerification);\n","import Main from 'app/Main';\nimport React from 'react';\nimport { useSelector } from 'react-redux';\nimport { Switch, Redirect } from 'react-router-dom';\nimport EventLanding from './routes/EventLanding';\nimport EventLogin from './routes/EventLogin';\nimport EventRegister from './routes/EventRegister';\nimport { WithTitleRoute, hasAccess } from 'utils/permissionHelper';\nimport EventEmailVerification from './routes/EventEmailVerification';\n\nconst Events = ({ match }) => {\n const isAuthUser = useSelector(state => state.isAuthenticated);\n const isVisitorUser = hasAccess('visitor_user');\n const isAuth = isAuthUser && !isVisitorUser;\n const { path } = match;\n\n return (\n \n
\n \n \n 
\n \n
\n \n
\n \n
\n {title}
\n{subTitle}
\n{error}
}\n {isCodeExpired && (\n {'Click \"Resend Code\" below to get the new one.'}
\n )}\n \n \n Submit\n \n
\n \n \n
\n \n \n {!isAuth && \n
\n );\n};\n\nexport default Events;\n","export default __webpack_public_path__ + \"static/media/ACE-logo-soon.9cb91a6e.svg\";","export default __webpack_public_path__ + \"static/media/facebook.e594d652.svg\";","export default __webpack_public_path__ + \"static/media/linkedin.70ef13a9.svg\";","export default __webpack_public_path__ + \"static/media/twitter.92d6a0e7.svg\";","import React from 'react';\nimport logo from 'assets/ACE-logo-soon.svg';\nimport footer from 'assets/events/footer-image.png';\n\nimport soc1 from 'assets/soon/facebook.svg';\nimport soc2 from 'assets/soon/linkedin.svg';\nimport soc3 from 'assets/soon/twitter.svg';\n\nconst ComingSoon = ({ match }) => {\n return (\n \n
\n );\n};\n\nexport default ComingSoon;\n","export default __webpack_public_path__ + \"static/media/toplogo.f440b083.png\";","import React from 'react';\nimport logo from 'assets/promo/toplogo.png';\nimport { Player, BigPlayButton } from 'video-react';\n\nconst links = {\n expromo: 'https://content.hologicace.com/content/expromo1.mp4',\n inpromo: 'https://content.hologicace.com/content/expromo2.mov',\n};\n\nconst PromoPage = ({ history, location }) => {\n const isInpromo = location.pathname.includes('inpromo');\n const videoSettings = {\n src: links[isInpromo ? 'inpromo' : 'expromo'],\n fluid: false,\n preload: 'auto',\n height: window.innerHeight - 160,\n width: '100%',\n };\n\n const onClickAccessACE = () => {\n history.push('/login');\n };\n\n return (\n \n \n
\n \n
\n \n \n Thanks for finding us!
\n
\n \n Thanks for finding us!
\n We are not available in your region at the moment\n
\n \n Please visit www.HologicEd.com for additional\n education\n
\n\n
\n \n Contact MedEd-BSH@Hologic.com with any\n question\n
\n\n \n 
\n \n \n 
\n \n \n 
\n \n
\n \n
\n \n 
\n
\n \n
\n );\n};\n\nexport default PromoPage;\n","import React from 'react';\nimport BackButton from 'shared/BackButton';\n\nconst HeaderSection = ({ title, hasBack, onBackClick }) => {\n return (\n \n
\n \n \n \n
\n \n \n \n
\n \n
\n \n ADVANCED CONTINUING EDUCATION PLATFORM\n
\n\n
\n );\n};\nexport default HeaderSection;\n","import React from 'react';\nimport HeaderSection from './HeaderSection';\nimport TypeCasesPlay from 'app/PublicCourseView/CoursePreview/components/TypeCasesPlay';\nimport { generateViewerData } from 'app/Main/routes/Viewer/utils';\n\nconst CaseView = ({ caseData }) => {\n const cases = generateViewerData(caseData, { episodes: [] });\n\n const constructData = {\n isOpened: true,\n title: caseData.title,\n cases,\n };\n\n return (\n \n
\n \n {hasBack &&
\n \n
\n );\n};\n\nexport default CaseView;\n","import React, { useEffect, useState } from 'react';\nimport PublicWrapper from 'shared/components/layouts/PublicWrapper';\nimport Loading from 'shared/components/Loading';\nimport { Api } from 'utils/connectors';\nimport CaseView from './CaseView';\n\nconst PublicCaseView = ({ match, history }) => {\n const sharedToken = match.params?.id;\n const [caseData, setCaseData] = useState();\n\n const getCaseData = async () => {\n try {\n const { data } = await Api.get(`/cases/shared/case/${sharedToken}?lut=1&dicomType=all`);\n sessionStorage.setItem('caseSharedToken', sharedToken);\n setCaseData(data.data);\n } catch (err) {\n history.push('/no-web-access');\n }\n };\n\n useEffect(() => {\n getCaseData();\n }, [sharedToken]);\n\n return (\n \n
\n );\n }\n\n return (\n \n
\n {!!course?.courseLessons?.[0]?.lesson && (\n \n
\n \n \n
\n \n {title}\n \n {name}\n \n
\n);\n\nconst AuthBlock = ({\n title,\n subTitle,\n children,\n links,\n successBlock,\n noFooterInfo,\n large,\n subTitleClassName = 'opc-3',\n}) => {\n return (\n\n \n \n \n {successBlock ? (\n successBlock\n ) : (\n <>\n {title &&
\n {!noFooterInfo && (\n {title}
}\n {subTitle &&{subTitle}
}\n{children}
\n \n )}\n \n {links.reset &&
\n )}\n \n );\n};\n\nexport default AuthBlock;\n","import React, { useState } from 'react';\nimport { connect } from 'react-redux';\nimport InputGroup from 'shared/components/InputGroup';\nimport { loginUser } from './../actions/index';\nimport { Api } from 'utils/connectors';\nimport { getError } from 'utils/appHelpers';\nimport ButtonLine from 'shared/components/ButtonLine';\nimport AuthBlock from '../components/AuthBlock';\nimport { IconMail, IconPassword } from 'shared/components/Icons';\nimport AuthPage from '../components/AuthPage';\n\nconst Login = ({ loginUser, history, location }) => {\n const [error, setError] = useState();\n const [fetch, setFetch] = useState();\n const [auth, setAuth] = useState({\n email: '',\n password: '',\n });\n\n const authOptions = {\n title: <>Welcome to ACE,\n links: { signup: true, reset: true },\n };\n\n const handleSubmit = async e => {\n e.preventDefault();\n setFetch(true);\n try {\n const res = await Api.post('/auth/login', auth);\n if (res.data.data.pendingConfirmation) {\n history.push({ pathname: 'email-verification', state: { email: auth.email } });\n return;\n }\n await loginUser(res.data, history, location.state?.loginForwardUrl);\n setFetch(false);\n } catch (err) {\n setError(getError(err));\n setFetch(false);\n }\n };\n\n const handleChange = ({ target }) => {\n const { name, value } = target;\n const tempAuth = { ...auth };\n tempAuth[name] = value;\n setAuth(tempAuth);\n };\n\n return (\n \n
\n \n \n \n \n
\n \n
\n \n
\n End-User Software License Agreement
\n\n
\n
\n By clicking the “I Agree” button, downloading or using the Licensed Software, You are\n agreeing to be bound by the terms and conditions of this Agreement. If You are accepting\n these terms of behalf of another person or company or other legal entity, You represent\n and warrant that you have full authority to bind that person, company or legal entity to\n these terms.\n
\n
\n If You do not agree to the terms of this Agreement, do not click on the “I Agree” button\n and You cannot download or use the Licensed Software.\n
\n
\n “You” or “Your” means the person or entity who is being licensed to use the Licensed\n Software in association with any sales or service agreement (“Usage Agreement”). “We”,\n “Our” and “Us” means Hologic, Inc.\n
\n
\n 1. License Grant. We grant You a revocable, non-exclusive, non-transferable, limited\n right to access and use the Licensed Software on a device owned and controlled by You,\n and to access and use the Licensed Software strictly in accordance with the terms and\n conditions of this Agreement, the Usage Agreement and any service agreement, sales\n agreement or any other agreement with You, (collectively, “Related Agreements”).\n
\n
\n 2. Restrictions on Use. You shall use the Licensed Software strictly in accordance with\n the terms of the Related Agreements and shall not: (a) decompile, reverse engineer,\n disassemble, attempt to derive the source code of, maliciously penetrate any system or\n network which runs or stores, or decrypt the Licensed Software; (b) make any\n modification, automation, conversion, adaptation, improvement, enhancement, translation\n or derivative work to or from the Licensed Software; (c) remove, circumvent or create,\n or use any workaround to any copy protection or security feature relating to the\n Licensed Software; (d) violate any applicable laws, rules or regulations in connection\n with Your access or use of the Licensed Software; (e) remove, alter, or obscure any\n proprietary notice (including any notice of copyright or trademark) of Ours or Our\n affiliates, partners, suppliers or licensors; (f) use the Licensed Software for any\n revenue generating endeavor, commercial enterprise, or other purpose for which it is not\n designed or intended; (g) install, use or permit the Licensed Software to be used only\n on the originally designated Equipment for the Licensed Software; (h) make the Licensed\n Software available over a network or other environment permitting access or use by\n multiple devices or users at the same time; (i) use the Licensed Software for creating a\n product, service or software that is, directly or indirectly, competitive with or in any\n way a substitute for any product, services or software offered by Us; (j) use the\n Licensed Software to send automated queries to any website or to send any unsolicited\n commercial e-mail; (k) connect the Licensed Software to any online service or other\n applications, software or services not provided or permitted by Us; (l) use any\n proprietary information or interfaces of Ours or other intellectual property of Ours in\n the design, development, manufacture, licensing or distribution of any applications,\n accessories or devices for use with the Licensed Software; (m) own title, or transfer\n title to the Licensed Software to any third party; (n) distribute, or sublicense or\n otherwise provide copies or any rights in relation to the Licensed Software to any third\n party; or (o) pledge, hypothecate, alienate or otherwise encumber the Licensed Software\n to any third party.
\n
3. Consent to Use of Content. You agree that We may collect and use device data\n and related information, including but not limited to technical information about Your\n devices, products, system and application software, and peripherals, that is gathered to\n facilitate the provision of software updates, product support and other services to You\n related to the Licensed Software (collectively, “Data”). You may also have agreed to\n provide information, feedback, de-identified images, and other content in connection\n with Your use of the Licensed Software (together with the Data, collectively,\n “Content”). You agree that We may use the Content to improve the products and services\n or to provide products and services to You, and You hereby grant Us a non-exclusive,\n worldwide, royalty-free, fully paid-up, transferable and sub- licensable license in and\n to the Content, including all intellectual property rights therein, for Us to use,\n modify and create derivative works of the same in connection with or related to any\n business purposes. You represent and warrant to Us that (i) you have the necessary\n rights to grant the licenses and rights in the Content, and (ii) the Content and Our use\n thereof as permitted in this Agreement will not infringe, violate or misappropriate any\n third party right. Content will not include any patient health information (“PHI”). For\n the avoidance of doubt, "Protected Health Information" or "PHI"\n shall mean individually identifiable health information regardless of the form in which\n it is maintained or transmitted. We may, at our sole discretion, aggregate and\n de-identify any and all PHI obtained under this Agreement and use all such de-identified\n data in accordance with the de-identification requirements at 45 CFR 164.514(b). With\n respect to de-identification, the aggregated and de-identified data We produce or use\n either: (i) will not include any identifiers listed in 45 CFR 164.514(b)(2)(i), or (ii)\n will have been determined by a person with appropriate knowledge of and experience with\n generally accepted statistical and scientific principles and methods for rendering\n information not individually identifiable and applying such principles and methods, that\n the risk is very small that the aggregated and de-identified data generated under this\n Agreement could be used, alone or in combination with other reasonably available\n information, by an anticipated recipient, to identify an individual who is a subject of\n the information, thereby forming a "statistically de-identified data set" and\n rendering the information not PHI under HIPAA. De-identified information does not\n constitute PHI and is not subject to the terms of this Agreement.\n
\n
4. Intellectual Property Rights. You acknowledge and agree that the Licensed\n Software and Our documentation are provided under license, and not sold, to You. You do\n not acquire any ownership interest in the Licensed Software or Our documentation under\n this Agreement, or any other rights thereto, other than to use the Licensed Software in\n accordance with Our documentation, subject to all of the terms, conditions and\n restrictions under this Agreement and any Usage Agreement. We reserve and shall retain\n all right, title and interest in and to the Licensed Software and all intellectual\n property rights arising out of or relating to the Licensed Software, except as expressly\n granted to You in this Agreement. You shall safeguard the Licensed Software from\n infringement, misappropriation, theft, misuse or unauthorized access. You shall promptly\n notify Us if You become aware of any infringement of Our intellectual property rights in\n the Licensed Software and fully cooperate with Us in any legal action taken by Us to\n enforce Our intellectual property rights. Further, We will be free to use any ideas,\n concepts, know-how or techniques contained in such Content for any purpose whatsoever,\n including, without limitation, developing, making, marketing, distributing and selling\n products and services incorporating such Content. We will have no obligation to\n consider, use, return or preserve any of the Content you provide to Us. Any Content You\n provide to Us may or may not be treated confidentially by Us, and We will have no\n obligation or liability to You for the use or disclosure of any of the Content. You\n should not to expect any compensation of any kind from Us with respect to the Content\n You provided.
\n
\n 5. Limited Warranty and Disclaimer.\n
\n a) Limited Warranty. We warrant that, for a period of ninety (90) days following the\n date the Licensed Software is made available to You for Your use, the Licensed Software\n will perform substantially in accordance with Our documentation (the “Limited\n Warranty”).\n
b) Exclusive Remedy. In case of any breach of the above Limited Warranty, as your\n exclusive remedy and Our entire obligation and liability, We will: (i) repair or replace\n the Licensed Software; or (ii) if such repair or replacement would in Our opinion be\n commercially unreasonable, upon Our receipt of Your written representation and promise\n that you have removed all instances of the Licensed Software and will not use the\n Licensed Software, refund the price paid by You for the applicable Licensed Software.{' '}\n
\n c) Exclusion of Warranty. THE ABOVE LIMITED WARRANTY WILL NOT APPLY IF: (i) THE LICENSED\n SOFTWARE IS NOT USED IN ACCORDANCE WITH THIS AGREEMENT OR OUR DOCUMENTATION; (ii) THE\n LICENSED SOFTWARE OR ANY PART THEREOF HAS BEEN MODIFIED BY YOU OR ANY ENTITY OTHER THAN\n US; OR (iii) A MALFUNCTION IN THE LICENSED SOFTWARE HAS NOT BEEN CAUSED BY ANY EQUIPMENT\n OR SOFTWARE NOT APPROVED OR SUPPLIED BY US.
\n d) Disclaimer. EXCEPT FOR THE LIMITED WARRANTY SET FORTH ABOVE, THE LICENSED SOFTWARE IS\n PROVIDED “AS IS” AND WE MAKE NO REPRESENTATIONS OR WARRANTIES, AND WE DISCLAIM ALL\n REPRESENTATIONS, WARRANTIES AND CONDITIONS, ORAL OR WRITTEN, EXPRESS OR IMPLIED, ARISING\n FROM COURSE OF DEALING, COURSE OF PERFORMANCE, OR USAGE IN TRADE, OR OTHERWISE,\n INCLUDING, WITHOUT LIMITATION, IMPLIED WARRANTIES OF MERCHANTABILITY, QUALITY, FITNESS\n FOR A PARTICULAR PURPOSE, TITLE, NON-INFRINGEMENT, OR SYSTEMS INTEGRATION. WITHOUT\n LIMITING THE FOREGOING, WE MAKE NO WARRANTY, REPRESENTATION, OR GUARANTEE THAT THE\n OPERATION OF THE LICENSED SOFTWARE WILL BE FAILSAFE, UNINTERRUPTED, OR FREE FROM ERRORS\n OR DEFECTS.
\n
\n 6. Limitation of Liability. TO THE EXTENT NOT PROHIBITED BY LAW, IN NO EVENT SHALL WE BE\n LIABLE FOR PERSONAL INJURY, OR ANY INCIDENTAL, SPECIAL, INDIRECT OR CONSEQUENTIAL\n DAMAGES WHATSOEVER, INCLUDING, WITHOUT LIMITATION, DAMAGES FOR LOSS OF PROFITS, LOSS OF\n DATA, BUSINESS INTERRUPTION OR ANY COMMERCIAL DAMAGES OR LOSSES, ARISING OUT OF OR\n RELATED TO YOUR USE OR INABILITY TO USE THE LICENSED SOFTWARE, HOWEVER CAUSED,\n REGARDLESS OF THE THEORY OF LIABILITY (CONTRACT, TORT (INCLUDING NEGLIGENCE), OR\n OTHERWISE) AND EVEN IF WE HAVE BEEN ADVISED OF THE POSSIBILITY OF SUCH DAMAGES. SOME\n JURISDICTIONS DO NOT ALLOW THE LIMITATION OF LIABILITY FOR PERSONAL INJURY, OR OF\n INCIDENTAL OR CONSEQUENTIAL DAMAGES, SO THIS LIMITATION MAY NOT APPLY TO YOU. IN NO\n EVENT SHALL OUR TOTAL LIABILITY TO YOU FOR ALL DAMAGES EXCEED THE LICENSED SOFTWARE FEE\n PAID BY YOU FOR THE APPLICABLE TERM. NOTHING IN THIS AGREEMENT LIMITS OR EXCLUDES ANY\n LIABILITY THAT CANNOT BE LIMITED OR EXCLUDED UNDER APPLICABLE LAW.\n
\n
\n 7. Intellectual Property Indemnity.\n
a) Indemnity. We will indemnify, and at our election, defend, You against claims\n asserted against You in a suit or action if: (i) the claim is for direct patent\n infringement or direct copyright infringement, or for misappropriation of third party\n trade secrets; (ii) the claim is asserted against the Licensed Software, alone and not\n in combination with any third party software or systems.\n
\n b) Exclusions. Notwithstanding anything else in this Agreement, We have no obligation to\n indemnify or defend you for claims asserted, in whole or in part, if (i) the Licensed\n Software is not used in accordance with this Agreement or Our documentation; (ii) the\n Licensed Software or any part thereof has been modified by You or any entity other than\n Us; or (iii) a malfunction in the Licensed Software has been caused by any equipment or\n software not approved or supplied by Us.
\n c) Conditions. As a condition of Our obligations under this Section 7, You must provide\n Us with: (i) prompt written notice of the claim and Your agreement to give Us sole\n control over the defense and settlement of the claim; and Your full and timely\n cooperation. We will not be responsible for any costs, expenses or compromises that You\n make or incur without Our written consent.\n
d) Remedies. We may, at Our sole discretion and expense: (i) procure for you the\n right to continue using the Licensed Software; (ii) replace the Licensed Software with\n non-infringing Licensed Software; (iii) modify the Licensed Software so that it becomes\n non-infringing; or (iv) upon Your return of the Licensed Software to Us, and/or removal\n of the Licensed Software from your systems, refund the residual value of the Licensed\n Software fee paid by You for the infringing Licensed Software, depreciated using a\n straight-line method of depreciation over a three (3) year period from the date of\n delivery of the Licensed Software to You. This indemnity section states Our entire\n obligation and Your exclusive remedy for claims of patent or copyright infringement, or\n trade secret misappropriation, made in whole or in part against the Licensed Software.\n
\n
8. Export. You may not use or otherwise export or re-export the Licensed Software\n except as authorized by United States law and the laws of the jurisdiction in which the\n Licensed Software was obtained. In particular, but without limitation, the Licensed\n Software may not be exported or re-exported: (i) into any U.S. embargoed countries; or\n (ii) to anyone on the U.S. Treasury Department’s list of Specially Designated Nationals\n or the U.S. Department of Commerce Denied Person’s List or Entity List. By using the\n Licensed Software, You represent and warrant that You are not located in any such\n country or on any such list and that You will not use the Licensed Software for any\n purposes prohibited by United States law.
\n
\n 9. Term. The term of this Agreement will commence on the date of Your agreement to these\n terms and shall continue for the same term as the Usage Agreement. Hologic may terminate\n this Agreement at any time for any reason, including to the extent that any Usage\n Agreement has been terminated or expired.
\n
\n 10. General. a) Governing Law. Jurisdiction. Upon acceptance of these terms, this\n Agreement is governed by the laws of the Commonwealth of Massachusetts, without regard\n to any conflict of law principles to the contrary. You hereby irrevocably consent to\n jurisdiction of the state and federal courts located in Boston, Massachusetts with\n respect to any proceeding regarding this Agreement or the Licensed Software. The 1980 UN\n Convention for the International Sale of Goods or any successor thereto does not apply\n to this Agreement. You will not prosecute any action, suit, proceeding or claim arising\n under or by reason of this Agreement or the Licensed Software except in such courts.\n
b) Severability. If any provision of this Agreement is held by a court of\n competent jurisdiction to be invalid or unenforceable, the remainder of this Agreement\n will remain in full force and effect, and the remaining provisions will be amended to\n achieve as closely as possible the effect of the original term and all other provisions\n of this Agreement will continue in full force.\n
c) Assignment. You may not assign or otherwise transfer the Licensed Software or\n this Agreement, or assign, sub-license or otherwise transfer to any other person or\n entity any of Your rights under this Agreement without Our prior written consent, and\n any attempted assignment without such consent will be void.
\n d) Notices. All "notices" provided by You under this Agreement shall be in\n writing sent to the contact information associated with the user account to access the\n Licensed Software or other means providing proof of delivery.
\n e) Revisions to this Agreement. We may at any time revise the terms of this Agreement by\n updating these terms and by providing notice to You of that change upon You accessing\n the Licensed Software at the time of said change and agreeing to the revised terms.{' '}\n
\n
\n 11. Entire Agreement. This Agreement together with the Related Agreements sets forth Our\n entire agreement with respect to Your use of the Licensed Software and supersedes all\n prior and contemporaneous understandings and agreements with respect to the Licensed\n Software and Your use thereof whether written or oral. In the event of a conflict, the\n Usage Agreement shall supersede and control over the terms of this End-User Software\n License Agreement.\n
\n
\n 12. General Disclaimers. This is a general information tool for medical professionals\n and is not a complete representation of the product(s)’ Instruction for Use (IFU) or\n Package Insert, and it is the medical professionals’ responsibility to read and follow\n the IFU or Package Insert. The information provided may suggest a particular technique\n or protocol however it is the sole responsibility of the medical professional to\n determine which technique or protocol is appropriate. At all times, clinicians remain\n responsible for utilizing sound patient evaluation and selection practices, and for\n complying with applicable local, state, and federal rules and regulations regarding\n accreditation, anesthesia, reimbursement, and all other aspects of in- office\n procedures. In no event shall Hologic be liable for damages of any kind resulting from\n your use of the information presented. This information is intended for medical\n professionals in the U.S. and other markets and is not intended as a product\n solicitation or promotion where such activities are prohibited. Because Hologic\n materials are distributed through websites, eBroadcasts, and tradeshows, it is not\n always possible to control where such materials appear. For specific information on what\n products are available for sale in a particular country, please contact your local\n Hologic representative or write to womenshealth@hologic.com
\n
13. Medical Use Disclaimer. This training program is not intended for clinical or\n diagnostic use.
\n
\n 14. Faculty Statement Disclaimer. Views and opinions expressed herein by third parties\n are theirs alone and do not necessarily reflect those of Hologic. 15. Copyright.\n Copyright© 2020, Hologic. Inc. Reproduction, display or copying of this information\n without express written permission is strictly prohibited. All materials, images, and\n content are intellectual property of Hologic and may not be copied, reproduced,\n distributed, or displayed without permission.\n
\n Last updated: August 20, 2020
\n Please read this End-User Software License Agreement (hereinafter the “Agreement”)\n carefully before clicking the “I Agree” button, downloading or using the software\n (hereinafter the “Licensed Software”).\n\n
\n By clicking the “I Agree” button, downloading or using the Licensed Software, You are\n agreeing to be bound by the terms and conditions of this Agreement. If You are accepting\n these terms of behalf of another person or company or other legal entity, You represent\n and warrant that you have full authority to bind that person, company or legal entity to\n these terms.\n
\n
\n If You do not agree to the terms of this Agreement, do not click on the “I Agree” button\n and You cannot download or use the Licensed Software.\n
\n
\n “You” or “Your” means the person or entity who is being licensed to use the Licensed\n Software in association with any sales or service agreement (“Usage Agreement”). “We”,\n “Our” and “Us” means Hologic, Inc.\n
\n
\n 1. License Grant. We grant You a revocable, non-exclusive, non-transferable, limited\n right to access and use the Licensed Software on a device owned and controlled by You,\n and to access and use the Licensed Software strictly in accordance with the terms and\n conditions of this Agreement, the Usage Agreement and any service agreement, sales\n agreement or any other agreement with You, (collectively, “Related Agreements”).\n
\n
\n 2. Restrictions on Use. You shall use the Licensed Software strictly in accordance with\n the terms of the Related Agreements and shall not: (a) decompile, reverse engineer,\n disassemble, attempt to derive the source code of, maliciously penetrate any system or\n network which runs or stores, or decrypt the Licensed Software; (b) make any\n modification, automation, conversion, adaptation, improvement, enhancement, translation\n or derivative work to or from the Licensed Software; (c) remove, circumvent or create,\n or use any workaround to any copy protection or security feature relating to the\n Licensed Software; (d) violate any applicable laws, rules or regulations in connection\n with Your access or use of the Licensed Software; (e) remove, alter, or obscure any\n proprietary notice (including any notice of copyright or trademark) of Ours or Our\n affiliates, partners, suppliers or licensors; (f) use the Licensed Software for any\n revenue generating endeavor, commercial enterprise, or other purpose for which it is not\n designed or intended; (g) install, use or permit the Licensed Software to be used only\n on the originally designated Equipment for the Licensed Software; (h) make the Licensed\n Software available over a network or other environment permitting access or use by\n multiple devices or users at the same time; (i) use the Licensed Software for creating a\n product, service or software that is, directly or indirectly, competitive with or in any\n way a substitute for any product, services or software offered by Us; (j) use the\n Licensed Software to send automated queries to any website or to send any unsolicited\n commercial e-mail; (k) connect the Licensed Software to any online service or other\n applications, software or services not provided or permitted by Us; (l) use any\n proprietary information or interfaces of Ours or other intellectual property of Ours in\n the design, development, manufacture, licensing or distribution of any applications,\n accessories or devices for use with the Licensed Software; (m) own title, or transfer\n title to the Licensed Software to any third party; (n) distribute, or sublicense or\n otherwise provide copies or any rights in relation to the Licensed Software to any third\n party; or (o) pledge, hypothecate, alienate or otherwise encumber the Licensed Software\n to any third party.
\n
3. Consent to Use of Content. You agree that We may collect and use device data\n and related information, including but not limited to technical information about Your\n devices, products, system and application software, and peripherals, that is gathered to\n facilitate the provision of software updates, product support and other services to You\n related to the Licensed Software (collectively, “Data”). You may also have agreed to\n provide information, feedback, de-identified images, and other content in connection\n with Your use of the Licensed Software (together with the Data, collectively,\n “Content”). You agree that We may use the Content to improve the products and services\n or to provide products and services to You, and You hereby grant Us a non-exclusive,\n worldwide, royalty-free, fully paid-up, transferable and sub- licensable license in and\n to the Content, including all intellectual property rights therein, for Us to use,\n modify and create derivative works of the same in connection with or related to any\n business purposes. You represent and warrant to Us that (i) you have the necessary\n rights to grant the licenses and rights in the Content, and (ii) the Content and Our use\n thereof as permitted in this Agreement will not infringe, violate or misappropriate any\n third party right. Content will not include any patient health information (“PHI”). For\n the avoidance of doubt, "Protected Health Information" or "PHI"\n shall mean individually identifiable health information regardless of the form in which\n it is maintained or transmitted. We may, at our sole discretion, aggregate and\n de-identify any and all PHI obtained under this Agreement and use all such de-identified\n data in accordance with the de-identification requirements at 45 CFR 164.514(b). With\n respect to de-identification, the aggregated and de-identified data We produce or use\n either: (i) will not include any identifiers listed in 45 CFR 164.514(b)(2)(i), or (ii)\n will have been determined by a person with appropriate knowledge of and experience with\n generally accepted statistical and scientific principles and methods for rendering\n information not individually identifiable and applying such principles and methods, that\n the risk is very small that the aggregated and de-identified data generated under this\n Agreement could be used, alone or in combination with other reasonably available\n information, by an anticipated recipient, to identify an individual who is a subject of\n the information, thereby forming a "statistically de-identified data set" and\n rendering the information not PHI under HIPAA. De-identified information does not\n constitute PHI and is not subject to the terms of this Agreement.\n
\n
4. Intellectual Property Rights. You acknowledge and agree that the Licensed\n Software and Our documentation are provided under license, and not sold, to You. You do\n not acquire any ownership interest in the Licensed Software or Our documentation under\n this Agreement, or any other rights thereto, other than to use the Licensed Software in\n accordance with Our documentation, subject to all of the terms, conditions and\n restrictions under this Agreement and any Usage Agreement. We reserve and shall retain\n all right, title and interest in and to the Licensed Software and all intellectual\n property rights arising out of or relating to the Licensed Software, except as expressly\n granted to You in this Agreement. You shall safeguard the Licensed Software from\n infringement, misappropriation, theft, misuse or unauthorized access. You shall promptly\n notify Us if You become aware of any infringement of Our intellectual property rights in\n the Licensed Software and fully cooperate with Us in any legal action taken by Us to\n enforce Our intellectual property rights. Further, We will be free to use any ideas,\n concepts, know-how or techniques contained in such Content for any purpose whatsoever,\n including, without limitation, developing, making, marketing, distributing and selling\n products and services incorporating such Content. We will have no obligation to\n consider, use, return or preserve any of the Content you provide to Us. Any Content You\n provide to Us may or may not be treated confidentially by Us, and We will have no\n obligation or liability to You for the use or disclosure of any of the Content. You\n should not to expect any compensation of any kind from Us with respect to the Content\n You provided.
\n
\n 5. Limited Warranty and Disclaimer.\n
\n a) Limited Warranty. We warrant that, for a period of ninety (90) days following the\n date the Licensed Software is made available to You for Your use, the Licensed Software\n will perform substantially in accordance with Our documentation (the “Limited\n Warranty”).\n
b) Exclusive Remedy. In case of any breach of the above Limited Warranty, as your\n exclusive remedy and Our entire obligation and liability, We will: (i) repair or replace\n the Licensed Software; or (ii) if such repair or replacement would in Our opinion be\n commercially unreasonable, upon Our receipt of Your written representation and promise\n that you have removed all instances of the Licensed Software and will not use the\n Licensed Software, refund the price paid by You for the applicable Licensed Software.{' '}\n
\n c) Exclusion of Warranty. THE ABOVE LIMITED WARRANTY WILL NOT APPLY IF: (i) THE LICENSED\n SOFTWARE IS NOT USED IN ACCORDANCE WITH THIS AGREEMENT OR OUR DOCUMENTATION; (ii) THE\n LICENSED SOFTWARE OR ANY PART THEREOF HAS BEEN MODIFIED BY YOU OR ANY ENTITY OTHER THAN\n US; OR (iii) A MALFUNCTION IN THE LICENSED SOFTWARE HAS NOT BEEN CAUSED BY ANY EQUIPMENT\n OR SOFTWARE NOT APPROVED OR SUPPLIED BY US.
\n d) Disclaimer. EXCEPT FOR THE LIMITED WARRANTY SET FORTH ABOVE, THE LICENSED SOFTWARE IS\n PROVIDED “AS IS” AND WE MAKE NO REPRESENTATIONS OR WARRANTIES, AND WE DISCLAIM ALL\n REPRESENTATIONS, WARRANTIES AND CONDITIONS, ORAL OR WRITTEN, EXPRESS OR IMPLIED, ARISING\n FROM COURSE OF DEALING, COURSE OF PERFORMANCE, OR USAGE IN TRADE, OR OTHERWISE,\n INCLUDING, WITHOUT LIMITATION, IMPLIED WARRANTIES OF MERCHANTABILITY, QUALITY, FITNESS\n FOR A PARTICULAR PURPOSE, TITLE, NON-INFRINGEMENT, OR SYSTEMS INTEGRATION. WITHOUT\n LIMITING THE FOREGOING, WE MAKE NO WARRANTY, REPRESENTATION, OR GUARANTEE THAT THE\n OPERATION OF THE LICENSED SOFTWARE WILL BE FAILSAFE, UNINTERRUPTED, OR FREE FROM ERRORS\n OR DEFECTS.
\n
\n 6. Limitation of Liability. TO THE EXTENT NOT PROHIBITED BY LAW, IN NO EVENT SHALL WE BE\n LIABLE FOR PERSONAL INJURY, OR ANY INCIDENTAL, SPECIAL, INDIRECT OR CONSEQUENTIAL\n DAMAGES WHATSOEVER, INCLUDING, WITHOUT LIMITATION, DAMAGES FOR LOSS OF PROFITS, LOSS OF\n DATA, BUSINESS INTERRUPTION OR ANY COMMERCIAL DAMAGES OR LOSSES, ARISING OUT OF OR\n RELATED TO YOUR USE OR INABILITY TO USE THE LICENSED SOFTWARE, HOWEVER CAUSED,\n REGARDLESS OF THE THEORY OF LIABILITY (CONTRACT, TORT (INCLUDING NEGLIGENCE), OR\n OTHERWISE) AND EVEN IF WE HAVE BEEN ADVISED OF THE POSSIBILITY OF SUCH DAMAGES. SOME\n JURISDICTIONS DO NOT ALLOW THE LIMITATION OF LIABILITY FOR PERSONAL INJURY, OR OF\n INCIDENTAL OR CONSEQUENTIAL DAMAGES, SO THIS LIMITATION MAY NOT APPLY TO YOU. IN NO\n EVENT SHALL OUR TOTAL LIABILITY TO YOU FOR ALL DAMAGES EXCEED THE LICENSED SOFTWARE FEE\n PAID BY YOU FOR THE APPLICABLE TERM. NOTHING IN THIS AGREEMENT LIMITS OR EXCLUDES ANY\n LIABILITY THAT CANNOT BE LIMITED OR EXCLUDED UNDER APPLICABLE LAW.\n
\n
\n 7. Intellectual Property Indemnity.\n
a) Indemnity. We will indemnify, and at our election, defend, You against claims\n asserted against You in a suit or action if: (i) the claim is for direct patent\n infringement or direct copyright infringement, or for misappropriation of third party\n trade secrets; (ii) the claim is asserted against the Licensed Software, alone and not\n in combination with any third party software or systems.\n
\n b) Exclusions. Notwithstanding anything else in this Agreement, We have no obligation to\n indemnify or defend you for claims asserted, in whole or in part, if (i) the Licensed\n Software is not used in accordance with this Agreement or Our documentation; (ii) the\n Licensed Software or any part thereof has been modified by You or any entity other than\n Us; or (iii) a malfunction in the Licensed Software has been caused by any equipment or\n software not approved or supplied by Us.
\n c) Conditions. As a condition of Our obligations under this Section 7, You must provide\n Us with: (i) prompt written notice of the claim and Your agreement to give Us sole\n control over the defense and settlement of the claim; and Your full and timely\n cooperation. We will not be responsible for any costs, expenses or compromises that You\n make or incur without Our written consent.\n
d) Remedies. We may, at Our sole discretion and expense: (i) procure for you the\n right to continue using the Licensed Software; (ii) replace the Licensed Software with\n non-infringing Licensed Software; (iii) modify the Licensed Software so that it becomes\n non-infringing; or (iv) upon Your return of the Licensed Software to Us, and/or removal\n of the Licensed Software from your systems, refund the residual value of the Licensed\n Software fee paid by You for the infringing Licensed Software, depreciated using a\n straight-line method of depreciation over a three (3) year period from the date of\n delivery of the Licensed Software to You. This indemnity section states Our entire\n obligation and Your exclusive remedy for claims of patent or copyright infringement, or\n trade secret misappropriation, made in whole or in part against the Licensed Software.\n
\n
8. Export. You may not use or otherwise export or re-export the Licensed Software\n except as authorized by United States law and the laws of the jurisdiction in which the\n Licensed Software was obtained. In particular, but without limitation, the Licensed\n Software may not be exported or re-exported: (i) into any U.S. embargoed countries; or\n (ii) to anyone on the U.S. Treasury Department’s list of Specially Designated Nationals\n or the U.S. Department of Commerce Denied Person’s List or Entity List. By using the\n Licensed Software, You represent and warrant that You are not located in any such\n country or on any such list and that You will not use the Licensed Software for any\n purposes prohibited by United States law.
\n
\n 9. Term. The term of this Agreement will commence on the date of Your agreement to these\n terms and shall continue for the same term as the Usage Agreement. Hologic may terminate\n this Agreement at any time for any reason, including to the extent that any Usage\n Agreement has been terminated or expired.
\n
\n 10. General. a) Governing Law. Jurisdiction. Upon acceptance of these terms, this\n Agreement is governed by the laws of the Commonwealth of Massachusetts, without regard\n to any conflict of law principles to the contrary. You hereby irrevocably consent to\n jurisdiction of the state and federal courts located in Boston, Massachusetts with\n respect to any proceeding regarding this Agreement or the Licensed Software. The 1980 UN\n Convention for the International Sale of Goods or any successor thereto does not apply\n to this Agreement. You will not prosecute any action, suit, proceeding or claim arising\n under or by reason of this Agreement or the Licensed Software except in such courts.\n
b) Severability. If any provision of this Agreement is held by a court of\n competent jurisdiction to be invalid or unenforceable, the remainder of this Agreement\n will remain in full force and effect, and the remaining provisions will be amended to\n achieve as closely as possible the effect of the original term and all other provisions\n of this Agreement will continue in full force.\n
c) Assignment. You may not assign or otherwise transfer the Licensed Software or\n this Agreement, or assign, sub-license or otherwise transfer to any other person or\n entity any of Your rights under this Agreement without Our prior written consent, and\n any attempted assignment without such consent will be void.
\n d) Notices. All "notices" provided by You under this Agreement shall be in\n writing sent to the contact information associated with the user account to access the\n Licensed Software or other means providing proof of delivery.
\n e) Revisions to this Agreement. We may at any time revise the terms of this Agreement by\n updating these terms and by providing notice to You of that change upon You accessing\n the Licensed Software at the time of said change and agreeing to the revised terms.{' '}\n
\n
\n 11. Entire Agreement. This Agreement together with the Related Agreements sets forth Our\n entire agreement with respect to Your use of the Licensed Software and supersedes all\n prior and contemporaneous understandings and agreements with respect to the Licensed\n Software and Your use thereof whether written or oral. In the event of a conflict, the\n Usage Agreement shall supersede and control over the terms of this End-User Software\n License Agreement.\n
\n
\n 12. General Disclaimers. This is a general information tool for medical professionals\n and is not a complete representation of the product(s)’ Instruction for Use (IFU) or\n Package Insert, and it is the medical professionals’ responsibility to read and follow\n the IFU or Package Insert. The information provided may suggest a particular technique\n or protocol however it is the sole responsibility of the medical professional to\n determine which technique or protocol is appropriate. At all times, clinicians remain\n responsible for utilizing sound patient evaluation and selection practices, and for\n complying with applicable local, state, and federal rules and regulations regarding\n accreditation, anesthesia, reimbursement, and all other aspects of in- office\n procedures. In no event shall Hologic be liable for damages of any kind resulting from\n your use of the information presented. This information is intended for medical\n professionals in the U.S. and other markets and is not intended as a product\n solicitation or promotion where such activities are prohibited. Because Hologic\n materials are distributed through websites, eBroadcasts, and tradeshows, it is not\n always possible to control where such materials appear. For specific information on what\n products are available for sale in a particular country, please contact your local\n Hologic representative or write to womenshealth@hologic.com
\n
13. Medical Use Disclaimer. This training program is not intended for clinical or\n diagnostic use.
\n
\n 14. Faculty Statement Disclaimer. Views and opinions expressed herein by third parties\n are theirs alone and do not necessarily reflect those of Hologic. 15. Copyright.\n Copyright© 2020, Hologic. Inc. Reproduction, display or copying of this information\n without express written permission is strictly prohibited. All materials, images, and\n content are intellectual property of Hologic and may not be copied, reproduced,\n distributed, or displayed without permission.\n
\n history.goBack()} className='p-0'>\n Done\n \n
\n \n
\n );\n};\n\nexport default SuccessInfo;\n","import React, { useState } from 'react';\nimport InputGroup from 'shared/components/InputGroup';\nimport { Api } from 'utils/connectors';\nimport { getError } from 'utils/appHelpers';\nimport AuthBlock from '../components/AuthBlock';\nimport { IconPassword } from 'shared/components/Icons';\nimport SuccessInfo from '../components/SuccessInfo';\nimport Button from 'shared/components/Button';\nimport AuthPage from '../components/AuthPage';\n\nconst Reset = ({ match }) => {\n const [success, setSuccess] = useState(false);\n const [error, setError] = useState();\n const [fetch, setFetch] = useState();\n const [pass, setPass] = useState({\n password: '',\n rpassword: '',\n });\n\n const authOptions = {\n title: 'New password',\n subTitle: 'Please enter new password.',\n links: { signup: true },\n subTitleClassName: '',\n };\n\n const passwordMatch = pass.password === pass.rpassword;\n\n const handleChange = ({ target }) => {\n const { name, value } = target;\n const tempAuth = { ...pass };\n tempAuth[name] = value;\n setPass(tempAuth);\n };\n\n const handleSubmit = async e => {\n e.preventDefault();\n setFetch(true);\n try {\n const body = {\n resetToken: match.params.code,\n password: pass.password,\n };\n await Api.post(`/auth/reset-password`, body);\n setSuccess(true);\n } catch (err) {\n setError(getError(err));\n } finally {\n setFetch(false);\n }\n };\n\n return (\n \n
\n {title}
\n{subTitle}
\n\n \n Sign In\n \n
\n \n
\n );\n};\n\nexport default InfoStep;\n","import React, { useState } from 'react';\nimport InputGroup from 'shared/components/InputGroup';\nimport { countries, degrees, specialty, states } from '../configs';\nimport Select from 'shared/components/Select';\nimport Button from 'shared/components/Button';\n\nconst FormStep = ({ formSubmit, user, fetch, error, regCode, lastForm, isEventUser }) => {\n const intial = {\n fname: '',\n lname: '',\n email: '',\n institution: '',\n countryId: '',\n city: '',\n address: '',\n phone: '',\n zipCode: '',\n degree: '',\n specialty: '',\n prefferedNameOnCertificate: '',\n password: '',\n rpassword: '',\n state: '',\n ...user,\n ...lastForm,\n };\n const [info, setInfo] = useState(intial);\n\n const areAllRequiredFieldsFilled = () => {\n const requiredFields = [\n 'fname',\n 'lname',\n 'degree',\n 'specialty',\n 'email',\n 'password',\n 'rpassword',\n 'institution',\n 'countryId',\n 'city',\n 'state',\n 'zipCode',\n 'address',\n 'phone',\n ];\n return requiredFields.every(field => Boolean(info[field]));\n };\n\n const isCountryUs = info.countryId === '226';\n const passwordMatch = info.password === info.rpassword;\n\n const handleChange = ({ target }) => {\n const { name, value } = target;\n const tempAuth = { ...info };\n tempAuth[name] = value;\n setInfo(tempAuth);\n };\n\n const handleFormSubmit = e => {\n e.preventDefault();\n const body = {\n regCode,\n email: info.email,\n password: isEventUser ? undefined : info.password,\n firstname: info.fname,\n lastname: info.lname,\n usertype: 1,\n countryid: info.countryId,\n learnerprofile: {\n state: info.state,\n institution: info.institution,\n city: info.city,\n address: info.address,\n zipCode: info.zipCode,\n phone: info.phone,\n degree: info.degree,\n profession: info.specialty,\n },\n };\n if (info.prefferedNameOnCertificate) {\n body.learnerprofile.prefferedNameOnCertificate = info.prefferedNameOnCertificate;\n }\n formSubmit(body, info);\n };\n\n return (\n \n );\n};\n\nexport default FormStep;\n","import React from 'react';\nimport AuthBlock from './AuthBlock';\nimport Button from 'shared/components/Button';\n\nconst InfoComponent = ({ className = '', title, subtitles, actionText, actionHandler }) => {\n return (\n \n
\n Important Information
\n\n
\n \n
\n \n
\n \n Upon activation of your registration, you will receive an e-mail to confirm your new\n account. Please open that email and verify, before logging in for the first time.\n
\nAccessing the ACE Portal:
\n- \n
- \n Hardware:\n
- \n
- Standard laptop, desktop computer or iPad \n
- Resolution of at least 1366×768 \n
\n - \n Internet Connection:\n
- \n
- No firewall blocking ACE domain (hologicace.com) \n
- Bandwidth 7 MBits/s connection \n
\n - \n Browser:\n
- \n
- \n Google Chrome (min version 79.0.3945)\n \n
- \n Mozilla Firefox (min version 78.0)\n \n
- \n Safari (Mac) (min version 13)\n \n
- \n Microsoft Edge (min version 79.0.309)\n \n
- Internet Explorer is no longer supported \n
\n
\n \n Next\n \n
\n \n
\n \n
\n
\n
\n );\n};\n\nconst InformativeMessageComponent = ({\n match,\n history,\n title,\n subtitles,\n actionText,\n actionHandler,\n}) => {\n const Info = {\n title,\n subtitles,\n actionText,\n actionHandler,\n };\n\n const authOptions = {\n links: { signin: true },\n };\n\n return (\n \n
\n {title}
\n {subtitles &&\n subtitles.map((subtitle, idx) => (\n\n {subtitle}\n
\n ))}\n\n \n
\n \n \n
\n )}\n \n \n \n \n
\n {step === 1 && \n
\n \n \n \n \n
\n \n
\n \n
\n {title}
\n{subTitle}
\n{error}
}\n {isCodeExpired && (\n {'Click \"Resend Code\" below to get the new one.'}
\n )}\n \n \n Submit\n \n
\n \n \n
\n \n
\n );\n};\n","/* eslint-disable consistent-return */\nimport React, { useRef, useEffect } from 'react';\n\nconst WithMouseFollowOrb = WrappedComponent => {\n return props => {\n return \n
\n );\n};\n\nexport default WithMouseFollowOrb(LeftLayout);\n","import { WithMouseFollowOrb, useMouseFollowOrb } from 'HOC/WithMouseFollowOrb';\nimport React from 'react';\nimport Button from 'shared/components/Button';\n\nconst Banner = props => {\n const { name, description, bannerVideo, bannerImg } = props;\n const canvasRef = useMouseFollowOrb();\n return (\n \n \n
\n \n {entity ? (\n <>\n
\n \n
\n \n {entity}\n \n
\n {description && Welcome
\nUser
\n{description}
}\n \n ) : (\n\n
\n )}\n Welcome
\n{description}
\n\n
\n );\n};\n\nexport default WithMouseFollowOrb(Banner);\n","/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport { WithMouseFollowOrb, useMouseFollowOrb } from 'HOC/WithMouseFollowOrb';\nimport React from 'react';\nimport { confirmAlert } from 'react-confirm-alert';\nimport { IconForward } from 'shared/components/Icons';\n\nconst LinkTitleSection = ({ externalLinks }) => {\n const canvasRef = useMouseFollowOrb();\n const filteredExternalLinks =\n !!externalLinks &&\n externalLinks.filter(link => link.title && link.description && link.productLink);\n if (!filteredExternalLinks?.length) return null;\n\n const goWithLink = (url, e) => {\n e.preventDefault();\n if (!url) return;\n confirmAlert({\n message:\n 'A new browser tab will now be opened. You can close it at any time and come back to this tab to continue.',\n buttons: [\n {\n label: 'Continue',\n onClick: () => window.open(url, '_blank'),\n },\n {\n label: 'Close',\n },\n ],\n });\n };\n\n return (\n \n \n
\n \n
\n {name}
\n{description}
\n \n\n {bannerImg && 
}\n
\n \n {filteredExternalLinks.map((link, idx) => {\n const forwardUrl = link.productLink.startsWith('https://')\n ? link.productLink\n : `https://${link.productLink}`;\n return (\n {\n e.preventDefault();\n goWithLink(forwardUrl, e);\n }}\n target='_blank'\n rel='noopener noreferrer'\n key={idx}\n className='content'\n >\n
\n );\n};\n\nexport default WithMouseFollowOrb(LinkTitleSection);\n","export default __webpack_public_path__ + \"static/media/16y.6f576432.png\";","export default __webpack_public_path__ + \"static/media/20y.edf8abf5.png\";","export default __webpack_public_path__ + \"static/media/30y.2a5423f8.png\";","export default __webpack_public_path__ + \"static/media/40y.69d49b97.png\";","export default __webpack_public_path__ + \"static/media/50y.7877fbf5.png\";","export default __webpack_public_path__ + \"static/media/60y.7d3b1d22.png\";","export default __webpack_public_path__ + \"static/media/preparation-card-img.5861a4a8.png\";","import React from 'react';\nimport Year16Img from '../mockImages/16y.png';\nimport Year20Img from '../mockImages/20y.png';\nimport Year30Img from '../mockImages/30y.png';\nimport Year40Img from '../mockImages/40y.png';\nimport Year50Img from '../mockImages/50y.png';\nimport Year60Img from '../mockImages/60y.png';\nimport CardImg from '../mockImages/preparation-card-img.png';\nimport Button from 'shared/components/Button';\n\nconst ageGroups = [\n { ageRange: '13-19', image: Year16Img },\n { ageRange: '20s', image: Year20Img },\n { ageRange: '30s', image: Year30Img },\n { ageRange: '40s', image: Year40Img },\n { ageRange: '50s', image: Year50Img },\n { ageRange: '60+', image: Year60Img },\n];\n\nconst boldTexts = [\n 'Evaluation and Appropriate Testing',\n 'STI Testing',\n 'Immunizations',\n 'Visual Exam of Breast & Pelvic Area',\n];\n\nconst ExamPreparationSection = () => {\n return (\n {link.title}
\n{link.description}
\n\n
\n );\n};\n\nexport default ExamPreparationSection;\n","import React from 'react';\nimport { withStyles } from '@material-ui/core/styles';\nimport MuiExpansionPanel from '@material-ui/core/ExpansionPanel';\nimport MuiExpansionPanelSummary from '@material-ui/core/ExpansionPanelSummary';\nimport MuiExpansionPanelDetails from '@material-ui/core/ExpansionPanelDetails';\nimport Typography from '@material-ui/core/Typography';\nimport { CircleMinusIcon, CirclePlusIcon } from 'shared/components/Icons';\n\nconst ExpansionPanel = withStyles({\n root: {\n maxWidth: 768,\n borderBottom: '1px solid #EAECF0',\n boxShadow: 'none',\n '&:last-child': {\n borderBottom: 0,\n },\n '&:before': {\n display: 'none',\n },\n '&$expanded': {\n margin: 'auto',\n },\n },\n expanded: {},\n})(MuiExpansionPanel);\n\nconst ExpansionPanelSummary = withStyles({\n root: {\n padding: 0,\n borderBottom: '1px solid #EAECF0',\n marginBottom: -1,\n minHeight: 56,\n '& > p': {\n fontSize: '18px',\n fontWeight: 500,\n color: '#101828',\n },\n '&$expanded': {\n minHeight: 56,\n borderBottom: 0,\n },\n },\n content: {\n '&$expanded': {\n margin: '12px 0',\n },\n },\n expanded: {},\n})(MuiExpansionPanelSummary);\n\nconst ExpansionPanelDetails = withStyles(theme => ({\n root: {\n padding: '8px 48px 32px 0',\n '& > p': {\n fontSize: '16px',\n fontWeight: 400,\n color: '#667085',\n },\n '&$expanded': {\n borderBottom: '1px solid #EAECF0',\n },\n },\n}))(MuiExpansionPanelDetails);\n\nconst AccordionItem = ({ summary, details, expanded, onChange, panelKey }) => {\n return (\n \n
\n What to Expect at Your Well Woman Exam
\n\n Depending on your age, the Well Woman exam may cover different health topics.
Let’s\n take a look at what you can expect.\n
\n {ageGroups.map((group, index) => (\n
\n \n
\n ))}\n \n 
\n
\n {group.ageRange}\n \n
\n \n
\n In Your Late Teens
\n\n {' '}\n This is likely your first Well Woman exam. Now is the time to establish open\n communication with your health provider. Be willing to have an honest discussion about\n your sexual and reproductive health – no topic should be off-limits. While your Well\n Woman exam will be designed with your unique health in mind, you can expect it to\n include the following elements:\n
\n\n {boldTexts.map((text, idx) => (\n \n {text}\n \n ))}\n
\n \n \n 
\n
\n This product doesn't have courses for your specialty
,\n description: (\n <>\n\n Please return later to check.\n
\n\n If you feel you appear here because of some problem then{' '}\n contact your Entity Manager.\n
\n \n ),\n },\n noAccess: {\n title:You don’t have access to this Product page
,\n description: (\n <>\n\n For accessing this program you should be part of an Entity.\n
\n\n Ask your Organization Manager to add you as a{' '}\n member of the Entity before accessing this page.\n
\n \n ),\n },\n};\n\nconst SpecialistCourses = props => {\n const { currentPage, userHasEntity, productId, userSpecialty } = props;\n const { enqueueSnackbar } = useSnackbar();\n const [search, setSearch] = useState('');\n const [activeSearchTags, setActiveSearchTags] = useState([]);\n const [pageCount, setPageCount] = useState(0);\n const [page, setPage] = useState(1);\n const [isFetching, setIsFetching] = useState(false);\n const [courses, setCourses] = useState(null);\n const [debouncedSearch, setDebouncedSearch] = useState(search);\n const [requiredCourses, setRequiredCourses] = useState([]);\n const [selectedSpecialtyForCourses, setSelectedSpecialtyForCourses] = useState(userSpecialty);\n\n const isUserSpecialtyChosen = selectedSpecialtyForCourses === userSpecialty;\n\n const specialtiesBesidesUsers = SPECIALTIES.filter(\n spec => spec?.name?.toLowerCase() !== userSpecialty?.toLowerCase(),\n );\n\n const noPage = !currentPage?.id;\n const noAccess = !userHasEntity;\n const noPageDetailsKey = noAccess ? 'noAccess' : 'noPage';\n const params = { page, search };\n const userCoursesForProgresses = requiredCourses ? requiredCourses.map(course => course) : [];\n\n const getCourses = async (tags, specialties) => {\n try {\n setIsFetching(true);\n const reqParams = { ...params };\n\n if (tags[0]) {\n reqParams.required = tags[0] === 1;\n }\n\n if (specialties?.length > 0) {\n reqParams.specialty = specialties.join(',');\n reqParams.all_users = specialties?.[0] !== userSpecialty;\n }\n\n const { data } = await Api.get(`/product/user-product/${productId}`, { params: reqParams });\n\n if (data?.data) {\n setCourses(data.data.courses.results || []);\n setPageCount(data.data.courses.pageCount);\n setPage(data.data.courses.currentPage);\n if (Array.isArray(data?.data?.required)) {\n setRequiredCourses(\n data.data.required.map(reqCourse => ({\n ...reqCourse,\n progress:\n data.data.courses.results.find(course => course.id === reqCourse.id)?.userCourse\n ?.progress || 0,\n })),\n );\n }\n }\n } catch (err) {\n enqueueSnackbar(getError(err), { variant: 'error' });\n } finally {\n setIsFetching(false);\n }\n };\n\n const handleGetUserSpecialtyCourses = () => {\n const all = specialtiesBesidesUsers[specialtiesBesidesUsers.length - 1];\n setSelectedSpecialtyForCourses([all]);\n setSelectedSpecialtyForCourses(userSpecialty);\n getCourses(activeSearchTags, [userSpecialty]);\n };\n\n const handleGetOtherSpecialtiesCourses = () => {\n const updatingSpecialties = specialtiesBesidesUsers.map(item => item.value).slice(0, -1);\n const all = specialtiesBesidesUsers[updatingSpecialties.length - 1];\n setSelectedSpecialtyForCourses(all);\n getCourses(activeSearchTags, updatingSpecialties);\n };\n\n const handleChangeSpecialty = ({ target }) => {\n let updatingSpecialties = [target.value];\n setSelectedSpecialtyForCourses(target.value);\n if (target.value === 'all' || !target.value) {\n updatingSpecialties = specialtiesBesidesUsers.map(item => item.value).slice(0, -1);\n }\n getCourses(activeSearchTags, updatingSpecialties);\n };\n\n const handleToggleSelectedTags = id => {\n if (activeSearchTags.includes(id)) {\n setActiveSearchTags([]);\n } else {\n setActiveSearchTags([id]);\n }\n };\n\n const handleSearch = e => setSearch(e.target.value);\n\n const handlePageClick = selectedItem => {\n setPage(selectedItem.selected + 1);\n };\n\n const handleNeedHelpClick = () => {\n const section = document.getElementById('question-submit-section');\n if (section) {\n section.scrollIntoView({ behavior: 'smooth', block: 'center' });\n }\n };\n\n useEffect(() => {\n if (productId) getCourses(activeSearchTags, [selectedSpecialtyForCourses]);\n }, [productId, activeSearchTags, page, debouncedSearch, currentPage]);\n\n useEffect(() => {\n const handler = setTimeout(() => {\n setDebouncedSearch(search);\n }, 500);\n\n return () => {\n clearTimeout(handler);\n };\n }, [search]);\n\n return (\n <>\n {(noPage || noAccess) && (\n\n
\n )}\n <>\n \n {NO_PAGE_DETAILS[noPageDetailsKey].title}\n \n {NO_PAGE_DETAILS[noPageDetailsKey].description}\n \n
\n \n 
\n
\n \n getCourses(activeSearchTags)}\n onChange={handleSearch}\n value={search}\n placeholder='Search in materials'\n />\n
\n \n \n
\n {isUserSpecialtyChosen && !isFetching && (\n Required Courses
\n\n Depending on your age, the Well Woman exam may cover different health topics. Let’s\n take a look at what you can expect.\n
\n\n
\n \n \n Other Specialties\n
\n \n \n My Courses\n
\n \n
\n \n {PRODUCT_COURSE_TAGS.map((tag, idx) => (\n handleToggleSelectedTags(tag.id)}\n className={`search-type-item ${activeSearchTags.includes(tag.id) &&\n 'active'}`}\n >\n {tag?.name}\n
\n ))}\n \n {!courses || isFetching ? (\n
\n \n
\n \n
\n )}\n \n
\n {course.title}
\n {getDate(course.createdAt)}
\n {course.info}
\n \n ))\n ) : (\n \n 
\n
\n )}\n There is no courses to be shown
\n\n Try checking other specialties or change the used filters\n
\n{data?.message}
\n ) : (\n\n Select one of you Entities from which you are assigned to take the course of \"\n {productName}\" as {specialty}.\n
\n )}\n\n {userEntities.map((entity, idx) => {\n const { name, imageUrl } = entity;\n return (\n setSelectedEntity(name)}\n key={idx}\n className={`entity-item ${name === selectedEntity && 'active'}`}\n >\n {imageUrl ? (\n
\n );\n })}\n \n \n 
\n
\n ) : (\n {name?.[0]}
\n )}\n {name}
\n\n 
\n
\n );\n};\n\nexport default ServiceAndMaintenance;\n","/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React from 'react';\nimport Switch from 'react-switch';\n\nconst ToggleLabel = ({ text }) => (\n Maintenance in Progress
\n Please come back soon\n\n {text}\n
\n);\n\nconst Toggle = props => (\n \n
\n \n );\n};\n\nexport default CookieSettingsModal;\n","/* eslint-disable react/jsx-no-target-blank */\nimport React from 'react';\nimport { useState } from 'react';\nimport ReactModal from 'react-modal';\nimport { onOpenExternalUrl } from 'utils/appHelpers';\nimport { getFromStore, initCookieState, saveToStore } from 'utils/storeHelpers';\nimport CookieSettingsModal from './components/CookieSettingsModal';\n\nconst CookiePopup = () => {\n const storeState = getFromStore('cookie');\n const runState = storeState ? JSON.parse(storeState) : { ...initCookieState };\n const [open, toggleModal] = useState(false);\n const [state, setState] = useState(runState);\n\n const saveAndAccept = () => {\n const newState = { ...state, cookieAccepted: true };\n toggleModal(false);\n setState(newState);\n saveToStore('cookie', JSON.stringify(newState));\n };\n\n if (state.cookieAccepted) return null;\n\n return (\n <>\n \n
\n Privacy Overview
\n \n
\n \n setInfoState(!infoState)}\n >\n Show {infoState ? 'less' : 'more'}\n \n
\n \n This website uses cookies to improve your experience while you navigate through the\n website. Out of these, the cookies that are categorized as necessary are stored on your\n browser as they are essential for the working of basic functionalities of the website.\n We also use third-party cookies that help us analyze and understand how you use this\n website. These cookies will be stored in your browser only with your consent. You also\n have the option to opt-out of these cookies. But opting out of some of these cookies may\n affect your browsing experience.\n
\n\n {data.map((item, index) => {\n const isChecked = state[item.name];\n return (\n
\n - \n
\n
\n \n {activeIndex === index && {item.title}
\n \n {item.enabledText && item.enabledText}\n {!item.enabledText && (\n
\n {item.content}
}\n \n \n
\n \n
\n \n We use cookies on our website to give you the most relevant experience by remembering\n preferences and repeat visits. By clicking “Accept” you consent to store on your device\n all the technologies described in our{' '}\n \n Cookie Policy\n \n . However, you may visit “Cookie Settings” to provide a more controlled consent.”\n
\n \n \n \n
\n