Health age is a measure of a person’s physical age, as compared to chronological age. The calculation to determine health age is based on research findings on health and longevity. Each individual receives a health age estimate in their Wellcomplete® Personal Report. These individual ages are averaged to provide you with the health age for your specified population.
\",\r\n \"OWSHelpText\": \"The Overall Wellness Score (OWS) evaluates the health of your population and it can be used to measure the effectiveness of your wellness programs. It is based on your population's current health status, lifestyle behaviors, and other factors. A score of 70 or more indicates your population is doing well while a lower score indicates improvement is needed. Each individual receives an OWS in their Wellcomplete® Personal Report based on their personal health information. These individual OWS are averaged to provide you with a population-level OWS.
\",\r\n \"Value\": \"0\",\r\n \"HealthAgeValue\": \"0\",\r\n \"AvgAgeValue\": \"0\",\r\n \"ValueGrade\": \"3\"\r\n}\r\n*/\r\n\r\n\r\nconst OWSAdminDonut = (props) => {\r\n\r\n return (\r\n {parseInt(percent,0)}%,\r\n color: '#4eb748'\r\n },\r\n default: {\r\n\r\n color: '#E7C61E'\r\n },\r\n error: {\r\n\r\n color: '#E6323A'\r\n },\r\n active: {\r\n\r\n color: '#AEAEAE'\r\n }\r\n }}\r\n percent={percent}\r\n status={status}\r\n />\r\n )\r\n\r\n }\r\n\r\n const DisplayItem = ({ displayValues }) => {\r\n return (\r\n \r\n \r\n \r\n {displayValues.Label} \r\n \r\n \r\n \r\n \r\n \r\n )\r\n }\r\n\r\n\r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n\r\n return (\r\n \r\n\r\n \r\n \r\n \r\n \r\n {props.component.Label} \r\n \r\n \r\n \r\n {\r\n OrderedSections && OrderedSections.map((displayValues, index) => {\r\n\r\n if(!displayValues.Distribution && !displayValues.Value) {return <>}\r\n return (\r\n \r\n \r\n )\r\n\r\n })\r\n }\r\n {\r\n OrderedEndListItems && OrderedEndListItems.map((displayValues, index) => {\r\n\r\n if(!displayValues.Distribution && !displayValues.Value) {return <>}\r\n return (\r\n \r\n \r\n )\r\n\r\n })\r\n }\r\n \r\n\r\n \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default KeyProgressCard","import React, { useState } from 'react'\r\nimport { Grid, Typography, Divider, Paper, Box, Collapse } from '@mui/material'\r\nimport Chart from 'chart.js/auto' //idk what this does, i don't even use it... but remove it and everything breaks\r\nimport { Doughnut } from 'react-chartjs-2';\r\nimport CircleIcon from '@mui/icons-material/Circle';\r\nimport '../../../styles/report.css'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport RYGGLegend from '../adminreport/RYGGLegend';\r\n/** \r\n * \r\n * This component is expecting the following input. \r\n\r\n{\r\n \"Order\": \"30\",\r\n \"ComponentType\": \"KEY VALUE EXPANDED NESTED\",\r\n \"Visible\": \"1\",\r\n \"Label\": \"\",\r\n \"Sections\": [\r\n {\r\n \"Order\": \"10\",\r\n \"Visible\": \"1\",\r\n \"Label\": \"Stress\",\r\n \"HelpText\": \"\",\r\n \"Values\": [\r\n {\r\n \"Order\": \"10\",\r\n \"Label\": \"No Interest\",\r\n \"Distribution\": \"0\"\r\n },\r\n {\r\n \"Order\": \"20\",\r\n \"Label\": \"Not Now\",\r\n \"Distribution\": \"0\"\r\n },\r\n {\r\n \"Order\": \"30\",\r\n \"Label\": \"Ready\",\r\n \"Distribution\": \"0\"\r\n },\r\n {\r\n \"Order\": \"40\",\r\n \"Label\": \"Recent Change\",\r\n \"Distribution\": \"0\"\r\n },\r\n {\r\n \"Order\": \"50\",\r\n \"Label\": \"Longer Change\",\r\n \"Distribution\": \"0\"\r\n }\r\n ]\r\n }\r\n ]\r\n}\r\n*/\r\nconst colors = ['#E6323A', '#FE9350', '#FEC957', '#6CDE6C', '#209D70']\r\n\r\nconst DonutSection = (props) => {\r\n\r\n\r\n const OrderedSections = [...props.component.Sections].sort((a, b) => {\r\n const aValues = a.Values\r\n const bValues = b.Values\r\n // b - a for descending, aka.. most ready is first.\r\n return parseInt(bValues[2].Distribution) - parseInt(aValues[2].Distribution)\r\n })\r\n\r\n\r\n //const FilteredSections = OrderedSections.filter((a)=> { return a.Visible==='1' })\r\n\r\n const [expandSection, setExpandSection] = useState(false)\r\n const DisplayItem = ({ displayValues }) => {\r\n\r\n\r\n const returnme = displayValues.Values.map((x, i) => {\r\n return (\r\n \r\n \r\n {x.Label}: {Math.floor(parseInt(x.Distribution || x.Value,0))}% \r\n \r\n )\r\n })\r\n\r\n return returnme\r\n\r\n }\r\n\r\n const DisplaySection = ({ displayValues, defaultCollapse }) => {\r\n const labelCenter = {\r\n id: \"labelCenter\",\r\n beforeDraw: function (chart) {\r\n var width = chart.width,\r\n height = chart.height,\r\n ctx = chart.ctx;\r\n ctx.restore();\r\n var fontSize = (height / 160).toFixed(2);\r\n ctx.font = fontSize + \"em sans-serif\";\r\n ctx.textBaseline = \"top\";\r\n var text = displayValues.Label,\r\n textX = Math.round((width - ctx.measureText(text).width) / 2),\r\n textY = height / 2;\r\n ctx.fillText(text, textX, textY);\r\n ctx.save();\r\n }\r\n };\r\n const plugins = [labelCenter]\r\n\r\n\r\n const [isExpanded, setIsExpanded] = useState(defaultCollapse)\r\n //const colors = props.component.Values.map((x)=>{return x.Color})\r\n const values = displayValues.Values.map((x) => { return parseInt(x.Distribution || x.Value, 0) })\r\n const labels = displayValues.Values.map((x) => { return parseInt(x.Label, 0) + \"%\" })\r\n const data = {\r\n datasets: [\r\n {\r\n\r\n label: labels,\r\n data: values,\r\n backgroundColor: colors,\r\n borderColor: colors,\r\n borderWidth: 0,\r\n }\r\n ]\r\n }\r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n const options = {\r\n responsive: true,\r\n cutout: '80%',\r\n animation: {\r\n animateRotate: true,\r\n render: false,\r\n },\r\n tooltips: {\r\n enabled: true\r\n },\r\n plugins: {\r\n\r\n legend: {\r\n display: false\r\n }\r\n }\r\n }\r\n return (\r\n\r\n \r\n setIsExpanded(!isExpanded)}>\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n )\r\n }\r\n\r\n\r\n const FiveColorArray = [\r\n { Label: \"No Interest\", Color: '#E6323A' }\r\n , { Label: \"Not Now\", Color: '#FE9350' }\r\n , { Label: \"Ready\", Color: '#FEC957' }\r\n , { Label: \"Recent Change\", Color: '#6CDE6C' }\r\n , { Label: \"Longer Change\", Color: '#209D70' }\r\n ]\r\n\r\n\r\n\r\n\r\n\r\n return (\r\n \r\n\r\n\r\n \r\n \r\n {props.component.Label} \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n {\r\n OrderedSections && OrderedSections.map((displayValues, index) => {\r\n return (\r\n \r\n \r\n )\r\n\r\n })\r\n }\r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n )\r\n}\r\n\r\nexport default DonutSection","import React from 'react'\r\nimport { Grid, Typography, Divider } from '@mui/material'\r\nimport Masonry from '@mui/lab/Masonry';\r\nimport '../../../styles/report.css'\r\nimport DynamicComponent from '../DynamicComponent'\r\n\r\n/** \r\n * \r\n * This component is expecting the following input. \r\n{\r\n \"Order\": \"60\",\r\n \"Visible\": \"1\",\r\n \"Label\": \"Health Assessment Responses\",\r\n \"ComponentType\": \"STANDARD MASONRY SECTION\",\r\n \"Sections\": [\r\n {\r\n \"ComponentType\": \"MUST BE DYNAMIC COMPONENT\"\r\n }\r\n ]\r\n}\r\n \r\n*/\r\n\r\nconst MasonrySectionNoBG = (props) => {\r\n\r\n const OrderedSections = [...props.component.ComponentValues].sort(function (a, b) { return parseInt(a.Order) - parseInt(b.Order) })\r\n const FilteredSections = OrderedSections.filter((a)=> { return a.Visible==='1' })\r\n\r\n return (\r\n \r\n \r\n \r\n {props.component.Label} \r\n \r\n \r\n \r\n \r\n \r\n\r\n {\r\n FilteredSections && FilteredSections.map((displayValues, index) => {\r\n return (\r\n \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default MasonrySectionNoBG","import React, { useRef } from 'react'\r\nimport { Bar } from 'react-chartjs-2'\r\nimport { Divider, Grid, Paper, Typography } from '@mui/material'\r\nimport '../../../styles/report.css'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport RYGGLegend from '../adminreport/RYGGLegend'\r\n/** \r\n * \r\n * This component is expecting the following input. it will iterate through the BarChart section\r\n{\r\n \"Order\": \"50\",\r\n \"Visible\": \"1\",\r\n \"Label\": \"\",\r\n \"ComponentType\": \"KEY AREA CHART\",\r\n \"BarChart\": [\r\n {\r\n \"Order\": \"10\",\r\n \"Visible\": \"1\",\r\n \"Label\": \"HEART\",\r\n \"Score\": \"58\",\r\n \"ValueGrade\": \"2\"\r\n }\r\n ]\r\n}\r\n*/\r\n\r\nconst AdminKeyAreaGraph = (props) => {\r\n const FilteredSections = [...props.component.Sections].filter((a) => { return a.Visible === '1' })\r\n const OrderedSections = FilteredSections.sort((a, b) => { return parseInt(a.Order) - parseInt(b.Order) })\r\n const chartRef = useRef(null);\r\n let graphcolors = ['#4eb748', '#E7C61E', '#9A3218', '#c0c0c0']\r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n /**\r\n * Chart JS DataSets are weird.\r\n * Each DataSet is a valuegrade, essentially.\r\n * each label is an array of labels\r\n * each data is an array of datasets\r\n * so we need to take Heart [{1}, {2}, {3}], Cancer [{1}, {2}, {3}]\r\n * and convert it into \r\n * dataset 1: labels: data: [heart cancer]\r\n * dataset 2: labels: data: [heart cancer]\r\n * dataset 3: labels: data: [heart cancer]\r\n * dataset 4: labels: data: [heart cancer]\r\n */\r\n\r\n const mapLabels = OrderedSections.map((x, i) => {\r\n return x.Label\r\n })\r\n\r\n const mapData_1 = OrderedSections.map((x, i) => {\r\n const Values = [...OrderedSections[i].Values].sort((a, b) => { return parseInt(a.Order) - parseInt(b.Order) })\r\n return Values[0].Distribution\r\n })\r\n\r\n const mapData_2 = OrderedSections.map((x, i) => {\r\n const Values = [...OrderedSections[i].Values].sort((a, b) => { return parseInt(a.Order) - parseInt(b.Order) })\r\n return Values[1].Distribution\r\n })\r\n\r\n const mapData_3 = OrderedSections.map((x, i) => {\r\n const Values = [...OrderedSections[i].Values].sort((a, b) => { return parseInt(a.Order) - parseInt(b.Order) })\r\n return Values[2].Distribution\r\n })\r\n\r\n const dsets = [\r\n {\r\n label: ['LOW']\r\n , data: mapData_1\r\n , backgroundColor: ['#209D70']\r\n },\r\n {\r\n label: ['MEDIUM']\r\n , data: mapData_2\r\n , backgroundColor: ['#FEC957']\r\n\r\n },\r\n {\r\n label: ['HIGH']\r\n , data: mapData_3\r\n , backgroundColor: ['#E6323A']\r\n\r\n }\r\n ]\r\n\r\n\r\n const data = {\r\n labels: mapLabels,\r\n datasets: dsets,\r\n }\r\n\r\n const config = {\r\n type: 'bar',\r\n data: data,\r\n options: {\r\n //indexAxis: 'y',\r\n maintainAspectRatio: false,\r\n scales: {\r\n y: {\r\n beginAtZero: true,\r\n stacked: true,\r\n max: 100,\r\n grid: {\r\n display: true\r\n , drawBorder: true //turns off border lines\r\n\r\n },\r\n ticks: {\r\n stepSize: 20\r\n , display: true\r\n }\r\n },\r\n x: {\r\n grid: {\r\n display: true\r\n , drawBorder: true //turns off border lines\r\n\r\n }\r\n , ticks: {\r\n display: true\r\n }\r\n , stacked: true\r\n }\r\n },\r\n plugins: {\r\n legend: {\r\n display: false\r\n }\r\n },\r\n\r\n }\r\n }\r\n\r\n return (\r\n \r\n \r\n \r\n\r\n \r\n \r\n Key Areas\r\n \r\n \r\n\r\n\r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default AdminKeyAreaGraph","import React, { useRef } from 'react'\r\nimport { Bar } from 'react-chartjs-2'\r\nimport { Grid, Typography } from '@mui/material'\r\nimport '../../../styles/report.css'\r\n\r\n/** \r\n * \r\n * This component is expecting the following input. \r\n\r\n\r\n*/\r\n\r\nconst RYGGHorizontalBar = (props) => {\r\n //console.log('rygghorizontalbar.js', props.displayValues)\r\n const componentdata = [...props.displayValues.Values].sort((a, b) => { return parseInt(a.Order) - parseInt(b.Order) })\r\n const chartRef = useRef(null);\r\n let graphcolors = ['#209D70', '#FEC957', '#E6323A', '#c0c0c0']\r\n const lables = ['Participation Graph']\r\n\r\n\r\n const dataset = componentdata.map(val => {\r\n return {\r\n label: [val.Order === '10' ? 'DOING WELL' : val.Order === '20' ? 'CAUTION' : val.Order === '30' ? 'HIGH RISK' : \"UNKNOWN\"]\r\n , data: [Math.floor(parseInt((val.Distribution ? val.Distribution : val.SegmentLabel1),0))]\r\n , backgroundColor: [val.Color]\r\n , barThickness: 12\r\n\r\n }\r\n }).filter(n => n)\r\n\r\n\r\n\r\n const sum = (key) => {\r\n return this.reduce((a, b) => a + (b[key] || 0), 0);\r\n }\r\n // if max isnt defined, the bar will not be the appropriate length\r\n const MaxValue = 100\r\n\r\n // dynamically create grid / center values \r\n const GridDisplay_Bottom = () => {\r\n return (\r\n \r\n {\r\n dataset.map((x, i) => {\r\n return (\r\n \r\n \r\n \r\n \r\n {x.label[0]} \r\n \r\n \r\n ({x.data[0]}) \r\n \r\n \r\n \r\n \r\n )\r\n })\r\n }\r\n \r\n )\r\n }\r\n const GridDisplay_Top = () => {\r\n return (\r\n \r\n {\r\n dataset.map((x, i) => {\r\n return (\r\n \r\n {Math.floor((x.data[0] / MaxValue) * 100) == 0 ? \"\" : String(Math.floor((x.data[0] / MaxValue) * 100)) + \"%\" } \r\n\r\n \r\n )\r\n })\r\n }\r\n \r\n )\r\n }\r\n\r\n const data = {\r\n labels: lables,\r\n datasets: dataset\r\n }\r\n\r\n const config = {\r\n type: 'bar',\r\n data: data,\r\n options: {\r\n indexAxis: 'y',\r\n maintainAspectRatio: false,\r\n scales: {\r\n y: {\r\n max: 100,\r\n beginAtZero: true, \r\n grid: {\r\n display: false //turns off grid lines\r\n , drawBorder: false //turns off border lines\r\n },\r\n ticks: {\r\n display: false // turns off values on axis\r\n }\r\n , stacked: true\r\n\r\n },\r\n x: {\r\n max: 100,\r\n grid: {\r\n display: false //turns off grid lines\r\n , drawBorder: false //turns off border lines\r\n }\r\n , ticks: {\r\n display: false // turns off values on axis\r\n }\r\n , stacked: true\r\n }\r\n },\r\n plugins: {\r\n legend: {\r\n display: false\r\n }\r\n },\r\n\r\n }\r\n }\r\n\r\n\r\n\r\n return (\r\n\r\n \r\n \r\n {props.displayValues.Label} \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n )\r\n}\r\n\r\nexport default RYGGHorizontalBar","import React, { useState } from 'react'\r\nimport { Grid, Typography, Box, } from '@mui/material'\r\nimport '../../../styles/report.css'\r\nimport RYGGHorizontalBar from './RYGGHorizontalBar'\r\nimport {motion, AnimatePresence} from \"framer-motion/dist/framer-motion\"\r\n/** \r\n * \r\n * This component is expecting the following input. \r\n{\r\n \"Order\": \"80\",\r\n \"ComponentType\": \"ADMIN KEY AREA TAB\",\r\n \"Visible\": \"1\",\r\n \"Label\": \"\",\r\n \"Sections\": [\r\n {\r\n \"Order\": \"10\",\r\n \"Visible\": \"1\",\r\n \"Label\": \"HEART\",\r\n \"Label2\": \"0\",\r\n \"ValueGrade\": \"3\",\r\n \"HelpText\": \"TBD\",\r\n \"InfoBlock\": \"Heart disease is the leading cause of death and disability in the United States. More than 650,000 people die of heart disease in the U.S. each year. That is 1 in every 4 deaths.
Heart disease and stroke are among the most widespread and costly health problems facing the nation, accounting for nearly $555 billion in healthcare expenditures and lost productivity annually. That cost is expected to double by 2035.
The more risk factors present, the higher the likelihood of heart problems or stroke. Some risk factors cannot be changed, but others can be. This report addresses the risk factors that are actionable.
\",\r\n \"Cards\": [\r\n {\r\n \"Order\": \"10\",\r\n \"Visible\": \"1\",\r\n \"Label\": \"Total Cholesterol\",\r\n \"Values\": [\r\n {\r\n \"Order\": \"10\",\r\n \"Label\": \"DOING WELL\",\r\n \"Distribution\": \"0\",\r\n \"Color\": \"#209D70\"\r\n },\r\n {\r\n \"Order\": \"20\",\r\n \"Label\": \"CAUTION\",\r\n \"Color\": \"#FEC957\",\r\n \"Distribution\": \"0\"\r\n },\r\n {\r\n \"Order\": \"30\",\r\n \"Label\": \"HIGH RISK\",\r\n \"Color\": \"#E6323A\",\r\n \"Distribution\": \"0\"\r\n },\r\n {\r\n \"Order\": \"40\",\r\n \"Label\": \"UNKNOWN\",\r\n \"Color\": \"#666666\",\r\n \"Distribution\": \"0\"\r\n }\r\n ]\r\n },\r\n ]\r\n }\r\n ]\r\n}\r\n \r\n*/\r\nconst motionVariants = {\r\n \r\n }\r\nconst AdminCardTab = (props) => {\r\n\r\n const OrderedSections = [...props.displayValues.Cards].sort(function (a, b) { return parseInt(a.Order) - parseInt(b.Order) })\r\n const FilteredSections = OrderedSections.filter((a) => { return a.Visible === '1' })\r\n\r\n const [viewState, setViewState] = useState(0)\r\n\r\n\r\n return (\r\n \r\n {\r\n FilteredSections.map((x, i) => {\r\n\r\n return (\r\n \r\n \t \r\n \r\n\r\n \r\n \r\n \r\n )\r\n })\r\n }\r\n \r\n \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default AdminCardTab","import React, { useState } from 'react'\r\nimport { Grid, Typography, Divider, Paper, Box } from '@mui/material'\r\nimport '../../../styles/report.css'\r\nimport AdminCardTab from '../adminreport/AdminCardTab'\r\nimport {motion, AnimatePresence} from \"framer-motion/dist/framer-motion\"\r\n/** \r\n * \r\n * This component is expecting the following input. \r\n{\r\n \"Order\": \"80\",\r\n \"ComponentType\": \"ADMIN KEY AREA TAB\",\r\n \"Visible\": \"1\",\r\n \"Label\": \"\",\r\n \"Sections\": [\r\n {\r\n \"Order\": \"10\",\r\n \"Visible\": \"1\",\r\n \"Label\": \"HEART\",\r\n \"Label2\": \"0\",\r\n \"ValueGrade\": \"3\",\r\n \"HelpText\": \"TBD\",\r\n \"InfoBlock\": \"Heart disease is the leading cause of death and disability in the United States. More than 650,000 people die of heart disease in the U.S. each year. That is 1 in every 4 deaths.
Heart disease and stroke are among the most widespread and costly health problems facing the nation, accounting for nearly $555 billion in healthcare expenditures and lost productivity annually. That cost is expected to double by 2035.
The more risk factors present, the higher the likelihood of heart problems or stroke. Some risk factors cannot be changed, but others can be. This report addresses the risk factors that are actionable.
\",\r\n \"Cards\": [\r\n {\r\n \"Order\": \"10\",\r\n \"Visible\": \"1\",\r\n \"Label\": \"Total Cholesterol\",\r\n \"Values\": [\r\n {\r\n \"Order\": \"10\",\r\n \"Label\": \"DOING WELL\",\r\n \"Distribution\": \"0\",\r\n \"Color\": \"#209D70\"\r\n },\r\n {\r\n \"Order\": \"20\",\r\n \"Label\": \"CAUTION\",\r\n \"Color\": \"#FEC957\",\r\n \"Distribution\": \"0\"\r\n },\r\n {\r\n \"Order\": \"30\",\r\n \"Label\": \"HIGH RISK\",\r\n \"Color\": \"#E6323A\",\r\n \"Distribution\": \"0\"\r\n },\r\n {\r\n \"Order\": \"40\",\r\n \"Label\": \"UNKNOWN\",\r\n \"Color\": \"#666666\",\r\n \"Distribution\": \"0\"\r\n }\r\n ]\r\n },\r\n ]\r\n }\r\n ]\r\n}\r\n \r\n*/\r\n\r\nconst TabbedComponent = (props) => {\r\n\r\n const OrderedSections = [...props.component.Sections].sort(function (a, b) { return parseInt(a.Order) - parseInt(b.Order) })\r\n const FilteredSections = OrderedSections.filter((a) => { return a.Visible === '1' })\r\n\r\n const [viewState, setViewState] = useState(0)\r\n\r\n const getTextColor = (valueGrade) => {\r\n const graphcolors = ['#209D70', '#FEC957', '#E6323A', '#c0c0c0']\r\n const color = valueGrade === '0' ? graphcolors[3] : graphcolors[parseInt(valueGrade, 4) - 1]\r\n return color\r\n }\r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n const VerticalTabs = FilteredSections.map((x, i) => {\r\n return (\r\n \r\n \r\n setViewState(i)} p={2} \r\n sx={{ borderRight: 4\r\n ,borderBottom: 4\r\n , borderColor: getTextColor(x.ValueGrade)+\"30\" \r\n , width:\"100%\", background: viewState===i ? getTextColor(x.ValueGrade):\"#FFFFFF\" }}\r\n >\r\n \r\n \r\n {x.Label} \r\n \r\n {\r\n x.ValueGrade && (\r\n \r\n {Math.floor(parseInt(x.Label2,0))} \r\n \r\n )\r\n }\r\n \r\n \r\n \r\n \r\n )\r\n })\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n {props.component.Label} \r\n \r\n \r\n \r\n \r\n \r\n {VerticalTabs}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default TabbedComponent","import React, { useRef } from 'react'\r\nimport { Bar } from 'react-chartjs-2'\r\nimport { Divider, Grid, Paper, Typography } from '@mui/material'\r\nimport '../../../styles/report.css'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport RYGGLegend from '../adminreport/RYGGLegend'\r\nimport RYGGHorizontalBar from '../adminreport/RYGGHorizontalBar'\r\n/** \r\n * \r\n * This component is expecting the following input. it will iterate through the BarChart section\r\n{\r\n \"Order\": \"50\",\r\n \"Visible\": \"1\",\r\n \"Label\": \"\",\r\n \"ComponentType\": \"KEY AREA CHART\",\r\n \"BarChart\": [\r\n {\r\n \"Order\": \"10\",\r\n \"Visible\": \"1\",\r\n \"Label\": \"HEART\",\r\n \"Score\": \"58\",\r\n \"ValueGrade\": \"2\"\r\n }\r\n ]\r\n}\r\n*/\r\n\r\nconst AdminBiometricSection = (props) => {\r\n const FilteredSections = [...props.component.Sections].filter((a) => { return a.Visible === '1' })\r\n const OrderedSections = FilteredSections.sort((a, b) => { return parseInt(a.Order) - parseInt(b.Order) })\r\n\r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n \r\n\r\n return (\r\n \r\n \r\n \r\n\r\n \r\n \r\n {props.component && props.component.Label}\r\n \r\n \r\n\r\n\r\n \r\n \r\n\r\n \r\n \r\n {\r\n OrderedSections.map((x,i) => {\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default AdminBiometricSection","import React from 'react'\r\nimport { Doughnut } from 'react-chartjs-2'\r\nimport { Chart as ChartJS, ArcElement, Tooltip, Legend } from 'chart.js';\r\n\r\nChartJS.register(ArcElement, Tooltip, Legend);\r\n\r\nconst labelCenter = {\r\n id: \"labelCenter\",\r\n beforeDraw: (chart, args, options) => {\r\n if (!Array.isArray(options.labels)) {\r\n return console.error('\"options.lables\" must be array', options.lables);\r\n }\r\n \r\n const {\r\n ctx,\r\n chartArea: { width, height }\r\n } = chart;\r\n const context = ctx.canvas.getContext(\"2d\");\r\n context.save();\r\n \r\n const labels = options.labels.slice();\r\n const totalFontSize = labels.reduce((x, y, index) => {\r\n let prevSize = x[index - 1] || 0;\r\n x.push(prevSize + y.font.size);\r\n return x;\r\n }, []);\r\n labels.forEach((label, index) => {\r\n let textPosition = totalFontSize[index] - label.font.size+10;\r\n const values = {\r\n text: label.text || \"?\",\r\n font: {\r\n size: label.font.size || 30,\r\n family: label.font.family || \"sans-serif\",\r\n color: label.font.color || \"black\",\r\n style: label.font.style || \"normal\",\r\n unit: label.font.unit || \"px\"\r\n }\r\n };\r\n switch (values.font.unit) {\r\n case \"em\":\r\n values.font.size = label.font.size * 0.05;\r\n textPosition *= 0.8;\r\n break;\r\n default:\r\n break;\r\n }\r\n \r\n context.font = `${values.font.style} ${values.font.size}${values.font.unit} ${values.font.family}`;\r\n context.textAlign = \"center\";\r\n context.fillStyle = values.font.color;\r\n context.fillText(values.text, width / 2, height / 2 + textPosition);\r\n });\r\n context.restore();\r\n }\r\n };\r\n\r\nconst HealthAgeAverageAge = (props) => {\r\n const graphcolors = [ '#c0c0c0', '#4eb748', '#E7C61E', '#E6323A']\r\n const GetColor = (score)=>{\r\n \r\n const vg = parseInt(score <=39 ? 3 : score<=69 ? 2 : score<=100 ? 1 : 0)\r\n return graphcolors[0]\r\n }\r\n\r\n const Color = GetColor(props.CurrentOWSValue)\r\n const data = {\r\n datasets: [\r\n {\r\n label: props.OWSText,\r\n data: [props.CurrentOWSValue, 100-props.CurrentOWSValue],\r\n backgroundColor: [\r\n Color,\r\n Color+\"40\"\r\n ],\r\n borderColor: [\r\n 'rgba(255, 99, 132, 0)',\r\n 'rgba(54, 162, 235, 0)',\r\n ],\r\n borderWidth: 0,\r\n },\r\n ],\r\n }\r\n const options = {\r\n responsive: true,\r\n cutout: '90%',\r\n animation:{\r\n animateRotate: true,\r\n render: false,\r\n },\r\n events: [],\r\n tooltips:{\r\n enabled: false\r\n },\r\n plugins: {\r\n legend: {\r\n display: false\r\n },\r\n labelCenter: {\r\n labels: [\r\n {\r\n text: Math.floor(props.CurrentOWSValue),\r\n font: {\r\n size: 3.25,\r\n unit: \"rem\",\r\n color: 'black',\r\n style: \"bold\"\r\n }\r\n }\r\n ]\r\n }\r\n \r\n }\r\n }\r\n const plugins = [labelCenter]\r\n return \r\n}\r\n\r\nexport default HealthAgeAverageAge","\r\nimport { Grid, Typography, Paper, Box } from '@mui/material'\r\nimport React from 'react'\r\nimport WellnessScore from '../WellnessScore'\r\nimport '../../../styles/report.css'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport HealthAgeAverageAge from '../HealthAgeAverageAge'\r\n/** \r\n * \r\n * This component is expecting the following input. \r\n\r\n{\r\n \"Order\": \"10\",\r\n \"Visible\": \"1\",\r\n \"Label\": \"\",\r\n \"ComponentType\": \"OWS AND HEALTH AGE\",\r\n \"OWS\": {\r\n \"Visible\": \"1\",\r\n \"Label\": \"Your Overall Wellness Score\",\r\n \"Value\": \"45\",\r\n \"ValueGrade\": \"2\"\r\n },\r\n \"HealthAge\": {\r\n \"CurrentLabel\": \"Health Age\",\r\n \"CurrentValue\": \"19.9\",\r\n \"AchievableLabel\": \"Achievable Health Age\",\r\n \"AchievableValue\": \"17.5\"\r\n }\r\n},\r\n*/\r\n\r\n\r\nconst HealthAgeAvgAge = (props) => {\r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n {props.component.HealthAgeLabel} \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n {props.component.AvgAgeLabel} \r\n {Math.floor(props.component.AvgAgeValue)} \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n\r\n )\r\n}\r\n\r\nexport default HealthAgeAvgAge;","\r\nimport { Grid, Typography, Paper, Box } from '@mui/material'\r\nimport React from 'react'\r\nimport WellnessScore from '../WellnessScore'\r\nimport '../../../styles/report.css'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport RYGGHorizontalBar from '../adminreport/RYGGHorizontalBar'\r\n/** \r\n * \r\n * This component is expecting the following input. \r\n\r\n{\r\n \"Order\": \"10\",\r\n \"Visible\": \"1\",\r\n \"Label\": \"\",\r\n \"ComponentType\": \"OWS AND HEALTH AGE\",\r\n \"OWS\": {\r\n \"Visible\": \"1\",\r\n \"Label\": \"Your Overall Wellness Score\",\r\n \"Value\": \"45\",\r\n \"ValueGrade\": \"2\"\r\n },\r\n \"HealthAge\": {\r\n \"CurrentLabel\": \"Health Age\",\r\n \"CurrentValue\": \"19.9\",\r\n \"AchievableLabel\": \"Achievable Health Age\",\r\n \"AchievableValue\": \"17.5\"\r\n }\r\n},\r\n*/\r\n\r\n\r\nconst AdminFallRisk = (props) => {\r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n //console.log('adminfallrisk.js', props.component)\r\n return (\r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n\r\n \r\n \r\n \r\n \r\n\r\n )\r\n}\r\n\r\nexport default AdminFallRisk;","import React, { useState, useEffect, useRef, useCallback } from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { useSearchParams, useNavigate } from \"react-router-dom\";\r\nimport { Box, Fab, Grid, Paper, Skeleton } from '@mui/material'\r\n\r\n\r\nimport OverallWellnessScore from \"../personalreport/OverallWellnessScore\";\r\n\r\n//import KeyAreaNavBar from \"./partials/personalreport/KeyAreaNavBar\";\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\nimport { useReactToPrint } from \"react-to-print\";\r\n\r\n\r\n\r\nimport HealthAge from \"../personalreport/HealthAge\";\r\nimport Information from \"../personalreport/Information\";\r\n\r\n\r\nconst motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n}\r\n\r\nconst PersonalReportOverview = (props) => {\r\n const { component } = props\r\n const { settings, PrintView } = props.otherprops\r\n\r\n\r\n return (\r\n \r\n\r\n \r\n\r\n \r\n \r\n\r\n \r\n \r\n
\r\n\r\n \r\n \r\n \r\n\r\n \r\n \r\n\r\n \r\n \r\n
\r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n
\r\n\r\n \r\n \r\n \r\n \r\n \r\n )\r\n\r\n}\r\nexport default PersonalReportOverview","import React from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { useSearchParams, useNavigate } from \"react-router-dom\";\r\nimport { Box, Fab, Grid, Paper, Skeleton } from '@mui/material'\r\n\r\nimport KeyAreaGraph from \"../personalreport/KeyAreaGraph\";\r\n\r\n//import KeyAreaNavBar from \"./partials/personalreport/KeyAreaNavBar\";\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\nimport { useReactToPrint } from \"react-to-print\";\r\n\r\n\r\n\r\n\r\nconst motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n}\r\n\r\nconst PersonalReportHealthAndWellness = (props) => {\r\n const { component } = props\r\n const { settings, PrintView } = props.otherprops\r\n\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n )\r\n\r\n}\r\nexport default PersonalReportHealthAndWellness","import React from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { useSearchParams, useNavigate } from \"react-router-dom\";\r\nimport { Box, Fab, Grid, Paper, Skeleton } from '@mui/material'\r\n\r\n\r\nimport KeyAreaSectionContainer from \"../personalreport/KeyAreaSectionContainer\";\r\n//import KeyAreaNavBar from \"./partials/personalreport/KeyAreaNavBar\";\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\nimport { useReactToPrint } from \"react-to-print\";\r\n\r\nimport \"../../../styles/print.css\"\r\n\r\nconst motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0, \r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5, \r\n }\r\n }\r\n}\r\n\r\nconst PersonalReportKeyAreas = (props) => {\r\n const { component } = props\r\n const { settings, PrintView } = props.otherprops\r\n\r\n\r\n return (\r\n \r\n \r\n\r\n \r\n \r\n )\r\n\r\n}\r\nexport default PersonalReportKeyAreas","import React from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { useSearchParams, useNavigate } from \"react-router-dom\";\r\nimport { Box, Divider, Fab, Grid, Paper, Skeleton, Stack, Tooltip, Typography } from '@mui/material'\r\n\r\n\r\n//import KeyAreaNavBar from \"../partials/personalreport/KeyAreaNavBar\";\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\nimport { useReactToPrint } from \"react-to-print\";\r\nimport HealthAndSafetyIcon from '@mui/icons-material/HealthAndSafety';\r\nimport WarningIcon from '@mui/icons-material/Warning';\r\nimport DangerousIcon from '@mui/icons-material/Dangerous';\r\nimport HelpIcon from '@mui/icons-material/Help';\r\nimport InfoIcon from '@mui/icons-material/Info';\r\n\r\n\r\nconst motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n}\r\n\r\nconst PersonalReportBiometrics = (props) => {\r\n const { component } = props\r\n const { settings, PrintView } = props.otherprops\r\n const GetIcon = ({ valuegrade }) => {\r\n if (valuegrade == \"1\") return 2 \",\r\n \"Score\": \"40\",\r\n \"Order\": \"10\",\r\n \"HelpText\": \"Body mass index (BMI) is a measure of body fat based on height and weight.\",\r\n \"YouValue\": \"27.7\",\r\n \"Label\": \"BMI\",\r\n \"ValueGrade\": \"2\",\r\n \"Visible\": \"1\"\r\n }\r\n */\r\n const { BiometricsArray } = component\r\n const BiometricsArray_filtered = BiometricsArray.filter(x => { return x.Visible === 1 || x.Visible === '1' })\r\n const BiometricsArray_sorted = BiometricsArray_filtered.sort(function (a, b) { return parseInt(a.Order) - parseInt(b.Order) })\r\n\r\n const BiometricsCardA = ({ obj }) => {\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n {obj.Label} \r\n \r\n \r\n {obj.YouValue} \r\n \r\n \r\n \r\n \r\n {obj.HelpText} \r\n \r\n \r\n \r\n \r\n )\r\n }\r\n\r\n const BiometricsCardB = ({ obj }) => {\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {obj.Label}\r\n \r\n {obj.YouValueLabel}: {obj.YouValue} \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n )\r\n }\r\n return (\r\n // \r\n // \r\n // \r\n // \r\n // \r\n // \r\n \r\n \r\n\r\n \r\n \r\n {component.Label} \r\n \r\n {\r\n BiometricsArray_sorted.map((x, i) => {\r\n return (\r\n \r\n \r\n )\r\n })\r\n }\r\n \r\n \r\n \r\n\r\n\r\n )\r\n\r\n}\r\nexport default PersonalReportBiometrics","import { Grid, Typography, Divider, Box, Card, CardContent, Collapse, CardHeader } from '@mui/material'\r\nimport React, { useEffect, useState } from 'react'\r\nimport ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown';\r\nimport ArrowDropUpIcon from '@mui/icons-material/ArrowDropUp';\r\nimport HealthAndSafetyIcon from '@mui/icons-material/HealthAndSafety';\r\nimport WarningIcon from '@mui/icons-material/Warning';\r\nimport DangerousIcon from '@mui/icons-material/Dangerous';\r\nimport '../../../styles/report.css'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\n\r\nconst SmallCardSingle = (props) => {\r\n const [PrintView, setPrintView] = useState(false)\r\n useEffect(() => { setPrintView(props.PrintView) }, [props.PrintView])\r\n\r\n const [value, setValue] = React.useState(0);\r\n const [currentTab, setCurrentTab] = React.useState(props.smallCard)\r\n const [isFlipped, setIsFlipped] = React.useState(false)\r\n const [isFlippedLarge, setIsFlippedLarge] = React.useState(false)\r\n\r\n // const handleChange = (event, newValue) => {\r\n // setValue(newValue);\r\n // setIsFlipped(-1)\r\n // setCurrentTab(props.cards.KeyAreas.KeyAreaArray[newValue])\r\n // };\r\n\r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n\r\n const getColorBottomCard = (valuegrade, opacity) => {\r\n if (valuegrade == \"1\") return { background: 'linear-gradient(to bottom, #fff, #fff 92%, rgba(78, 183, 72,' + opacity + ') 175%)', color: 'black', minHeight: '50px' }\r\n if (valuegrade == \"2\") return { background: 'linear-gradient(to bottom, #fff, #fff 92%, rgba(231, 198, 30,' + opacity + ') 175%)', color: 'black', minHeight: '50px' }\r\n else return { background: 'linear-gradient(to bottom, #fff, #fff 92%, rgba(230, 50, 58,' + opacity + ') 175%)', color: 'black', minHeight: '50px' }\r\n }\r\n\r\n const getColorBottomHeader = (valuegrade, opacity) => {\r\n if (valuegrade == \"1\") return { background: 'linear-gradient(to bottom, #fff, #fff 95%, rgba(78, 183, 72,' + opacity + ') 95%, rgba(78, 183, 72,' + opacity + ') 100%)', color: 'black', minHeight: '50px' }\r\n if (valuegrade == \"2\") return { background: 'linear-gradient(to bottom, #fff, #fff 95%, rgba(231, 198, 30,' + opacity + ') 95%, rgba(231, 198, 30,' + opacity + ') 100%)', color: 'black', minHeight: '50px' }\r\n else return { background: 'linear-gradient(to bottom, #fff, #fff 95%, rgba(230, 50, 58,' + opacity + ') 95%, rgba(230, 50, 58,' + opacity + ') 100%)', color: 'black', minHeight: '50px' }\r\n }\r\n\r\n\r\n const getColorDivider = (valuegrade, opacity) => {\r\n if (valuegrade == \"1\") return { borderColor: 'linear-gradient(to right bottom, rgba(78, 183, 72,0.8), rgba(78, 183, 72,0.15))', borderRadius: '90%', borderBottomWidth: 2 }\r\n if (valuegrade == \"2\") return { borderColor: 'linear-gradient(to right bottom, rgba(231, 198, 30,0.8), rgba(231, 198, 30,0.15))', borderRadius: '90%', borderBottomWidth: 2 }\r\n else return { borderColor: 'linear-gradient(to right bottom, rgba(230, 50, 58,0.8),rgba(230, 50, 58,0.15))', borderRadius: '90%', borderBottomWidth: 2 }\r\n }\r\n\r\n\r\n const getIcon = (valuegrade) => {\r\n if (valuegrade == \"1\") return \r\n\r\n \r\n setIsFlipped(!isFlipped)}>\r\n {currentTab.CardTitle}}\r\n disableTypography='true'\r\n style={getColorBottomHeader(currentTab.ValueGrade, \"1\")}\r\n >\r\n\r\n \r\n\r\n \r\n \r\n { currentTab.YouValue && ({currentTab.YouValueLabel} {currentTab.YouValue} )}\r\n { currentTab.YouValue && (\r\n {currentTab.GoalValueLabel} {currentTab.GoalValue}\r\n )}\r\n \r\n \r\n \r\n {currentTab.BackContent}\r\n \r\n \r\n\r\n\r\n \r\n\r\n \r\n \r\n\r\n \r\n // ))}\r\n\r\n\r\n )\r\n } else {\r\n return (\r\n {component.HelpText !== '' && (\r\n \r\n\r\n \r\n {component.Label}\r\n \r\n \r\n )}\r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n )\r\n\r\n}\r\n\r\nexport default WellnessScoreSingle","\r\n\r\nimport React from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { useSearchParams, useNavigate } from \"react-router-dom\";\r\nimport { Box, Fab, Grid, Paper, Skeleton, Typography } from '@mui/material'\r\n\r\n\r\nimport OverallWellnessScore from \"../personalreport/OverallWellnessScore\";\r\n\r\n//import KeyAreaNavBar from \"./partials/personalreport/KeyAreaNavBar\";\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\nimport { useReactToPrint } from \"react-to-print\";\r\n\r\n\r\n\r\nimport HealthAge from \"../personalreport/HealthAge\";\r\nimport Information from \"../personalreport/Information\";\r\n\r\n\r\nconst motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n}\r\nconst InformationSingle = (props) => {\r\n const { component } = props\r\n const { settings, PrintView } = props.otherprops\r\n const compSize = parseInt(component.Size) \r\n\r\n const showName = settings.OrganizationSettingValues['HIDE PARTICIPANT NAME']\r\n const showNameFlag = (showName === '0' || showName === 0) ? true : false\r\n\r\n\r\n const { FirstCalculatedDate\r\n , FirstCalculatedDateText\r\n , FirstName\r\n , LastName\r\n , MostRecentCalc\r\n , MostRecentCalcText\r\n , NameText\r\n , ResponseCreateDate\r\n , ResponseCreateDateText\r\n , AssessmentText } = component\r\n return (\r\n\r\n \r\n \r\n {AssessmentText}\r\n \r\n \r\n \r\n {showNameFlag && (\r\n\r\n \r\n {NameText} \r\n \r\n )}\r\n {showNameFlag && (\r\n\r\n \r\n {FirstName} {LastName} \r\n \r\n )}\r\n \r\n {ResponseCreateDateText} \r\n \r\n \r\n {ResponseCreateDate} \r\n \r\n\r\n \r\n {FirstCalculatedDateText} \r\n \r\n \r\n {FirstCalculatedDate} \r\n \r\n\r\n \r\n {MostRecentCalcText} \r\n \r\n \r\n {MostRecentCalc} \r\n \r\n \r\n \r\n \r\n\r\n\r\n )\r\n\r\n}\r\n\r\nexport default InformationSingle","import React, { useState, useEffect, useRef, useCallback } from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { useSearchParams, useNavigate } from \"react-router-dom\";\r\nimport { Box, Fab, Grid, Paper, Skeleton } from '@mui/material'\r\n\r\n\r\nimport OverallWellnessScore from \"../personalreport/OverallWellnessScore\";\r\n\r\n//import KeyAreaNavBar from \"./partials/personalreport/KeyAreaNavBar\";\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\nimport { useReactToPrint } from \"react-to-print\";\r\n\r\n\r\n\r\nimport HealthAge from \"../personalreport/HealthAge\";\r\nimport Information from \"../personalreport/Information\";\r\nimport WellnessScoreSingle from \"../personalreport/WellnessScoreSingle\";\r\nimport InformationSingle from \"../personalreport/InformationSingle\";\r\n\r\n\r\nconst motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n}\r\n\r\nconst PersonalReportInfoAndOverall = (props) => {\r\n const { component } = props\r\n const { settings, PrintView } = props.otherprops\r\n\r\n\r\n return (\r\n \r\n\r\n \r\n\r\n \r\n \r\n\r\n \r\n \r\n \r\n\r\n
\r\n\r\n \r\n \r\n \r\n\r\n \r\n \r\n\r\n \r\n \r\n \r\n
\r\n\r\n \r\n \r\n \r\n\r\n \r\n \r\n )\r\n\r\n}\r\nexport default PersonalReportInfoAndOverall","import React, { useEffect, useState } from 'react'\r\nimport { useNavigate, createSearchParams } from 'react-router-dom'\r\nimport { useDispatch, useSelector } from \"react-redux\"\r\nimport WellnessScore from '../WellnessScore'\r\nimport AssessmentIcon from '@mui/icons-material/Assessment'\r\nimport SummarizeIcon from '@mui/icons-material/Summarize'\r\nimport EditIcon from '@mui/icons-material/Edit'\r\nimport { Button, Grid, Box, Typography, Modal, Card, CardHeader, CardContent, CardActions, Stack, Divider } from '@mui/material'\r\nimport { surveyClear } from \"../../../reducers/survey\"\r\nimport { stubTrue } from 'lodash'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { Progress } from 'react-sweet-progress';\r\nimport \"react-sweet-progress/lib/style.css\";\r\n\r\nconst motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n}\r\n\r\nconst PreferredCardInProgress = (props) => {\r\n const AssessmentObject = props.AssessmentObject\r\n const AssessmentGuid = AssessmentObject.ResponseId_Guid\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const navigate = useNavigate()\r\n\r\n const handleContinue = (guid) => {\r\n console.log(\"continue select\")\r\n fetch('../../WsWebServicePlatform/Participant/Setting/Set/' + currentUser.AuthToken + '/' + props.settings.SessionVariableValues[\"PERSON GUID\"] + '/ASSMT%20PRODUCT%20GUID/' + AssessmentObject.AssessmentProductGuid + '/', {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n .then(response => response.json())\r\n .then(response => {\r\n fetch('../../WsWebServicePlatform/Participant/SessionVar/Set/' + currentUser.AuthToken + '/RESPONSE%20GUID/' + guid + '/', {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n .then(response => response.json())\r\n .then(response => {\r\n navigate({ pathname: '/hra', search: createSearchParams({ vi: 'B87190C3-B9C8-41D7-A1C8-10E07FBA0D3E', assmtguid: guid }).toString() })\r\n })\r\n })\r\n\r\n\r\n }\r\n const graphcolors = ['#c0c0c0', '#4eb748', '#E7C61E', '#E6323A']\r\n return (\r\n \r\n \r\n {AssessmentObject.SurveyDescription}\r\n } />\r\n \r\n \r\n \r\n {AssessmentObject.ProgressText} \r\n\r\n \r\n\r\n\r\n \r\n \r\n\r\n \r\n \r\n\r\n \r\n {AssessmentObject.PercentCompleted}% Completed \r\n \r\n\r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n handleContinue(AssessmentGuid)} >\r\n {AssessmentObject.ContinueButton}\r\n \r\n \r\n \r\n \r\n\r\n \r\n )\r\n\r\n}\r\n\r\nexport default PreferredCardInProgress; ","import React, { useEffect, useState } from 'react'\r\nimport { useNavigate, createSearchParams } from 'react-router-dom'\r\nimport { useDispatch, useSelector } from \"react-redux\"\r\nimport WellnessScore from '../WellnessScore'\r\nimport AssessmentIcon from '@mui/icons-material/Assessment'\r\nimport SummarizeIcon from '@mui/icons-material/Summarize'\r\nimport EditIcon from '@mui/icons-material/Edit'\r\nimport { Button, Grid, Box, Typography, Modal, Stack, Paper, Card, CardHeader, Avatar, CardContent, CardActions, IconButton, Divider } from '@mui/material'\r\nimport { surveyClear } from \"../../../reducers/survey\"\r\nimport { stubTrue } from 'lodash'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\nconst motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n}\r\n\r\nconst PreferredCardComplete = (props) => {\r\n\r\n const AssessmentObject = props.AssessmentObject\r\n const { EditAssessmentWarning } = AssessmentObject\r\n\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const navigate = useNavigate();\r\n const CanEdit = AssessmentObject.HRAModeCanEdit === '1'\r\n const showStart = AssessmentObject.HRAModeCanTakeAnother == '1'\r\n const AssessmentGuid = AssessmentObject.ResponseId_Guid\r\n const dispatch = useDispatch();\r\n const surveyStatus = useSelector(state => state.surveys.status)\r\n\r\n const [open, setOpen] = useState(false)\r\n const [guid, setGuid] = useState(\"\")\r\n\r\n const currentAssessmentDate = AssessmentObject.ResponseCreated;\r\n const displayDate = (currentAssessmentDate ? currentAssessmentDate.split(' ')[0] : null)\r\n\r\n useEffect(() => {\r\n if (surveyStatus === 'success') {\r\n\r\n dispatch(surveyClear())\r\n }\r\n }, [surveyStatus])\r\n\r\n const handleClose = () => {\r\n setOpen(false)\r\n }\r\n\r\n const handlePRClick = () => {\r\n\r\n if (AssessmentGuid) {\r\n\r\n fetch('../../WsWebServicePlatform/Participant/SessionVar/Set/' + currentUser.AuthToken + '/RESPONSE%20GUID/' + AssessmentGuid + '/', {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n .then(response => response.json())\r\n .then(response => {\r\n navigate({ pathname: '/personalreport', search: createSearchParams({ vi: '8AC17D1E-2871-44D9-ACC0-867285149337' }).toString() })\r\n })\r\n }\r\n }\r\n\r\n const handlePSClick = () => {\r\n\r\n\r\n if (AssessmentGuid) {\r\n fetch('../../WsWebServicePlatform/Participant/SessionVar/Set/' + currentUser.AuthToken + '/RESPONSE%20GUID/' + AssessmentGuid + '/', {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n .then(response => response.json())\r\n .then(response => {\r\n navigate({ pathname: '/physiciansummary', search: createSearchParams({ vi: '2C2870C1-1C00-4E67-98FF-04BA402C6824' }).toString() })\r\n }\r\n )\r\n }\r\n }\r\n\r\n\r\n const handleEditClick = (guid) => {\r\n\r\n setOpen(true)\r\n setGuid(guid)\r\n }\r\n\r\n const handleStartEdit = () => {\r\n if (guid) {\r\n fetch('../../WsWebServicePlatform/Participant/Setting/Set/' + currentUser.AuthToken + '/' + props.settings.SessionVariableValues[\"PERSON GUID\"] + '/ASSMT%20PRODUCT%20GUID/' + AssessmentObject.AssessmentProductGuid + '/', {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n .then(fetch('../../WsWebServicePlatform/Participant/SessionVar/Set/' + currentUser.AuthToken + '/RESPONSE%20GUID/' + AssessmentGuid + '/', {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n .then(response => {\r\n\r\n navigate({ pathname: '/hra', search: createSearchParams({ vi: 'D58CC25B-BB6A-439D-B3D7-BA37AD1AB701', assmtguid: AssessmentGuid }).toString() })\r\n })\r\n )\r\n }\r\n }\r\n\r\n const handleStart = () => {\r\n fetch('../../WsWebServicePlatform/Participant/Setting/Set/' + currentUser.AuthToken + '/' + props.settings.SessionVariableValues[\"PERSON GUID\"] + '/ASSMT%20PRODUCT%20GUID/' + AssessmentObject.AssessmentProductGuid + '/', {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n .then(response => response.json())\r\n .then(response => {\r\n\r\n })\r\n .then(fetch('../../WsWebServicePlatform/Participant/SessionVar/Delete/' + currentUser.AuthToken + '/RESPONSE%20GUID/', {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n .then(response => response.json())\r\n .then(response => {\r\n\r\n navigate({ pathname: '/hra', search: createSearchParams({ vi: 'D58CC25B-BB6A-439D-B3D7-BA37AD1AB701' }).toString() })\r\n }))\r\n }\r\n\r\n\r\n return (\r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n {AssessmentObject.SurveyDescription} \r\n {AssessmentObject.CompletedContent} \r\n\r\n\r\n \r\n\r\n {\r\n AssessmentObject.PRGuid &&\r\n AssessmentObject.PRGuid.length > 0 && (\r\n\r\n handlePRClick()}\r\n >\r\n \r\n {AssessmentObject.PersonalReportButton} \r\n \r\n \r\n )\r\n }\r\n {\r\n AssessmentObject.PSGuid &&\r\n AssessmentObject.PSGuid.length > 0 && (\r\n handlePSClick()} >\r\n \r\n {AssessmentObject.PhysicianSummaryButton} \r\n \r\n \r\n )\r\n }\r\n {\r\n CanEdit && (\r\n handleEditClick(AssessmentGuid)} >\r\n \r\n {AssessmentObject.EditButton} \r\n \r\n \r\n )\r\n }\r\n { showStart && (\r\n handleStart()} >\r\n \r\n {AssessmentObject.TakeAssessmentContent} \r\n \r\n \r\n )\r\n }\r\n \r\n \r\n \r\n\r\n\r\n\r\n\r\n \r\n \r\n \r\n\r\n \r\n \r\n {EditAssessmentWarning.Text} \r\n handleStartEdit()}>{EditAssessmentWarning.Continue} \r\n handleClose()}>{EditAssessmentWarning.Exit} \r\n \r\n \r\n \r\n )\r\n\r\n\r\n}\r\n\r\nexport default PreferredCardComplete; ","import React, { useEffect, useState } from 'react'\r\nimport { useNavigate, createSearchParams } from 'react-router-dom'\r\nimport { useDispatch, useSelector } from \"react-redux\"\r\nimport WellnessScore from '../WellnessScore'\r\nimport AssessmentIcon from '@mui/icons-material/Assessment'\r\nimport SummarizeIcon from '@mui/icons-material/Summarize'\r\nimport EditIcon from '@mui/icons-material/Edit'\r\nimport { Button, Grid, Box, Typography, Modal, Paper, Stack, Card, CardHeader, CardContent, CardActions, Divider } from '@mui/material'\r\nimport { surveyClear } from \"../../../reducers/survey\"\r\nimport { stubTrue } from 'lodash'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\nconst motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n}\r\n\r\nconst PreferredCardStart = (props) => {\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const AssessmentObject = props.AssessmentObject\r\n const AssessmentGuid = AssessmentObject.ResponseId_Guid\r\n const navigate = useNavigate('/hra')\r\n const handleStart = () => {\r\n \r\n fetch('../../WsWebServicePlatform/Participant/Setting/Set/' + currentUser.AuthToken + '/' + props.settings.SessionVariableValues[\"PERSON GUID\"] + '/ASSMT%20PRODUCT%20GUID/' + AssessmentObject.AssessmentProductGuid + '/', {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n .then(response => response.json())\r\n .then(response => {\r\n console.log('response')\r\n })\r\n .then(fetch('../../WsWebServicePlatform/Participant/SessionVar/Delete/' + currentUser.AuthToken + '/RESPONSE%20GUID/', {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n .then(response => response.json())\r\n .then(response => {\r\n console.log('response')\r\n navigate({ pathname: '/hra', search: createSearchParams({ vi: 'D58CC25B-BB6A-439D-B3D7-BA37AD1AB701' }).toString() })\r\n }))\r\n }\r\n return (\r\n \r\n \r\n {AssessmentObject.SurveyDescription}\r\n }\r\n />\r\n\r\n \r\n \r\n {AssessmentObject.StartText} \r\n\r\n \r\n \r\n \r\n \r\n handleStart()}\r\n\r\n >\r\n\r\n {AssessmentObject.StartTextButton}\r\n\r\n \r\n \r\n \r\n \r\n\r\n\r\n \r\n )\r\n\r\n}\r\n\r\nexport default PreferredCardStart; ","import React, { useEffect, useState } from 'react'\r\nimport { useNavigate, createSearchParams } from 'react-router-dom'\r\nimport { useDispatch, useSelector } from \"react-redux\"\r\nimport WellnessScore from '../WellnessScore'\r\nimport AssessmentIcon from '@mui/icons-material/Assessment'\r\nimport SummarizeIcon from '@mui/icons-material/Summarize'\r\nimport EditIcon from '@mui/icons-material/Edit'\r\nimport { Button, Grid, Box, Typography, Modal, Paper, Stack, Card, CardHeader, CardContent, CardActions, Divider } from '@mui/material'\r\nimport { surveyClear } from \"../../../reducers/survey\"\r\nimport { stubTrue } from 'lodash'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\nconst motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n}\r\n\r\nconst PreferredCardCampaign = (props) => {\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const AssessmentObject = props.AssessmentObject\r\n const navigate = useNavigate('/hra')\r\n \r\n return (\r\n \r\n \r\n {AssessmentObject.SurveyDescription}\r\n }\r\n />\r\n\r\n \r\n \r\n {AssessmentObject.CampaignContentText} \r\n\r\n \r\n \r\n \r\n \r\n\r\n\r\n \r\n )\r\n\r\n}\r\n\r\nexport default PreferredCardCampaign; ","import React from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { useSearchParams, useNavigate } from \"react-router-dom\";\r\nimport { Box, Divider, Fab, Grid, Paper, Skeleton, Stack, Tooltip, Typography } from '@mui/material'\r\n\r\n\r\n//import KeyAreaNavBar from \"../partials/personalreport/KeyAreaNavBar\";\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\nimport { useReactToPrint } from \"react-to-print\";\r\nimport HealthAndSafetyIcon from '@mui/icons-material/HealthAndSafety';\r\nimport WarningIcon from '@mui/icons-material/Warning';\r\nimport DangerousIcon from '@mui/icons-material/Dangerous';\r\nimport HelpIcon from '@mui/icons-material/Help';\r\nimport InfoIcon from '@mui/icons-material/Info';\r\nimport { Circle } from \"@mui/icons-material\";\r\n\r\n\r\nconst motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n}\r\n\r\nconst PersonalReportRiskList = (props) => {\r\n const { component } = props\r\n const RiskArray = component.ComponentContent.RiskFactors\r\n const RiskArrayFiltered = RiskArray.filter(x => x.Visibility == \"1\")\r\n const { settings, PrintView } = props.otherprops\r\n const GetIcon = ({ valuegrade }) => {\r\n if (valuegrade == \"1\") return 2 \",\r\n \"Score\": \"40\",\r\n \"Order\": \"10\",\r\n \"HelpText\": \"Body mass index (BMI) is a measure of body fat based on height and weight.\",\r\n \"YouValue\": \"27.7\",\r\n \"Label\": \"BMI\",\r\n \"ValueGrade\": \"2\",\r\n \"Visible\": \"1\"\r\n }\r\n */\r\n\r\n const RiskCard = ({ obj }) => {\r\n\r\n return (\r\n \r\n \r\n {obj.Content} \r\n \r\n \r\n \r\n )\r\n }\r\n\r\n const borderColor = settings && settings.OrganizationSettingValues && settings.OrganizationSettingValues[\"THEME COLOR\"]\r\n return (\r\n // \r\n // \r\n // \r\n // \r\n // \r\n // \r\n \r\n \r\n \r\n \r\n \r\n \r\n {component.ComponentContent.RiskFactorText} \r\n \r\n\r\n\r\n {RiskArrayFiltered.map((x, i) => { \r\n if (i < parseInt(component.ComponentContent.RiskFactorMaxItems)) \r\n return (\r\n \r\n\r\n \r\n )})}\r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n\r\n )\r\n\r\n}\r\nexport default PersonalReportRiskList","import React from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { useSearchParams, useNavigate } from \"react-router-dom\";\r\nimport { Box, Divider, Fab, Grid, Paper, Skeleton, Stack, Tooltip, Typography } from '@mui/material'\r\n\r\n\r\n//import KeyAreaNavBar from \"../partials/personalreport/KeyAreaNavBar\";\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\nimport { useReactToPrint } from \"react-to-print\";\r\nimport HealthAndSafetyIcon from '@mui/icons-material/HealthAndSafety';\r\nimport WarningIcon from '@mui/icons-material/Warning';\r\nimport DangerousIcon from '@mui/icons-material/Dangerous';\r\nimport HelpIcon from '@mui/icons-material/Help';\r\nimport InfoIcon from '@mui/icons-material/Info';\r\n\r\n\r\nconst motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n}\r\n\r\nconst PersonalReportCallouts = (props) => {\r\n const { component } = props\r\n const Callouts = component.ComponentContent.CallOuts\r\n const Callout1Visible = Callouts.CallOut01.Visible\r\n const Callout2Visible = Callouts.CallOut02.Visible\r\n const { settings, PrintView } = props.otherprops\r\n const GetIcon = ({ valuegrade }) => {\r\n if (valuegrade == \"1\") return 2 \",\r\n \"Score\": \"40\",\r\n \"Order\": \"10\",\r\n \"HelpText\": \"Body mass index (BMI) is a measure of body fat based on height and weight.\",\r\n \"YouValue\": \"27.7\",\r\n \"Label\": \"BMI\",\r\n \"ValueGrade\": \"2\",\r\n \"Visible\": \"1\"\r\n }\r\n */\r\n \r\n const CalloutCard = ({ obj }) => {\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n {obj.PrimaryText} \r\n \r\n \r\n {obj.CalloutText} \r\n \r\n \r\n {obj.SecondaryText} \r\n \r\n \r\n \r\n \r\n )\r\n }\r\n\r\n \r\n return (\r\n // \r\n // \r\n // \r\n // \r\n // \r\n // \r\n \r\n \r\n \r\n {/* \r\n {component.Label} \r\n */}\r\n {Callout1Visible &&(\r\n\r\n \r\n \r\n )}\r\n {Callout2Visible &&(\r\n \r\n \r\n )}\r\n \r\n \r\n \r\n \r\n\r\n\r\n )\r\n\r\n}\r\nexport default PersonalReportCallouts","import React from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { useSearchParams, useNavigate } from \"react-router-dom\";\r\nimport { Box, Divider, Fab, Grid, Paper, Skeleton, Stack, Tooltip, Typography } from '@mui/material'\r\n\r\n\r\n//import KeyAreaNavBar from \"../partials/personalreport/KeyAreaNavBar\";\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\nimport { useReactToPrint } from \"react-to-print\";\r\nimport HealthAndSafetyIcon from '@mui/icons-material/HealthAndSafety';\r\nimport WarningIcon from '@mui/icons-material/Warning';\r\nimport DangerousIcon from '@mui/icons-material/Dangerous';\r\nimport HelpIcon from '@mui/icons-material/Help';\r\nimport InfoIcon from '@mui/icons-material/Info';\r\n\r\n\r\nconst motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n}\r\n\r\nconst PersonalReportStatementText = (props) => {\r\n const { component } = props\r\n const TextObject = component.ComponentContent\r\n\r\n const { settings, PrintView } = props.otherprops\r\n const GetIcon = ({ valuegrade }) => {\r\n if (valuegrade == \"1\") return 2 \",\r\n \"Score\": \"40\",\r\n \"Order\": \"10\",\r\n \"HelpText\": \"Body mass index (BMI) is a measure of body fat based on height and weight.\",\r\n \"YouValue\": \"27.7\",\r\n \"Label\": \"BMI\",\r\n \"ValueGrade\": \"2\",\r\n \"Visible\": \"1\"\r\n }\r\n */\r\n const borderColor = settings && settings.OrganizationSettingValues && settings.OrganizationSettingValues[\"THEME COLOR\"]\r\n\r\n const RiskCard = ({ obj }) => {\r\n\r\n return (\r\n\r\n \r\n {obj.Header && (\r\n\r\n \r\n \r\n {obj.Header}\r\n \r\n \r\n )}\r\n\r\n\r\n {obj.Subheader && (\r\n\r\n \r\n \r\n {obj.Subheader}\r\n \r\n \r\n )}\r\n \r\n \r\n \r\n\r\n )\r\n }\r\n\r\n\r\n return (\r\n // \r\n // \r\n // \r\n // \r\n // \r\n // \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n\r\n )\r\n\r\n}\r\nexport default PersonalReportStatementText","import React from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { useSearchParams, useNavigate, Link } from \"react-router-dom\";\r\nimport { Box, Button, Fab, Grid, Paper, Skeleton, Stack, Typography } from '@mui/material'\r\n\r\n\r\n//import KeyAreaNavBar from \"./partials/personalreport/KeyAreaNavBar\";\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\nimport { useReactToPrint } from \"react-to-print\";\r\n\r\n\r\n\r\nconst motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n}\r\n\r\nconst PersonalReportAboutAssessment = (props) => {\r\n const {component} = props\r\n const {ComponentContent} = component\r\n //const { component } = {Title:\"Some custom Text\",Description:\"Some sort of decently long description. Communicate with your audience.\", Button:{Text:\"Button Name\",URL:\"https://www.google.com\"}} //props\r\n //const { settings, PrintView } = props.otherprops\r\n const { settings, PrintView } = props\r\n\r\n \r\n return (\r\n \r\n \r\n \r\n \r\n\r\n {ComponentContent && ComponentContent.Header && ComponentContent.Header !=\"\" && ({ComponentContent.Header} )} \r\n {ComponentContent && ComponentContent.Content && ComponentContent.Content !=\"\" && ({component.Button.Text} )} */}\r\n \r\n \r\n \r\n \r\n )\r\n\r\n}\r\nexport default PersonalReportAboutAssessment","\r\n\r\nimport React from 'react'\r\nimport { Grid, Typography, Paper, Box } from '@mui/material'\r\nimport _ from 'lodash'\r\nimport { useNavigate } from 'react-router-dom'\r\nimport { useSelector } from \"react-redux\";\r\nimport KeyAreaGraph from './dynamic/KeyAreaGraph';\r\nimport DemographicsComponent from './dynamic/Demographics';\r\nimport OWSHealthAge from './dynamic/OWSHealthAge';\r\nimport BiometricsComponent from './dynamic/BiometricsComponent';\r\nimport MasonrySection from './dynamic/MasonrySection';\r\nimport SubSection from './dynamic/SubSection';\r\nimport ReadinessToChange from './dynamic/ReadinessToChange';\r\nimport AdminCompletionGraph from './dynamic/AdminCompletionGraph';\r\nimport LargeSection from './dynamic/LargeSection';\r\nimport KeyValueListFour from './dynamic/KeyValueListFour';\r\nimport OWSAdminDonut from './dynamic/OWSAdminDonut';\r\nimport DonutChart from './dynamic/DonutChart';\r\nimport KeyProgressCard from './dynamic/KeyProgressCard';\r\nimport DonutSection from './dynamic/DonutSection';\r\nimport MasonrySectionNoBG from './dynamic/MasonrySectionNoBG';\r\nimport AdminKeyAreaGraph from './dynamic/AdminKeyAreaGraph';\r\nimport TabbedComponent from './dynamic/TabbedComponent';\r\nimport AdminBiometricSection from './dynamic/AdminBiometricSection';\r\nimport HealthAgeAvgAge from './dynamic/AdminHealthAgeAvgAge';\r\nimport AdminFallRisk from './dynamic/AdminFallRisk';\r\nimport PersonalReportOverview from './dynamic/PersonalReportOverview';\r\nimport PersonalReportHealthAndWellness from './dynamic/PersonalReportHealthAndWellness';\r\nimport PersonalReportKeyAreas from './dynamic/PersonalReportKeyAreas';\r\nimport PersonalReportBiometrics from './dynamic/PersonalReportBiometrics';\r\nimport HTMLBlock from './dynamic/HTMLBlock';\r\n\r\nimport PersonalReportKeyAreaSingle from './dynamic/PersonalReportKeyAreaSingle';\r\nimport PersonalReportInfoAndOverall from './dynamic/PersonalReportInfoAndOverall';\r\nimport HomeBanner from './dynamic/HomeBanner';\r\nimport HomeAssessmentLibrary from './dynamic/HomeAssessmentLibrary';\r\nimport HomeHealthTools from './dynamic/HomeHealthTools';\r\nimport HomePreferredAssessment from './dynamic/HomePreferredAssessment';\r\nimport PersonalReportRiskList from './dynamic/PersonalReportRiskList';\r\nimport PersonalReportCallouts from './dynamic/PersonalReportCallOuts';\r\nimport PersonalReportStatementText from './dynamic/PersonalReportStatementText';\r\nimport PersonalReportAboutAssessment from './dynamic/PersonalReportAboutAssessment';\r\nimport AdminErrorMessage from './dynamic/AdminError';\r\n\r\nconst InvalidComponent = ({ component, key }) => {\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n {component.ComponentType} \r\n \r\n \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nconst DynamicComponentTranslation = {\r\n \"STANDARD KEY VALUE ICON CARD\": BiometricsComponent\r\n , \"STANDARD KEY VALUE CARD\": DemographicsComponent\r\n , \"KEY AREA CHART\": KeyAreaGraph\r\n , \"OWS AND HEALTH AGE\": OWSHealthAge\r\n , \"READINESS TO CHANGE\": ReadinessToChange\r\n , \"STANDARD MASONRY SECTION\": MasonrySection\r\n , \"STANDARD KEY VALUE SUBSECTION\": SubSection\r\n , \"ADMIN COMPLETION GRAPH\": AdminCompletionGraph\r\n , \"LARGE SECTION\": LargeSection\r\n , \"KEY VALUE LIST FOUR\": KeyValueListFour\r\n , \"OWS ADMIN DONUT\": OWSAdminDonut\r\n , \"STANDARD DONUT COLOR\": DonutChart\r\n , \"KEY VALUE EXPANDED NESTED\": DonutSection\r\n , \"STANDARD KEY PROGRESS CARD\": KeyProgressCard\r\n , \"STANDARD MASONRY SECTION NO BG\": MasonrySectionNoBG\r\n , \"ADMIN KEY AREA CHART\": AdminKeyAreaGraph\r\n , \"ADMIN KEY AREA TAB\": TabbedComponent\r\n , \"ADMIN BAR DISPLAY CARD\" : AdminBiometricSection\r\n , \"HEALTH AGE AVG AGE\": HealthAgeAvgAge\r\n , \"ADMIN FALL RISK COMPONENT\": AdminFallRisk\r\n , \"PR OVERVIEW\": PersonalReportOverview\r\n , \"PR HEALTH WELLNESS\": PersonalReportHealthAndWellness\r\n , \"PR KEY AREAS\": PersonalReportKeyAreas\r\n , \"PR BIOMETRICS\": PersonalReportBiometrics\r\n , \"PR RISK LIST\": PersonalReportRiskList\r\n , \"PR CALLOUT\": PersonalReportCallouts\r\n , \"PR STATEMENT TEXT\": PersonalReportStatementText\r\n , \"PR ABOUT ASSESSMENT\": PersonalReportAboutAssessment\r\n , \"HTML BLOCK\": HTMLBlock\r\n , \"PR ASSESSMENT AND SCORE\": PersonalReportInfoAndOverall \r\n , \"PR KEY AREA SINGLE\": PersonalReportKeyAreaSingle\r\n , \"HOME BANNER\": HomeBanner\r\n , \"ASSESSMENT LIST\": HomeAssessmentLibrary\r\n , \"HOME HEALTH LIBRARY\": HomeHealthTools\r\n , \"HOME PREFERRED ASSESSMENT\": HomePreferredAssessment\r\n ,\"ADMIN ERROR\": AdminErrorMessage\r\n}\r\n\r\nconst DynamicComponent = (props) => {\r\n //console.log('dynamic component', props.component)\r\n const navigate = useNavigate();\r\n\r\n if (typeof DynamicComponentTranslation[props.component.ComponentType] !== \"undefined\") {\r\n return React.createElement(DynamicComponentTranslation[props.component.ComponentType]\r\n , {\r\n key: props.index,\r\n component: props.component,\r\n otherprops:props,\r\n elevationdisabled: props.elevationdisabled ? true : false,\r\n PrintView: props.PrintView,\r\n }\r\n )\r\n }\r\n\r\n return React.createElement(\r\n () =>
,\r\n { key: props.index }\r\n )\r\n\r\n}\r\n\r\n\r\nDynamicComponent.displayName = 'blockComponent';\r\nexport default React.memo(DynamicComponent)","import React, { useEffect, useState } from 'react'\r\nimport { Grid, Typography, Divider, Box, Card, CardContent, CardHeader } from '@mui/material'\r\nimport _ from \"lodash\"\r\nimport RestaurantIcon from '@mui/icons-material/Restaurant';\r\nimport NewspaperIcon from '@mui/icons-material/Newspaper';\r\nimport HealthAndSafetyIcon from '@mui/icons-material/HealthAndSafety';\r\nimport WarningIcon from '@mui/icons-material/Warning';\r\nimport DangerousIcon from '@mui/icons-material/Dangerous';\r\nimport '../../../styles/report.css'\r\nimport '../../../styles/print.css'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport SmallCardSingle from '../personalreport/SmallCardSingle';\r\nimport { PsychologyAlt } from '@mui/icons-material';\r\n\r\n\r\n\r\nconst PersonalReportKeyAreaSingle = (props) => {\r\n const [PrintView, setPrintView] = useState(false)\r\n useEffect(() => { setPrintView(props.otherprops.PrintView) }, [props])\r\n\r\n const [value, setValue] = React.useState(0);\r\n const [currentTab, setCurrentTab] = React.useState(props.component)\r\n const [isFlipped, setIsFlipped] = React.useState(-1)\r\n const [isFlippedLarge, setIsFlippedLarge] = React.useState(false)\r\n\r\n // const handleChange = (event, newValue) => {\r\n // setValue(newValue);\r\n // setIsFlipped(-1)\r\n // setCurrentTab(props.cards.KeyAreas.KeyAreaArray[newValue])\r\n // };\r\n\r\n useEffect(() => {\r\n setIsFlipped(-1)\r\n }, currentTab)\r\n\r\n const IconFlip = {\r\n \"Mood Corner\": \r\n
\r\n \r\n \r\n \r\n \r\n \r\n {currentTab.Label} \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n {\r\n currentTab.ValueGrade == 1 ? \r\n \r\n \r\n \r\n \r\n \r\n\r\n\r\n \r\n \r\n\r\n\r\n \r\n {currentTab.Cards.Large.YouValue && (\r\n\r\n \r\n \r\n {currentTab.YouValueLabel} {currentTab.Cards.Large.YouValue}\r\n \r\n \r\n )}\r\n \r\n \r\n {currentTab.GoalValueLabel} {currentTab.Cards.Large.GoalValue}\r\n \r\n \r\n \r\n \r\n {currentTab.FrontContentLabel}\r\n \r\n \r\n \r\n \r\n {currentTab.Cards.Large.FrontContent}\r\n \r\n \r\n \r\n \r\n \r\n \r\n {currentTab.Cards.Large.BackContent}\r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n \r\n \r\n \r\n {sortedSmallCards.map((small, i) => (\r\n \r\n\r\n \r\n\r\n \r\n\r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n {IconFlip[currentTab.CornerLabel]} {currentTab.CornerLabel} \r\n \r\n \r\n \r\n \r\n\r\n\r\n \r\n \r\n )\r\n } else {\r\n return (\r\n \r\n )\r\n } else if (DisplayMode=='2') {\r\n return (\r\n \r\n \r\n )\r\n } else if (DisplayMode=='3') {\r\n return (\r\n \r\n \r\n )\r\n } else if (DisplayMode=='4') {\r\n return (\r\n \r\n \r\n )\r\n } else {\r\n return (\r\n \r\n Invalid DisplayMode \r\n \r\n )\r\n }\r\n }\r\n\r\n\r\n return (\r\n \r\n \r\n {\r\n\r\n AssessmentList.map((x, i) => {\r\n\r\n return (\r\n\r\n\r\n \r\n \r\n )\r\n\r\n}\r\n\r\nexport default HomePreferredAssessment; ","\r\nimport { Grid, Typography, Paper, Box } from '@mui/material'\r\nimport React, { useEffect } from 'react'\r\nimport WellnessScore from '../WellnessScore'\r\nimport '../../../styles/report.css'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport RYGGHorizontalBar from '../adminreport/RYGGHorizontalBar'\r\nimport { errormessagesClear, selectErrorMessagesByKeyName, selectErrorMessagesByNegativeCode } from '../../../reducers/reference_errormessages'\r\nimport { useSelector } from 'react-redux'\r\n/** \r\n * \r\n * This component is expecting the following input. \r\n\r\n{\r\n \"Order\": \"10\",\r\n \"Visible\": \"1\",\r\n \"Label\": \"\",\r\n \"ComponentType\": \"OWS AND HEALTH AGE\",\r\n \"OWS\": {\r\n \"Visible\": \"1\",\r\n \"Label\": \"Your Overall Wellness Score\",\r\n \"Value\": \"45\",\r\n \"ValueGrade\": \"2\"\r\n },\r\n \"HealthAge\": {\r\n \"CurrentLabel\": \"Health Age\",\r\n \"CurrentValue\": \"19.9\",\r\n \"AchievableLabel\": \"Achievable Health Age\",\r\n \"AchievableValue\": \"17.5\"\r\n }\r\n},\r\n*/\r\n\r\n\r\nconst AdminErrorMessage = (props) => {\r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n const Component = props.component\r\n const ErrorMessage = useSelector(state=>selectErrorMessagesByNegativeCode(state,Component.ErrorID,-1))\r\n\r\n useEffect(()=>{},[ErrorMessage, Component])\r\n \r\n //console.log('adminfallrisk.js', props.component)\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n {ErrorMessage && ErrorMessage.length>0 && ErrorMessage[0].MessageTypeContent} \r\n \r\n \r\n \r\n \r\n \r\n\r\n )\r\n}\r\n\r\nexport default AdminErrorMessage;","import React, { useState, useEffect, useRef, useCallback } from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { useSearchParams, useNavigate } from \"react-router-dom\";\r\nimport { Box, Fab, Grid, Paper, Skeleton } from '@mui/material'\r\nimport { getViewInstance } from \"../actions/viewinstance\";\r\nimport Header from \"./layouts/Header\";\r\nimport Loading from \"./Loading\";\r\nimport OverallWellnessScore from \"./partials/personalreport/OverallWellnessScore\";\r\nimport KeyAreaGraph from \"./partials/personalreport/KeyAreaGraph\";\r\nimport KeyAreaSectionContainer from \"./partials/personalreport/KeyAreaSectionContainer\";\r\n//import KeyAreaNavBar from \"./partials/personalreport/KeyAreaNavBar\";\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\nimport { useReactToPrint } from \"react-to-print\";\r\n\r\n\r\nimport Footer from \"./layouts/Footer\";\r\nimport ResponsiveRectangle from \"./partials/skeletons/ResponsiveRectangle\";\r\nimport RYGGLegend from \"./partials/adminreport/RYGGLegend\";\r\nimport HealthAge from \"./partials/personalreport/HealthAge\";\r\nimport Information from \"./partials/personalreport/Information\";\r\nimport DynamicComponent from \"./partials/DynamicComponent\";\r\nimport HTMLBlock from \"./partials/dynamic/HTMLBlock\";\r\nimport { fetchViewInstances, selectViewInstanceById } from \"../reducers/reuseable_vi\";\r\n\r\n\r\n\r\nconst PersonalReport = (props) => {\r\n\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const [callVI, setCallVI] = useState(false)\r\n useEffect(() => {\r\n if (window !== undefined) { \r\n window.scrollTo(0, 0)\r\n }\r\n }, [])\r\n const [searchParams] = useSearchParams();\r\n //const { viewInstance, settings } = useSelector(state => state.viewinstance)\r\n const viewInstance = useSelector(state => selectViewInstanceById(state,'PersonalReport'))\r\n const viewInstanceLegend = useSelector(state => selectViewInstanceById(state,'ReportLegend'))\r\n const settings = viewInstance?.settings || {}\r\n const [loading, setLoading] = useState(false);\r\n const dispatch = useDispatch();\r\n const navigate = useNavigate();\r\n\r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n\r\n const [PrintView, setPrintView] = useState(false);\r\n const componentRef = useRef(null);\r\n const onBeforeGetContentResolve = React.useRef(null);\r\n const reactToPrintContent = React.useCallback(() => {\r\n return componentRef.current;\r\n }, [componentRef.current]);\r\n\r\n useEffect(() => { }, [PrintView])\r\n\r\n const handleAfterPrint = React.useCallback(() => {\r\n setPrintView(false);\r\n\r\n }, []);\r\n\r\n const handleBeforePrint = React.useCallback(() => {\r\n }, []);\r\n\r\n const handleOnBeforeGetContent = React.useCallback(() => {\r\n setPrintView(true);\r\n return new Promise((resolve) => {\r\n onBeforeGetContentResolve.current = resolve;\r\n setTimeout(() => {\r\n setPrintView(true);\r\n resolve();\r\n }, 2000);\r\n });\r\n }, [setLoading, setPrintView]);\r\n\r\n const handleActualPrint = () => {\r\n //setPrintView(true)\r\n //handlePrint()\r\n window.print()\r\n }\r\n useEffect(() => {\r\n const startConversion = () => {\r\n if (window.hiqPdfConverter) {\r\n window.hiqPdfConverter.startConversion();\r\n }\r\n };\r\n\r\n // Ensure hiqPdfConverter is available and the component is ready\r\n if (typeof window.hiqPdfConverter !== 'undefined' && !loading) {\r\n startConversion();\r\n } else {\r\n // Add an event listener for when hiqPdfConverter becomes available\r\n window.addEventListener('hiqPdfConverterReady', startConversion);\r\n\r\n // Clean up the event listener when the component unmounts\r\n return () => {\r\n window.removeEventListener('hiqPdfConverterReady', startConversion);\r\n };\r\n }\r\n }, [loading]);\r\n const handlePrint = useReactToPrint({\r\n content: reactToPrintContent,\r\n documentTitle: \"Personal Report\",\r\n onBeforeGetContent: handleOnBeforeGetContent,\r\n onBeforePrint: handleBeforePrint,\r\n onAfterPrint: handleAfterPrint,\r\n removeAfterPrint: true\r\n });\r\n\r\n useEffect(() => {\r\n //IF EMPTY VI OR NOT THE DESIRED VI AND THE VI HAS NOT BEEN CALLED YET\r\n setLoading(true)\r\n if ((!viewInstance || !viewInstance.ReportPersonalPage) && !callVI) {\r\n //SO IT'S NOT CALLED MULTIPLE TIMES\r\n setCallVI(true)\r\n //CALL THE ACTION THAT FETCHES THE SERVICE AND UPDATES THE STATE\r\n //dispatch(getViewInstance(searchParams.get(\"vi\"), currentUser.AuthToken))\r\n dispatch(fetchViewInstances({authToken: currentUser.AuthToken, VIGuid:searchParams.get(\"vi\"), VIName:\"PersonalReport\"}))\r\n //dispatch(fetchViewInstances({authToken: currentUser.AuthToken, VIGuid:'the guid', VIName:\"ReportLegend\"}))\r\n setLoading(false)\r\n\r\n }\r\n\r\n //WINDOW.LOCATION PROVIDES EXTRA CONTEXT SO WHEN TEH URL UPDATES THE APP UPDATES\r\n }, [window.location.pathname])\r\n\r\n useEffect(() => {\r\n //IF EMPTY VI OR NOT THE DESIRED VI AND THE VI HAS NOT BEEN CALLED YET\r\n if ((!viewInstanceLegend || !viewInstanceLegend.LegendsVI)) {\r\n //SO IT'S NOT CALLED MULTIPLE TIMES\r\n //CALL THE ACTION THAT FETCHES THE SERVICE AND UPDATES THE STATE\r\n //dispatch(getViewInstance(searchParams.get(\"vi\"), currentUser.AuthToken))\r\n dispatch(fetchViewInstances({authToken: currentUser.AuthToken, VIGuid:'CAFE4E0B-EDD4-466F-A9A9-73833821531F', VIName:\"ReportLegend\"}))\r\n //dispatch(fetchViewInstances({authToken: currentUser.AuthToken, VIGuid:'the guid', VIName:\"ReportLegend\"}))\r\n \r\n\r\n }\r\n //WINDOW.LOCATION PROVIDES EXTRA CONTEXT SO WHEN TEH URL UPDATES THE APP UPDATES\r\n }, [window.location.pathname])\r\n\r\n const OrderedSections =\r\n viewInstance\r\n && viewInstance.ReportViewInstance\r\n && viewInstance.ReportViewInstance.ReportPage\r\n && viewInstance.ReportViewInstance.ReportPage[0].ReportFrame\r\n && [...viewInstance.ReportViewInstance.ReportPage[0].ReportFrame].sort(function (a, b) { return parseInt(a.Order) - parseInt(b.Order) })\r\n const VisibleSections = viewInstance && OrderedSections && OrderedSections.filter(x=> {return x.Visible === 1 || x.Visible==='1'})\r\n\r\n return (\r\n \r\n { handleActualPrint() }} />\r\n \r\n \r\n \r\n \r\n \r\n {viewInstance && viewInstance.status==='success' && VisibleSections && VisibleSections.length > 0 ? (\r\n VisibleSections.map((x, i) => {\r\n return (\r\n \r\n \r\n \r\n )\r\n })\r\n )\r\n }\r\n\r\n \r\n\r\n \r\n\r\n \r\n );\r\n\r\n\r\n\r\n};\r\n\r\nexport default React.forwardRef(PersonalReport);","import React, { useState, useEffect, useRef, useCallback, forwardRef } from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { useSearchParams, useNavigate } from \"react-router-dom\";\r\nimport { Box, Grid, Paper, Skeleton } from '@mui/material'\r\nimport _ from \"lodash\"\r\nimport { getViewInstance } from \"../actions/viewinstance\";\r\nimport Header from \"./layouts/Header\";\r\nimport Loading from \"./Loading\";\r\nimport DynamicComponent from \"./partials/DynamicComponent\";\r\nimport ReactToPrint, { useReactToPrint } from \"react-to-print\";\r\n\r\nimport ResponsiveRectangle from \"./partials/skeletons/ResponsiveRectangle\";\r\nimport Footer from \"./layouts/Footer\";\r\n\r\nimport { fetchViewInstances, selectViewInstanceById } from \"../reducers/reuseable_vi\";\r\n\r\n \r\n\r\nconst PhysicianSummary = (props) => {\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const [loading, setLoading] = useState(false);\r\n const [callVI, setCallVI] = useState(false)\r\n useEffect(() => {\r\n if (window !== undefined) {\r\n window.scrollTo(0, 0)\r\n }\r\n }, [])\r\n const [searchParams] = useSearchParams();\r\n //const { viewInstance, settings } = useSelector(state => state.viewinstance)\r\n const viewInstance = useSelector(state => selectViewInstanceById(state,'PhysicianSummary'))\r\n const settings = viewInstance?.settings || {}\r\n const dispatch = useDispatch();\r\n const navigate = useNavigate();\r\n\r\n const [PrintView, setPrintView] = useState(false);\r\n const componentRef = useRef(null);\r\n const onBeforeGetContentResolve = React.useRef(null);\r\n const reactToPrintContent = React.useCallback(() => {\r\n return componentRef.current;\r\n }, [componentRef.current]);\r\n\r\n useEffect(() => { }, [PrintView])\r\n useEffect(() => {\r\n const startConversion = () => {\r\n if (window.hiqPdfConverter) {\r\n window.hiqPdfConverter.startConversion();\r\n }\r\n };\r\n \r\n // Ensure hiqPdfConverter is available and the component is ready\r\n if (typeof window.hiqPdfConverter !== 'undefined' && !loading) {\r\n startConversion();\r\n } else {\r\n // Add an event listener for when hiqPdfConverter becomes available\r\n window.addEventListener('hiqPdfConverterReady', startConversion);\r\n \r\n // Clean up the event listener when the component unmounts\r\n return () => {\r\n window.removeEventListener('hiqPdfConverterReady', startConversion);\r\n };\r\n }\r\n }, [loading]);\r\n const handleAfterPrint = React.useCallback(() => {\r\n setPrintView(false);\r\n\r\n }, []);\r\n\r\n const handleBeforePrint = React.useCallback(() => {\r\n }, []);\r\n\r\n const handleOnBeforeGetContent = React.useCallback(() => {\r\n setPrintView(true);\r\n return new Promise((resolve) => {\r\n onBeforeGetContentResolve.current = resolve;\r\n setTimeout(() => {\r\n setPrintView(true);\r\n resolve();\r\n }, 1000);\r\n });\r\n }, [setLoading, setPrintView]);\r\n\r\n const handleActualPrint = () => {\r\n //setPrintView(true)\r\n //handlePrint()\r\n window.print()\r\n }\r\n\r\n window.onbeforeprint = () => handleActualPrint()\r\n\r\n const handlePrint = useReactToPrint({ \r\n content: reactToPrintContent,\r\n documentTitle: \"Physicians Summary Report\",\r\n onBeforeGetContent: handleOnBeforeGetContent,\r\n onBeforePrint: handleBeforePrint,\r\n onAfterPrint: handleAfterPrint,\r\n removeAfterPrint: true\r\n });\r\n\r\n\r\n useEffect(() => {\r\n //IF EMPTY VI OR NOT THE DESIRED VI AND THE VI HAS NOT BEEN CALLED YET\r\n setLoading(true)\r\n if ((!viewInstance || !viewInstance.ReportPersonalPage) && !callVI) {\r\n //SO IT'S NOT CALLED MULTIPLE TIMES\r\n setCallVI(true)\r\n //CALL THE ACTION THAT FETCHES THE SERVICE AND UPDATES THE STATE\r\n dispatch(fetchViewInstances({authToken: currentUser.AuthToken, VIGuid:searchParams.get(\"vi\"), VIName:\"PhysicianSummary\"}))\r\n //dispatch(getViewInstance(searchParams.get(\"vi\"), currentUser.AuthToken))\r\n setLoading(false)\r\n }\r\n //WINDOW.LOCATION PROVIDES EXTRA CONTEXT SO WHEN TEH URL UPDATES THE APP UPDATES\r\n }, [window.location.pathname])\r\n\r\n /**\r\n * View instance return\r\n * ReportViewInstance:{\r\n * ReportPage:[\r\n * ReportFrame:[\r\n * {\"Visible\":\"1/0\",\"Order\":\"\",\"ComponentType\":\"\"}\r\n * , {\"Visible\":\"1/0\",\"Order\":\"\",\"ComponentType\":\"\"}\r\n * , {\"Visible\":\"1/0\",\"Order\":\"\",\"ComponentType\":\"\"}\r\n * , {\"Visible\":\"1/0\",\"Order\":\"\",\"ComponentType\":\"\"} \r\n * ]\r\n * ]\r\n * }\r\n */\r\n\r\n const OrderedSections =\r\n viewInstance\r\n && viewInstance.ReportViewInstance\r\n && viewInstance.ReportViewInstance.ReportPage\r\n && viewInstance.ReportViewInstance.ReportPage[0].ReportFrame\r\n && [...viewInstance.ReportViewInstance.ReportPage[0].ReportFrame].sort(function (a, b) { return parseInt(a.Order) - parseInt(b.Order) })\r\n\r\n\r\n\r\n return (\r\n \r\n\r\n { handleActualPrint() }} />\r\n \r\n\r\n {/** The idea is simple, we will send each array to a single component that will dictate its format */}\r\n {/** Each array will have a ComponentType attribute. [{ComponentType},{ComponentType},{ComponentType}] */}\r\n {/** This component type will load a specific component*/}\r\n\r\n { viewInstance && viewInstance.status==='success' && viewInstance.ReportViewInstance\r\n && OrderedSections ? (\r\n\r\n OrderedSections.map((reportComponent, index) => {\r\n return (\r\n\r\n \r\n \r\n \r\n \r\n )\r\n })\r\n\r\n )\r\n }\r\n\r\n\r\n\r\n \r\n \r\n\r\n \r\n );\r\n\r\n\r\n\r\n};\r\n\r\nexport default React.forwardRef(PhysicianSummary);","import React, { useState, useEffect } from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { useSearchParams, useNavigate } from \"react-router-dom\";\r\nimport { Grid } from '@mui/material'\r\nimport _ from \"lodash\"\r\nimport { getViewInstance } from \"../actions/viewinstance\";\r\nimport Header from \"./layouts/Header\";\r\nimport Loading from \"./Loading\";\r\nimport DynamicComponent from \"./partials/DynamicComponent\";\r\nimport '../styles/report.css'\r\n\r\n\r\n\r\nconst AdminReport = (props) => {\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const [loading, setLoading] = useState(false);\r\n const [callVI, setCallVI] = useState(false)\r\n\r\n const [searchParams] = useSearchParams();\r\n const { viewInstance, settings } = useSelector(state => state.viewinstance)\r\n\r\n const dispatch = useDispatch();\r\n const navigate = useNavigate();\r\n\r\n\r\n useEffect(() => {\r\n //IF EMPTY VI OR NOT THE DESIRED VI AND THE VI HAS NOT BEEN CALLED YET\r\n if ((!viewInstance || !viewInstance.ReportViewInstance) && !callVI) {\r\n //SO IT'S NOT CALLED MULTIPLE TIMES\r\n setCallVI(true)\r\n //CALL THE ACTION THAT FETCHES THE SERVICE AND UPDATES THE STATE\r\n dispatch(getViewInstance(searchParams.get(\"vi\"), currentUser.AuthToken))\r\n }\r\n //WINDOW.LOCATION PROVIDES EXTRA CONTEXT SO WHEN TEH URL UPDATES THE APP UPDATES\r\n }, [window.location.pathname])\r\n\r\n/**\r\n * View instance return\r\n * ReportViewInstance:{\r\n * ReportPage:[\r\n * ReportFrame:[\r\n * {\"Visible\":\"1/0\",\"Order\":\"\",\"ComponentType\":\"\"}\r\n * , {\"Visible\":\"1/0\",\"Order\":\"\",\"ComponentType\":\"\"}\r\n * , {\"Visible\":\"1/0\",\"Order\":\"\",\"ComponentType\":\"\"}\r\n * , {\"Visible\":\"1/0\",\"Order\":\"\",\"ComponentType\":\"\"}\r\n * ]\r\n * ]\r\n * }\r\n */\r\n if (viewInstance && viewInstance.ReportViewInstance) {\r\n \r\n const OrderedSections = viewInstance.ReportViewInstance.ReportPage[0].ReportFrame.sort(function (a,b){return parseInt(a.Order) - parseInt(b.Order)})\r\n\r\n \r\n return (\r\n \r\n\r\n \r\n\r\n {/** The idea is simple, we will send each array to a single component that will dictate its format */}\r\n {/** Each array will have a ComponentType attribute. [{ComponentType},{ComponentType},{ComponentType}] */}\r\n {/** This component type will load a specific component*/}\r\n\r\n {\r\n OrderedSections.map((reportComponent, index) => {\r\n return (\r\n\r\n \r\n
\r\n );\r\n } else {\r\n return \r\n
\r\n }\r\n\r\n\r\n};\r\n\r\nexport default AdminReport;","import React, { Component } from 'react'\r\nimport Button from '@mui/material/Button'\r\nimport {TextField} from '@mui/material'\r\nimport NavigateNext from '@mui/icons-material/NavigateNext'\r\n\r\n\r\n\r\nconst styles = theme => ({\r\n root: {\r\n textAlign:'center',\r\n padding: '15px'\r\n },\r\n textfield: {\r\n maxWidth:'100px',\r\n [theme.breakpoints.down('xs')]: {\r\n margin:'8px'\r\n }\r\n },\r\n button: {\r\n height:'56px',\r\n [theme.breakpoints.down('xs')]: {\r\n width:'100px',\r\n marginTop:'8px'\r\n }\r\n }\r\n})\r\n\r\nclass InputAnswer extends Component{\r\n constructor(props){\r\n super(props)\r\n this.state = {\r\n invalidAnswer: true, //on ComponenetDidMount, put logic in to update htis based on response\r\n answer: \"\",\r\n valMin: \"\",\r\n valMax: \"\",\r\n valPrecision: \"\",\r\n errorMessage: \"\",\r\n inputError: false,\r\n saving: false\r\n }\r\n }\r\n\r\n \r\n componentDidMount() {\r\n this.setState({\r\n answer: this.props.question.Responses[0].Response,\r\n invalidAnswer: true,\r\n valMin: this.props.question.ValueLimitationMin,\r\n valMax: this.props.question.ValueLimitationMax,\r\n valPrecision: this.props.question.ValueLimitationPrecision\r\n })\r\n }\r\n\r\n componentDidUpdate(prevProps){\r\n\r\n if(prevProps.question.QuestionId !== this.props.question.QuestionId){\r\n this.setState({\r\n answer: this.props.question.Responses[0].Response,\r\n invalidAnswer: this.props.question.Responses[0].Response.length ? false : true,\r\n saving: false\r\n\r\n })\r\n //console.log(this.state)\r\n }\r\n }\r\n\r\n handleEnter = (event) => {\r\n if(event.key == \"Enter\" && !this.state.invalidAnswer){\r\n this.props.updateResponseValue(this.state.answer)\r\n }\r\n }\r\n\r\n onChange = (ev) =>{\r\n let value = ev.target.value\r\n let message = this.state.errorMessage\r\n let validation = this.props.validation\r\n //validation goes here\r\n //...\r\n //...\r\n\r\n //check for numeric\r\n if(isNaN(value)){\r\n message = validation.NotANumber\r\n }\r\n\r\n //check for range\r\n else if(this.state.valMin.length && this.state.valMax.length && (Number(value) < Number(this.state.valMin) || Number(value) > Number(this.state.valMax))){\r\n message = validation.OutOfRange.replace('', this.state.valMin).replace('', this.state.valMax)\r\n }\r\n\r\n //check for precision\r\n else if(Math.floor(value) != value){\r\n if(this.state.valPrecision == \"0\" || this.state.valPrecision == \"\"){\r\n message = validation.WholeNumbers\r\n } else {\r\n message = value.split('.')[1].length > this.state.valPrecision ? validation.InvalidPrecision : \"\" \r\n }\r\n } \r\n\r\n else {\r\n message = ''\r\n }\r\n\r\n this.setState({\r\n errorMessage: message,\r\n inputError: message.length ? true : false,\r\n answer: value\r\n })\r\n\r\n //then update state\r\n if (value && !message.length){\r\n this.setState({\r\n invalidAnswer: false,\r\n answer: value\r\n })\r\n } else {\r\n this.setState({\r\n invalidAnswer: true\r\n })\r\n }\r\n //console.log(\"value: \" + value + \" and message: \" + message)\r\n }\r\n\r\n onBlur = (ev) => {\r\n //console.log(ev)\r\n setTimeout((ev) => {\r\n if(!this.state.invalidAnswer && !this.props.helpOpen){\r\n \r\n this.setState({saving: true})\r\n this.props.updateResponseValue(this.state.answer)\r\n }\r\n }, 100)\r\n }\r\n\r\n handleClick = (ev) => {\r\n if(!this.state.invalidAnswer && !this.state.saving){\r\n this.props.updateResponseValue(this.state.answer)\r\n }\r\n }\r\n\r\n render(){\r\n const {classes} = this.props\r\n let prompt = this.props.question.QuestionPrompt.length ? this.props.question.QuestionPrompt : \"input\"\r\n return(\r\n \r\n \r\n \r\n \r\n
\r\n )\r\n }\r\n}\r\n\r\nexport default InputAnswer","import React, { Component } from 'react'\r\nimport FormControlLabel from '@mui/material/FormControlLabel'\r\nimport Radio from '@mui/material/Radio'\r\n\r\nclass Toggle extends Component{\r\n constructor(props){\r\n super(props)\r\n }\r\n render(){\r\n if(this.props){\r\n let answer = this.props.answer;\r\n return(\r\n //Answer \r\n nope
\r\n \r\n }\r\n}\r\n\r\nexport default Toggle;\r\n\r\n/**\r\n * import React, { Component } from 'react'\r\nimport FormControlLabel from '@material-ui/core/FormControlLabel'\r\nimport Radio from '@material-ui/core/Radio'\r\n\r\nconst Toggle = (props) => {\r\n if(props){\r\n let answer = this.props.answer;\r\n return(\r\n //Answer \r\n nope
\r\n}\r\n\r\nexport default Toggle;\r\n */","\r\nimport React, { Component } from 'react';\r\nimport { FormControl, Select, MenuItem, InputLabel} from '@mui/material'\r\n\r\n\r\n\r\nclass Height extends Component{\r\n constructor(props){\r\n super(props)\r\n this.state = {\r\n invalidAnswer: true, //on ComponenetDidMount, put logic in to update htis based on response\r\n answer: \"\",\r\n answerInches: -1,\r\n answerFeet: -1,\r\n valMin: \"\",\r\n valMax: \"\",\r\n valPrecision: \"\",\r\n errorMessage: \"\",\r\n inputError: false,\r\n Inches: [0,1,2,3,4,5,6,7,8,9,10,11],\r\n Feet: [0,1,2,3,4,5,6,7,8,9]\r\n }\r\n }\r\n\r\n \r\n componentDidMount() {\r\n //gotta convert to int for all the math stuff\r\n //important for comparisons ( >0 vs .length)\r\n var answer = parseInt(this.props.question.Responses[0].Response)\r\n this.createFeetArray()\r\n this.setState({\r\n answer: answer,\r\n invalidAnswer: true,\r\n valMin: this.props.question.ValueLimitationMin,\r\n valMax: this.props.question.ValueLimitationMax,\r\n valPrecision: this.props.question.ValueLimitationPrecision,\r\n errorMessage:\"\" \r\n })\r\n if(this.props.question.Responses[0].Response > 0 ){\r\n this.setInchesAndFeet(this.props.question.Responses[0].Response)\r\n }\r\n }\r\n\r\n createFeetArray(){\r\n let max = Math.floor(this.props.question.ValueLimitationMax/12)\r\n let min = Math.floor(this.props.question.ValueLimitationMin/12)\r\n\r\n let feet = []\r\n\r\n for(var x=min; x {\r\n this.setState({\r\n answerInches: ev.target.value\r\n }, () => {\r\n if(this.state.answerFeet >= 0 && this.state.answerInches >= 0){\r\n this.setSavableAnswer()\r\n }\r\n })\r\n }\r\n\r\n setFeet = ev => {\r\n this.setState({\r\n answerFeet: ev.target.value\r\n }, () => {\r\n if(this.state.answerFeet >= 0 && this.state.answerInches >= 0){\r\n this.setSavableAnswer()\r\n }\r\n } \r\n )\r\n }\r\n\r\n setSavableAnswer(){\r\n var inches = this.state.answerInches + this.state.answerFeet*12\r\n if(inches > this.state.valMax || inches 0){\r\n var inchString = inches.toString()\r\n this.props.updateResponseValue(inchString)\r\n }\r\n }\r\n }\r\n\r\n render(){\r\n if(this.props){\r\n let answer = this.props.question.Responses[0].Response;\r\n \r\n return(\r\n //Answer \r\n \r\n
\r\n {this.props.prompts.HeightPrimary} \r\n \r\n {this.state.Feet.map((item) => {item} )}\r\n \r\n \r\n
\r\n {this.props.prompts.HeightSecondary} \r\n \r\n {this.state.Inches.map((item) => {item} )}\r\n \r\n \r\n
{this.state.errorMessage}
\r\n
\",this.props.question.ValueLimitationMin)\r\n })\r\n } \r\n //if adult age range\r\n else if(age > this.props.question.ValueLimitationMax){\r\n this.setState({\r\n errorMessage: this.props.validation.InvalidAgeTooOld.replace(\"\",this.props.question.ValueLimitationMax)\r\n })\r\n }\r\n \r\n else {\r\n this.props.updateResponseValue(fullDate)\r\n }\r\n //console.log(fullDate)\r\n\r\n }\r\n\r\n \r\n\r\n render(){\r\n if(this.props){\r\n let answer = this.props.question.Responses[0].Response;\r\n \r\n return(\r\n //Answer \r\n \r\n
\r\n {this.props.prompts.Month} \r\n \r\n {months.map(month => {month.name} )}\r\n \r\n \r\n
\r\n {this.props.prompts.Day} \r\n \r\n {this.state.daySelect}\r\n \r\n \r\n
\r\n {this.props.prompts.Year} \r\n \r\n {this.state.yearSelect}\r\n \r\n \r\n
{this.state.errorMessage}
\r\n
{start} )\r\n start++\r\n }\r\n } else{\r\n while (start >= end){\r\n options.push({start} )\r\n start--\r\n }\r\n }\r\n return options\r\n}\r\n\r\n\r\n\r\nexport default DateOfBirth;","import React, { Component } from 'react'\r\nimport InputLabel from \"@mui/material/InputLabel\";\r\nimport MenuItem from \"@mui/material/MenuItem\";\r\nimport FormControl from \"@mui/material/FormControl\";\r\nimport Select from \"@mui/material/Select\";\r\n\r\nclass DropdownIncremental extends Component{\r\n constructor(props){\r\n super(props)\r\n this.state = {\r\n answer: \"\"\r\n }\r\n }\r\n\r\n componentDidMount(){\r\n if(this.props.question.Responses[0].Response.length){\r\n this.setState({\r\n answer: this.props.questions.Responses[0].Response\r\n })\r\n }\r\n }\r\n\r\n changeAnswer = (ev) => {\r\n \r\n this.setState({\r\n answer: ev.target.value\r\n })\r\n this.props.updateResponseValue(ev.target.value)\r\n }\r\n render(){\r\n if(this.props){\r\n let answer = this.props.question.Responses[0].Response;\r\n \r\n\r\n var answers = []\r\n var value;\r\n value = parseInt(this.props.question.ValueLimitationMin)\r\n while(value <= parseInt(this.props.question.ValueLimitationMax)){\r\n answers.push({value} )\r\n value += parseInt(this.props.question.ValueLimitationIncrement)\r\n }\r\n return(\r\n //Answer \r\n\r\n \r\n \r\n {answers}\r\n \r\n \r\n )\r\n } else return nope
\r\n \r\n }\r\n}\r\n\r\nexport default DropdownIncremental;","import React, { Component } from 'react'\r\nimport Button from '@mui/material/Button'\r\nimport NavigateNext from '@mui/icons-material/NavigateNext'\r\n\r\nclass NextButton extends Component {\r\n constructor(props){\r\n super(props)\r\n }\r\n render() {\r\n return {this.props.saveRemaining()}}>\r\n Next \r\n }\r\n}\r\n\r\nexport default NextButton","import React, { Component } from 'react'\r\nimport RenderInBrowser from 'react-render-in-browser';\r\nimport Slide from '@mui/material/Slide'\r\nimport Question from './Question.js'\r\nimport { Button, Card, Grid, Typography, Box, CircularProgress } from '@mui/material';\r\nimport Clustered from './Clustered.js'\r\nimport NavigateNextIcon from '@mui/icons-material/NavigateNext';\r\nimport NavigateBeforeIcon from '@mui/icons-material/NavigateBefore';\r\nimport \"react-sweet-progress/lib/style.css\";\r\n\r\nconst styles = theme => ({\r\n root: {\r\n textAlign:'center'\r\n },\r\n label: {\r\n display:'table-cell',\r\n verticalAlign: 'middle',\r\n position:\"absolute\"\r\n },\r\n ielabel: {\r\n display:'table-cell',\r\n verticalAlign: 'middle'\r\n },\r\n button: {\r\n display:'table',\r\n minHeight:'345px',\r\n width:'100%'\r\n },\r\n buttonPrevious: {\r\n [theme.breakpoints.down('xs')]: {\r\n position: \"absolute\",\r\n left: '0px',\r\n }\r\n },\r\n buttonNext: {\r\n [theme.breakpoints.down('xs')]: {\r\n position: \"absolute\",\r\n right: '-20px',\r\n }\r\n }\r\n})\r\n\r\nfunction iOS() {\r\n return [\r\n 'iPad Simulator',\r\n 'iPhone Simulator',\r\n 'iPod Simulator',\r\n 'iPad',\r\n 'iPhone',\r\n 'iPod'\r\n ].includes(navigator.platform)\r\n // iPad on iOS 13 detection\r\n || (navigator.userAgent.includes(\"Mac\") && \"ontouchend\" in document)\r\n }\r\n\r\nclass Quiz extends Component {\r\n constructor(props){\r\n super(props);\r\n this.state = {\r\n CurrentQuestion: [],\r\n Questions: [],\r\n CurrentQuestionsIndex: 0,\r\n PreviousQuestionIndex: -1,\r\n QuestionCount: 0,\r\n CurrentQuestionNotAnswered: true,\r\n direction: 'left',\r\n QuestionsAnswered: 0,\r\n CurrentRequiredQuestion: 0,\r\n FirstQuestionIndex:0,\r\n AllVisibleQuestionsAnswered: false,\r\n Saving: false,\r\n NextQuestionIndex: -1,\r\n CompletingHRA: {\r\n IsCompleting: false, \r\n Error: '',\r\n ErrorMessage: '',\r\n ErrorBody: []\r\n\r\n }\r\n }\r\n\r\n }\r\n\r\n componentDidUpdate(){\r\n if(this.state.Questions.length==0 && this.state.CurrentQuestion.length==0){\r\n let questions = this.props.questions.SurveyData[0]\r\n //let questions = testQuiz.SurveyData[0];\r\n let questioncount = 0\r\n let visiblequestioncount = 0\r\n let lastquestionindex = 0\r\n let firstquestion = -1\r\n let firstquestioninassessment = -1\r\n let hasVisibleQuestionSetQuestions = false\r\n \r\n //find the last visible question in the array and count the amount of total visible questions\r\n //for question sets, find any visible questions, and any unanswered questions in the set\r\n while(questioncount < questions.QuestionSetQuestionSet.length){\r\n if(questions.QuestionSetQuestionSet[questioncount].QuestionSetQuestions.length > 1){\r\n hasVisibleQuestionSetQuestions = false\r\n for(let x=0; x< questions.QuestionSetQuestionSet[questioncount].QuestionSetQuestions.length; x++){\r\n if(questions.QuestionSetQuestionSet[questioncount].QuestionSetQuestions[x].QuestionDisplayedFlag==\"1\"){\r\n hasVisibleQuestionSetQuestions = true\r\n if(firstquestion<0 && !questions.QuestionSetQuestionSet[questioncount].QuestionSetQuestions[x].Responses[0].Response.length){\r\n firstquestion = questioncount\r\n }\r\n }\r\n }\r\n if(hasVisibleQuestionSetQuestions) {\r\n visiblequestioncount++;\r\n lastquestionindex = questioncount}\r\n\r\n } else {\r\n if (questions.QuestionSetQuestionSet[questioncount].QuestionSetQuestions[0].QuestionDisplayedFlag==\"1\"){\r\n visiblequestioncount++\r\n lastquestionindex = questioncount\r\n if(firstquestioninassessment < 0){\r\n firstquestioninassessment = questioncount\r\n }\r\n if(firstquestion<0 \r\n && !questions.QuestionSetQuestionSet[questioncount].QuestionSetQuestions[0].Responses[0].Response.length)\r\n {firstquestion = questioncount}\r\n }\r\n }\r\n questioncount++\r\n }\r\n //if everything is answered, go to the end? \r\n if(firstquestion < 0){\r\n firstquestion = firstquestion <= -1 ? lastquestionindex : firstquestion\r\n this.props.setCurrentIndex(questions.QuestionSetQuestionSet.length)\r\n } else {\r\n\r\n this.props.setCurrentIndex(firstquestion)\r\n }\r\n\r\n if(this.props.startfromBeginning){\r\n this.setState({\r\n Questions: questions.QuestionSetQuestionSet,\r\n CurrentQuestion: questions.QuestionSetQuestionSet[firstquestion],\r\n QuestionCount: questions.QuestionSetQuestionSet.length,\r\n CurrentRequiredQuestion: firstquestion,\r\n CurrentQuestionsIndex: firstquestion,\r\n FirstQuestionIndex: firstquestioninassessment\r\n })\r\n this.props.updateQuestionTotal(visiblequestioncount)\r\n } else {\r\n\r\n this.setState({\r\n Questions: questions.QuestionSetQuestionSet,\r\n CurrentQuestion: questions.QuestionSetQuestionSet[lastquestionindex],\r\n QuestionCount: visiblequestioncount,\r\n CurrentRequiredQuestion: visiblequestioncount-1,\r\n CurrentQuestionsIndex: lastquestionindex,\r\n QuestionsAnswered: visiblequestioncount\r\n })\r\n }}\r\n //console.log(\"quiz state\", this.state)\r\n \r\n }\r\n\r\n findNextQuestionIndex = () => {\r\n var notFound = true\r\n var index = this.state.CurrentQuestionsIndex\r\n while(notFound && index < this.state.Questions.length-1){\r\n //let index = this.state.CurrentQuestionsIndex == this.state.Questions.length-1 ? this.state.CurrentQuestionsIndex : this.state.CurrentQuestionsIndex+1;\r\n if(this.state.Questions[index+1] && this.state.Questions[index+1].QuestionSetQuestions.length > 1){\r\n //if group, find ANY displayed questions \r\n //console.log('group question')\r\n for(let x=0; x {\r\n let indexOfNextQuestion = this.findNextQuestionIndex();\r\n if(indexOfNextQuestion === -1){\r\n //found the end of the assessment\r\n this.completeAssessment();\r\n } else {\r\n this.props.setCurrentIndex(indexOfNextQuestion)\r\n this.setState({\r\n direction: 'left',\r\n CurrentQuestion: this.state.Questions[indexOfNextQuestion],\r\n PreviousQuestionIndex: this.state.CurrentQuestionsIndex,\r\n CurrentQuestionsIndex: indexOfNextQuestion,\r\n CurrentQuestionNotAnswered: true,\r\n CurrentRequiredQuestion: this.state.CurrentRequiredQuestion+1\r\n })\r\n }\r\n \r\n \r\n }\r\n\r\n previousQuestion = () => {\r\n var notFound = true\r\n var index = this.state.CurrentQuestionsIndex\r\n while(notFound){\r\n //let index = this.state.CurrentQuestionsIndex == this.state.Questions.length-1 ? this.state.CurrentQuestionsIndex : this.state.CurrentQuestionsIndex+1;\r\n if(this.state.Questions[index-1].QuestionSetQuestions[0].QuestionDisplayedFlag == 1){\r\n index--;\r\n notFound = false\r\n } else{\r\n index--\r\n }\r\n }\r\n this.setState({\r\n direction: 'right',\r\n CurrentQuestion: this.state.Questions[index],\r\n PreviousQuestionIndex: this.state.CurrentQuestionsIndex,\r\n CurrentQuestionsIndex: index,\r\n CurrentQuestionNotAnswered: true,\r\n CurrentRequiredQuestion: this.state.CurrentRequiredQuestion-1\r\n })\r\n }\r\n\r\n \r\n\r\n updateResponseValue = (value) => {\r\n if(!this.state.Saving){\r\n this.setState({Saving: true})\r\n fetch('../../WsWebServiceHra/SaveAnswer/' + \r\n this.props.authtoken + '/' +\r\n this.props.responseguid + '/' +\r\n this.state.CurrentQuestion.QuestionSetQuestions[0].QuestionId + '/' +\r\n value.toString() + '/',\r\n {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n }) \r\n .then(response=>response.json())\r\n .then(response => {\r\n if(response.Success){\r\n //some branching logic BS goes in here too, I guess, eventually\r\n //please don't make me do it\r\n //please\r\n //OH WE DOIN IT BOYS\r\n let questions = this.state.Questions;\r\n if(response.Info[0] && response.Info[0].Changes){\r\n let change\r\n for(var x=0; x {\r\n this.moveToNext()\r\n this.setState({\r\n Saving:false\r\n })\r\n })\r\n \r\n }\r\n \r\n })\r\n }\r\n \r\n }\r\n\r\n questionSetUpdateResponseValue = (questionID, value) => {\r\n //since saving has to be done at a higher level for QSs, \r\n //this version of UpdateResponseValue does all the other stuff.\r\n //This is called once the QS is marked as complete\r\n //QS is marked as complete when\r\n\r\n //def: value - the answer being saved\r\n //def: questionID - the index of the question in the questionSet\r\n \r\n fetch('../../WsWebServiceHra/SaveAnswer/' + \r\n this.props.authtoken + '/' +\r\n this.props.responseguid + '/' +\r\n questionID + '/' +\r\n value.toString() + '/',\r\n {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n .then(response=>response.json())\r\n .then(response => {\r\n if(response.Success){\r\n //some branching logic BS goes in here too, I guess, eventually\r\n //please don't make me do it\r\n //please\r\n //OH WE DOIN IT BOYS\r\n let questions = this.state.Questions;\r\n if(response.Info[0] && response.Info[0].Changes){\r\n let change\r\n for(var x=0; x question done\r\n //Required questions answered\r\n var prevAnswer;\r\n\r\n var requiredQuestions = 0;\r\n var answeredQuestions = 0;\r\n var thisquestion;\r\n\r\n for(var x=0; x {\r\n //if(thisquestion.QuestionTypeKeyName != \"SLIDER\"){\r\n this.moveToNext();\r\n // }\r\n })\r\n }\r\n \r\n }\r\n \r\n }\r\n \r\n })\r\n \r\n \r\n \r\n\r\n }\r\n\r\n branchingLogic = (questions, change) => {\r\n for(var y=this.state.CurrentQuestionsIndex; y {\r\n \r\n }\r\n\r\n moveToNext = () => {\r\n \r\n if(this.state.QuestionsAnswered==this.state.QuestionCount){\r\n this.completeAssessment()\r\n } else {\r\n setTimeout(() => {\r\n this.nextQuestion()\r\n }, 200)\r\n \r\n }\r\n }\r\n\r\n findMissingQuestion = () => {\r\n\r\n }\r\n\r\n completeAssessment = () => {\r\n //complete the mini assessment\r\n this.props.setCurrentIndex(this.state.Questions.length)\r\n this.setState(prevState => ({\r\n CompletingHRA: {\r\n ...prevState.CompletingHRA, IsCompleting: true\r\n }\r\n }))\r\n fetch('../../WsWebServiceHra/CompleteAssessment/' + this.props.authtoken + '/' + this.props.responseguid + '/', \r\n {\r\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n\r\n }\r\n })\r\n .then(response=>response.json())\r\n .then(response=>{\r\n if(response.Success && !response.Info.length){\r\n //this.props.completeSuccessful(true)\r\n //console.log(this.state.CompletingHRA)\r\n } else {\r\n //console.log('hra not completed', response)\r\n if(response.Info.length){\r\n\r\n }\r\n this.setState(prevState => ({\r\n CompletingHRA: {\r\n ...prevState.CompletingHRA, IsCompleting: true\r\n }\r\n }))\r\n }\r\n })\r\n }\r\n\r\n wrappernextQuestion = () => {\r\n if (this.state.CurrentQuestionsIndex == this.state.Questions.length-1){\r\n this.completeAssessment()\r\n } else {\r\n if(!this.state.Saving){\r\n this.setState({\r\n direction: 'right',\r\n CurrentQuestionNotAnswered: false\r\n })\r\n setTimeout(() => {\r\n this.nextQuestion()\r\n }, 200)\r\n }\r\n }\r\n \r\n }\r\n\r\n wrappernextQuestionForGroup = () => {\r\n if (this.state.CurrentQuestionsIndex == this.state.Questions.length-1){\r\n this.completeAssessment()\r\n } else {\r\n this.setState({\r\n direction: 'right',\r\n CurrentQuestionNotAnswered: false\r\n })\r\n setTimeout(() => {\r\n this.nextQuestion()\r\n }, 200)\r\n }\r\n \r\n }\r\n\r\n wrapperpreviousQuestion = () => {\r\n this.setState({\r\n direction: 'left',\r\n CurrentQuestionNotAnswered: false\r\n })\r\n setTimeout(() => {\r\n this.previousQuestion()\r\n }, 200)\r\n }\r\n\r\n async saveRemaining(){\r\n var currentQuestion\r\n if(this.state.Questions[this.state.CurrentQuestionsIndex].QuestionSetQuestions[0].QuestionTypeKeyName == \"CHECKBOX\"){\r\n var no = this.state.Questions[this.state.CurrentQuestionsIndex].QuestionSetQuestions[0].Answers[0].AnswerName == \"No\" ? this.state.Questions[this.state.CurrentQuestionsIndex].QuestionSetQuestions[0].Answers[0].AnswerId : this.state.Questions[this.state.CurrentQuestionsIndex].QuestionSetQuestions[0].Answers[1].AnswerId\r\n for(var x=0; x {\r\n\r\n if(numberSaved != 0){\r\n \r\n } else {\r\n \r\n }\r\n \r\n \r\n //}, numberSaved)\r\n }\r\n \r\n }\r\n\r\n//Question {this.state.CurrentRequiredQuestion+1} out of {this.state.QuestionCount} \r\n\r\n render() {\r\n //\r\n // \r\n const {classes} = this.props\r\n\r\n //Single question vs question set stuffffffff\r\n var question;\r\n if (this.state.Questions[this.state.CurrentQuestionsIndex] && this.state.Questions[this.state.CurrentQuestionsIndex].QuestionSetTypeKeyName == \"STANDARD\"){\r\n question = \r\n Calculating your score... \r\n This may take several seconds \r\n \r\n\r\n\r\n }\r\n \r\n //if (this.state.Questions[this.state.CurrentQuestionsIndex].QuestionSetTypeKeyName == \"BIOMETRIC\"){\r\n // question = = required ? 1 : -1;\r\n }\r\n return (\r\n //map each question\r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n {question}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n Complete Assessment \r\n \r\n \r\n \r\n )\r\n } else {\r\n return(\r\n EmptyCard \r\n )\r\n }\r\n }\r\n}\r\n\r\nfunction checkiPhone(){\r\n return true\r\n}\r\n\r\nexport default Quiz;","import React, {useState, useEffect} from \"react\";\r\nimport { useNavigate, useSearchParams, createSearchParams, useLocation } from 'react-router-dom';\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport Quiz from './partials/Quiz';\r\nimport Header from \"./layouts/Header\";\r\nimport Loading from \"./Loading\";\r\nimport { getViewInstance } from \"../actions/viewinstance\";\r\nimport Slide from '@mui/material/Slide'\r\nimport Grid from '@mui/material/Grid'\r\nimport { Progress } from 'react-sweet-progress';\r\n\r\n\r\n\r\n// This holds the page content for the assessments\r\n// In the future, this could be what we embed in other websites\r\n\r\n//let theme = null\r\n\r\nconst QuestionPrompts = {\r\n \"Month\": \"Month\",\r\n \"Day\": \"Day\",\r\n \"Year\": \"Year\",\r\n \"Dropdown\": \"Please Select\",\r\n \"HeightPrimary\": \"Feet\",\r\n \"HeightSecondary\": \"Inches\",\r\n \"MonthSQL\": [\r\n {\r\n \"MonthId\": \"5\",\r\n \"MonthName\": \"January\",\r\n \"MonthSequenceInYear\": \"1\",\r\n \"MonthAbbreviation\": \"Jan\",\r\n \"MonthSequenceInYearCode\": \"01\",\r\n \"StandardContent\": \"January\"\r\n },\r\n {\r\n \"MonthId\": \"6\",\r\n \"MonthName\": \"February\",\r\n \"MonthSequenceInYear\": \"2\",\r\n \"MonthAbbreviation\": \"Feb\",\r\n \"MonthSequenceInYearCode\": \"02\",\r\n \"StandardContent\": \"February\"\r\n },\r\n {\r\n \"MonthId\": \"7\",\r\n \"MonthName\": \"March\",\r\n \"MonthSequenceInYear\": \"3\",\r\n \"MonthAbbreviation\": \"Mar\",\r\n \"MonthSequenceInYearCode\": \"03\",\r\n \"StandardContent\": \"March\"\r\n },\r\n {\r\n \"MonthId\": \"8\",\r\n \"MonthName\": \"April\",\r\n \"MonthSequenceInYear\": \"4\",\r\n \"MonthAbbreviation\": \"Apr\",\r\n \"MonthSequenceInYearCode\": \"04\",\r\n \"StandardContent\": \"April\"\r\n },\r\n {\r\n \"MonthId\": \"9\",\r\n \"MonthName\": \"May\",\r\n \"MonthSequenceInYear\": \"5\",\r\n \"MonthAbbreviation\": \"May\",\r\n \"MonthSequenceInYearCode\": \"05\",\r\n \"StandardContent\": \"May\"\r\n },\r\n {\r\n \"MonthId\": \"10\",\r\n \"MonthName\": \"June\",\r\n \"MonthSequenceInYear\": \"6\",\r\n \"MonthAbbreviation\": \"Jun\",\r\n \"MonthSequenceInYearCode\": \"06\",\r\n \"StandardContent\": \"June\"\r\n },\r\n {\r\n \"MonthId\": \"11\",\r\n \"MonthName\": \"July\",\r\n \"MonthSequenceInYear\": \"7\",\r\n \"MonthAbbreviation\": \"Jul\",\r\n \"MonthSequenceInYearCode\": \"07\",\r\n \"StandardContent\": \"July\"\r\n },\r\n {\r\n \"MonthId\": \"12\",\r\n \"MonthName\": \"August\",\r\n \"MonthSequenceInYear\": \"8\",\r\n \"MonthAbbreviation\": \"Aug\",\r\n \"MonthSequenceInYearCode\": \"08\",\r\n \"StandardContent\": \"August\"\r\n },\r\n {\r\n \"MonthId\": \"13\",\r\n \"MonthName\": \"September\",\r\n \"MonthSequenceInYear\": \"9\",\r\n \"MonthAbbreviation\": \"Sep\",\r\n \"MonthSequenceInYearCode\": \"09\",\r\n \"StandardContent\": \"September\"\r\n },\r\n {\r\n \"MonthId\": \"14\",\r\n \"MonthName\": \"October\",\r\n \"MonthSequenceInYear\": \"10\",\r\n \"MonthAbbreviation\": \"Oct\",\r\n \"MonthSequenceInYearCode\": \"10\",\r\n \"StandardContent\": \"October\"\r\n },\r\n {\r\n \"MonthId\": \"15\",\r\n \"MonthName\": \"November\",\r\n \"MonthSequenceInYear\": \"11\",\r\n \"MonthAbbreviation\": \"Nov\",\r\n \"MonthSequenceInYearCode\": \"11\",\r\n \"StandardContent\": \"November\"\r\n },\r\n {\r\n \"MonthId\": \"16\",\r\n \"MonthName\": \"December\",\r\n \"MonthSequenceInYear\": \"12\",\r\n \"MonthAbbreviation\": \"Dec\",\r\n \"MonthSequenceInYearCode\": \"12\",\r\n \"StandardContent\": \"December\"\r\n }\r\n ]\r\n }\r\n\r\n const ValidationMessages = {\r\n HeightOutOfRange: \"Height out of Range\",\r\nInvalidAgeTooOld: \"This assessment was designed for those years of age or younger\",\r\nInvalidAgeTooYoung: \"This assessment was designed for those years of age or older\",\r\nInvalidDate: \"Invalid Date\",\r\nInvalidPrecision: \"Too many digits of precision\",\r\nNotANumber: \"Must be a number\",\r\nOutOfRange: \"Must be between and \",\r\nWholeNumbers: \"Only whole numbers\"\r\n}\r\n\r\nconst HRA = (props) => {\r\n\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const [loading, setLoading] = useState(false);\r\n const [callVI, setCallVI] = useState(false)\r\n const { viewInstance, settings } = useSelector(state => state.viewinstance)\r\n const [searchParams, setSearchParams] = useSearchParams();\r\n\r\n const dispatch = useDispatch();\r\n const navigate = useNavigate();\r\n const location = useLocation();\r\n\r\n const [quizState, setQuizState] = useState({\r\n Questions: [],\r\n Username: '',\r\n AuthToken: '',\r\n ParticipantGuid: '',\r\n ResponseGuid: '',\r\n QuizsDirection:'left',\r\n QuestionsAnswered: 0,\r\n QuestionTotal: 1,\r\n UnitOfMeasure:'IMPERIAL',\r\n LoadingError: false,\r\n ErrorViewInstance: [],\r\n isTimedOut: false,\r\n CurrentIndex: 0,\r\n StartingAssessment: false\r\n })\r\n\r\n /*this.timer = null;\r\n this.handleOnAction = this.handleOnAction.bind(this)\r\n this.handleOnActive = this.handleOnActive.bind(this)\r\n this.handleOnIdle = this.handleOnIdle.bind(this) */\r\n\r\n useEffect(() => {\r\n if(!callVI && (!viewInstance || !viewInstance.SurveyPage) && currentUser && currentUser.AuthToken){\r\n setCallVI(true);\r\n let vi = searchParams.get('vi')\r\n dispatch(getViewInstance('38E01F8C-5C38-423D-8573-23E1BEC87C88',currentUser.AuthToken))\r\n }\r\n }, [location.pathname])\r\n\r\n useEffect(() => {\r\n //IF EMPTY VI OR NOT THE DESIRED VI AND THE VI HAS NOT BEEN CALLED YET\r\n if((!quizState.Questions.length && !quizState.StartingAssessment && settings)){\r\n setQuizState({...quizState, StartingAssessment: true})\r\n getAssmtGuid()\r\n }\r\n //WINDOW.LOCATION PROVIDES EXTRA CONTEXT SO WHEN TEH URL UPDATES THE APP UPDATES\r\n }, [viewInstance, settings]) \r\n\r\n //useEffect(() => {\r\n // if(!quizState.ResponseGuid.length){\r\n // getAssmtGuid()\r\n // }\r\n // //this.setState({\r\n // // timeout: this.props.timeout\r\n // //})\r\n // //this.setClientColor(this.props.clientColor)\r\n //})\r\n\r\n //************************* */\r\n\r\n const getAssmtGuid = () => {\r\n let responseGuid = ''\r\n fetch('../../WsWebServicePlatform/Participant/Setting/Set/' + currentUser.AuthToken + '/' + settings.SessionVariableValues[\"PERSON GUID\"] +'/ASSMT%20PRODUCT%20GUID/59515E4C-FF98-4A98-BA32-B60BA8B6011F/', {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }})\r\n .then(response => response.json())\r\n .then(response => {\r\n if(response.Success){\r\n fetch('../../WsWebServicePlatform/Participant/SessionVar/Get/' + currentUser.AuthToken + '/RESPONSE%20GUID')\r\n .then(response=>response.json())\r\n .then(response=>{\r\n if(!response.Info.length){\r\n \r\n fetch('../../WsWebServiceHra/StartAssessment/' + currentUser.AuthToken + '/' + '59515E4C-FF98-4A98-BA32-B60BA8B6011F' + '/',\r\n {\r\n method:'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n\r\n }\r\n })\r\n .then(response => response.json())\r\n .then(response=>{\r\n getQuestions(response.Info[0].AssmtGuid)\r\n setQuizState({...quizState, \r\n ResponseGuid: response.Info[0].AssmtGuid,\r\n StartingAssessment: false\r\n })\r\n storeAssmtGuidToSession(response.Info[0].AssmtGuid)\r\n //setSearchParams('assmtGuid', response.Info[0].AssmtGuid)\r\n })\r\n }\r\n \r\n else {\r\n responseGuid = response.Info[0].Value\r\n getQuestions(responseGuid)\r\n setQuizState({...quizState, \r\n ResponseGuid: responseGuid, \r\n StartingAssessment: false})\r\n //storeAssmtGuidToSession(response.Info[0].Value)\r\n //setSearchParams('assmtGuid', response.Info[0].Value)\r\n //this is for test login and othe rpages that send assmtGuid through session\r\n }\r\n })\r\n }\r\n \r\n })\r\n }\r\n\r\n useEffect(() => {\r\n }, quizState.ResponseGuid) \r\n\r\n const storeAssmtGuidToSession = (assmtGuid) => {\r\n if(searchParams.get(\"asAuthToken\")){\r\n fetch(\"../../WsWebServicePlatform/Participant/SessionVar/Set/\" + assmtGuid + '/RESPONSE%20GUID/' + searchParams.get('asAuthToken'), {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n } else {\r\n fetch(\"../../WsWebServicePlatform/Participant/SessionVar/Set/\" + assmtGuid + '/RESPONSE%20GUID/' + currentUser.AuthToken, {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n }\r\n }\r\n\r\n const getQuestions = (responseGuid) => {\r\n fetch('../../WsWebServiceWellSuite/GetViewInstance/' + currentUser.AuthToken + '/8C292A8F-C14E-470B-A164-015F1CB2E2DD/',\r\n {\r\n method:'GET',\r\n headers:{\r\n 'Accept': 'application/json'\r\n }\r\n })\r\n .then(response=>response.json())\r\n .then(response=>{\r\n setQuizState({...quizState, \r\n Questions: response.Info[0].ViewInstanceData[0].SurveyPage,\r\n StartFromBeginning: true,\r\n ResponseGuid: responseGuid,\r\n UnitOfMeasure: response.Info[0].ViewInstanceData[1].SessionVariableValues[\"UNIT OF MEASURE\"]\r\n })\r\n })\r\n }\r\n\r\n /*setClientColor(clientColor){\r\n theme = createMuiTheme({\r\n palette: {\r\n primary: {\r\n main: clientColor\r\n }\r\n }\r\n })} */\r\n\r\n const updateValues = (vars) => {\r\n setQuizState({...quizState, \r\n Username: vars.UserName,\r\n AuthToken: vars.AuthToken,\r\n ParticipantGuid: vars.ParticipantGuid\r\n })\r\n }\r\n\r\n useEffect(() => {\r\n },[quizState.Questions])\r\n\r\n \r\n //use this for continue\r\n const setCurrentIndex = (index) => {\r\n setQuizState({...quizState, \r\n CurrentIndex: index\r\n })\r\n }\r\n\r\n const updateQuestionsAnswered = (num, currentIndex) => {\r\n setQuizState({...quizState, \r\n QuestionsAnswered: num\r\n })\r\n }\r\n\r\n const updateQuestionTotal = (num) => {\r\n setQuizState({...quizState, \r\n QuestionTotal: num\r\n })\r\n }\r\n\r\n const completeSuccessful = (didCompleteSuccessfully) => {\r\n if(didCompleteSuccessfully){\r\n navigate({pathname: '/personalreport', search: createSearchParams({vi: '8AC17D1E-2871-44D9-ACC0-867285149337', assmtguid: currentUser.AuthToken }).toString()})\r\n \r\n }\r\n }\r\n\r\n if(quizState.Questions.SurveyData && quizState.ResponseGuid){\r\n let progressBar \r\n let status='active'\r\n \r\n if(quizState.QuestionsAnswered == quizState.QuestionTotal){\r\n status = 'success'\r\n \r\n } else {\r\n status = 'active'\r\n\r\n }\r\n progressBar = \r\n \r\n\r\n return (\r\n \r\n
\r\n
\r\n {progressBar}\r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n// \r\n \r\n//\r\n// {content}\r\n// \r\nexport default HRA;","import { createSlice, createSelector, createAsyncThunk } from '@reduxjs/toolkit'\r\n\r\n// import { BASE_URL, OrganizationId, AuthToken } from '/features/storeconfig'\r\nimport axios from 'axios'\r\n\r\nconst initialState = {\r\n entities: {},\r\n status: 'idle', // idle loading success fail \r\n error: null\r\n}\r\n\r\nexport const SaveAnswer = createAsyncThunk('questions/saveAnswer', async (incomingVariable, thunkAPI) => {\r\n try {\r\n //const response = await fetch(\"/api/surveys/set\",{method:\"POST\", body:JSON.stringify(incomingVariable)})\r\n //const data = await response.json()\r\n //// insert error handling success=false\r\n //return data\r\n\r\n const response = await axios.post('../../WsWebServiceHra/SaveAnswer/' + incomingVariable.auth + '/' + incomingVariable.response + '/' + incomingVariable.questionID + '/' + incomingVariable.value + '/')\r\n const data = await response.data\r\n return data\r\n\r\n // return Save(...incomingVariable)\r\n } catch (err) {\r\n console.log('error', err)\r\n return thunkAPI.rejectWithValue({ error: err.message });\r\n }\r\n })\r\n\r\n\r\nconst questionSlice = createSlice({\r\n name: 'questions',\r\n initialState,\r\n reducers: {\r\n questionAdd(state, action) {\r\n const questionData = action.payload\r\n state.entities[questionData.QuestionId] = questionData\r\n },\r\n questionModify(state, action) {\r\n const questionData = action.payload\r\n state.entities[questionData.QuestionId] = questionData\r\n } ,\r\n \r\n questionBranchingLogicModify(state, action) {\r\n const questionData = action.payload\r\n const currentquestion = state.entities[questionData.QuestionId]\r\n state.entities[questionData.QuestionId] = {\r\n ...currentquestion\r\n , QuestionDisplayedFlag: questionData.QuestionDisplayedFlag\r\n , QuestionRequiredFlag:questionData.QuestionRequiredFlag\r\n }\r\n },\r\n questionDelete(state, action) {\r\n const questionData = action.payload\r\n delete state.entities[questionData.QuestionId]\r\n },\r\n questionHydrate(state, action) {\r\n const questionData = action.payload\r\n state.entities=questionData\r\n state.status = 'success'\r\n },\r\n questionSaveModify(state, action){\r\n const questionData = action.payload\r\n const currentQuestion = state.entities[questionData.QuestionId]\r\n state.entities[questionData.QuestionId] = {\r\n ...currentQuestion,\r\n Responses: [{\r\n Response: questionData.value}]\r\n }\r\n }\r\n \r\n },\r\n extraReducers(builder) {\r\n builder\r\n .addCase(SaveAnswer.pending, (state, action) => {\r\n state.status = 'loading'\r\n })\r\n .addCase(SaveAnswer.fulfilled, (state, action) => {\r\n const loadedData = action.payload.Info\r\n const data = state.entities\r\n if(loadedData.length){\r\n for (var i=0; i state.questions.entities\r\n\r\nexport const selectQuestions = createSelector(selectQuestionEntities, (entities) =>\r\n Object.values(entities)\r\n)\r\n\r\nexport const selectQuestionById = (state, QuestionId) => {\r\n return selectQuestionEntities(state)[QuestionId]\r\n}\r\n\r\nexport const selectQuestionsInQuestionSet = createSelector(\r\n selectQuestions\r\n , (state, QuestionSetId) => QuestionSetId\r\n , (questions, QuestionSetId) => {\r\n\r\n return questions.filter((question) => {\r\n return question.QuestionSetId === QuestionSetId\r\n })\r\n }\r\n\r\n)\r\n\r\nexport const selectNextVisibleQuestion = createSelector(\r\n selectQuestions\r\n , (state, QuestionId) => QuestionId\r\n , (questions, QuestionId) => {\r\n \r\n for(let i=questions.findIndex(question => question.QuestionId == QuestionId)+1; i filter\r\n , (questions, filter) => {\r\n return questions.filter((question) => {\r\n return question[filter] === \"1\"\r\n })\r\n }\r\n)\r\n\r\nexport const AnsweredQuestions = createSelector(\r\n selectQuestions\r\n , (questions) => {\r\n return questions.filter((question) => {\r\n return question.Responses[0].Response.length && question.Responses[0].Responses != '-1'\r\n })\r\n }\r\n)\r\n","import React, {useState, useEffect} from \"react\";\r\nimport { useSelector } from 'react-redux'\r\n\r\nimport { styled } from '@mui/material/styles';\r\nimport { Box } from \"@mui/system\";\r\nimport LinearProgress from '@mui/material/LinearProgress';\r\nimport { Paper, Typography } from \"@mui/material\";\r\nimport { selectQuestions } from \"../../../reducers/survey_question\";\r\n\r\nconst ProgressBar = (props) => {\r\n const Questions = useSelector(state => selectQuestions(state))\r\n const [sticky, setSticky] = useState('relative')\r\n const [progressvalue, setProgressValue] = useState(0)\r\n\r\n \r\n useEffect(() => {\r\n window.addEventListener('scroll', isSticky);\r\n return () => {\r\n window.removeEventListener('scroll', isSticky);\r\n };\r\n }, []); \r\n\r\n useEffect(() => {\r\n let displayed = Questions.filter(question=>question.QuestionDisplayedFlag == \"1\" && question.QuestionRequiredFlag == \"1\").length\r\n let answered = Questions.filter(question=>question.Responses[0].Response.length && question.Responses[0].Response !== \"-1\" && question.QuestionDisplayedFlag == \"1\" && question.QuestionRequiredFlag == \"1\").length\r\n let calcValue = (answered/displayed)*100\r\n setProgressValue((oldValue) => {\r\n if(oldValue === 100){\r\n return 100\r\n }\r\n return Math.min(calcValue, 100)\r\n })\r\n }, [Questions])\r\n\r\n\r\n const isSticky = () => {\r\n const scrollTop = window.scrollY;\r\n const stickyClass = scrollTop >= 150 ? 'fixed' : 'relative'\r\n if(stickyClass != sticky) setSticky('fixed')\r\n }\r\n\r\n return \r\n \r\n \r\n years of age or younger\",\r\n InvalidAgeTooYoung: error_age && error_age.length>0 ? error_age[0].MessageTypeContent:\"This assessment was designed for those years of age or older\",\r\n InvalidDate: \"Invalid Date\",\r\n InvalidPrecision: (error_valprecision && error_valprecision.length>0 ? error_valprecision[0].MessageTypeContent: \"Too many decimal places. Use less than \") + ' '+ (error_valprecision2 && error_valprecision2.length>0 ? error_valprecision2[0].MessageTypeContent: \"\"),\r\n NotANumber: (error_mustbenumeric && error_mustbenumeric.length>0 ? error_mustbenumeric[0].MessageTypeContent: \"Must be a number\"),\r\n OutOfRange: (error_valrange && error_valrange.length>0 ? error_valrange[0].MessageTypeContent: \"Must be between\") + \" - \",\r\n WholeNumbers: (error_wholenumber && error_wholenumber.length>0 ? error_wholenumber[0].MessageTypeContent: \"Only whole numbers\") \r\n }\r\n const [inputState, setInputState] = useState({\r\n invalidAnswer: false, //on ComponenetDidMount, put logic in to update htis based on response\r\n answer: props.question.Responses[0].Response ? props.question.Responses[0].Response : '',\r\n valMin: props.question.ValueLimitationMin,\r\n valMax: props.question.ValueLimitationMax,\r\n valPrecision: props.question.ValueLimitationPrecision,\r\n errorMessage: \"\",\r\n inputError: false,\r\n saving: false\r\n })\r\n\r\n const handleEnter = (event) => {\r\n if (event.key == \"Enter\" && !inputState.invalidAnswer) {\r\n props.saveAnswer(inputState.answer, props.QuestionId)\r\n }\r\n }\r\n\r\n const onChange = (ev, v) => {\r\n let value = ev.target.value\r\n let message = inputState.errorMessage\r\n let validation = validationMessages\r\n //validation goes here\r\n //...\r\n //...\r\n\r\n if (value) {\r\n\r\n //check for numeric\r\n if (isNaN(value)) {\r\n message = error_invalidchars.MessageTypeContent\r\n }\r\n\r\n //check for range\r\n else if (inputState.valMin.length && inputState.valMax.length && (Number(value) < Number(inputState.valMin) || Number(value) > Number(inputState.valMax))) {\r\n \r\n message = validation.OutOfRange.replace('', inputState.valMin).replace('', inputState.valMax)\r\n //message = \"\" + dispatch(selectErrorMessagesByKeyName('VAL RANGE PART1')).\r\n }\r\n\r\n //check for precision\r\n else if (Math.floor(value) != value) {\r\n if (inputState.valPrecision == \"0\" || inputState.valPrecision == \"\") {\r\n message = validation.WholeNumbers\r\n } else {\r\n message = value.split('.')[1].length > inputState.valPrecision ? validation.InvalidPrecision.replace('',inputState.valPrecision) : \"\"\r\n }\r\n } else {\r\n message = ''\r\n }\r\n \r\n\r\n }\r\n else {\r\n message = ''\r\n }\r\n\r\n setInputState({\r\n ...inputState,\r\n errorMessage: message,\r\n inputError: message.length ? true : false,\r\n answer: value,\r\n invalidAnswer: message.length ? true : false\r\n })\r\n\r\n \r\n }\r\n\r\n const onBlur = () => {\r\n //console.log(ev)\r\n setTimeout(() => {\r\n \r\n if (!inputState.invalidAnswer && !inputState.helpOpen) {\r\n\r\n setInputState({ ...inputState, saving: true })\r\n props.saveAnswer(inputState.answer ? inputState.answer : '-1', props.QuestionId)\r\n }\r\n }, 100)\r\n }\r\n\r\n const handleClick = (ev) => {\r\n if (!inputState.invalidAnswer && !inputState.saving) {\r\n props.saveAnswer(inputState.answer, props.QuestionId)\r\n }\r\n }\r\n\r\n const button = \r\n \r\n \r\n )\r\n\r\n}\r\n\r\nexport default InputAnswer","import React, { useState } from 'react'\r\nimport { ToggleButton, ToggleButtonGroup, RadioGroup, FormControlLabel, Radio } from '@mui/material'\r\n\r\nconst Toggle = (props) => {\r\n const [response, setResponse] = useState(props.question.Responses[0].Response)\r\n\r\n\r\n const changeAnswer = (e, v) => {\r\n if (v) {\r\n\r\n props.saveAnswer(v, props.QuestionId)\r\n setResponse(v)\r\n } else {\r\n props.saveAnswer('-1', props.QuestionId)\r\n setResponse('-1')\r\n }\r\n }\r\n if (props) {\r\n let answerArray = [...props.question.Answers]\r\n return (\r\n\r\n \r\n {answerArray.sort((a, b) => (parseInt(a.AnswerSequenceInQuestion) - parseInt(b.AnswerSequenceInQuestion)))\r\n .map(answer =>\r\n 3 && !props.question.QuestionSetHasContent ? (14-(props.question.Answers.length - 3) + \"px\") : '', s: '' } }}>\r\n {answer.AnswerStandardContent} \r\n )}\r\n \r\n )\r\n } else return
\r\n}\r\n\r\nexport default Toggle;\r\n\r\n/**\r\n * import React, { Component } from 'react'\r\nimport FormControlLabel from '@material-ui/core/FormControlLabel'\r\nimport Radio from '@material-ui/core/Radio'\r\n\r\nconst Toggle = (props) => {\r\n if(props){\r\n let answer = this.props.answer;\r\n return(\r\n //Answer \r\n nope
\r\n}\r\n\r\nexport default Toggle;\r\n\r\n\r\n\r\nif (!props.question.QuestionSetHasContent) \r\n return(\r\n \r\n {answerArray.sort((a, b) => (parseInt(a.AnswerSequenceInQuestion) - parseInt(b.AnswerSequenceInQuestion)))\r\n .map(answer => \r\n \r\n )\r\n else\r\n */","\r\nimport React, { useState, useEffect } from 'react';\r\nimport { FormControl, Select, MenuItem, InputLabel, Grid } from '@mui/material'\r\nimport { useSelector } from 'react-redux';\r\nimport { selectErrorMessagesByKeyName } from '../../../../reducers/reference_errormessages';\r\nimport InputAnswer from './Input'\r\n\r\n\r\nconst Height = (props) => {\r\n const error_height_high = useSelector(state => { selectErrorMessagesByKeyName(state, 'VAL HEIGHT TOO HIGH') })\r\n const error_height_low = useSelector(state => { selectErrorMessagesByKeyName(state, 'VAL HEIGHT TOO LOW') })\r\n const { viewInstance, settings } = useSelector(state => state.viewinstance)\r\n const uom = (settings?.SessionVariableValues && settings?.SessionVariableValues[\"QUESTION UOM TEMPLATE\"]) || \"1743\"\r\n\r\n const [heightState, setHeightState] = useState({\r\n invalidAnswer: true, //on ComponenetDidMount, put logic in to update htis based on response\r\n answer: parseInt(props.question.Responses[0].Response),\r\n answerInches: parseInt(props.question.Responses[0].Response) % 12,\r\n answerFeet: Math.floor(parseInt(props.question.Responses[0].Response) / 12),\r\n valMin: parseInt(props.question.ValueLimitationMin),\r\n valMax: parseInt(props.question.ValueLimitationMax),\r\n valPrecision: parseInt(props.question.ValueLimitationPrecision),\r\n errorMessage: \"\",\r\n inputError: false,\r\n Inches: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11],\r\n Feet: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]\r\n })\r\n //UNIT OF MEASURE METRIC\r\n const [response, setResponse] = useState(props.question.Responses[0].Response)\r\n\r\n useEffect(() => {\r\n createFeetArray()\r\n }, [])\r\n\r\n\r\n const createFeetArray = () => {\r\n let max = Math.floor(heightState.valMax / 12)\r\n let min = Math.floor(heightState.valMin / 12)\r\n\r\n let feet = []\r\n\r\n for (var x = min; x < max + 1; x++) {\r\n feet.push(x)\r\n }\r\n\r\n setHeightState({\r\n ...heightState,\r\n Feet: feet\r\n })\r\n\r\n\r\n }\r\n\r\n useEffect(() => {\r\n if (heightState.answerFeet > 0\r\n && heightState.answerInches >= 0\r\n && (heightState.answerFeet != Math.floor(parseInt(props.question.Responses[0].Response) / 12)\r\n || heightState.answerInches != parseInt(props.question.Responses[0].Response) % 12)) {\r\n setSavableAnswer()\r\n }\r\n }, [heightState.answerInches, heightState.answerFeet])\r\n\r\n const setInchesAndFeet = (answer) => {\r\n var feet = Math.floor(answer / 12)\r\n var inches = answer % 12\r\n\r\n setHeightState({\r\n ...heightState,\r\n answerInches: inches,\r\n answerFeet: feet\r\n })\r\n\r\n }\r\n\r\n const setInches = ev => {\r\n\r\n setHeightState({\r\n ...heightState,\r\n answerInches: ev.target.value\r\n }, () => {\r\n if (heightState.answerFeet >= 0 && heightState.answerInches >= 0) {\r\n setSavableAnswer()\r\n }\r\n })\r\n }\r\n\r\n const setFeet = (ev) => {\r\n setHeightState({\r\n ...heightState,\r\n answerFeet: ev.target.value\r\n }, () => {\r\n if (heightState.answerFeet >= 0 && heightState.answerInches >= 0) {\r\n setSavableAnswer()\r\n }\r\n }\r\n )\r\n }\r\n\r\n const setSavableAnswer = () => {\r\n var inches = heightState.answerInches + heightState.answerFeet * 12\r\n //console.log(inches)\r\n if (inches > heightState.valMax || inches < heightState.valMin) {\r\n setHeightState({\r\n ...heightState,\r\n errorMessage: inches > heightState.valMax ? error_height_high : inches < heightState.valMin ? error_height_low : \"Height out of range\",\r\n invalidAnswer: true\r\n })\r\n } else {\r\n if (inches > 0) {\r\n var inchString = inches.toString()\r\n props.saveAnswer(inchString, props.QuestionId)\r\n }\r\n }\r\n }\r\n\r\n if (props && uom!=='1743') {\r\n return (\r\n Answer \r\n \r\n \r\n {viewInstance?.SurveyPage?.OtherLabels?.FeetLabel || \"Feet\"} \r\n \r\n {heightState.Feet.map((item) => {item} )}\r\n \r\n \r\n \r\n {viewInstance?.SurveyPage?.OtherLabels?.InchesLabel || \"Inches\"} \r\n \r\n {heightState.Inches.map((item) => {item} )}\r\n \r\n \r\n {heightState.errorMessage}
\r\n \r\n\r\n )\r\n }\r\n}\r\n\r\nexport default Height;","\r\nimport React, { Component, useState } from 'react';\r\nimport { FormControl, Select, MenuItem, InputLabel, TextField} from '@mui/material';\r\nimport moment from 'moment';\r\n\r\nimport dayjs from 'dayjs'\r\nimport relativeTime from 'dayjs/plugin/relativeTime';\r\n\r\nimport { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';\r\nimport { DatePicker } from '@mui/x-date-pickers/DatePicker';\r\nimport { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider/LocalizationProvider';\r\nimport { useSelector } from 'react-redux';\r\n\r\ndayjs.extend(relativeTime)\r\n\r\n\r\nconst DateOfBirth = (props) => {\r\n const [value, setValue] = useState(props.question.Responses[0].Response || null )\r\n const minDate = dayjs().subtract(props.question.ValueLimitationMin, 'year')\r\n const maxDate = dayjs().subtract(props.question.ValueLimitationMax, 'year')\r\n const { viewInstance, settings } = useSelector(state => state.viewinstance)\r\n\r\n\r\n const handleChange = (value) => {\r\n if( dayjs().diff(dayjs(value), 'year') >= props.question.ValueLimitationMin && \r\n dayjs().diff(dayjs(value), 'year') <= props.question.ValueLimitationMax ){\r\n \r\n setValue(value)\r\n }\r\n }\r\n\r\n const handleSave = () => {\r\n \r\n if(dayjs().diff(dayjs(value), 'year') >= props.question.ValueLimitationMin && \r\n dayjs().diff(dayjs(value), 'year') <= props.question.ValueLimitationMax ){\r\n\r\n props.saveAnswer(dayjs(value).format('MM-DD-YYYY'))\r\n\r\n }\r\n }\r\n\r\n return (\r\n \r\n {\r\n handleChange(newValue);\r\n }}\r\n onClose={handleSave}\r\n onBlur={handleSave}\r\n renderInput={(params) => \r\n )\r\n}\r\n\r\n//helps generate an array of Dropdown items within a number range\r\nfunction optionGenerator(start, end, dir){\r\n var options = []\r\n\r\n if(dir==\"ASC\"){\r\n while (start <= end){\r\n options.push({start} )\r\n start++\r\n }\r\n } else{\r\n while (start >= end){\r\n options.push({start} )\r\n start--\r\n }\r\n }\r\n return options\r\n}\r\n\r\n\r\n\r\nexport default DateOfBirth;","import React, { useEffect, useState } from 'react'\r\nimport { Box, Slider, Typography } from '@mui/material'\r\nimport { useSelector } from 'react-redux'\r\n\r\nconst TableSlider = (props) => {\r\n const [answerArray, setAnswerArray] = useState([])\r\n\r\n const [responseIndex, setResponseIndex] = useState(0)\r\n const [responseText, setResponseText] = useState(\"\")\r\n const { viewInstance, settings } = useSelector(state => state.viewinstance)\r\n\r\n\r\n useEffect(() => {\r\n if(!answerArray.length){\r\n let array = [...props.question.Answers].sort((a, b) => a.AnswerSequenceInQuestion - b.AnswerSequenceInQuestion)\r\n array.unshift({AnswerId:\"-1\", AnswerStandardContent:viewInstance?.SurveyPage?.OtherLabels?.PleaseAnswer || \"Please Answer\"})\r\n setAnswerArray(array)\r\n }\r\n if(!responseText && answerArray.length){\r\n if(props.question.Responses[0].Response){\r\n for(let i=0; i {\r\n props.saveAnswer(answerArray[value].AnswerId, props.QuestionId)\r\n }\r\n\r\n const handleSliding = (ev, value) => {\r\n setResponseIndex(value)\r\n setResponseText(answerArray[value].AnswerStandardContent)\r\n }\r\n\r\n if(props){\r\n return (\r\n \r\n {responseText} \r\n )}\r\n}\r\n\r\nexport default TableSlider;","import React from 'react'\r\n\r\nimport DropdownIncremental from '../answers/DropdownIncremental'\r\nimport Input from '../answers/updated/Input'\r\nimport Toggle from '../answers/updated/Toggle'\r\nimport Height from '../answers/updated/Height'\r\nimport DateOfBirth from '../answers/updated/DateOfBirth'\r\nimport TableSlider from '../answers/updated/TableSlider'\r\nimport CheckboxYesNo from '../answers/updated/CheckboxYesNo'\r\nimport InputText from '../answers/updated/InputText'\r\n\r\nconst AnswerComponentTranslation = {\r\n \"TOGGLE\": Toggle,\r\n \"DECIMAL INPUT\": Input,\r\n \"INTEGER INPUT\": Input,\r\n \"TEXT INPUT\": InputText,\r\n \"DATE INPUT\": DateOfBirth,\r\n \"SLIDER\": TableSlider,\r\n \"HEIGHT\": Height,\r\n \"CHECKBOX\": CheckboxYesNo\r\n}\r\n\r\n/**\r\n * \"SLIDER\": TableSlider,\r\n \"DECIMAL INPUT\": Input,\r\n \"INTEGER INPUT\": Input,\r\n \"HEIGHT\": Height,\r\n \"DROPDOWN INCREMENTAL\": DropdownIncremental,\r\n \"DROPDOWN\": Dropdown\r\n * \r\n */\r\n\r\nconst AnswerContainer = (props) => {\r\n if (typeof AnswerComponentTranslation[props.QuestionTypeKeyName] !== \"undefined\") {\r\n return React.createElement(AnswerComponentTranslation[props.QuestionTypeKeyName]\r\n , {\r\n key: \"ANS_\" + props.QuestionId,\r\n question: props,\r\n saveAnswer: props.saveAnswer,\r\n QuestionStandardContent: props.QuestionStandardContent\r\n }\r\n )\r\n }\r\n\r\n return React.createElement(\r\n () =>
\r\n )\r\n}\r\n\r\nexport default AnswerContainer","import React, { useState } from 'react'\r\nimport { useSelector, useDispatch } from 'react-redux'\r\n\r\nimport { Button, FormControl, Input, Box, TextField, Typography } from '@mui/material'\r\n\r\nimport NavigateNextIcon from '@mui/icons-material/NavigateNext';\r\n\r\nimport { selectErrorMessagesByKeyName } from '../../../../reducers/reference_errormessages';\r\n\r\n\r\n\r\nconst InputAnswerText = (props) => {\r\n const [response, setResponse] = useState(props.question.Responses[0].Response)\r\n\r\n const { settings } = useSelector((state) => state.viewinstance)\r\n\r\n const { invalidAnswer, setInvalidAnswer } = useState(!(response.length || response != \"-1\"))\r\n\r\n const dispatch = useDispatch()\r\n const error_valrange = useSelector((state)=> selectErrorMessagesByKeyName(state,'VAL RANGE PART1'))\r\n const error_valprecision = useSelector((state)=> selectErrorMessagesByKeyName(state,'VAL PRECISION PART1'))\r\n const error_valprecision2 = useSelector((state)=> selectErrorMessagesByKeyName(state,'VAL PRECISION PART2'))\r\n const error_invalidchars = useSelector((state)=> selectErrorMessagesByKeyName(state,'VAL INVALID CHARS'))\r\n const error_mustbenumeric = useSelector((state)=> selectErrorMessagesByKeyName(state,'VAL NUMERIC INPUT'))\r\n const error_wholenumber = useSelector((state)=> selectErrorMessagesByKeyName(state,'VAL INTEGER'))\r\n const error_text = useSelector((state)=> selectErrorMessagesByKeyName(state,'VAL TEXT'))\r\n const error_age = useSelector((state)=> selectErrorMessagesByKeyName(state,'VAL DATE'))\r\n \r\n const validationMessages = {\r\n HeightOutOfRange: \"Height out of Range\",\r\n InvalidAgeTooOld: error_age && error_age.length>0 ? error_age[0].MessageTypeContent:\"This assessment was designed for those years of age or younger\",\r\n InvalidAgeTooYoung: error_age && error_age.length>0 ? error_age[0].MessageTypeContent:\"This assessment was designed for those years of age or older\",\r\n InvalidDate: \"Invalid Date\",\r\n InvalidPrecision: (error_valprecision && error_valprecision.length>0 ? error_valprecision[0].MessageTypeContent: \"Too many decimal places. Use less than \") + ' '+ (error_valprecision2 && error_valprecision2.length>0 ? error_valprecision2[0].MessageTypeContent: \"\"),\r\n NotANumber: (error_mustbenumeric && error_mustbenumeric.length>0 ? error_mustbenumeric[0].MessageTypeContent: \"Must be a number\"),\r\n OutOfRange: (error_valrange && error_valrange.length>0 ? error_valrange[0].MessageTypeContent: \"Must be between\") + \" - \",\r\n WholeNumbers: (error_wholenumber && error_wholenumber.length>0 ? error_wholenumber[0].MessageTypeContent: \"Only whole numbers\") \r\n }\r\n const [inputState, setInputState] = useState({\r\n invalidAnswer: false, //on ComponenetDidMount, put logic in to update htis based on response\r\n answer: props.question.Responses[0].Response ? props.question.Responses[0].Response : '',\r\n valMin: props.question.ValueLimitationMin,\r\n valMax: props.question.ValueLimitationMax,\r\n valPrecision: props.question.ValueLimitationPrecision,\r\n errorMessage: \"\",\r\n inputError: false,\r\n saving: false\r\n })\r\n\r\n const handleEnter = (event) => {\r\n if (event.key == \"Enter\" && !inputState.invalidAnswer) {\r\n props.saveAnswer(inputState.answer, props.QuestionId)\r\n }\r\n }\r\n\r\n const onChange = (ev, v) => {\r\n let value = ev.target.value\r\n let message = inputState.errorMessage\r\n let validation = validationMessages\r\n //validation goes here\r\n //...\r\n //...\r\n\r\n if (value) {\r\n\r\n if (inputState.valMin.length && inputState.valMax.length && (Number(value.length) < Number(inputState.valMin) || Number(value.length) > Number(inputState.valMax))) {\r\n \r\n message = validation.OutOfRange.replace('', inputState.valMin).replace('', inputState.valMax)\r\n //message = \"\" + dispatch(selectErrorMessagesByKeyName('VAL RANGE PART1')).\r\n }\r\n\r\n \r\n else {\r\n message = ''\r\n }\r\n \r\n\r\n }\r\n else {\r\n message = ''\r\n }\r\n\r\n setInputState({\r\n ...inputState,\r\n errorMessage: message,\r\n inputError: message.length ? true : false,\r\n answer: value,\r\n invalidAnswer: message.length ? true : false\r\n })\r\n\r\n \r\n }\r\n\r\n const onBlur = () => {\r\n //console.log(ev)\r\n setTimeout(() => {\r\n \r\n if (!inputState.invalidAnswer && !inputState.helpOpen) {\r\n\r\n setInputState({ ...inputState, saving: true })\r\n props.saveAnswer(inputState.answer ? inputState.answer : '-1', props.QuestionId)\r\n }\r\n }, 100)\r\n }\r\n\r\n const handleClick = (ev) => {\r\n if (!inputState.invalidAnswer && !inputState.saving) {\r\n props.saveAnswer(inputState.answer, props.QuestionId)\r\n }\r\n }\r\n\r\n const button = \r\n \r\n \r\n )\r\n\r\n}\r\n\r\nexport default InputAnswerText","import React, {useState} from 'react'\r\nimport {ToggleButton, ToggleButtonGroup, RadioGroup, FormControlLabel, FormGroup, Checkbox, Radio} from '@mui/material'\r\nimport { useSelector } from 'react-redux'\r\nimport { selectQuestionById } from '../../../../reducers/survey_question'\r\n\r\nconst CheckboxYesNo = (props) => {\r\n const Question = useSelector(state=>selectQuestionById(state,props.question.QuestionId))\r\n\r\n \r\n const changeAnswer = (e, v) => {\r\n \r\n let Value = e.target.checked === true ? \"42\":\"-1\"\r\n props.saveAnswer(Value, Question.QuestionId)\r\n \r\n \r\n } \r\n if(props){ \r\n return ( \r\n \r\n \r\n )\r\n } else return
\r\n} \r\n\r\nexport default CheckboxYesNo; \r\n","import { createSlice, createSelector } from '@reduxjs/toolkit'\r\n\r\n// import { BASE_URL, OrganizationId, AuthToken } from '/features/storeconfig'\r\n\r\n\r\n\r\nconst initialState = {\r\n entities: {},\r\n status: 'idle', // idle loading success fail \r\n error: null\r\n}\r\n\r\n\r\n\r\nconst questionsetSlice = createSlice({\r\n name: 'questionsets',\r\n initialState,\r\n reducers: {\r\n questionsetAdd(state, action) {\r\n const questionSetData = action.payload\r\n state.entities[questionSetData.QuestionSetId] = questionSetData\r\n },\r\n questionsetModify(state, action) {\r\n const questionSetData = action.payload\r\n state.entities[questionSetData.QuestionSetId] = questionSetData\r\n },\r\n questionsetDelete(state, action) {\r\n const questionSetData = action.payload\r\n delete state.entities[questionSetData.QuestionSetId]\r\n },\r\n questionsetHydrate(state, action) {\r\n const questionSetData = action.payload\r\n state.entities=questionSetData\r\n state.status = 'success'\r\n },\r\n questionsetClear(state, action){\r\n state.status='idle'\r\n },\r\n questionsetAnswerSaved(state, action){\r\n const {QuestionSetId} = action.payload\r\n const curQuestionSet = state.entities[QuestionSetId] \r\n state.entities[QuestionSetId] = {...curQuestionSet, WasChanged:true}\r\n },\r\n questionsetValueLimitation(state, action){\r\n const {QuestionSetId, ValueLimitationPassed, ValueLimitationError} = action.payload \r\n const curQuestionSet = state.entities[QuestionSetId]\r\n state.entities[QuestionSetId] = {...curQuestionSet, ValueLimitationPassed: ValueLimitationPassed, ValueLimitationError:ValueLimitationError, WasChanged:false}\r\n }\r\n }\r\n})\r\n\r\nexport const { questionsetAdd,questionsetModify,questionsetDelete,questionsetHydrate,questionsetAnswerSaved,questionsetValueLimitation } = questionsetSlice.actions\r\n\r\nexport default questionsetSlice.reducer\r\n\r\nconst selectQuestionSetEntities = (state) => state.questionsets.entities\r\n\r\nexport const selectQuestionSets = createSelector(selectQuestionSetEntities, (entities) =>\r\n Object.values(entities)\r\n)\r\n\r\nexport const selectQuestionSetById = (state, QuestionSetId) => {\r\n return selectQuestionSetEntities(state)[QuestionSetId]\r\n}\r\n\r\nexport const selectQuestionSetsInCurrentSurvey = createSelector(\r\n selectQuestionSets\r\n , (state, SurveyId)=>SurveyId\r\n , (questionsets, SurveyId) => {\r\n\r\n return questionsets.filter((questionset) => {\r\n return questionset.SurveyId === SurveyId\r\n })\r\n }\r\n\r\n)\r\n\r\n\r\n","import React, { useEffect, useState } from 'react'\r\nimport { Tooltip, IconButton, Typography, Box, Collapse, Snackbar, Card, Alert } from '@mui/material'\r\nimport HelpOutlineIcon from '@mui/icons-material/HelpOutline';\r\nimport { useDispatch, useSelector } from 'react-redux'\r\nimport { selectQuestionById, SaveAnswer, selectQuestions, selectNextVisibleQuestion, questionSaveModify, questionBranchingLogicModify } from '../../../reducers/survey_question'\r\nimport AnswerContainer from './AnswerContainer'\r\nimport { questionsetAnswerSaved } from '../../../reducers/survey_questionset';\r\nimport axios from 'axios';\r\n// import { calcProcess} from '../../../reducers/survey_calc';\r\n// import QuestionSnacks from './QuestionSnacks';\r\n/**\r\n * \r\n \r\nquestions={quizState.Questions}\r\nauthtoken={currentUser.AuthToken}\r\nresponseguid={quizState.ResponseGuid}\r\nstartfromBeginning={quizState.StartFromBeginning}\r\nuom={quizState.UnitOfMeasure}\r\nvalidationMessages={ValidationMessages}\r\nquestionPrompts={QuestionPrompts}\r\nupdateQuestionTotal={updateQuestionTotal}\r\nupdateQuestionsAnswered={updateQuestionsAnswered}\r\nsetCurrentIndex={setCurrentIndex} \r\ncompleteSuccessful={completeSuccessful}/>\r\n*/\r\n\r\n\r\nconst QuestionItem = (props) => {\r\n const QuestionId = props.Question.QuestionId\r\n const Question = useSelector((state) => selectQuestionById(state, QuestionId))\r\n const Questions = useSelector((state) => selectQuestions(state)).sort((a, b) => a.QuestionSetSequence - b.QuestionSetSequence || a.QuestionSequence - b.QuestionSequence)\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const QuestionSetHasContent = props.QuestionSetHasContent\r\n const QuestionIsDisplayed = Question.QuestionDisplayedFlag === \"1\" ? true : false\r\n const { settings } = useSelector(state => state.viewinstance)\r\n\r\n \r\n\r\n\r\n const dispatch = useDispatch()\r\n useEffect(() => {\r\n\r\n }, [props, Question])\r\n\r\n \r\n\r\n const saveAnswer = (value) => {\r\n if (props.UseSaveAnswerOverride === true) {\r\n props.SaveAnswerOverride({ Question: Question, value: value })\r\n }\r\n else {\r\n saveAnswerCall({\r\n auth: currentUser.AuthToken,\r\n response: props.responseGuid,\r\n questionID: QuestionId,\r\n value: value\r\n }).then(responseData => {\r\n \r\n let changes = []\r\n if (responseData.Info.length) {\r\n if (responseData.Info[0].Changes) {\r\n\r\n responseData.Info[0].Changes.forEach((question) => {\r\n changes[question.QuestionId] = question\r\n dispatch(questionBranchingLogicModify({ QuestionId: question.QuestionId, QuestionDisplayedFlag: question.DisplayFlag, QuestionRequiredFlag: question.RequiredFlag }))\r\n })\r\n }\r\n // if (responseData.Info[0].Calc) {\r\n // dispatch(calcProcess({Calc:responseData.Info[0].Calc, Source:QuestionId}))\r\n // }\r\n // if (responseData.Info.length > 1 && responseData.Info[1].Calc) {\r\n // dispatch(calcProcess({Calc:responseData.Info[1].Calc, Source:QuestionId}))\r\n // }\r\n\r\n }\r\n\r\n dispatch(questionSaveModify({ QuestionId: QuestionId, value: value }))\r\n dispatch(questionsetAnswerSaved({ QuestionSetId: props.QuestionSetId }))\r\n if (settings.OrganizationSettingValues[\"WC HRA AUTOSCROLL ENABLED\"] && settings.OrganizationSettingValues[\"WC HRA AUTOSCROLL ENABLED\"] === \"1\") setTimeout(scrollToNextVisible(findNextVisible(changes)), 200)\r\n })\r\n\r\n\r\n\r\n }\r\n }\r\n\r\n const saveAnswerCall = async (incomingVariable) => {\r\n const response = await axios.post('../../WsWebServiceHra/SaveAnswer/' + incomingVariable.auth + '/' + incomingVariable.response + '/' + incomingVariable.questionID + '/' + incomingVariable.value + '/')\r\n const data = await response.data\r\n\r\n return data\r\n }\r\n\r\n const findNextVisible = (changes) => {\r\n //console.log(changes)\r\n for (let i = Questions.findIndex(question => question.QuestionId == QuestionId) + 1; i < Questions.length; i++) {\r\n\r\n if (changes.length) {\r\n //case for shoud be hidden, change = display 0\r\n if (changes[Questions[i].QuestionId] && changes[Questions[i].QuestionId].DisplayFlag === \"0\") {\r\n continue;\r\n }\r\n //case for should be seen, change = display 1\r\n if (changes[Questions[i].QuestionId] && changes[Questions[i].QuestionId].DisplayFlag === \"1\") {\r\n return Questions[i];\r\n }\r\n }\r\n if (Questions[i] && Questions[i].QuestionDisplayedFlag === \"1\") {\r\n return Questions[i]\r\n }\r\n }\r\n return null\r\n }\r\n\r\n const scrollToNextVisible = (NextQuestion) => {\r\n if (NextQuestion && NextQuestion.QuestionSetId != Question.QuestionSetId) {\r\n let element = document.getElementById(\"QS_\" + NextQuestion.QuestionSetId);\r\n if (element) {\r\n element.scrollIntoView({\r\n block: element.offsetHeight > window.innerHeight ? \"start\" : \"center\",\r\n behavior: \"smooth\"\r\n });\r\n }\r\n }\r\n\r\n }\r\n\r\n let helpIcon = }>\r\n \r\n \r\n \r\n\r\n return (\r\n \r\n \r\n {Question.QuestionTypeKeyName !== 'CHECKBOX' && ({Question.QuestionStandardContent} {Question.QuestionHelpText ? helpIcon : ''} )}\r\n */}\r\n \r\n \r\n )\r\n\r\n}\r\n\r\nexport default QuestionItem","import React from 'react'\r\nimport { Box } from '@mui/material'\r\nimport QuestionItem from './QuestionItem'\r\nimport { useSelector } from 'react-redux'\r\nimport { selectQuestionSetById } from '../../../reducers/survey_questionset'\r\nimport { selectQuestionsInQuestionSet, selectQuestions } from '../../../reducers/survey_question'\r\n/**\r\n * \r\n \r\nquestions={quizState.Questions}\r\nauthtoken={currentUser.AuthToken}\r\nresponseguid={quizState.ResponseGuid}\r\nstartfromBeginning={quizState.StartFromBeginning}\r\nuom={quizState.UnitOfMeasure}\r\nvalidationMessages={ValidationMessages}\r\nquestionPrompts={QuestionPrompts}\r\nupdateQuestionTotal={updateQuestionTotal}\r\nupdateQuestionsAnswered={updateQuestionsAnswered}\r\nsetCurrentIndex={setCurrentIndex} \r\ncompleteSuccessful={completeSuccessful}/>\r\n*/\r\n\r\nconst QuestionContainer =(props)=>{\r\n \r\n const QuestionSetId = props.QuestionSetId\r\n const Questions = useSelector((state) => selectQuestionsInQuestionSet(state, QuestionSetId))\r\n const QuestionSetHasContent = props.QuestionSetHasContent\r\n\r\n return (\r\n\r\n \r\n {\r\n Questions && Questions.map((x,i)=>{ \r\n return (\r\n \r\n )\r\n\r\n}\r\n\r\nexport default QuestionContainer","import React, { useState, useEffect } from 'react'\r\nimport { useDispatch, useSelector } from 'react-redux'\r\nimport { selectErrorMessagesByKeyName } from \"../../../reducers/reference_errormessages\"\r\n\r\n\r\nexport const ValueLimitation_Root = (ValueLimitationSlice, Object, ObjectArray, ValueLimitationType, ValueLimitationMin, ValueLimitationMax,ErrorMess) => {\r\n \r\n const QS_Total = ErrorMess['VAL QS TOTAL VALUE']\r\n const QS_Between = ErrorMess['VAL QS SELECT BETWEEN']\r\n var ValueLimitationFlag = true\r\n var ValueLimitationErrorMessage = ''\r\n if (ValueLimitationSlice === 'QUESTION SET') {\r\n\r\n if (ValueLimitationType === \"SUM\") {\r\n ValueLimitationFlag = ValueLimitation_Sum(ObjectArray, ValueLimitationMin, ValueLimitationMax)\r\n ValueLimitationErrorMessage = QS_Total && QS_Total.length>0 && QS_Total[0].MessageTypeContent.replace('<>',ValueLimitationMax).replace('<>',ValueLimitationMin) || ''\r\n }\r\n else if (ValueLimitationType === \"LIMIT YES ANSWER\") {\r\n ValueLimitationFlag = ValueLimitation_LimitAnswer(ObjectArray, Object, ValueLimitationMin, ValueLimitationMax)\r\n ValueLimitationErrorMessage = QS_Between && QS_Between.length>0 && QS_Between[0].MessageTypeContent.replace('<>',ValueLimitationMax).replace('<>',ValueLimitationMin) || ''\r\n }\r\n else if (ValueLimitationType === \"\") {\r\n ValueLimitationFlag = true\r\n ValueLimitationErrorMessage=''\r\n }\r\n }\r\n\r\n return {ValueLimitationFlag, ValueLimitationErrorMessage}\r\n}\r\n\r\nexport const ValueLimitation_Sum = (Questions, ValueLimitationMin, ValueLimitationMax) => {\r\n \r\n var sum = 0\r\n for (var q = 0; q < Questions.length; q++) {\r\n if (Questions[q].Responses && Questions[q].Responses.length > 0) {\r\n sum += parseFloat(Questions[q].Responses[0].Response ? Questions[q].Responses[0].Response : 0, 0)\r\n \r\n }\r\n }\r\n\r\n if (sum >= ValueLimitationMin && sum <= ValueLimitationMax) {\r\n return true\r\n } \r\n return false\r\n}\r\n\r\nexport const ValueLimitation_LimitAnswer = (Questions, Object, ValueLimitationMin, ValueLimitationMax) => {\r\n var sum = 0\r\n for (var q = 0; q < Questions.length; q++) {\r\n if (Questions[q].Responses && Questions[q].Responses.length > 0) {\r\n sum += Questions[q].Responses[0].Response === '42' ? 1 : 0\r\n }\r\n }\r\n\r\n if ((sum==0 && !Object.WasChanged) || (sum>= ValueLimitationMin && sum <= ValueLimitationMax)) {\r\n return true\r\n }\r\n\r\n return false\r\n}\r\n\r\n","import React, { useState, useEffect } from 'react'\r\n\r\nimport { questionSaveModify, SaveAnswer } from \"../../../reducers/survey_question\"\r\nimport { questionsetAnswerSaved } from \"../../../reducers/survey_questionset\"\r\n\r\n\r\n\r\n\r\nconst ClearQuestion = (val)=>{\r\n \r\n if (val.endsWith(' RACE DONT WANT TO SAY')){ return true}\r\n else if (val.endsWith(' CHOOSE NOT TO ANSWER')) {return true}\r\n else if (val.endsWith(' HOUSING PROBLEMS NONE')) {return true}\r\n return false\r\n}\r\n\r\nconst RaceQuestionSet = (val)=>{\r\n if (val.endsWith(' RACE')) {return true}\r\n else if (val.endsWith(' ETHNICITY')) {return true}\r\n else if (val.endsWith(' HOUSING PROBLEMS')) {return true}\r\n return false\r\n}\r\nfunction AdditionalSaveAnswerLogic(props) {\r\n \r\n\r\n const handleRaceCheckbox = () => {\r\n props.dispatch(SaveAnswer({\r\n auth: props.currentUser.AuthToken,\r\n response: props.responseGuid,\r\n questionID: props.Question.QuestionId,\r\n value: props.value\r\n }))\r\n\r\n props.dispatch(questionSaveModify({ QuestionId: props.Question.QuestionId, value: props.value }))\r\n if (\r\n ClearQuestion(props.Question.QuestionName) \r\n && props.value === '42'\r\n ) {\r\n // clear all race values\r\n for (var q = 0; q < props.Questions.length; q++) {\r\n if (props.Questions[q].QuestionId !== props.Question.QuestionId) {\r\n props.dispatch(SaveAnswer({\r\n auth: props.currentUser.AuthToken,\r\n response: props.responseGuid,\r\n questionID: props.Questions[q].QuestionId,\r\n value: '-1'\r\n })\r\n )\r\n props.dispatch(questionSaveModify({ QuestionId: props.Questions[q].QuestionId, value: '-1' }))\r\n }\r\n }\r\n }\r\n else {\r\n if (\r\n !ClearQuestion(props.Question.QuestionName)\r\n && props.value === '42'\r\n ) {\r\n let unMarkQuestions = props.Questions.filter((a) => { return ClearQuestion(a.QuestionName) })\r\n // clear all race values\r\n for (var q = 0; q < unMarkQuestions.length; q++) {\r\n if (unMarkQuestions[q].QuestionId !== props.Question.QuestionId) {\r\n props.dispatch(SaveAnswer({\r\n auth: props.currentUser.AuthToken,\r\n response: props.responseGuid,\r\n questionID: unMarkQuestions[q].QuestionId,\r\n value: '-1'\r\n })\r\n )\r\n props.dispatch(questionSaveModify({ QuestionId: unMarkQuestions[q].QuestionId, value: '-1' }))\r\n }\r\n }\r\n }\r\n }\r\n props.dispatch(questionsetAnswerSaved({ QuestionSetId: props.QuestionSet.QuestionSetId }))\r\n\r\n\r\n }\r\n\r\n \r\n if (props.QuestionSet && RaceQuestionSet(props.QuestionSet.QuestionSetName) ) {\r\n handleRaceCheckbox(props)\r\n }\r\n return true\r\n}\r\n\r\n\r\nexport default AdditionalSaveAnswerLogic","import React, { useState, useEffect } from 'react'\r\nimport { useDispatch, useSelector } from 'react-redux'\r\nimport { Typography, Paper, Box } from '@mui/material'\r\nimport QuestionContainer from './QuestionContainer'\r\nimport { questionsetAnswerSaved, questionsetValueLimitation, selectQuestionSetById } from '../../../reducers/survey_questionset'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { questionSaveModify, SaveAnswer, selectQuestionsInQuestionSet } from '../../../reducers/survey_question'\r\nimport {ValueLimitation_Root, ValueLimitation_LimitAnswer, ValueLimitation_Sum } from './ValidationFunctions'\r\nimport AdditionalSaveAnswerLogic from './SaveAnswerOverride'\r\nimport { selectErrorMessagesByKeyName } from '../../../reducers/reference_errormessages'\r\n/**\r\n * \r\n \r\nquestions={quizState.Questions}\r\nauthtoken={currentUser.AuthToken}\r\nresponseguid={quizState.ResponseGuid}\r\nstartfromBeginning={quizState.StartFromBeginning}\r\nuom={quizState.UnitOfMeasure}\r\nvalidationMessages={ValidationMessages}\r\nquestionPrompts={QuestionPrompts}\r\nupdateQuestionTotal={updateQuestionTotal}\r\nupdateQuestionsAnswered={updateQuestionsAnswered}\r\nsetCurrentIndex={setCurrentIndex} \r\ncompleteSuccessful={completeSuccessful}/>\r\n*/\r\n\r\nconst questionSetVariants = {\r\n offscreen: {\r\n scale: 0.9\r\n },\r\n onscreen: {\r\n scale: 1.2,\r\n transition: {\r\n duration: .4\r\n }\r\n }\r\n};\r\n\r\nconst QuestionSetItem = (props) => {\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const dispatch = useDispatch()\r\n\r\n const QuestionSet = useSelector((state) => selectQuestionSetById(state, props.QuestionSet.QuestionSetId))\r\n\r\n const Questions = useSelector((state) => selectQuestionsInQuestionSet(state, props.QuestionSet.QuestionSetId))\r\n const QS_Total = useSelector((state)=>selectErrorMessagesByKeyName(state,'VAL QS TOTAL VALUE'))\r\n const QS_Between = useSelector((state)=>selectErrorMessagesByKeyName(state,'VAL QS SELECT BETWEEN'))\r\n const ErrorMess = {\"VAL QS TOTAL VALUE\":QS_Total,\"VAL QS SELECT BETWEEN\":QS_Between}\r\n const [localState, setLocalState] = useState(QuestionSet)\r\n\r\n const QuestionSetHasContent = QuestionSet.QuestionSetStandardContent && QuestionSet.QuestionSetStandardContent.length > 3\r\n //const QuestionSetVisibilityFlag = QuestionSet.QuestionSetVisibilityFlag === '1' ? true : false\r\n\r\n const flag = Questions.find(question => question.QuestionDisplayedFlag === \"1\") ? true : false\r\n const ValueLimitationPassed = QuestionSet.ValueLimitationPassed\r\n const ValueLimitationError = QuestionSet.ValueLimitationError\r\n const { ValueLimitationType, ValueLimitationPrecision, ValueLimitationMin, ValueLimitationMax } = QuestionSet\r\n\r\n \r\n// convert to api\r\nconst SaveAnswerOverrideList =[\r\n 'LIMIT YES ANSWER'\r\n]\r\n const ValueLimitation = () => {\r\n const {ValueLimitationFlag, ValueLimitationErrorMessage} = ValueLimitation_Root('QUESTION SET', QuestionSet, Questions, ValueLimitationType, ValueLimitationMin, ValueLimitationMax,ErrorMess)\r\n\r\n dispatch(questionsetValueLimitation({ QuestionSetId: QuestionSet.QuestionSetId, ValueLimitationPassed: ValueLimitationFlag, ValueLimitationError: ValueLimitationErrorMessage }))\r\n\r\n }\r\n\r\n // useEffect(() => {\r\n // setFlag(Questions.find(question => question.QuestionDisplayedFlag === \"1\") ? true : false)\r\n // }, [Questions])\r\n\r\n useEffect(() => {\r\n if (QuestionSet.WasChanged === true) {\r\n ValueLimitation()\r\n }\r\n }, [QuestionSet, ValueLimitationPassed, ValueLimitationError, Questions])\r\n\r\n const saveAnswerOverride = (aprops) => {\r\n const prop_values = {\r\n ... aprops\r\n , QuestionSet: QuestionSet\r\n , Questions: Questions\r\n , currentUser : currentUser\r\n , responseGuid: props.responseGuid\r\n , dispatch: dispatch\r\n }\r\n AdditionalSaveAnswerLogic(prop_values)\r\n \r\n }\r\n\r\n\r\n return (\r\n\r\n \r\n \r\n \r\n \r\n \r\n {QuestionSet.QuestionSetStandardContent !== ''\r\n && (\r\n {QuestionSet.QuestionSetStandardContent} \r\n )\r\n }\r\n {\r\n ValueLimitationPassed === false && (\r\n \r\n *{ValueLimitationError} \r\n \r\n )\r\n }\r\n =0 ? true : false}\r\n key={\"QSQ_\" + QuestionSet.QuestionSetId}\r\n id={\"QSQ_\" + QuestionSet.QuestionSetId}\r\n responseGuid={props.responseGuid}\r\n Sequence={QuestionSet.QuestionSetSequence}\r\n />\r\n \r\n \r\n \r\n \r\n\r\n \r\n )\r\n\r\n}\r\n\r\nexport default QuestionSetItem","import React from 'react'\r\nimport { Box } from '@mui/material'\r\nimport QuestionSetItem from './QuestionSetItem'\r\nimport { selectQuestionSets } from '../../../reducers/survey_questionset'\r\nimport { useSelector } from 'react-redux'\r\n/**\r\n * \r\n \r\nquestions={quizState.Questions}\r\nauthtoken={currentUser.AuthToken}\r\nresponseguid={quizState.ResponseGuid}\r\nstartfromBeginning={quizState.StartFromBeginning}\r\nuom={quizState.UnitOfMeasure}\r\nvalidationMessages={ValidationMessages}\r\nquestionPrompts={QuestionPrompts}\r\nupdateQuestionTotal={updateQuestionTotal}\r\nupdateQuestionsAnswered={updateQuestionsAnswered}\r\nsetCurrentIndex={setCurrentIndex} \r\ncompleteSuccessful={completeSuccessful}/>\r\n*/\r\n\r\nconst QuestionSetContainer=(props)=>{\r\n \r\n const QuestionSets = useSelector(state=> selectQuestionSets(state))\r\n \r\n return (\r\n\r\n \r\n {\r\n QuestionSets && QuestionSets.sort((a,b) => a.QuestionSetSequence - b.QuestionSetSequence).map((x,i)=>{\r\n return (\r\n \r\n )\r\n })\r\n }\r\n \r\n )\r\n\r\n}\r\n\r\nexport default QuestionSetContainer","import React from 'react'\r\nimport { Box, Container } from '@mui/material'\r\nimport QuestionSetContainer from './QuestionSetContainer'\r\n/**\r\n * \r\n \r\nquestions={quizState.Questions}\r\nauthtoken={currentUser.AuthToken}\r\nresponseguid={quizState.ResponseGuid}\r\nstartfromBeginning={quizState.StartFromBeginning}\r\nuom={quizState.UnitOfMeasure}\r\nvalidationMessages={ValidationMessages}\r\nquestionPrompts={QuestionPrompts}\r\nupdateQuestionTotal={updateQuestionTotal}\r\nupdateQuestionsAnswered={updateQuestionsAnswered}\r\nsetCurrentIndex={setCurrentIndex} \r\ncompleteSuccessful={completeSuccessful}/>\r\n*/\r\n\r\n\r\n\r\nconst HRAContainer=(props)=>{\r\n\r\n \r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n )\r\n\r\n}\r\n\r\nexport default HRAContainer","import { createSlice, createSelector } from '@reduxjs/toolkit'\r\n\r\n// import { BASE_URL, OrganizationId, AuthToken } from '/features/storeconfig'\r\n\r\n\r\n\r\nconst initialState = {\r\n entities: {},\r\n status: 'idle', // idle loading success fail \r\n error: null\r\n}\r\n\r\n\r\n\r\nconst sectionSlice = createSlice({\r\n name: 'sections',\r\n initialState,\r\n reducers: {\r\n sectionAdd(state, action) {\r\n const sectionData = action.payload\r\n state.entities[sectionData.SectionId] = sectionData\r\n },\r\n sectionModify(state, action) {\r\n const sectionData = action.payload\r\n state.entities[sectionData.SectionId] = sectionData\r\n },\r\n sectionDelete(state, action) {\r\n const sectionData = action.payload\r\n delete state.entities[sectionData.SectionId]\r\n },\r\n sectionHydrate(state, action) {\r\n const sectionData = action.payload\r\n state.entities=sectionData\r\n state.status = 'success'\r\n },\r\n sectionClear(state,action) {\r\n state.status = 'idle'\r\n }\r\n }\r\n})\r\n\r\nexport const { sectionAdd, sectionModify, sectionDelete, sectionHydrate } = sectionSlice.actions\r\n\r\nexport default sectionSlice.reducer\r\n\r\nconst selectSectionEntities = (state) => state.sections.entities\r\n\r\nexport const selectSections = createSelector(selectSectionEntities, (entities) =>\r\n Object.values(entities)\r\n)\r\n\r\nexport const selectSectionById = (state, SectionId) => {\r\n return selectSectionEntities(state)[SectionId]\r\n}\r\n\r\nexport const selectSectionsInCurrentSurvey = createSelector(\r\n selectSections\r\n , (state, SurveyId) => SurveyId\r\n , (sections, SurveyId) => {\r\n\r\n return sections.filter((section) => {\r\n return section.SurveyId === SurveyId\r\n })\r\n }\r\n\r\n)","import React, { useState, useEffect } from \"react\";\r\nimport { useNavigate, useSearchParams, createSearchParams, useLocation } from 'react-router-dom';\r\nimport { useSelector, useDispatch } from 'react-redux'\r\nimport Header from \"./layouts/Header\";\r\nimport Loading from \"./Loading\";\r\nimport { getViewInstance } from \"../actions/viewinstance\";\r\nimport ProgressBar from \"./partials/hra/ProgressBar\";\r\nimport { Button, Container, ButtonGroup, IconButton, Paper, Grid, Skeleton } from \"@mui/material\";\r\nimport KeyboardArrowUpIcon from '@mui/icons-material/KeyboardArrowUp';\r\nimport KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown';\r\nimport { LoadingButton } from \"@mui/lab\"\r\nimport HRAContainer from \"./partials/hra/HRAContainer\";\r\nimport { questionsetHydrate, selectQuestionSets } from \"../reducers/survey_questionset\";\r\nimport { sectionHydrate } from \"../reducers/survey_section\";\r\nimport { questionHydrate, selectQuestions } from \"../reducers/survey_question\";\r\nimport { surveyHydrate } from \"../reducers/survey\";\r\nimport Footer from \"./layouts/Footer\";\r\nimport { Box } from \"@mui/system\";\r\nimport { viewinstanceClear } from \"../reducers/reuseable_vi\";\r\n\r\nconst HRA2 = (props) => {\r\n\r\n const dispatch = useDispatch();\r\n const navigate = useNavigate();\r\n const location = useLocation();\r\n\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const [loading, setLoading] = useState(false);\r\n const [callVI, setCallVI] = useState(false)\r\n const { viewInstance, settings } = useSelector(state => state.viewinstance)\r\n const [searchParams, setSearchParams] = useSearchParams();\r\n\r\n const surveyStatus = useSelector(state => state.surveys.status)\r\n const sectionStatus = useSelector(state => state.sections.status)\r\n const questionsetStatus = useSelector(state => state.questionsets.status)\r\n const questionStatus = useSelector(state => state.questions.status)\r\n\r\n const errorQSs = useSelector((state) => selectQuestionSets(state).filter(item => item.ValueLimitationError && !item.ValueLimitationPassed))\r\n\r\n const Questions = useSelector((state) => selectQuestions(state)).sort((a, b) => a.QuestionSetSequence - b.QuestionSetSequence || a.QuestionSequence - b.QuestionSequence)\r\n\r\n const [hasErrors, setHasErrors] = useState(false)\r\n const [isCompleting, setIsCompleting] = useState(false)\r\n const [isLoading, setIsLoading] = useState(false)\r\n const [quizState, setQuizState] = useState({\r\n Questions: [],\r\n Username: '',\r\n AuthToken: '',\r\n ParticipantGuid: '',\r\n ResponseGuid: '',\r\n QuizsDirection: 'left',\r\n QuestionsAnswered: 0,\r\n QuestionTotal: 1,\r\n UnitOfMeasure: 'IMPERIAL',\r\n LoadingError: false,\r\n ErrorViewInstance: [],\r\n isTimedOut: false,\r\n CurrentIndex: 0,\r\n StartingAssessment: false\r\n })\r\n\r\n const [unansweredQuestions, setUnansweredQuestions] = useState({\r\n Questions: [],\r\n Index: 0\r\n })\r\n\r\n useEffect(() => {\r\n\r\n if (surveyStatus === 'idle' && quizState && quizState.Questions && quizState.Questions.SurveyData) {\r\n const surveyData = quizState.Questions.SurveyData\r\n // right now survey data only has 1 questionset\r\n const Sections = {}\r\n const QuestionSets = {}\r\n const Questions = {}\r\n for (var s = 0; s < surveyData.length; s++) {\r\n // split 'Sections' out of the current object. \r\n const { QuestionSetQuestionSet, ...SectionObject } = surveyData[s]\r\n // no parent id to add\r\n Sections[SectionObject.QuestionSetId] = SectionObject\r\n\r\n for (var qs = 0; qs < QuestionSetQuestionSet.length; qs++) {\r\n // split questionsetquestions out of the current object. \r\n const { QuestionSetQuestions, ...QuestionSetObject } = QuestionSetQuestionSet[qs]\r\n // add parent id\r\n QuestionSets[QuestionSetObject.QuestionSetId] = { ...QuestionSetObject, SectionId: SectionObject.QuestionSetId, WasChanged: false }\r\n\r\n for (var q = 0; q < QuestionSetQuestions.length; q++) {\r\n const QuestionObject = { ...QuestionSetQuestions[q], QuestionSetId: QuestionSetObject.QuestionSetId, QuestionSetSequence: QuestionSetObject.QuestionSetSequence, QuestionSetName: QuestionSetObject.QuestionSetName }\r\n // add parent id\r\n Questions[QuestionObject.QuestionId] = QuestionObject\r\n }\r\n }\r\n }\r\n\r\n setIsLoading(true)\r\n\r\n dispatch(sectionHydrate(Sections))\r\n dispatch(questionsetHydrate(QuestionSets))\r\n dispatch(questionHydrate(Questions))\r\n dispatch(surveyHydrate())\r\n dispatch(viewinstanceClear({ ViewInstanceId: \"HomePage\" }))\r\n\r\n }\r\n }, [surveyStatus, quizState, dispatch])\r\n\r\n useEffect(() => {\r\n if (surveyStatus == \"success\" && Questions.length && isLoading) {\r\n setIsLoading(false)\r\n scrollToFirstUnanswered()\r\n }\r\n }, [surveyStatus, Questions])\r\n\r\n useEffect(() => {\r\n if (!callVI && (!viewInstance || !viewInstance.SurveyPage) && currentUser && currentUser.AuthToken) {\r\n setCallVI(true);\r\n let vi = searchParams.get('vi')\r\n dispatch(getViewInstance('B87190C3-B9C8-41D7-A1C8-10E07FBA0D3E', currentUser.AuthToken))\r\n }\r\n }, [location.pathname])\r\n\r\n useEffect(() => {\r\n //IF EMPTY VI OR NOT THE DESIRED VI AND THE VI HAS NOT BEEN CALLED YET\r\n if ((!quizState.Questions.length && !quizState.StartingAssessment && settings && viewInstance && viewInstance.SurveyPage)) {\r\n setQuizState({ ...quizState, StartingAssessment: true })\r\n getAssmtGuid()\r\n }\r\n //WINDOW.LOCATION PROVIDES EXTRA CONTEXT SO WHEN TEH URL UPDATES THE APP UPDATES\r\n }, [viewInstance, settings])\r\n\r\n const getAssmtGuid = () => {\r\n let responseGuid = ''\r\n let asmtprodguid = viewInstance && viewInstance.SurveyPage && viewInstance.SurveyPage.AssessmentProductGuid ? viewInstance.SurveyPage.AssessmentProductGuid : 'No%20%Product%20%Guid'\r\n const productGuid = settings.PersonSettingValues['ASSMT PRODUCT GUID'] ? settings.PersonSettingValues['ASSMT PRODUCT GUID'] : settings.OrganizationSettingValues['ASSMT PRODUCT GUID'] ? settings.OrganizationSettingValues['ASSMT PRODUCT GUID'] : asmtprodguid\r\n\r\n // commented out the participant setting code, it was causing issues with multi HRA modes\r\n // this should be reused when we use querystring params (product+response/assmtguid)\r\n\r\n // fetch('../../WsWebServicePlatform/Participant/Setting/Set/' + currentUser.AuthToken + '/' + settings.SessionVariableValues[\"PERSON GUID\"] + '/ASSMT%20PRODUCT%20GUID/' \r\n // + ( productGuid) + '/', {\r\n // method: \"POST\",\r\n // headers: {\r\n // 'Accept': 'application/json',\r\n // 'Content-Type': 'application/json'\r\n // },\r\n // body: {\r\n // }\r\n // })\r\n // .then(response => response.json())\r\n // .then(response => {\r\n // if (response.Success) {\r\n fetch('../../WsWebServicePlatform/Participant/SessionVar/Get/' + currentUser.AuthToken + '/RESPONSE%20GUID' + '/')\r\n .then(response => response.json())\r\n .then(response => {\r\n if (!response.Info.length) {\r\n fetch('../../WsWebServicePlatform/Participant/Setting/Get/' + currentUser.AuthToken + '/' + settings.SessionVariableValues['PERSON GUID'] + '/ASSMT%20PRODUCT%20GUID' + '/')\r\n .then(response => response.json())\r\n .then(\r\n response => {\r\n let asmtguid = (response && response.Info.length > 0) ? response.Info[0].SettingText ? response.Info[0].SettingText : productGuid : productGuid\r\n fetch('../../WsWebServiceHra/StartAssessment/' + currentUser.AuthToken + '/' + asmtguid + '/',\r\n {\r\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n\r\n }\r\n })\r\n .then(response => response.json())\r\n .then(response => {\r\n getQuestions(response.Info[0].AssmtGuid)\r\n setQuizState({\r\n ...quizState,\r\n ResponseGuid: response.Info[0].AssmtGuid,\r\n StartingAssessment: false\r\n })\r\n storeAssmtGuidToSession(response.Info[0].AssmtGuid)\r\n //setSearchParams('assmtGuid', response.Info[0].AssmtGuid)\r\n })\r\n }\r\n )\r\n \r\n\r\n }\r\n\r\n else {\r\n responseGuid = response.Info[0].Value\r\n getQuestions(responseGuid)\r\n setQuizState({\r\n ...quizState,\r\n ResponseGuid: responseGuid,\r\n StartingAssessment: false\r\n })\r\n //storeAssmtGuidToSession(response.Info[0].Value)\r\n //setSearchParams('assmtGuid', response.Info[0].Value)\r\n //this is for test login and othe rpages that send assmtGuid through session\r\n }\r\n\r\n })\r\n // }\r\n\r\n // })\r\n }\r\n\r\n useEffect(() => {\r\n }, quizState.ResponseGuid)\r\n\r\n\r\n const scrollToFirstUnanswered = () => {\r\n let limitationCounter = 0\r\n\r\n\r\n\r\n let lastAnswered = settings.ResponseSettingValues[\"LAST QUESTION ANSWERED\"]\r\n let lastAnsweredIndex = -1\r\n let element = null\r\n for (let i = 0; i < Questions.length; i++) {\r\n if (lastAnswered = Questions[i].QuestionId) lastAnsweredIndex = Questions[i].QuestionSetId;\r\n\r\n if (Questions[i].QuestionSetName.indexOf(\"RACE\") > 0) {\r\n if (Questions[i].Responses[0].Response.length) {\r\n limitationCounter++\r\n }\r\n if (Questions[i + 1] && !Questions[i + 1].QuestionSetName.indexOf(\"RACE\") && limitationCounter === 0) {\r\n //if the next question is no longer RACE, if none are answered scroll to\r\n element = document.getElementById(\"QS_\" + Questions[i].QuestionSetId)\r\n\r\n }\r\n } else {\r\n if (!Questions[i].Responses[0].Response.length && Questions[i].QuestionDisplayedFlag === \"1\" && Questions[i].QuestionRequiredFlag === \"1\") {\r\n element = document.getElementById(\"QS_\" + Questions[i].QuestionSetId)\r\n\r\n }\r\n }\r\n\r\n if ((lastAnswered > 0 && lastAnsweredIndex >= 0 && element) || (lastAnswered <= 0 && element)) break;\r\n }\r\n\r\n if (lastAnsweredIndex && element && document.getElementById(\"QS_\" + lastAnsweredIndex) && document.getElementById(\"QS_\" + lastAnsweredIndex).offsetTop < element.offsetTop) {\r\n\r\n document.getElementById(\"QS_\" + lastAnsweredIndex).scrollIntoView({\r\n block: \"center\",\r\n behavior: \"smooth\"\r\n })\r\n\r\n } else {\r\n if (element) {\r\n element.scrollIntoView({\r\n block: \"center\",\r\n behavior: \"smooth\"\r\n })\r\n }\r\n }\r\n }\r\n const storeAssmtGuidToSession = (assmtGuid) => {\r\n if (searchParams.get(\"asAuthToken\")) {\r\n fetch(\"../../WsWebServicePlatform/Participant/SessionVar/Set/\" + searchParams.get('asAuthToken') + '/RESPONSE%20GUID/' + assmtGuid + '/', {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n } else {\r\n fetch(\"../../WsWebServicePlatform/Participant/SessionVar/Set/\" + currentUser.AuthToken + '/RESPONSE%20GUID/' + assmtGuid + '/', {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n }\r\n }\r\n\r\n const getQuestions = (responseGuid) => {\r\n\r\n fetch('../../WsWebServiceWellSuite/GetViewInstance/' + currentUser.AuthToken + '/8C292A8F-C14E-470B-A164-015F1CB2E2DD/',\r\n {\r\n method: 'GET',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n\r\n }\r\n })\r\n .then(response => response.json())\r\n .then(response => {\r\n setQuizState({\r\n ...quizState,\r\n Questions: response.Info[0].ViewInstanceData[0].SurveyPage,\r\n StartFromBeginning: true,\r\n ResponseGuid: responseGuid,\r\n UnitOfMeasure: response.Info[0].ViewInstanceData[1].SessionVariableValues[\"UNIT OF MEASURE\"]\r\n })\r\n })\r\n }\r\n\r\n /*setClientColor(clientColor){\r\n theme = createMuiTheme({\r\n palette: {\r\n primary: {\r\n main: clientColor\r\n }\r\n }\r\n })} */\r\n\r\n const checkForErrors = () => {\r\n if (errorQSs.length) {\r\n document.getElementById('QS_' + errorQSs[0].QuestionSetId).scrollIntoView({\r\n block: \"center\",\r\n behavior: \"smooth\"\r\n })\r\n } else {\r\n completeAssessment()\r\n }\r\n }\r\n\r\n const completeAssessment = () => {\r\n setIsCompleting(true)\r\n setTimeout(() => {\r\n fetch('../../WsWebServiceHra/CompleteAssessment/' + currentUser.AuthToken + '/' + quizState.ResponseGuid + '/',\r\n {\r\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n \r\n }\r\n })\r\n .then(response => response.json())\r\n .then(response => {\r\n if (response.Success) {\r\n \r\n //this.props.completeSuccessful(true)\r\n \r\n completeSuccessful(true)\r\n } else {\r\n \r\n \r\n setIsCompleting(false)\r\n if (response.Status[0].ErrorID === -3) {\r\n setHasErrors(true)\r\n setUnansweredQuestions({\r\n ...unansweredQuestions,\r\n Questions: response.Status\r\n })\r\n document.getElementById(\"Q_\" + response.Status[0].ErrorMessage).scrollIntoView({\r\n block: 'center',\r\n behavior: 'smooth'\r\n })\r\n }\r\n /*if(response.Info.length){\r\n \r\n }*/\r\n }\r\n })\r\n }, 1000);\r\n \r\n }\r\n\r\n const completeSuccessful = (didCompleteSuccessfully) => {\r\n if (didCompleteSuccessfully) {\r\n navigate({ pathname: '/personalreport', search: createSearchParams({ vi: '8AC17D1E-2871-44D9-ACC0-867285149337', assmtguid: currentUser.AuthToken }).toString() })\r\n\r\n }\r\n }\r\n\r\n const scrollToUnanswered = (direction) => {\r\n if (direction === 'up') {\r\n if (unansweredQuestions.Index != 0) {\r\n document.getElementById(\"Q_\" + unansweredQuestions.Questions[unansweredQuestions.Index - 1].ErrorMessage).scrollIntoView({\r\n block: 'center',\r\n behavior: 'smooth'\r\n })\r\n setUnansweredQuestions({ ...unansweredQuestions, Index: unansweredQuestions.Index - 1 })\r\n }\r\n }\r\n if (direction === 'down') {\r\n if (unansweredQuestions.Index != unansweredQuestions.Questions.length - 1) {\r\n document.getElementById(\"Q_\" + unansweredQuestions.Questions[unansweredQuestions.Index + 1].ErrorMessage).scrollIntoView({\r\n block: 'center',\r\n behavior: 'smooth'\r\n })\r\n setUnansweredQuestions({ ...unansweredQuestions, Index: unansweredQuestions.Index + 1 })\r\n }\r\n }\r\n }\r\n\r\n if (surveyStatus === 'success' && settings) {\r\n let progressBar\r\n let status = 'active'\r\n return (\r\n \r\n
\r\n
\r\n
\r\n\r\n
\r\n\r\n
\r\n {!hasErrors &&\r\n \r\n {isCompleting && \r\n {viewInstance?.SurveyPage?.OtherLabels?.CompleteButtonText || \"Complete\"}\r\n }\r\n {!isCompleting && checkForErrors()}\r\n sx={{ padding: '35px 50px 35px 50px', fontSize: 'larger' }}>{viewInstance?.SurveyPage?.OtherLabels?.CompleteButtonText || \"Complete\"} }\r\n\r\n }\r\n {hasErrors &&\r\n \r\n \r\n \r\n\r\n \r\n scrollToUnanswered('up')}> \r\n {\r\n isCompleting && {viewInstance?.SurveyPage?.OtherLabels?.CompleteButtonText || \"Complete\"} \r\n }\r\n {\r\n !isCompleting && completeAssessment()}>{viewInstance?.SurveyPage?.OtherLabels?.CompleteButtonText || \"Complete\"} \r\n }\r\n\r\n scrollToUnanswered('down')}> \r\n \r\n \r\n \r\n\r\n }\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n {[0, 1, 2, 3, 4, 5, 6, 7, 8].map(x => {\r\n return (\r\n \r\n \r\n \r\n \r\n )\r\n })\r\n }\r\n \r\n
\r\n
\r\n\r\n\r\n
\r\n\r\n\r\n \r\n {viewInstance.ProfileVI.MenuProfile.ProfileText.EmailHeader} \r\n \r\n \r\n 0 && EmailError[0].MessageTypeContent}\r\n required={viewInstance.ProfileVI.MenuProfile.ProfileEmailFrame.EmailRequiredFlag === \"1\"}\r\n disabled={viewInstance.ProfileVI.MenuProfile.ProfileEmailFrame.EmailReadOnlyFlags === \"1\"}\r\n onChange={(e) => { setParamData({ ...paramData, Email: e.target.value }) }}\r\n onBlur={(e) => { setParamData({ ...paramData, validEmail: validateEmail(e.target.value) }) }}\r\n />\r\n\r\n \r\n \r\n {viewInstance.ProfileVI.MenuProfile.ProfileText.NameHeader} \r\n \r\n \r\n \r\n\r\n \r\n 0 && FirstNameError[0].MessageTypeContent}\r\n required={viewInstance.ProfileVI.MenuProfile.ProfileNameFrame.ProfileNameFirstNameTextBox.FirstNameRequiredFlag === \"1\"}\r\n disabled={viewInstance.ProfileVI.MenuProfile.ProfileNameFrame.ProfileNameFirstNameTextBox.FirstNameReadOnlyFlag === \"1\"}\r\n onChange={(e) => { setParamData({ ...paramData, FirstName: e.target.value, validFirstName: validateFirstName(e.target.value) }) }}\r\n onBlur={(e) => { setParamData({ ...paramData, validFirstName: validateFirstName(e.target.value) }) }}\r\n inputProps={{\r\n autocomplete: 'given-name'\r\n }}\r\n />\r\n \r\n \r\n 0 && LastNameError[0].MessageTypeContent}\r\n required={viewInstance.ProfileVI.MenuProfile.ProfileNameFrame.ProfileNameLastNameTextBox.LastNameRequiredFlag === \"1\"}\r\n disabled={viewInstance.ProfileVI.MenuProfile.ProfileNameFrame.ProfileNameLastNameTextBox.LastNameReadOnlyFlag === \"1\"}\r\n onChange={(e) => { setParamData({ ...paramData, LastName: e.target.value, validLastName: validateLastName(e.target.value) }) }}\r\n onBlur={(e) => { setParamData({ ...paramData, validLastName: validateLastName(e.target.value) }) }}\r\n inputProps={{\r\n autocomplete: 'family-name'\r\n }}\r\n />\r\n \r\n \r\n \r\n \r\n {viewInstance.ProfileVI.MenuProfile.ProfileText.PersonalHeader} \r\n \r\n \r\n \r\n \r\n \r\n {\r\n setParamData({ ...paramData, BioDOB: dayjs(newValue).format('MM-DD-YYYY'), validDoB: validateDoB(dayjs(newValue).format('MM-DD-YYYY')) });\r\n }}\r\n\r\n onBlur={(newValue) => { setParamData({ ...paramData, BioDOB: dayjs(newValue).format('MM-DD-YYYY'), validDoB: validateDoB(dayjs(newValue).format('MM-DD-YYYY')) }) }}\r\n renderInput={(params) => 0 && DobError[0].MessageTypeContent\r\n // 'Date of birth is invalid or age is outside of accepted range of '+settings.organization[\"AGE MIN\"]+'-'+settings.organization[\"AGE MAX\"]+'.'\r\n } />}\r\n disableFuture\r\n />\r\n \r\n\r\n \r\n \r\n option.EducationTypeName}\r\n isOptionEqualToValue={(option, value) => { return option.EducationTypeGuid === value.EducationTypeGuid }}\r\n onChange={(e, newValue) => { setParamData({ ...paramData, EducationLevelGuid: newValue, validEducation: validateEducation(newValue) }) }}\r\n size=\"small\"\r\n renderInput={(params) => \r\n \r\n option.GenderTypeName}\r\n getOptionSelected={(option, value) => {\r\n if (value) {\r\n return true;\r\n } else if (value === option) {\r\n return true;\r\n }\r\n }}\r\n isOptionEqualToValue={(option, value) => { return option.GenderTypeId === value.GenderTypeId }}\r\n size=\"small\"\r\n renderInput={(params) => \r\n \r\n option.StandardContent}\r\n autoHighlight={false}\r\n value={paramData.SpokenLanguageID || null}\r\n isOptionEqualToValue={(option, value) => { return option.SpokenLanguageID === value.SpokenLanguageID }}\r\n renderInput={(params) => \r\n \r\n option.RaceTypeName}\r\n isOptionEqualToValue={(option, value) => { return option.RaceTypeID === value.RaceTypeID }}\r\n\r\n autoHighlight={false}\r\n value={paramData.BioRace || null}\r\n renderInput={(params) => \r\n \r\n \r\n \r\n {viewInstance.ProfileVI.MenuProfile.ProfileText.AddressHeader} \r\n \r\n \r\n \r\n \r\n option.StandardContent}\r\n isOptionEqualToValue={(option, value) => { return option.CountryCode === value.CountryCode }}\r\n autoHighlight={false}\r\n autoSelect\r\n value={paramData.CountryCode || null}\r\n renderInput={(params) => \r\n \r\n { setParamData({ ...paramData, ZipCode: e.target.value, validZipCode: validateZipCode(e.target.value) }) }}\r\n size=\"small\"\r\n inputProps={{\r\n autocomplete: 'postal-code'\r\n }}\r\n />\r\n \r\n \r\n \r\n\r\n \r\n saveProfile()}>{viewInstance.ProfileVI.MenuProfile.SaveButton} \r\n\r\n \r\n\r\n\r\n\r\n \r\n\r\n\r\n
\r\n \r\n {viewInstance.ProfileVI.MenuProfile.ProfileGreeting} \r\n \r\n \r\n {viewInstance.ProfileVI.MenuProfile.ProfileSubgreeting} \r\n \r\n \r\n \r\n \r\n\r\n\r\n )\r\n\r\n}\r\n\r\nexport default ProfileDemographicsCard","import React, { useState } from 'react'\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Button, Box, Dialog, DialogContent, Stack, Typography, Modal, Tooltip as TT, IconButton, ButtonGroup, Grid } from '@mui/material'\r\n\r\nimport EditIcon from '@mui/icons-material/Edit';\r\n\r\nimport { selectGlobalSettingEntities } from '../../../reducers/reference_settings';\r\nimport { selectViewInstanceById } from '../../../reducers/reuseable_vi';\r\nimport { useNavigate, createSearchParams } from 'react-router-dom'\r\n\r\nconst AssessmentEditButton = ( props) => {\r\n const row = props.row\r\n const navigate = useNavigate()\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const settings = useSelector(state => selectGlobalSettingEntities(state))\r\n const viewInstance = useSelector(state => selectViewInstanceById(state, \"ProfileDemographics\"))\r\n const PrevAsmtsText = viewInstance?.ProfileVI?.MenuProfile?.PreviousAssessmentsFrame.PreviousAssessmentTextObject ?\r\n viewInstance.ProfileVI.MenuProfile.PreviousAssessmentsFrame.PreviousAssessmentTextObject\r\n : {}\r\n const [guid, setGuid] = useState(\"\")\r\n const [open, setOpen] = useState(false)\r\n const handleStartEdit = (row) => {\r\n if (row.AssmtGuid) {\r\n fetch('../../WsWebServicePlatform/Participant/Setting/Set/' + currentUser.AuthToken + '/' + settings.session[\"PERSON GUID\"] + '/ASSMT%20PRODUCT%20GUID/' + row.AssessmentProductGuid + '/', {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n .then(fetch('../../WsWebServicePlatform/Participant/SessionVar/Set/' + currentUser.AuthToken + '/RESPONSE%20GUID/' + row.AssmtGuid + '/', {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n .then(response => {\r\n\r\n navigate({ pathname: '/hra', search: createSearchParams({ vi: 'D58CC25B-BB6A-439D-B3D7-BA37AD1AB701', assmtguid: row.AssmtGuid }).toString() })\r\n })\r\n )\r\n }\r\n }\r\n const handleEditClick = (row) => {\r\n\r\n setOpen(true)\r\n setGuid(guid)\r\n }\r\n const handleClose = () => {\r\n setOpen(false)\r\n }\r\n return (\r\n \r\n \r\n \r\n {PrevAsmtsText.EditAssessmentWarning.Text} \r\n handleStartEdit(row)}>{PrevAsmtsText.EditAssessmentWarning.Continue} \r\n handleClose()}>{PrevAsmtsText.EditAssessmentWarning.Exit} \r\n \r\n \r\n \r\n handleEditClick(row)} >\r\n \r\n \r\n \r\n\r\n )\r\n\r\n}\r\n\r\nexport default AssessmentEditButton","import React, { useState } from 'react'\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Button, Box, Dialog, DialogContent, Stack, Typography, Modal, Tooltip, IconButton, ButtonGroup, Grid } from '@mui/material'\r\n\r\nimport SummarizeIcon from '@mui/icons-material/Summarize';\r\nimport AssessmentIcon from '@mui/icons-material/Assessment';\r\n\r\nimport { selectViewInstanceById } from '../../../reducers/reuseable_vi';\r\nimport { useNavigate, createSearchParams } from 'react-router-dom'\r\n\r\nconst AssessmentPersonalReportButton = ( props) => {\r\n const row = props.row\r\n const navigate = useNavigate()\r\n const graphcolors = ['#c0c0c0', '#4eb748', '#E7C61E', '#E6323A']\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const viewInstance = useSelector(state => selectViewInstanceById(state, \"ProfileDemographics\"))\r\n const PrevAsmtsText = viewInstance?.ProfileVI?.MenuProfile?.PreviousAssessmentsFrame.PreviousAssessmentTextObject ?\r\n viewInstance.ProfileVI.MenuProfile.PreviousAssessmentsFrame.PreviousAssessmentTextObject\r\n : {}\r\n \r\n const handlePRClick = (row) => {\r\n if (row.AssmtGuid) {\r\n \r\n fetch('../../WsWebServicePlatform/Participant/SessionVar/Set/' + currentUser.AuthToken + '/RESPONSE%20GUID/' + row.AssmtGuid + '/', {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n .then(response => response.json())\r\n .then(response => {\r\n navigate({ pathname: '/personalreport', search: createSearchParams({ vi: '8AC17D1E-2871-44D9-ACC0-867285149337' }).toString() })\r\n })\r\n }\r\n }\r\n \r\n if (row.PrViGuid &&\r\n row.PrViGuid.length > 0) {\r\n return (\r\n \r\n handlePRClick(row)}\r\n >\r\n \r\n \r\n \r\n )\r\n }\r\n else {\r\n return (\r\n <>\r\n )\r\n }\r\n\r\n}\r\n\r\nexport default AssessmentPersonalReportButton","import React, { useState } from 'react'\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Button, Box, Dialog, DialogContent, Stack, Typography, Modal, Tooltip, IconButton, ButtonGroup, Grid } from '@mui/material'\r\n\r\nimport SummarizeIcon from '@mui/icons-material/Summarize';\r\n\r\nimport { selectViewInstanceById } from '../../../reducers/reuseable_vi';\r\nimport { useNavigate, createSearchParams } from 'react-router-dom'\r\n\r\nconst AssessmentPhysicianSummaryButton = ( props) => {\r\n const row = props.row\r\n const navigate = useNavigate()\r\n const graphcolors = ['#c0c0c0', '#4eb748', '#E7C61E', '#E6323A']\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const viewInstance = useSelector(state => selectViewInstanceById(state, \"ProfileDemographics\"))\r\n const PrevAsmtsText = viewInstance?.ProfileVI?.MenuProfile?.PreviousAssessmentsFrame.PreviousAssessmentTextObject ?\r\n viewInstance.ProfileVI.MenuProfile.PreviousAssessmentsFrame.PreviousAssessmentTextObject\r\n : {}\r\n\r\n const handlePSClick = (row) => {\r\n\r\n\r\n if (row.AssmtGuid) {\r\n fetch('../../WsWebServicePlatform/Participant/SessionVar/Set/' + currentUser.AuthToken + '/RESPONSE%20GUID/' + row.AssmtGuid + '/', {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n .then(response => response.json())\r\n .then(response => {\r\n navigate({ pathname: '/physiciansummary', search: createSearchParams({ vi: '2C2870C1-1C00-4E67-98FF-04BA402C6824' }).toString() })\r\n }\r\n )\r\n }\r\n }\r\n const PRIconButton = ()=>{\r\n return (\r\n\r\n \r\n handlePSClick(row)} >\r\n \r\n \r\n \r\n )\r\n }\r\n\r\n const PRContainedButton = ()=>{\r\n return (\r\n \r\n handlePSClick(row)} >\r\n \r\n {PrevAsmtsText.GetPhySummText}\r\n \r\n \r\n )\r\n }\r\n if (row.PsViGuid &&\r\n row.PsViGuid.length > 0) {\r\n return props.mobile ? \r\n \r\n )\r\n }\r\n\r\n\r\n\r\n const CompletedControl = ({ row }) => {\r\n\r\n return row.IsCompleted === '1' ? \r\n \r\n }\r\n\r\n /*\r\n \"AssmtGuid\": \"B43122FB-9A5F-4671-B436-C5BE6DE1DD37\",\r\n \"AssessmentProductGuid\": \"42AB6722-BAFC-4A59-8996-10A7C402C03E\",\r\n \"DateStarted\": \"2024-07-11\",\r\n \"DateFirstCalc\": \"2024-07-11\",\r\n \"DateMostRecentCalc\": \"2024-07-11\",\r\n \"SurveyContent\": \"Risk of Breast Cancer\",\r\n \"Ows\": \"29\",\r\n \"OwsCaption\": \"\",\r\n \"PrViGuid\": \"941B82A8-9B89-42CB-9601-C1567D6E38F0\",\r\n \"PsViGuid\": \"\",\r\n \"IsCompleted\": \"1\",\r\n \"EditAssessmentVisible\": \"1\"\r\n */\r\n\r\n const handleScoreCompare = (v1,v2,param1,param2)=> param2.api.getRow(param2.id).Ows - param1.api.getRow(param1.id).Ows\r\n\r\n const columns = [\r\n {field: \"Score\", flex: 0.5, width: \"60px\", renderCell: (params) => {params.row.SurveyContent} {\"First Calculated: \" + String(params.row.DateFirstCalc) +\"\\n\" + \"Most Recent Calc: \"+ String(params.row.DateMostRecentCalc)}}>{params.row.DateStarted} }\r\n , { field: \"DateStarted\", flex: 1, display: false, editable: false}\r\n , { field: \"Reports\", flex: 1, minWidth: 50, renderCell: (params) => \r\n row.AssmtGuid}\r\n density=\"comfortable\"\r\n sx={{ '&, [class^=MuiDataGrid]': { border: 'none' } }}\r\n initialState={{\r\n pagination: { pageSize: 10 }\r\n , columns: {\r\n columnVisibilityModel: {\r\n AssmtGuid: false\r\n , AssessmentProductGuid: false\r\n , DateFirstCalc: false\r\n , DateMostRecentCalc: false\r\n , Ows: false\r\n , OwsCaption: false\r\n , SurveyContent: false\r\n , DateStarted: false\r\n , OwsCaption: false\r\n , PrViGuid: false\r\n , PsViGuid: false\r\n , IsCompleted: false\r\n , EditAssessmentVisible: false\r\n }\r\n }\r\n }}\r\n loading={viewInstance?.status === 'success' ? false : true}\r\n />\r\n \r\n )\r\n\r\n}\r\nexport default PreviousAssessmentTable","import React, { useState } from 'react'\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Button, Box, Dialog, DialogContent, Stack, Typography, Modal, Tooltip as TT, IconButton, ButtonGroup, Grid } from '@mui/material'\r\nimport { Doughnut } from 'react-chartjs-2'\r\nimport { Chart as ChartJS, ArcElement, Tooltip, Legend } from 'chart.js';\r\nimport _ from 'lodash'\r\n\r\n\r\nimport TaskAltIcon from '@mui/icons-material/TaskAlt';\r\nimport { selectGlobalSettingEntities } from '../../../reducers/reference_settings';\r\nimport { selectViewInstanceById } from '../../../reducers/reuseable_vi';\r\nimport { useNavigate, createSearchParams } from 'react-router-dom'\r\nimport AssessmentEditButton from './AssessmentEditButton';\r\nimport AssessmentPersonalReportButton from './AssessmentPersonalReportButton';\r\nimport AssessmentPhysicianSummaryButton from './AssessmentPhysicianSummaryButton';\r\nimport ExpandMoreIcon from '@mui/icons-material/ExpandMore';\r\nChartJS.register(ArcElement, Tooltip, Legend);\r\n\r\n\r\nconst PreviousAssessmentTableMobile = (props) => {\r\n const navigate = useNavigate()\r\n const graphcolors = ['#c0c0c0', '#4eb748', '#E7C61E', '#E6323A']\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const settings = useSelector(state => selectGlobalSettingEntities(state))\r\n const viewInstance = useSelector(state => selectViewInstanceById(state, \"ProfileDemographics\"))\r\n const PrevAsmts = viewInstance?.ProfileVI?.MenuProfile?.PreviousAssessmentsFrame?.PreviousAssessmentsSQL ?\r\n viewInstance.ProfileVI.MenuProfile.PreviousAssessmentsFrame.PreviousAssessmentsSQL\r\n : []\r\n const PrevAsmtsText = viewInstance?.ProfileVI?.MenuProfile?.PreviousAssessmentsFrame.PreviousAssessmentTextObject ?\r\n viewInstance.ProfileVI.MenuProfile.PreviousAssessmentsFrame.PreviousAssessmentTextObject\r\n : {}\r\n const GetColor = (score) => {\r\n\r\n const vg = parseInt((score <= 39 && score >= 0) ? 3 : (score <= 69 && score >= 0) ? 2 : (score <= 100 && score >= 0) ? 1 : 0)\r\n return graphcolors[vg]\r\n }\r\n\r\n\r\n\r\n\r\n\r\n\r\n const labelCenter = {\r\n id: \"labelCenter\",\r\n beforeDraw: function (chart) {\r\n var width = chart.width,\r\n height = chart.height,\r\n ctx = chart.ctx;\r\n ctx.restore();\r\n var fontSize = (height / 75).toFixed(2);\r\n ctx.font = fontSize + \"em sans-serif\";\r\n ctx.textBaseline = \"top\";\r\n var text = chart.config.options.beforeDrawHack,\r\n textX = Math.round((width - ctx.measureText(text).width) / 2),\r\n textY = Math.round((height - ctx.measureText(text).width) / 2);\r\n\r\n ctx.fillText(text, textX, textY);\r\n ctx.save();\r\n }\r\n };\r\n\r\n const OWSDoughnut = ({ row }) => {\r\n let OWS = parseInt(row.Ows, 0)\r\n const Color = row.IsCompleted === '1' ? GetColor(OWS) : GetColor(-1)\r\n const data = {\r\n datasets: [\r\n {\r\n\r\n data: row.IsCompleted === '1' ? [OWS, 100 - OWS] : [0, 100],\r\n backgroundColor: [\r\n Color,\r\n Color + \"40\"\r\n ],\r\n borderColor: [\r\n 'rgba(255, 99, 132, 0)',\r\n 'rgba(54, 162, 235, 0)',\r\n ],\r\n borderWidth: 0,\r\n },\r\n ],\r\n }\r\n const options = {\r\n responsive: true,\r\n cutout: '80%',\r\n animation: {\r\n animateRotate: true,\r\n render: false,\r\n },\r\n events: [],\r\n tooltips: {\r\n enabled: false\r\n },\r\n beforeDrawHack: row.IsCompleted === '1' ? OWS : \"-\",\r\n plugins: {\r\n legend: {\r\n display: false\r\n },\r\n labelCenter: {\r\n labels: [\r\n {\r\n text: row.IsCompleted === '1' ? OWS : \"-\",\r\n font: {\r\n size: 3.25,\r\n unit: \"rem\",\r\n color: 'black',\r\n style: \"bold\"\r\n }\r\n }\r\n ]\r\n }\r\n\r\n }\r\n }\r\n const plugins = [labelCenter]\r\n return (\r\n \r\n\r\n \r\n \r\n \r\n )\r\n }\r\n\r\n\r\n\r\n const CompletedControl = ({ row }) => {\r\n\r\n return row.IsCompleted === '1' ? \r\n \r\n }\r\n\r\n /*\r\n \"AssmtGuid\": \"B43122FB-9A5F-4671-B436-C5BE6DE1DD37\",\r\n \"AssessmentProductGuid\": \"42AB6722-BAFC-4A59-8996-10A7C402C03E\",\r\n \"DateStarted\": \"2024-07-11\",\r\n \"DateFirstCalc\": \"2024-07-11\",\r\n \"DateMostRecentCalc\": \"2024-07-11\",\r\n \"SurveyContent\": \"Risk of Breast Cancer\",\r\n \"Ows\": \"29\",\r\n \"OwsCaption\": \"\",\r\n \"PrViGuid\": \"941B82A8-9B89-42CB-9601-C1567D6E38F0\",\r\n \"PsViGuid\": \"\",\r\n \"IsCompleted\": \"1\",\r\n \"EditAssessmentVisible\": \"1\"\r\n */\r\n\r\n\r\n const AssessmentBox = ({ row }) => {\r\n\r\n return (\r\n \r\n \r\n \r\n {row.DateStarted} \r\n \r\n \r\n \r\n \r\n \r\n \r\n {row.SurveyContent}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )\r\n }\r\n\r\n const AssessmentTable = () => {\r\n return (\r\n {\r\n PrevAsmts.map((row, i) => {\r\n return ( \r\n )\r\n }\r\n\r\n return (\r\n \r\n \r\n )\r\n\r\n}\r\nexport default PreviousAssessmentTableMobile","import React, { useState } from 'react'\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Button, Box, Dialog, DialogContent, Stack, Typography, Modal, Tooltip as TT, IconButton, ButtonGroup, Grid, Card, CardHeader, CardContent } from '@mui/material'\r\n\r\nimport EditIcon from '@mui/icons-material/Edit';\r\n\r\nimport { selectGlobalSettingEntities } from '../../../reducers/reference_settings';\r\nimport { selectViewInstanceById } from '../../../reducers/reuseable_vi';\r\nimport { useNavigate, createSearchParams } from 'react-router-dom'\r\nimport PreviousAssessmentTable from './PreviousAssessmentTable';\r\nimport PreviousAssessmentTableMobile from './PreviousAssessmentTableMobile';\r\n\r\nconst ProfilePreviousAssessmentCard = ( props) => {\r\n \r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n )\r\n\r\n}\r\n\r\nexport default ProfilePreviousAssessmentCard","import React, { useState, useEffect } from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { useNavigate } from \"react-router-dom\";\r\n\r\nimport Header from \"./layouts/Header\";\r\nimport { Grid, TextField, Paper, Typography, MenuItem, InputLabel, FormControl, Select, Autocomplete, Button, Skeleton, Box, Tabs, Tab } from \"@mui/material\";\r\n\r\nimport { fetchErrorMessages, selectErrorMessagesByKeyName } from \"../reducers/reference_errormessages\";\r\nimport Footer from \"./layouts/Footer\";\r\nimport { fetchPublicViewInstances, fetchViewInstances, selectViewInstanceById, viewinstanceClear } from \"../reducers/reuseable_vi\";\r\nimport ProfileDemographicsCard from \"./partials/profile/ProfileDemographicsCard\";\r\nimport ProfilePreviousAssessmentCard from \"./partials/profile/ProfilePreviousAssessmentCard\";\r\nimport { globalsettingSetAll, selectGlobalSettingEntities } from \"../reducers/reference_settings\";\r\nimport '../print.css'\r\n\r\n//import { getPWRequest } from \"../actions/viewinstance\";\r\n\r\nconst Profile = (props) => {\r\n const navigate = useNavigate()\r\n const ProfileDemographicsVI = useSelector(state => selectViewInstanceById(state, \"ProfileDemographics\"))\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const [value, setValue] = React.useState(0);\r\n\r\n\r\n const errormessageStatus = useSelector(state => state.errormessages.status)\r\n const settingStatus = useSelector(state => state.globalsettings.status)\r\n const [settingsLoaded, setSettingsLoaded] = React.useState(false);\r\n const [ProfileDemographicsCalled, setProfileDemographicsCalled] = useState(false)\r\n const settings = useSelector(state => selectGlobalSettingEntities(state))\r\n\r\n const dispatch = useDispatch()\r\n\r\n useEffect(() => {\r\n if (ProfileDemographicsVI && ProfileDemographicsVI?.status === 'success' && ProfileDemographicsVI.settings && !settingsLoaded) {\r\n dispatch(globalsettingSetAll({ Settings: ProfileDemographicsVI.settings }))\r\n }\r\n }, [ProfileDemographicsVI, settingsLoaded, settingStatus, dispatch])\r\n\r\n useEffect(() => {\r\n if (ProfileDemographicsVI?.status === 'success' && !settingsLoaded) {\r\n setSettingsLoaded(true)\r\n }\r\n\r\n }, [settingsLoaded, settingStatus, settings, dispatch])\r\n\r\n useEffect(() => {\r\n if (!ProfileDemographicsVI && ProfileDemographicsVI?.status !== 'failed') {\r\n dispatch(fetchViewInstances({ VIName: \"ProfileDemographics\", VIGuid: '5F6382C5-1CEF-461B-9539-7B428E5EA882', authToken: currentUser.AuthToken }))\r\n }\r\n }, [])\r\n\r\n useEffect(() => {\r\n if (errormessageStatus === 'idle') {\r\n dispatch(fetchErrorMessages({ groupGuid: localStorage.getItem('group'), languageID: -1 }))\r\n }\r\n }, [errormessageStatus, dispatch])\r\n\r\n const handleChange = (event, newValue) => {\r\n setValue(newValue);\r\n };\r\n\r\n\r\n return (\r\n \r\n
\r\n
\r\n \r\n \r\n \r\n {/* . . \r\n\r\n */}\r\n \r\n {ProfileDemographicsVI?.status === 'success' && settingsLoaded && settingStatus === 'success' ? (\r\n\r\n . \r\n \r\n\r\n {ProfileDemographicsVI?.status === 'success' && settingsLoaded && settingStatus === 'success' ? (\r\n\r\n . \r\n \r\n \r\n\r\n \r\n\r\n\r\n
\r\n
\r\n \r\n \r\n \r\n {Article.ComponentValues.TitleBlock.Title} \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n LoadArticle()}>Read More \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n )\r\n\r\n}\r\n\r\n\r\nexport default ArticleItem;","import React, { useState } from 'react'\r\nimport { Button, Grid, Typography, Card, CardContent, CardActions, CardMedia } from '@mui/material'\r\nimport _ from \"lodash\"\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport AccessTimeIcon from '@mui/icons-material/AccessTime';\r\nimport OutdoorGrillIcon from '@mui/icons-material/OutdoorGrill';\r\nimport SchoolIcon from '@mui/icons-material/School';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { selectArticleById } from '../../../reducers/healthshelf_article';\r\n\r\nimport { createSearchParams, useNavigate } from 'react-router-dom';\r\nimport { healthshelfClear } from '../../../reducers/healthshelf_single';\r\nimport { Box } from '@mui/system';\r\n\r\n\r\nconst RecipeItem = (props) => {\r\n const ArticleId = props.ArticleId\r\n const Article = useSelector((state) => selectArticleById(state, ArticleId))\r\n const dispatch=useDispatch()\r\n const navigate=useNavigate()\r\n \r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n const LoadArticle = ()=>{\r\n dispatch(healthshelfClear())\r\n navigate({ pathname: '/healthshelfarticle', search: createSearchParams({ hsg: Article.Guid}).toString() })\r\n }\r\n return (\r\n\r\n \r\n \r\n \r\n \r\n {Article.ComponentValues.TitleBlock.Title} \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n {LoadArticle()}}>Read More \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n\r\n )\r\n\r\n}\r\n\r\n\r\nexport default RecipeItem;","import React, { useState } from 'react'\r\nimport { Button, Grid, Typography, Card, CardContent, CardActions, CardMedia, Box } from '@mui/material'\r\nimport _ from \"lodash\"\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport AccessTimeIcon from '@mui/icons-material/AccessTime';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { selectArticleById } from '../../../reducers/healthshelf_article';\r\n\r\nimport { createSearchParams, useNavigate } from 'react-router-dom';\r\nimport { healthshelfClear } from '../../../reducers/healthshelf_single';\r\n\r\nconst HowToItem = (props) => {\r\n const ArticleId = props.ArticleId\r\n const Article = useSelector((state) => selectArticleById(state, ArticleId))\r\n const dispatch=useDispatch()\r\n const navigate=useNavigate()\r\n // const handleChange = (event, newValue) => {\r\n // setValue(newValue);\r\n // setIsFlipped(-1)\r\n // setCurrentTab(props.cards.KeyAreas.KeyAreaArray[newValue])\r\n // };\r\n\r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n const LoadArticle = ()=>{\r\n dispatch(healthshelfClear())\r\n navigate({ pathname: '/healthshelfarticle', search: createSearchParams({ hsg: Article.Guid}).toString() })\r\n }\r\n return (\r\n\r\n \r\n \r\n \r\n \r\n {Article.ComponentValues.TitleBlock.Title} \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n {LoadArticle()}}>Read More \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n\r\n )\r\n\r\n}\r\n\r\n\r\nexport default HowToItem;","import React, { useState } from 'react'\r\nimport { Button, Grid, Typography, Card, CardContent, CardActions, CardMedia, Box } from '@mui/material'\r\nimport _ from \"lodash\"\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport AccessTimeIcon from '@mui/icons-material/AccessTime';\r\nimport OutdoorGrillIcon from '@mui/icons-material/OutdoorGrill';\r\nimport SchoolIcon from '@mui/icons-material/School';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { selectArticleById } from '../../../reducers/healthshelf_article';\r\nimport { PictureAsPdf } from '@mui/icons-material';\r\nimport { useNavigate } from 'react-router';\r\nimport { healthshelfClear } from '../../../reducers/healthshelf_single';\r\nimport { createSearchParams } from 'react-router-dom';\r\n\r\n\r\n\r\nconst ChallengeItem = (props) => {\r\n const ArticleId = props.ArticleId\r\n const Article = useSelector((state) => selectArticleById(state, ArticleId))\r\n const dispatch=useDispatch()\r\n const navigate=useNavigate()\r\n // const handleChange = (event, newValue) => {\r\n // setValue(newValue);\r\n // setIsFlipped(-1)\r\n // setCurrentTab(props.cards.KeyAreas.KeyAreaArray[newValue])\r\n // };\r\n\r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n const LoadArticle = ()=>{\r\n dispatch(healthshelfClear())\r\n navigate({ pathname: '/healthshelfarticle', search: createSearchParams({ hsg: Article.Guid}).toString() })\r\n }\r\n return (\r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n {Article.ComponentValues.TitleBlock.Title} \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n {/* \r\n \r\n \r\n */}\r\n \r\n {LoadArticle()}}>Read More \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n\r\n )\r\n\r\n}\r\n\r\n\r\nexport default ChallengeItem;","import React, { useState } from 'react'\r\nimport { Button, Grid, Typography, Card, CardContent, CardActions, CardMedia, Box } from '@mui/material'\r\nimport _ from \"lodash\"\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport AccessTimeIcon from '@mui/icons-material/AccessTime';\r\n\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { selectArticleById } from '../../../reducers/healthshelf_article';\r\nimport { useNavigate } from 'react-router';\r\nimport { createSearchParams } from 'react-router-dom';\r\nimport { healthshelfClear } from '../../../reducers/healthshelf_single';\r\n\r\n\r\nconst SelfCheckItem = (props) => {\r\n const ArticleId = props.ArticleId\r\n const Article = useSelector((state) => selectArticleById(state, ArticleId))\r\n const [isOpen, setIsOpen] = useState()\r\n const dispatch = useDispatch()\r\n const navigate = useNavigate()\r\n // const handleChange = (event, newValue) => {\r\n // setValue(newValue);\r\n // setIsFlipped(-1)\r\n // setCurrentTab(props.cards.KeyAreas.KeyAreaArray[newValue])\r\n // };\r\n\r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n\r\n const LoadArticle = ()=>{\r\n dispatch(healthshelfClear())\r\n navigate({ pathname: '/healthshelfarticle', search: createSearchParams({ hsg: Article.Guid}).toString() })\r\n }\r\n\r\n return (\r\n\r\n \r\n \r\n \r\n \r\n {Article.ComponentValues.TitleBlock.Title} \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n LoadArticle()}>Read More \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n )\r\n\r\n}\r\n\r\n\r\nexport default SelfCheckItem;","import React, { useState } from 'react'\r\nimport { Button, Grid, Typography, Card, CardContent, CardActions, CardMedia, Box } from '@mui/material'\r\nimport _ from \"lodash\"\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport AccessTimeIcon from '@mui/icons-material/AccessTime';\r\nimport OutdoorGrillIcon from '@mui/icons-material/OutdoorGrill';\r\nimport SchoolIcon from '@mui/icons-material/School';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { selectArticleById } from '../../../reducers/healthshelf_article';\r\nimport { PictureAsPdf } from '@mui/icons-material';\r\nimport { createSearchParams, useNavigate } from 'react-router-dom';\r\nimport { healthshelfClear } from '../../../reducers/healthshelf_single';\r\n\r\n\r\n\r\nconst TrackerItem = (props) => {\r\n const ArticleId = props.ArticleId\r\n const Article = useSelector((state) => selectArticleById(state, ArticleId))\r\n const dispatch=useDispatch()\r\n const navigate=useNavigate()\r\n // const handleChange = (event, newValue) => {\r\n // setValue(newValue);\r\n // setIsFlipped(-1)\r\n // setCurrentTab(props.cards.KeyAreas.KeyAreaArray[newValue])\r\n // };\r\n\r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n const LoadArticle = ()=>{\r\n dispatch(healthshelfClear())\r\n navigate({ pathname: '/healthshelfarticle', search: createSearchParams({ hsg: Article.Guid}).toString() })\r\n }\r\n return (\r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n {Article.ComponentValues.TitleBlock.Title} \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n {/* \r\n \r\n \r\n */}\r\n \r\n {LoadArticle()}}>Read More \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n\r\n )\r\n\r\n}\r\n\r\n\r\nexport default TrackerItem;","import React, { useEffect, useState } from 'react'\r\nimport { Grid, Box, Button } from '@mui/material'\r\nimport Masonry from '@mui/lab/Masonry';\r\nimport { useSelector } from 'react-redux'\r\nimport { motion } from \"framer-motion/dist/framer-motion\"\r\nimport { selectFilteredArticles } from '../../../reducers/healthshelf_article'\r\nimport ArticleItem from './ArticleItem'\r\nimport RecipeItem from './RecipeItem';\r\nimport HowToItem from './HowToItem';\r\nimport ChallengeItem from './ChallengeItem';\r\nimport SelfCheckItem from './SelfCheckItem';\r\nimport TrackerItem from './TrackerItem';\r\nimport { ArrowDownwardOutlined, KeyboardArrowDown } from '@mui/icons-material';\r\n\r\n\r\nconst motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n}\r\n\r\nconst ArticleContainer = (props) => {\r\n\r\n const Articles = useSelector(state => selectFilteredArticles(state))\r\n const ArticlesToLoad_Default = 11\r\n const ArticlesToLoad_Increment = 9\r\n const [ArticlesToLoad, setArticlesToLoad] = useState(ArticlesToLoad_Default)\r\n\r\n const handleMoreArticles = () => {\r\n setArticlesToLoad(ArticlesToLoad + ArticlesToLoad_Increment)\r\n }\r\n useEffect(() => {\r\n setArticlesToLoad(ArticlesToLoad_Default)\r\n }, [Articles])\r\n\r\n\r\n const ReturnArticle = (props) => {\r\n let ArticleObject = props.ArticleObject\r\n if (ArticleObject.Type === 'ARTICLE') {\r\n return \r\n \r\n \r\n \r\n {\r\n Articles.filter((x, i) => { return i <= ArticlesToLoad }).map((x, i) => {\r\n return (\r\n \r\n \r\n \r\n\r\n )\r\n })\r\n }\r\n \r\n \r\n \r\n \r\n Load More \r\n \r\n \r\n \r\n )\r\n\r\n}\r\n\r\nexport default ArticleContainer","import { createSlice, createSelector } from '@reduxjs/toolkit'\r\n\r\n// import { BASE_URL, OrganizationId, AuthToken } from '/features/storeconfig'\r\n\r\n\r\n\r\nconst initialState = {\r\n entities: {},\r\n status: 'idle', // idle loading success fail \r\n error: null\r\n}\r\n\r\n\r\n\r\nconst topicSlice = createSlice({\r\n name: 'topics',\r\n initialState,\r\n reducers: {\r\n topicAdd(state, action) {\r\n const topicData = action.payload\r\n state.entities[topicData.TopicId] = topicData\r\n },\r\n topicModify(state, action) {\r\n const topicData = action.payload\r\n state.entities[topicData.TopicId] = topicData\r\n } ,\r\n \r\n topicDelete(state, action) {\r\n const topicData = action.payload\r\n delete state.entities[topicData.TopicId]\r\n },\r\n topicHydrate(state, action) {\r\n const topicData = action.payload\r\n state.entities=topicData\r\n state.status = 'success'\r\n }\r\n }\r\n}) \r\n\r\nexport const { topicAdd, topicModify, topicDelete, topicHydrate, topicBranchingLogicModify } = topicSlice.actions\r\n\r\nexport default topicSlice.reducer\r\n\r\nconst selectTopicEntities = (state) => state.topics.entities\r\n\r\nexport const selectTopics = createSelector(selectTopicEntities, (entities) =>\r\n Object.values(entities)\r\n)\r\n\r\nexport const selectTopicById = (state, TopicId) => {\r\n return selectTopicEntities(state)[TopicId]\r\n}\r\n\r\n","import React, { useState, useEffect } from 'react'\r\nimport { Grid, Typography, Box, Collapse, TextField } from '@mui/material'\r\nimport { Checkbox } from '@mui/material'\r\nimport { useDispatch, useSelector } from 'react-redux'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport _ from 'lodash'\r\nimport { selectTopics } from '../../../reducers/healthshelf_topic'\r\nimport ArrowDropDown from '@mui/icons-material/ArrowDropDown'\r\nimport ArrowDropUp from '@mui/icons-material/ArrowDropUp'\r\nimport NewspaperIcon from '@mui/icons-material/Newspaper';\r\nimport SettingsIcon from '@mui/icons-material/Settings';\r\nimport SelfImprovementIcon from '@mui/icons-material/SelfImprovement';\r\nimport EmojiEventsIcon from '@mui/icons-material/EmojiEvents';\r\nimport QueryStatsIcon from '@mui/icons-material/QueryStats';\r\nimport ListAltIcon from '@mui/icons-material/ListAlt';\r\nimport { hsFilterTopic, hsFilterType, hsFilterSearch, selectHSFiltersRaw } from '../../../reducers/healthshelf_filter';\r\n\r\n\r\nconst motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n}\r\n\r\nconst FilterComponent = (props) => {\r\n const dispatch = useDispatch()\r\n const Topics = useSelector(state => selectTopics(state))\r\n const filters = useSelector(state => selectHSFiltersRaw(state))\r\n const [byTopicExpanded, setByTopicExpanded] = useState(false)\r\n const [search, setSearch] = useState('')\r\n\r\n useEffect(()=>{\r\n const timeout = setTimeout(()=> dispatch(hsFilterSearch({ Search: search })),500)\r\n return ()=> clearTimeout(timeout)\r\n },[search])\r\n\r\n const handleTopicFilter = (id, value) => {\r\n dispatch(hsFilterTopic({ id: id, value: value }))\r\n }\r\n\r\n const handleTypeFilter = (id, value) => {\r\n dispatch(hsFilterType({ id: id, value: value }))\r\n }\r\n\r\n const handleSearch = (_search) => {\r\n setSearch(_search)\r\n \r\n }\r\n\r\n\r\n const TopicSelect = Topics.map((x, i) => {\r\n return (\r\n \r\n\r\n \r\n \r\n -1}\r\n onChange={(e) => handleTopicFilter(x.Id, e.target.checked)}\r\n />\r\n \r\n \r\n {x.Title} \r\n \r\n \r\n \r\n )\r\n })\r\n\r\n\r\n\r\n const TypeSelect =\r\n \r\n \r\n \r\n \r\n = 0}\r\n onChange={(e) => handleTypeFilter('ARTICLE', e.target.checked)}\r\n icon={ \r\n Articles \r\n \r\n \r\n \r\n \r\n = 0}\r\n onChange={(e) => handleTypeFilter('HOW TO', e.target.checked)}\r\n icon={ \r\n How To \r\n \r\n \r\n \r\n \r\n = 0}\r\n onChange={(e) => handleTypeFilter('SELF CHECK', e.target.checked)}\r\n icon={ \r\n Self Checks \r\n \r\n \r\n \r\n \r\n = 0}\r\n onChange={(e) => handleTypeFilter('CHALLENGE', e.target.checked)}\r\n icon={ \r\n Challenges \r\n \r\n \r\n \r\n \r\n = 0}\r\n onChange={(e) => handleTypeFilter('TRACKER', e.target.checked)}\r\n icon={ \r\n Trackers \r\n \r\n \r\n \r\n \r\n = 0}\r\n onChange={(e) => handleTypeFilter('RECIPE', e.target.checked)}\r\n icon={ \r\n Recipes \r\n \r\n \r\n\r\n\r\n return (\r\n \r\n \r\n \r\n Need Help Finding Something? \r\n \r\n \r\n handleSearch(e.target.value)}\r\n />\r\n\r\n \r\n \r\n\r\n setByTopicExpanded(!byTopicExpanded)} >\r\n \r\n \r\n Filter By Topic \r\n \r\n \r\n {byTopicExpanded === true ? \r\n \r\n \r\n\r\n \r\n \r\n \r\n {TypeSelect}\r\n \r\n \r\n\r\n\r\n \r\n \r\n \r\n\r\n \r\n {TopicSelect}\r\n \r\n \r\n\r\n \r\n \r\n\r\n \r\n \r\n )\r\n\r\n}\r\n\r\nexport default FilterComponent","import React, { useState, useEffect } from \"react\";\r\nimport { useNavigate, useLocation } from 'react-router-dom';\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Grid, Typography, Paper, Box, Skeleton } from '@mui/material'\r\nimport { getViewInstance } from \"../actions/viewinstance\";\r\nimport Header from \"./layouts/Header\";\r\nimport Footer from \"./layouts/Footer\";\r\nimport Masonry from '@mui/lab/Masonry';\r\nimport HealthShelfContainer from \"./partials/healthshelf/HealthShelfContainer\";\r\nimport FilterComponent from \"./partials/healthshelf/FilterComponent\";\r\nimport { topicHydrate } from \"../reducers/healthshelf_topic\";\r\nimport { articleHydrate } from \"../reducers/healthshelf_article\";\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\nconst HealthShelf = () => {\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const [loading, setLoading] = useState(false);\r\n const [callVI, setCallVI] = useState(false)\r\n const { viewInstance, settings } = useSelector(state => state.viewinstance)\r\n\r\n const dispatch = useDispatch();\r\n const navigate = useNavigate();\r\n const location = useLocation();\r\n\r\n useEffect(()=>{\r\n if(window !== undefined){\r\n window.scrollTo(0,0)\r\n }\r\n },[])\r\n \r\n const topicStatus = useSelector(state => state.topics.status)\r\n const articleStatus = useSelector(state => state.articles.status)\r\n\r\n const statusArray = [\r\n topicStatus === 'success' ? true : false\r\n , articleStatus === 'success' ? true : false\r\n ]\r\n\r\n\r\n\r\n useEffect(() => {\r\n if (!callVI && (!viewInstance || !viewInstance.HealthShelf) && currentUser && currentUser.AuthToken) {\r\n setCallVI(true);\r\n dispatch(getViewInstance('AFFC204B-8C80-47BC-AF88-BC75F0015092', currentUser.AuthToken))\r\n }\r\n }, [location.pathname])\r\n\r\n if (!callVI && (!viewInstance || !viewInstance.HealthShelf) && currentUser && currentUser.AuthToken) {\r\n setCallVI(true);\r\n dispatch(getViewInstance('AFFC204B-8C80-47BC-AF88-BC75F0015092', currentUser.AuthToken))\r\n }\r\n\r\n useEffect(() => {\r\n if (topicStatus === 'idle' && viewInstance && viewInstance.HealthShelf) {\r\n const topicStore = {}\r\n for (var i = 0; i < viewInstance.HealthShelf.Topics.length; i++) {\r\n let topic = viewInstance.HealthShelf.Topics[i]\r\n topicStore[topic.Id] = topic\r\n }\r\n dispatch(topicHydrate(topicStore))\r\n }\r\n }, [topicStatus, dispatch, viewInstance])\r\n\r\n useEffect(() => {\r\n if (articleStatus === 'idle' && viewInstance && viewInstance.HealthShelf) {\r\n const articleStore = {}\r\n for (var i = 0; i < viewInstance.HealthShelf.Articles.length; i++) {\r\n let article = viewInstance.HealthShelf.Articles[i]\r\n articleStore[article.Id] = article\r\n }\r\n\r\n dispatch(articleHydrate(articleStore))\r\n }\r\n\r\n }, [articleStatus, dispatch, viewInstance])\r\n\r\n\r\n\r\n\r\n return (\r\n \r\n
\r\n
\r\n Health Shelf \r\n \r\n\r\n\r\n
\r\n \r\n \r\n \r\n\r\n {\r\n statusArray.indexOf(false) < 0 ?\r\n (\r\n\r\n
\r\n\r\n\r\n\r\n ) : (\r\n\r\n
\r\n \r\n\r\n \r\n \r\n {\r\n [1, 2, 3, 4, 5, 6].map(x => {\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n )\r\n })}\r\n \r\n \r\n \r\n \r\n\r\n )\r\n }\r\n
\r\n
\r\n \r\n HOME\r\n \r\n Logout \r\n \r\n */","import React, { useState, useRef, useEffect } from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { Navigate, useSearchParams, Link,useNavigate, createSearchParams } from 'react-router-dom';\r\nimport Loading from \"./Loading\";\r\nimport { setSAMLLogin } from \"../reducers/auth\";\r\nimport { Typography, Box } from \"@mui/material\";\r\nimport { fetchGlobalSettings, globalsettingSet } from \"../reducers/reference_settings\";\r\nimport { getLanding } from \"../actions/viewinstance\";\r\nimport { userTimeoutSecondsRemaining } from \"../reducers/auth_timeout\";\r\nconst SAML = (props) => {\r\n const navigate = useNavigate();\r\n const dispatch = useDispatch();\r\n const [searchParams] = useSearchParams();\r\n\r\n const [auth, setAuth] = useState(\"\")\r\n const [responseGuid, setResponseGuid] = useState(\"\")\r\n const [error, setError] = useState(\"\")\r\n\r\n\r\n\r\n useEffect(() => {\r\n if(searchParams.get('AuthToken')){\r\n setError(\"\")\r\n \r\n setAuthinRedux(searchParams.get('AuthToken'))\r\n } else {\r\n setError(\"\")\r\n }\r\n \r\n }, [])\r\n\r\n useEffect(() => {\r\n //after auth, set response guid \r\n if(auth){\r\n const destination = (searchParams.get('Page') || 'home').toLowerCase()\r\n //hra/pr/ps setRespnseGuid\r\n\r\n if(searchParams.get('assmtguid')){\r\n callSetResponseGuid(searchParams.get('assmtguid'))\r\n } else {\r\n if(destination==\"hra2\"){\r\n //handle start\r\n handleStart()\r\n } else if(destination==\"healthshelf\") {\r\n if(!searchParams.get('hsg'))\r\n {\r\n navigate({ pathname: '/healthshelf' }, { replace: true })\r\n }else{\r\n\r\n navigate({ pathname: '/healthshelfarticle', search: createSearchParams({ hsg: searchParams.get('hsg') }).toString() }, { replace: true })\r\n }\r\n }\r\n else {\r\n navigate('/'+destination, { replace: true })\r\n }\r\n }\r\n //home redirect\r\n \r\n }\r\n\r\n }, [auth])\r\n\r\n useEffect(() => {\r\n if(auth && responseGuid){\r\n const destination = (searchParams.get('Page') || 'home').toLowerCase()\r\n if(destination == 'personalreport'){\r\n navigate({ pathname: '/personalreport', search: createSearchParams({ vi: '8AC17D1E-2871-44D9-ACC0-867285149337' }).toString() }, { replace: true })\r\n }\r\n if(destination == 'physiciansummary'){\r\n navigate({ pathname: '/physiciansummary', search: createSearchParams({ vi: '2C2870C1-1C00-4E67-98FF-04BA402C6824' }).toString() }, { replace: true })\r\n }\r\n if(destination == 'hra2'){\r\n navigate({ pathname: '/hra', search: createSearchParams({ vi: 'D58CC25B-BB6A-439D-B3D7-BA37AD1AB701', assmtguid: responseGuid }).toString() }, { replace: true })\r\n }\r\n }\r\n \r\n }, [responseGuid])\r\n\r\n const callSetResponseGuid = (responseGuid) => {\r\n fetch('../../WsWebServicePlatform/Participant/SessionVar/Set/' + auth + '/RESPONSE%20GUID/' + responseGuid+'/', {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n .then(response => response.json())\r\n .then(response => {\r\n setResponseGuid(responseGuid)\r\n } )\r\n }\r\n\r\n const handleStart = () => {\r\n fetch('../../WsWebServicePlatform/Participant/SessionVar/Delete/' + auth + '/RESPONSE%20GUID/', {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n .then(response => response.json())\r\n .then(response => {\r\n navigate({ pathname: '/hra', search: createSearchParams({ vi: 'D58CC25B-BB6A-439D-B3D7-BA37AD1AB701' }).toString() }, { replace: true })\r\n } )\r\n }\r\n\r\n const setAuthinRedux = (authToken) => {\r\n let isAdmin = searchParams.get('IsAdmin') || false\r\n let groupGuid = searchParams.get('GroupGuid') \r\n \r\n localStorage.setItem(\"group\", searchParams.get(\"GroupGuid\"))\r\n fetch('../../WsWebServiceWellSuite/GetViewInstancePublic/' + groupGuid + '/-1/4F60657A-324B-415C-986A-4ADFD91EBEC2/', {\r\n method: \"GET\"\r\n })\r\n .then(response => response.json())\r\n .then( rs => {\r\n \r\n\r\n let rsps = rs.Info[0].ViewInstanceData\r\n \r\n if (rsps.length>0 && rsps[1].SessionVariableValues){\r\n dispatch(globalsettingSet({SettingFamilyKeyName:\"session\", Settings:rsps[1].SessionVariableValues}))\r\n dispatch(globalsettingSet({SettingFamilyKeyName:\"organization\", Settings:rsps[1].OrganizationSettingValues})) \r\n }\r\n \r\n }\r\n )\r\n .then( rsp=> {\r\n dispatch(setSAMLLogin({AuthToken: authToken, IsAdmin: isAdmin, GroupGuid: groupGuid}))\r\n \r\n setAuth(authToken)\r\n }\r\n ).then(rr=> rr.json()).then(rr2=>dispatch(userTimeoutSecondsRemaining()))\r\n }\r\n\r\n\r\n return \r\n {error} }\r\n \r\n\r\n};\r\n\r\nexport default SAML;\r\n","import { createBrowserHistory } from \"history\";\r\n\r\nexport const history = createBrowserHistory();\r\n","import { createSlice, createSelector, createAsyncThunk } from '@reduxjs/toolkit'\r\n\r\n// import { BASE_URL, OrganizationId, AuthToken } from '/features/storeconfig'\r\nimport axios from \"axios\";\r\n\r\n\r\nconst initialState = {\r\n entities: {},\r\n status: 'idle', // idle loading success fail \r\n additionalinfo:{},\r\n error: null\r\n}\r\n/**\r\n * \r\n * ~~ = ignore\r\n * ~_~ = delete/set to default value\r\n */\r\nconst PLATFORM = '../../WsWebServicePlatform/'\r\nconst WELLSUITE = '../../WsWebServiceWellSuite/';\r\n// Participant/Misc/Types/Get/{AuthToken}/\t\r\n// Participant/Misc/Type/Update/{AuthToken}/{ParticipantCountryGuid}/{CountryName}/{CountryDescription}/\t\r\n// Participant/Misc/Type/Delete/{AuthToken}/{ParticipantCountryGuid}/\t\r\n// Participant/Misc/Type/Create/{AuthToken}/{CountryName}/{CountryDescription}/\t\r\nexport const fetchCountrys = createAsyncThunk('country/get', async (incomingVariable, thunkAPI) => {\r\n \r\n try {\r\n const response = await axios.get(WELLSUITE + \"GetViewInstance/\" + incomingVariable.authToken + \"/FC116697-AAE7-42E2-A4B2-137899513427\"+'/')\r\n const data = await response.data.Success ? response.data : []\r\n\r\n return data\r\n } catch (err) {\r\n \r\n return thunkAPI.rejectWithValue({ error: err.message });\r\n }\r\n})\r\n\r\n\r\nconst countrySlice = createSlice({\r\n name: 'countrys',\r\n initialState,\r\n reducers: { \r\n countryClear(state, action) {\r\n state.entities = initialState\r\n state.status = \"idle\"\r\n \r\n }\r\n },\r\n extraReducers(builder) {\r\n builder\r\n //\r\n .addCase(fetchCountrys.pending, (state, action) => {\r\n state.status = 'loading'\r\n })\r\n .addCase(fetchCountrys.fulfilled, (state, action) => {\r\n state.status = 'success'\r\n const loadesplitdData = action.payload.Info[0].ViewInstanceData[0].CountryVI.ProfileAddressCountryFrame\r\n const {CountryDropdownList, ...secondary} = loadesplitdData\r\n \r\n state.entities = CountryDropdownList\r\n state.additionalinfo = secondary\r\n })\r\n .addCase(fetchCountrys.rejected, (state, action) => {\r\n state.error = action.error.message\r\n \r\n })\r\n \r\n \r\n }\r\n})\r\n\r\nexport const { countryClear} = countrySlice.actions\r\n\r\nexport default countrySlice.reducer\r\n\r\nexport const selectCountryEntities = (state) => state.countrys.entities\r\n\r\nexport const selectCountrys = createSelector(selectCountryEntities, (entities) =>\r\n Object.values(entities)\r\n)\r\n\r\nexport const selectCountryById = (state, CountryId) => {\r\n return selectCountryEntities(state)[CountryId]\r\n}\r\n\r\n","import { createSlice, createSelector, createAsyncThunk } from '@reduxjs/toolkit'\r\n\r\n// import { BASE_URL, OrganizationId, AuthToken } from '/features/storeconfig'\r\nimport axios from \"axios\";\r\n\r\n\r\nconst initialState = {\r\n entities: {},\r\n status: 'idle', // idle loading success fail \r\n additionalinfo:{},\r\n error: null\r\n}\r\n/**\r\n * \r\n * ~~ = ignore\r\n * ~_~ = delete/set to default value\r\n */\r\nconst PLATFORM = '../../WsWebServicePlatform/'\r\nconst WELLSUITE = '../../WsWebServiceWellSuite/';\r\n// Participant/Misc/Types/Get/{AuthToken}/\t\r\n// Participant/Misc/Type/Update/{AuthToken}/{ParticipantEducationGuid}/{EducationName}/{EducationDescription}/\t\r\n// Participant/Misc/Type/Delete/{AuthToken}/{ParticipantEducationGuid}/\t\r\n// Participant/Misc/Type/Create/{AuthToken}/{EducationName}/{EducationDescription}/\t\r\nexport const fetchEducations = createAsyncThunk('education/get', async (incomingVariable, thunkAPI) => {\r\n console.log('called fetch education')\r\n try {\r\n const response = await axios.get(WELLSUITE + \"GetViewInstance/\" + incomingVariable.authToken + \"/9BED732E-3989-4E43-BC80-DF418303A66D\"+'/')\r\n const data = await response.data.Success ? response.data : []\r\n\r\n return data\r\n } catch (err) {\r\n console.log('error', err)\r\n return thunkAPI.rejectWithValue({ error: err.message });\r\n }\r\n})\r\n\r\n\r\nconst educationSlice = createSlice({\r\n name: 'educations',\r\n initialState,\r\n reducers: { \r\n educationClear(state, action) {\r\n state.entities = initialState\r\n state.status = \"idle\"\r\n \r\n }\r\n },\r\n extraReducers(builder) {\r\n builder\r\n //\r\n .addCase(fetchEducations.pending, (state, action) => {\r\n state.status = 'loading'\r\n })\r\n .addCase(fetchEducations.fulfilled, (state, action) => {\r\n state.status = 'success'\r\n const split = action.payload.Info[0].ViewInstanceData[0].EducationVI.ProfileEducationFrame\r\n const {EducationList, ...secondary} = split\r\n \r\n state.entities = EducationList\r\n state.additionalinfo = secondary\r\n })\r\n .addCase(fetchEducations.rejected, (state, action) => {\r\n state.error = action.error.message\r\n console.log('failed')\r\n })\r\n \r\n \r\n }\r\n})\r\n\r\nexport const { educationClear} = educationSlice.actions\r\n\r\nexport default educationSlice.reducer\r\n\r\nexport const selectEducationEntities = (state) => state.educations.entities\r\n\r\nexport const selectEducations = createSelector(selectEducationEntities, (entities) =>\r\n Object.values(entities)\r\n)\r\n\r\nexport const selectEducationById = (state, EducationId) => {\r\n return selectEducationEntities(state)[EducationId]\r\n}\r\n\r\n","import { createSlice, createSelector, createAsyncThunk } from '@reduxjs/toolkit'\r\n\r\n// import { BASE_URL, OrganizationId, AuthToken } from '/features/storeconfig'\r\nimport axios from \"axios\";\r\n\r\n\r\nconst initialState = {\r\n entities: {},\r\n status: 'idle', // idle loading success fail \r\n additionalinfo:{},\r\n error: null\r\n}\r\n/**\r\n * \r\n * ~~ = ignore\r\n * ~_~ = delete/set to default value\r\n */\r\nconst PLATFORM = '../../WsWebServicePlatform/'\r\nconst WELLSUITE = '../../WsWebServiceWellSuite/';\r\n// Participant/Misc/Types/Get/{AuthToken}/\t\r\n// Participant/Misc/Type/Update/{AuthToken}/{ParticipantSpokenLanguageGuid}/{SpokenLanguageName}/{SpokenLanguageDescription}/\t\r\n// Participant/Misc/Type/Delete/{AuthToken}/{ParticipantSpokenLanguageGuid}/\t\r\n// Participant/Misc/Type/Create/{AuthToken}/{SpokenLanguageName}/{SpokenLanguageDescription}/\t\r\nexport const fetchSpokenLanguages = createAsyncThunk('spokenlanguage/get', async (incomingVariable, thunkAPI) => {\r\n console.log('called fetch spokenlanguage')\r\n try {\r\n const response = await axios.get(WELLSUITE + \"GetViewInstance/\" + incomingVariable.authToken + \"/F9ED40BC-C3C9-4073-87E3-344DAB6C1F4A\"+'/')\r\n const data = await response.data.Success ? response.data : []\r\n\r\n return data\r\n } catch (err) {\r\n console.log('error', err)\r\n return thunkAPI.rejectWithValue({ error: err.message });\r\n }\r\n})\r\n\r\n\r\nconst spokenlanguageSlice = createSlice({\r\n name: 'spokenlanguages',\r\n initialState,\r\n reducers: { \r\n spokenlanguageClear(state, action) {\r\n state.entities = initialState\r\n state.status = \"idle\" \r\n \r\n }\r\n },\r\n extraReducers(builder) {\r\n builder\r\n //\r\n .addCase(fetchSpokenLanguages.pending, (state, action) => {\r\n state.status = 'loading'\r\n })\r\n .addCase(fetchSpokenLanguages.fulfilled, (state, action) => {\r\n state.status = 'success'\r\n const split = action.payload.Info[0].ViewInstanceData[0].SpokenLanguageVI.ProfileLangSpeakFrame\r\n const { LangSpeakDropdownList,...secondary} = split\r\n \r\n state.entities = LangSpeakDropdownList\r\n state.additionalinfo = secondary\r\n })\r\n .addCase(fetchSpokenLanguages.rejected, (state, action) => {\r\n state.error = action.error.message\r\n console.log('failed')\r\n })\r\n \r\n \r\n }\r\n})\r\n\r\nexport const { spokenlanguageClear} = spokenlanguageSlice.actions\r\n\r\nexport default spokenlanguageSlice.reducer\r\n\r\nexport const selectSpokenLanguageEntities = (state) => state.spokenlanguages.entities\r\n\r\nexport const selectSpokenLanguages = createSelector(selectSpokenLanguageEntities, (entities) =>\r\n Object.values(entities)\r\n)\r\n\r\nexport const selectSpokenLanguageById = (state, SpokenLanguageId) => {\r\n return selectSpokenLanguageEntities(state)[SpokenLanguageId]\r\n}\r\n\r\n","import { createSlice, createSelector, createAsyncThunk } from '@reduxjs/toolkit'\r\n\r\n// import { BASE_URL, OrganizationId, AuthToken } from '/features/storeconfig'\r\nimport axios from \"axios\";\r\n\r\n\r\nconst initialState = {\r\n entities: {},\r\n status: 'idle', // idle loading success fail \r\n additionalinfo:{},\r\n error: null\r\n}\r\n/**\r\n * \r\n * ~~ = ignore\r\n * ~_~ = delete/set to default value\r\n */\r\nconst PLATFORM = '../../WsWebServicePlatform/'\r\nconst WELLSUITE = '../../WsWebServiceWellSuite/';\r\n// Participant/Misc/Types/Get/{AuthToken}/\t\r\n// Participant/Misc/Type/Update/{AuthToken}/{ParticipantRaceGuid}/{RaceName}/{RaceDescription}/\t\r\n// Participant/Misc/Type/Delete/{AuthToken}/{ParticipantRaceGuid}/\t\r\n// Participant/Misc/Type/Create/{AuthToken}/{RaceName}/{RaceDescription}/\t\r\nexport const fetchRaces = createAsyncThunk('race/get', async (incomingVariable, thunkAPI) => {\r\n \r\n try {\r\n const response = await axios.get(WELLSUITE + \"GetViewInstance/\" + incomingVariable.authToken + \"/40CAB6FC-838F-4F55-97C3-EA70E31D5C86\"+'/')\r\n const data = await response.data.Success ? response.data : []\r\n\r\n return data\r\n } catch (err) {\r\n \r\n return thunkAPI.rejectWithValue({ error: err.message });\r\n }\r\n})\r\n\r\n\r\nconst raceSlice = createSlice({\r\n name: 'races',\r\n initialState,\r\n reducers: { \r\n raceClear(state, action) {\r\n state.entities = initialState\r\n state.status = \"idle\"\r\n \r\n }\r\n },\r\n extraReducers(builder) {\r\n builder\r\n //\r\n .addCase(fetchRaces.pending, (state, action) => {\r\n state.status = 'loading'\r\n })\r\n .addCase(fetchRaces.fulfilled, (state, action) => {\r\n state.status = 'success'\r\n const loadesplitdData = action.payload.Info[0].ViewInstanceData[0].RaceVI.ProfileRaceFrame\r\n const {ProfileRaceLabels, ...secondary} = loadesplitdData\r\n \r\n state.entities = ProfileRaceLabels\r\n state.additionalinfo = secondary\r\n })\r\n .addCase(fetchRaces.rejected, (state, action) => {\r\n state.error = action.error.message\r\n \r\n })\r\n \r\n \r\n }\r\n})\r\n\r\nexport const { raceClear} = raceSlice.actions\r\n\r\nexport default raceSlice.reducer\r\n\r\nexport const selectRaceEntities = (state) => state.races.entities\r\n\r\nexport const selectRaces = createSelector(selectRaceEntities, (entities) =>\r\n Object.values(entities)\r\n)\r\n\r\nexport const selectRaceById = (state, RaceId) => {\r\n return selectRaceEntities(state)[RaceId]\r\n}\r\n\r\n","import { createSlice, createSelector, createAsyncThunk } from '@reduxjs/toolkit'\r\n\r\n// import { BASE_URL, OrganizationId, AuthToken } from '/features/storeconfig'\r\nimport axios from \"axios\";\r\n\r\n\r\nconst initialState = {\r\n entities: {},\r\n status: 'idle', // idle loading success fail \r\n additionalinfo:{},\r\n error: null\r\n}\r\n/**\r\n * \r\n * ~~ = ignore\r\n * ~_~ = delete/set to default value\r\n */\r\nconst PLATFORM = '../../WsWebServicePlatform/'\r\nconst WELLSUITE = '../../WsWebServiceWellSuite/';\r\n// Participant/Misc/Types/Get/{AuthToken}/\t\r\n// Participant/Misc/Type/Update/{AuthToken}/{ParticipantBirthSexGuid}/{BirthSexName}/{BirthSexDescription}/\t\r\n// Participant/Misc/Type/Delete/{AuthToken}/{ParticipantBirthSexGuid}/\t\r\n// Participant/Misc/Type/Create/{AuthToken}/{BirthSexName}/{BirthSexDescription}/\t\r\nexport const fetchBirthSexs = createAsyncThunk('birthsex/get', async (incomingVariable, thunkAPI) => {\r\n \r\n try {\r\n const response = await axios.get(WELLSUITE + \"GetViewInstance/\" + incomingVariable.authToken + \"/B254172B-62B6-4A2F-81E0-55189AE571B9\"+'/')\r\n const data = await response.data.Success ? response.data : []\r\n\r\n return data\r\n } catch (err) {\r\n \r\n return thunkAPI.rejectWithValue({ error: err.message });\r\n }\r\n})\r\n\r\n\r\nconst birthsexSlice = createSlice({\r\n name: 'birthsexs',\r\n initialState,\r\n reducers: { \r\n birthsexClear(state, action) {\r\n state.entities = initialState\r\n state.status = \"idle\"\r\n \r\n }\r\n },\r\n extraReducers(builder) {\r\n builder\r\n //\r\n .addCase(fetchBirthSexs.pending, (state, action) => {\r\n state.status = 'loading'\r\n })\r\n .addCase(fetchBirthSexs.fulfilled, (state, action) => {\r\n state.status = 'success'\r\n const loadesplitdData = action.payload.Info[0].ViewInstanceData[0].BirthSexVI.ProfileGenderFrame\r\n const {ProfileGenderLabels, ...secondary} = loadesplitdData\r\n \r\n state.entities = ProfileGenderLabels\r\n state.additionalinfo = secondary\r\n })\r\n .addCase(fetchBirthSexs.rejected, (state, action) => {\r\n state.error = action.error.message\r\n \r\n })\r\n \r\n \r\n }\r\n})\r\n\r\nexport const { birthsexClear} = birthsexSlice.actions\r\n\r\nexport default birthsexSlice.reducer\r\n\r\nexport const selectBirthSexEntities = (state) => state.birthsexs.entities\r\n\r\nexport const selectBirthSexs = createSelector(selectBirthSexEntities, (entities) =>\r\n Object.values(entities)\r\n)\r\n\r\nexport const selectBirthSexById = (state, BirthSexId) => {\r\n return selectBirthSexEntities(state)[BirthSexId]\r\n}\r\n\r\n","import React, { useState, useEffect } from 'react'\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport _ from \"lodash\"\r\nimport { Button, Grid, Typography, Divider, Box, TextField, Checkbox, MenuItem } from '@mui/material'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { selectCountrys } from '../../../reducers/reference_country';\r\nimport { selectEducations } from '../../../reducers/reference_education';\r\nimport { selectSpokenLanguages } from '../../../reducers/reference_spokenlanguage';\r\nimport { selectRaceEntities } from '../../../reducers/reference_race';\r\nimport { selectBirthSexs } from '../../../reducers/reference_birthsex';\r\nimport { adminparticipantClearCreate, createParticipants } from '../../../reducers/admincenter_participants';\r\nimport { selectErrorMessagesByNegativeCode } from '../../../reducers/reference_errormessages';\r\nimport { selectGroupSelectTree } from '../../../reducers/admincenter_groups';\r\n\r\n\r\nimport DropdownTreeSelect from 'react-dropdown-tree-select'\r\n\r\nconst ParticipantCreate = (props) => {\r\n const dispatch = useDispatch()\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n \r\n const countryData = useSelector(state => selectCountrys(state))\r\n const educationData = useSelector(state => selectEducations(state))\r\n const languageData = useSelector(state => selectSpokenLanguages(state))\r\n const raceData = useSelector(state => selectRaceEntities(state))\r\n const birthSexData = useSelector(state => selectBirthSexs(state))\r\n\r\n const langOptions = languageData.map((x) => { return ({x.StandardContent} ) })\r\n const eduOptions = educationData.map((x) => { return ({x.EducationTypeName} ) })\r\n //const countryOptions = countryData.map((x) => { return ({x.StandardContent} ) })\r\n const birthSexOptions = birthSexData.map((x) => { return ({x.GenderTypeName} ) })\r\n const raceOptions = raceData.map((x) => { return ({x.RaceTypeName} ) })\r\n\r\n const createParticipantError = useSelector(state => state.adminparticipants.errorCreate)\r\n const createParticipantStatus = useSelector(state => state.adminparticipants.statusCreate)\r\n const [isError, setIsError] = useState(false)\r\n const ErrorMessage = useSelector(state => selectErrorMessagesByNegativeCode(state, createParticipantError && createParticipantError.ErrorID))\r\n\r\n const [GroupGuid, setGroupGuid] = useState(\"\")\r\n const [LanguageID, setLanguageID] = useState(\"1\")\r\n const [FirstName, setFirstName] = useState(\"\")\r\n const [LastName, setLastName] = useState(\"\")\r\n const [MiddleName, setMiddleName] = useState(\"\")\r\n const [BioDOB, setBioDOB] = useState(\"\")\r\n const [BioGender, setBioGender] = useState(\"\")\r\n const [BioRace, setBioRace] = useState(\"\")\r\n const [SpokenLanguageID, setSpokenLanguageID] = useState(\"\")\r\n const [Email, setEmail] = useState(\"\")\r\n const [StatusID, setStatusID] = useState(\"1\")\r\n const [EducationLevelGuid, setEducationLevelGuid] = useState(\"\")\r\n const [Medicaid, setMedicaid] = useState(\"0\")\r\n const [Username, setUsername] = useState(\"\")\r\n const [Password, setPassword] = useState(\"\")\r\n const [PasswordChangeRequired, setPasswordChangeRequired] = useState(\"0\")\r\n \r\n const datToday = new Date(new Date().setDate(new Date().getDate()-1));\r\n const dat120 = new Date() \r\n dat120.setFullYear(dat120.getFullYear()-120)\r\n const validDob = !BioDOB || (new Date(BioDOB) >=dat120 && new Date(BioDOB) selectGroupSelectTree(state,GroupGuid))\r\n\r\n const SaveToDatabase = () => {\r\n setErrorGroupGuid(false)\r\n setErrorUsername(false)\r\n setErrorPassword(false)\r\n \r\n if (GroupGuid\r\n && StatusID\r\n && Username\r\n && Password\r\n ) {\r\n let body = {\r\n GroupGuid: GroupGuid\r\n , LanguageID: LanguageID ? LanguageID : \"~_~\"\r\n , FirstName: FirstName ? FirstName : \"~_~\"\r\n , LastName: LastName ? LastName : \"~_~\"\r\n , MiddleName: MiddleName ? MiddleName : \"~_~\"\r\n , BioDOB: BioDOB ? BioDOB : \"~_~\"\r\n , BioGender: BioGender ? BioGender : \"~_~\"\r\n , BioRace: BioRace ? BioRace : \"~_~\"\r\n , SpokenLanguageID: SpokenLanguageID ? SpokenLanguageID : \"~_~\"\r\n , Email: Email ? Email : \"~_~\"\r\n , StatusID: StatusID ? StatusID : \"~_~\"\r\n , EducationLevelGuid: EducationLevelGuid ? EducationLevelGuid : \"~_~\"\r\n , Medicaid: Medicaid ? Medicaid : \"~_~\"\r\n , Username: Username ? Username : \"~_~\"\r\n , Password: Password ? Password : \"~_~\"\r\n , PasswordChangeRequired: PasswordChangeRequired ? PasswordChangeRequired : \"~_~\"\r\n , AuthToken: currentUser.AuthToken\r\n }\r\n\r\n dispatch(createParticipants(body))\r\n } else {\r\n if(!GroupGuid) {setErrorGroupGuid(true)}\r\n if(!Username) {setErrorUsername(true)}\r\n if(!Password) {setErrorPassword(true)}\r\n }\r\n }\r\n\r\n \r\n\r\n const onChange = (currentNode, selectedNodes) => { \r\n setGroupGuid(currentNode.value)\r\n \r\n }\r\n\r\n useEffect(() => {\r\n setIsError(false)\r\n if (createParticipantStatus === \"success\") {\r\n dispatch(adminparticipantClearCreate())\r\n props.onCloseButton()\r\n }\r\n if (createParticipantStatus === \"failed\") {\r\n setIsError(true)\r\n }\r\n }, [dispatch, createParticipantStatus])\r\n\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n { setUsername(e.target.value) }}\r\n />\r\n \r\n \r\n { setPassword(e.target.value) }}\r\n />\r\n \r\n\r\n \r\n \r\n { setPasswordChangeRequired(e.target.checked === true ? \"1\" : \"0\") }}\r\n />\r\n Require Password Change \r\n \r\n \r\n \r\n \r\n { setStatusID(e.target.checked === true ? \"1\" : \"0\") }}\r\n />\r\n Active \r\n \r\n \r\n \r\n \r\n \r\n\r\n\r\n \r\n \r\n\r\n \r\n\r\n \r\n\r\n\r\n\r\n\r\n {/* \r\n \r\n { setLanguageID(e.target.checked === true ? \"1\" : \"0\" ) }}\r\n />\r\n Language \r\n \r\n */}\r\n\r\n\r\n \r\n \r\n\r\n \r\n { setFirstName(e.target.value) }}\r\n />\r\n \r\n \r\n { setMiddleName(e.target.value) }}\r\n />\r\n \r\n \r\n { setLastName(e.target.value) }}\r\n />\r\n \r\n\r\n\r\n\r\n \r\n { setBioDOB(e.target.value) }}\r\n />\r\n \r\n\r\n\r\n\r\n \r\n { setBioGender(e.target.value) }}\r\n >\r\n {birthSexOptions}\r\n \r\n \r\n\r\n \r\n { setBioRace(e.target.value) }}\r\n >\r\n {raceOptions}\r\n \r\n \r\n\r\n \r\n { setEducationLevelGuid(e.target.value) }}\r\n >\r\n {eduOptions}\r\n \r\n \r\n\r\n \r\n { setSpokenLanguageID(e.target.value) }}\r\n >\r\n {langOptions}\r\n \r\n \r\n \r\n { setEmail(e.target.value) }}\r\n />\r\n \r\n \r\n \r\n { setMedicaid(e.target.checked === true ? \"1\" : \"0\") }}\r\n />\r\n Medicaid \r\n \r\n \r\n\r\n\r\n \r\n \r\n {isError === true && (\r\n\r\n \r\n \r\n {(ErrorMessage && ErrorMessage.MessageTypeContent) || (createParticipantError && createParticipantError.ErrorMessage) || \"ERROR\"}\r\n \r\n \r\n )}\r\n\r\n \r\n \r\n { SaveToDatabase() }}\r\n disabled={(GroupGuid && StatusID && Username && Password && validDob )? false:true}\r\n >Create Participant \r\n \r\n \r\n\r\n \r\n \r\n props.onCloseButton()}>Cancel \r\n \r\n\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default ParticipantCreate","import React, { useState } from 'react'\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport _ from \"lodash\"\r\nimport { Button, Grid, Typography, Box, Checkbox, Dialog, DialogTitle, DialogContent } from '@mui/material'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { contextUpsert, selectContextEntities } from '../../../reducers/global_contexts';\r\nimport ParticipantCreate from './ParticipantCreate';\r\nimport { adminparticipantClear } from \"../../../reducers/admincenter_participants\"\r\nimport { Refresh } from '@mui/icons-material';\r\n/**\r\n * \r\n * {\"ParticipantTab\": {\r\n \"TabName\": \"Participants\",\r\n \"ParticipantHome\": {\r\n \"CreatePartLink\": {\r\n \"LinkText\": \"Create Participant\"\r\n },\r\n \"PartMngViewButton\": {\r\n \"ButtonText\": \"Export\"\r\n },\r\n \"PartMngClearAllButton\": {\r\n \"ButtonText\": \"Clear Filters\"\r\n },\r\n \"PartMngSearchBox\": {\r\n \"Prompt\": \"search by name, username, group name, etc\"\r\n },\r\n \"PartMngArchivedPartsCheckBox\": {\r\n \"BoxText\": \"Include archived participants\"\r\n },\r\n \"NoResultsMessage\": {\r\n \"MessageText\": \"No matching records found; please try a different search.\"\r\n },\r\n \"ViewAllParticipant\": {\r\n \"ButtonText\": \"View All Participants\"\r\n },\r\n \"SelectAllCheckbox\": {\r\n \"BoxText\": \"Select All\"\r\n },\r\n \"SearchResultsCount\": {\r\n \"CountResult\": \"0\"\r\n },\r\n \"SearchFilter\": {\r\n \"FilterCategory\": \"FirstName\"\r\n },\r\n \"BackToDashboardAppNav\": {\r\n \"NavText\": \"Start Over\"\r\n }\r\n },\r\n \"ParticipantSearchResults\": {\r\n \"PartMngSearchResultsHeader\": {\r\n \"FirstNameHeader\": \"First Name\",\r\n \"LastNameHeader\": \"Last Name\",\r\n \"UserNameHeader\": \"Username\",\r\n \"GroupNameHeader\": \"Group Name\",\r\n \"StatusHeader\": \"Status\",\r\n \"DobHeader\": \"DOB\",\r\n \"LastHraHeader\": \"Last HRA Started\",\r\n \"LastLoginHeader\": \"Last Login\"\r\n }\r\n },\r\n \"ParticipantMerge\": {\r\n \"CancelButton\": \"Cancel\",\r\n \"CloseButton\": \"Close\",\r\n \"ContinueButton\": \"Continue\",\r\n \"SearchMessage\": \"Please select the participant you would like to merge into.\",\r\n \"Title\": \"Merge Participant\",\r\n \"DestinationAccountLabel\": \"Destination Account\",\r\n \"MergeButton\": \"Merge\",\r\n \"SourceAccountLabel\": \"Source Account\",\r\n \"ConfirmMessage\": \"You're about to merge the SOURCE account into the DESTINATION account. All assessments will be moved to the DESTINATION account and the SOURCE account will be permanently deleted. Click MERGE to continue.\",\r\n \"SuccessMessage\": \"These two participants have successfully been merged.\"\r\n },\r\n \"ParticipantArchive\": {\r\n \"CloseButton\": \"Close\",\r\n \"ConfirmButton\": \"Confirm\",\r\n \"Message\": \"Archiving a participant will remove them from the default search results.\",\r\n \"Message2\": \"Archiving participants will still show up in group reports unless they are excluded through advanced report options.\",\r\n \"Title\": \"ARCHIVE PARTICIPANT\"\r\n },\r\n \"GroupSelect\": {\r\n \"Label\": \"Select group\",\r\n \"CancelButton\": \"Cancel\",\r\n \"SelectButton\": \"Select\",\r\n \"Title\": \"CHANGE PARTICIPANT'S LANGUAGE\",\r\n \"Message\": \"In order to complete this move, the participant's language will be changed from [LANGUAGE] to\",\r\n \"ContinueButton\": \"Continue\",\r\n \"CloseButton\": \"Close\"\r\n },\r\n \"ModalSendInvite\": {\r\n \"Title\": \"Send Invite\",\r\n \"EmailToLabel\": \"To:\",\r\n \"EmailTo\": \"<>\",\r\n \"EmailSubjectLabel\": \"Subject:\",\r\n \"EmailSubject\": \"Login Instructions for Your Health Risk Assessment\",\r\n \"EmailBodyLabel\": \"Message:\",\r\n \"EmailBody\": \"You are invited to take an online health risk assessment (HRA). Here's what to do next: 1. Click the link below. 2. Set your password. 3. On the login page, enter your username and your password. The HRA will only take about 10-15 minutes to fill out. Click the login link below to get started!\",\r\n \"AppendedTextLabel\": \"Appended Text (Read Only)\",\r\n \"AppendedText\": \"Login \",\r\n \"SendLabel\": \"Send\",\r\n \"CancelLabel\": \"Cancel\",\r\n \"CloseLabel\": \"Close\",\r\n \"SaveAsTemplateLabel\": \"Save as group template \"\r\n }\r\n }} \r\n * \r\n */\r\nconst ParticipantControl = (props) => {\r\n const dispatch = useDispatch()\r\n const ParticipantTab = props.ParticipantTab\r\n const ParticipantHome = ParticipantTab.ParticipantHome\r\n\r\n const Contexts = useSelector(state => selectContextEntities(state))\r\n\r\n const { showArchivedParticipants } = Contexts\r\n\r\n const [isCreateOpen, setIsCreateOpen] = useState(false)\r\n\r\n const handleClose = () => {\r\n setIsCreateOpen(false)\r\n dispatch(adminparticipantClear())\r\n }\r\n\r\n const handleOpen = () => {\r\n setIsCreateOpen(true)\r\n }\r\n const handleInactiveParticipants = (nv) => {\r\n dispatch(contextUpsert({ Key: \"showArchivedParticipants\", Value: nv }))\r\n }\r\n return (\r\n \r\n \r\n \r\n { handleOpen() }}>\r\n {ParticipantHome.CreatePartLink.LinkText}\r\n \r\n \r\n \r\n\r\n \r\n \r\n { handleInactiveParticipants(e.target.checked) }} />\r\n {ParticipantHome.PartMngArchivedPartsCheckBox.BoxText} \r\n \r\n \r\n\r\n \r\n \r\n {handleClose() }} />\r\n Refresh participant list \r\n \r\n \r\n\r\n { handleClose() }}\r\n >\r\n \r\n Create Participant \r\n \r\n \r\n \r\n { handleClose() }} />\r\n \r\n \r\n \r\n \r\n )\r\n\r\n}\r\nexport default ParticipantControl","import { createSlice, createSelector, createAsyncThunk } from '@reduxjs/toolkit'\r\n\r\n// import { BASE_URL, OrganizationId, AuthToken } from '/features/storeconfig'\r\nimport axios from \"axios\";\r\n\r\n\r\nconst initialState = {\r\n entities: {},\r\n status: 'idle', // idle loading success fail \r\n error: null\r\n}\r\n/**\r\n * \r\n * ~~ = ignore\r\n * ~_~ = delete/set to default value\r\n */\r\nconst PLATFORM = '../../WsWebServicePlatform/'\r\n// Participant/Misc/Types/Get/{AuthToken}/\t\r\n// Participant/Misc/Type/Update/{AuthToken}/{ParticipantMiscTypeGuid}/{MiscTypeName}/{MiscTypeDescription}/\t\r\n// Participant/Misc/Type/Delete/{AuthToken}/{ParticipantMiscTypeGuid}/\t\r\n// Participant/Misc/Type/Create/{AuthToken}/{MiscTypeName}/{MiscTypeDescription}/\t\r\nexport const fetchMiscTypes = createAsyncThunk('misctype/get', async (incomingVariable, thunkAPI) => {\r\n console.log('called fetch misctype')\r\n try {\r\n const response = await axios.get(PLATFORM + \"Participant/Misc/Types/Get/\" + incomingVariable.authToken + \"/\")\r\n const data = await response.data.Success ? response.data : []\r\n //('getting data', data)\r\n return data\r\n } catch (err) {\r\n console.log('error', err)\r\n return thunkAPI.rejectWithValue({ error: err.message });\r\n }\r\n})\r\n\r\nexport const updateMiscTypes = createAsyncThunk('misctype/update', async (incomingVariable, thunkAPI) => {\r\n console.log('called update misctype')\r\n try {\r\n const response = await axios.post(PLATFORM\r\n + \"Participant/Misc/Type/Update/\"\r\n + incomingVariable.authToken + \"/\"\r\n + incomingVariable.ParticipantMiscTypeGuid + \"/\"\r\n + incomingVariable.MiscTypeName + \"/\"\r\n + incomingVariable.MiscTypeDescription + \"/\"\r\n )\r\n const data = await response.data.Success ? response.data : []\r\n return data\r\n } catch (err) {\r\n console.log('error', err)\r\n return thunkAPI.rejectWithValue({ error: err.message });\r\n }\r\n})\r\n\r\nexport const deleteMiscTypes = createAsyncThunk('misctype/delete', async (incomingVariable, thunkAPI) => {\r\n console.log('called delete misctype')\r\n try {\r\n const response = await axios.post(PLATFORM\r\n + \"Participant/Misc/Type/Delete/\"\r\n + incomingVariable.authToken + \"/\"\r\n + incomingVariable.ParticipantMiscTypeGuid + \"/\"\r\n )\r\n const data = await response.data.Success ? response.data : []\r\n return data\r\n } catch (err) {\r\n console.log('error', err)\r\n return thunkAPI.rejectWithValue({ error: err.message });\r\n }\r\n})\r\n\r\nexport const createMiscTypes = createAsyncThunk('misctype/create', async (incomingVariable, thunkAPI) => {\r\n console.log('called update misctype')\r\n try {\r\n const response = await axios.post(PLATFORM\r\n + \"Participant/Misc/Type/Create/\"\r\n + incomingVariable.authToken + \"/\"\r\n + incomingVariable.MiscTypeName + \"/\"\r\n + incomingVariable.MiscTypeDescription + \"/\"\r\n )\r\n const data = await response.data.Success ? response.data : []\r\n return data\r\n } catch (err) {\r\n console.log('error', err)\r\n return thunkAPI.rejectWithValue({ error: err.message });\r\n }\r\n})\r\n\r\nconst misctypeSlice = createSlice({\r\n name: 'misctypes',\r\n initialState,\r\n reducers: { \r\n misctypeClear(state, action) {\r\n state.entities = initialState\r\n state.status = \"idle\"\r\n \r\n }\r\n },\r\n extraReducers(builder) {\r\n builder\r\n //\r\n .addCase(fetchMiscTypes.pending, (state, action) => {\r\n state.status = 'loading'\r\n })\r\n .addCase(fetchMiscTypes.fulfilled, (state, action) => {\r\n state.status = 'success'\r\n const loadedData = action.payload.Info\r\n const data = {}\r\n for (var i = 0; i < loadedData.length; i++) {\r\n data[loadedData[i].ParticipantMiscTypeGuid] = loadedData[i]\r\n }\r\n state.entities = data\r\n })\r\n .addCase(fetchMiscTypes.rejected, (state, action) => {\r\n state.error = action.error.message\r\n console.log('failed')\r\n })\r\n \r\n //\r\n .addCase(updateMiscTypes.pending, (state, action) => {\r\n state.status = 'loading'\r\n })\r\n .addCase(updateMiscTypes.fulfilled, (state, action) => {\r\n state.status = 'success'\r\n const loadedData = action.payload.Info\r\n state.entities[loadedData.ParticipantMiscTypeGuid] = loadedData\r\n })\r\n .addCase(updateMiscTypes.rejected, (state, action) => {\r\n state.error = action.error.message\r\n console.log('failed')\r\n })\r\n \r\n //\r\n .addCase(deleteMiscTypes.pending, (state, action) => {\r\n state.status = 'loading'\r\n })\r\n .addCase(deleteMiscTypes.fulfilled, (state, action) => {\r\n state.status = 'success'\r\n const loadedData = action.payload.Info\r\n delete state.entities[loadedData.ParticipantMiscTypeGuid]\r\n })\r\n .addCase(deleteMiscTypes.rejected, (state, action) => {\r\n state.error = action.error.message\r\n console.log('failed')\r\n })\r\n\r\n\r\n }\r\n})\r\n\r\nexport const { misctypeClear} = misctypeSlice.actions\r\n\r\nexport default misctypeSlice.reducer\r\n\r\nconst selectMiscTypeEntities = (state) => state.misctypes.entities\r\n\r\nexport const selectMiscTypes = createSelector(selectMiscTypeEntities, (entities) =>\r\n Object.values(entities)\r\n)\r\n\r\nexport const selectMiscTypeById = (state, MiscTypeId) => {\r\n return selectMiscTypeEntities(state)[MiscTypeId]\r\n}\r\n\r\n","//Participant/Update/{AuthToken}/{ParticipantGuid}/{GroupGuid}/{ParticipantGroupGuid}/{LanguageID}/{LastName}/{FirstName}/{MiddleName}/{BioDOB}/{BioGender}/{BioRace}/{BioRace2}/{BioRace3}/{SpokenLanguageID}/{Email}/{StatusID}/{EducationLevelGuid}/{Medicaid}/\t\r\n\r\nimport React, { useState } from 'react'\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport _ from \"lodash\"\r\nimport { Button, Grid, Typography, Box, Collapse, TextField, MenuItem } from '@mui/material'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { selectCountrys } from '../../../reducers/reference_country';\r\nimport { selectEducations } from '../../../reducers/reference_education';\r\nimport { selectSpokenLanguages } from '../../../reducers/reference_spokenlanguage';\r\nimport { selectParticipantDemographicsById, updateParticipantDemographics } from '../../../reducers/admincenter_participantdemographics';\r\nimport { selectMiscTypes } from '../../../reducers/reference_misctypes';\r\nimport { selectRaceEntities } from '../../../reducers/reference_race';\r\nimport { selectBirthSexs } from '../../../reducers/reference_birthsex';\r\nimport { ArrowDropDown, ArrowDropUp } from \"@mui/icons-material\";\r\nimport { adminparticipantModify, selectAdminParticipantById } from '../../../reducers/admincenter_participants';\r\nimport { createParticipantAddresss, selectParticipantAddresssByTypeGuid, updateParticipantAddresss } from '../../../reducers/admincenter_participantaddress';\r\nimport { createParticipantPhones, selectParticipantPhonesByTypeGuid, updateParticipantPhones } from '../../../reducers/admincenter_participantphone';\r\nimport { createParticipantMiscs, deleteParticipantMiscs, selectParticipantMiscs, updateParticipantMiscs } from '../../../reducers/admincenter_participantmisc';\r\nimport { AddCircleOutline, Delete } from '@mui/icons-material';\r\n\r\n\r\n// WsWebServicePlatform/help\r\n\r\n// Group/Participant/Create POST BODY: has userName\t\r\n\r\n// Participant/Merge/{AuthToken}/{SourceParticipantGuid}/{TargetParticipantGuid}/\t\r\n// Group/Participant/Move/{AuthToken}/{ParticipantGuid}/{ToGroupGuid}/\t\r\n\r\nconst ParticipantEdit = (props) => {\r\n const dispatch = useDispatch()\r\n\r\n const ParticipantGuid = props.Participant.ParticipantGuid\r\n const Participant = useSelector(state => selectAdminParticipantById(state, ParticipantGuid))\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n\r\n const ParticipantAdditionalInfo = useSelector(state => selectParticipantDemographicsById(state, Participant.ParticipantGuid))\r\n\r\n const countryData = useSelector(state => selectCountrys(state))\r\n const educationData = useSelector(state => selectEducations(state))\r\n const languageData = useSelector(state => selectSpokenLanguages(state))\r\n\r\n\r\n const raceData = useSelector(state => selectRaceEntities(state))\r\n const birthSexData = useSelector(state => selectBirthSexs(state))\r\n\r\n const langOptions = languageData.map((x) => {\r\n return ({x.StandardContent} )\r\n })\r\n\r\n const eduOptions = educationData.map((x) => {\r\n return ({x.EducationTypeName} )\r\n })\r\n\r\n const countryOptions = countryData.map((x) => {\r\n return ({x.StandardContent} )\r\n })\r\n\r\n const birthSexOptions = birthSexData.map((x) => {\r\n return ({x.GenderTypeName} )\r\n })\r\n\r\n const raceOptions = raceData.map((x) => {\r\n return ({x.RaceTypeName} )\r\n })\r\n\r\n const [localDemographicState, setLocalDemographicState] = useState({ ...Participant, ...ParticipantAdditionalInfo })\r\n\r\n const participantdemographicStatus = useSelector(state => state.participantdemographics.status)\r\n const participantaddressStatus = useSelector(state => state.participantaddresss.status)\r\n const participantphoneStatus = useSelector(state => state.participantphones.status)\r\n const participantmiscStatus = useSelector(state => state.participantmiscs.status)\r\n\r\n const participantdemographicError = useSelector(state => state.participantdemographics.error)\r\n const participantaddressError = useSelector(state => state.participantaddresss.error)\r\n const participantphoneError = useSelector(state => state.participantphones.error)\r\n const participantmiscError = useSelector(state => state.participantmiscs.error)\r\n\r\n const [isError, setIsError] = useState(false)\r\n const [isSaving, setIsSaving] = useState(false)\r\n\r\n const datToday = new Date(new Date().setDate(new Date().getDate() - 1));\r\n const dat120 = new Date()\r\n dat120.setFullYear(dat120.getFullYear() - 120)\r\n\r\n const validDob = !localDemographicState.BioDOB || (new Date(localDemographicState.BioDOB) >= dat120 && new Date(localDemographicState.BioDOB) < datToday)\r\n // useEffect(() => {\r\n // if (\r\n // participantdemographicStatus === 'success'\r\n // && participantaddressStatus === 'success'\r\n // && participantphoneStatus === 'success'\r\n // && participantmiscStatus === 'success'\r\n // && isSaving === true\r\n // ) {\r\n // setIsSaving(false)\r\n // props.cancelButton()\r\n // } else if (\r\n // participantdemographicStatus === 'failed'\r\n // || participantaddressStatus === 'failed'\r\n // || participantphoneStatus === 'failed'\r\n // || participantmiscStatus === 'failed'\r\n // ) {\r\n // setIsError(true)\r\n // setIsSaving(false)\r\n // }\r\n // }, [participantdemographicStatus, participantaddressStatus, participantphoneStatus, participantmiscStatus, isSaving])\r\n\r\n //phone\r\n const ParticipantPhone_Home = useSelector(state => selectParticipantPhonesByTypeGuid(state, \"C05F6C51-5992-477C-BD94-7EE28E7CD4BD\"))\r\n const ParticipantPhone_Mobile = useSelector(state => selectParticipantPhonesByTypeGuid(state, \"9232B9CA-5C20-40C2-9190-25E302FDC0BE\"))\r\n\r\n const basePhoneObject = {\r\n // commenting out, a new object wont have this field ParticipantPhoneGuid:\"INPUT PhoneGUID\",\r\n // will add this base on state ParticipantPhoneTypeGuid:\"PhoneTypeGUID\",\r\n ParticipantGuid: Participant.ParticipantGuid,\r\n Priority: 1,\r\n PhoneNumber: \"\",\r\n }\r\n const [localPhoneStateHome, setLocalPhoneStateHome] = useState(\r\n ParticipantPhone_Home[0]\r\n || { ...basePhoneObject, ParticipantPhoneTypeGuid: \"C05F6C51-5992-477C-BD94-7EE28E7CD4BD\" })\r\n const [localPhoneStateMobile, setLocalPhoneStateMobile] = useState(\r\n ParticipantPhone_Mobile[0]\r\n || { ...basePhoneObject, ParticipantPhoneTypeGuid: \"9232B9CA-5C20-40C2-9190-25E302FDC0BE\", Priority: 2 })\r\n // Cell\t9232B9CA-5C20-40C2-9190-25E302FDC0BE\r\n // Home\tC05F6C51-5992-477C-BD94-7EE28E7CD4BD\r\n // Work\t7589F933-3B55-4974-B50E-2A6000C29456\r\n // address\r\n const ParticipantAddress = useSelector(state => selectParticipantAddresssByTypeGuid(state, \"90899741-5728-4F9C-A489-691131304962\"))\r\n const baseAddress = {\r\n // commenting out, a new object wont have this field ParticipantAddressGuid:,\r\n ParticipantAddressTypeGuid: \"90899741-5728-4F9C-A489-691131304962\",\r\n ParticipantGuid: Participant.ParticipantGuid,\r\n Priority: 1,\r\n Address1: \"\",\r\n Address2: \"\",\r\n Address3: \"\",\r\n City: \"\",\r\n PostalCode: \"\",\r\n StateProvinceCounty: \"\",\r\n CountryCode: \"\",\r\n ParticipantAddressTypeName: \"\",\r\n }\r\n\r\n const [localAddressState, setLocalAddressState] = useState(ParticipantAddress[0] || baseAddress)\r\n\r\n // misc type\r\n const participantMiscTypes = useSelector(state => selectParticipantMiscs(state))\r\n const misctypeData = useSelector(state => selectMiscTypes(state))\r\n\r\n const [miscTypeState, setMiscTypeState] = useState(participantMiscTypes)\r\n const [miscTypeStateActualDelete, setMiscTypeStateActualDelete] = useState([])\r\n\r\n const miscTypeOptions = misctypeData.map((x) => {\r\n return ({x.MiscTypeName} )\r\n })\r\n\r\n const AddMiscType = () => {\r\n let currentMisc = [...miscTypeState]\r\n currentMisc.push({ ParticipantGuid: Participant.ParticipantGuid, MiscData: \"\", ParticipantMiscTypeGuid: misctypeData[0] })\r\n setMiscTypeState(currentMisc)\r\n }\r\n const handleMiscTypeEdit = (index, key, value) => {\r\n\r\n let currentMisc = [...miscTypeState]\r\n currentMisc[index] = { ...currentMisc[index], [key]: value }\r\n setMiscTypeState(currentMisc)\r\n }\r\n const handleMiscTypeDelete = (index) => {\r\n let currentMisc = [...miscTypeState]\r\n let recordremoved = currentMisc.splice(index, 1); // 2nd parameter means remove one item only\r\n let oneRecord = recordremoved[0]\r\n //console.log('handle delete misc', { r: recordremoved, o: oneRecord })\r\n if (oneRecord.ParticipantMiscGuid) {\r\n let currentDelete = [...miscTypeStateActualDelete]\r\n currentDelete.push(oneRecord)\r\n setMiscTypeStateActualDelete(currentDelete)\r\n }\r\n setMiscTypeState(currentMisc)\r\n }\r\n\r\n // component stuff \r\n const [isGroupExpanded, setIsGroupExpanded] = useState(true)\r\n const [isDemoExpanded, setIsDemoExpanded] = useState(false)\r\n const [isContactExpanded, setisContactExpanded] = useState(false)\r\n const [isOtherExpanded, setIsOtherExpanded] = useState(false)\r\n\r\n\r\n const handleAllChanges = (what) => {\r\n var currentTF\r\n switch (what) {\r\n case \"DEMO\":\r\n currentTF = isDemoExpanded\r\n break;\r\n case \"CONTACT\":\r\n currentTF = isContactExpanded\r\n break;\r\n case \"OTHER\":\r\n currentTF = isOtherExpanded\r\n break;\r\n case \"GROUP\":\r\n currentTF = isGroupExpanded\r\n break;\r\n default:\r\n break;\r\n }\r\n // default state is t / f / f / f\r\n // since only one can be true, the above code will tell us\r\n // what and the current incoming request.\r\n // if im false, and i come in, i should be true and the rest should be false\r\n // if im true, then i should just be false\r\n // therefore we only care if the current state is false\r\n\r\n // if my current state is false, then true.. else i should be false\r\n setIsGroupExpanded(!currentTF && what === \"GROUP\" ? true : false)\r\n setIsDemoExpanded(!currentTF && what === \"DEMO\" ? true : false)\r\n setisContactExpanded(!currentTF && what === \"CONTACT\" ? true : false)\r\n setIsOtherExpanded(!currentTF && what === \"OTHER\" ? true : false)\r\n\r\n }\r\n\r\n\r\n const sanitizeNull = (val) => {\r\n if (!val || val == -1) {\r\n return \"~_~\"\r\n } return val\r\n }\r\n\r\n const SaveToDatabase = () => {\r\n setIsError(false)\r\n setIsSaving(true)\r\n // save demographics\r\n let DemoToSave = {\r\n ...localDemographicState\r\n , authToken: currentUser.AuthToken\r\n , ParticipantGroupGuid: sanitizeNull(localDemographicState.ParticipantGroupGuid)\r\n , LanguageID: sanitizeNull(localDemographicState.LanguageID)\r\n , Lastname: sanitizeNull(localDemographicState.Lastname)\r\n , Firstname: sanitizeNull(localDemographicState.Firstname)\r\n , Middlename: sanitizeNull(localDemographicState.Middlename)\r\n , BioDOB: sanitizeNull(localDemographicState.BioDOB)\r\n , BioGender: sanitizeNull(localDemographicState.BioGender)\r\n , BioRace: sanitizeNull(localDemographicState.BioRace)\r\n , BioRace2: sanitizeNull(localDemographicState.BioRace2)\r\n , BioRace3: sanitizeNull(localDemographicState.BioRace3)\r\n , SpokenLanguageID: sanitizeNull(localDemographicState.SpokenLanguageID)\r\n , Email: sanitizeNull(localDemographicState.Email)\r\n , Status: sanitizeNull(localDemographicState.Status)\r\n , EducationLevelGuid: sanitizeNull(localDemographicState.EducationLevelGuid)\r\n , Medicaid: sanitizeNull(localDemographicState.Medicaid)\r\n }\r\n\r\n dispatch(updateParticipantDemographics(DemoToSave))\r\n\r\n let UserTableToSave = {\r\n ...localDemographicState,\r\n FirstName: localDemographicState.Firstname,\r\n LastName: localDemographicState.Lastname,\r\n UserName: localDemographicState.UserName,\r\n StatusDisplay: localDemographicState.Status === \"1\" ? \"Active\" : \"InActive\",\r\n BioDOB: localDemographicState.BioDOB\r\n }\r\n\r\n dispatch(adminparticipantModify(UserTableToSave))\r\n\r\n // phone modificiations\r\n\r\n const sanitizeHome = {\r\n ...localPhoneStateHome\r\n , PhoneNumber: sanitizeNull(localPhoneStateHome.PhoneNumber)\r\n }\r\n const sanitizeMobile = {\r\n ...localPhoneStateMobile\r\n , PhoneNumber: sanitizeNull(localPhoneStateMobile.PhoneNumber)\r\n }\r\n\r\n if (sanitizeHome.ParticipantPhoneGuid) {\r\n dispatch(updateParticipantPhones({ ...sanitizeHome, authToken: currentUser.AuthToken }))\r\n } else {\r\n dispatch(createParticipantPhones({ ...sanitizeHome, authToken: currentUser.AuthToken }))\r\n }\r\n\r\n if (sanitizeMobile.ParticipantPhoneGuid) {\r\n dispatch(updateParticipantPhones({ ...sanitizeMobile, authToken: currentUser.AuthToken }))\r\n } else {\r\n dispatch(createParticipantPhones({ ...sanitizeMobile, authToken: currentUser.AuthToken }))\r\n }\r\n\r\n\r\n\r\n const sanitizeAddress = {\r\n ...localAddressState,\r\n Priority: sanitizeNull(localAddressState.Priority),\r\n Address1: sanitizeNull(localAddressState.Address1),\r\n Address2: sanitizeNull(localAddressState.Address2),\r\n Address3: sanitizeNull(localAddressState.Address3),\r\n City: sanitizeNull(localAddressState.City),\r\n PostalCode: sanitizeNull(localAddressState.PostalCode),\r\n StateProvinceCounty: sanitizeNull(localAddressState.StateProvinceCounty),\r\n CountryCode: sanitizeNull(localAddressState.CountryCode),\r\n }\r\n\r\n if (sanitizeAddress.ParticipantAddressGuid) {\r\n dispatch(updateParticipantAddresss({ ...sanitizeAddress, authToken: currentUser.AuthToken }))\r\n } else {\r\n dispatch(createParticipantAddresss({ ...sanitizeAddress, authToken: currentUser.AuthToken }))\r\n }\r\n\r\n // create / update misc types\r\n for (var pm = 0; pm < miscTypeState.length; pm++) {\r\n let sanitizeMiscNew = {\r\n ParticipantGuid: miscTypeState[pm].ParticipantGuid\r\n , ParticipantMiscGuid: miscTypeState[pm].ParticipantMiscGuid\r\n , ParticipantMiscTypeGuid: miscTypeState[pm].ParticipantMiscTypeGuid\r\n , Priority: sanitizeNull(miscTypeState[pm].Priority)\r\n , MiscData: sanitizeNull(miscTypeState[pm].MiscData)\r\n }\r\n\r\n if (sanitizeMiscNew.ParticipantMiscGuid) {\r\n dispatch(updateParticipantMiscs({ ...sanitizeMiscNew, authToken: currentUser.AuthToken }))\r\n } else {\r\n dispatch(createParticipantMiscs({ ...sanitizeMiscNew, authToken: currentUser.AuthToken }))\r\n }\r\n }\r\n //delete misc types\r\n for (var pm = 0; pm < miscTypeStateActualDelete.length; pm++) {\r\n let sanitizeMiscNew = {\r\n ParticipantGuid: miscTypeStateActualDelete[pm].ParticipantGuid\r\n , ParticipantMiscGuid: miscTypeStateActualDelete[pm].ParticipantMiscGuid\r\n , ParticipantMiscTypeGuid: miscTypeStateActualDelete[pm].ParticipantMiscTypeGuid\r\n , Priority: sanitizeNull(miscTypeStateActualDelete[pm].Priority)\r\n , MiscData: sanitizeNull(miscTypeStateActualDelete[pm].MiscData)\r\n }\r\n\r\n if (sanitizeMiscNew.ParticipantMiscGuid) {\r\n dispatch(deleteParticipantMiscs({ ...sanitizeMiscNew, authToken: currentUser.AuthToken }))\r\n }\r\n }\r\n\r\n\r\n\r\n props.cancelButton()\r\n }\r\n\r\n const handleModifyLocal = (k, v) => {\r\n let copy = { ...localDemographicState, [k]: v }\r\n\r\n setLocalDemographicState(copy)\r\n\r\n }\r\n\r\n\r\n\r\n\r\n return (\r\n \r\n \r\n Edit Participant \r\n \r\n {isError === true && (\r\n\r\n \r\n \r\n {participantdemographicError.ErrorMessage\r\n || participantaddressError.ErrorMessage\r\n || participantphoneError.ErrorMessage\r\n || participantmiscError.ErrorMessage\r\n\r\n }\r\n \r\n \r\n )\r\n }\r\n \r\n { handleAllChanges(\"GROUP\") }}>\r\n {isGroupExpanded ? ( \r\n \r\n \r\n \r\n \r\n \r\n \r\n Group: {localDemographicState.GroupName}\r\n \r\n \r\n \r\n \r\n Status: {localDemographicState.Status === \"1\" ? \"Active\" : \"Inactive\"}\r\n \r\n \r\n \r\n \r\n Username: {localDemographicState.UserName}\r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n { handleAllChanges(\"DEMO\") }}>\r\n {isDemoExpanded ? ( \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n { setLocalDemographicState({ ...localDemographicState, \"Firstname\": e.target.value }) }}\r\n />\r\n \r\n \r\n { setLocalDemographicState({ ...localDemographicState, \"Middlename\": e.target.value }) }}\r\n />\r\n \r\n \r\n { setLocalDemographicState({ ...localDemographicState, \"Lastname\": e.target.value }) }}\r\n />\r\n \r\n\r\n\r\n \r\n { setLocalDemographicState({ ...localDemographicState, \"BioDOB\": e.target.value }) }}\r\n />\r\n \r\n \r\n { handleModifyLocal(\"EducationLevelGuid\", e.target.value) }}\r\n >\r\n {eduOptions}\r\n \r\n \r\n\r\n \r\n { handleModifyLocal(\"SpokenLanguageID\", e.target.value) }}\r\n >\r\n {langOptions}\r\n \r\n \r\n\r\n \r\n { handleModifyLocal(\"BioGender\", e.target.value) }}\r\n >\r\n {birthSexOptions}\r\n \r\n \r\n\r\n \r\n { handleModifyLocal(\"BioRace\", e.target.value) }}\r\n >\r\n {raceOptions}\r\n \r\n \r\n\r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n\r\n\r\n \r\n { handleAllChanges(\"CONTACT\") }}>\r\n {isContactExpanded ? ( \r\n \r\n \r\n \r\n \r\n \r\n { handleModifyLocal(\"Email\", e.target.value) }}\r\n />\r\n \r\n\r\n \r\n \r\n\r\n\r\n \r\n { setLocalPhoneStateHome({ ...localPhoneStateHome, PhoneNumber: e.target.value }) }}\r\n />\r\n \r\n \r\n { setLocalPhoneStateMobile({ ...localPhoneStateMobile, PhoneNumber: e.target.value }) }}\r\n />\r\n \r\n\r\n \r\n \r\n\r\n \r\n { setLocalAddressState({ ...localAddressState, Address1: e.target.value }) }}\r\n />\r\n \r\n \r\n\r\n { setLocalAddressState({ ...localAddressState, CountryCode: e.target.value }) }}\r\n >\r\n {countryOptions}\r\n \r\n \r\n \r\n { setLocalAddressState({ ...localAddressState, City: e.target.value }) }}\r\n />\r\n\r\n \r\n \r\n { setLocalAddressState({ ...localAddressState, StateProvinceCounty: e.target.value }) }}\r\n />\r\n\r\n \r\n \r\n { setLocalAddressState({ ...localAddressState, PostalCode: e.target.value }) }}\r\n />\r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n { handleAllChanges(\"OTHER\") }}>\r\n {isOtherExpanded ? ( \r\n \r\n \r\n\r\n \r\n \r\n\r\n \r\n \r\n\r\n {\r\n miscTypeState.map((x, i) => {\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n { handleMiscTypeEdit(i, 'ParticipantMiscTypeGuid', e.target.value) }}\r\n >\r\n {miscTypeOptions}\r\n \r\n \r\n\r\n \r\n { handleMiscTypeEdit(i, 'MiscData', e.target.value) }}\r\n />\r\n \r\n \r\n { handleMiscTypeEdit(i, 'Priority', e.target.value) }}\r\n />\r\n \r\n \r\n handleMiscTypeDelete(i)} />\r\n \r\n \r\n \r\n \r\n )\r\n })\r\n }\r\n \r\n { if (miscTypeState.length < 9) { AddMiscType(); } }} />\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n { SaveToDatabase() }}>Save \r\n \r\n \r\n \r\n \r\n { props.cancelButton() }}>Cancel \r\n \r\n \r\n \r\n \r\n\r\n \r\n )\r\n\r\n}\r\nexport default ParticipantEdit\r\n","//Participant/Update/{AuthToken}/{ParticipantGuid}/{GroupGuid}/{ParticipantGroupGuid}/{LanguageID}/{LastName}/{FirstName}/{MiddleName}/{BioDOB}/{BioGender}/{BioRace}/{BioRace2}/{BioRace3}/{SpokenLanguageID}/{Email}/{StatusID}/{EducationLevelGuid}/{Medicaid}/\t\r\n\r\nimport React from 'react'\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport _ from \"lodash\"\r\nimport { Grid, Typography, Box, } from '@mui/material'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { selectParticipantDemographicsById } from '../../../reducers/admincenter_participantdemographics';\r\nimport { selectAdminParticipantById } from '../../../reducers/admincenter_participants';\r\nimport dayjs from 'dayjs'\r\n\r\n// WsWebServicePlatform/help\r\n\r\n// Participant/Phones/Get/{AuthToken}/{ParticipantGuid}/\t\r\n// Participant/Phone/Types/Get/{AuthToken}/\t\r\n// Participant/Phone/Create/{AuthToken}/{ParticipantGuid}/{ParticipantPhoneTypeGuid}/{Priority}/{PhoneNumber}/\t\r\n// Participant/Phone/Update/{AuthToken}/{ParticipantPhoneGuid}/{ParticipantPhoneTypeGuid}/{Priority}/{PhoneNumber}/\t\r\n// Participant/Phone/Delete/{AuthToken}/{ParticipantPhoneGuid}/\t\r\n\r\n// Participant/Address/Create/{AuthToken}/{ParticipantGuid}/{ParticipantAddressTypeGuid}/{Priority}/{Address1}/{Address2}/{Address3}/{City}/{StateProvinceCounty}/{PostalCode}/{CountryCode}/\r\n// Participant/Address/Delete/{AuthToken}/{ParticipantAddressGuid}/\t\t\r\n// Participant/Address/Types/Get/{AuthToken}/\t\r\n// Participant/Address/Update/{AuthToken}/{ParticipantAddressGuid}/{ParticipantAddressTypeGuid}/{Priority}/{Address1}/{Address2}/{Address3}/{City}/{StateProvinceCounty}/{PostalCode}/{CountryCode}/\t\r\n// Participant/Addresses/Get/{AuthToken}/{ParticipantGuid}/\t\r\n\r\n\r\n// Participant/Misc/Update/{AuthToken}/{ParticipantMiscGuid}/{ParticipantMiscTypeGuid}/{Priority}/{MiscData}/\t\r\n// Participant/Miscs/Get/{AuthToken}/{ParticipantGuid}/\t\r\n// Participant/Misc/Delete/{AuthToken}/{ParticipantMiscGuid}/\t\r\n// Participant/Misc/Create/{AuthToken}/{ParticipantGuid}/{ParticipantMiscTypeGuid}/{Priority}/{MiscData}/\r\n\r\n// Participant/Update/{AuthToken}/{ParticipantGuid}/{GroupGuid}/{ParticipantGroupGuid}/{LanguageID}/{LastName}/{FirstName}/{MiddleName}/{BioDOB}/{BioGender}/{BioRace}/{BioRace2}/{BioRace3}/{SpokenLanguageID}/{Email}/{StatusID}/{EducationLevelGuid}/{Medicaid}/\t\r\n// Participant/Get/{AuthToken}/{ParticipantGuid}/\r\n// Group/Participant/Create POST BODY: has userName\t\r\n\r\n// Participant/Merge/{AuthToken}/{SourceParticipantGuid}/{TargetParticipantGuid}/\t\r\n// Group/Participant/Move/{AuthToken}/{ParticipantGuid}/{ToGroupGuid}/\t\r\n\r\nconst ParticipantDisplay = (props) => {\r\n const dispatch = useDispatch()\r\n //const Participant = props.Participant\r\n const LongForm = props.LongForm ? true : false\r\n const Participant = useSelector(state=>selectAdminParticipantById(state, props.Participant.ParticipantGuid))\r\n const ParticipantAdditionalInfo = useSelector(state => selectParticipantDemographicsById(state, Participant.ParticipantGuid))\r\n const displayDate = dayjs(Participant.LastLogin)\r\n const displayDateString = ( Participant.LastLogin ? ( displayDate.format(\"YYYY-MM-DD\") + ' ' + displayDate.format(\"h:mm a\") ) : null )\r\n\r\n const MainContainer = () => {\r\n return (\r\n \r\n \r\n username: {Participant.UserName} \r\n \r\n \r\n email: {ParticipantAdditionalInfo && ParticipantAdditionalInfo.Email} \r\n \r\n \r\n birthday: {Participant.BioDOB} \r\n \r\n \r\n group name: {Participant.GroupName} \r\n \r\n \r\n last login: {displayDateString} \r\n \r\n \r\n status: {Participant.StatusDisplay} \r\n \r\n \r\n )\r\n }\r\n \r\n\r\n return (\r\n\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n )\r\n\r\n}\r\nexport default ParticipantDisplay\r\n","import React, { useState, useEffect } from 'react'\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport _ from \"lodash\"\r\nimport { Button, Grid, Typography, Box, TextField, } from '@mui/material'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { selectParticipantDemographicsById } from '../../../reducers/admincenter_participantdemographics';\r\nimport { fetchParticipantInvites, participantinviteClear } from '../../../reducers/admincenter_participantinvite';\r\nimport { selectErrorMessagesByNegativeCode } from '../../../reducers/reference_errormessages';\r\nimport { useLocation } from 'react-router';\r\n\r\n/**\r\n * \r\n * {\"ModalSendInvite\": {\r\n \"Title\": \"Send Invite\",\r\n \"EmailToLabel\": \"To:\",\r\n \"EmailTo\": \"<>\",\r\n \"EmailSubjectLabel\": \"Subject:\",\r\n \"EmailSubject\": \"Login Instructions for Your Health Risk Assessment\",\r\n \"EmailBodyLabel\": \"Message:\",\r\n \"EmailBody\": \"You are invited to take an online health risk assessment (HRA). Here's what to do next: 1. Click the link below. 2. Set your password. 3. On the login page, enter your username and your password. The HRA will only take about 10-15 minutes to fill out. Click the login link below to get started!\",\r\n \"AppendedTextLabel\": \"Appended Text (Read Only)\",\r\n \"AppendedText\": \"Login \",\r\n \"SendLabel\": \"Send\",\r\n \"CancelLabel\": \"Cancel\",\r\n \"CloseLabel\": \"Close\",\r\n \"SaveAsTemplateLabel\": \"Save as group template \"\r\n }} props \r\n * \r\n */\r\nconst ParticipantInvite = (props) => {\r\n const dispatch = useDispatch()\r\n const location = useLocation()\r\n\r\n const Participant = props.Participant\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const ParticipantAdditionalInfo = useSelector(state => selectParticipantDemographicsById(state, Participant.ParticipantGuid))\r\n const CombinedData = ({ ...Participant, ...ParticipantAdditionalInfo })\r\n const [messageState, setMessageState] = useState(\r\n { EmailTo: CombinedData.Email\r\n , EmailSubject: props.ParticipantTab && props.ParticipantTab.ModalSendInvite && props.ParticipantTab.ModalSendInvite.EmailSubject\r\n , EmailBody: props.ParticipantTab && props.ParticipantTab.ModalSendInvite && props.ParticipantTab.ModalSendInvite.EmailBody\r\n , EmailFrom: \"\" \r\n })\r\n\r\n \r\n const participantInviteStatus = useSelector(state => state.participantinvites.status)\r\n const participantInviteError = useSelector(state => state.participantinvites.error)\r\n const ErrorMessage = useSelector(state => selectErrorMessagesByNegativeCode(state, participantInviteError && participantInviteError.ErrorID))\r\n const [isError, setIsError] = useState(false)\r\n\r\n useEffect(() => {\r\n if (participantInviteStatus === \"success\") {\r\n\r\n handleCancel()\r\n }\r\n else if (participantInviteStatus === \"failed\") {\r\n setIsError(true)\r\n }\r\n }, [participantInviteStatus])\r\n\r\n const handleSendInvite = () => {\r\n const appendedMessage = {...messageState, EmailBody: messageState.EmailBody + props.ParticipantTab.ModalSendInvite.AppendedText}\r\n dispatch(fetchParticipantInvites({ ...appendedMessage, authToken: currentUser.AuthToken, ParticipantId_Guid: CombinedData.ParticipantGuid }))\r\n\r\n }\r\n\r\n const handleCancel = () => {\r\n setIsError(false)\r\n dispatch(participantinviteClear())\r\n props.cancelButton()\r\n }\r\n\r\n function ValidateEmail(input) {\r\n var validRegex = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\\.[a-zA-Z0-9-]+)*$/;\r\n if (input.match(validRegex)) {\r\n return true;\r\n } else {\r\n return false;\r\n }\r\n }\r\n const ValidTo = ValidateEmail(messageState.EmailTo)\r\n // const ValidFrom = ValidateEmail(messageState.EmailFrom)\r\n return (\r\n \r\n \r\n \r\n Invite Participant \r\n \r\n \r\n {\r\n let temp = { ...messageState }\r\n temp.EmailTo = e.target.value\r\n setMessageState(temp)\r\n }}\r\n />\r\n \r\n {/* \r\n {\r\n let temp = { ...messageState }\r\n temp.EmailFrom = e.target.value\r\n setMessageState(temp)\r\n }}\r\n />\r\n */}\r\n \r\n {\r\n let temp = { ...messageState }\r\n temp.EmailSubject = e.target.value\r\n setMessageState(temp)\r\n }}\r\n />\r\n \r\n \r\n {\r\n let temp = { ...messageState }\r\n temp.EmailBody = e.target.value\r\n setMessageState(temp)\r\n }}\r\n />\r\n \r\n\r\n \r\n \r\n \r\n \r\n { handleSendInvite() }}>Send \r\n \r\n \r\n \r\n \r\n { handleCancel() }}>Cancel \r\n \r\n \r\n \r\n \r\n\r\n\r\n\r\n {isError === true && (\r\n\r\n \r\n \r\n \r\n {\r\n (ErrorMessage && ErrorMessage.length > 0 && ErrorMessage[0].MessageTypeContent)\r\n ||\r\n (participantInviteError && participantInviteError.ErrorMessage)\r\n }\r\n \r\n \r\n \r\n )}\r\n \r\n \r\n )\r\n}\r\n\r\nexport default ParticipantInvite","import React, { useState, useEffect } from 'react'\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport _ from \"lodash\"\r\nimport { Button, Grid, Typography, Box, TextField, } from '@mui/material'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { selectAdminParticipantById } from '../../../reducers/admincenter_participants';\r\nimport { selectErrorMessagesByNegativeCode } from '../../../reducers/reference_errormessages';\r\nimport { fetchParticipantPasswords, participantpasswordClear } from '../../../reducers/admincenter_participantpassword';\r\nimport { selectParticipantDemographicsById } from '../../../reducers/admincenter_participantdemographics';\r\n\r\n\r\nconst ParticipantResetPassword = (props) => {\r\n const dispatch = useDispatch()\r\n\r\n const ParticipantGuid = props.Participant.ParticipantGuid\r\n const Participant = useSelector(state => selectAdminParticipantById(state, ParticipantGuid))\r\n const ParticipantAdditionalInfo = useSelector(state => selectParticipantDemographicsById(state, Participant.ParticipantGuid))\r\n const CombinedData = ({ ...Participant, ...ParticipantAdditionalInfo })\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n //console.log('participant', CombinedData)\r\n const [localEmailState, setLocalEmailState] = useState(\"\")\r\n\r\n const participantPasswordStatus = useSelector(state => state.participantpasswords.status)\r\n const participantPasswordError = useSelector(state => state.participantpasswords.error)\r\n const ErrorMessage = useSelector(state => selectErrorMessagesByNegativeCode(state, participantPasswordError && participantPasswordError.ErrorID))\r\n const [isError, setIsError] = useState(false)\r\n\r\n useEffect(() => {\r\n if (participantPasswordStatus === \"success\") {\r\n\r\n handleCancel()\r\n }\r\n else if (participantPasswordStatus === \"failed\") {\r\n setIsError(true)\r\n }\r\n }, [participantPasswordStatus])\r\n\r\n useEffect(() => {\r\n if (!localEmailState && CombinedData.Email) {\r\n setLocalEmailState(CombinedData.Email)\r\n }\r\n }, [CombinedData, dispatch])\r\n\r\n const handleCancel = () => {\r\n setIsError(false)\r\n dispatch(participantpasswordClear())\r\n props.cancelButton()\r\n }\r\n\r\n const handleResetPassword = () => {\r\n // + incomingVariable.authToken + \"/\" \r\n // + incomingVariable.GroupGuid + \"/\"\r\n // + incomingVariable.UserName + \"/\"\r\n // + \"1\" + \"/\"\r\n // + incomingVariable.Email + \"/\"\r\n dispatch(fetchParticipantPasswords(\r\n {\r\n authToken: currentUser.AuthToken\r\n , GroupGuid: CombinedData.GroupGuid\r\n , UserName: CombinedData.UserName\r\n , Email: localEmailState\r\n }))\r\n }\r\n\r\n function ValidateEmail(input) {\r\n var validRegex = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\\.[a-zA-Z0-9-]+)*$/;\r\n if (input.match(validRegex)) {\r\n return true;\r\n } else {\r\n return false;\r\n }\r\n }\r\n const ValidTo = ValidateEmail(localEmailState)\r\n return (\r\n \r\n \r\n \r\n EMAIL LINK TO PASSWORD RESET PAGE \r\n \r\n \r\n An email will be sent to the address below, with a link to the password reset page \r\n \r\n \r\n { setLocalEmailState(e.target.value) }} />\r\n \r\n {/* \r\n \r\n */}\r\n\r\n \r\n \r\n \r\n \r\n { handleResetPassword() }}>Send \r\n \r\n \r\n \r\n \r\n { handleCancel() }}>Cancel \r\n \r\n \r\n \r\n \r\n\r\n {/* \r\n Manually gnerate a temporary password \r\n */}\r\n {\r\n\r\n isError === true && (\r\n \r\n \r\n \r\n {\r\n (ErrorMessage && ErrorMessage.length > 0 && ErrorMessage[0].MessageTypeContent)\r\n ||\r\n (participantPasswordError && participantPasswordError.ErrorMessage)\r\n }\r\n \r\n \r\n \r\n )\r\n }\r\n \r\n \r\n )\r\n}\r\n\r\nexport default ParticipantResetPassword","//Participant/Update/{AuthToken}/{ParticipantGuid}/{GroupGuid}/{ParticipantGroupGuid}/{LanguageID}/{LastName}/{FirstName}/{MiddleName}/{BioDOB}/{BioGender}/{BioRace}/{BioRace2}/{BioRace3}/{SpokenLanguageID}/{Email}/{StatusID}/{EducationLevelGuid}/{Medicaid}/\t\r\n\r\nimport React, { useState } from 'react'\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport _ from \"lodash\"\r\nimport { Button, Grid, Typography, Box, } from '@mui/material'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { selectParticipantDemographicsById, updateParticipantDemographics } from '../../../reducers/admincenter_participantdemographics';\r\nimport { adminparticipantModify, selectAdminParticipantById } from '../../../reducers/admincenter_participants';\r\n\r\n/**\r\n * \r\n * \"ParticipantArchive\": {\r\n \"CloseButton\": \"Close\",\r\n \"ConfirmButton\": \"Confirm\",\r\n \"Message\": \"Archiving a participant will remove them from the default search results.\",\r\n \"Message2\": \"Archiving participants will still show up in group reports unless they are excluded through advanced report options.\",\r\n \"Title\": \"ARCHIVE PARTICIPANT\"\r\n },} props \r\n * \r\n */\r\n\r\nconst ParticipantDeactivate = (props) => {\r\n const dispatch = useDispatch()\r\n\r\n const ParticipantGuid = props.Participant.ParticipantGuid\r\n const Participant = useSelector(state => selectAdminParticipantById(state, ParticipantGuid))\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const ParticipantArchive = props.ParticipantTab && props.ParticipantTab.ParticipantArchive\r\n const ParticipantAdditionalInfo = useSelector(state => selectParticipantDemographicsById(state, Participant.ParticipantGuid))\r\n const [localDemographicState, setLocalDemographicState] = useState({ ...Participant, ...ParticipantAdditionalInfo })\r\n //console.log('part', Participant)\r\n\r\n const sanitizeNull = (val) => {\r\n if (!val || val == -1) {\r\n return \"~_~\"\r\n } return val\r\n }\r\n\r\n const SaveToDatabase = () => {\r\n let errorInSaving = false\r\n\r\n // save demographics\r\n let DemoToSave = {\r\n ...localDemographicState\r\n , authToken: currentUser.AuthToken\r\n , ParticipantGroupGuid: sanitizeNull(localDemographicState.ParticipantGroupGuid)\r\n , LanguageID: sanitizeNull(localDemographicState.LanguageID)\r\n , Lastname: sanitizeNull(localDemographicState.Lastname)\r\n , Firstname: sanitizeNull(localDemographicState.Firstname)\r\n , Middlename: sanitizeNull(localDemographicState.Middlename)\r\n , BioDOB: sanitizeNull(localDemographicState.BioDOB)\r\n , BioGender: sanitizeNull(localDemographicState.BioGender)\r\n , BioRace: sanitizeNull(localDemographicState.BioRace)\r\n , BioRace2: sanitizeNull(localDemographicState.BioRace2)\r\n , BioRace3: sanitizeNull(localDemographicState.BioRace3)\r\n , SpokenLanguageID: sanitizeNull(localDemographicState.SpokenLanguageID)\r\n , Email: sanitizeNull(localDemographicState.Email)\r\n , Status: sanitizeNull(Participant.Status === true ? \"0\" : \"1\")\r\n , EducationLevelGuid: sanitizeNull(localDemographicState.EducationLevelGuid)\r\n , Medicaid: sanitizeNull(localDemographicState.Medicaid)\r\n }\r\n\r\n dispatch(updateParticipantDemographics(DemoToSave))\r\n\r\n let UserTableToSave = {\r\n ...localDemographicState,\r\n FirstName: localDemographicState.Firstname,\r\n LastName: localDemographicState.Lastname,\r\n UserName: localDemographicState.UserName,\r\n StatusDisplay: (DemoToSave.Status === \"1\" || DemoToSave.Status === 1 || DemoToSave.Status === true) ? \"Active\" : \"InActive\",\r\n Status: (DemoToSave.Status === \"1\" || DemoToSave.Status === 1 || DemoToSave.Status === true) ? true : false,\r\n BioDOB: localDemographicState.BioDOB\r\n }\r\n\r\n dispatch(adminparticipantModify(UserTableToSave))\r\n\r\n\r\n\r\n\r\n props.cancelButton()\r\n\r\n }\r\n\r\n const handleModifyLocal = (k, v) => {\r\n let copy = { ...localDemographicState, [k]: v }\r\n\r\n setLocalDemographicState(copy)\r\n\r\n }\r\n\r\n\r\n\r\n\r\n return (\r\n \r\n \r\n {Participant.Status === true ? \"Archive\" : \"Activate\"} Participant \r\n \r\n \r\n Are you sure you want to {Participant.Status === true ? \"archive\" : \"activate\"} {localDemographicState.UserName}? \r\n \r\n\r\n \r\n \r\n \r\n \r\n { SaveToDatabase() }}>{Participant.Status === true ? \"Archive\" : \"Activate\"} \r\n \r\n \r\n \r\n \r\n { props.cancelButton() }}>Cancel \r\n \r\n \r\n \r\n \r\n\r\n\r\n \r\n )\r\n\r\n}\r\nexport default ParticipantDeactivate\r\n","//Admin/ReportCriteria/Set/{AuthToken}/\r\nimport React from 'react'\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { reportcriteriaModify, selectReportCriteriaEntities } from '../../../reducers/admincenter_reportcriteria';\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { selectAdminGroupCascaded, selectAdminGroupDirect, selectAdminGroups, selectAdminGroupsWithoutParents } from '../../../reducers/admincenter_groups';\r\nimport _ from \"lodash\"\r\nimport DropdownTreeSelect from 'react-dropdown-tree-select'\r\n\r\n\r\n/**\r\n * \r\n{\r\n\"ReportCriteria\":\r\n{\r\n\"ReportGuid\": \"97069626-6A92-4BA5-AC4B-B47969B454D9\",\r\n\"SelectedAssessmentProduct\": \"HRA200\",\r\n\"ParticipantGuid\": \"5FEA08D8-4F8B-4CF8-957A-2EC1FE8B36ED\",\r\n\"AssessmentGuid\": \"C83D7CEE-1870-467B-953A-E414006D5C57\",\r\n\"ReportOutputFormat\": \"XML\",\r\n\"FirstRowHeader\": \"1\",\r\n\"ReportGroupName\": \"Arbitrary Name Passed By Caller\",\r\n\"IncludeAdditionalQuestions\": \"1\",\r\n\"ExcludeInactiveParticipants\": \"0\",\r\n\"DateRangeStart\": \"2015-01-01\",\r\n\"DateRangeEnd\": \"2016-12-31\",\r\n\"HRAStartedInDateRange\": \"0\",\r\n\"HRANotStartedInDateRange\": \"0\",\r\n\"HRACompletedInDateRange\": \"1\",\r\n\"HRANotCompletedInDateRange\": \"0\",\r\n\"GroupGuidList\":[\"6C096600-B754-49A0-A72D-23CC85548FC7\",\"032AAA24-4222-4FD2-AC42-2F690FCCE860\",\"6F8E2BCC-AC19-4353-B245-A6F74DE7F7E1\",\"45642721-13D9-4A15-9220-F8B4CF11B3A6\",\"5DED27D7-D094-4295-800F-3CE85B3B4AF5\",\"9EE86F41-5A96-4984-A4BE-DD93FD893B7A\",\"5E4AB781-A30A-4D47-9751-C0D453505AEF\",\"4C1C8A83-F70F-44A4-BEDB-966D16389367\",\"D7D6843F-DD37-4464-9B75-22D872304B24\",\"0CD7527D-5D34-4176-AACE-F404BF825FFF\"]\r\n}'\r\n */\r\nimport \"../../../styles/treeselect.css\"\r\nimport { contextUpsert, selectContextEntities } from '../../../reducers/global_contexts';\r\nconst ReportCriteriaGroupSelect = (props) => {\r\n const dispatch = useDispatch()\r\n // to reuse this componment in report criteria and participant move, i added a prop for the location\r\n // this should conditionally influence the store.\r\n const SelectLocation = props.SelectLocation\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const authState = useSelector((state) => state.auth);\r\n\r\n const parentGroups = useSelector(state => selectAdminGroupsWithoutParents(state))\r\n const directRelationships = useSelector(state => selectAdminGroupDirect(state))\r\n const allGroups = useSelector(state => selectAdminGroups(state))\r\n const cascadedRelationships = useSelector(state => selectAdminGroupCascaded(state))\r\n const ReportCriteria = useSelector(state => selectReportCriteriaEntities(state))\r\n const Contexts = useSelector(state=> selectContextEntities(state))\r\n const {participantMoveGroupGuid} = Contexts\r\n\r\n\r\n const onChange = (currentNode, selectedNodes) => {\r\n const GroupArray = []\r\n if (SelectLocation === \"REPORT CRITERIA\") {\r\n for (var i = 0; i < selectedNodes.length; i++) {\r\n\r\n if (selectedNodes[i]._children.length > 0) {\r\n let childrens = cascadedRelationships.filter((y) => { return y.OrganizationId_Guid_Parent === selectedNodes[i].value })\r\n\r\n for (var h = 0; h < childrens.length; h++) {\r\n GroupArray.push(childrens[h].OrganizationId_Guid_Child)\r\n }\r\n }\r\n GroupArray.push(selectedNodes[i].value)\r\n }\r\n\r\n dispatch(reportcriteriaModify({ Key: 'GroupGuidList', Value: GroupArray }))\r\n }\r\n\r\n if (SelectLocation === \"PARTICIPANT MOVE\"){\r\n \r\n dispatch(contextUpsert({Key:\"participantMoveGroupGuid\", Value:currentNode.value}))\r\n }\r\n }\r\n\r\n const dataFormated = (OrganizationId_Guid) => {\r\n const index = allGroups.map(e => e.OrganizationId_Guid).indexOf(OrganizationId_Guid)\r\n const Org = allGroups[index]\r\n return {\r\n label: Org.OrganizationName\r\n , value: Org.OrganizationId_Guid\r\n , checked: (\r\n ReportCriteria.GroupGuidList.indexOf(Org.OrganizationId_Guid) >= 0 && SelectLocation === \"REPORT CRITERIA\"\r\n ) || (\r\n participantMoveGroupGuid === Org.OrganizationId_Guid && SelectLocation === \"PARTICIPANT MOVE\"\r\n )\r\n , expanded: true\r\n , children: directRelationships.filter((x) => {\r\n return x.OrganizationId_Guid_Parent === OrganizationId_Guid\r\n }\r\n ).map((m) => { return dataFormated(m.OrganizationId_Guid_Child) })\r\n }\r\n }\r\n const data = parentGroups.map(x => dataFormated(x.OrganizationId_Guid))\r\n return (\r\n \r\n \r\n Move Participant \r\n \r\n \r\n \r\n \r\n \r\n \r\n Moving User: {Participant.UserName} \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n From: {Group_From && Group_From.OrganizationName} \r\n \r\n\r\n \r\n To: {Group_To && Group_To.OrganizationName} \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n\r\n \r\n \r\n \r\n \r\n { SaveToDatabase() }}>Move Participant \r\n \r\n \r\n \r\n \r\n { handleCancel() }}>Cancel \r\n \r\n \r\n \r\n \r\n\r\n\r\n {\r\n\r\n isError === true && (\r\n \r\n \r\n \r\n {\r\n (ErrorMessage && ErrorMessage.length > 0 && ErrorMessage[0].MessageTypeContent)\r\n ||\r\n (participantMoveError && participantMoveError.ErrorMessage)\r\n }\r\n \r\n \r\n \r\n )\r\n }\r\n {\r\n\r\n isSuccess === true && (\r\n \r\n \r\n \r\n Participant successfully moved!\r\n \r\n \r\n \r\n )\r\n }\r\n \r\n )\r\n\r\n\r\n}\r\nexport default ParticipantMove\r\n","\r\n\r\n//Participant/Update/{AuthToken}/{ParticipantGuid}/{GroupGuid}/{ParticipantGroupGuid}/{LanguageID}/{LastName}/{FirstName}/{MiddleName}/{BioDOB}/{BioGender}/{BioRace}/{BioRace2}/{BioRace3}/{SpokenLanguageID}/{Email}/{StatusID}/{EducationLevelGuid}/{Medicaid}/\t\r\n\r\nimport React, { useState, useEffect } from 'react'\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Button, Grid, Typography, Box, Checkbox, FormGroup, FormControlLabel } from '@mui/material'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { participantdemographicClear, selectParticipantDemographicsById } from '../../../reducers/admincenter_participantdemographics';\r\nimport { adminparticipantDelete, selectAdminParticipantById } from '../../../reducers/admincenter_participants';\r\nimport { selectContextEntities } from '../../../reducers/global_contexts';\r\nimport MergeIcon from '@mui/icons-material/Merge';\r\nimport { selectErrorMessagesByNegativeCode } from '../../../reducers/reference_errormessages';\r\nimport { fetchParticipants } from \"../../../reducers/admincenter_participants\";\r\nimport { fetchParticipantMerges, participantmergeClear } from '../../../reducers/admincenter_participantmerge';\r\nimport ParticipantTable from './ParticipantTable';\r\n\r\n\r\n\r\nconst ParticipantMerge = (props) => {\r\n const dispatch = useDispatch()\r\n\r\n const ParticipantGuid = props.Participant && props.Participant.ParticipantGuid\r\n const Participant = useSelector(state => selectAdminParticipantById(state, ParticipantGuid))\r\n\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n\r\n const Contexts = useSelector(state => selectContextEntities(state))\r\n const { mergeParticipantGuid } = Contexts\r\n\r\n\r\n const ParticipantAdditionalInfo = useSelector(state => selectParticipantDemographicsById(state, Participant && Participant.ParticipantGuid))\r\n\r\n\r\n const Participant_From = useSelector(state => selectAdminParticipantById(state, ParticipantAdditionalInfo && ParticipantAdditionalInfo.ParticipantGuid))\r\n const Participant_To = useSelector(state => selectAdminParticipantById(state, mergeParticipantGuid))\r\n\r\n\r\n const participantMergeStatus = useSelector(state => state.participantmerges.status)\r\n const participantMergeError = useSelector(state => state.participantmerges.error)\r\n const ErrorMessage = useSelector(state => selectErrorMessagesByNegativeCode(state, participantMergeError && participantMergeError.ErrorID))\r\n const [isError, setIsError] = useState(false)\r\n const [isSuccess, setIsSuccess] = useState(false)\r\n\r\n const [confirmAction, setConfirmAction] = useState(false)\r\n\r\n useEffect(() => {\r\n if (participantMergeStatus === \"success\") {\r\n setIsSuccess(true)\r\n dispatch(fetchParticipants({ authToken: currentUser.AuthToken, page:0 }))\r\n setTimeout(() => { \r\n dispatch(participantdemographicClear())\r\n dispatch(adminparticipantDelete(Participant))\r\n handleCancel()\r\n }, 3000)\r\n\r\n }\r\n else if (participantMergeStatus === \"failed\") {\r\n setIsError(true)\r\n }\r\n }, [participantMergeStatus])\r\n\r\n useEffect(() => {\r\n setConfirmAction(false)\r\n }, [Participant_To])\r\n\r\n const SaveToDatabase = () => {\r\n dispatch(fetchParticipantMerges({\r\n ParticipantId_Guid_From: Participant_From.ParticipantGuid\r\n , ParticipantId_Guid_To: Participant_To.ParticipantGuid\r\n , authToken: currentUser.AuthToken\r\n }))\r\n\r\n }\r\n\r\n const handleCancel = () => {\r\n setIsError(false)\r\n setIsSuccess(false)\r\n \r\n dispatch(participantmergeClear())\r\n props.cancelButton(1)\r\n\r\n }\r\n const MainContainer = (incoming) => {\r\n const incAlign = incoming.align\r\n return (\r\n \r\n \r\n \r\n username: {incoming.Participant.UserName} \r\n \r\n \r\n email: {incoming.Participant.Email} \r\n \r\n \r\n birthday: {incoming.Participant.BioDOB} \r\n \r\n \r\n group name: {incoming.Participant.GroupName} \r\n \r\n \r\n last login: {incoming.Participant.LastLogin} \r\n \r\n \r\n status: {incoming.Participant.StatusDisplay} \r\n \r\n \r\n \r\n\r\n )\r\n }\r\n return (\r\n \r\n \r\n Merge Participant \r\n \r\n\r\n\r\n {\r\n Participant_From && Participant_From.ParticipantGuid\r\n && (\r\n\r\n \r\n \r\n )\r\n }\r\n \r\n \r\n \r\n \r\n\r\n {Participant_To && Participant_To.ParticipantGuid\r\n && (\r\n \r\n\r\n \r\n )\r\n }\r\n\r\n \r\n \r\n \r\n You're about to merge the SOURCE account into the DESTINATION account.\r\n All assessments will be moved to the DESTINATION account and the SOURCE account will be permanently deleted. Click MERGE PARTICIPANT to continue\r\n \r\n \r\n\r\n \r\n { setConfirmAction(e.target.checked) }} />} label=\"I understand\" />\r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n { SaveToDatabase() }}>Merge Participant \r\n \r\n \r\n \r\n \r\n { handleCancel() }}>Cancel \r\n \r\n \r\n \r\n \r\n {\r\n\r\n isError === true && (\r\n \r\n \r\n \r\n {\r\n (ErrorMessage && ErrorMessage.length > 0 && ErrorMessage[0].MessageTypeContent)\r\n ||\r\n (participantMergeError && participantMergeError.ErrorMessage)\r\n }\r\n \r\n \r\n \r\n )\r\n }\r\n {\r\n\r\n isSuccess === true && (\r\n \r\n \r\n \r\n Merged participants successfully!\r\n \r\n \r\n \r\n )\r\n }\r\n \r\n )\r\n}\r\nexport default ParticipantMerge","import React, { useEffect } from 'react'\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Button, Grid, Typography, Box, } from '@mui/material'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { fetchParticipantBiometrics } from '../../../reducers/admincenter_biometrics';\r\nimport { selectAdminParticipantById } from '../../../reducers/admincenter_participants';\r\nimport { fetchParticipantResponses } from '../../../reducers/admincenter_responses';\r\nimport ResponsiveRectangle from '../skeletons/ResponsiveRectangle';\r\n\r\n\r\nconst ParticipantBiometrics = (props) => {\r\n const dispatch = useDispatch()\r\n\r\n const ParticipantGuid = props.Participant.ParticipantGuid\r\n const Participant = useSelector(state => selectAdminParticipantById(state, ParticipantGuid))\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n\r\n const biometricStatus = useSelector(state => state.participantbiometrics.status)\r\n const responseStatus = useSelector(state => state.participantresponses.status)\r\n\r\n useEffect(() => {\r\n if (biometricStatus === \"idle\") {\r\n dispatch(fetchParticipantBiometrics({ authToken: currentUser.AuthToken, ParticipantGuid: Participant.ParticipantGuid }))\r\n }\r\n if (responseStatus === \"idle\") {\r\n dispatch(fetchParticipantResponses({ authToken: currentUser.AuthToken, ParticipantGuid: Participant.ParticipantGuid }))\r\n\r\n }\r\n }, [biometricStatus, responseStatus, dispatch])\r\n\r\n const handleCancel = () => {\r\n props.cancelButton()\r\n }\r\n\r\n const InitialScreen = () => {\r\n\r\n return (\r\n \r\n \r\n \r\n ENTER BIOMETRICS \r\n \r\n \r\n Would you like to upload these biometrics to an existing HRA or save for a future HRA? \r\n \r\n \r\n \r\n \r\n \r\n Add to existing HRA \r\n \r\n \r\n \r\n \r\n Save for future HRA \r\n \r\n \r\n \r\n \r\n { handleCancel() }}>Cancel \r\n \r\n \r\n \r\n \r\n \r\n \r\n )\r\n }\r\n\r\n return (\r\n \r\n {\r\n biometricStatus === \"success\"\r\n && responseStatus === \"success\"\r\n ? (\r\n \r\n )\r\n}\r\n\r\nexport default ParticipantBiometrics","//Participant/Update/{AuthToken}/{ParticipantGuid}/{GroupGuid}/{ParticipantGroupGuid}/{LanguageID}/{LastName}/{FirstName}/{MiddleName}/{BioDOB}/{BioGender}/{BioRace}/{BioRace2}/{BioRace3}/{SpokenLanguageID}/{Email}/{StatusID}/{EducationLevelGuid}/{Medicaid}/\t\r\n\r\nimport React, { useState, useEffect } from 'react'\r\nimport { useNavigate } from 'react-router-dom';\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Button, Grid, Box, Tooltip, Skeleton } from '@mui/material'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport MailOutlineIcon from '@mui/icons-material/MailOutline';\r\nimport EditIcon from '@mui/icons-material/Edit';\r\nimport LockResetIcon from '@mui/icons-material/LockReset';\r\nimport MergeIcon from '@mui/icons-material/Merge';\r\nimport MoveDownIcon from '@mui/icons-material/MoveDown';\r\nimport PersonRemoveIcon from '@mui/icons-material/PersonRemove';\r\nimport PersonAddAlt1Icon from '@mui/icons-material/PersonAddAlt1';\r\nimport ParticipantEdit from './ParticipantEdit';\r\nimport ParticipantAssessmentContainer from './ParticipantAssessments';\r\nimport ParticipantDisplay from './ParticipantDisplay';\r\nimport { fetchParticipantDemographics } from '../../../reducers/admincenter_participantdemographics';\r\nimport { fetchParticipantAddresss } from '../../../reducers/admincenter_participantaddress';\r\nimport { fetchParticipantPhones } from '../../../reducers/admincenter_participantphone';\r\nimport { fetchParticipantMiscs } from '../../../reducers/admincenter_participantmisc';\r\nimport ParticipantInvite from './ParticipantInvite';\r\nimport ParticipantResetPassword from './ParticipantPasswordReset';\r\nimport ParticipantDeactivate from './ParticipantDeactivate';\r\nimport ParticipantMove from './ParticipantMove';\r\nimport ParticipantMerge from './ParticipantMerge';\r\nimport ParticipantBiometrics from './ParticipantBiometrics';\r\nimport { clientlogoClear } from '../../../reducers/reference_clientlogo';\r\nimport { navmenuClear } from '../../../reducers/reference_navmenu';\r\nimport { userLoginBehalfOf } from '../../../reducers/auth';\r\nimport { selectAdminParticipantById } from '../../../reducers/admincenter_participants';\r\n// WsWebServicePlatform/help\r\n\r\n// Participant/Phone/Types/Get/{AuthToken}/\t\r\n\r\n// Participant/Phone/Delete/{AuthToken}/{ParticipantPhoneGuid}/\t\r\n\r\n\r\n\r\n// Participant/Address/Delete/{AuthToken}/{ParticipantAddressGuid}/\t\t\r\n// Participant/Address/Types/Get/{AuthToken}/\t\r\n\r\n\r\n// Participant/Misc/Update/{AuthToken}/{ParticipantMiscGuid}/{ParticipantMiscTypeGuid}/{Priority}/{MiscData}/\t\r\n// Participant/Miscs/Get/{AuthToken}/{ParticipantGuid}/\t\r\n// Participant/Misc/Delete/{AuthToken}/{ParticipantMiscGuid}/\t\r\n// Participant/Misc/Create/{AuthToken}/{ParticipantGuid}/{ParticipantMiscTypeGuid}/{Priority}/{MiscData}/\r\n\r\n// Participant/Update/{AuthToken}/{ParticipantGuid}/{GroupGuid}/{ParticipantGroupGuid}/{LanguageID}/{LastName}/{FirstName}/{MiddleName}/{BioDOB}/{BioGender}/{BioRace}/{BioRace2}/{BioRace3}/{SpokenLanguageID}/{Email}/{StatusID}/{EducationLevelGuid}/{Medicaid}/\t\r\n// Participant/Get/{AuthToken}/{ParticipantGuid}/\r\n// Group/Participant/Create POST BODY: has userName\t\r\n\r\n// Participant/Merge/{AuthToken}/{SourceParticipantGuid}/{TargetParticipantGuid}/\t\r\n// Group/Participant/Move/{AuthToken}/{ParticipantGuid}/{ToGroupGuid}/\t\r\n\r\nconst ParticipantMainDialog = (props) => {\r\n const dispatch = useDispatch()\r\n const navigate = useNavigate()\r\n const ParticipantGuid = props.Participant.ParticipantGuid\r\n const Participant = useSelector(state => selectAdminParticipantById(state, ParticipantGuid))\r\n const aryPreviousAssessments = [] //convert to state / api\r\n\r\n const [isEditMode, setIsEditMode] = useState(false)\r\n const [isInviteMode, setIsInviteMode] = useState(false)\r\n const [isPasswordMode, setIsPasswordMode] = useState(false)\r\n const [isDeactivate, setIsDeactivate] = useState(false)\r\n const [isMoveMode, setIsMoveMode] = useState(false)\r\n const [isMergeMode, setIsMergeMode] = useState(false)\r\n const [isBiometricMode, setIsBiometricMode] = useState(false)\r\n\r\n const { user: currentUser, behalfOf: behalfOfUser } = useSelector((state) => state.auth);\r\n const participantdemographicStatus = useSelector(state => state.participantdemographics.status)\r\n const participantaddressStatus = useSelector(state => state.participantaddresss.status)\r\n const participantphoneStatus = useSelector(state => state.participantphones.status)\r\n const participantmiscStatus = useSelector(state => state.participantmiscs.status)\r\n const behalfStatus = useSelector(state => state.auth.statusBehalf)\r\n\r\n\r\n const loadingArray = [\r\n participantdemographicStatus === 'success' ? false : true\r\n , participantaddressStatus === 'success' ? false : true\r\n , participantphoneStatus === 'success' ? false : true\r\n , participantmiscStatus === 'success' ? false : true\r\n ]\r\n\r\n const allLoaded = loadingArray.indexOf(true) === -1\r\n\r\n const handleToggleEditModeOn = () => {\r\n setIsEditMode(true)\r\n }\r\n\r\n const handleToggleInviteModeOn = () => {\r\n setIsInviteMode(true)\r\n }\r\n\r\n const handleTogglePasswordModeOn = () => {\r\n setIsPasswordMode(true)\r\n }\r\n const handleLoginAs = () => {\r\n dispatch(userLoginBehalfOf({ AuthToken: currentUser.AuthToken, ParticipantGuid: Participant.ParticipantGuid, GroupGuid: Participant.GroupGuid }))\r\n\r\n }\r\n useEffect(() => {\r\n if (behalfStatus === 'success') {\r\n // clear some view instances\r\n dispatch(clientlogoClear())\r\n dispatch(navmenuClear())\r\n props.closeButton()\r\n navigate('/home')\r\n }\r\n\r\n }, [behalfStatus, dispatch])\r\n\r\n const handleToggleDeactivateModeOn = () => {\r\n setIsDeactivate(true)\r\n }\r\n\r\n const handleToggleMoveModeOn = () => {\r\n setIsMoveMode(true)\r\n }\r\n\r\n const handleToggleMergeModeOn = () => {\r\n setIsMergeMode(true)\r\n }\r\n\r\n const handleTogglebiometricModeOn = () => {\r\n setIsBiometricMode(true)\r\n }\r\n\r\n const handleCancel = (closeit) => {\r\n setIsEditMode(false)\r\n setIsInviteMode(false)\r\n setIsPasswordMode(false)\r\n setIsDeactivate(false)\r\n setIsMoveMode(false)\r\n setIsMergeMode(false)\r\n setIsBiometricMode(false)\r\n if(closeit){\r\n props.closeButton()\r\n }\r\n }\r\n\r\n useEffect(() => {\r\n if (participantdemographicStatus === 'idle' && Participant && Participant.ParticipantGuid) {\r\n dispatch(fetchParticipantDemographics({ authToken: currentUser.AuthToken, ParticipantId_Guid: Participant.ParticipantGuid }))\r\n }\r\n }, [participantdemographicStatus, Participant, isEditMode, dispatch])\r\n\r\n useEffect(() => {\r\n if (participantaddressStatus === 'idle'&& Participant && Participant.ParticipantGuid) {\r\n dispatch(fetchParticipantAddresss({ authToken: currentUser.AuthToken, ParticipantId_Guid: Participant.ParticipantGuid }))\r\n }\r\n }, [participantaddressStatus, Participant, isEditMode, dispatch])\r\n\r\n useEffect(() => {\r\n if (participantphoneStatus === 'idle'&& Participant && Participant.ParticipantGuid) {\r\n dispatch(fetchParticipantPhones({ authToken: currentUser.AuthToken, ParticipantId_Guid: Participant.ParticipantGuid }))\r\n }\r\n }, [participantphoneStatus, Participant, isEditMode, dispatch])\r\n\r\n useEffect(() => {\r\n if (participantmiscStatus === 'idle'&& Participant && Participant.ParticipantGuid) {\r\n dispatch(fetchParticipantMiscs({ authToken: currentUser.AuthToken, ParticipantId_Guid: Participant.ParticipantGuid }))\r\n }\r\n }, [participantmiscStatus, Participant, isEditMode, dispatch])\r\n\r\n\r\n const IconMenu = () => {\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n { handleToggleInviteModeOn() }}\r\n disabled={!allLoaded}\r\n >\r\n \r\n\r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n { handleToggleEditModeOn() }}\r\n disabled={!allLoaded}\r\n >\r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n\r\n \r\n { handleTogglePasswordModeOn() }}\r\n disabled={!allLoaded}\r\n >\r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n { handleToggleDeactivateModeOn() }}\r\n >\r\n {(Participant && (Participant.Status === \"0\" || Participant.Status === false )) ? \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n { handleToggleMergeModeOn() }}\r\n >\r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n { handleToggleMoveModeOn() }}\r\n >\r\n \r\n \r\n \r\n \r\n\r\n \r\n )\r\n }\r\n const LandingMode = () => {\r\n return (\r\n \r\n \r\n \r\n \r\n {allLoaded ? \r\n \r\n\r\n )\r\n }\r\n\r\n\r\n return (\r\n\r\n \r\n {isEditMode === false\r\n && isInviteMode === false\r\n && isPasswordMode === false\r\n && isDeactivate === false\r\n && isMoveMode === false\r\n && isMergeMode === false\r\n && isBiometricMode === false\r\n && (\r\n \r\n \r\n )}\r\n\r\n {isEditMode === true && (\r\n \r\n \r\n \r\n {allLoaded ? ( { handleCancel() }} />) : ( \r\n\r\n \r\n \r\n )}\r\n {isInviteMode === true && (\r\n \r\n {allLoaded ? { handleCancel() }} /> : ( \r\n )}\r\n {isPasswordMode === true && (\r\n \r\n {allLoaded ? { handleCancel() }} /> : ( \r\n )}\r\n\r\n {isDeactivate === true && (\r\n \r\n {allLoaded ? { handleCancel() }} /> : ( \r\n )}\r\n\r\n {isMergeMode === true && (\r\n \r\n {allLoaded ? { handleCancel(x) }} /> : ( \r\n )}\r\n\r\n {isMoveMode === true && (\r\n \r\n {allLoaded ? { handleCancel() }} /> : ( \r\n )}\r\n {isBiometricMode === true && (\r\n \r\n {allLoaded ? { handleCancel() }} /> : ( \r\n )}\r\n\r\n {\r\n isEditMode === false\r\n && isInviteMode === false\r\n && isPasswordMode === false\r\n && isDeactivate === false\r\n && isMoveMode === false\r\n && isMergeMode === false\r\n && isBiometricMode === false\r\n && allLoaded && (\r\n \r\n \r\n\r\n handleLoginAs()}>Login As Participant \r\n \r\n \r\n )}\r\n\r\n {/* {\r\n isEditMode === false\r\n && isInviteMode === false\r\n && isPasswordMode === false\r\n && isDeactivate === false\r\n && isMoveMode === false\r\n && isMergeMode === false\r\n && isBiometricMode === false\r\n && allLoaded && (\r\n \r\n \r\n \r\n )} */}\r\n \r\n\r\n )\r\n\r\n}\r\nexport default ParticipantMainDialog\r\n","import React, { useState } from 'react'\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Button, Box, Dialog, DialogContent } from '@mui/material'\r\n\r\nimport {\r\n DataGrid,\r\n gridPaginatedVisibleSortedGridRowIdsSelector,\r\n gridSortedRowIdsSelector,\r\n GridToolbarContainer,\r\n gridVisibleSortedRowIdsSelector,\r\n useGridApiContext,\r\n GridToolbarExportContainer,\r\n} from '@mui/x-data-grid';\r\nimport { createSvgIcon } from '@mui/material/utils';\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { selectAdminParticipants } from '../../../reducers/admincenter_participants';\r\n\r\nimport ParticipantMainDialog from './ParticipantMainDialog';\r\nimport { participantdemographicClear } from '../../../reducers/admincenter_participantdemographics';\r\nimport { participantaddressClear } from '../../../reducers/admincenter_participantaddress';\r\nimport { participantphoneClear } from '../../../reducers/admincenter_participantphone';\r\nimport { participantmiscClear } from '../../../reducers/admincenter_participantmisc';\r\nimport { contextUpsert, selectContextEntities } from '../../../reducers/global_contexts';\r\n/**\r\n * \r\n {\r\n \"RowNum\":9223372036854775807,\r\n \"ParticipantID\":2147483647,\r\n \"ParticipantGuid\":\"String content\",\r\n \"FirstName\":\"String content\",\r\n \"LastName\":\"String content\",\r\n \"UserName\":\"String content\",\r\n \"GroupID\":2147483647,\r\n \"GroupName\":\"String content\",\r\n \"Status\":2147483647,\r\n \"StatusDisplay\":\"String content\",\r\n \"BioDOB\":\"String content\",\r\n \"LastHRAStarted\":\"String content\",\r\n \"LastLogin\":\"String content\"\r\n }\r\n */\r\nconst ParticipantTable = (props) => {\r\n const TableLocation = props.TableLocation\r\n const dispatch = useDispatch()\r\n const Participants = useSelector(state => selectAdminParticipants(state))\r\n const getUnfilteredRows = ({ apiRef }) => gridSortedRowIdsSelector(apiRef);\r\n\r\n const [ParticipantRow, setParticipantRow] = useState({})\r\n const [showParticipant, setShowParticipant] = useState(false)\r\n const getFilteredRows = ({ apiRef }) => gridVisibleSortedRowIdsSelector(apiRef);\r\n\r\n const Contexts = useSelector(state => selectContextEntities(state))\r\n const { showArchivedParticipants } = Contexts\r\n\r\n const ParticipantsToShow = Participants.filter(x => {\r\n return (\r\n (\r\n (\r\n x.Status === \"1\"\r\n || x.Status === true\r\n || x.Status === 1\r\n )\r\n && showArchivedParticipants === false\r\n )\r\n\r\n || showArchivedParticipants === true\r\n )\r\n })\r\n\r\n\r\n const ExportIcon = createSvgIcon(\r\n \r\n handleExport({ getRowsToExport: getFilteredRows })}\r\n >\r\n Filtered rows\r\n \r\n handleExport({ getRowsToExport: getUnfilteredRows })}\r\n >\r\n Unfiltered rows\r\n \r\n \r\n );\r\n };\r\n\r\n\r\n const columns = [\r\n { field: \"ParticipantGuid\", headerName: \"Participant Guid\", editable: false, flex: 2 }\r\n , { field: \"FirstName\", headerName: \"First Name\", editable: false, flex: 1 }\r\n , { field: \"LastName\", headerName: \"Last Name\", editable: false, flex: 1 }\r\n , { field: \"UserName\", headerName: \"Username\", editable: false, flex: 1 }\r\n , { field: \"GroupName\", headerName: \"Group Name\", editable: false, flex: 1 }\r\n , { field: \"StatusDisplay\", headerName: \"Status\", editable: false, flex: 1 }\r\n , { field: \"LastHRAStarted\", headerName: \"Last HRA Started\", editable: false, flex: 1 }\r\n , { field: \"LastLogin\", headerName: \"Last Login\", editable: false, flex: 1 }\r\n ]\r\n return (\r\n \r\n row.ParticipantGuid}\r\n density=\"compact\"\r\n disableSelectionOnClick\r\n onRowDoubleClick={(i, x) => handleParticipantEdit(i.row)}\r\n components={{ Toolbar: CustomToolbar }}\r\n // pageSize={5}\r\n // rowsPerPageOptions={[5]}\r\n // checkboxSelection\r\n // disableSelectionOnClick\r\n // experimentalFeatures={{ newEditingApi: true }}\r\n />\r\n {TableLocation === \"PARTICIPANT MANAGEMENT\" && (\r\n\r\n { handleCloseDialog() }}\r\n fullWidth\r\n maxWidth=\"lg\"\r\n >\r\n \r\n \r\n\r\n handleCloseDialog()} ParticipantTab={props.ParticipantTab}/>\r\n \r\n \r\n \r\n )}\r\n \r\n )\r\n\r\n}\r\nexport default ParticipantTable","//Admin/ReportCriteria/Set/{AuthToken}/\r\nimport React from 'react'\r\nimport { useNavigate } from 'react-router-dom';\r\nimport { useDispatch } from \"react-redux\";\r\nimport _ from \"lodash\"\r\nimport { Button, Grid } from '@mui/material'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\n/**\r\n * \r\n{\r\n\"ReportCriteria\":\r\n{\r\n\"ReportGuid\": \"97069626-6A92-4BA5-AC4B-B47969B454D9\",\r\n\"SelectedAssessmentProduct\": \"HRA200\",\r\n\"ParticipantGuid\": \"5FEA08D8-4F8B-4CF8-957A-2EC1FE8B36ED\",\r\n\"AssessmentGuid\": \"C83D7CEE-1870-467B-953A-E414006D5C57\",\r\n\"ReportOutputFormat\": \"XML\",\r\n\"FirstRowHeader\": \"1\",\r\n\"ReportGroupName\": \"Arbitrary Name Passed By Caller\",\r\n\"IncludeAdditionalQuestions\": \"1\",\r\n\"ExcludeInactiveParticipants\": \"0\",\r\n\"DateRangeStart\": \"2015-01-01\",\r\n\"DateRangeEnd\": \"2016-12-31\",\r\n\"HRAStartedInDateRange\": \"0\",\r\n\"HRANotStartedInDateRange\": \"0\",\r\n\"HRACompletedInDateRange\": \"1\",\r\n\"HRANotCompletedInDateRange\": \"0\",\r\n\"GroupGuidList\":[\"6C096600-B754-49A0-A72D-23CC85548FC7\",\"032AAA24-4222-4FD2-AC42-2F690FCCE860\",\"6F8E2BCC-AC19-4353-B245-A6F74DE7F7E1\",\"45642721-13D9-4A15-9220-F8B4CF11B3A6\",\"5DED27D7-D094-4295-800F-3CE85B3B4AF5\",\"9EE86F41-5A96-4984-A4BE-DD93FD893B7A\",\"5E4AB781-A30A-4D47-9751-C0D453505AEF\",\"4C1C8A83-F70F-44A4-BEDB-966D16389367\",\"D7D6843F-DD37-4464-9B75-22D872304B24\",\"0CD7527D-5D34-4176-AACE-F404BF825FFF\"]\r\n}'\r\n */\r\nconst AdminTabs = (props) => {\r\n const dispatch = useDispatch()\r\n const navigate = useNavigate()\r\n const ThisPage = props.page\r\n\r\n return (\r\n\r\n \r\n \r\n navigate('/participantmanagement')}>Participants \r\n \r\n \r\n navigate('/admincenterreports')}>Reports \r\n \r\n \r\n navigate('/groupmanagement')}>Groups \r\n \r\n \r\n )\r\n\r\n}\r\nexport default AdminTabs\r\n","import { createSlice, createSelector, createAsyncThunk } from '@reduxjs/toolkit'\r\n\r\n// import { BASE_URL, OrganizationId, AuthToken } from '/features/storeconfig'\r\nimport axios from \"axios\";\r\n\r\n\r\nconst initialState = {\r\n entities: {},\r\n status: 'idle', // idle loading success fail \r\n error: null\r\n}\r\n/**\r\n * \r\n * ~~ = ignore\r\n * ~_~ = delete/set to default value\r\n */\r\nconst PLATFORM = '../../WsWebServicePlatform/'\r\n// Participant/Misc/Types/Get/{AuthToken}/\t\r\n// Participant/Misc/Type/Update/{AuthToken}/{ParticipantPhoneTypeGuid}/{PhoneTypeName}/{PhoneTypeDescription}/\t\r\n// Participant/Misc/Type/Delete/{AuthToken}/{ParticipantPhoneTypeGuid}/\t\r\n// Participant/Misc/Type/Create/{AuthToken}/{PhoneTypeName}/{PhoneTypeDescription}/\t\r\nexport const fetchPhoneTypes = createAsyncThunk('phonetype/get', async (incomingVariable, thunkAPI) => {\r\n console.log('called fetch phonetype')\r\n try {\r\n const response = await axios.get(PLATFORM + \"Participant/Misc/Types/Get/\" + incomingVariable.authToken + \"/\")\r\n const data = await response.data.Success ? response.data : []\r\n //console.log('getting data', data)\r\n return data\r\n } catch (err) {\r\n console.log('error', err)\r\n return thunkAPI.rejectWithValue({ error: err.message });\r\n }\r\n})\r\n\r\nexport const updatePhoneTypes = createAsyncThunk('phonetype/update', async (incomingVariable, thunkAPI) => {\r\n console.log('called update phonetype')\r\n try {\r\n const response = await axios.post(PLATFORM\r\n + \"Participant/Misc/Type/Update/\"\r\n + incomingVariable.authToken + \"/\"\r\n + incomingVariable.ParticipantPhoneTypeGuid + \"/\"\r\n + incomingVariable.PhoneTypeName + \"/\"\r\n + incomingVariable.PhoneTypeDescription + \"/\"\r\n )\r\n const data = await response.data.Success ? response.data : []\r\n return data\r\n } catch (err) {\r\n console.log('error', err)\r\n return thunkAPI.rejectWithValue({ error: err.message });\r\n }\r\n})\r\n\r\nexport const deletePhoneTypes = createAsyncThunk('phonetype/delete', async (incomingVariable, thunkAPI) => {\r\n console.log('called delete phonetype')\r\n try {\r\n const response = await axios.post(PLATFORM\r\n + \"Participant/Misc/Type/Delete/\"\r\n + incomingVariable.authToken + \"/\"\r\n + incomingVariable.ParticipantPhoneTypeGuid + \"/\"\r\n )\r\n const data = await response.data.Success ? response.data : []\r\n return data\r\n } catch (err) {\r\n console.log('error', err)\r\n return thunkAPI.rejectWithValue({ error: err.message });\r\n }\r\n})\r\n \r\nexport const createPhoneTypes = createAsyncThunk('phonetype/create', async (incomingVariable, thunkAPI) => {\r\n console.log('called update phonetype')\r\n try {\r\n const response = await axios.post(PLATFORM\r\n + \"Participant/Misc/Type/Create/\"\r\n + incomingVariable.authToken + \"/\"\r\n + incomingVariable.PhoneTypeName + \"/\"\r\n + incomingVariable.PhoneTypeDescription + \"/\"\r\n )\r\n const data = await response.data.Success ? response.data : []\r\n return data\r\n } catch (err) {\r\n console.log('error', err)\r\n return thunkAPI.rejectWithValue({ error: err.message });\r\n }\r\n})\r\n\r\nconst phonetypeSlice = createSlice({\r\n name: 'phonetypes',\r\n initialState,\r\n reducers: { \r\n phonetypeClear(state, action) {\r\n state.entities = initialState\r\n state.status = \"idle\"\r\n \r\n }\r\n },\r\n extraReducers(builder) {\r\n builder\r\n //\r\n .addCase(fetchPhoneTypes.pending, (state, action) => {\r\n state.status = 'loading'\r\n })\r\n .addCase(fetchPhoneTypes.fulfilled, (state, action) => {\r\n state.status = 'success'\r\n const loadedData = action.payload.Info\r\n const data = {}\r\n for (var i = 0; i < loadedData.length; i++) {\r\n data[loadedData[i].ParticipantPhoneTypeGuid] = loadedData[i]\r\n }\r\n state.entities = data\r\n })\r\n .addCase(fetchPhoneTypes.rejected, (state, action) => {\r\n state.error = action.error.message\r\n console.log('failed')\r\n })\r\n \r\n //\r\n .addCase(updatePhoneTypes.pending, (state, action) => {\r\n state.status = 'loading'\r\n })\r\n .addCase(updatePhoneTypes.fulfilled, (state, action) => {\r\n state.status = 'success'\r\n const loadedData = action.payload.Info\r\n state.entities[loadedData.ParticipantPhoneTypeGuid] = loadedData\r\n })\r\n .addCase(updatePhoneTypes.rejected, (state, action) => {\r\n state.error = action.error.message\r\n console.log('failed')\r\n })\r\n \r\n //\r\n .addCase(deletePhoneTypes.pending, (state, action) => {\r\n state.status = 'loading'\r\n })\r\n .addCase(deletePhoneTypes.fulfilled, (state, action) => {\r\n state.status = 'success'\r\n const loadedData = action.payload.Info\r\n delete state.entities[loadedData.ParticipantPhoneTypeGuid]\r\n })\r\n .addCase(deletePhoneTypes.rejected, (state, action) => {\r\n state.error = action.error.message\r\n console.log('failed')\r\n })\r\n\r\n\r\n }\r\n})\r\n\r\nexport const { phonetypeClear} = phonetypeSlice.actions\r\n\r\nexport default phonetypeSlice.reducer\r\n\r\nconst selectPhoneTypeEntities = (state) => state.phonetypes.entities\r\n\r\nexport const selectPhoneTypes = createSelector(selectPhoneTypeEntities, (entities) =>\r\n Object.values(entities)\r\n)\r\n\r\nexport const selectPhoneTypeById = (state, PhoneTypeId) => {\r\n return selectPhoneTypeEntities(state)[PhoneTypeId]\r\n}\r\n\r\n","import { createSlice, createSelector, createAsyncThunk } from '@reduxjs/toolkit'\r\n\r\n// import { BASE_URL, OrganizationId, AuthToken } from '/features/storeconfig'\r\nimport axios from \"axios\";\r\n\r\n\r\nconst initialState = {\r\n entities: {},\r\n status: 'idle', // idle loading success fail \r\n error: null\r\n}\r\n/**\r\n * \r\n * ~~ = ignore\r\n * ~_~ = delete/set to default value\r\n */\r\nconst PLATFORM = '../../WsWebServicePlatform/'\r\n// Participant/Address/Create/{AuthToken}/{ParticipantGuid}/{ParticipantAddressTypeGuid}/{Priority}/{Address1}/{Address2}/{Address3}/{City}/{StateProvinceCounty}/{PostalCode}/{CountryCode}/\r\n// Participant/Address/Delete/{AuthToken}/{ParticipantAddressGuid}/\t\t\r\n// Participant/Address/Types/Get/{AuthToken}/\t\r\n// Participant/Address/Update/{AuthToken}/{ParticipantAddressGuid}/{ParticipantAddressTypeGuid}/{Priority}/{Address1}/{Address2}/{Address3}/{City}/{StateProvinceCounty}/{PostalCode}/{CountryCode}/\t\r\n// Participant/Addresses/Get/{AuthToken}/{ParticipantGuid}/\t\r\nexport const fetchAddressTypes = createAsyncThunk('addresstype/get', async (incomingVariable, thunkAPI) => {\r\n console.log('called fetch addresstype')\r\n try {\r\n const response = await axios.get(PLATFORM + \"Participant/Address/Types/Get/\" + incomingVariable.authToken + \"/\")\r\n const data = await response.data.Success ? response.data : []\r\n //console.log('getting data', data)\r\n return data\r\n } catch (err) {\r\n console.log('error', err)\r\n return thunkAPI.rejectWithValue({ error: err.message });\r\n }\r\n})\r\n\r\nexport const updateAddressTypes = createAsyncThunk('addresstype/update', async (incomingVariable, thunkAPI) => {\r\n console.log('called update addresstype')\r\n try {\r\n const response = await axios.post(PLATFORM\r\n + \"Participant/Address/Type/Update/\"\r\n + incomingVariable.authToken + \"/\"\r\n + incomingVariable.ParticipantAddressTypeGuid + \"/\"\r\n + incomingVariable.AddressTypeName + \"/\"\r\n + incomingVariable.AddressTypeDescription + \"/\"\r\n )\r\n const data = await response.data.Success ? response.data : []\r\n return data\r\n } catch (err) {\r\n console.log('error', err)\r\n return thunkAPI.rejectWithValue({ error: err.message });\r\n }\r\n})\r\n\r\nexport const deleteAddressTypes = createAsyncThunk('addresstype/delete', async (incomingVariable, thunkAPI) => {\r\n console.log('called delete addresstype')\r\n try {\r\n const response = await axios.post(PLATFORM\r\n + \"Participant/Address/Type/Delete/\"\r\n + incomingVariable.authToken + \"/\"\r\n + incomingVariable.ParticipantAddressTypeGuid + \"/\"\r\n )\r\n const data = await response.data.Success ? response.data : []\r\n return data\r\n } catch (err) {\r\n console.log('error', err)\r\n return thunkAPI.rejectWithValue({ error: err.message });\r\n }\r\n})\r\n\r\nexport const createAddressTypes = createAsyncThunk('addresstype/create', async (incomingVariable, thunkAPI) => {\r\n console.log('called update addresstype')\r\n try {\r\n const response = await axios.post(PLATFORM\r\n + \"Participant/Address/Type/Create/\"\r\n + incomingVariable.authToken + \"/\"\r\n + incomingVariable.AddressTypeName + \"/\"\r\n + incomingVariable.AddressTypeDescription + \"/\"\r\n )\r\n const data = await response.data.Success ? response.data : []\r\n return data\r\n } catch (err) {\r\n console.log('error', err)\r\n return thunkAPI.rejectWithValue({ error: err.message });\r\n }\r\n})\r\n\r\nconst addresstypeSlice = createSlice({\r\n name: 'addresstypes',\r\n initialState,\r\n reducers: { \r\n addresstypeClear(state, action) {\r\n state.entities = initialState\r\n state.status = \"idle\"\r\n \r\n }\r\n },\r\n extraReducers(builder) {\r\n builder\r\n //\r\n .addCase(fetchAddressTypes.pending, (state, action) => {\r\n state.status = 'loading'\r\n })\r\n .addCase(fetchAddressTypes.fulfilled, (state, action) => {\r\n state.status = 'success'\r\n const loadedData = action.payload.Info\r\n const data = {}\r\n for (var i = 0; i < loadedData.length; i++) {\r\n data[loadedData[i].ParticipantAddressTypeGuid] = loadedData[i]\r\n }\r\n state.entities = data\r\n })\r\n .addCase(fetchAddressTypes.rejected, (state, action) => {\r\n state.error = action.error.message\r\n console.log('failed')\r\n })\r\n \r\n //\r\n .addCase(updateAddressTypes.pending, (state, action) => {\r\n state.status = 'loading'\r\n })\r\n .addCase(updateAddressTypes.fulfilled, (state, action) => {\r\n state.status = 'success'\r\n const loadedData = action.payload.Info\r\n state.entities[loadedData.ParticipantAddressTypeGuid] = loadedData\r\n })\r\n .addCase(updateAddressTypes.rejected, (state, action) => {\r\n state.error = action.error.message\r\n console.log('failed')\r\n })\r\n \r\n //\r\n .addCase(deleteAddressTypes.pending, (state, action) => {\r\n state.status = 'loading'\r\n })\r\n .addCase(deleteAddressTypes.fulfilled, (state, action) => {\r\n state.status = 'success'\r\n const loadedData = action.payload.Info\r\n delete state.entities[loadedData.ParticipantAddressTypeGuid]\r\n })\r\n .addCase(deleteAddressTypes.rejected, (state, action) => {\r\n state.error = action.error.message\r\n console.log('failed')\r\n })\r\n\r\n\r\n }\r\n})\r\n\r\nexport const { addresstypeClear} = addresstypeSlice.actions\r\n\r\nexport default addresstypeSlice.reducer\r\n\r\nconst selectAddressTypeEntities = (state) => state.addresstypes.entities\r\n\r\nexport const selectAddressTypes = createSelector(selectAddressTypeEntities, (entities) =>\r\n Object.values(entities)\r\n)\r\n\r\nexport const selectAddressTypeById = (state, AddressTypeId) => {\r\n return selectAddressTypeEntities(state)[AddressTypeId]\r\n}\r\n\r\n","import React, { useState, useEffect } from \"react\";\r\nimport { useNavigate, useLocation } from 'react-router-dom';\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Paper, Grid, Skeleton, Box, Typography, Stack } from \"@mui/material\";\r\nimport { getViewInstance } from \"../actions/viewinstance\";\r\nimport Header from \"./layouts/Header\";\r\nimport Footer from \"./layouts/Footer\";\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport ParticipantControl from \"./partials/admincenter/ParticipantControl\";\r\nimport ParticipantTable from \"./partials/admincenter/ParticipantTable\";\r\nimport { fetchParticipants } from \"../reducers/admincenter_participants\";\r\nimport AdminTabs from \"./partials/admincenter/AdminTabs\";\r\nimport { fetchCountrys } from \"../reducers/reference_country\";\r\nimport { fetchEducations } from \"../reducers/reference_education\";\r\nimport { fetchSpokenLanguages } from \"../reducers/reference_spokenlanguage\";\r\nimport { fetchPhoneTypes } from \"../reducers/reference_phonetype\";\r\nimport { fetchAddressTypes } from \"../reducers/reference_addresstypes\";\r\nimport { fetchMiscTypes } from \"../reducers/reference_misctypes\";\r\nimport { fetchRaces } from \"../reducers/reference_race\";\r\nimport { fetchBirthSexs } from \"../reducers/reference_birthsex\";\r\nimport { fetchGroups } from \"../reducers/admincenter_groups\";\r\nimport { Help, MoreVert } from \"@mui/icons-material\";\r\n\r\n\r\nconst AdminCenterParticipants = () => {\r\n\r\n const { mainUser: currentUser, status: authStatus } = useSelector((state) => state.auth);\r\n const navigate = useNavigate();\r\n const dispatch = useDispatch();\r\n const location = useLocation();\r\n const [loading, setLoading] = useState(false);\r\n const [callVI, setCallVI] = useState(false)\r\n const { viewInstance, settings } = useSelector(state => state.viewinstance)\r\n const adminparticipantsStatus = useSelector(state => state.adminparticipants.status)\r\n const countryStatus = useSelector(state => state.countrys.status)\r\n const educationStatus = useSelector(state => state.educations.status)\r\n const languageStatus = useSelector(state => state.spokenlanguages.status)\r\n const phonetypeStatus = useSelector(state => state.phonetypes.status)\r\n const addresstypeStatus = useSelector(state => state.addresstypes.status)\r\n const misctypeStatus = useSelector(state => state.misctypes.status)\r\n const admingroupsStatus = useSelector(state => state.admingroups.status)\r\n const birthSexStatus = useSelector(state => state.birthsexs.status)\r\n const raceStatus = useSelector(state => state.races.status)\r\n const userIsAdmin = (currentUser && (currentUser.IsAdmin === true))\r\n\r\n useEffect(() => {\r\n\r\n if (userIsAdmin === false) {\r\n navigate('/home')\r\n //} else {\r\n //if (adminparticipantsStatus === 'idle') {\r\n //dispatch(fetchParticipants({ authToken: currentUser.AuthToken, page:0 }))\r\n //}\r\n //if (!callVI && (!viewInstance || !viewInstance.AdminCenterPage) && currentUser && currentUser.AuthToken && authStatus === 'success') {\r\n //setCallVI(true);\r\n //dispatch(getViewInstance('F68B82A2-D122-4A05-B11D-BD91A2A52DC3', currentUser.AuthToken))\r\n //}\r\n }\r\n\r\n }, [userIsAdmin, navigate])\r\n\r\n useEffect(() => {\r\n if ((userIsAdmin === true) &&\r\n currentUser &&\r\n (adminparticipantsStatus === 'idle')) {\r\n dispatch(fetchParticipants({ authToken: currentUser.AuthToken, page: 0 }))\r\n }\r\n }, [userIsAdmin, adminparticipantsStatus, currentUser, dispatch])\r\n\r\n useEffect(() => {\r\n if ((userIsAdmin === true) &&\r\n currentUser &&\r\n !callVI &&\r\n (!viewInstance || !viewInstance.AdminCenterPage) &&\r\n authStatus === 'success') {\r\n setCallVI(true);\r\n dispatch(getViewInstance('F68B82A2-D122-4A05-B11D-BD91A2A52DC3', currentUser.AuthToken))\r\n }\r\n }, [userIsAdmin, setCallVI, viewInstance, location.pathname, currentUser, authStatus])\r\n\r\n useEffect(() => {\r\n if (birthSexStatus === 'idle') {\r\n dispatch(fetchBirthSexs({ authToken: currentUser.AuthToken }))\r\n }\r\n }, [birthSexStatus, dispatch])\r\n\r\n useEffect(() => {\r\n if (raceStatus === 'idle') {\r\n dispatch(fetchRaces({ authToken: currentUser.AuthToken }))\r\n }\r\n }, [raceStatus, dispatch])\r\n\r\n useEffect(() => {\r\n if (countryStatus === 'idle') {\r\n dispatch(fetchCountrys({ authToken: currentUser.AuthToken }))\r\n }\r\n }, [countryStatus, dispatch])\r\n\r\n useEffect(() => {\r\n if (educationStatus === 'idle') {\r\n dispatch(fetchEducations({ authToken: currentUser.AuthToken }))\r\n }\r\n }, [educationStatus, dispatch])\r\n\r\n useEffect(() => {\r\n if (languageStatus === 'idle') {\r\n dispatch(fetchSpokenLanguages({ authToken: currentUser.AuthToken }))\r\n }\r\n }, [languageStatus, dispatch])\r\n\r\n useEffect(() => {\r\n if (phonetypeStatus === 'idle') {\r\n dispatch(fetchPhoneTypes({ authToken: currentUser.AuthToken }))\r\n }\r\n }, [phonetypeStatus, dispatch])\r\n\r\n useEffect(() => {\r\n if (addresstypeStatus === 'idle') {\r\n dispatch(fetchAddressTypes({ authToken: currentUser.AuthToken }))\r\n }\r\n }, [addresstypeStatus, dispatch])\r\n\r\n useEffect(() => {\r\n if (misctypeStatus === 'idle') {\r\n dispatch(fetchMiscTypes({ authToken: currentUser.AuthToken }))\r\n }\r\n }, [misctypeStatus, dispatch])\r\n\r\n useEffect(() => {\r\n if (admingroupsStatus === 'idle') {\r\n dispatch(fetchGroups({ authToken: currentUser.AuthToken }))\r\n }\r\n }, [admingroupsStatus, dispatch])\r\n\r\n const EditStatusArray = [\r\n countryStatus === 'success' ? true : false\r\n , educationStatus === 'success' ? true : false\r\n , languageStatus === 'success' ? true : false\r\n , phonetypeStatus === 'success' ? true : false\r\n , addresstypeStatus === 'success' ? true : false\r\n , misctypeStatus === 'success' ? true : false\r\n , birthSexStatus === 'success' ? true : false\r\n , raceStatus === 'success' ? true : false\r\n , admingroupsStatus === 'success' ? true : false\r\n , adminparticipantsStatus === 'success' ? true : false\r\n ]\r\n\r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n\r\n return (\r\n \r\n
\r\n {viewInstance && viewInstance.AdminCenterPage ? (\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {\r\n EditStatusArray.indexOf(false) < 0\r\n ?\r\n \r\n \r\n \r\n \r\n \r\n \r\n {\r\n EditStatusArray.indexOf(false) < 0\r\n ? (\r\n \r\n\r\n \r\n You can sort and filter columns in the table below using the vertical elipses {\"(\"} \r\n \r\n )\r\n : ( \r\n \r\n \r\n \r\n \r\n \r\n {\r\n EditStatusArray.indexOf(false) < 0\r\n ? ( \r\n \r\n \r\n \r\n ) : (\r\n
\r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n )}\r\n
\r\n
\r\n \r\n HOME\r\n \r\n Logout \r\n \r\n */","//Admin/ReportCriteria/Set/{AuthToken}/\r\nimport React from 'react'\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport _ from \"lodash\"\r\nimport { Grid, Typography, Checkbox } from '@mui/material'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { reportcriteriaModify, selectReportCriteriaEntities, reportcriteriaClear } from '../../../reducers/admincenter_reportcriteria';\r\n\r\n\r\n/**\r\n * \r\n{\r\n\"ReportCriteria\":\r\n{\r\n\"ReportGuid\": \"97069626-6A92-4BA5-AC4B-B47969B454D9\",\r\n\"SelectedAssessmentProduct\": \"HRA200\",\r\n\"ParticipantGuid\": \"5FEA08D8-4F8B-4CF8-957A-2EC1FE8B36ED\",\r\n\"AssessmentGuid\": \"C83D7CEE-1870-467B-953A-E414006D5C57\",\r\n\"ReportOutputFormat\": \"XML\",\r\n\"FirstRowHeader\": \"1\",\r\n\"ReportGroupName\": \"Arbitrary Name Passed By Caller\",\r\n\"IncludeAdditionalQuestions\": \"1\",\r\n\"ExcludeInactiveParticipants\": \"0\",\r\n\"DateRangeStart\": \"2015-01-01\",\r\n\"DateRangeEnd\": \"2016-12-31\",\r\n\"HRAStartedInDateRange\": \"0\",\r\n\"HRANotStartedInDateRange\": \"0\",\r\n\"HRACompletedInDateRange\": \"1\",\r\n\"HRANotCompletedInDateRange\": \"0\",\r\n\"GroupGuidList\":[\"6C096600-B754-49A0-A72D-23CC85548FC7\",\"032AAA24-4222-4FD2-AC42-2F690FCCE860\",\"6F8E2BCC-AC19-4353-B245-A6F74DE7F7E1\",\"45642721-13D9-4A15-9220-F8B4CF11B3A6\",\"5DED27D7-D094-4295-800F-3CE85B3B4AF5\",\"9EE86F41-5A96-4984-A4BE-DD93FD893B7A\",\"5E4AB781-A30A-4D47-9751-C0D453505AEF\",\"4C1C8A83-F70F-44A4-BEDB-966D16389367\",\"D7D6843F-DD37-4464-9B75-22D872304B24\",\"0CD7527D-5D34-4176-AACE-F404BF825FFF\"]\r\n}'\r\n */\r\nconst ReportCriteriaFlags = (props) => {\r\n const dispatch = useDispatch()\r\n\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n\r\n const ReportCriteria = useSelector(state => selectReportCriteriaEntities(state))\r\n\r\n const handleModifyLocal = (k, v) => {\r\n dispatch(reportcriteriaModify({ Key: k, Value: v }))\r\n if (k === 'NotCompletedInRange' && v===true) { dispatch(reportcriteriaModify({ Key: 'CompletedInRange', Value: !v })) }\r\n if (k === 'CompletedInRange' && v===true) { dispatch(reportcriteriaModify({ Key: 'NotCompletedInRange', Value: !v })) }\r\n if (k === 'NotStartedInRange' && v===true) { dispatch(reportcriteriaModify({ Key: 'StartedInRange', Value: !v })) }\r\n if (k === 'StartedInRange' && v===true) { dispatch(reportcriteriaModify({ Key: 'NotStartedInRange', Value: !v })) }\r\n if (k === 'FirstCompletedInRange' && v===true) { dispatch(reportcriteriaModify({ Key: 'NotFirstCompletedInRange', Value: !v })) }\r\n if (k === 'NotFirstCompletedInRange' && v===true) { dispatch(reportcriteriaModify({ Key: 'FirstCompletedInRange', Value: !v })) }\r\n if (k === 'ModifiedInRange' && v===true) { dispatch(reportcriteriaModify({ Key: 'NotModifiedInRange', Value: !v })) }\r\n if (k === 'NotModifiedInRange' && v===true) { dispatch(reportcriteriaModify({ Key: 'ModifiedInRange', Value: !v })) }\r\n }\r\n const handleClear = () => {\r\n dispatch(reportcriteriaClear())\r\n }\r\n\r\n const CheckBoxComponent = ({ JSONNode, Title }) => {\r\n\r\n return (\r\n \r\n \r\n handleModifyLocal(JSONNode, e.target.checked)} />\r\n \r\n \r\n {Title} \r\n \r\n \r\n handleModifyLocal(\"Not\" + JSONNode, e.target.checked)} />\r\n \r\n \r\n Not {Title} \r\n \r\n \r\n )\r\n }\r\n const options = [\r\n { JSONNode: \"StartedInRange\", Title: \"Started\" }\r\n , { JSONNode: \"CompletedInRange\", Title: \"Completed\" }\r\n , { JSONNode: \"ModifiedInRange\", Title: \"Modified\" }\r\n , { JSONNode: \"FirstCompletedInRange\", Title: \"First Completed\" }\r\n ]\r\n return (\r\n\r\n \r\n {\r\n options.map((x) => {\r\n return (\r\n \r\n \r\n )\r\n })\r\n }\r\n \r\n )\r\n\r\n}\r\nexport default ReportCriteriaFlags\r\n","//Admin/ReportCriteria/Set/{AuthToken}/\r\nimport React from 'react'\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport _ from \"lodash\"\r\nimport { Grid, Typography, Box, TextField } from '@mui/material'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { reportcriteriaModify, selectReportCriteriaEntities } from '../../../reducers/admincenter_reportcriteria';\r\n\r\n\r\n/**\r\n * \r\n{\r\n\"ReportCriteria\":\r\n{\r\n\"ReportGuid\": \"97069626-6A92-4BA5-AC4B-B47969B454D9\",\r\n\"SelectedAssessmentProduct\": \"HRA200\",\r\n\"ParticipantGuid\": \"5FEA08D8-4F8B-4CF8-957A-2EC1FE8B36ED\",\r\n\"AssessmentGuid\": \"C83D7CEE-1870-467B-953A-E414006D5C57\",\r\n\"ReportOutputFormat\": \"XML\",\r\n\"FirstRowHeader\": \"1\",\r\n\"ReportGroupName\": \"Arbitrary Name Passed By Caller\",\r\n\"IncludeAdditionalQuestions\": \"1\",\r\n\"ExcludeInactiveParticipants\": \"0\",\r\n\"DateRangeStart\": \"2015-01-01\",\r\n\"DateRangeEnd\": \"2016-12-31\",\r\n\"HRAStartedInDateRange\": \"0\",\r\n\"HRANotStartedInDateRange\": \"0\",\r\n\"HRACompletedInDateRange\": \"1\",\r\n\"HRANotCompletedInDateRange\": \"0\",\r\n\"GroupGuidList\":[\"6C096600-B754-49A0-A72D-23CC85548FC7\",\"032AAA24-4222-4FD2-AC42-2F690FCCE860\",\"6F8E2BCC-AC19-4353-B245-A6F74DE7F7E1\",\"45642721-13D9-4A15-9220-F8B4CF11B3A6\",\"5DED27D7-D094-4295-800F-3CE85B3B4AF5\",\"9EE86F41-5A96-4984-A4BE-DD93FD893B7A\",\"5E4AB781-A30A-4D47-9751-C0D453505AEF\",\"4C1C8A83-F70F-44A4-BEDB-966D16389367\",\"D7D6843F-DD37-4464-9B75-22D872304B24\",\"0CD7527D-5D34-4176-AACE-F404BF825FFF\"]\r\n}'\r\n */\r\nconst ReportCriteriaDates = (props) => {\r\n const dispatch = useDispatch()\r\n\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n\r\n const ReportCriteria = useSelector(state => selectReportCriteriaEntities(state))\r\n\r\n const handleModifyLocal = (k, v) => {\r\n dispatch(reportcriteriaModify({ Key: k, Value: v }))\r\n\r\n }\r\n\r\n return (\r\n\r\n \r\n\r\n \r\n \r\n From \r\n \r\n \r\n \r\n \r\n { handleModifyLocal(\"DateRangeStart\", e.target.value) }} />\r\n \r\n \r\n \r\n \r\n To \r\n \r\n \r\n \r\n \r\n { handleModifyLocal(\"DateRangeEnd\", e.target.value) }} />\r\n \r\n \r\n\r\n \r\n )\r\n\r\n}\r\nexport default ReportCriteriaDates\r\n","//Admin/ReportCriteria/Set/{AuthToken}/\r\nimport React, { useState, useEffect } from 'react'\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport _ from \"lodash\"\r\nimport { Button, Grid, Typography, Box, Collapse, Select, MenuItem, Skeleton, TextField } from '@mui/material'\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { reportcriteriaModify, selectReportCriteriaEntities, reportcriteriaClear, updateReportCriteria, reportcriteriaResetStatus } from '../../../reducers/admincenter_reportcriteria';\r\nimport { fetchDataReport, datareportResetStatus } from '../../../reducers/admincenter_datareport';\r\nimport ArrowDropDown from '@mui/icons-material/ArrowDropDown';\r\nimport ArrowDropUp from '@mui/icons-material/ArrowDropUp';\r\nimport { fetchGroups } from '../../../reducers/admincenter_groups';\r\nimport ReportCriteriaGroupSelect from './ReportCriteriaGroupSelect';\r\nimport ReportCriteriaFlags from './ReportCriteriaFlags';\r\nimport ReportCriteriaDates from './ReportCriteriaDates';\r\nimport { selectActiveProducts, selectReportsForGuid, selectReportsForProduct } from '../../../reducers/reference_reportproduct';\r\nimport { fetchUIReport, uireportResetStatus } from '../../../reducers/admincenter_uireport';\r\n\r\n/**\r\n * \r\n{\r\n\"ReportCriteria\":\r\n{\r\n\"ReportGuid\": \"97069626-6A92-4BA5-AC4B-B47969B454D9\",\r\n\"SelectedAssessmentProduct\": \"HRA200\",\r\n\"ParticipantGuid\": \"5FEA08D8-4F8B-4CF8-957A-2EC1FE8B36ED\",\r\n\"AssessmentGuid\": \"C83D7CEE-1870-467B-953A-E414006D5C57\",\r\n\"ReportOutputFormat\": \"XML\",\r\n\"FirstRowHeader\": \"1\",\r\n\"ReportGroupName\": \"Arbitrary Name Passed By Caller\",\r\n\"IncludeAdditionalQuestions\": \"1\",\r\n\"ExcludeInactiveParticipants\": \"0\",\r\n\"DateRangeStart\": \"2015-01-01\",\r\n\"DateRangeEnd\": \"2016-12-31\",\r\n\"HRAStartedInDateRange\": \"0\",\r\n\"HRANotStartedInDateRange\": \"0\",\r\n\"HRACompletedInDateRange\": \"1\",\r\n\"HRANotCompletedInDateRange\": \"0\",\r\n\"GroupGuidList\":[\"6C096600-B754-49A0-A72D-23CC85548FC7\",\"032AAA24-4222-4FD2-AC42-2F690FCCE860\",\"6F8E2BCC-AC19-4353-B245-A6F74DE7F7E1\",\"45642721-13D9-4A15-9220-F8B4CF11B3A6\",\"5DED27D7-D094-4295-800F-3CE85B3B4AF5\",\"9EE86F41-5A96-4984-A4BE-DD93FD893B7A\",\"5E4AB781-A30A-4D47-9751-C0D453505AEF\",\"4C1C8A83-F70F-44A4-BEDB-966D16389367\",\"D7D6843F-DD37-4464-9B75-22D872304B24\",\"0CD7527D-5D34-4176-AACE-F404BF825FFF\"]\r\n}'\r\n */\r\nconst ReportCriteria = (props) => {\r\n const dispatch = useDispatch()\r\n\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n\r\n const SelectProductFrame = props.ReportTab.AdminReports.SelectProductFrame\r\n const ReportOptions = props.ReportTab.AdminReports.ReportOptions.ReportOptions\r\n const ReportFormatFrame = props.ReportTab.AdminReports.ReportOptions.ReportFormatFrame\r\n const ReportTypeFrame = props.ReportTab.AdminReports.ReportTypeFrame\r\n const DateRangeFrame = props.ReportTab.AdminReports.ReportOptions.DateRangeFrame\r\n const DateCriteriaFrame = props.ReportTab.AdminReports.ReportOptions.DateCriteriaFrame\r\n\r\n\r\n\r\n const ReportCriteria = useSelector(state => selectReportCriteriaEntities(state))\r\n const Products = useSelector(state => selectActiveProducts(state))\r\n const Reports = useSelector(state => selectReportsForProduct(state, ReportCriteria.SelectedAssessmentProduct))\r\n const ReportArray = useSelector(state => selectReportsForGuid(state, ReportCriteria.ReportGuid))\r\n const ReportObject = ReportArray\r\n && ReportArray[0]\r\n && ReportArray.filter(x => { return x.ProductTypeKeyName === ReportCriteria.SelectedAssessmentProduct }).length > 0\r\n ? ReportArray.filter(x => { return x.ProductTypeKeyName === ReportCriteria.SelectedAssessmentProduct })[0]\r\n : []\r\n const [GenerateReport, setGenerateReport] = useState(false)\r\n //console.log('report criteria stuff',{cri:ReportCriteria, pro:Products, rep:Reports, repAr: ReportArray})\r\n const validated =\r\n ReportCriteria.SelectedAssessmentProduct\r\n && ReportCriteria.SelectedAssessmentProduct.length > 3\r\n && ReportCriteria.ReportGuid\r\n && ReportCriteria.ReportGuid.length > 3\r\n && ReportCriteria.GroupGuidList.length > 0 ? false : true\r\n\r\n const admingroupsStatus = useSelector(state => state.admingroups.status)\r\n const dataReportStatus = useSelector(state => state.datareports.status)\r\n const uiReportStatus = useSelector(state => state.uireports.status)\r\n const reportCriteriaStatus = useSelector(state => state.reportcriterias.status)\r\n const [isExpanded, setIsExpanded] = useState(true)\r\n\r\n useEffect(() => {\r\n if (admingroupsStatus === 'idle') {\r\n dispatch(fetchGroups({ authToken: currentUser.AuthToken }))\r\n }\r\n }, [admingroupsStatus, dispatch])\r\n\r\n useEffect(() => {\r\n }, [dataReportStatus, dispatch]\r\n )\r\n const handleModifyLocal = (k, v) => {\r\n dispatch(reportcriteriaModify({ Key: k, Value: v }))\r\n if (k === 'SelectedAssessmentProduct') {\r\n dispatch(reportcriteriaModify({ Key: 'ReportGuid', Value: \"\" }))\r\n }\r\n\r\n }\r\n const handleClear = () => {\r\n dispatch(reportcriteriaClear())\r\n }\r\n\r\n const ReportToVI = {\r\n \"BFAB12B2-CD8A-4E9A-B73C-4B3E9C783BA7\": \"BFAB12B2-CD8A-4E9A-B73C-4B3E9C783BA7\"\r\n }\r\n useEffect(() => {\r\n if (GenerateReport === true) {\r\n\r\n if (dataReportStatus === 'idle' && ReportObject.ReportFamilyKeyName === 'RESULT SET') {\r\n dispatch(fetchDataReport({ AuthToken: currentUser.AuthToken, ReportCriteria: ReportCriteria }))\r\n setGenerateReport(false)\r\n } else\r\n if (uiReportStatus === 'idle' && ReportObject.ReportFamilyKeyName === 'JSON OUTPUT') {\r\n\r\n dispatch(updateReportCriteria({ AuthToken: currentUser.AuthToken, ReportCriteria: ReportCriteria }))\r\n .then(res => {\r\n\r\n dispatch(fetchUIReport({ AuthToken: currentUser.AuthToken, VIGuid: ReportCriteria.ReportGuid }))\r\n }\r\n )\r\n setGenerateReport(false)\r\n } else\r\n if (uiReportStatus === 'idle' && dataReportStatus ==='idle' && ReportObject.ReportFamilyKeyName === 'RESULTS FOR AGG') {\r\n dispatch(fetchDataReport({ AuthToken: currentUser.AuthToken, ReportCriteria: ReportCriteria }))\r\n .then(res1 => {\r\n\r\n dispatch(updateReportCriteria({ AuthToken: currentUser.AuthToken, ReportCriteria: ReportCriteria }))\r\n .then(res => {\r\n\r\n dispatch(fetchUIReport({ AuthToken: currentUser.AuthToken, VIGuid: ReportCriteria.ReportGuid }))\r\n }\r\n )\r\n })\r\n setGenerateReport(false)\r\n }\r\n }\r\n }, [dispatch, GenerateReport, dataReportStatus, uiReportStatus])\r\n\r\n\r\n const ProductSelect = () => {\r\n const options = Products.map((x) => {\r\n return ({x.SurveyDescription || x.ProductTypeName} )\r\n })\r\n return (\r\n { handleModifyLocal(\"SelectedAssessmentProduct\", e.target.value) }}\r\n >\r\n {options}\r\n \r\n )\r\n }\r\n\r\n const ReportType = () => {\r\n const ReportTypes = [...new Set(Reports.filter(y => { return y.ReportClassKeyName === 'ADMIN' }).map(x => { return x.ReportFamilyKeyName }))]\r\n const Options = []\r\n for (var l = 0; l < ReportTypes.length; l++) {\r\n Options.push({ReportTypes[l] === \"JSON OUTPUT\" ? \"Dashboards\" : \"Data Reports\"} )\r\n const thisCategory = Reports.filter(x => { return x.ReportFamilyKeyName === ReportTypes[l] })\r\n for (var h = 0; h < thisCategory.length; h++) {\r\n Options.push({thisCategory[h].ReportTypeName} )\r\n\r\n }\r\n }\r\n // const options = Reports.map((x) => {\r\n // return ({x.ReportName} )\r\n // })\r\n return (\r\n { handleModifyLocal(\"ReportGuid\", e.target.value) }}\r\n >\r\n {Options}\r\n \r\n )\r\n }\r\n\r\n const GenerateReportCriteria = () => {\r\n setIsExpanded(false)\r\n dispatch(reportcriteriaResetStatus())\r\n if (ReportObject.ReportFamilyKeyName === 'JSON OUTPUT') {\r\n\r\n dispatch(uireportResetStatus())\r\n }\r\n if (ReportObject.ReportFamilyKeyName === 'RESULT SET') {\r\n\r\n dispatch(datareportResetStatus())\r\n }\r\n if(ReportObject.ReportFamilyKeyName === 'RESULTS FOR AGG'){\r\n dispatch(datareportResetStatus())\r\n dispatch(uireportResetStatus())\r\n\r\n }\r\n setGenerateReport(true)\r\n\r\n }\r\n\r\n return (\r\n\r\n \r\n \r\n { setIsExpanded(!isExpanded) }}>\r\n {isExpanded ? \r\n \r\n \r\n Report Filters \r\n \r\n\r\n \r\n\r\n \r\n\r\n\r\n \r\n \r\n {props.ReportTab.AdminReports.Instruction.InstructionText} \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {\r\n admingroupsStatus === 'success' ?\r\n (\r\n \r\n \r\n )\r\n\r\n : (\r\n \r\n \r\n\r\n )}\r\n \r\n \r\n \r\n GenerateReportCriteria()}>{props.ReportTab.AdminReports.GenerateReportButton.GenerateReportLabel} \r\n \r\n \r\n \r\n \r\n handleClear()}>{props.ReportTab.AdminReports.ResetSearchButton.ResetSearchLabel} \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n \r\n )\r\n\r\n}\r\nexport default ReportCriteria\r\n","import React, { useState } from 'react'\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Button, Box, Dialog, DialogContent } from '@mui/material'\r\n\r\nimport {\r\n DataGrid,\r\n gridPaginatedVisibleSortedGridRowIdsSelector,\r\n gridSortedRowIdsSelector,\r\n GridToolbarContainer,\r\n gridVisibleSortedRowIdsSelector,\r\n useGridApiContext,\r\n GridToolbarExportContainer,\r\n} from '@mui/x-data-grid';\r\nimport { createSvgIcon } from '@mui/material/utils';\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { selectAdminParticipants } from '../../../reducers/admincenter_participants';\r\n\r\nimport ParticipantMainDialog from './ParticipantMainDialog';\r\nimport { participantdemographicClear } from '../../../reducers/admincenter_participantdemographics';\r\nimport { participantaddressClear } from '../../../reducers/admincenter_participantaddress';\r\nimport { participantphoneClear } from '../../../reducers/admincenter_participantphone';\r\nimport { participantmiscClear } from '../../../reducers/admincenter_participantmisc';\r\nimport { contextUpsert, selectContextEntities } from '../../../reducers/global_contexts';\r\n/**\r\n * \r\n {\r\n \"RowNum\":9223372036854775807,\r\n \"ParticipantID\":2147483647,\r\n \"ParticipantGuid\":\"String content\",\r\n \"FirstName\":\"String content\",\r\n \"LastName\":\"String content\",\r\n \"UserName\":\"String content\",\r\n \"GroupID\":2147483647,\r\n \"GroupName\":\"String content\",\r\n \"Status\":2147483647,\r\n \"StatusDisplay\":\"String content\",\r\n \"BioDOB\":\"String content\",\r\n \"LastHRAStarted\":\"String content\",\r\n \"LastLogin\":\"String content\"\r\n }\r\n */\r\nconst DataReportTable = (props) => {\r\n const {rowWidth, tableHeight}=props\r\n const dispatch = useDispatch()\r\n const DataReportStatus = useSelector(state => state.datareports.status)\r\n\r\n const DataReport = useSelector(state=> state.datareports.entities)\r\n const IsData = DataReport.length>0 ? true : false\r\n const DataReportColumns = IsData ? Object.keys(DataReport[0]).map(x=>{return {field: x, headerName: x, editable: false, minWidth:rowWidth?rowWidth:200, flex: 1}}) : [] \r\n const DataReportData = IsData ? DataReport.map((x,i)=> {return {...x, RowId:i}} ) : []\r\n //console.log('data report', {d:DataReport, i:IsData, c:DataReportColumns, dd:DataReportData})\r\n const getUnfilteredRows = ({ apiRef }) => gridSortedRowIdsSelector(apiRef);\r\n const getFilteredRows = ({ apiRef }) => gridVisibleSortedRowIdsSelector(apiRef);\r\n\r\n const Contexts = useSelector(state => selectContextEntities(state))\r\n const { showArchivedParticipants } = Contexts\r\n \r\n \r\n\r\n\r\n const ExportIcon = createSvgIcon(\r\n \r\n handleExport({ getRowsToExport: getFilteredRows })}\r\n >\r\n Filtered rows\r\n \r\n handleExport({ getRowsToExport: getUnfilteredRows })}\r\n >\r\n Unfiltered rows\r\n \r\n \r\n );\r\n };\r\n\r\n\r\n return (\r\n \r\n row.RowId}\r\n density=\"compact\"\r\n disableSelectionOnClick\r\n loading={DataReportStatus==='success'?false:true}\r\n components={{ Toolbar: CustomToolbar }}\r\n // pageSize={5}\r\n // rowsPerPageOptions={[5]}\r\n // checkboxSelection\r\n // disableSelectionOnClick\r\n // experimentalFeatures={{ newEditingApi: true }}\r\n />\r\n \r\n \r\n )\r\n\r\n}\r\nexport default DataReportTable","import React, { useState, useEffect } from \"react\";\r\nimport { useNavigate, useLocation, createSearchParams } from 'react-router-dom';\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Paper, Grid, Dialog, DialogTitle, Typography, Button, DialogContent } from \"@mui/material\";\r\n\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\n\r\nimport FullscreenIcon from '@mui/icons-material/Fullscreen';\r\nimport { FullscreenExit, SettingsPowerRounded } from \"@mui/icons-material\";\r\nimport { selectReportCriteriaEntities } from \"../../../reducers/admincenter_reportcriteria\";\r\nimport { selectReportsForGuid } from \"../../../reducers/reference_reportproduct\";\r\nimport ResponsiveRectangle from \"../skeletons/ResponsiveRectangle\";\r\nimport DataReportTable from \"./ReportDataReportTable\";\r\nimport { selectUIReportEntities } from \"../../../reducers/admincenter_uireport\";\r\nimport DynamicComponent from \"../DynamicComponent\";\r\n\r\n\r\n\r\n\r\n\r\nconst ReportUIReport = () => {\r\n\r\n\r\n const DataReportStatus = useSelector(state => state.datareports.status)\r\n const ReportProductsStatus = useSelector(state => state.reportproducts.status)\r\n const UIReportStatus = useSelector(state => state.uireports.status)\r\n const ReportCriteria = useSelector(state => selectReportCriteriaEntities(state))\r\n const ReportArray = useSelector(state => selectReportsForGuid(state, ReportCriteria.ReportGuid))\r\n const ReportObject = ReportArray && ReportArray[0] ? ReportArray[0] : []\r\n const ReportJSON = useSelector(state => selectUIReportEntities(state))\r\n\r\n const dispatch = useDispatch();\r\n const navigate = useNavigate();\r\n const location = useLocation();\r\n\r\n const cannotReadOnlyNonSense = [...ReportJSON]\r\n const FilteredSections = cannotReadOnlyNonSense.filter(x => { return x.Visible === '1' })\r\n const OrderedSections = FilteredSections.sort(function (a, b) { return parseInt(a.Order) - parseInt(b.Order) })\r\n\r\n\r\n\r\n /*if (!currentUser) {\r\n return \r\n\r\n {/** The idea is simple, we will send each array to a single component that will dictate its format */}\r\n {/** Each array will have a ComponentType attribute. [{ComponentType},{ComponentType},{ComponentType}] */}\r\n {/** This component type will load a specific component*/}\r\n\r\n {\r\n OrderedSections.map((reportComponent, index) => {\r\n return (\r\n\r\n \r\n\r\n )\r\n })\r\n }\r\n\r\n\r\n \r\n ) : UIReportStatus === 'loading' ? (\r\n \r\n \r\n HOME\r\n \r\n Logout \r\n \r\n */","\r\nimport React, { useState, useEffect } from \"react\";\r\n\r\nimport { useSelector, useDispatch } from 'react-redux'\r\nimport _, { size } from 'lodash';\r\nimport { Bar, Doughnut, Pie, Scatter } from 'react-chartjs-2';\r\nimport { Grid, Typography } from \"@mui/material\";\r\n\r\nconst ArcDoughnutAverage = (props) => {\r\n // ChartJS.register(ArcElement, Tooltip, Legend);\r\n\r\n const DataReportData = props.DataReportData\r\n\r\n const ComponentProperties = props.ComponentProperties\r\n const { KeyToUse, MaxValue, Label } = ComponentProperties\r\n\r\n const labelCenter = {\r\n id: \"labelCenter\",\r\n beforeDraw: (chart, args, options) => {\r\n if (!Array.isArray(options.labels)) {\r\n return console.error('\"options.lables\" must be array', options.lables);\r\n }\r\n\r\n const {\r\n ctx,\r\n chartArea: { width, height }\r\n } = chart;\r\n const context = ctx.canvas.getContext(\"2d\");\r\n context.save();\r\n\r\n const labels = options.labels.slice();\r\n const totalFontSize = labels.reduce((x, y, index) => {\r\n let prevSize = x[index - 1] || 0;\r\n x.push(prevSize + y.font.size);\r\n return x;\r\n }, []);\r\n labels.forEach((label, index) => {\r\n let textPosition = totalFontSize[index] - label.font.size + 10;\r\n const values = {\r\n text: label.text || \"?\",\r\n font: {\r\n size: label.font.size || 30,\r\n family: label.font.family || \"sans-serif\",\r\n color: label.font.color || \"black\",\r\n style: label.font.style || \"normal\",\r\n unit: label.font.unit || \"px\"\r\n }\r\n };\r\n switch (values.font.unit) {\r\n case \"em\":\r\n values.font.size = label.font.size * 0.05;\r\n textPosition *= 0.8;\r\n break;\r\n default:\r\n break;\r\n }\r\n\r\n context.font = `${values.font.style} ${values.font.size}${values.font.unit} ${values.font.family}`;\r\n context.textAlign = \"center\";\r\n context.fillStyle = values.font.color;\r\n context.fillText(values.text, width / 2, height / 2 + textPosition);\r\n });\r\n context.restore();\r\n }\r\n };\r\n\r\n const ArcSumOfValues = _.sumBy(DataReportData, item => Number(item[KeyToUse]))\r\n\r\n const ArcFinalValue = Math.trunc(ArcSumOfValues / (DataReportData && DataReportData.length || 1))\r\n\r\n const graphcolors = ['#c0c0c0', '#4eb748', '#E7C61E', '#E6323A']\r\n const GetColor = (score) => {\r\n\r\n const vg = parseInt(score <= 39 ? 3 : score <= 69 ? 2 : score <= 100 ? 1 : 0)\r\n return graphcolors[vg]\r\n }\r\n\r\n const Color = GetColor(ArcFinalValue)\r\n const data = {\r\n datasets: [\r\n {\r\n\r\n data: [ArcFinalValue, MaxValue - ArcFinalValue],\r\n backgroundColor: [\r\n Color,\r\n Color + \"40\"\r\n ],\r\n borderColor: [\r\n 'rgba(255, 99, 132, 0)',\r\n 'rgba(54, 162, 235, 0)',\r\n ],\r\n borderWidth: 0,\r\n },\r\n ],\r\n }\r\n const options = {\r\n responsive: true,\r\n cutout: '80%',\r\n maintainAspectRatio: false,\r\n animation: {\r\n animateRotate: true,\r\n render: false,\r\n },\r\n events: [],\r\n tooltips: {\r\n enabled: true\r\n },\r\n plugins: {\r\n legend: {\r\n display: false\r\n },\r\n labelCenter: {\r\n labels: [\r\n {\r\n text: ArcFinalValue,\r\n font: {\r\n size: 3.25,\r\n unit: \"rem\",\r\n color: 'black',\r\n style: \"bold\"\r\n }\r\n }\r\n ]\r\n }\r\n\r\n }\r\n\r\n }\r\n\r\nconst plugins = [labelCenter]\r\nreturn (\r\n \r\n \r\n {Label} \r\n \r\n \r\n \r\n \r\n)\r\n\r\n}\r\n\r\nexport default ArcDoughnutAverage","\r\nimport React, { useState, useEffect } from \"react\";\r\n\r\nimport { useSelector, useDispatch } from 'react-redux'\r\nimport _, { size } from 'lodash';\r\nimport { Bar, Doughnut, Pie, Scatter } from 'react-chartjs-2';\r\nimport { Grid, Typography } from \"@mui/material\";\r\n\r\nconst ArcDoughnutProportion = (props) => {\r\n // ChartJS.register(ArcElement, Tooltip, Legend);\r\n const DataReportData = props.DataReportData\r\n\r\n const ComponentProperties = props.ComponentProperties\r\n const { KeyToUse, MaxValue, Label } = ComponentProperties\r\n\r\n\r\n const labelCenter = {\r\n id: \"labelCenter\",\r\n beforeDraw: (chart, args, options) => {\r\n if (!Array.isArray(options.labels)) {\r\n return console.error('\"options.lables\" must be array', options.lables);\r\n }\r\n\r\n const {\r\n ctx,\r\n chartArea: { width, height }\r\n } = chart;\r\n const context = ctx.canvas.getContext(\"2d\");\r\n context.save();\r\n\r\n const labels = options.labels.slice();\r\n const totalFontSize = labels.reduce((x, y, index) => {\r\n let prevSize = x[index - 1] || 0;\r\n x.push(prevSize + y.font.size);\r\n return x;\r\n }, []);\r\n labels.forEach((label, index) => {\r\n let textPosition = totalFontSize[index] - label.font.size + 10;\r\n const values = {\r\n text: label.text || \"?\",\r\n font: {\r\n size: label.font.size || 30,\r\n family: label.font.family || \"sans-serif\",\r\n color: label.font.color || \"black\",\r\n style: label.font.style || \"normal\",\r\n unit: label.font.unit || \"px\"\r\n }\r\n };\r\n switch (values.font.unit) {\r\n case \"em\":\r\n values.font.size = label.font.size * 0.05;\r\n textPosition *= 0.8;\r\n break;\r\n default:\r\n break;\r\n }\r\n\r\n context.font = `${values.font.style} ${values.font.size}${values.font.unit} ${values.font.family}`;\r\n context.textAlign = \"center\";\r\n context.fillStyle = values.font.color;\r\n context.fillText(values.text, width / 2, height / 2 + textPosition);\r\n });\r\n context.restore();\r\n }\r\n };\r\n\r\n const ArcSumOfValues =\r\n _.chain(DataReportData)\r\n .groupBy(KeyToUse)\r\n .map((value, key) => ({ distribution: key, value: value.length / DataReportData.length }))\r\n .value()\r\n\r\n\r\n const graphcolors = ['#c0c0c0', '#4eb748', '#E7C61E', '#E6323A']\r\n const GetColor = (score) => {\r\n const vg = parseInt(score <= 39 ? 3 : score <= 69 ? 2 : score <= 100 ? 1 : 0)\r\n return graphcolors[vg]\r\n }\r\n\r\n \r\n const data = {\r\n datasets: [\r\n {\r\n label: ArcSumOfValues.map(x => { return x.distribution }),\r\n data: ArcSumOfValues.map(x => { return x.value * 100 }),\r\n backgroundColor: [\r\n GetColor(30),\r\n GetColor(90)\r\n ],\r\n borderColor: [\r\n 'rgba(255, 99, 132, 0)',\r\n 'rgba(54, 162, 235, 0)',\r\n ],\r\n borderWidth: 0,\r\n },\r\n ],\r\n }\r\n const options = {\r\n responsive: true,\r\n cutout: '80%',\r\n maintainAspectRatio: false,\r\n animation: {\r\n animateRotate: true,\r\n render: false,\r\n },\r\n // events: [],\r\n tooltips: {\r\n enabled: true\r\n },\r\n plugins: {\r\n\r\n \r\n\r\n }\r\n }\r\n const plugins = [labelCenter]\r\n return (\r\n \r\n \r\n {Label} \r\n \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default ArcDoughnutProportion","\r\nimport React, { useState, useEffect } from \"react\";\r\n\r\nimport { useSelector, useDispatch } from 'react-redux'\r\nimport _, { size } from 'lodash';\r\nimport { Bar, Doughnut, Pie, Scatter } from 'react-chartjs-2';\r\nimport { Grid, Typography } from \"@mui/material\";\r\nimport { GetColor } from \"./RefColorFunctions\";\r\n\r\nconst ArcHistogramStep = (props) => {\r\n // ChartJS.register(ArcElement, Tooltip, Legend);\r\n const ComponentProperties = props.ComponentProperties\r\n const { KeyToUse, MaxValue, Label, Step, Color } = ComponentProperties\r\n\r\n const DataReportData = props.DataReportData\r\n\r\n const initSteps = Array.apply(null, Array(Math.floor(MaxValue / Step))).map(function (x, i) { return i; })\r\n const Distributed = initSteps.map((s, si) => { return DataReportData.filter(dr => { return Number(dr[KeyToUse]) >= s * Step && Number(dr[KeyToUse]) <= (s * Step + Step) }).length })\r\n const Labels = initSteps.map((s) => { return String(s * Step) + \"-\" + String(s * Step + Step) })\r\n const labelCenter = {\r\n id: \"labelCenter\",\r\n afterDraw: (chart, args, options) => {\r\n if (!Array.isArray(options.labels)) {\r\n return console.error('\"options.lables\" must be array', options.lables);\r\n }\r\n\r\n const {\r\n ctx,\r\n chartArea: { width, height }\r\n } = chart;\r\n const context = ctx.canvas.getContext(\"2d\");\r\n context.save();\r\n\r\n const labels = options.labels.slice();\r\n const totalFontSize = labels.reduce((x, y, index) => {\r\n let prevSize = x[index - 1] || 0;\r\n x.push(prevSize + y.font.size);\r\n return x;\r\n }, []);\r\n labels.forEach((label, index) => {\r\n let textPosition = totalFontSize[index] - label.font.size + 10;\r\n const values = {\r\n text: label.text || \"?\",\r\n font: {\r\n size: label.font.size || 30,\r\n family: label.font.family || \"sans-serif\",\r\n color: label.font.color || \"black\",\r\n style: label.font.style || \"normal\",\r\n unit: label.font.unit || \"px\"\r\n }\r\n };\r\n switch (values.font.unit) {\r\n case \"em\":\r\n values.font.size = label.font.size * 0.15;\r\n textPosition *= 1.1;\r\n break;\r\n default:\r\n break;\r\n }\r\n\r\n context.font = `${values.font.style} ${values.font.size}${values.font.unit} ${values.font.family}`;\r\n context.textAlign = \"center\";\r\n context.fillStyle = values.font.color;\r\n context.fillText(values.text, width / 2 + textPosition, height / 2 + textPosition);\r\n });\r\n context.restore();\r\n }\r\n };\r\n\r\n const ArcSumOfValues = _.sumBy(DataReportData, item => Number(item[KeyToUse]))\r\n\r\n const ArcFinalValue = Math.trunc(ArcSumOfValues / (DataReportData && DataReportData.length || 1))\r\n\r\n const data = {\r\n labels: Labels,\r\n datasets: [\r\n {\r\n data: Distributed,\r\n backgroundColor: initSteps.map(x => { return GetColor(Color, x * Step) + \"AA\" }),\r\n },\r\n ],\r\n }\r\n const options = {\r\n responsive: true,\r\n maintainAspectRatio: false,\r\n scales: {\r\n y: {\r\n\r\n grid: {\r\n display: false,\r\n drawBorder: false\r\n },\r\n ticks: {\r\n display: false\r\n }\r\n },\r\n x: {\r\n grid: {\r\n display: false,\r\n drawBorder: false\r\n },\r\n ticks: {\r\n display: false\r\n }\r\n }\r\n },\r\n plugins: {\r\n legend: {\r\n display: false\r\n },\r\n labelCenter: {\r\n labels: [\r\n {\r\n text: ArcFinalValue,\r\n font: {\r\n size: 3.25,\r\n unit: \"rem\",\r\n color: 'black'\r\n }\r\n }\r\n ]\r\n }\r\n\r\n }\r\n\r\n }\r\n\r\n const plugins = [labelCenter]\r\n\r\n return (\r\n \r\n \r\n {Label} \r\n \r\n \r\n \r\n \r\n )\r\n\r\n}\r\n\r\nexport default ArcHistogramStep","import { random } from \"lodash\"\r\n\r\n\r\nexport const GetValueGrade_Score = (val) => {\r\n const vg = parseInt((val >=0 && val <= 39) ? 3 : val <= 69 ? 2 : val <= 100 ? 1 : 0)\r\n return vg\r\n}\r\n\r\nexport const GetAge_AdminBand = (val) => {\r\n const convVal = Number(val)\r\n if (convVal >=18 && convVal<=24){\r\n return 0\r\n } else if(convVal >=25 && convVal<=34){\r\n return 1\r\n }else if(convVal >=35 && convVal<=44){\r\n return 2\r\n }else if(convVal >=45 && convVal<=54){\r\n return 3\r\n }else if(convVal >=55 && convVal<=64){\r\n return 4\r\n }else if(convVal >=65 && convVal<=74){\r\n return 5\r\n }else if(convVal >=75 ){\r\n return 6\r\n } else {\r\n return -1\r\n }\r\n}\r\n\r\n \r\n export const GetTransform = (fnc, val) => {\r\n if(fnc ==='SCORE TO VALUE GRADE'){\r\n return GetValueGrade_Score(val) \r\n } else if (fnc ==='AGE ADMIN BANDS'){\r\n return GetAge_AdminBand(val) \r\n } else {\r\n return val\r\n }\r\n }","\r\nimport React, { useState, useEffect } from \"react\";\r\n\r\nimport { useSelector, useDispatch } from 'react-redux'\r\nimport _, { size } from 'lodash';\r\nimport { Bar, Doughnut, Pie, Scatter } from 'react-chartjs-2';\r\nimport { Grid, Typography } from \"@mui/material\";\r\nimport { GetColor } from \"./RefColorFunctions\";\r\nimport { GetTransform } from \"./RefTransformationFunctions\";\r\n\r\nconst ArcListDistibution = (props) => {\r\n const safeParse = (str)=>{\r\n try{\r\n JSON.parse(str)\r\n return true\r\n }catch{\r\n return false;\r\n }\r\n }\r\n const ComponentProperties = props.ComponentProperties\r\n const { KeyToUse, Label, Color,ValueOrder,ValueLabels,Transform,ShowAvailable } = ComponentProperties\r\n const DataReportData = props.DataReportData\r\n const ValueOrderArray = (ValueOrder && ValueOrder.length>0 && ValueOrder.split('|')) || []\r\n const ValueLabelJSON = safeParse(ValueLabels) ? JSON.parse(ValueLabels):{}\r\n const recordCount = DataReportData.length\r\n // KeyToUse will be an array\r\n const ValueArray = DataReportData.map(x=>{return {[KeyToUse]: Transform ? GetTransform(Transform,x[KeyToUse]):x[KeyToUse]}})\r\n \r\n \r\n\r\n\r\n const ArcSumOfValues =\r\n _.chain(ValueArray)\r\n .groupBy(KeyToUse)\r\n .map((value, key) => ({ \r\n distribution: key\r\n , value: value.length\r\n , percentage: Number(parseFloat((value.length / ValueArray.length * 100)).toFixed(2))\r\n , order: ValueOrderArray.indexOf(key) >=0 ? ValueOrderArray.indexOf(key) : 99 \r\n }))\r\n .value()\r\n const AllValues = Object.keys(ValueLabelJSON)\r\n const AllValuesData = AllValues.map((x,i)=>{ \r\n let HasValues = ArcSumOfValues.filter(y=>y.distribution==x) \r\n return (HasValues && HasValues.length>0)? HasValues[0] : {distribution:x, value:0, percentage:0, order: ValueOrderArray.indexOf(x) >=0 ? ValueOrderArray.indexOf(x) : 99 }\r\n })\r\n const ArcSorted = ShowAvailable ? _.sortBy(ArcSumOfValues,'order') : _.sortBy(AllValuesData,'order')\r\n const ArcFiltered = ArcSorted.filter(x=> {return x.distribution && x.distribution !=='null'})\r\n\r\n const BarValues = ArcFiltered.map(x=>{return (x.value) })\r\n const Labels = ArcFiltered.map((s,i)=> {return ((ValueLabelJSON && ValueLabelJSON[s.distribution]) ? ValueLabelJSON[s.distribution] : s.distribution) + \" (\" + parseFloat((s.value / recordCount) * 100).toFixed(0)+\"%)\" || s.distribution})\r\n\r\n const data = {\r\n labels:Labels,\r\n datasets: [\r\n {\r\n \r\n data: BarValues,\r\n backgroundColor: ArcFiltered.map(x=>{return GetColor(Color,x) + \"AA\"}),\r\n barPercentage:0.2,\r\n },\r\n ],\r\n }\r\n const options = {\r\n responsive: true,\r\n maintainAspectRatio: false,\r\n indexAxis:'y',\r\n scales: {\r\n y: {\r\n beginAtZero: true,\r\n grid: {\r\n display: false,\r\n drawBorder:false\r\n },\r\n ticks: {\r\n display: true\r\n }\r\n }, \r\n x: {\r\n grid: {\r\n display: false,\r\n drawBorder:false\r\n },\r\n ticks: {\r\n display: false\r\n }\r\n }\r\n },\r\n plugins: {\r\n legend: {\r\n display: false\r\n },\r\n \r\n\r\n }\r\n\r\n }\r\n\r\n return (\r\n \r\n \r\n {Label} \r\n \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default ArcListDistibution","\r\nimport React, { useState, useEffect } from \"react\";\r\n\r\nimport { useSelector, useDispatch } from 'react-redux'\r\nimport _, { size } from 'lodash';\r\nimport { Bar, Doughnut, Pie, Scatter } from 'react-chartjs-2';\r\nimport { Grid, Typography } from \"@mui/material\";\r\nimport { GetColor } from \"./RefColorFunctions\";\r\nimport { GetTransform } from \"./RefTransformationFunctions\";\r\n\r\n\r\nconst ArcBarHorizontalSingle = (props) => {\r\n const safeParse = (str)=>{\r\n try{\r\n JSON.parse(str)\r\n return true\r\n }catch{\r\n return false;\r\n }\r\n }\r\n const ComponentProperties = props.ComponentProperties\r\n const { KeyToUse, MaxValue, Label, Color, Proportion, ValueLabels,Transform } = ComponentProperties\r\n const DataReportData = props.DataReportData\r\n const ValueArray = DataReportData.map(x=>{return {[KeyToUse]: Transform ? GetTransform(Transform,x[KeyToUse]):x[KeyToUse]}})\r\n \r\n const ValueLabelJSON = safeParse(ValueLabels) ? JSON.parse(ValueLabels):{}\r\n\r\n const ArcSumOfValues =\r\n _.chain(ValueArray)\r\n .groupBy(KeyToUse)\r\n .map((value, key) => ({ distribution: key, value: (Proportion ? (value.length / ValueArray.length * 100) : value.length) }))\r\n .value()\r\n\r\n const BarValues = ArcSumOfValues.map(x=>{return Number(parseFloat((x.value)).toFixed(2))})\r\n\r\n const Labels = ArcSumOfValues.map((s,i)=> {return ((ValueLabelJSON && ValueLabelJSON[s.distribution]) ? ValueLabelJSON[s.distribution] : s.distribution +\" (\" + (Proportion ? s.value : Number(parseFloat((s.value/ValueArray.length * 100)).toFixed(0))) + \"%)\") || 'Unknown'})\r\n\r\n const data = {\r\n labels:[\"\"]\r\n ,datasets: BarValues.map((bv,i)=> {return {label:Labels[i],data:[Number(bv)],barThickness: 8, backgroundColor: GetColor('RYGG VALUE GRADE', i===0? 1:2)}})\r\n }\r\n\r\n const options = {\r\n responsive: true,\r\n maintainAspectRatio: false,\r\n indexAxis:'y',\r\n scales: {\r\n y: {\r\n stacked:true,\r\n max:Proportion ? 100 :ValueArray.length,\r\n beginAtZero: true,\r\n grid: {\r\n display: false,\r\n drawBorder:false\r\n },\r\n ticks: {\r\n display: true\r\n }\r\n }, \r\n x: {\r\n stacked:true,\r\n max:Proportion ? 100 : ValueArray.length,\r\n grid: {\r\n display: false,\r\n drawBorder:false\r\n },\r\n ticks: {\r\n display: false\r\n }\r\n }\r\n },\r\n plugins: {\r\n legend: {\r\n display: true,\r\n position:\"bottom\"\r\n },\r\n \r\n\r\n }\r\n\r\n }\r\n\r\n return (\r\n \r\n \r\n {Label} \r\n \r\n \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default ArcBarHorizontalSingle","\r\nimport React, { useState, useEffect } from \"react\";\r\n\r\nimport { useSelector, useDispatch } from 'react-redux'\r\nimport _, { size } from 'lodash';\r\nimport { Bar, Doughnut, Pie, Scatter } from 'react-chartjs-2';\r\nimport { Box, Divider, Grid, Typography } from \"@mui/material\";\r\nimport { GetColor } from \"./RefColorFunctions\";\r\n\r\nconst ArcBanner = (props) => {\r\n // ChartJS.register(ArcElement, Tooltip, Legend);\r\n const ComponentProperties = props.ComponentProperties\r\n const { KeyToUse, MaxValue, Label, Color, Proportion } = ComponentProperties\r\n const DataReportData = props.DataReportData\r\n // KeyToUse will be an array\r\n\r\n return (\r\n \r\n \r\n \r\n {Label} \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default ArcBanner","\r\nimport React, { useState, useEffect } from \"react\";\r\n\r\nimport { useSelector, useDispatch } from 'react-redux'\r\nimport _, { size } from 'lodash';\r\n\r\nimport {Chart as ChartJS,TimeScale,LinearScale,PointElement,LineElement,Title,Tooltip,Legend} from \"chart.js\";\r\nimport { Chart } from \"react-chartjs-2\";\r\nimport 'chartjs-adapter-moment';\r\nimport { Bar, Doughnut, Line, Pie, Scatter } from 'react-chartjs-2';\r\n \r\n\r\nimport { Grid, Skeleton, Typography } from \"@mui/material\";\r\nimport { GetColor } from \"./RefColorFunctions\";\r\nimport moment from 'moment';\r\n\r\n\r\nChartJS.register(TimeScale,LinearScale,PointElement,LineElement,Title,Tooltip,Legend );\r\n\r\nconst ArcLineSingle = (props) => {\r\n // ChartJS.register(ArcElement, Tooltip, Legend);\r\n const ComponentProperties = props.ComponentProperties\r\n const { KeyToUse, XAxis, MaxValue, Label, Color, Proportion } = ComponentProperties\r\n const DataReportData = props.DataReportData\r\n\r\n const ValueArray = DataReportData.map(x => { return x[KeyToUse] })\r\n // KeyToUse will be an array\r\n \r\n const preprocess = ValueArray.filter(flt => flt)\r\n\r\n const converted = preprocess.map(dr => { return { x: moment(dr).format('YYYY-MM-DD') } })\r\n\r\n const minDate = _.minBy(converted, 'x')\r\n const ArcSumOfValues =\r\n _.chain(converted)\r\n .groupBy('x')\r\n .map((value, key) => ({ x: new Date(key), y: value.length }))\r\n .value()\r\n\r\n\r\n const data = {\r\n \r\n datasets: [{ data: _.sortBy(ArcSumOfValues, ['x']), borderColor: GetColor('PRIMARY',2), }]\r\n }\r\n // labels:ArcSumOfValues.map(r=> {return r.y}),\r\n // datasets: [{ data: ArcSumOfValues.map(r=> {return r.x}) }] \r\n const options = {\r\n responsive: true,\r\n maintainAspectRatio: false,\r\n\r\n scales: {\r\n y: {\r\n // grid: {\r\n // display: false,\r\n // drawBorder:false\r\n // },\r\n ticks: {\r\n display: true\r\n }\r\n },\r\n x: {\r\n type: \"time\",\r\n time: {\r\n unit:\"day\"\r\n },\r\n // grid: {\r\n // display: false,\r\n // drawBorder:false\r\n // },\r\n ticks: {\r\n display: true\r\n }\r\n }\r\n },\r\n plugins: {\r\n legend: {\r\n display: false,\r\n position: \"bottom\"\r\n },\r\n\r\n\r\n }\r\n\r\n }\r\n if (DataReportData && DataReportData.length > 0) {\r\n\r\n return (\r\n \r\n \r\n {Label} \r\n \r\n \r\n \r\n \r\n )\r\n }\r\n return (\r\n \r\n {obj.label} \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {Math.floor(obj.proportion)}% \r\n \r\n \r\n )\r\n }\r\n\r\n const ThisData = GenerateData()\r\n return (\r\n \r\n \r\n {Label} \r\n \r\n \r\n \r\n {\r\n ThisData.map(x => {\r\n return (\r\n \r\n \r\n )\r\n })\r\n }\r\n \r\n \r\n\r\n \r\n )\r\n}\r\n\r\nexport default ArcListMultiPositive","\r\nimport React, { useState, useEffect } from \"react\";\r\n\r\nimport { useSelector, useDispatch } from 'react-redux'\r\nimport _, { size } from 'lodash';\r\nimport { Bar, Doughnut, Pie, Scatter } from 'react-chartjs-2';\r\nimport { Grid, Typography } from \"@mui/material\";\r\nimport { GetColor } from \"./RefColorFunctions\";\r\n\r\nconst ArcPieProportion = (props) => {\r\n // ChartJS.register(ArcElement, Tooltip, Legend);\r\n const DataReportData = props.DataReportData\r\n\r\n const ComponentProperties = props.ComponentProperties\r\n const { KeyToUse, MaxValue, Label } = ComponentProperties\r\n\r\n\r\n const labelCenter = {\r\n id: \"labelCenter\",\r\n beforeDraw: (chart, args, options) => {\r\n if (!Array.isArray(options.labels)) {\r\n return console.error('\"options.lables\" must be array', options.lables);\r\n }\r\n\r\n const {\r\n ctx,\r\n chartArea: { width, height }\r\n } = chart;\r\n const context = ctx.canvas.getContext(\"2d\");\r\n context.save();\r\n\r\n const labels = options.labels.slice();\r\n const totalFontSize = labels.reduce((x, y, index) => {\r\n let prevSize = x[index - 1] || 0;\r\n x.push(prevSize + y.font.size);\r\n return x;\r\n }, []);\r\n labels.forEach((label, index) => {\r\n let textPosition = totalFontSize[index] - label.font.size + 10;\r\n const values = {\r\n text: label.text || \"?\",\r\n font: {\r\n size: label.font.size || 30,\r\n family: label.font.family || \"sans-serif\",\r\n color: label.font.color || \"black\",\r\n style: label.font.style || \"normal\",\r\n unit: label.font.unit || \"px\"\r\n }\r\n };\r\n switch (values.font.unit) {\r\n case \"em\":\r\n values.font.size = label.font.size * 0.05;\r\n textPosition *= 0.8;\r\n break;\r\n default:\r\n break;\r\n }\r\n\r\n context.font = `${values.font.style} ${values.font.size}${values.font.unit} ${values.font.family}`;\r\n context.textAlign = \"center\";\r\n context.fillStyle = values.font.color;\r\n context.fillText(values.text, width / 2, height / 2 + textPosition);\r\n });\r\n context.restore();\r\n }\r\n };\r\n\r\n const ArcSumOfValues =\r\n _.chain(DataReportData)\r\n .groupBy(KeyToUse)\r\n .map((value, key) => ({ distribution: key, value: value.length / DataReportData.length }))\r\n .value()\r\n\r\n\r\n const Colors = GetColor('RAINBOW SET',2)\r\n \r\n const data = {\r\n datasets: [\r\n {\r\n label: ArcSumOfValues.map(x => { return x.distribution }),\r\n data: ArcSumOfValues.map(x => { return x.value * 100 }),\r\n backgroundColor: Colors,\r\n borderColor: Colors,\r\n borderWidth: 0,\r\n },\r\n ],\r\n }\r\n const options = {\r\n responsive: true, \r\n maintainAspectRatio: false,\r\n animation: {\r\n animateRotate: true,\r\n render: false,\r\n },\r\n // events: [],\r\n tooltips: {\r\n enabled: true\r\n },\r\n plugins: {\r\n legend: {\r\n display: true,\r\n position: \"bottom\"\r\n },\r\n \r\n\r\n }\r\n }\r\n \r\n return (\r\n \r\n \r\n {Label} \r\n \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default ArcPieProportion","\r\nimport React, { useState, useEffect } from \"react\";\r\n\r\nimport { useSelector, useDispatch } from 'react-redux'\r\nimport _, { size } from 'lodash';\r\nimport { Bar, Doughnut, Pie, Scatter } from 'react-chartjs-2';\r\nimport { Box, Grid, Typography } from \"@mui/material\";\r\nimport { GetColor } from \"./RefColorFunctions\";\r\nimport { GetTransform } from \"./RefTransformationFunctions\";\r\n\r\n\r\nconst ArcListDistibution2 = (props) => {\r\n const safeParse = (str)=>{\r\n try{\r\n JSON.parse(str)\r\n return true\r\n }catch{\r\n return false;\r\n }\r\n }\r\n const ComponentProperties = props.ComponentProperties\r\n const { KeyToUse, Label, Color,ValueOrder,ValueLabels,Transform, ShowAvailable } = ComponentProperties\r\n const DataReportData = props.DataReportData\r\n const ValueOrderArray = (ValueOrder && ValueOrder.length>0 && ValueOrder.split('|')) || []\r\n const ValueLabelJSON = safeParse(ValueLabels) ? JSON.parse(ValueLabels):{}\r\n const recordCount = DataReportData.length\r\n const ValueArray = DataReportData.map(x=>{return {[KeyToUse]: Transform ? GetTransform(Transform,x[KeyToUse]):x[KeyToUse]}})\r\n\r\n\r\n const ArcSumOfValues =\r\n _.chain(ValueArray)\r\n .groupBy(KeyToUse)\r\n .map((value, key) => (\r\n { \r\n distribution: key\r\n , value: value.length\r\n , percentage: parseFloat((value.length / recordCount) * 100).toFixed(2)\r\n , order: ValueOrderArray.indexOf(key) >=0 ? ValueOrderArray.indexOf(key) : 99 \r\n }))\r\n .value()\r\n \r\n const AllValues = Object.keys(ValueLabelJSON)\r\n const AllValuesData = AllValues.map((x,i)=>{ \r\n let HasValues = ArcSumOfValues.filter(y=>y.distribution==x) \r\n return (HasValues && HasValues.length>0)? HasValues[0] : {distribution:x, value:0, percentage:0, order: ValueOrderArray.indexOf(x) >=0 ? ValueOrderArray.indexOf(x) : 99 }\r\n })\r\n const ArcSorted = ShowAvailable ? _.sortBy(ArcSumOfValues,'order') : _.sortBy(AllValuesData,'order')\r\n //const ArcSorted = _.sortBy(ArcSumOfValues,'order')\r\n const ArcFiltered = ArcSorted.filter(x=> {return x.distribution && ((ShowAvailable && x.distribution !=='null') || !ShowAvailable) })\r\n\r\n const BarComponent = ({ obj }) => {\r\n return (\r\n \r\n \r\n {(ValueLabelJSON && ValueLabelJSON[String(obj.distribution)]) ? ValueLabelJSON[String(obj.distribution)] : obj.distribution} \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {Math.floor(obj.percentage)}% \r\n \r\n \r\n )\r\n }\r\n\r\n\r\n return (\r\n \r\n \r\n {Label} \r\n \r\n \r\n \r\n {\r\n ArcFiltered.map(x => {\r\n\r\n return (\r\n \r\n \r\n )\r\n }\r\n )\r\n }\r\n \r\n \r\n\r\n \r\n )\r\n}\r\n\r\nexport default ArcListDistibution2","\r\nimport React, { useState, useEffect } from \"react\";\r\n\r\nimport { useSelector, useDispatch } from 'react-redux'\r\nimport _, { size } from 'lodash';\r\nimport { Bar, Doughnut, Pie, Scatter } from 'react-chartjs-2';\r\nimport { Grid, Typography } from \"@mui/material\";\r\nimport { GetColor } from \"./RefColorFunctions\";\r\n\r\nconst ArcScatter2D = (props) => {\r\n // ChartJS.register(ArcElement, Tooltip, Legend);\r\n const DataReportData = props.DataReportData\r\n\r\n const ComponentProperties = props.ComponentProperties\r\n const { KeyToUse, MaxValue, Label } = ComponentProperties\r\n const KeyToUseArray = KeyToUse ? KeyToUse.split('|') : []\r\n \r\n\r\n \r\n const data = {\r\n datasets: [\r\n {\r\n label: [KeyToUseArray],\r\n data: DataReportData.map(x=>{ return {x: x[KeyToUseArray[0]], y: x[KeyToUseArray[1]]}}),\r\n backgroundColor: [\r\n GetColor(\"PRIMARY\",2)\r\n ],\r\n borderColor: [\r\n 'rgba(255, 99, 132, 0)',\r\n 'rgba(54, 162, 235, 0)',\r\n ],\r\n borderWidth: 0,\r\n },\r\n ],\r\n }\r\n const options = {\r\n responsive: true, \r\n maintainAspectRatio: false,\r\n animation: false,\r\n // events: [],\r\n tooltips: {\r\n enabled: true\r\n },\r\n plugins: {\r\n legend:{\r\n display:true,\r\n position:'bottom'\r\n }\r\n \r\n\r\n }\r\n }\r\n\r\n \r\n return (\r\n \r\n \r\n {Label} \r\n \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default ArcScatter2D","\r\nimport React, { useState, useEffect } from \"react\";\r\n\r\nimport { useSelector, useDispatch } from 'react-redux'\r\nimport _, { size } from 'lodash';\r\nimport { Bar, Doughnut, Pie, Scatter } from 'react-chartjs-2';\r\nimport { colors, Grid, Typography } from \"@mui/material\";\r\nimport { GetColor } from \"./RefColorFunctions\";\r\nimport { GetTransform } from \"./RefTransformationFunctions\";\r\n\r\n\r\nconst ArcBarHorizontalProportion = (props) => {\r\n const safeParse = (str) => {\r\n try {\r\n JSON.parse(str)\r\n return true\r\n } catch {\r\n return false;\r\n }\r\n }\r\n const ComponentProperties = props.ComponentProperties\r\n const { KeyToUse, MaxValue, Label, Color, Proportion, DataLabels, ValueOrder, ValueLabels, Transform } = ComponentProperties\r\n const DataReportData = props.DataReportData\r\n const KeyToUseArray = KeyToUse ? KeyToUse.split('|') : []\r\n const DataLabelArray = DataLabels ? DataLabels.split('|') : []\r\n\r\n const ValueLabelJSON = safeParse(ValueLabels) ? JSON.parse(ValueLabels) : {}\r\n const ValueOrderArray = (ValueOrder && ValueOrder.length > 0 && ValueOrder.split('|')) || []\r\n const Colors = GetColor(\"RAINBOW SET\", 0)\r\n\r\n //for each column defined\r\n const ValueArrayFinal = KeyToUseArray.map((ky, i) => {\r\n // get array of values to use\r\n const ValueArray = DataReportData.map(x => { return { [ky]: Transform ? GetTransform(Transform, x[ky]) : x[ky] } })\r\n // chart js requires a specific setup.\r\n // convert into {key: \"COVID_SHOT\", values:[{distribution: \"YES\", value:700, percentage:70},{distribution: \"NO\", value:300, percentage:30}]}\r\n const ArcSumOfValues =\r\n _.chain(ValueArray)\r\n .groupBy(ky)\r\n .map((value, key) => (\r\n {\r\n distribution: key\r\n , value: value.length\r\n , percentage: Number(parseFloat((value.length / ValueArray.length * 100)).toFixed(2))\r\n , order: ValueOrderArray.indexOf(key) >= 0 ? ValueOrderArray.indexOf(key) : 99\r\n }))\r\n .value()\r\n const ArcSorted = _.sortBy(ArcSumOfValues, 'order')\r\n\r\n const Labels = ArcSorted.map((s, i) => { return (ValueLabelJSON && ValueLabelJSON[s.distribution]) ? ValueLabelJSON[s.distribution] : s.distribution + \" (\" + s.percentage + \"%)\" })\r\n\r\n // convert into [{data:{labels:[\"COVID_SHOT\"], datasets:[{label:\"YES\", data:[70]},{label:\"NO\", data:[30]}]},options:{...}}]\r\n const data = {\r\n labels: [DataLabelArray[i]]\r\n , datasets: ArcSorted.map((x, i) => {\r\n return {\r\n label: Labels[i]\r\n , data: [Number(parseFloat((x.value)).toFixed(2))]\r\n , barThickness: 8\r\n , backgroundColor: Color ? GetColor(Color, Number(x.distribution)) : Colors[i]\r\n }\r\n })\r\n }\r\n\r\n\r\n const options = {\r\n responsive: true,\r\n maintainAspectRatio: false,\r\n indexAxis: 'y',\r\n scales: {\r\n y: {\r\n stacked: true,\r\n max: Proportion ? 100 : ValueArray.length,\r\n beginAtZero: true,\r\n grid: {\r\n display: false,\r\n drawBorder: false\r\n },\r\n ticks: {\r\n display: true\r\n }\r\n },\r\n x: {\r\n stacked: true,\r\n max: Proportion ? 100 : ValueArray.length,\r\n grid: {\r\n display: false,\r\n drawBorder: false\r\n },\r\n ticks: {\r\n display: false\r\n }\r\n }\r\n },\r\n plugins: {\r\n legend: {\r\n display: false,\r\n position: \"bottom\"\r\n },\r\n\r\n\r\n }\r\n\r\n }\r\n return { data: data, options: options }\r\n })\r\n\r\n\r\n\r\n\r\n\r\n return (\r\n \r\n {Label && (\r\n\r\n \r\n {Label} \r\n \r\n )}\r\n \r\n \r\n {ValueArrayFinal.map(grph => {\r\n return (\r\n \r\n \r\n )\r\n })}\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default ArcBarHorizontalProportion","\r\nimport React, { useState, useEffect } from \"react\";\r\n\r\nimport { useSelector, useDispatch } from 'react-redux'\r\nimport _, { size } from 'lodash';\r\nimport { Bar, Doughnut, Pie, Scatter } from 'react-chartjs-2';\r\nimport { Grid, Typography } from \"@mui/material\";\r\nimport { GetColor } from \"./RefColorFunctions\";\r\nimport { GetTransform } from \"./RefTransformationFunctions\";\r\n\r\n\r\nconst ArcBarVerticalProportion = (props) => {\r\n const safeParse = (str)=>{\r\n try{\r\n JSON.parse(str)\r\n return true\r\n }catch{\r\n return false;\r\n }\r\n }\r\n const ComponentProperties = props.ComponentProperties\r\n const { KeyToUse, MaxValue, Label, Color, Proportion, DataLabels,ValueLabels, ValueOrder, Transform } = ComponentProperties\r\n const DataReportData = props.DataReportData\r\n const KeyToUseArray = KeyToUse ? KeyToUse.split('|') : []\r\n const DataLabelArray = DataLabels ? DataLabels.split('|') : [] \r\n const ValueOrderArray = (ValueOrder && ValueOrder.length>0 && ValueOrder.split('|')) || [] \r\n const ValueLabelJSON = safeParse(ValueLabels) ? JSON.parse(ValueLabels) : {}\r\n const Colors = GetColor(\"RAINBOW ARRAY\", 0)\r\n\r\n\r\n const options = {\r\n responsive: true,\r\n maintainAspectRatio: false,\r\n scales: {\r\n y: {\r\n beginAtZero: true,\r\n stacked: true,\r\n max: Proportion ? 100 : DataReportData.length,\r\n grid: {\r\n display: true\r\n , drawBorder: true //turns off border lines\r\n\r\n },\r\n ticks: {\r\n stepSize: Proportion ? 20 : Number(DataReportData.length / 10).toFixed(0)\r\n , display: true\r\n }\r\n },\r\n x: {\r\n grid: {\r\n display: true\r\n , drawBorder: true //turns off border lines\r\n\r\n }\r\n , ticks: {\r\n display: true\r\n }\r\n , stacked: true\r\n }\r\n },\r\n \r\n plugins: {\r\n legend: {\r\n display: false,\r\n position: \"bottom\"\r\n },\r\n\r\n\r\n }\r\n\r\n }\r\n //for each column defined\r\n const ValueArrayFinal = KeyToUseArray.map((ky, i) => {\r\n // get array of values to use\r\n \r\n const ValueArray = DataReportData.map(x => { return { [ky]: Transform ? GetTransform(Transform,x[ky]):x[ky] } })\r\n // chart js requires a specific setup.\r\n // convert into {key: \"COVID_SHOT\", values:[{distribution: \"YES\", value:700, percentage:70},{distribution: \"NO\", value:300, percentage:30}]}\r\n\r\n const ArcSumOfValues =\r\n _.chain(ValueArray)\r\n .groupBy(ky)\r\n .map((value, key) => (\r\n {\r\n distribution: key\r\n , value: value.length\r\n , percentage: Number(parseFloat((value.length / ValueArray.length * 100)).toFixed(2))\r\n }))\r\n .value()\r\n const ArcSorted = _.sortBy(ArcSumOfValues,'order')\r\n const BarValues = ArcSorted.map(x => { return Number(parseFloat((x.value)).toFixed(2)) })\r\n\r\n const Labels = ArcSorted.map((s, i) => { return s.distribution + \" (\" + s.percentage + \"%)\" })\r\n\r\n\r\n const data = {\r\n labels: [DataLabelArray[i]]\r\n , datasets: BarValues.map((bv, i) => { return { label: Labels[i], data: [Number(bv)], barThickness: 8, backgroundColor: GetColor(Color, ArcSorted[i].distribution) } })\r\n }\r\n\r\n\r\n return { data: data, options: options, grouped: ArcSumOfValues, label: ky }\r\n })\r\n\r\n const ValueArray_Array = ValueOrderArray.map(doa=>{\r\n const itemArray = ValueArrayFinal.map(x => {\r\n const tempfilter = x.grouped.filter(y => y.distribution === doa)\r\n return tempfilter.length>0 ? (Proportion ? tempfilter[0].percentage : tempfilter[0].value) : 0\r\n })\r\n return {label: (ValueLabelJSON && ValueLabelJSON[doa]) ? ValueLabelJSON[doa] : doa ,data:itemArray, backgroundColor: [GetColor(Color, doa)]}\r\n })\r\n\r\n\r\n const data = {\r\n labels: DataLabelArray,\r\n datasets: ValueArray_Array,\r\n }\r\n return (\r\n \r\n \r\n {Label} \r\n \r\n \r\n\r\n \r\n \r\n )\r\n}\r\n\r\nexport default ArcBarVerticalProportion","\r\nimport React, { useState, useEffect } from \"react\";\r\n\r\nimport { useSelector, useDispatch } from 'react-redux'\r\nimport _, { size } from 'lodash';\r\nimport { Bar, Doughnut, Pie, Scatter } from 'react-chartjs-2';\r\nimport { Box, Divider, Grid, Typography } from \"@mui/material\";\r\nimport { GetColor } from \"./RefColorFunctions\";\r\n\r\nconst ArcBannerWithScore = (props) => {\r\n // ChartJS.register(ArcElement, Tooltip, Legend);\r\n const ComponentProperties = props.ComponentProperties\r\n const { KeyToUse, MaxValue, Label, Proportion } = ComponentProperties\r\n const DataReportData = props.DataReportData\r\n // KeyToUse will be an array\r\n const ArcSumOfValues = _.sumBy(DataReportData, item => Number(item[KeyToUse]))\r\n\r\n const ArcFinalValue = Math.trunc(ArcSumOfValues / (DataReportData && DataReportData.length || 1))\r\n\r\n const labelCenter = {\r\n id: \"labelCenter\",\r\n beforeDraw: (chart, args, options) => {\r\n if (!Array.isArray(options.labels)) {\r\n return console.error('\"options.lables\" must be array', options.lables);\r\n }\r\n\r\n const {\r\n ctx,\r\n chartArea: { width, height }\r\n } = chart;\r\n const context = ctx.canvas.getContext(\"2d\");\r\n context.save();\r\n\r\n const labels = options.labels.slice();\r\n const totalFontSize = labels.reduce((x, y, index) => {\r\n let prevSize = x[index - 1] || 0;\r\n x.push(prevSize + y.font.size);\r\n return x;\r\n }, []);\r\n labels.forEach((label, index) => {\r\n let textPosition = totalFontSize[index] - label.font.size + 10;\r\n const values = {\r\n text: label.text || \"?\",\r\n font: {\r\n size: label.font.size || 30,\r\n family: label.font.family || \"sans-serif\",\r\n color: label.font.color || \"black\",\r\n style: label.font.style || \"normal\",\r\n unit: label.font.unit || \"px\"\r\n }\r\n };\r\n switch (values.font.unit) {\r\n case \"em\":\r\n values.font.size = label.font.size * 0.05;\r\n textPosition *= 0.9;\r\n break;\r\n default:\r\n break;\r\n }\r\n\r\n context.font = `${values.font.style} ${values.font.size}${values.font.unit} ${values.font.family}`;\r\n context.textAlign = \"center\";\r\n context.fillStyle = values.font.color;\r\n context.fillText(values.text, width / 2, height / 2 + textPosition);\r\n });\r\n context.restore();\r\n }\r\n };\r\n\r\n const graphcolors = ['#c0c0c0', '#4eb748', '#E7C61E', '#E6323A']\r\n const GetColor = (score) => {\r\n\r\n const vg = parseInt(score <= 39 ? 3 : score <= 69 ? 2 : score <= 100 ? 1 : 0)\r\n return graphcolors[vg]\r\n }\r\n\r\n const Color = GetColor(ArcFinalValue)\r\n const data = {\r\n datasets: [\r\n {\r\n\r\n data: [ArcFinalValue, MaxValue - ArcFinalValue],\r\n backgroundColor: [\r\n Color,\r\n Color + \"40\"\r\n ],\r\n borderColor: [\r\n 'rgba(255, 99, 132, 0)',\r\n 'rgba(54, 162, 235, 0)',\r\n ],\r\n borderWidth: 0,\r\n },\r\n ],\r\n }\r\n const options = {\r\n responsive: false,\r\n cutout: '70%',\r\n maintainAspectRatio: false,\r\n animation: {\r\n animateRotate: true,\r\n render: false,\r\n },\r\n events: [],\r\n tooltips: {\r\n enabled: true\r\n },\r\n plugins: {\r\n legend: {\r\n display: false\r\n },\r\n labelCenter: {\r\n labels: [\r\n {\r\n text: ArcFinalValue,\r\n font: {\r\n size: 1.5,\r\n unit: \"rem\",\r\n color: 'black',\r\n style: \"bold\"\r\n }\r\n }\r\n ]\r\n }\r\n\r\n }\r\n\r\n }\r\n\r\n const plugins = [labelCenter]\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n {Label} \r\n \r\n \r\n )\r\n}\r\n\r\nexport default ArcBannerWithScore","\r\nimport React, { useState, useEffect } from \"react\";\r\n\r\nimport { useSelector, useDispatch } from 'react-redux'\r\nimport _, { size } from 'lodash';\r\nimport { Bar, Doughnut, Pie, Scatter } from 'react-chartjs-2';\r\nimport { Box, Divider, Grid, Typography } from \"@mui/material\";\r\nimport { GetColor } from \"./RefColorFunctions\";\r\nimport RectangleIcon from \"@mui/icons-material/Rectangle\";\r\n\r\nconst ArcLegendRYGG = (props) => {\r\n // ChartJS.register(ArcElement, Tooltip, Legend);\r\n const ComponentProperties = props.ComponentProperties\r\n const { KeyToUse, MaxValue, Label, Color, Proportion, DataLabels } = ComponentProperties\r\n const DataLabelArray = DataLabels ? DataLabels.split('|') : []\r\n\r\n // KeyToUse will be an array\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {DataLabelArray[0]} \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {DataLabelArray[1]} \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {DataLabelArray[2]} \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {DataLabelArray[3]} \r\n \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default ArcLegendRYGG","import React, { useState, useEffect } from \"react\";\r\n\r\nimport { useSelector, useDispatch } from 'react-redux'\r\nimport _, { size } from 'lodash';\r\nimport PropTypes from \"prop-types\";\r\n// @mui material components\r\nimport { Autocomplete, Dialog, DialogContent, Grid, MenuItem, Paper, TextField, Typography, Box, Checkbox, FormControl, FormGroup, FormLabel, FormControlLabel } from \"@mui/material\";\r\nimport 'chart.js/auto';\r\n\r\nimport ArcDoughnutAverage from \"./dynamic/ArcDoughnutAverage\";\r\nimport ArcDoughnutProportion from \"./dynamic/ArcDoughnutProportion\";\r\nimport ArcHistogramStep from \"./dynamic/ArcHistogramStep\";\r\nimport ArcListDistibution from \"./dynamic/ArcListDistibution\";\r\nimport ArcBarHorizontalSingle from \"./dynamic/ArcBarHorizontalSingle\";\r\nimport ArcBanner from \"./dynamic/ArcBanner\";\r\nimport ArcLineSingle from \"./dynamic/ArcLineSingle\";\r\nimport ArcListMultiPositive from \"./dynamic/ArcListMultiPositive\";\r\nimport ArcPieProportion from \"./dynamic/ArcPieProportion\";\r\nimport ArcListDistibution2 from \"./dynamic/ArcListDistribution2\";\r\nimport ArcScatter2D from \"./dynamic/ArcScatter2D\";\r\nimport ArcBarHorizontalProportion from \"./dynamic/ArcBarHorizontalProportion\";\r\nimport ArcBarVerticalProportion from \"./dynamic/ArcBarVerticalProportion\";\r\nimport ArcBannerWithScore from \"./dynamic/ArcBannerWithScore\";\r\nimport ArcLegendRYGG from \"./dynamic/ArcLegendRYGG\";\r\n\r\n\r\n\r\nconst DynamicComponentItem = (props) => {\r\n const {ReportComponentJSON, DataReportData} = props\r\n\r\n const DynamicComponentTranslation = {\r\n \r\n \"ARC DOUGHNUT AVERAGE\":ArcDoughnutAverage,\r\n \"ARC DOUGHNUT PROPORTION\":ArcDoughnutProportion,\r\n \"ARC HISTOGRAM STEP\":ArcHistogramStep,\r\n \"ARC LIST DISTRIBUTION\":ArcListDistibution,\r\n \"ARC BAR HORIZONTAL SINGLE\":ArcBarHorizontalSingle,\r\n \"ARC BANNER\": ArcBanner,\r\n \"ARC BANNER WITH SCORE\":ArcBannerWithScore ,\r\n \"ARC LINE SINGLE\": ArcLineSingle,\r\n \"ARC LIST MULTI POSITIVE\": ArcListMultiPositive,\r\n \"ARC PIE DISTRIBUTION\": ArcPieProportion,\r\n \"ARC LIST DISTRIBUTION 2\": ArcListDistibution2,\r\n \"ARC SCATTER 2D\": ArcScatter2D,\r\n \"ARC BAR HORIZONTAL PROPORTION\": ArcBarHorizontalProportion,\r\n \"ARC BAR VERTICAL PROPORTION\": ArcBarVerticalProportion,\r\n \"ARC LEGEND RYGG\": ArcLegendRYGG,\r\n }\r\n\r\n\r\n if (typeof DynamicComponentTranslation[props.ReportComponentJSON.Component] !== \"undefined\") {\r\n \r\n return React.createElement(DynamicComponentTranslation[props.ReportComponentJSON.Component]\r\n , {\r\n key: props.index,\r\n ComponentProperties: props.ReportComponentJSON.ComponentProperties,\r\n DataReportData: props.DataReportData,\r\n otherprops:props,\r\n elevationdisabled: props.elevationdisabled ? true : false,\r\n PrintView: props.PrintView,\r\n }\r\n )\r\n }\r\n\r\n return React.createElement(\r\n () => The component {props.ReportComponentJSON.Component} doesnt exist yet
,\r\n { key: props.index }\r\n )\r\n}\r\n\r\nexport default DynamicComponentItem","import React, { useState, useEffect, useRef } from \"react\";\r\nimport { useNavigate, useLocation, createSearchParams } from 'react-router-dom';\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Paper, Grid, Dialog, DialogTitle, Typography, Button, DialogContent } from \"@mui/material\";\r\n\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\n\r\nimport { selectReportCriteriaEntities } from \"../../../reducers/admincenter_reportcriteria\";\r\nimport ResponsiveRectangle from \"../skeletons/ResponsiveRectangle\";\r\nimport { selectUIReportEntities } from \"../../../reducers/admincenter_uireport\";\r\nimport DynamicComponentItem from \"../ArcDynamicComponentItem\";\r\n\r\n\r\nimport { selectGlobalSettingEntities } from \"../../../reducers/reference_settings\";\r\nimport ReportAggregateFilterControl from \"./ReportAggregateFilterControl\";\r\n\r\n\r\nconst ReportAggregateReport = () => {\r\n\r\n const dispatch = useDispatch()\r\n\r\n const DataReport = useSelector(state => state.datareports.entities)\r\n const settings = useSelector(state => selectGlobalSettingEntities(state))\r\n const MinAggRecords = (settings?.organization && settings?.organization['AGGREGATE REPORT MINIMUM PARTICIPANTS']) ? settings.organization['AGGREGATE REPORT MINIMUM PARTICIPANTS'] : 50\r\n const DataReportStatus = useSelector(state => state.datareports.status)\r\n const UIReportStatus = useSelector(state => state.uireports.status)\r\n const ReportCriteria = useSelector(state => selectReportCriteriaEntities(state))\r\n const [reportFilters, setReportFilters] = useState([])\r\n\r\n const ReportJSON = useSelector(state => selectUIReportEntities(state))\r\n\r\n const FilterDataFunction = (x) => {\r\n return true\r\n }\r\n const FilteredData = DataReport.filter((x, i) => FilterDataFunction(x))\r\n //const PreventLeak = (FilteredData.length > MinAggRecords) ? FilteredData : []\r\n const PreventLeak = FilteredData \r\n const cannotReadOnlyNonSense = [...ReportJSON]\r\n const FilteredSections = cannotReadOnlyNonSense.filter(x => { return x.Visible === '1' || x.Visible === 1 })\r\n const OrderedSections = FilteredSections.sort(function (a, b) { return parseInt(a.Order) - parseInt(b.Order) })\r\n\r\n\r\n\r\n /*if (!currentUser) {\r\n return \r\n \r\n {(UIReportStatus === 'success' && DataReportStatus === 'success') ? (\r\n\r\n OrderedSections.map((x, i) => {\r\n\r\n return (\r\n \r\n \r\n )\r\n })\r\n\r\n ) : (UIReportStatus === 'loading' || DataReportStatus === 'loading') ? (\r\n \r\n\r\n \r\n ) : (\r\n <>\r\n )\r\n }\r\n \r\n )\r\n }\r\n\r\n return (\r\n\r\n \r\n Filter does not meet minimum participant aggregation standards. \r\n \r\n\r\n )\r\n\r\n\r\n\r\n};\r\n\r\nexport default ReportAggregateReport;\r\n\r\n/* \r\n \r\n HOME\r\n \r\n Logout \r\n \r\n */","import React, { useState, useEffect, useRef } from \"react\";\r\nimport { useNavigate, useLocation, createSearchParams } from 'react-router-dom';\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Paper, Grid, Dialog, DialogTitle, Typography, Button, DialogContent, Stack } from \"@mui/material\";\r\n\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\n\r\nimport FullscreenIcon from '@mui/icons-material/Fullscreen';\r\nimport { FullscreenExit, Print, SettingsPowerRounded } from \"@mui/icons-material\";\r\nimport { selectReportCriteriaEntities } from \"../../../reducers/admincenter_reportcriteria\";\r\nimport { selectReportsForGuid } from \"../../../reducers/reference_reportproduct\";\r\nimport ResponsiveRectangle from \"../skeletons/ResponsiveRectangle\";\r\nimport { selectUIReportEntities } from \"../../../reducers/admincenter_uireport\";\r\nimport DynamicComponent from \"../DynamicComponent\";\r\nimport DataReportTable from \"./ReportDataReportTable\";\r\nimport ReportUIReport from \"./ReportUIReport\";\r\nimport ReportAggregateReport from \"./ReportAggregateReport\";\r\n\r\n\r\n\r\n\r\nconst ReportItemDialog = (props, ref) => {\r\n\r\n const DataReportStatus = useSelector(state => state.datareports.status)\r\n const ReportProductsStatus = useSelector(state => state.reportproducts.status)\r\n const UIReportStatus = useSelector(state => state.uireports.status)\r\n const ReportCriteria = useSelector(state => selectReportCriteriaEntities(state))\r\n const ReportArray = useSelector(state => selectReportsForGuid(state, ReportCriteria.ReportGuid))\r\n const ReportObject = ReportArray && ReportArray[0] ? ReportArray[0] : []\r\n\r\n const dispatch = useDispatch();\r\n const navigate = useNavigate();\r\n const location = useLocation();\r\n\r\n\r\n\r\n const handleActualPrint = () => {\r\n //setPrintView(true)\r\n //handlePrint()\r\n window.matchMedia('print')\r\n window.print()\r\n }\r\n /*if (!currentUser) {\r\n return \r\n \r\n \r\n\r\n { handleOpen() }}\r\n >handleActualPrint()}> \r\n )} */}\r\n \r\n \r\n {\r\n ReportObject.ReportFamilyKeyName === \"RESULTS FOR AGG\" && isOpen === false && (\r\n \r\n\r\n \r\n )\r\n }\r\n \r\n {\r\n ReportObject.ReportFamilyKeyName === \"RESULT SET\" && isOpen === false && (\r\n \r\n \r\n handleClose()}\r\n fullScreen\r\n >\r\n \r\n \r\n handleClose()}> \r\n {/* {[\"RESULT SET\", \"RESULTS FOR AGG\"].indexOf(ReportObject.ReportFamilyKeyName) > -1 && (\r\n\r\n handleActualPrint()}> \r\n )}\r\n */}\r\n \r\n \r\n \r\n {\r\n ReportObject.ReportFamilyKeyName === \"RESULT SET\" && isOpen === true && (\r\n \r\n \r\n \r\n \r\n\r\n\r\n\r\n )\r\n\r\n};\r\n\r\nexport default React.forwardRef(ReportItemDialog);\r\n\r\n/* \r\n \r\n HOME\r\n \r\n Logout \r\n \r\n */","import React, { useState, useEffect, useRef } from \"react\";\r\nimport { useNavigate, useLocation, createSearchParams } from 'react-router-dom';\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Paper, Grid, Dialog, DialogTitle, Typography, Button, DialogContent } from \"@mui/material\";\r\n\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\n\r\nimport FullscreenIcon from '@mui/icons-material/Fullscreen';\r\nimport { FullscreenExit, SettingsPowerRounded } from \"@mui/icons-material\";\r\nimport { selectReportCriteriaEntities } from \"../../../reducers/admincenter_reportcriteria\";\r\nimport { selectReportsForGuid } from \"../../../reducers/reference_reportproduct\";\r\n\r\nimport ReportItemDialog from \"./ReportItemDialog\";\r\nimport ReactToPrint, { useReactToPrint } from \"react-to-print\";\r\n\r\n\r\n\r\n\r\n\r\nconst ReportContainer = () => {\r\n \r\n\r\n const DataReportStatus = useSelector(state => state.datareports.status)\r\n const ReportProductsStatus = useSelector(state => state.reportproducts.status)\r\n const UIReportStatus = useSelector(state => state.uireports.status)\r\n const ReportCriteria = useSelector(state => selectReportCriteriaEntities(state))\r\n const ReportArray = useSelector(state => selectReportsForGuid(state, ReportCriteria.ReportGuid))\r\n const ReportObject = ReportArray && ReportArray[0] ? ReportArray[0] : []\r\n\r\n\r\n const dispatch = useDispatch();\r\n const navigate = useNavigate();\r\n const location = useLocation();\r\n\r\n \r\n /*if (!currentUser) {\r\n return \r\n\r\n \r\n \r\n \r\n\r\n \r\n\r\n\r\n )\r\n\r\n};\r\n\r\nexport default ReportContainer;\r\n\r\n/* \r\n \r\n HOME\r\n \r\n Logout \r\n \r\n */","import React, { useState, useEffect } from \"react\";\r\nimport { useNavigate, useLocation, createSearchParams } from 'react-router-dom';\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Paper, Grid, Dialog, DialogTitle, Typography, Button, DialogContent } from \"@mui/material\";\r\nimport { getViewInstance } from \"../actions/viewinstance\";\r\nimport Header from \"./layouts/Header\";\r\nimport Footer from \"./layouts/Footer\";\r\nimport Loading from \"./Loading\";\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport ReportCriteria from \"./partials/admincenter/ReportCriteria\";\r\nimport AdminTabs from \"./partials/admincenter/AdminTabs\";\r\nimport ResponsiveRectangle from \"./partials/skeletons/ResponsiveRectangle\";\r\nimport DataReportTable from \"./partials/admincenter/ReportDataReportTable\";\r\nimport FullscreenIcon from '@mui/icons-material/Fullscreen';\r\nimport { FullscreenExit, SettingsPowerRounded } from \"@mui/icons-material\";\r\nimport { fetchReportProducts } from \"../reducers/reference_reportproduct\";\r\nimport ReportContainer from \"./partials/admincenter/ReportContainer\";\r\nimport { fetchViewInstances, selectViewInstanceById } from '../reducers/reuseable_vi';\r\n\r\n\r\n\r\n\r\nconst AdminCenterReports = () => {\r\n const { mainUser: currentUser } = useSelector((state) => state.auth);\r\n const [loading, setLoading] = useState(false);\r\n const [callVI, setCallVI] = useState(false)\r\n const { viewInstance, settings } = useSelector(state => state.viewinstance)\r\n const DataReportStatus = useSelector(state => state.datareports.status)\r\n const ReportProductsStatus = useSelector(state => state.reportproducts.status)\r\n const dispatch = useDispatch();\r\n const navigate = useNavigate();\r\n const location = useLocation();\r\n const userIsAdmin = (currentUser && (currentUser.IsAdmin === true))\r\n const viewInstanceLegend = useSelector(state => selectViewInstanceById(state, 'ReportLegend'))\r\n\r\n useEffect(() => {\r\n if (userIsAdmin === false) {\r\n navigate('/home')\r\n //} else {\r\n //if (ReportProductsStatus === 'idle') {\r\n //dispatch(fetchReportProducts({ AuthToken: currentUser.AuthToken }))\r\n //}\r\n //if (!callVI && (!viewInstance || !viewInstance.AdminCenterPage) && currentUser && currentUser.AuthToken) {\r\n //setCallVI(true);\r\n //dispatch(getViewInstance('F68B82A2-D122-4A05-B11D-BD91A2A52DC3', currentUser.AuthToken))\r\n //}\r\n }\r\n }, [userIsAdmin, navigate])\r\n\r\n useEffect(() => {\r\n if ((userIsAdmin === true) &&\r\n currentUser &&\r\n (ReportProductsStatus === 'idle')) {\r\n dispatch(fetchReportProducts({ AuthToken: currentUser.AuthToken }))\r\n }\r\n }, [userIsAdmin, currentUser, dispatch, ReportProductsStatus])\r\n\r\n /*if (!currentUser) {\r\n return \r\n
\r\n\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {viewInstance && viewInstance.AdminCenterPage && ReportProductsStatus === 'success' ?\r\n (\r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n {viewInstance && viewInstance.AdminCenterPage && ReportProductsStatus === 'success' ?\r\n (\r\n \r\n \r\n \r\n\r\n \r\n\r\n
\r\n
\r\n \r\n HOME\r\n \r\n Logout \r\n \r\n */","\r\nimport React, { useState, useEffect } from \"react\";\r\nimport { useNavigate, useLocation, createSearchParams } from 'react-router-dom';\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Paper, Grid, Dialog, DialogTitle, Typography, Button, DialogContent, Box, TextField } from \"@mui/material\";\r\n\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\nimport FullscreenIcon from '@mui/icons-material/Fullscreen';\r\nimport { FullscreenExit, SettingsInputComponent, SettingsPowerRounded } from \"@mui/icons-material\";\r\n\r\nimport DropdownTreeSelect from 'react-dropdown-tree-select'\r\nimport { addGroups, admingroupsClear, admingroupsClearModify, selectAdminGroups, selectGroupSelectTree, updateGroups } from \"../../../reducers/admincenter_groups\";\r\nimport { LoadingButton } from \"@mui/lab\";\r\n\r\nconst OrganizationDisplay = () => {\r\n const location = useLocation()\r\n const navigate = useNavigate()\r\n const dispatch = useDispatch()\r\n\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const ALPHA_NUMERIC_DASH_REGEX = /^[a-zA-Z0-9-_ ]+$/;\r\n\r\n const [errorGroupGuid, setErrorGroupGuid] = useState(false)\r\n\r\n const GroupCRUDStatus = useSelector(state => state.admingroups.statusModify)\r\n const GroupCRUDError = useSelector(state => state.admingroups.errorModify)\r\n\r\n const Groups = useSelector(state => selectAdminGroups(state))\r\n\r\n\r\n const [GroupGuid, setGroupGuid] = useState(\"\")\r\n const [GroupObject, setGroupObject] = useState({})\r\n const [OrganizationName, setOrganizationName] = useState(\"\")\r\n const [OrganizationName_Update, setOrganizationName_Update] = useState(\"\")\r\n const [IsCreateGroupOpen, setIsCreateGroupOpen] = useState(false)\r\n const [IsEditGroupOpen, setIsEditGroupOpen] = useState(false)\r\n const [IsError, setIsError] = useState(false)\r\n\r\n const GroupTreeSelect = useSelector(state => selectGroupSelectTree(state, GroupGuid))\r\n\r\n const handleCloseEditDialog = () => {\r\n setIsEditGroupOpen(false)\r\n }\r\n\r\n const handleOpenEditDialog = () => {\r\n setOrganizationName_Update(GroupObject.OrganizationName || \"\")\r\n setIsEditGroupOpen(true)\r\n }\r\n\r\n const handleCloseCreateDialog = () => {\r\n setIsCreateGroupOpen(false)\r\n }\r\n\r\n const onChange = (currentNode, selectedNodes) => {\r\n setGroupGuid(currentNode.value)\r\n const SelectedGroup = Groups.filter(x => { return x.OrganizationId_Guid === currentNode.value })\r\n setGroupObject(SelectedGroup[0])\r\n }\r\n\r\n const handleNameChange = (v) => {\r\n setOrganizationName(v)\r\n }\r\n\r\n const handleNameChange_Update = (v) => {\r\n setOrganizationName_Update(v)\r\n }\r\n\r\n useEffect(() => {\r\n if (GroupCRUDStatus === 'success') {\r\n setIsError(false)\r\n handleCloseCreateDialog()\r\n handleCloseEditDialog()\r\n dispatch(admingroupsClear())\r\n } else if (GroupCRUDStatus === 'failed') {\r\n setIsError(true)\r\n }\r\n }, [dispatch, GroupCRUDStatus])\r\n\r\n const handleUpdateGroup = () => {\r\n dispatch(admingroupsClearModify())\r\n dispatch(updateGroups({\r\n AuthToken: currentUser.AuthToken\r\n , OrganizationName: OrganizationName_Update\r\n , OrganizationId_Guid: GroupObject.OrganizationId_Guid\r\n , OrganizationActiveFlag: GroupObject.OrganizationActiveFlag\r\n }))\r\n }\r\n\r\n const handleCreateGroup = () => {\r\n dispatch(admingroupsClearModify())\r\n dispatch(addGroups({ AuthToken: currentUser.AuthToken, OrganizationId_Guid_Parent: GroupObject.OrganizationId_Guid, OrganizationName: OrganizationName }))\r\n }\r\n /// localhost/WsWebAppWellcomplete/build/login?g=3ea7ac4e-ba2a-4153-b141-c4c55244123e\r\n return (\r\n \r\n\r\n \r\n \r\n\r\n \r\n \r\n\r\n \r\n \r\n\r\n {GroupObject && GroupObject.OrganizationId_Guid && (\r\n\r\n\r\n \r\n \r\n {GroupObject.OrganizationName} \r\n \r\n \r\n {GroupObject.OrganizationId_Guid} \r\n \r\n \r\n {window && window.location && window.location.href ? window.location.href.replace(location.pathname, \"/login?g=\" + GroupObject.OrganizationId_Guid) : \"\"} \r\n \r\n \r\n \r\n \r\n { handleOpenEditDialog() }}>Edit Group \r\n \r\n \r\n { setIsCreateGroupOpen(true) }}>Create Child Group \r\n \r\n \r\n \r\n \r\n )}\r\n \r\n \r\n { handleCloseCreateDialog() }}>\r\n \r\n Create Group \r\n \r\n \r\n \r\n \r\n {\r\n const value = e.target.value\r\n if (value !== \"\" && !ALPHA_NUMERIC_DASH_REGEX.test(value)) {\r\n return;\r\n }\r\n handleNameChange(value)\r\n }} value={OrganizationName}\r\n label=\"Group Name\"\r\n placeholder=\"Group Name\"\r\n />\r\n \r\n \r\n { handleCreateGroup() }}\r\n >Create Group \r\n \r\n \r\n { handleCloseCreateDialog() }}>Cancel \r\n \r\n\r\n {IsError === true && (\r\n\r\n \r\n {GroupCRUDError && GroupCRUDError.ErrorMessage ? GroupCRUDError.ErrorMessage : \"There was an error creating the group.\"} \r\n \r\n )}\r\n \r\n\r\n \r\n \r\n\r\n { handleCloseEditDialog() }}>\r\n \r\n Edit Group \r\n \r\n \r\n \r\n \r\n {\r\n const value = e.target.value\r\n if (value !== \"\" && !ALPHA_NUMERIC_DASH_REGEX.test(value)) {\r\n return;\r\n }\r\n handleNameChange_Update(value)\r\n }} value={OrganizationName_Update}\r\n label=\"Group Name\"\r\n placeholder=\"Group Name\"\r\n />\r\n \r\n \r\n { handleUpdateGroup() }}\r\n >Save \r\n \r\n \r\n { handleCloseEditDialog() }}>Cancel \r\n \r\n {IsError === true && (\r\n\r\n \r\n {GroupCRUDError && GroupCRUDError.ErrorMessage ? GroupCRUDError.ErrorMessage : \"There was an error saving your changes\"} \r\n \r\n )}\r\n \r\n\r\n \r\n \r\n \r\n )\r\n}\r\n/* \r\nPWD MAX LENGTH\r\nPWD MIN LENGTH\r\nPWD MIN LOWER CASE\r\nPWD MIN NUMERIC\r\nPWD MIN SPECIAL\r\nPWD MIN UPPER CASE\r\nTHEME COLOR\r\nTHEME COLOR SECONDARY \r\n*/\r\nexport default OrganizationDisplay","import React, { useState, useEffect } from \"react\";\r\nimport { useNavigate, useLocation, createSearchParams } from 'react-router-dom';\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Paper, Grid, Dialog, DialogTitle, Typography, Button, DialogContent } from \"@mui/material\";\r\nimport { getViewInstance } from \"../actions/viewinstance\";\r\nimport Header from \"./layouts/Header\";\r\nimport Footer from \"./layouts/Footer\";\r\n\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport ReportCriteria from \"./partials/admincenter/ReportCriteria\";\r\nimport AdminTabs from \"./partials/admincenter/AdminTabs\";\r\nimport ResponsiveRectangle from \"./partials/skeletons/ResponsiveRectangle\";\r\n\r\nimport FullscreenIcon from '@mui/icons-material/Fullscreen';\r\nimport { FullscreenExit, SettingsPowerRounded } from \"@mui/icons-material\";\r\nimport { fetchGroups, selectGroupSelectTree } from \"../reducers/admincenter_groups\";\r\nimport OrganizationDisplay from \"./partials/admincenter/OrganizationDisplay\";\r\n\r\n\r\n\r\nconst AdminCenterGroups = () => {\r\n const { mainUser: currentUser } = useSelector((state) => state.auth);\r\n const [loading, setLoading] = useState(false);\r\n const [callVI, setCallVI] = useState(false)\r\n const { viewInstance, settings } = useSelector(state => state.viewinstance)\r\n\r\n\r\n const dispatch = useDispatch();\r\n const navigate = useNavigate();\r\n const location = useLocation();\r\n const admingroupsStatus = useSelector(state => state.admingroups.status)\r\n const userIsAdmin = (currentUser && (currentUser.IsAdmin === true))\r\n\r\n /*if (!currentUser) {\r\n return \r\n
\r\n\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n {admingroupsStatus === 'success' ?\r\n (\r\n \r\n \r\n \r\n \r\n \r\n \r\n ) : (\r\n \r\n \r\n \r\n \r\n \r\n \r\n )\r\n }\r\n\r\n\r\n\r\n \r\n\r\n
\r\n
\r\n \r\n HOME\r\n \r\n Logout \r\n \r\n */","import React, { useEffect } from 'react'\r\nimport { Typography, Box, Grid, Divider, Card, CardMedia, CardContent, Paper } from '@mui/material'\r\nimport { Dialog, DialogTitle, DialogContent } from '@mui/material'\r\nimport _ from \"lodash\"\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { useDispatch, useSelector } from 'react-redux'\r\nimport { fetchHealthShelfs, selectHealthShelfById } from '../../../reducers/healthshelf_single'\r\nimport { useSearchParams } from 'react-router-dom'\r\n\r\n\r\nconst ArticleDialog = (props) => {\r\n const Article = props.Article\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const dispatch = useDispatch()\r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n\r\n\r\n\r\n return (\r\n \r\n \r\n \r\n\r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n {Article.ComponentValues.TitleBlock.Title} \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n )\r\n\r\n}\r\n\r\n\r\nexport default ArticleDialog;","import React from 'react'\r\nimport { Grid, Typography, Box, List, ListItem, Paper, Divider } from '@mui/material'\r\nimport { Dialog, DialogTitle, DialogContent } from '@mui/material'\r\nimport _ from \"lodash\"\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { useDispatch, useSelector } from 'react-redux'\r\n\r\nconst RecipeDialog = (props) => {\r\n const Article = props.Article\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const dispatch = useDispatch()\r\n\r\n // const handleChange = (event, newValue) => {\r\n // setValue(newValue);\r\n // setIsFlipped(-1)\r\n // setCurrentTab(props.cards.KeyAreas.KeyAreaArray[newValue])\r\n // };\r\n\r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n\r\n\r\n const Directions = () => {\r\n //direction array\r\n const Dir = [...Article.ComponentValues.Directions]\r\n \r\n const sortedDirections = Dir.sort((a, b) => a.Order - b.Order)\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n {sortedDirections.map((x, i) => {\r\n return (\r\n \r\n \r\n )\r\n })}\r\n
\r\n \r\n \r\n )\r\n }\r\n return (\r\n \r\n \r\n \r\n\r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n {Article.ComponentValues.TitleBlock.Title} \r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n\r\n\r\n\r\n )\r\n\r\n}\r\n\r\n\r\nexport default RecipeDialog;","import React from 'react'\r\nimport { Grid, Typography, Box, List, ListItem, Paper, Divider } from '@mui/material'\r\nimport _ from \"lodash\"\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\nconst HowToDialog = (props) => {\r\n const Article = props.Article\r\n\r\n // const handleChange = (event, newValue) => {\r\n // setValue(newValue);\r\n // setIsFlipped(-1)\r\n // setCurrentTab(props.cards.KeyAreas.KeyAreaArray[newValue])\r\n // };\r\n\r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n\r\n \r\n\r\n const Directions = () => {\r\n //direction array\r\n const Dir = [...Article.ComponentValues.Directions]\r\n \r\n const sortedDirections = Dir.sort((a, b) => a.Order - b.Order)\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n {sortedDirections.map((x, i) => {\r\n return (\r\n \r\n \r\n )\r\n })}\r\n
\r\n \r\n \r\n )\r\n }\r\n return (\r\n \r\n \r\n \r\n\r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n {Article.ComponentValues.TitleBlock.Title} \r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n\r\n )\r\n\r\n}\r\n\r\n\r\nexport default HowToDialog;","import React from 'react'\r\nimport { Grid, Typography, Box, List, ListItem, Paper, Divider } from '@mui/material'\r\nimport _ from \"lodash\"\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { useDispatch, useSelector } from 'react-redux'\r\nimport { Download, PictureAsPdf } from '@mui/icons-material'\r\n\r\nconst TrackerDialog = (props) => {\r\n const Article = props.Article\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const dispatch = useDispatch()\r\n\r\n // const handleChange = (event, newValue) => {\r\n // setValue(newValue);\r\n // setIsFlipped(-1)\r\n // setCurrentTab(props.cards.KeyAreas.KeyAreaArray[newValue])\r\n // };\r\n\r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n\r\n\r\n return (\r\n \r\n \r\n \r\n\r\n\r\n \r\n\r\n \r\n \r\n\r\n \r\n \r\n \r\n {Article.ComponentValues.TitleBlock.Title} \r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n\r\n\r\n\r\n )\r\n\r\n}\r\n\r\n\r\nexport default TrackerDialog;","import React from 'react'\r\nimport { Grid, Typography, Box, List, ListItem, Paper, Divider } from '@mui/material'\r\nimport { Dialog, DialogTitle, DialogContent } from '@mui/material'\r\nimport _ from \"lodash\"\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { useDispatch, useSelector } from 'react-redux'\r\n\r\nconst SelfCheckDialog = (props) => {\r\n const Article = props.Article\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const dispatch = useDispatch()\r\n \r\n // const handleChange = (event, newValue) => {\r\n // setValue(newValue);\r\n // setIsFlipped(-1)\r\n // setCurrentTab(props.cards.KeyAreas.KeyAreaArray[newValue])\r\n // };\r\n\r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n\r\n\r\n const Directions = () => {\r\n //direction array\r\n const Dir = [...Article.ComponentValues.Directions]\r\n \r\n const sortedDirections = Dir.sort((a, b) => a.Order - b.Order)\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n {sortedDirections.map((x, i) => {\r\n return (\r\n \r\n \r\n )\r\n })}\r\n
\r\n \r\n \r\n )\r\n }\r\n return (\r\n \r\n \r\n \r\n\r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n {Article.ComponentValues.TitleBlock.Title} \r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n\r\n\r\n\r\n )\r\n\r\n}\r\n\r\n\r\nexport default SelfCheckDialog;","import React from 'react'\r\nimport { Grid, Typography, Box, List, ListItem, Paper, Divider } from '@mui/material'\r\nimport _ from \"lodash\"\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport { useDispatch, useSelector } from 'react-redux'\r\nimport { Download, PictureAsPdf } from '@mui/icons-material'\r\n\r\nconst ChallengeDialog = (props) => {\r\n const Article = props.Article\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const dispatch = useDispatch()\r\n\r\n // const handleChange = (event, newValue) => {\r\n // setValue(newValue);\r\n // setIsFlipped(-1)\r\n // setCurrentTab(props.cards.KeyAreas.KeyAreaArray[newValue])\r\n // };\r\n\r\n const motionVariants = {\r\n hidden: { opacity: 0, x: 0, y: 0 },\r\n show: {\r\n opacity: 1, x: 0, y: 0,\r\n transition: {\r\n delay: 0.1,\r\n duration: 0.5,\r\n }\r\n }\r\n }\r\n \r\n\r\n\r\n return (\r\n \r\n \r\n \r\n\r\n\r\n \r\n\r\n \r\n \r\n\r\n \r\n \r\n \r\n {Article.ComponentValues.TitleBlock.Title} \r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n\r\n\r\n\r\n )\r\n\r\n}\r\n\r\n\r\nexport default ChallengeDialog;","import { createSlice, createSelector, createAsyncThunk } from '@reduxjs/toolkit'\r\n\r\n// import { BASE_URL, OrganizationId, AuthToken } from '/features/storeconfig'\r\nimport axios from \"axios\";\r\n\r\n\r\nconst initialState = {\r\n entities: {},\r\n status: 'idle', // idle loading success fail \r\n additionalinfo:{},\r\n error: null\r\n}\r\n/**\r\n * \r\n * ~~ = ignore\r\n * ~_~ = delete/set to default value\r\n */\r\nconst PLATFORM = '../../WsWebServicePlatform/'\r\nconst WELLSUITE = '../../WsWebServiceWellSuite/';\r\n// Participant/Misc/Types/Get/{AuthToken}/\t\r\n// Participant/Misc/Type/Update/{AuthToken}/{ParticipantInteractionGuid}/{InteractionName}/{InteractionDescription}/\t\r\n// Participant/Misc/Type/Delete/{AuthToken}/{ParticipantInteractionGuid}/\t\r\n// Participant/Misc/Type/Create/{AuthToken}/{InteractionName}/{InteractionDescription}/\t\r\nexport const recordInteractions = createAsyncThunk('interaction/get', async (incomingVariable, thunkAPI) => {\r\n \r\n try {\r\n const bodies = {\"ParamData\": {\r\n \"OrganizationGuid\": incomingVariable.GroupGuid,\r\n \"AuthToken\": incomingVariable.AuthToken,\r\n \"InteractionClassKeyName\": incomingVariable.ClassKeyName,\r\n \"InteractionFamilyKeyName\": incomingVariable.FamilyKeyName,\r\n \"InteractionTypeKeyName\": incomingVariable.TypeKeyName,\r\n \"ComponentGuid\": incomingVariable.ComponentGuid\r\n }}\r\n //const response = await axios.get(PLATFORM + \"InteractionLog/Append/\" + incomingVariable.authToken + \"/FC116697-AAE7-42E2-A4B2-137899513427\"+'/')\r\n\r\n const response = await axios.post(PLATFORM\r\n + \"InteractionLog/Append\" , bodies\r\n )\r\n const data = await response.data.Success ? response.data : []\r\n\r\n return data\r\n } catch (err) {\r\n \r\n return thunkAPI.rejectWithValue({ error: err.message });\r\n }\r\n})\r\n\r\n\r\nconst interactionSlice = createSlice({\r\n name: 'interactions',\r\n initialState,\r\n reducers: { \r\n interactionClear(state, action) {\r\n state.entities = initialState\r\n state.status = \"idle\"\r\n \r\n }\r\n },\r\n extraReducers(builder) {\r\n builder\r\n //\r\n .addCase(recordInteractions.pending, (state, action) => {\r\n state.status = 'loading'\r\n })\r\n .addCase(recordInteractions.fulfilled, (state, action) => {\r\n state.status = 'idle' \r\n })\r\n .addCase(recordInteractions.rejected, (state, action) => {\r\n state.error = action.error.message\r\n state.status = 'fail'\r\n \r\n })\r\n \r\n \r\n }\r\n})\r\n\r\nexport const { interactionClear} = interactionSlice.actions\r\n\r\nexport default interactionSlice.reducer\r\n\r\nexport const selectInteractionEntities = (state) => state.interactions.entities\r\n\r\nexport const selectInteractions = createSelector(selectInteractionEntities, (entities) =>\r\n Object.values(entities)\r\n)\r\n\r\nexport const selectInteractionById = (state, InteractionId) => {\r\n return selectInteractionEntities(state)[InteractionId]\r\n}\r\n\r\n","import React, { useState, useEffect } from \"react\";\r\nimport { useNavigate, useLocation, useSearchParams } from 'react-router-dom';\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Grid, Typography, Paper, Box, Skeleton } from '@mui/material'\r\nimport { getViewInstance } from \"../actions/viewinstance\";\r\nimport Header from \"./layouts/Header\";\r\nimport Footer from \"./layouts/Footer\";\r\nimport Masonry from '@mui/lab/Masonry';\r\nimport HealthShelfContainer from \"./partials/healthshelf/HealthShelfContainer\";\r\nimport FilterComponent from \"./partials/healthshelf/FilterComponent\";\r\nimport { topicHydrate } from \"../reducers/healthshelf_topic\";\r\nimport { articleHydrate } from \"../reducers/healthshelf_article\";\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\n\r\nimport ArticleDialog from \"./partials/healthshelf/ArticleDialog\";\r\nimport { fetchHealthShelfs, selectHealthShelfById } from \"../reducers/healthshelf_single\";\r\nimport RecipeDialog from \"./partials/healthshelf/RecipeDialog\";\r\nimport HowToDialog from \"./partials/healthshelf/HowToDialog\";\r\nimport TrackerDialog from \"./partials/healthshelf/TrackerDialog\";\r\nimport SelfCheckDialog from \"./partials/healthshelf/SelfCheckDialog\";\r\nimport ChallengeDialog from \"./partials/healthshelf/ChallengeDialog\";\r\nimport { recordInteractions } from \"../reducers/interaction\";\r\n\r\nconst HealthShelfArticle = () => {\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n\r\n useEffect(()=>{\r\n if(window !== undefined){\r\n window.scrollTo(0,0)\r\n }\r\n },[])\r\n \r\n const dispatch = useDispatch();\r\n const navigate = useNavigate();\r\n const location = useLocation();\r\n\r\n const [searchParams] = useSearchParams();\r\n const ArticleGuid = searchParams.get(\"hsg\")\r\n const Article = useSelector(state => selectHealthShelfById(state, ArticleGuid))\r\n const ArticleStatus = useSelector(state => state.healthshelfs.statusSingle)\r\n const GroupGuid = localStorage.getItem(\"group\")\r\n useEffect(() => {\r\n\r\n if (ArticleStatus === 'idle' && ArticleGuid && currentUser) {\r\n\r\n dispatch(fetchHealthShelfs({ AuthToken: currentUser.AuthToken, HealthShelfId_Guid: ArticleGuid }))\r\n dispatch(recordInteractions({GroupGuid:GroupGuid, AuthToken: currentUser.AuthToken,ClassKeyName:\"ARTICLE\",FamilyKeyName:\"LOADED\",TypeKeyName:\"HEALTH SHELF\", ComponentGuid:ArticleGuid}))\r\n }\r\n }, [dispatch, Article, ArticleStatus, currentUser, ArticleGuid])\r\n\r\n const ArticleSwitch = () => {\r\n\r\n if (Article.Type === \"ARTICLE\") { return \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n )\r\n\r\n }\r\n\r\n return (\r\n \r\n
\r\n\r\n\r\n {\r\n ArticleStatus === 'success'\r\n ?
\r\n\r\n : (\r\n
\r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n )\r\n }\r\n
\r\n
\r\n \r\n HOME\r\n \r\n Logout \r\n \r\n */","import React, { useState, useEffect } from \"react\";\r\nimport { useNavigate, useLocation, createSearchParams } from 'react-router-dom';\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Paper, Grid, Skeleton, Box, Button } from \"@mui/material\";\r\nimport { getViewInstance } from \"../actions/viewinstance\";\r\nimport Header from \"./layouts/Header\";\r\nimport Footer from \"./layouts/Footer\";\r\nimport PreviousAssessments from \"./partials/home/PreviousAssessments\";\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport HealthShelfComponent from \"./partials/home/HealthShelfComponent\";\r\nimport DisplayMode from \"./partials/displaymodes/DisplayMode\";\r\nimport OutboundSamlLink from \"./partials/home/OutboundSAMLLink\";\r\nimport { fetchErrorMessages } from \"../reducers/reference_errormessages\";\r\nimport { surveyClear } from \"../reducers/survey\";\r\nimport HomeAssessmentLibrary from \"./partials/dynamic/HomeAssessmentLibrary\";\r\nimport HomeHealthTools from \"./partials/dynamic/HomeHealthTools\";\r\nimport HomeBanner from \"./partials/dynamic/HomeBanner\";\r\nimport HTMLBlock from \"./partials/dynamic/HTMLBlock\";\r\nimport { fetchViewInstances, selectViewInstanceById } from \"../reducers/reuseable_vi\";\r\nimport { selectGlobalSettingEntities } from \"../reducers/reference_settings\";\r\nimport DynamicComponent from \"./partials/DynamicComponent\";\r\n\r\n\r\nconst HomeDynamic = () => {\r\n\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const [loading, setLoading] = useState(false);\r\n const [callVI, setCallVI] = useState(false)\r\n const viewInstance = useSelector(state => selectViewInstanceById(state, 'HomePage'))\r\n const dispatch = useDispatch();\r\n const navigate = useNavigate();\r\n const location = useLocation();\r\n const settings = useSelector(state => selectGlobalSettingEntities(state))\r\n const errormessageStatus = useSelector(state => state.errormessages.status)\r\n\r\n useEffect(() => {\r\n if (window !== undefined) {\r\n window.scrollTo(0, 0)\r\n }\r\n }, [])\r\n useEffect(()=>{\r\n },[viewInstance])\r\n const surveyStatus = useSelector(state => state.surveys.status)\r\n \r\n /*if (!currentUser) {\r\n return \r\n \r\n \r\n\r\n \r\n \r\n {viewInstance?.status==='success' && VisibleSections && VisibleSections.length > 0 ? (\r\n VisibleSections.map((x, i) => {\r\n return (\r\n \r\n )\r\n })\r\n ) : (\r\n [0, 1, 2, 3].map(x => {\r\n return (\r\n \r\n \r\n \r\n \r\n )\r\n })\r\n )\r\n }\r\n\r\n \r\n
\r\n );\r\n\r\n\r\n};\r\n\r\nexport default HomeDynamic;\r\n\r\n/* \r\n \r\n HOME\r\n \r\n Logout \r\n \r\n */","import React, { useState, useEffect } from \"react\";\r\nimport { useNavigate, useLocation, createSearchParams } from 'react-router-dom';\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Paper, Grid, Skeleton, Box } from \"@mui/material\";\r\nimport { getViewInstance } from \"../actions/viewinstance\";\r\nimport Header from \"./layouts/Header\";\r\nimport Footer from \"./layouts/Footer\";\r\nimport PreviousAssessments from \"./partials/home/PreviousAssessments\";\r\nimport { motion, AnimatePresence } from \"framer-motion/dist/framer-motion\"\r\nimport HealthShelfComponent from \"./partials/home/HealthShelfComponent\";\r\nimport DisplayMode from \"./partials/displaymodes/DisplayMode\";\r\nimport OutboundSamlLink from \"./partials/home/OutboundSAMLLink\";\r\nimport { fetchErrorMessages } from \"../reducers/reference_errormessages\";\r\nimport { surveyClear } from \"../reducers/survey\";\r\nimport HomeAssessmentLibrary from \"./partials/dynamic/HomeAssessmentLibrary\";\r\nimport HomeHealthTools from \"./partials/dynamic/HomeHealthTools\";\r\nimport HomeBanner from \"./partials/dynamic/HomeBanner\";\r\nimport HTMLBlock from \"./partials/dynamic/HTMLBlock\";\r\nimport { fetchViewInstances, selectViewInstanceById } from \"../reducers/reuseable_vi\";\r\nimport { globalsettingGetPrioritySesOrgPer, selectGlobalSettingEntities, selectSettingForTypeKeyName } from \"../reducers/reference_settings\";\r\nimport Home from \"./Home\";\r\nimport HomeDynamic from \"./HomeDynamic\";\r\nimport { profileClear } from \"../reducers/profile\";\r\n\r\n\r\nconst HomeReRoute = () => {\r\n\r\n const { user: currentUser } = useSelector((state) => state.auth);\r\n const [loading, setLoading] = useState(false);\r\n const [callVI, setCallVI] = useState(true)\r\n const viewInstance = useSelector(state => selectViewInstanceById(state,'HomePage'))\r\n const dispatch = useDispatch();\r\n const navigate = useNavigate();\r\n const location = useLocation();\r\n const settings = useSelector(state => selectGlobalSettingEntities(state))\r\n const errormessageStatus = useSelector(state => state.errormessages.status)\r\n const HomeGuid = useSelector(state=>selectSettingForTypeKeyName(state,{SettingTypeKeyName:\"WC HOME PAGE GUID\"}))\r\n\r\n useEffect(() => {\r\n if (window !== undefined) {\r\n window.scrollTo(0, 0)\r\n }\r\n dispatch(profileClear())\r\n }, [])\r\n\r\n const surveyStatus = useSelector(state => state.surveys.status)\r\n useEffect(() => {\r\n if (surveyStatus === 'success') {\r\n dispatch(surveyClear())\r\n }\r\n }, [])\r\n /*if (!currentUser) {\r\n return \r\n \r\n
\r\n );\r\n\r\n\r\n};\r\n\r\nexport default HomeReRoute;\r\n\r\n/* \r\n \r\n HOME\r\n \r\n Logout \r\n \r\n */","import React, { useState, useEffect, useRef, useCallback, forwardRef } from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { useSearchParams, useNavigate } from \"react-router-dom\";\r\nimport { Box, Grid, Paper, Skeleton } from '@mui/material'\r\nimport _ from \"lodash\"\r\nimport Header from \"./layouts/Header\";\r\nimport DynamicComponent from \"./partials/DynamicComponent\";\r\n\r\nimport Footer from \"./layouts/Footer\";\r\n\r\n\r\n\r\n\r\nconst PRPSPDFRoute = (props) => {\r\n const [loading, setLoading] = useState(true);\r\n const [callVI, setCallVI] = useState(false)\r\n useEffect(() => {\r\n if (window !== undefined) {\r\n window.scrollTo(0, 0)\r\n }\r\n }, [])\r\n const [searchParams] = useSearchParams();\r\n //const { viewInstance, settings } = useSelector(state => state.viewinstance)\r\n const [viewInstance, setViewInstance] = useState({})//useSelector(state => selectViewInstanceById(state, 'PhysicianSummary'))\r\n const settings = viewInstance?.settings || {}\r\n const dispatch = useDispatch();\r\n const authToken= searchParams.get(\"auth\")\r\n const reportGuid= searchParams.get(\"vi\")\r\n const assessmentGuid= searchParams.get(\"assmt\")\r\n const VIName= searchParams.get(\"viName\") \r\n const componentRef = useRef(null);\r\n\r\n\r\n useEffect(() => {\r\n if (loading){\r\n\r\n const startConversion = () => {\r\n if (window.hiqPdfConverter) {\r\n window.hiqPdfConverter.startConversion();\r\n }\r\n };\r\n \r\n // Ensure hiqPdfConverter is available and the component is ready\r\n if (typeof window.hiqPdfConverter !== 'undefined' && !loading) {\r\n startConversion();\r\n } else {\r\n // Add an event listener for when hiqPdfConverter becomes available\r\n window.addEventListener('hiqPdfConverterReady', startConversion);\r\n \r\n // Clean up the event listener when the component unmounts\r\n return () => {\r\n window.removeEventListener('hiqPdfConverterReady', startConversion);\r\n };\r\n }\r\n }\r\n }, [loading]);\r\n\r\n\r\n\r\n useEffect(() => {\r\n const fetchData = async ()=>{\r\n\r\n setLoading(true)\r\n try {\r\n console.log('trying fetch')\r\n fetch('../../WsWebServicePlatform/Participant/SessionVar/Set/' + authToken + '/RESPONSE%20GUID/' + assessmentGuid+'/', {\r\n method: \"POST\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n },\r\n body: {\r\n }\r\n })\r\n .then(response => {return response.json()})\r\n .then(response => {\r\n console.log('did post response call', response)\r\n return fetch(\"../../WsWebServiceWellSuite/\" + \"GetViewInstance/\" + authToken+ \"/\"+reportGuid +'/', {\r\n method: \"GET\",\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json'\r\n }\r\n })})\r\n .then(response => {\r\n console.log('response2',response)\r\n return response.json()\r\n })\r\n \r\n .then(response => {\r\n console.log('response json return',response)\r\n const data = response.Success ? { ReportViewInstance:response.Info[0].ViewInstanceData[0].ReportViewInstance, settings: response.Info[0].ViewInstanceData[1]} : {ReportViewInstance:{}, settings:{}}\r\n setViewInstance(data)\r\n setLoading(false)\r\n })\r\n \r\n \r\n } catch (error) {\r\n console.error(error.message)\r\n }\r\n }\r\n\r\n fetchData()\r\n }, [window.location.pathname])\r\n console.log('completed', viewInstance)\r\n \r\n const OrderedSections =\r\n viewInstance\r\n && viewInstance.ReportViewInstance\r\n && viewInstance.ReportViewInstance.ReportPage\r\n && viewInstance.ReportViewInstance.ReportPage[0].ReportFrame\r\n && [...viewInstance.ReportViewInstance.ReportPage[0].ReportFrame].sort(function (a, b) { return parseInt(a.Order) - parseInt(b.Order) })\r\n\r\n\r\n\r\n return (\r\n \r\n\r\n \r\n \r\n\r\n {/** The idea is simple, we will send each array to a single component that will dictate its format */}\r\n {/** Each array will have a ComponentType attribute. [{ComponentType},{ComponentType},{ComponentType}] */}\r\n {/** This component type will load a specific component*/}\r\n\r\n {viewInstance && !loading && viewInstance.ReportViewInstance\r\n && OrderedSections ? (\r\n\r\n <>\r\n {\r\n OrderedSections.map((reportComponent, index) => {\r\n return (\r\n\r\n
\r\n \r\n ) : (\r\n [1, 2, 3, 4, 5].map(x => {\r\n return (\r\n \r\n \r\n \r\n \r\n )\r\n })\r\n\r\n )\r\n }\r\n\r\n\r\n\r\n \r\n \r\n\r\n \r\n );\r\n\r\n\r\n\r\n};\r\n\r\nexport default React.forwardRef(PRPSPDFRoute);","import React, { useState, useEffect, useMemo } from \"react\";\r\nimport { BrowserRouter as Router, Routes, Route, useNavigate, useSearchParams, useLocation } from \"react-router-dom\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { createTheme, ThemeProvider } from '@mui/material/styles';\r\nimport CssBaseline from '@mui/material/CssBaseline';\r\nimport { useIdleTimer, workerTimers } from 'react-idle-timer';\r\nimport \"./App.css\";\r\n\r\nimport { Modal, Box, Typography, Container } from \"@mui/material\";\r\n\r\nimport Login from \"./components/Login\";\r\nimport Home from \"./components/Home\";\r\nimport Logout from \"./components/Logout\";\r\nimport NotFound from \"./components/NotFound\";\r\nimport PasswordRequest from \"./components/PasswordRequest\";\r\nimport PasswordReset from \"./components/PasswordReset\";\r\nimport PersonalReport from \"./components/PersonalReport\";\r\nimport PhysicianSummary from \"./components/PhysicianSummary\";\r\nimport AdminReport from \"./components/AdminReport\";\r\nimport HRA from \"./components/HRA\";\r\nimport HRA2 from \"./components/HRA2\";\r\nimport Profile from \"./components/Profile\";\r\nimport HealthShelf from './components/HealthShelf'\r\nimport SAML from './components/SAML'\r\nimport { logout } from \"./actions/auth\";\r\nimport { clearMessage } from \"./actions/message\";\r\n\r\n\r\nimport { history } from \"./helpers/history\";\r\nimport AdminCenterParticipants from \"./components/AdminCenterParticipants\";\r\nimport AdminCenterReports from \"./components/AdminCenterReports\";\r\nimport { fetchErrorMessages, selectErrorMessagesByKeyName } from \"./reducers/reference_errormessages\";\r\nimport { userKeepAlive, userLogout, authClear } from \"./reducers/auth\";\r\nimport AdminCenterGroups from \"./components/AdminCenterGroups\";\r\nimport HealthShelfArticle from \"./components/HealthShelfArticle\";\r\nimport HomeReRoute from \"./components/HomeReRoute\";\r\nimport { selectSettingForTypeKeyName } from \"./reducers/reference_settings\";\r\nimport './print.css'\r\nimport PRPSPDFRoute from \"./components/PRPSPDFRoute\";\r\n\r\n\r\n\r\nconst App = () => {\r\n const [primaryColor, setPrimaryColor] = useState('#2196f3')\r\n const [secondaryColor, setSecondaryColor] = useState('#f50057')\r\n\r\n const theme = useMemo(() =>\r\n createTheme({\r\n palette: {\r\n primary: {\r\n main: primaryColor\r\n },\r\n secondary: {\r\n main: secondaryColor\r\n }\r\n , background: {\r\n default: \"rgb(243, 244, 249)\"\r\n }\r\n }\r\n\r\n }), [primaryColor, secondaryColor]\r\n )\r\n //size: 600mm 900mm !important;\r\n\r\n const { viewInstance, settings } = useSelector(state => state.viewinstance)\r\n const themeColPrim = useSelector(state=>selectSettingForTypeKeyName(state,{SettingTypeKeyName:\"THEME COLOR\"}))\r\n const themeColSec = useSelector(state=>selectSettingForTypeKeyName(state,{SettingTypeKeyName:\"THEME COLOR SECONDARY\"}))\r\n const [getVI, setGetVI] = useState(true)\r\n const [searchParams] = useSearchParams();\r\n const dispatch = useDispatch();\r\n const navigate = useNavigate();\r\n const location = useLocation()\r\n \r\n const errormessageStatus = useSelector(state => state.errormessages.status)\r\n const errorMessages = useSelector(state => state.errormessages.entities)\r\n\r\n\r\n useEffect(() => {\r\n if (errormessageStatus === 'idle' && (searchParams.get(\"g\") || localStorage.getItem('group'))) {\r\n //console.log('srch', searchParams.get(\"g\"))\r\n dispatch(fetchErrorMessages({ groupGuid: searchParams.get(\"g\") || localStorage.getItem('group'), languageID: -1 }))\r\n }\r\n\r\n }, [errormessageStatus, searchParams, dispatch])\r\n\r\n\r\n\r\n useEffect(() => {\r\n history.listen((location) => {\r\n // console.log(history)\r\n dispatch(clearMessage()); // clear message when changing location\r\n });\r\n }, [dispatch]);\r\n\r\n useEffect(() => {\r\n if (settings && settings.OrganizationSettingValues && ((settings.OrganizationSettingValues['THEME COLOR'] && settings.OrganizationSettingValues['THEME COLOR'].length > 2) || (settings.OrganizationSettingValues[0].List['THEME COLOR'] && settings.OrganizationSettingValues[0].List['THEME COLOR'].length > 2))) {\r\n let themeColor = settings.OrganizationSettingValues['THEME COLOR'] ? settings.OrganizationSettingValues['THEME COLOR'] : settings.OrganizationSettingValues[0].List['THEME COLOR']\r\n setPrimaryColor(themeColor.charAt(0) === \"#\" ? themeColor : (\"#\" + themeColor))\r\n\r\n }\r\n if(themeColPrim && themeColPrim!=primaryColor){\r\n setPrimaryColor(themeColPrim.charAt(0) === \"#\" ? themeColPrim : (\"#\" + themeColPrim))\r\n }\r\n if(themeColSec && themeColSec!=secondaryColor){\r\n setSecondaryColor(themeColSec.charAt(0) === \"#\" ? themeColSec : (\"#\" + themeColSec))\r\n }\r\n }, [settings, themeColPrim, themeColSec])\r\n\r\n\r\n\r\n\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n );\r\n};\r\n\r\nexport default App;\r\n /* \r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n */","import { SET_MESSAGE, CLEAR_MESSAGE } from \"./type\";\r\n\r\nexport const setMessage = (message) => ({\r\n type: SET_MESSAGE,\r\n payload: message,\r\n});\r\n\r\nexport const clearMessage = () => ({\r\n type: CLEAR_MESSAGE,\r\n});\r\n","// This optional code is used to register a service worker.\n// register() is not called by default.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on subsequent visits to a page, after all the\n// existing tabs open on the page have been closed, since previously cached\n// resources are updated in the background.\n\n// To learn more about the benefits of this model and instructions on how to\n// opt-in, read https://bit.ly/CRA-PWA\n\nconst isLocalhost = Boolean(\n window.location.hostname === 'localhost' ||\n // [::1] is the IPv6 localhost address.\n window.location.hostname === '[::1]' ||\n // 127.0.0.1/8 is considered localhost for IPv4.\n window.location.hostname.match(\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\n )\n);\n\nexport function register(config) {\n if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\n // The URL constructor is available in all browsers that support SW.\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);\n if (publicUrl.origin !== window.location.origin) {\n // Our service worker won't work if PUBLIC_URL is on a different origin\n // from what our page is served on. This might happen if a CDN is used to\n // serve assets; see https://github.com/facebook/create-react-app/issues/2374\n return;\n }\n\n window.addEventListener('load', () => {\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\n\n if (isLocalhost) {\n // This is running on localhost. Let's check if a service worker still exists or not.\n checkValidServiceWorker(swUrl, config);\n\n // Add some additional logging to localhost, pointing developers to the\n // service worker/PWA documentation.\n navigator.serviceWorker.ready.then(() => {\n console.log(\n 'This web app is being served cache-first by a service ' +\n 'worker. To learn more, visit https://bit.ly/CRA-PWA'\n );\n });\n } else {\n // Is not localhost. Just register service worker\n registerValidSW(swUrl, config);\n }\n });\n }\n}\n\nfunction registerValidSW(swUrl, config) {\n navigator.serviceWorker\n .register(swUrl)\n .then(registration => {\n registration.onupdatefound = () => {\n const installingWorker = registration.installing;\n if (installingWorker == null) {\n return;\n }\n installingWorker.onstatechange = () => {\n if (installingWorker.state === 'installed') {\n if (navigator.serviceWorker.controller) {\n // At this point, the updated precached content has been fetched,\n // but the previous service worker will still serve the older\n // content until all client tabs are closed.\n console.log(\n 'New content is available and will be used when all ' +\n 'tabs for this page are closed. See https://bit.ly/CRA-PWA.'\n );\n\n // Execute callback\n if (config && config.onUpdate) {\n config.onUpdate(registration);\n }\n } else {\n // At this point, everything has been precached.\n // It's the perfect time to display a\n // \"Content is cached for offline use.\" message.\n console.log('Content is cached for offline use.');\n\n // Execute callback\n if (config && config.onSuccess) {\n config.onSuccess(registration);\n }\n }\n }\n };\n };\n })\n .catch(error => {\n console.error('Error during service worker registration:', error);\n });\n}\n\nfunction checkValidServiceWorker(swUrl, config) {\n // Check if the service worker can be found. If it can't reload the page.\n fetch(swUrl)\n .then(response => {\n // Ensure service worker exists, and that we really are getting a JS file.\n const contentType = response.headers.get('content-type');\n if (\n response.status === 404 ||\n (contentType != null && contentType.indexOf('javascript') === -1)\n ) {\n // No service worker found. Probably a different app. Reload the page.\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister().then(() => {\n window.location.reload();\n });\n });\n } else {\n // Service worker found. Proceed as normal.\n registerValidSW(swUrl, config);\n }\n })\n .catch(() => {\n console.log(\n 'No internet connection found. App is running in offline mode.'\n );\n });\n}\n\nexport function unregister() {\n if ('serviceWorker' in navigator) {\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister();\n });\n }\n}\n","import { SET_MESSAGE, CLEAR_MESSAGE } from \"../actions/type\";\r\n\r\nconst initialState = {};\r\n\r\nexport default function (state = initialState, action) {\r\n const { type, payload } = action;\r\n\r\n switch (type) {\r\n case SET_MESSAGE:\r\n return { message: payload };\r\n\r\n case CLEAR_MESSAGE:\r\n return { message: \"\" };\r\n\r\n default:\r\n return state;\r\n }\r\n}\r\n","import {\r\n TERMS_LOADED_SUCCESSFULLY,\r\n TERMS_OPENED,\r\n TERMS_ACCEPTED,\r\n TERMS_NOT_ACCEPTED,\r\n } from \"../actions/type\";\r\n \r\n const user = localStorage.getItem(\"auth\");\r\n \r\n const initialState = {\r\n viewInstance: null,\r\n isOpen: false,\r\n isAccepted: true,\r\n viewInstanceGuid: null\r\n }\r\n \r\n export default function (state = initialState, action) {\r\n const { type, payload } = action;\r\n \r\n switch (type) {\r\n case TERMS_LOADED_SUCCESSFULLY:\r\n return {\r\n ...state,\r\n viewInstance: payload\r\n }; \r\n case TERMS_OPENED:\r\n return {\r\n ...state,\r\n isOpen: true\r\n };\r\n case TERMS_ACCEPTED:\r\n return {\r\n ...state,\r\n isOpen: false,\r\n isAccepted: true\r\n };\r\n case TERMS_NOT_ACCEPTED:\r\n return {\r\n ...state,\r\n isOpen: false,\r\n isAccepted: false\r\n };\r\n default:\r\n return state;\r\n }\r\n }","import { createSlice, createSelector, createAsyncThunk } from '@reduxjs/toolkit'\r\n\r\n// import { BASE_URL, OrganizationId, AuthToken } from '/features/storeconfig'\r\nimport axios from \"axios\";\r\n\r\n\r\nconst initialState = {\r\n entities: {},\r\n status: 'idle', // idle loading success fail \r\n error: null\r\n}\r\n/**\r\n * \r\n * ~~ = ignore\r\n * ~_~ = delete/set to default value\r\n */\r\nconst PLATFORM = '../../WsWebServicePlatform/'\r\nconst WELLSUITE = '../../WsWebServiceWellSuite/';\r\n// Participant/Misc/Types/Get/{AuthToken}/\t\r\n// Participant/Misc/Type/Update/{AuthToken}/{ParticipantProfileVIGuid}/{ProfileVIName}/{ProfileVIDescription}/\t\r\n// Participant/Misc/Type/Delete/{AuthToken}/{ParticipantProfileVIGuid}/\t\r\n// Participant/Misc/Type/Create/{AuthToken}/{ProfileVIName}/{ProfileVIDescription}/\t\r\nexport const fetchProfileVIs = createAsyncThunk('profilevi/get', async (incomingVariable, thunkAPI) => {\r\n \r\n try {\r\n const response = await axios.get(WELLSUITE + \"GetViewInstance/\" + incomingVariable.authToken + \"/5F6382C5-1CEF-461B-9539-7B428E5EA882\"+'/')\r\n const data = await response.data.Success ? response.data : []\r\n\r\n return data\r\n } catch (err) {\r\n \r\n return thunkAPI.rejectWithValue({ error: err.message });\r\n }\r\n})\r\n\r\n\r\nconst profileviSlice = createSlice({\r\n name: 'profilevis',\r\n initialState,\r\n reducers: { \r\n profileviClear(state, action) {\r\n state.entities = initialState\r\n state.status = \"idle\"\r\n \r\n }\r\n },\r\n extraReducers(builder) {\r\n builder\r\n //\r\n .addCase(fetchProfileVIs.pending, (state, action) => {\r\n state.status = 'loading'\r\n })\r\n .addCase(fetchProfileVIs.fulfilled, (state, action) => {\r\n state.status = 'success' \r\n const loadedData = action.payload.Info[0].ViewInstanceData[0].ProfileVI.MenuProfile\r\n state.entities = loadedData\r\n })\r\n .addCase(fetchProfileVIs.rejected, (state, action) => {\r\n state.error = action.error.message\r\n \r\n })\r\n \r\n \r\n }\r\n})\r\n\r\nexport const { profileviClear} = profileviSlice.actions\r\n\r\nexport default profileviSlice.reducer\r\n\r\nexport const selectProfileVIEntities = (state) => state.profilevi.entities\r\n\r\nexport const selectProfileVIs = createSelector(selectProfileVIEntities, (entities) =>\r\n Object.values(entities)\r\n)\r\n\r\nexport const selectProfileVIById = (state, ProfileVIId) => {\r\n return selectProfileVIEntities(state)[ProfileVIId]\r\n}\r\n\r\n","import { combineReducers } from '@reduxjs/toolkit'\r\n\r\nimport { persistReducer } from 'redux-persist';\r\nimport storage from 'redux-persist/lib/storage'; // defaults to localStorage for web\r\nimport { encryptTransform } from 'redux-persist-transform-encrypt';\r\n\r\nimport auth from \"./auth\";\r\nimport timeouts from \"./auth_timeout\";\r\nimport message from \"./message\";\r\nimport viewinstance from \"./viewinstance\";\r\n\r\nimport pwresetReducer from \"./pwreset\";\r\nimport pwrequestReducer from \"./pwrequest\";\r\n\r\nimport terms from \"./terms\";\r\nimport surveyReducer from \"./survey\"\r\nimport sectionReducer from \"./survey_section\"\r\nimport questionsetReducer from \"./survey_questionset\"\r\nimport questionReducer from \"./survey_question\"\r\n\r\nimport articleReducer from \"./healthshelf_article\"\r\nimport topicReducer from \"./healthshelf_topic\"\r\nimport hsfilterReducer from \"./healthshelf_filter\"\r\nimport healthshelfReducer from \"./healthshelf_single\"\r\n\r\nimport adminparticipantReducer from \"./admincenter_participants\"\r\nimport reportcriteriaReducer from \"./admincenter_reportcriteria\"\r\nimport datareportReducer from \"./admincenter_datareport\"\r\nimport uireportReducer from \"./admincenter_uireport\"\r\nimport admingroupsReducer from \"./admincenter_groups\"\r\nimport participantdemographicsReducer from \"./admincenter_participantdemographics\"\r\nimport participantaddressReducer from \"./admincenter_participantaddress\"\r\nimport participantphoneReducer from \"./admincenter_participantphone\"\r\nimport participantmiscReducer from \"./admincenter_participantmisc\"\r\nimport participantinviteReducer from \"./admincenter_participantinvite\"\r\nimport participantpasswordReducer from \"./admincenter_participantpassword\"\r\nimport participantmergeReducer from \"./admincenter_participantmerge\"\r\nimport participantmoveReducer from \"./admincenter_participantmove\"\r\n\r\nimport participantBiometrics from \"./admincenter_biometrics\"\r\nimport participantResponses from \"./admincenter_responses\"\r\n\r\nimport clientlogoReducer from './reference_clientlogo'\r\nimport navmenuReducer from './reference_navmenu'\r\nimport termsAndConditionsReducer from './terms_and_conditions'\r\nimport privacypolicyReducer from './privacy_policy'\r\n\r\nimport spokenlanguageReducer from './reference_spokenlanguage'\r\nimport countryReducer from './reference_country'\r\nimport educationReducer from './reference_education'\r\nimport phonetypeReducer from './reference_phonetype'\r\nimport addresstypeReducer from './reference_addresstypes'\r\nimport misctypeReducer from './reference_misctypes'\r\nimport errormessageReducer from './reference_errormessages'\r\nimport birthsexReducer from './reference_birthsex'\r\nimport raceReducer from './reference_race'\r\nimport profileviReducer from './reference_profilevi'\r\n\r\nimport interactionReducer from './interaction'\r\n\r\nimport viewinstancesReducer from './reuseable_vi'\r\nimport globalsettingsReducer from './reference_settings'\r\n\r\n\r\n\r\nimport reportproductReducer from './reference_reportproduct'\r\n\r\nimport contextsReducer from './global_contexts'\r\n\r\n// import calcsReducer from './survey_calc'\r\n// import translationsReducer from './reference_translations'\r\n\r\nconst reducersToPersist = ['auths','auth', 'globalsettings']\r\nconst persistConfig = {\r\n key: 'root',\r\n storage,\r\n transforms: [\r\n encryptTransform({\r\n secretKey: 'W#llS0urCe R3duXxX',\r\n onError: function (error) {\r\n // Handle the error.\r\n },\r\n }),\r\n ],\r\n whitelist: reducersToPersist\r\n};\r\n\r\n\r\n//\r\n// saving this in case we need to persist smaller sections of a 'slice'\r\n//\r\n// we add an additional config, and keep the persistConfig from above (its root)\r\n//\r\nconst authPersistConfig = {\r\n key: 'auth',\r\n storage,\r\n blacklist: ['isLoggedIn']\r\n}\r\n//\r\n//\r\n// then tie this additional configuration to the reducer so we can make sure its never saved.\r\n//\r\n// const rootReducers = combineReducers({\r\n// user: persistReducer(authPersistConfig, authReducer),\r\n// })\r\n//\r\n//\r\n\r\nexport const rootReducers = combineReducers({\r\n auth,\r\n message,\r\n viewinstance,\r\n terms,\r\n timeouts:timeouts,\r\n pwreset: pwresetReducer,\r\n pwrequest:pwrequestReducer,\r\n\r\n surveys: surveyReducer,\r\n sections: sectionReducer,\r\n questionsets: questionsetReducer,\r\n questions:questionReducer,\r\n\r\n\r\n topics:topicReducer,\r\n articles:articleReducer,\r\n hsfilters:hsfilterReducer,\r\n healthshelfs:healthshelfReducer,\r\n\r\n adminparticipants: adminparticipantReducer,\r\n reportcriterias:reportcriteriaReducer,\r\n datareports: datareportReducer,\r\n uireports: uireportReducer,\r\n admingroups:admingroupsReducer,\r\n reportproducts:reportproductReducer,\r\n\r\n participantdemographics: participantdemographicsReducer,\r\n participantaddresss: participantaddressReducer,\r\n participantphones: participantphoneReducer,\r\n participantmiscs: participantmiscReducer,\r\n\r\n participantinvites: participantinviteReducer,\r\n participantpasswords: participantpasswordReducer,\r\n participantmoves: participantmoveReducer,\r\n participantmerges: participantmergeReducer,\r\n\r\n participantbiometrics: participantBiometrics,\r\n participantresponses: participantResponses,\r\n\r\n\r\n clientlogo:clientlogoReducer,\r\n navmenu:navmenuReducer,\r\n termsandconditions: termsAndConditionsReducer,\r\n privacypolicy: privacypolicyReducer,\r\n\r\n spokenlanguages: spokenlanguageReducer,\r\n countrys: countryReducer,\r\n educations: educationReducer,\r\n phonetypes: phonetypeReducer,\r\n addresstypes: addresstypeReducer,\r\n misctypes: misctypeReducer,\r\n birthsexs: birthsexReducer,\r\n races: raceReducer,\r\n \r\n profilevis: profileviReducer,\r\n\r\n\r\n errormessages: errormessageReducer,\r\n\r\n contexts: contextsReducer,\r\n\r\n interactions:interactionReducer,\r\n viewinstances: viewinstancesReducer,\r\n globalsettings: globalsettingsReducer,\r\n // translations: translationsReducer,\r\n // calcs:calcsReducer,\r\n\r\n});\r\n\r\nconst persistedReducer = persistReducer(persistConfig, rootReducers);\r\n\r\n\r\nexport default persistedReducer","import thunk from \"redux-thunk\";\r\nimport rootReducer from \"./reducers\";\r\nimport { configureStore } from '@reduxjs/toolkit'\r\nimport { setupListeners } from '@reduxjs/toolkit/query'\r\nimport { persistStore } from 'redux-persist';\r\n\r\nconst middleware = [thunk];\r\n\r\nconst store = configureStore({\r\n\r\n reducer: rootReducer,\r\n}\r\n);\r\n\r\nconst persistor = persistStore(store);\r\n\r\nsetupListeners(store.dispatch)\r\n\r\nexport {store, persistor};\r\n","import 'react-app-polyfill/ie9';\nimport 'react-app-polyfill/stable';\n\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport './index.css';\nimport App from './App';\nimport * as serviceWorker from './serviceWorker';\nimport { Provider } from 'react-redux';\nimport { PersistGate } from 'redux-persist/integration/react';\nimport { store, persistor } from './store';\nimport { CookiesProvider } from 'react-cookie';\nimport { BrowserRouter as Router } from 'react-router-dom'\nimport 'typeface-roboto';\n \n\nReactDOM.render(\n \n \n\n \n \n \n \n \n\n \n ,\n document.getElementById('root'));\n\n// If you want your app to work offline and load faster, you can change\n// unregister() to register() below. Note this comes with some pitfalls.\n// Learn more about service workers: https://bit.ly/CRA-PWA\nserviceWorker.unregister();\n"],"sourceRoot":""} ![{viewInstance.LoginPage.ClientLogo.ClientLogoAltText}]({\"../\")
\r\n \r\n\r\n \r\n\r\n {isError === true && (\r\n\r\n