\r\n\r\n\r\n{!(\r\n props.fstate &&\r\n props.fstate.problemtype &&\r\n !props.fstate.problemtype.disable &&\r\n props.problemTypes\r\n ) ? (\r\n \"\"\r\n ) : (\r\n\r\n \r\n \r\n {props.translate(props.lang, props.fstate.problemtype.label)}{\" \"}\r\n {props.fstate.problemtype.required ? (\r\n <>\r\n ) : (\r\n {props.translate(\r\n props.lang,\"optionalSign\")}\r\n )}\r\n \r\n \r\n \r\n {\r\n onFocus={(e) => {\r\n showHideForm(e);\r\n onChange(e);\r\n }}\r\n onChange={(e) => {\r\n onChange(e);\r\n }}\r\n />\r\n \r\n\r\n {showProbTypeList ? (\r\n \r\n \r\n )}\r\n\r\n
\r\n );\r\n}\r\n","import React, { useEffect } from \"react\";\r\nimport {Label, Input, FormGroup, Button } from \"reactstrap\";\r\n\r\n\r\nexport default function HomeQA(props) {\r\n\r\n useEffect(() => {\r\n // console.log(props);\r\n }, []);\r\n\r\n\r\n\r\n return (\r\n <>\r\n {props.allQ && props.allQ.length > 0 ? (\r\n \r\n {pTypes.map((a) => (\r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n\r\n {(showProbType && props.problemTypesCommon && props.problemTypesCommon.length>0) ? (\r\n \r\n {\r\n onClickListItem(e, a);\r\n }}\r\n >\r\n \r\n {\" \"}\r\n {a.description}\r\n \r\n {a.problemCode} \r\n \r\n
\r\n ))}\r\n \r\n \r\n \r\n {props.translate(\r\n props.lang,\r\n \"selectCommonRequestsLabel\"\r\n )}\r\n \r\n \r\n \r\n\r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n \r\n
\r\n \r\n {props.problemTypesCommon.map((a, index) =>\r\n index % 2 !== 0 ? (\r\n \"\"\r\n ) : (\r\n {\r\n onClickListItem(e, a);\r\n }}\r\n >\r\n {a.description}\r\n \r\n //
\r\n\r\n \r\n {props.problemTypesCommon.map((a, index) =>\r\n index % 2 !== 0 ? (\r\n // {\r\n onClickListItem(e, a);\r\n }}\r\n >\r\n {a.description}\r\n \r\n ) : (\r\n \"\"\r\n )\r\n )}\r\n
\r\n \r\n \r\n {a.Answer}\r\n
\r\n\r\n \r\n \r\n \r\n\r\n {/* {props.imageOption === \"Y\" ? ( */}\r\n \r\n {\r\n props.attach(e);\r\n }}\r\n />\r\n
\r\n \r\n {/* ) : (\r\n \"\"\r\n )} */}\r\n\r\n {props.imageList\r\n ? props.imageList.map((a) => (\r\n \r\n
*/}\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n handleDrop(e)}\r\n onDragOver={(e) => handleDragOver(e)}\r\n onDragEnter={(e) => handleDragEnter(e)}\r\n onDragLeave={(e) => handleDragLeave(e)}\r\n >\r\n
\r\n \r\n
\r\n {props.translate(props.lang, \"DragFiles\")}
\r\n\r\n handleClick(e)}\r\n >\r\n {props.translate(props.lang, \"AddAttchmentLabel\")}\r\n \r\n
\r\n \r\n {props.gisAddreses.map((a, index) => (\r\n
\r\n :\"\"}\r\n \r\n {\r\n props.clearAlerts();\r\n props.fstate.problemLocation.valueDesc = a.address;\r\n\r\n\r\n props.updateLocationAddress(a.address, a.location.x, a.location.y, true, props.extent);\r\n //let _wp = webMercatorUtils.lngLatToXY(a.location.x, a.location.y);\r\n //console.log(\"_wp==>\", _wp);\r\n setRun(a);\r\n }}>\r\n \r\n {a.address} \r\n \r\n
\r\n ))}\r\n \r\n {\r\n props.changePage(props.isHome);\r\n }}\r\n >\r\n {props.translate(props.lang, \"SRhyperlinkLabel\")}\r\n {\" \"}\r\n\r\n {props.useTranslation ? (\r\n {\r\n props.changeLang(props.lang);\r\n }}\r\n >\r\n {props.translate(props.lang, \"language\")}\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n {props.useFontOptions ? (\r\n <>\r\n \r\n {\r\n props.changeFont(16);\r\n }} />\r\n {\r\n props.changeFont(17);\r\n }} />\r\n {\r\n props.changeFont(18);\r\n }} />\r\n \r\n \r\n ) : (\r\n \"\"\r\n )}\r\n\r\n
\r\n\r\n\r\n\r\n \r\n );\r\n}","import React, { useEffect, useRef, useState } from \"react\";\r\n\r\nimport { Form, Button, Label, Col, Card } from \"reactstrap\";\r\nimport ReCAPTCHA from \"react-google-recaptcha\";\r\nimport PRInput from \"../common/PRInput\";\r\nimport PRCheckbox from \"../common/PRCheckbox\";\r\nimport HomeSelect from \"./home-auto-select\";\r\nimport HomeQA from \"./home-qa\";\r\nimport HomeAttach from \"./home-attach\";\r\nimport HomeLocation from \"./home-location\";\r\nimport HomeHyperlink from \"./home-hyperlink\";\r\nimport { WebMapView } from \"./home-map\";\r\n\r\nexport default function HomeForm(props) {\r\n // console.log(\"props-home-form\", props);\r\n\r\n const recaptchaRef = useRef(null);\r\n const [step, setStep] = useState(1);\r\n const [screenshot, setScreenshot] = useState(null);\r\n\r\n useEffect(() => {\r\n props.fstate.problemtype.valueDesc = \"\";\r\n props.fstate.problemLocation.valueDesc = \"\";\r\n }, []);\r\n\r\n const submitForm = (e) => {\r\n e.preventDefault();\r\n\r\n props.setBtnSubmitDisabled(true);\r\n // props.loadDiv(\"show\", \"In process...\");\r\n if (props.usecaptcha) {\r\n recaptchaRef.current.execute();\r\n } else {\r\n //console.log(\"Props\",props);\r\n props.submitForm();\r\n }\r\n };\r\n\r\n const onChange = (value) => {\r\n props.submitForm();\r\n };\r\n\r\n const openStep = (e, step) => {\r\n setStep(step);\r\n \r\n if (step === 1) { problemTypeDescription();}\r\n };\r\n\r\n const showPRdescription = () => {\r\n let a = props.problemTypes.find(\r\n (e) => e.problemSid === props.fstate.problemtype.value\r\n );\r\n if (a) {\r\n return a.description;\r\n } else return \"\";\r\n };\r\n\r\n const saveScreenshot = (image) => {\r\n // console.log(image);\r\n setScreenshot(image);\r\n };\r\n\r\n const problemTypeDescription = () => {\r\n if (props.fstate.problemtype.value) {\r\n let list = props.problemTypes.filter(a => a.problemSid === props.fstate.problemtype.value);\r\n\r\n if (list && list[0]) props.fstate.problemtype.valueDesc = list[0].description; else props.fstate.problemtype.valueDesc = \"\";\r\n }\r\n }\r\n\r\n return (\r\n \r\n \r\n {\r\n e.preventDefault();\r\n }}\r\n >\r\n \r\n \r\n\r\n \r\n\r\n {/*\r\n
\r\n\r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {/* \r\n
\r\n );\r\n}\r\n","import React, { useState, useEffect } from \"react\";\r\nimport { sampleState } from \"../common/defaultState\";\r\nimport * as EmailValidator from \"email-validator\";\r\nimport HomeForm from \"./home-form\";\r\n\r\n\r\nfunction Home(props) {\r\n const [phoneRequired, setPhoneRequired] = useState(false);\r\n\r\n const firstNameRef = React.createRef();\r\n\r\n // const [clearFormCheck, setclearFormCheck] = useState(false);\r\n const [btnSubmitDisabled, setBtnSubmitDisabled] = useState(false);\r\n const [fstate, setfState] = useState(sampleState);\r\n\r\n const [imageOption, setImageOption] = useState(\"Y\");\r\n const [prevFile, setPrevFile] = useState(null);\r\n const [imageList, setImageList] = useState([]);\r\n\r\n const [curQ, setCurQ] = useState(null);\r\n const [curA, setCurA] = useState(null);\r\n const [curAall, setCurAall] = useState([]);\r\n\r\n const [allQ, setAllQ] = useState([]);\r\n const [allA, setAllA] = useState([]);\r\n\r\n const [selectedQA, setSelectedQA] = useState([]);\r\n const [isShow, setIsShow] = useState(false);\r\n\r\n const [gisAddreses,setGISAddreses]= useState([]);\r\n \r\n\r\n const getQA = (ProblemSid) => {\r\n props.loadDiv(\"show\");\r\n let currentQ = {};\r\n let allQ = [];\r\n let allA = [];\r\n clearQuestionAnswer();\r\n\r\n window\r\n .fetch(`GetQA?ProblemSid=${ProblemSid}&token=${props.token}`)\r\n .then((resp) => {\r\n return resp.json();\r\n })\r\n .then((data) => {\r\n try {\r\n props.loadDiv(\"hide\");\r\n if (data.status === 0) {\r\n if (data.value.Questions) {\r\n allQ = [...data.value.Questions];\r\n currentQ = allQ.find((e) => e.QuestionSequence === 1);\r\n setCurQ(currentQ);\r\n setAllQ(allQ);\r\n }\r\n if (data.value.Answers) {\r\n allA = [...data.value.Answers];\r\n let currentAall = [];\r\n allA.forEach((e) => {\r\n if (e.QuestionId === currentQ.QuestionId) currentAall.push(e);\r\n });\r\n\r\n setCurAall(currentAall);\r\n setCurA(currentAall[0]);\r\n setAllA(allA);\r\n }\r\n } else {\r\n props.setAlerts(data.message, \"danger\");\r\n }\r\n } catch {}\r\n });\r\n };\r\n\r\n useEffect(() => {\r\n setfState(props.state); \r\n setPhoneRequired(props.state[\"phone\"].required);\r\n if (props.state[\"phone\"].disable) { props.state[\"isFollowUpCall\"].disable = true; }\r\n setIsShow(true);\r\n }, []);\r\n\r\n const setAndValidate = (val, name) => {\r\n\r\n let status = -1;\r\n if (name === \"isFollowUpCall\" && !fstate[\"isFollowUpCall\"].disable) {\r\n \r\n if (val && !phoneRequired) {\r\n fstate[\"phone\"].required = true;\r\n if (!fstate[\"phone\"].value || fstate[\"phone\"].value === \"\") { fstate[\"phone\"].status = 1; }\r\n \r\n }\r\n else {\r\n fstate[\"phone\"].required = phoneRequired;\r\n if (!phoneRequired ) {\r\n // status = 0;\r\n fstate[\"phone\"].status = -1;\r\n var phoneno = new RegExp(/^\\(?([0-9]{3})\\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/);\r\n \r\n if (fstate[\"phone\"].value && fstate[\"phone\"].value != \"\" && !phoneno.test(fstate[\"phone\"].value)) {\r\n fstate[\"phone\"].status = 1;\r\n } else {\r\n if(!fstate[\"phone\"].value || fstate[\"phone\"].value == \"\") fstate[\"phone\"].status = -1;\r\n }\r\n\r\n }\r\n }\r\n \r\n }\r\n if (\r\n name === \"email\" &&\r\n val \r\n &&\r\n val.length > 0\r\n ) {\r\n\r\n if (!EmailValidator.validate(val)) {\r\n status = 1;\r\n } else {\r\n status = 0;\r\n }\r\n } else {\r\n if (name === \"phone\") {\r\n // let phoneno = /^\\(?([0-9]{3})\\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/;\r\n var phoneno = new RegExp(/^\\(?([0-9]{3})\\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/);\r\n // if (!val.match(phoneno)) {\r\n if (val && val!=\"\" && !phoneno.test(val)) {\r\n status = 1;\r\n } else {\r\n status = 0;\r\n }\r\n } else {\r\n if (val) {\r\n status = 0;\r\n } else {\r\n if(fstate[name].required)\r\n status = 1;\r\n }\r\n }\r\n }\r\n \r\n setfState({\r\n ...fstate,\r\n [name]: { ...fstate[name], value: val, status },\r\n });\r\n\r\n if (name === fstate.problemLocation.name) {\r\n // getAddreses(fstate.problemLocation.value)\r\n }\r\n\r\n}\r\n\r\n const getAddreses = (address) => {\r\n props.clearAlerts();\r\n if (address && address.target && address.target.value) {\r\n\r\n fstate.problemLocation.valueDesc = address.target.value;\r\n let _address = address.target.value;\r\n setGISAddreses([]);\r\n // debugger\r\n let addressRequest = {\r\n address: _address,\r\n geocoderUrl: props.gcoderUrl,\r\n addressField: props.addressField,\r\n geomUrl: props.geomUrl,\r\n outSR: props.sp\r\n };\r\n\r\n const requestOptions = {\r\n method: \"POST\",\r\n headers: { \"Content-Type\": \"application/json\" },\r\n body: JSON.stringify(addressRequest),\r\n };\r\n\r\n if (_address) {\r\n window\r\n .fetch(\"GeocodeXY\", requestOptions)\r\n .then((resp) => {\r\n return resp.json();\r\n })\r\n .then((data) => {\r\n if (data.status !== 0) {\r\n {\r\n props.setAlerts(data.message, \"danger\");\r\n setGISAddreses([]);\r\n return;\r\n }\r\n }\r\n //console.log(data);\r\n if (data.value.candidates && data.value.candidates.length == 0) {\r\n props.setAlerts(props.translate(props.lang, \"NoDataFound\"), \"warning\");\r\n setGISAddreses([]);\r\n return;\r\n }\r\n let ids = [];\r\n data.value.candidates.map(a => {\r\n // console.log(a);\r\n ids.push(a.address);\r\n });\r\n let candidates = [];\r\n ids.map(b => {\r\n data.value.candidates.map(a => {\r\n //console.log(a);\r\n if (b === a.address) {\r\n let o = candidates.find(c => c.address == b);\r\n if (!o) {\r\n candidates.push(a);\r\n \r\n }\r\n }\r\n // ids.push(a.address);\r\n });\r\n });\r\n // console.log(all);\r\n\r\n // setGISAddreses(data.value.candidates);\r\n setGISAddreses(candidates);\r\n });\r\n }\r\n else {\r\n setGISAddreses([]);\r\n }\r\n } else {\r\n fstate.problemLocation.valueDesc = \"\";\r\n fstate.problemLocation.value = \"\";\r\n\r\n }\r\n};\r\n\r\n const validate = (e) => {\r\n\r\n const _value =\r\n e.target.type === \"checkbox\" ? e.target.checked : e.target.value;\r\n \r\n if (\r\n e &&\r\n e.target \r\n //&&\r\n // e.target.name === \"email\" &&\r\n //e.target.value// &&\r\n //e.target.value.length > 0\r\n ) {\r\n setAndValidate(_value,e.target.name);\r\n }\r\n\r\n // console.log(fstate);\r\n };\r\n\r\n const onchange = (e) => {\r\n try {\r\n e.preventDefault();\r\n if (e && e.target && e.target.value) getQA(e.target.value);\r\n } catch {}\r\n };\r\n\r\n const nextQA = (e) => {\r\n if (!curA.Answer || curA.Answer ==='Free-form Response') {\r\n return;\r\n }\r\n setfState({\r\n ...fstate,\r\n problemtype: { ...fstate[\"problemtype\"], problemtypeq: false },\r\n });\r\n\r\n const object3 = { ...curQ, ...curA };\r\n let SelectedQA = [...selectedQA];\r\n SelectedQA.push(object3);\r\n\r\n setSelectedQA(SelectedQA);\r\n\r\n let nextQ = allQ.find((a) => a.QuestionId === curA.NextQuestionId);\r\n if (nextQ) {\r\n setCurQ(nextQ);\r\n let nextAall = [];\r\n allA.forEach((a) => {\r\n if (a.QuestionId === nextQ.QuestionId) {\r\n nextAall.push(a);\r\n }\r\n });\r\n setCurAall(nextAall);\r\n setCurA(nextAall[0]);\r\n } else {\r\n setCurQ(null);\r\n setCurA(null);\r\n }\r\n };\r\n\r\n const onSelectAnswer = (e) => {\r\n if (e && e.target && e.target.value) {\r\n if (e.target.tagName === \"INPUT\") {\r\n let answer = curAall.find(\r\n (el) => el.AnswerId.toString() === e.target.id.toString()\r\n );\r\n answer.Answer = e.target.value;\r\n setCurA(answer);\r\n } else {\r\n if (e.target.tagName === \"DATE\") {\r\n debugger;\r\n } else {\r\n let answer = curAall.find(\r\n (el) => el.AnswerId.toString() === e.target.value.toString()\r\n );\r\n setCurA(answer);\r\n }\r\n }\r\n }\r\n };\r\n\r\n const submitForm = () => {\r\n try {\r\n let runCreate = true;\r\n let _state =fstate;\r\n\r\n Object.values(_state).forEach((a) => {\r\n if (a.valid) {\r\n let status = -1;\r\n\r\n\r\n switch (a.name) {\r\n case \"problemtype\":\r\n\r\n break;\r\n case \"email\":\r\n case \"phone\":\r\n if ((a.required && !a.disable && !a.value) || (a.status === 1)) {\r\n a.status = 1;\r\n status = 1; \r\n }\r\n break;;\r\n default: //some fields into state should not validate. They have status equal -1.\r\n if (a.required && !a.disable && !a.value) {\r\n a.status = 1;\r\n status = 1;\r\n }\r\n break;\r\n }\r\n\r\n\r\n //if (a.required && a.status !== 0 && (a.name !== \"problemtype\" || a.name !== \"email\" || a.name !== \"phone\")) {\r\n // a.status = 1;\r\n // status = 1;\r\n //}\r\n\r\n //if ((!a.value && a.status===1) ||( a.value===\"\" && a.status === -1)) {\r\n // a.status = 1;\r\n // status = 1;\r\n //}\r\n\r\n //if (\r\n // (a.value && a.name !== \"email\" && a.name !== \"phone\" && a.value.toString().length > 0 && a.name !== \"problemtype\") ||\r\n // (a.name === \"problemtype\" && a.value !== -1)\r\n //) {\r\n // a.status = 0;\r\n // status = 0;\r\n // }\r\n\r\n //if (a.name === \"problemtype\") {\r\n // a.problemtypeq = false;\r\n // if (a.value === -1 && a.required) {\r\n // a.status = 1;\r\n // status = 1;\r\n // }\r\n // if (a.value !== -1 && curA && curQ) {\r\n // // a.status = 1;\r\n // status = 1;\r\n // a.problemtypeq = true;\r\n // }\r\n //}\r\n\r\n if (status === 1) {\r\n // debugger\r\n runCreate = false;\r\n setfState({\r\n ...fstate,\r\n [a.name]: { ...fstate[a.name], status: 1 },\r\n });\r\n }\r\n }\r\n\r\n });\r\n //console.log(\"fstate=>\", fstate);\r\n //console.log(runCreate);\r\n\r\n \r\n if (runCreate) {\r\n createSR();\r\n } else {\r\n props.loadDiv(\"hide\");\r\n setBtnSubmitDisabled(false);\r\n }\r\n } catch (ex) {\r\n console.log(ex);\r\n props.loadDiv(\"hide\");\r\n setBtnSubmitDisabled(false);\r\n }\r\n };\r\n\r\n const createSR = () => {\r\n try {\r\n props.loadDiv(\"show\", \"In process...\");\r\n setBtnSubmitDisabled(false);\r\n let qa = [];\r\n selectedQA.forEach((e) => {\r\n qa.push({ AnswerId: e.AnswerId, AnswerValue: e.Answer });\r\n });\r\n\r\n let phone = fstate.phone.value;\r\n if (phone) {\r\n if (phone.indexOf(\"-\") === -1 && phone.Length === 10) {\r\n phone =\r\n phone.substring(0, 3) +\r\n \"-\" +\r\n phone.substring(3, 3) +\r\n \"-\" +\r\n phone.substring(6, 4);\r\n }\r\n } else {\r\n phone = \"\";\r\n }\r\n // let emailRequestVal = fstate.emailRequest.value ? \"N\" : \"Y\"; //if checked => no emailing\r\n \r\n\r\n let SRequest = {\r\n ProblemSid: fstate.problemtype.value ? fstate.problemtype.value : \"\",\r\n //Address: fstate.address.value ? fstate.address.value : \"\",\r\n Address: fstate.problemLocation.value\r\n ? fstate.problemLocation.value\r\n : \"\",\r\n AptNum: fstate.addressaptnum.value ? fstate.addressaptnum.value : \"\",\r\n City: fstate.addresscity.value ? fstate.addresscity.value : \"\",\r\n X: fstate.coordinatesx.value ? fstate.coordinatesx.value : \"\",\r\n Y: fstate.coordinatesy.value ? fstate.coordinatesy.value : \"\",\r\n Zip: fstate.addresszipcode.value ? fstate.addresszipcode.value : \"\",\r\n InitiatedByApp: props.initiatedByApp ? props.initiatedByApp : \"\",\r\n CallerFirstName: fstate.firstName.value ? fstate.firstName.value : \"\",\r\n CallerLastName: fstate.lastName.value ? fstate.lastName.value : \"\",\r\n CallerHomePhone: phone, // fstate.phone.value ? fstate.phone.value : \"\",\r\n CallerEmail: fstate.email.value ? fstate.email.value : \"\",\r\n //Location: fstate.problemLocation.value\r\n // ? fstate.problemLocation.value\r\n // : \"\",\r\n Location: fstate.locationDetails.value\r\n ? fstate.locationDetails.value\r\n : \"\",\r\n\r\n //Details: fstate.locationDetails.value\r\n // ? fstate.locationDetails.value\r\n // : \"\",\r\n Details: fstate.additionalDetail.value\r\n ? fstate.additionalDetail.value\r\n : \"\",\r\n\r\n //Comments: fstate.additionalDetail.value\r\n // ? fstate.additionalDetail.value\r\n // : \"\",\r\n // emailRequest: emailRequestVal, field name \"emailRequest\" is not exist. I populate Text1\r\n // Text1: emailRequestVal,\r\n emailRequest: fstate.emailRequest.value ? fstate.emailRequest.value: true,\r\n CallerIsFollowUpCall: fstate.isFollowUpCall.value\r\n ? fstate.isFollowUpCall.value\r\n : false,\r\n Answers: qa,\r\n token:props.token\r\n };\r\n\r\n const requestOptions = {\r\n method: \"POST\",\r\n headers: { \"Content-Type\": \"application/json\" },\r\n body: JSON.stringify(SRequest),\r\n };\r\n\r\n window\r\n .fetch(\"CreateSR\", requestOptions)\r\n .then((resp) => {\r\n return resp.json();\r\n })\r\n .then((data) => {\r\n try {\r\n\r\n\r\n if (data.status === 0) {\r\n\r\n let message = `Service Request ${data.value} `;\r\n let messageType = \"success\";\r\n\r\n //-----validate preference status\r\n if (data.statusPreferences !== 0) {\r\n message += `${data.messagePreferences}`;\r\n messageType=\"warning\";\r\n }\r\n //----validate emeil status\r\n if (data.statusEmail !== 0) {\r\n message += `${data.messageEmail}`;\r\n messageType = \"warning\";\r\n }\r\n\r\n if (fstate.imageList && fstate.imageList.length > 0) {\r\n uploadAttachments(data.value, message, messageType);\r\n } else {\r\n props.setAlerts(message, messageType);\r\n clearForm();\r\n props.loadDiv(\"hide\");\r\n try { window.scrollTo(0, 0); }catch{ }\r\n\r\n }\r\n\r\n } else {\r\n props.setAlerts(data.message, \"danger\");\r\n props.loadDiv(\"hide\");\r\n }\r\n } catch {}\r\n // props.loadDiv(\"hide\");\r\n });\r\n } catch (ex) {\r\n console.log(ex);\r\n props.loadDiv(\"hide\");\r\n }\r\n };\r\n\r\n const uploadAttachments = (SRequestId, message, messageType ) => {\r\n\r\n let index = 0;\r\n fstate.imageList.forEach((a) => {\r\n try {\r\n let vFD = new FormData();\r\n let file= a.file;\r\n\r\n vFD.append('uploadFile', file);\r\n vFD.append('name', a.filename);\r\n vFD.append('requestId', SRequestId);\r\n vFD.append('token', props.token);\r\n // vFD.append('token', this.model.token);\r\n\r\n const h = {}; //headers\r\n h.Accept = 'application/json';\r\n\r\n const requestOptions = {\r\n method: \"POST\",\r\n headers: h,//{ \"Content-Type\": \"application/json\" },\r\n body: vFD,\r\n };\r\n\r\n window\r\n .fetch(\"UploadFileApi\", requestOptions)\r\n .then((resp) => {\r\n return resp.json();\r\n })\r\n .then((data) => {\r\n try {\r\n if (data.status === 0) {\r\n // console.log(data.value);\r\n ++index;\r\n if (index === fstate.imageList.length) {\r\n //props.setAlerts(`Service Request ${SRequestId}`, \"success\");\r\n props.setAlerts(message, messageType);\r\n clearForm();\r\n props.loadDiv(\"hide\");\r\n }\r\n } else {\r\n message += `${data.message}`;\r\n messageType = \"warning\";\r\n props.setAlerts(message, messageType);\r\n // props.setAlerts(`On attach ${a.filename} to Service Request ${SRequestId}. ${data.message}`, \"danger\");\r\n props.loadDiv(\"hide\");\r\n }\r\n } catch (e) {\r\n message += `${e}`;\r\n messageType = \"warning\";\r\n props.setAlerts(message, messageType);\r\n //props.setAlerts(`On attach ${a.filename} to Service Request ${SRequestId}. ${e}`, \"danger\");\r\n props.loadDiv(\"hide\");\r\n }\r\n \r\n });\r\n\r\n\r\n } catch (e) {\r\n props.setAlerts(`On attach ${a.filename} to Service Request ${SRequestId}. ${e}`, \"danger\");\r\n props.loadDiv(\"hide\");\r\n }\r\n });\r\n\r\n \r\n }\r\n\r\n const clearQuestionAnswer = () => {\r\n setCurQ(null);\r\n setCurA(null);\r\n setAllQ(null);\r\n setCurAall([]);\r\n setSelectedQA([]);\r\n };\r\n\r\n const clearImages = () => {\r\n setImageOption(\"N\");\r\n setPrevFile(null);\r\n setTimeout(() => {\r\n let _imageList = [];\r\n setfState({\r\n ...fstate,\r\n imageList: _imageList,\r\n });\r\n setImageList([]);\r\n }, 500);\r\n };\r\n\r\n const clearValues = () => {\r\n let _state = fstate;\r\n Object.values(_state).forEach((a) => {\r\n a.value = \"\";\r\n a.status = -1;\r\n setfState({\r\n ...fstate,\r\n [a.name]: { ...fstate[a.name], status: a.status },\r\n });\r\n });\r\n };\r\n\r\n const clearForm = (e) => {\r\n props.loadDiv(\"show\", \"In process...\");\r\n\r\n clearQuestionAnswer();\r\n clearImages();\r\n clearValues();\r\n fstate.problemtype.valueDesc = \"\";\r\n fstate.problemLocation.valueDesc = \"\";\r\n\r\n props.loadDiv(\"hide\");\r\n props.showHome();\r\n //setclearFormCheck(true);\r\n };\r\n\r\n const attach = (e) => {\r\n let blob = URL.createObjectURL(e.target.files[0]);\r\n\r\n let img = {\r\n filename: e.target.files[0].name,\r\n type: e.target.files[0].type,\r\n data: blob,\r\n preview: true,\r\n guid: props.Guid(),\r\n file: e.target.files[0]\r\n };\r\n\r\n let _imageList = fstate.imageList ? [...fstate.imageList] : [];\r\n _imageList.push(img);\r\n\r\n setfState({\r\n ...fstate,\r\n imageList: _imageList,\r\n });\r\n setImageList(_imageList);\r\n };\r\n\r\n const deleteAttach = (e, guid) => {\r\n let _imageList = fstate.imageList ? [...fstate.imageList] : [];\r\n let img = [];\r\n _imageList.forEach((a) => {\r\n if (a.guid !== guid) img.push(a);\r\n else {\r\n if (a.preview === false) setPrevFile(null);\r\n }\r\n });\r\n setfState({\r\n ...fstate,\r\n imageList: img,\r\n });\r\n setImageList(img);\r\n };\r\n const previewAttach = (e, guid) => {\r\n let img = null;\r\n let _imageList = fstate.imageList ? [...fstate.imageList] : [];\r\n setPrevFile(null);\r\n _imageList.forEach((a) => {\r\n if (a.guid === guid) {\r\n img = a;\r\n a.preview = !a.preview;\r\n } else {\r\n a.preview = true;\r\n }\r\n });\r\n\r\n setImageList(_imageList);\r\n if (img.preview) setPrevFile(null);\r\n else setPrevFile(img.data);\r\n };\r\n\r\n const onChangeImageOption = (e) => {\r\n if (e && e.target && e.target.id) {\r\n let opt = e.target.id.replace(\"option\", \"\");\r\n setImageOption(opt);\r\n if (opt === \"N\") {\r\n clearImages();\r\n }\r\n }\r\n };\r\n\r\n const onSearchChange = (selectedOption) => {\r\n if (selectedOption) {\r\n setfState({\r\n ...fstate,\r\n problemLocation: {\r\n ...fstate.problemLocation,\r\n value: selectedOption.label,\r\n },\r\n coordinatesx: { ...fstate.coordinatesx, value: selectedOption.x },\r\n coordinatesy: { ...fstate.coordinatesy, value: selectedOption.y },\r\n });\r\n } else {\r\n setfState({\r\n ...fstate,\r\n problemLocation: {\r\n ...fstate.problemLocation,\r\n value: \"\",\r\n },\r\n coordinatesx: { ...fstate.coordinatesx, value: 0.0 },\r\n coordinatesy: { ...fstate.coordinatesy, value: 0.0 },\r\n });\r\n }\r\n };\r\n\r\n const fetchData = (inputVal, callback) => {\r\n setfState({\r\n ...fstate,\r\n problemLocation: {\r\n ...fstate.problemLocation,\r\n value: \"\",\r\n },\r\n coordinatesx: { ...fstate.coordinatesx, value: 0.0 },\r\n coordinatesy: { ...fstate.coordinatesy, value: 0.0 },\r\n });\r\n\r\n if (!inputVal) {\r\n return callback([]);\r\n } else {\r\n setTimeout(() => {\r\n let address = inputVal;\r\n\r\n const requestOptions = {\r\n method: \"POST\",\r\n headers: { \"Content-Type\": \"application/json\" },\r\n body: JSON.stringify({ address }),\r\n };\r\n\r\n window\r\n .fetch(\"GeocodeXY\", requestOptions)\r\n .then((resp) => {\r\n return resp.json();\r\n })\r\n .then((data) => {\r\n try {\r\n if (data.status === 0) {\r\n if (data && data.value) {\r\n let js = JSON.parse(data.value);\r\n let items = js.candidates;\r\n if (items && items.length > 0) {\r\n const optionsList = items.map((i) => ({\r\n label: i.address,\r\n x: i.location[\"x\"],\r\n y: i.location[\"y\"],\r\n score: i.score,\r\n }));\r\n\r\n setTimeout(() => {\r\n return callback(optionsList);\r\n }, 500);\r\n } else {\r\n props.setAlerts(data.message, \"danger\");\r\n }\r\n }\r\n }\r\n } catch {}\r\n });\r\n });\r\n }\r\n };\r\n\r\n const updateLocationAddress = (address, x, y, maprefresh, extent) => {\r\n \r\n setGISAddreses([]);\r\n setfState({\r\n ...fstate,\r\n problemLocation: {\r\n ...fstate.problemLocation,\r\n value: address,\r\n valueDesc: address\r\n },\r\n coordinatesx: { ...fstate.coordinatesx, value: x },\r\n coordinatesy: { ...fstate.coordinatesy, value: y },\r\n //x: { ...fstate.x, value: longitude },//-112.82845,49.69737\r\n //y: { ...fstate.y, value: latitude },\r\n //maprefresh:{...fstate.maprefresh,\r\n // value:(maprefresh)?(props.Guid()):fstate.maprefresh.value,\r\n // extent:extent}\r\n //maprefresh:{...fstate.maprefresh,\r\n // value:(maprefresh)?(props.Guid()):fstate.maprefresh.value,\r\n // extent:extent}\r\n });\r\n // console.log(fstate);\r\n // setMapRefresh(props.Guid());\r\n //console.log(maprefresh);\r\n\r\n };\r\n\r\n\r\n\r\n return (\r\n <>\r\n {isShow ? (\r\n \r\n \r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n\r\n\r\n\r\n {step === 1 ? (\r\n <>\r\n {props.fstate.reportInfoOnTop.disable === false ? (\r\n \r\n \r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n\r\n\r\n \r\n
\r\n\r\n \r\n\r\n
\r\n {\r\n if (\r\n props.fstate.problemLocation.value &&\r\n props.fstate.problemtype.value && ((props.fstate.locationDetails.required && props.fstate.locationDetails.value) || (!props.fstate.locationDetails.required)) && \r\n !(props.curA && props.curQ)\r\n )\r\n openStep(e, 2);\r\n }}\r\n >\r\n {props.translate(props.lang, \"Next\")}\r\n \r\n
\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n\r\n {step === 2 ? (\r\n <>\r\n \r\n
\r\n \r\n
\r\n \r\n {props.translate(props.lang, \"TypeOfProblemLabel\")}\r\n
\r\n \r\n {showPRdescription()}\r\n
\r\n \r\n
\r\n \r\n {props.translate(props.lang, \"LocationOfProblemLabel\")}\r\n
\r\n \r\n {\" \"}\r\n {props.fstate.problemLocation.value}\r\n
\r\n \r\n {/*
\r\n \r\n {\r\n openStep(e, 1);\r\n }}\r\n >\r\n {props.translate(props.lang, \"Back\")}\r\n \r\n {\r\n openStep(e, 3);\r\n }}\r\n >\r\n {props.translate(props.lang, \"Next\")}\r\n \r\n
\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n\r\n {step === 3 ? (\r\n <>\r\n \r\n
\r\n \r\n
\r\n \r\n {props.translate(props.lang, \"RequestSummaryLabel\")}\r\n
\r\n \r\n
\r\n \r\n {props.translate(props.lang, \"TypeOfProblemLabel\")}\r\n
\r\n \r\n {showPRdescription()}\r\n
\r\n\r\n \r\n {\r\n openStep(e, 1);\r\n }}\r\n >\r\n Edit\r\n \r\n {/*
\r\n \r\n
\r\n \r\n {props.translate(props.lang, \"LocationOfProblemLabel\")}\r\n
\r\n \r\n {\" \"}\r\n {props.fstate.problemLocation.value}\r\n
\r\n \r\n {\r\n openStep(e, 1);\r\n }}\r\n >\r\n Edit\r\n \r\n {/*
\r\n \r\n \r\n
\r\n\r\n {props.fstate.locationDetails.value ? (\r\n \r\n \r\n
{\" \"}\r\n \r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n {props.fstate.additionalDetail.value ? (\r\n \r\n {props.translate(\r\n props.lang,\r\n \"LocationDetailLabel\"\r\n )}\r\n
\r\n \r\n {props.translate(\r\n props.lang,\r\n props.fstate.locationDetails.value\r\n )}\r\n
\r\n \r\n {\r\n openStep(e, 1);\r\n }}\r\n >\r\n Edit\r\n \r\n
\r\n \r\n
\r\n ) : (\r\n \"\")}\r\n\r\n\r\n\r\n {(props.fstate.imageList && props.fstate.imageList.length>0) ? (\r\n \r\n {props.translate(\r\n props.lang,\r\n \"AddDetailLabel\"\r\n )}\r\n
\r\n \r\n {props.translate(\r\n props.lang,\r\n props.fstate.additionalDetail.value\r\n )}\r\n
\r\n \r\n {\r\n openStep(e, 2);\r\n }}\r\n >\r\n Edit\r\n \r\n
\r\n \r\n
\r\n ) : (\r\n \"\")}\r\n\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n {props.translate(\r\n props.lang,\r\n \"AttachmentsLabel\"\r\n )}\r\n
\r\n \r\n {props.fstate.imageList.map((a) => (\r\n \r\n 
\r\n \r\n ))}\r\n
\r\n \r\n {\r\n openStep(e, 2);\r\n }}\r\n >\r\n Edit\r\n \r\n
\r\n */}\r\n
*/}\r\n \r\n
{\" \"}\r\n \r\n
\r\n {/**/}\r\n
*/}\r\n {/*\r\n
\r\n \r\n
\r\n \r\n
\r\n {/* */}\r\n
*/}\r\n \r\n
\r\n \r\n
\r\n {/* \r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n {/* {\r\n openStep(e, 2);\r\n }}\r\n >\r\n {props.translate(props.lang, \"Back\")}\r\n */}\r\n {\r\n \r\n submitForm(e); \r\n }}\r\n >\r\n {props.translate(props.lang, \"Submit\")}\r\n \r\n {\r\n setStep(1);\r\n props.clearForm(e);\r\n }}\r\n >\r\n {props.translate(props.lang, \"Clear\")}\r\n \r\n
\r\n {props.usecaptcha ? (\r\n \r\n \r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n \r\n \r\n \r\n {\r\n evt.preventDefault();\r\n props.onSubmit();\r\n }}\r\n >\r\n \r\n \r\n \r\n \r\n \r\n
\r\n );\r\n}\r\n","import React, { useEffect } from \"react\";\r\n\r\nexport default function StatusFormTableTd(props) {\r\n useEffect(() => {}, []);\r\n\r\n return (\r\n <>\r\n {props.value.map((a) => (\r\n (!a.disable) ?(\r\n | {props.translate(props.lang, a.label)} | :''\r\n ))}\r\n
|---|
\r\n
\r\n );\r\n}\r\n","export const LOCALES = {\r\n EHGLISH: 'en',\r\n FRENCH: 'fr'\r\n};","import { LOCALES } from '../locales';\r\nexport default {\r\n [LOCALES.EHGLISH]: {\r\n 'hello': 'Hello',\r\n \"Continue\": \"Continue\"\r\n }\r\n}","import { LOCALES } from '../locales';\r\nexport default {\r\n [LOCALES.FRENCH]: {\r\n 'hello': 'Bonjour',\r\n \"Continue\": \"Continuer\"\r\n\r\n }\r\n}","import en from './en-US';\r\nimport fr from './fr-CA';\r\n\r\nexport default {\r\n ...en,\r\n ...fr,\r\n}","import React, { useState, useEffect } from \"react\";\r\nimport \"./App.css\";\r\nimport Home from \"./home/home\";\r\nimport StatusDetails from \"./status/status-details\";\r\nimport { UncontrolledAlert } from \"reactstrap\";\r\n//import { sampleState } from \"./common/defaultState\"; //mock-data\r\nimport { /*I18nProvider,*/ LOCALES } from './i18n';\r\n//import { FormattedMessage } from 'react-intl';\r\n//import t from './i18n/translate';\r\n\r\nexport default function App() {\r\n const [alerts, setAlert] = useState([]);\r\n\r\n const [state, setState] = useState({}); // useState(sampleState);\r\n //const [lang, setLang] = useState(\"en\");\r\n const [lang, setLang] = useState(LOCALES.EHGLISH);\r\n const [en, setEN] = useState({});\r\n const [fr, setFR] = useState({});\r\n\r\n const [useTitle, setuseTitle] = useState(false);\r\n const [recaptchaSiteKey, setRecaptchaSiteKey] = useState(\"\");\r\n const [usecaptcha, setUsecaptcha] = useState(false);\r\n const [useTranslation, setUseTranslation] = useState(false);\r\n const [useFontOptions, setUseFontOptions] = useState(false);\r\n const [initiatedByApp, setInitiatedByApp] = useState(false);\r\n\r\n const [problemTypes, setProblemTypes] = useState([]);\r\n const [problemTypesCommon, setProblemTypesCommon] = useState([]);\r\n\r\n const [isHome, setIsHome] = useState(true);\r\n const [isStart, setIsStart] = useState(false);\r\n const [token, setToken] = useState(\"\");\r\n const [extent, setExtent] = useState({});\r\n const [sp, setSp] = useState(-1);\r\n\r\n\r\n //==========\r\n const [geomUrl, setGeomUrl] = useState(\"\");\r\n const [geomToken, setGeomToken] = useState(\"\");\r\n const [gcoderUrl, setGeoCoderUrl] = useState(\"\");\r\n const [gcoderToken, setGeoCoderToken] = useState(\"\");\r\n const [addressField, setAddressField] = useState(\"\");\r\n\r\n const [geomTokenRequired, setGeomTokenRequired] = useState(false);\r\n const [gcoderTokenRequired, setGcoderTokenRequired] = useState(false);\r\n const [fontSize, setFontSize] = useState(16);\r\n const [mapZoom, setMapZoom] = useState(20);\r\n\r\n\r\n\r\n useEffect(() => {\r\n loadDiv(\"show\");\r\n getConfig();\r\n // getProblems();\r\n }, []);\r\n\r\n const Guid = () => {\r\n return (\r\n \"uuid-\" +\r\n (new Date().getTime().toString(16) +\r\n Math.floor(1e7 * Math.random()).toString(16))\r\n );\r\n };\r\n\r\n const setAlerts = (msg, type) => {\r\n if (msg) setAlert([{ guid: Guid(), info: msg, color: type }]);\r\n };\r\n\r\n const clearAlerts = () => {\r\n setAlert([]);\r\n };\r\n\r\n const loadDiv = (option, txt) => {\r\n //block/none\r\n document.getElementById(\"overlay\").style.display =\r\n option === \"show\" ? \"block\" : \"none\";\r\n document.getElementById(\"loadmsg\").innerHTML = txt ? txt : \"Loading...\";\r\n };\r\n\r\n const changeLang = (ev) => {\r\n setLang(ev === \"en\" ? LOCALES.FRENCH : LOCALES.EHGLISH);\r\n // setLang(LOCALES.FRENCH);\r\n\r\n };\r\n\r\n const changePage = (ev) => {\r\n loadDiv(\"hide\");\r\n setIsHome(ev ? false : true);\r\n clearAlerts();\r\n };\r\n\r\n const showHome = () => {\r\n setIsHome(null);\r\n state.problemtype.valueDesc = \"\";\r\n state.problemLocation.valueDesc = \"\";\r\n // console.log(\"home state=>\",state);\r\n //state.problemtype.valueDesc = \"\";\r\n setIsHome(true);\r\n }\r\n\r\n const translate = (_lang, name) => {\r\n let result = \"\";\r\n try {\r\n if (_lang === \"en\") {\r\n result = en[name] ? en[name] : name;\r\n } else {\r\n result = fr[name] ? fr[name] : name;\r\n }\r\n } catch {\r\n result = name;\r\n }\r\n return result;\r\n };\r\n\r\n const getProblems = (t) => {\r\n window\r\n .fetch(`GetProblems?token=${t}`)\r\n .then((resp) => {\r\n return resp.json();\r\n })\r\n .then((data) => {\r\n loadDiv(\"hide\");\r\n if (data.status === 0) {\r\n setProblemTypesCommon(data.valueCommon);\r\n setProblemTypes(data.value);\r\n\r\n } else {\r\n setAlerts(data.message, \"danger\");\r\n }\r\n });\r\n };\r\n\r\n const getConfig = () => {\r\n window\r\n .fetch(\"GetConfig\")\r\n .then((resp) => {\r\n return resp.json();\r\n })\r\n .then((data) => {\r\n if (data.status === 0) {\r\n let trans = JSON.parse(data.translation);\r\n setEN(trans[\"en\"]);\r\n setFR(trans[\"fr\"]);\r\n setuseTitle(data.useTitle);\r\n setInitiatedByApp(data.initiatedByApp);\r\n setUseTranslation(data.useTranslation);\r\n setUseFontOptions(data.useFontOptions);\r\n setUsecaptcha(data.usecaptcha);\r\n setRecaptchaSiteKey(data.recaptchaSiteKey);\r\n setToken(data.token);\r\n setExtent(data.extent);\r\n setSp(data.sp);\r\n setGeomUrl(data.geomurl);\r\n setGeomToken(data.geomt);\r\n setGeoCoderUrl(data.gcodeurl);\r\n setGeoCoderToken(data.gcodet);\r\n setAddressField(data.geoCoderAddressField);\r\n setMapZoom(data.mapZoom);\r\n\r\n setGeomTokenRequired(data.geoms);\r\n setGcoderTokenRequired(data.gcodes);\r\n \r\n\r\n\r\n getProblems(data.token);\r\n\r\n let values = data.value;\r\n\r\n let nValues = {};\r\n Object.values(values).forEach((v) => {\r\n let o = { ...v, value: \"\", status: -1 };\r\n if (o.name === \"problemLocation\") o = { ...v, value: \"\", valueDesc:\"\",status: -1 };//problemLocation.valueDesc \r\n nValues[o.name] = o;\r\n \r\n // console.log(o);\r\n });\r\n nValues[\"maprefresh\"] = { name: \"maprefresh\", value: \"-1\", extent: {} };\r\n //maprefresh\r\n nValues[\"x\"] = { name: \"x\", value: null };\r\n nValues[\"y\"] = { name: \"y\", value: null };\r\n \r\n\r\n setState(nValues);\r\n // console.log(nValues);\r\n\r\n //loadDiv(\"hide\");\r\n setIsStart(true);\r\n\r\n // console.log(\"isStart\",isStart);\r\n // console.log(\"isHome\", isHome);\r\n // console.log(\"problemTypes\",problemTypes);\r\n // console.log(\"problemTypes.length>0\",problemTypes.length>0);\r\n \r\n\r\n } else {\r\n setAlerts(data.message, \"danger\"); loadDiv(\"hide\");\r\n }\r\n });\r\n };\r\n\r\n const changeFont = (size) => {\r\n \r\n setFontSize(size);\r\n document.getElementById(\"appFont\").style.fontSize = `${size}px`;\r\n }\r\n\r\n return (\r\n <>\r\n \r\n \r\n
\r\n\r\n {showSearch && fstate ? (\r\n \r\n {/* */}\r\n {/* {t('language')} \r\n {t('edit', {path:test})} */}\r\n */}\r\n
\r\n \r\n );\r\n}\r\n","// In production, we register a service worker to serve assets from local cache.\r\n\r\n// This lets the app load faster on subsequent visits in production, and gives\r\n// it offline capabilities. However, it also means that developers (and users)\r\n// will only see deployed updates on the \"N+1\" visit to a page, since previously\r\n// cached resources are updated in the background.\r\n\r\n// To learn more about the benefits of this model, read https://goo.gl/KwvDNy.\r\n// This link also includes instructions on opting out of this behavior.\r\n\r\nconst isLocalhost = Boolean(\r\n window.location.hostname === 'localhost' ||\r\n // [::1] is the IPv6 localhost address.\r\n window.location.hostname === '[::1]' ||\r\n // 127.0.0.1/8 is considered localhost for IPv4.\r\n window.location.hostname.match(\r\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\r\n )\r\n);\r\n\r\nexport default function register () {\r\n if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\r\n // The URL constructor is available in all browsers that support SW.\r\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location);\r\n if (publicUrl.origin !== window.location.origin) {\r\n // Our service worker won't work if PUBLIC_URL is on a different origin\r\n // from what our page is served on. This might happen if a CDN is used to\r\n // serve assets; see https://github.com/facebookincubator/create-react-app/issues/2374\r\n return;\r\n }\r\n\r\n window.addEventListener('load', () => {\r\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\r\n\r\n if (isLocalhost) {\r\n // This is running on localhost. Lets check if a service worker still exists or not.\r\n checkValidServiceWorker(swUrl);\r\n } else {\r\n // Is not local host. Just register service worker\r\n registerValidSW(swUrl);\r\n }\r\n });\r\n }\r\n}\r\n\r\nfunction registerValidSW (swUrl) {\r\n navigator.serviceWorker\r\n .register(swUrl)\r\n .then(registration => {\r\n registration.onupdatefound = () => {\r\n const installingWorker = registration.installing;\r\n installingWorker.onstatechange = () => {\r\n if (installingWorker.state === 'installed') {\r\n if (navigator.serviceWorker.controller) {\r\n // At this point, the old content will have been purged and\r\n // the fresh content will have been added to the cache.\r\n // It's the perfect time to display a \"New content is\r\n // available; please refresh.\" message in your web app.\r\n console.log('New content is available; please refresh.');\r\n } else {\r\n // At this point, everything has been precached.\r\n // It's the perfect time to display a\r\n // \"Content is cached for offline use.\" message.\r\n console.log('Content is cached for offline use.');\r\n }\r\n }\r\n };\r\n };\r\n })\r\n .catch(error => {\r\n console.error('Error during service worker registration:', error);\r\n });\r\n}\r\n\r\nfunction checkValidServiceWorker (swUrl) {\r\n // Check if the service worker can be found. If it can't reload the page.\r\n fetch(swUrl)\r\n .then(response => {\r\n // Ensure service worker exists, and that we really are getting a JS file.\r\n if (\r\n response.status === 404 ||\r\n response.headers.get('content-type').indexOf('javascript') === -1\r\n ) {\r\n // No service worker found. Probably a different app. Reload the page.\r\n navigator.serviceWorker.ready.then(registration => {\r\n registration.unregister().then(() => {\r\n window.location.reload();\r\n });\r\n });\r\n } else {\r\n // Service worker found. Proceed as normal.\r\n registerValidSW(swUrl);\r\n }\r\n })\r\n .catch(() => {\r\n console.log(\r\n 'No internet connection found. App is running in offline mode.'\r\n );\r\n });\r\n}\r\n\r\nexport function unregister () {\r\n if ('serviceWorker' in navigator) {\r\n navigator.serviceWorker.ready.then(registration => {\r\n registration.unregister();\r\n });\r\n }\r\n}\r\n","import 'bootstrap/dist/css/bootstrap.css';\r\nimport React from 'react';\r\n//import i18n from './i18n/i18n';\r\nimport ReactDOM from 'react-dom';\r\nimport { BrowserRouter } from 'react-router-dom';\r\nimport App from './App';\r\nimport registerServiceWorker from './registerServiceWorker';\r\n\r\nimport 'bootstrap/dist/css/bootstrap.min.css';\r\nimport 'react-bootstrap-typeahead/css/Typeahead.css';\r\nimport './index.css';\r\n\r\nconst baseUrl = document.getElementsByTagName('base')[0].getAttribute('href');\r\nconst rootElement = document.getElementById('root');\r\n\r\nReactDOM.render(\r\n \r\n \r\n
\r\n\r\n \r\n {alerts.map((e) => (\r\n {e.info} \r\n ))}\r\n
\r\n\r\n <>\r\n {(isStart && isHome && problemTypes && problemTypes.length > 0) ? (\r\n