\r\n \r\n
\r\n )\r\n}\r\nconst LoadingSpinner = () => \r\n \r\n
\r\n)","const submitterRegex = new RegExp('Submitter_([A-Za-z]+)')\r\n\r\nconst getRoles = user => {\r\n if (user && user.profile && user.profile.role) {\r\n const roles = user.profile.role\r\n if (Array.isArray(roles)) {\r\n return roles.join(',')\r\n } else {\r\n return roles\r\n }\r\n } else {\r\n return ''\r\n }\r\n}\r\n\r\nconst checkRole = (role, roles) => {\r\n if (roles && role) {\r\n return roles.includes(role)\r\n } else {\r\n return false\r\n }\r\n}\r\n\r\nconst getAgencyCode = (roles) => {\r\n if (roles && isSubmissionRole(roles)) {\r\n const submitterRole = roles.match(submitterRegex)\r\n if (submitterRole && submitterRole.length === 2) {\r\n return submitterRole[1]\r\n }\r\n return submitterRole\r\n } else {\r\n return null\r\n }\r\n}\r\n\r\nconst isSubmissionRole = roles => {\r\n if (roles) {\r\n return !!roles.includes('Submitter')\r\n }\r\n return false\r\n}\r\n\r\nconst isReviewerRole = roles => {\r\n if (roles) {\r\n return !!roles.includes('Form_Reviewer')\r\n }\r\n return false\r\n}\r\n\r\nconst hasPrintAccess = roles => {\r\n if (roles) {\r\n return !!roles.includes('Print')\r\n }\r\n return false\r\n}\r\n\r\n\r\nconst hasAccessToManageSampleResults = roles =>\r\n checkRole('Industry', roles) ||\r\n checkRole('DataEntry', roles) ||\r\n checkRole('Form_Reviewer', roles) ||\r\n isSubmissionRole(roles)\r\n\r\nconst hasAccessToAdmin = roles => checkRole('Administrator', roles)\r\n\r\nconst hasAccessToAgency = roles => checkRole('Agency', roles)\r\n\r\nconst hasAccessToPWS = roles => checkRole(\"PWSAccess\", roles)\r\n\r\nexport {\r\n getRoles,\r\n checkRole,\r\n hasAccessToManageSampleResults,\r\n hasAccessToAdmin,\r\n hasAccessToAgency,\r\n getAgencyCode,\r\n isReviewerRole,\r\n hasAccessToPWS,\r\n hasPrintAccess\r\n}\r\n","import React, { useEffect, createContext, useState, useCallback } from 'react'\r\nimport { AuthProvider, useAuth, UserManager } from 'oidc-react'\r\n\r\nimport { getRoles } from '../../utils/user/permissions'\r\nimport withConfig from '../wrappers/withConfig'\r\nimport dayjs from 'dayjs'\r\n// import settings from '../../utils/constants/userSettings'\r\n\r\nconst UserContext = createContext(null)\r\n\r\nconst AppUserContextProvider = withConfig(({ loadingUser, children }) => {\r\n // const { userManager: client, userData: user } = useAuth()\r\n const { userManager: client } = useAuth()\r\n const [roles, setRoles] = useState(\"\")\r\n const [ user, setUser ] = useState(null)\r\n \r\n const [idleTime, setIdleTime] = useState(dayjs().add(60, 'minute'))\r\n \r\n const resetIdleTime = () => {\r\n setIdleTime(dayjs().add(60, 'minute'))\r\n }\r\n\r\n // on app load, set the idle time onClick updater on the document\r\n useEffect(() => {\r\n document.addEventListener('click', resetIdleTime)\r\n return () => {\r\n document.removeEventListener('click', resetIdleTime)\r\n }\r\n }, [])\r\n\r\n const checkIdleState = useCallback(async () => {\r\n const now = dayjs()\r\n const idleTimeRemaining = idleTime.diff(now, 'minute')\r\n if (idleTimeRemaining < 1) {\r\n await client.signoutRedirect()\r\n }\r\n }, [user, client, idleTime])\r\n\r\n // look at the idle state and logout when idle time is less than 1 minute\r\n useEffect(() => {\r\n // check every 3 seconds\r\n const interval = setInterval(() => {\r\n checkIdleState()\r\n }, 3000)\r\n // clear the interval when the user changes or the page is refreshed\r\n return () => {\r\n clearInterval(interval)\r\n }\r\n }, [checkIdleState])\r\n\r\n // when the user changes, update roles list\r\n useEffect(() => {\r\n setRoles(getRoles(user))\r\n }, [user])\r\n\r\n useEffect(() => {\r\n const getUser = async () => {\r\n try {\r\n const u = await client.getUser()\r\n setUser(u)\r\n } catch (e) {\r\n console.log('UserContext: Error getting user -- ', e)\r\n }\r\n }\r\n if (client) {\r\n getUser()\r\n }\r\n }, [client])\r\n\r\n return (\r\n \r\n
\r\n \r\n \r\n {dashboard.DashboardName} \r\n
\r\n \r\n {dashboard.DashboardDescription}\r\n
\r\n \r\n Logout\r\n
\r\n )\r\n}\r\n\r\nexport default LogoutButton","import React from 'react'\r\nimport withConfig from '../../wrappers/withConfig'\r\n\r\nconst ManageUsersButton = withConfig(({config}) => {\r\n const { CONFIGURED_URLS } = config\r\n return (\r\n \r\n \r\n Manage Users\r\n \r\n
\r\n )\r\n})\r\n\r\nexport default ManageUsersButton","import React from 'react'\r\nimport { FaCogs } from 'react-icons/fa'\r\nimport { Link } from 'react-router-dom'\r\n\r\nexport default () => {\r\n return (\r\n \r\n \r\n \r\n \r\n
\r\n )\r\n}\r\n","import React, { useContext } from 'react'\r\nimport { hasAccessToAdmin } from '../../../utils/user/permissions'\r\nimport { UserContext } from '../../wrappers/UserContext'\r\nimport LogoutButton from '../user/LogoutButton'\r\nimport ManageUsersButton from '../user/ManageUsersButton'\r\nimport AdminLink from './AdminLink'\r\n\r\nconst LandingPageNav = () => {\r\n const { roles } = useContext(UserContext)\r\n return (\r\n \r\n
\r\n )\r\n}\r\n\r\nexport default LandingPageNav\r\n","import React, { useContext } from 'react'\r\nimport Particles from 'react-particles-js'\r\nimport { UserContext } from '../../wrappers/UserContext'\r\nimport particleConfig from './particleConfig'\r\nimport LandingPageNav from './LandingPageNav'\r\n\r\nconst LandingPageWrapper = ({children}) => {\r\n const { user } = useContext(UserContext)\r\n return (\r\n <>\r\n \r\n {hasAccessToAdmin(roles) ? (\r\n
\r\n \r\n
\r\n ) : null}\r\n {hasAccessToAdmin(roles) ? (\r\n \r\n
\r\n ) : null}\r\n \r\n
\r\n \r\n
\r\n \r\n )\r\n}\r\n\r\nexport default LandingPageWrapper\r\n","import React, { useContext } from 'react'\r\nimport { DashboardContext } from '../../wrappers/DashboardContext'\r\nimport LoadingSpinner from '../../elem/LoadingSpinner'\r\nimport DashboardLink from '../../elem/landing-page/DashboardLink'\r\nimport LandingPageWrapper from '../../elem/landing-page/LandingPageWrapper'\r\n\r\nconst LandingPage = () => {\r\n const { loading, dashboards } = useContext(DashboardContext)\r\n\r\n if (loading || !dashboards) {\r\n return \r\n
\r\n \r\n
\r\n \r\n Director Dashboard\r\n
\r\n \r\n {children}\r\n
\r\n \r\n My Dashboards:\r\n
\r\n \r\n {dashboards.map((dashboard, idx) => {\r\n return
\r\n \r\n \r\n \r\n {headerGroups.map((headerGroup) => (\r\n \r\n {headerGroup.headers.map((column) => (\r\n \r\n {column.render('Header')}\r\n \r\n ))}\r\n \r\n ))}\r\n \r\n \r\n {rows.map((row) => {\r\n prepareRow(row)\r\n return (\r\n \r\n {row.cells.map((cell) => {\r\n return (\r\n \r\n {cell.render('Cell')}\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 from 'react'\r\nimport { NavLink, useLocation } from 'react-router-dom'\r\n\r\nexport default () => {\r\n const location = useLocation()\r\n const dashRegex = location.pathname.match(/dashboard\\/([\\w\\s-]*)\\/?/)\r\n const pageRegex = location.pathname.match(/page\\/([\\w\\s-]*)\\/?/)\r\n const widgRegex = location.pathname.match(/widget\\/([\\w\\s-]*)\\/?/)\r\n\r\n const dashboardName = dashRegex && dashRegex[1] ? dashRegex[1] : null\r\n const pageId = pageRegex && pageRegex[1] ? pageRegex[1] : null\r\n const widgetId = widgRegex && widgRegex[1] ? widgRegex[1] : null\r\n\r\n return (\r\n \r\n )\r\n}\r\n","import React from 'react'\r\nimport Breadcrumb from '../../features/admin/Breadcrumb'\r\n\r\nconst AdminLayout = ({ title, children }) => (\r\n \r\n
\r\n)\r\nexport default AdminLayout","import React from 'react'\r\nimport AdminTable from './AdminTable'\r\nimport { Link } from 'react-router-dom'\r\nimport { FaPlus } from 'react-icons/fa'\r\nimport AdminLayout from '../../elem/admin/AdminLayout'\r\nconst AdminDashboard = () => {\r\n return (\r\n <>\r\n \r\n
\r\n {title}
\r\n{children}
\r\n \r\n \r\n
\r\n \r\n
\r\n )\r\n}\r\n","import React, { useContext } from 'react'\r\nimport toast from '../../../elem/Toast'\r\nimport Input from '../../../elem/form/TextInput'\r\nimport { useForm } from 'react-hook-form'\r\nimport withConfig from '../../../wrappers/withConfig'\r\nimport { APIRequestContext } from '../../../wrappers/APIRequestContext'\r\n\r\nconst CreateForm = ({ config, closeForm }) => {\r\n const { authenticatedFetch } = useContext(APIRequestContext)\r\n const { register, handleSubmit, errors } = useForm()\r\n const { API_URL } = config\r\n\r\n const POST = (newDashboard) => {\r\n return {\r\n method: 'POST',\r\n mode: 'cors',\r\n headers: {\r\n 'Content-Type': 'application/json',\r\n 'Access-Control-Allow-Origin': '*',\r\n 'Access-Control-Allow-Headers':\r\n 'Access-Control-Allow-Origin, X-Requested-With, Content-Type, Accept',\r\n },\r\n body: JSON.stringify(newDashboard),\r\n }\r\n }\r\n\r\n const createDashboard = (dashboard) => {\r\n authenticatedFetch(`${API_URL}/admin/dashboard/create`, POST(dashboard))\r\n .then(async (response) => {\r\n if (response.ok) {\r\n return response.json()\r\n } else {\r\n const error = await response.text()\r\n throw new Error(error)\r\n }\r\n })\r\n .catch((e) => {\r\n toast({\r\n level: 'error',\r\n message:\r\n 'Create Dashboard:' +\r\n (e.message ? e.message : 'Dashboard create failed'),\r\n })\r\n })\r\n .finally(() => {\r\n closeForm(dashboard.DashboardName)\r\n })\r\n }\r\n\r\n const trimData = (data) => {\r\n Object.keys(data).map((key) => typeof data[key] === \"string\" ? data[key] = data[key].replace(/\\s\\s+/g, ' ').trim() : data[key])\r\n return data\r\n }\r\n\r\n\r\n const onSubmit = (data) => {\r\n createDashboard(trimData(data))\r\n }\r\n\r\n return (\r\n \r\n )\r\n}\r\n\r\nexport default withConfig(CreateForm)\r\n","import React, { useState } from 'react'\r\nimport CreateForm from './CreateForm'\r\nimport { Redirect } from 'react-router-dom'\r\nimport AdminLayout from '../../../elem/admin/AdminLayout'\r\n\r\nconst CreateDashboard = () => {\r\n const [name, setName] = useState(null) \r\n \r\n const closeForm = (name) => {\r\n setName(name)\r\n }\r\n\r\n if (name) {\r\n return (\r\n \r\n
\r\n\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n {active !== false && helper && (\r\n
\r\n \r\n \r\n
\r\n )}\r\n \r\n {active === false ? (\r\n
\r\n \r\n {text}
\r\n ) : (\r\n\r\n {errors[name] ? errors[name].message : null}\r\n {errors[name] && errors[name].type === 'validate'\r\n ? 'Must be valid JSON'\r\n : null}\r\n
\r\n\r\n \r\n \r\n {headerGroups.map((headerGroup) => (\r\n \r\n {headerGroup.headers.map((column) => (\r\n \r\n {column.render('Header')}\r\n \r\n {column.isSorted\r\n ? column.isSortedDesc\r\n ? \r\n ))}\r\n \r\n ))}\r\n \r\n \r\n {page.map((row, i) => {\r\n prepareRow(row)\r\n return (\r\n \r\n {row.cells.map((cell) => {\r\n return (\r\n \r\n {cell.render('Cell')}\r\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 EditTable\r\n","import React, { useContext, useEffect, useState } from 'react'\r\nimport EditForm from './EditForm'\r\nimport EditTable from './EditTable'\r\nimport { Link, withRouter } from 'react-router-dom'\r\nimport { FaPlus } from 'react-icons/fa'\r\nimport { CurrentDashboardContext } from '../../../wrappers/CurrentDashboardContext'\r\nimport AdminLayout from '../../../elem/admin/AdminLayout'\r\n\r\nconst EditDashboard = withRouter(({ history }) => {\r\n const { widgetGroups, currentDashboard, setNewObject } = useContext(\r\n CurrentDashboardContext\r\n )\r\n const [edited, setEdited] = useState(null)\r\n\r\n useEffect(() => {\r\n if (history && edited) {\r\n history.replace(`/admin/dashboard/${edited}`)\r\n setEdited(false)\r\n }\r\n }, [edited, history])\r\n\r\n const closeForm = (name) => {\r\n setEdited(name)\r\n setNewObject(name)\r\n }\r\n\r\n if (!currentDashboard) {\r\n return null\r\n }\r\n\r\n const pages = widgetGroups.map((page)=> ({...page, Widgets: page.Widgets.length}))\r\n\r\n return (\r\n Dashboard Pages
\r\n\r\n previousPage()}\r\n disabled={!canPreviousPage}\r\n >\r\n {'<'}\r\n {' '}\r\n \r\n Page{' '}\r\n \r\n {pageIndex + 1} of {pageOptions.length}\r\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 EditDashboard\r\n","import React from 'react'\r\nimport ReactSelect from 'react-select'\r\nimport { Controller } from 'react-hook-form'\r\nimport { FaInfoCircle } from 'react-icons/fa'\r\nimport { DefaultTooltip as Tooltip } from '../Tooltip'\r\n\r\nexport default ({\r\n options,\r\n onChange,\r\n control,\r\n initialValue,\r\n name,\r\n disabled,\r\n label,\r\n helper,\r\n rules,\r\n errors,\r\n className,\r\n placeholder,\r\n value,\r\n}) => {\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n )\r\n}\r\n","import React from 'react'\r\nimport { FaInfoCircle } from 'react-icons/fa'\r\nimport { DefaultTooltip as Tooltip } from '../Tooltip'\r\n\r\nconst Checkbox = ({\r\n name,\r\n label,\r\n onChange,\r\n helper,\r\n example,\r\n defaultChecked,\r\n disabled,\r\n register,\r\n className,\r\n}) => {\r\n return (\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n {helper && (\r\n
\r\n \r\n \r\n
\r\n )}\r\n \r\n
\r\n \r\n
\r\n \r\n {errors && errors[name] ? errors[name].message : null}\r\n
\r\n\r\n
\r\n )\r\n}\r\n\r\nexport default Checkbox\r\n","import React from 'react'\r\nimport { FaInfoCircle } from 'react-icons/fa'\r\nimport { DefaultTooltip as Tooltip } from '../Tooltip'\r\n\r\nexport default ({\r\n label,\r\n name,\r\n register,\r\n registerParams,\r\n onChange,\r\n helper,\r\n example,\r\n value,\r\n active,\r\n errors,\r\n defaultValue,\r\n className,\r\n}) => {\r\n const text = !value ? defaultValue : value\r\n\r\n return (\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n ${example ? `
${example}` : ''}`}\r\n data-for={name}\r\n className=\"icon is-size-7 is-left\"\r\n >\r\n
\r\n \r\n
\r\n {helper && (\r\n ${example}` : ''}`}\r\n data-for={name}\r\n className=\"icon is-size-7 is-left\"\r\n >\r\n
\r\n
\r\n )\r\n}","import React, { useState, useEffect, useContext } from 'react'\r\nimport toast from '../../../elem/Toast'\r\nimport { useForm } from 'react-hook-form'\r\nimport Select from '../../../elem/form/Select'\r\nimport Input from '../../../elem/form/TextInput'\r\nimport Checkbox from '../../../elem/form/Checkbox'\r\nimport NumberInput from '../../../elem/form/NumberInput'\r\nimport withConfig from '../../../wrappers/withConfig'\r\nimport { APIRequestContext } from '../../../wrappers/APIRequestContext'\r\n\r\nconst CreatePageForm = ({ config, closeForm, dashboardId, pageIds }) => {\r\n const { authenticatedFetch } = useContext(APIRequestContext)\r\n const { register, handleSubmit, control, errors, unregister } = useForm()\r\n const {API_URL} = config\r\n const [id, setId] = useState(null)\r\n const [parentId, setParentId] = useState(null)\r\n const [visible, setVisible] = useState(false)\r\n const hiddenClass = visible ? null : 'hidden'\r\n const options = pageIds.map((x) => ({ label: x.name, value: x.id }))\r\n \r\n if (id) {\r\n closeForm(id)\r\n }\r\n \r\n useEffect(() => {\r\n if(!visible) {\r\n unregister([\"ParentPageId\", \"SharedKey\", \"DetailKey\"]) \r\n }\r\n }, [visible, unregister])\r\n \r\n const POST = (page) => {\r\n return {\r\n method: 'POST',\r\n mode: 'cors',\r\n headers: {\r\n 'Content-Type': 'application/json',\r\n 'Access-Control-Allow-Origin': '*',\r\n 'Access-Control-Allow-Headers':\r\n 'Access-Control-Allow-Origin, X-Requested-With, Content-Type, Accept',\r\n },\r\n body: JSON.stringify(page),\r\n }\r\n }\r\n \r\n const createPage = (page) => {\r\n \r\n authenticatedFetch(`${API_URL}/admin/page/create`, POST(page))\r\n .then(async (response) => {\r\n if (response.ok) {\r\n return response.json()\r\n } else {\r\n const error = await response.text()\r\n throw new Error(error)\r\n }\r\n })\r\n .then((response) => {\r\n setId(response)\r\n })\r\n .catch((e) => {\r\n toast({\r\n level: 'error',\r\n message:\r\n 'Create Page:' +\r\n (e.message ? e.message : 'Page create failed'),\r\n })\r\n })\r\n }\r\n\r\n const handleSelectChange = (event) => {\r\n setParentId(event[0].value)\r\n return event\r\n }\r\n \r\n\r\n const trimData = (data) => {\r\n Object.keys(data).map((key) => typeof data[key] === \"string\" ? data[key] = data[key].replace(/\\s\\s+/g, ' ').trim() : data[key])\r\n return data\r\n }\r\n\r\n const onSubmit = (data) => {\r\n !visible ? delete data.ParentPageId && delete data.SharedKey && delete data.DetailKey: data.ParentPageId = data.ParentPageId.value\r\n createPage({ ...trimData(data), DashboardId: dashboardId, Seq: Number(data.Seq), ParentPageId: parentId })\r\n }\r\n\r\n return (\r\n \r\n )\r\n}\r\n\r\nexport default withConfig(CreatePageForm)\r\n","import React, { useState, useContext } from 'react'\r\nimport CreatePageForm from './CreatePageForm'\r\nimport { Redirect } from 'react-router-dom'\r\nimport AdminLayout from '../../../elem/admin/AdminLayout'\r\nimport {CurrentDashboardContext} from '../../../wrappers/CurrentDashboardContext'\r\n\r\nconst CreatePage = () => {\r\n const { widgetGroups, currentDashboard, setNewObject } = useContext(CurrentDashboardContext)\r\n const [pageId, setPageId] = useState(null)\r\n\r\n if (!currentDashboard) {\r\n return null\r\n }\r\n const pages = widgetGroups\r\n .filter(\r\n (widget) =>\r\n widgetGroups.indexOf(widget.PageId) === widgetGroups.lastIndexOf(widget.PageId)\r\n )\r\n .map((widget) => ({\r\n name: widget.PageName,\r\n id: widget.PageId,\r\n }))\r\n \r\n const closeForm = (response) => {\r\n setPageId(response)\r\n }\r\n \r\n if (pageId) {\r\n setNewObject(pageId)\r\n return (\r\n \r\n
\r\n\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n {active === false ? (\r\n
\r\n {text}
\r\n ) : (\r\n\r\n {errors && errors[name] ? errors[name].message : null}\r\n
\r\n\r\n \r\n \r\n {headerGroups.map((headerGroup) => (\r\n \r\n {headerGroup.headers.map((column) => (\r\n \r\n {column.render('Header')}\r\n \r\n {column.isSorted\r\n ? column.isSortedDesc\r\n ? \r\n ))}\r\n \r\n ))}\r\n \r\n \r\n {page.map((row, i) => {\r\n prepareRow(row)\r\n return (\r\n \r\n {row.cells.map((cell) => {\r\n return (\r\n \r\n {cell.render('Cell')}\r\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 EditPageTable\r\n","import React, { useContext, useState } from 'react'\r\nimport EditPageForm from './EditPageForm'\r\nimport EditPageTable from './EditPageTable'\r\nimport { Link } from 'react-router-dom'\r\nimport { CurrentDashboardContext } from '../../../wrappers/CurrentDashboardContext'\r\nimport AdminLayout from '../../../elem/admin/AdminLayout'\r\nimport { FaPlus } from 'react-icons/fa'\r\n\r\nconst EditPage = () => {\r\n const {\r\n widgetGroups,\r\n currentWidgetGroup,\r\n currentDashboard,\r\n pageId,\r\n setNewObject,\r\n } = useContext(CurrentDashboardContext)\r\n const id = Number(pageId)\r\n const [edited, setEdited] = useState(false)\r\n\r\n if (!currentDashboard || !pageId || !Object.keys(currentWidgetGroup).length || Number(pageId) !== currentWidgetGroup.PageId) {\r\n return null\r\n }\r\n\r\n const page = currentWidgetGroup\r\n const pages = widgetGroups\r\n .filter(\r\n (widget) =>\r\n widgetGroups.indexOf(widget.PageId) ===\r\n widgetGroups.lastIndexOf(widget.PageId)\r\n )\r\n .map((widget) => ({ name: widget.PageName, id: widget.PageId }))\r\n .filter((widget) => widget.id !== id)\r\n\r\n const closeForm = (edit) => {\r\n setEdited(edit)\r\n }\r\n\r\n if (edited) {\r\n setNewObject(edited)\r\n }\r\n\r\n return (\r\n Page Widgets
\r\n\r\n previousPage()}\r\n disabled={!canPreviousPage}\r\n >\r\n {'<'}\r\n {' '}\r\n \r\n Page{' '}\r\n \r\n {pageIndex + 1} of {pageOptions.length}\r\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 EditPage\r\n","import React from 'react'\r\nimport { Helmet , HelmetProvider } from 'react-helmet-async'\r\nimport withConfig from '../wrappers/withConfig'\r\n\r\nconst Header = ({ config }) => {\r\n const { APP_TITLE } = config\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n {widgetGroups.filter(target => !target.ParentPageId).map((target, idx) => {\r\n const isActive = target.Location === currentWidgetGroup.Location || target.PageId === currentWidgetGroup.ParentPageId\r\n const tooltipId = `nav-${target.PageId}`\r\n return (\r\n \r\n \r\n \r\n \r\n
\r\n )\r\n}\r\n","import React, { useContext } from 'react'\r\nimport { Link } from 'react-router-dom'\r\nimport { FaArrowLeft } from 'react-icons/fa'\r\n\r\nimport { CurrentDashboardContext } from '../../wrappers/CurrentDashboardContext'\r\nimport { IconTooltip as Tooltip } from '../../elem/Tooltip'\r\n\r\nexport default () => {\r\n const { currentWidgetGroup, widgetGroups } = useContext(CurrentDashboardContext)\r\n const backTarget = currentWidgetGroup.ParentPageId ? widgetGroups.find(x => x.PageId === currentWidgetGroup.ParentPageId) : {Location: '', PageName: 'Dashboard List', DashboardName: ''}\r\n return (\r\n \r\n \r\n \r\n
\r\n )\r\n}\r\n","import React from 'react'\r\n\r\nimport Links from './Links'\r\nimport BackButton from './BackButton'\r\n\r\nexport default () => (\r\n \r\n)\r\n","import React, { useContext } from 'react'\r\nimport { DateContext } from '../../wrappers/DateContext'\r\nimport { FaCalendar, FaTimes } from 'react-icons/fa'\r\n\r\nconst DateDisplayComponent = ({ dateRangeLabel, date }) => {\r\n if (dateRangeLabel !== 'Custom') {\r\n return {dateRangeLabel}
\r\n } else {\r\n return (\r\n <>\r\n {date.minDate ? (\r\n \r\n
\r\n ) : null}\r\n {date.maxDate ? (\r\n From:
\r\n {date.minDate}\r\n \r\n
\r\n ) : null}\r\n \r\n )\r\n }\r\n}\r\nexport default () => {\r\n const {\r\n date,\r\n selectorVisible,\r\n toggleSelectorVisible,\r\n dateRangeLabel,\r\n } = useContext(DateContext)\r\n\r\n return (\r\n To:
\r\n {date.maxDate}\r\n \r\n {selectorVisible ?
\r\n \r\n {\r\n editingLayout ? saveLayoutState() : startLayoutEdit()\r\n }}\r\n >\r\n {editingLayout ?
\r\n {editingLayout && (\r\n <>\r\n \r\n {`${editingLayout ? 'Save' : 'Edit'} Layout`}\r\n
\r\n {/* \r\n {`Reset Layout`}\r\n
\r\n {/* \r\n {`Cancel`}\r\n
\r\n {/* \r\n
\r\n )\r\n}\r\n","import React, { useContext } from 'react'\r\nimport { CurrentDashboardContext } from '../wrappers/CurrentDashboardContext'\r\nimport DateBarComponent from './date/BarComponent'\r\nimport LayoutEditorToggle from './LayoutEditorToggle'\r\nimport { Helmet, HelmetProvider } from 'react-helmet-async'\r\nimport TopBarDropdown from './TopBarDropdown'\r\nimport withConfig from '../wrappers/withConfig'\r\nimport { UserContext } from '../wrappers/UserContext'\r\nimport { hasAccessToAdmin } from '../../utils/user/permissions'\r\nimport AdminLink from './landing-page/AdminLink'\r\nimport LogoutButton from './user/LogoutButton'\r\nimport ManageUsersButton from './user/ManageUsersButton'\r\n\r\nexport default withConfig(({ config }) => {\r\n const {\r\n currentWidgetGroup: { PageName },\r\n dashboardName,\r\n pageLoading,\r\n } = useContext(CurrentDashboardContext)\r\n const { user, roles } = useContext(UserContext)\r\n const { IS_PUBLIC } = config\r\n\r\n return (\r\n \r\n setIsActive(!isActive)}\r\n >\r\n {name}\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n {dashboardName} {!IS_PUBLIC ? `Director ` : ''}Dashboard\r\n \r\n \r\n \r\n
\r\n )\r\n})\r\n","import React from 'react'\r\n\r\nimport { dateOptionsColumnOne, dateOptionsColumnTwo } from '../../../utils/constants/date/dateOptions'\r\n\r\nexport default ({\r\n setMinDate,\r\n setMaxDate,\r\n dateRangeLabel,\r\n setDateRangeLabel,\r\n}) => {\r\n const onClick = (option) => {\r\n const { minDate, maxDate, label } = option\r\n setMinDate(minDate)\r\n setMaxDate(maxDate)\r\n setDateRangeLabel(label)\r\n }\r\n return (\r\n \r\n
\r\n \r\n
\r\n {dashboardName}
\r\n {!pageLoading &&- {PageName}
}\r\n\r\n
\r\n \r\n
\r\n \r\n {hasAccessToAdmin(roles) ?
\r\n )}\r\n \r\n
\r\n \r\n \r\n )\r\n}\r\n","import React, { useContext, useEffect, useState } from 'react'\r\nimport DatePicker from 'react-datepicker'\r\n\r\nimport { DateContext } from '../../wrappers/DateContext'\r\n\r\nimport DateOptions from './DateOptions'\r\nimport { dateToString, stringToDate } from '../../../utils/dateFormatting'\r\n\r\n\r\nconst DatePickerComponent = ({ setDate, date }) => {\r\n const [width, setWidth] = useState(window.innerWidth)\r\n\r\n const listener = () => {\r\n setWidth(window.innerWidth)\r\n }\r\n\r\n window.addEventListener('resize', listener);\r\n\r\n return (\r\n \r\n
\r\n \r\n {dateOptionsColumnOne.map((option, idx) => (\r\n onClick(option)}\r\n >\r\n
\r\n ))}\r\n \r\n {option.label}\r\n
\r\n \r\n {option.dateRangeString}\r\n
\r\n \r\n {dateOptionsColumnTwo.map((option, idx) => (\r\n onClick(option)}\r\n >\r\n
\r\n ))}\r\n \r\n {option.label}\r\n
\r\n \r\n {option.dateRangeString}\r\n
\r\n \r\n
\r\n )\r\n}\r\n","import React, { createContext, useState, useEffect, useContext } from 'react'\r\n\r\nimport toast from '../elem/Toast'\r\nimport withConfig from './withConfig'\r\nimport { DateContext } from './DateContext'\r\nimport { CurrentDashboardContext } from './CurrentDashboardContext'\r\nimport { FaChartPie, FaChartBar, FaHashtag, FaRegMap, FaCube, FaClipboardList, FaChartLine, FaTable, FaMap, FaComment} from 'react-icons/fa'\r\nimport { MdTrendingUp } from 'react-icons/md'\r\nimport { APIRequestContext } from './APIRequestContext'\r\n\r\nconst WidgetDataContext = createContext(null)\r\n\r\nconst WidgetDataContextProvider = ({ config, widget, children }) => {\r\n const {\r\n WidgetId: widgetId,\r\n WidgetName: widgetName,\r\n WidgetType: widgetType,\r\n GroupBy\r\n } = widget\r\n\r\n const datectx = useContext(DateContext)\r\n const { authenticatedFetch } = useContext(APIRequestContext)\r\n const { detailKey, currentWidgetGroup } = useContext(CurrentDashboardContext)\r\n const [widgetData, setWidgetData] = useState(null)\r\n const [loading, setLoading] = useState(true)\r\n const [showLegend, setShowLegend] = useState(true)\r\n const [ abortController, setAbortController ] = useState(new AbortController())\r\n const { API_URL } = config // api url configured in public/config.\r\n
\r\n \r\n
\r\n \r\n
\r\n Start Date:
\r\n \r\n
\r\n \r\n
\r\n End Date:
\r\n \r\n applyDateSelection()}\r\n >\r\n Apply\r\n \r\n
\r\n \r\n {/*
\r\n )\r\n}\r\n","import React, { useContext } from 'react'\r\nimport { FaExpandArrowsAlt, FaCompressArrowsAlt } from 'react-icons/fa'\r\n\r\nimport { DefaultTooltip as Tooltip } from '../../Tooltip'\r\nimport { WidgetDataContext } from '../../../wrappers/WidgetDataContext'\r\nimport { CurrentDashboardContext } from '../../../wrappers/CurrentDashboardContext'\r\n\r\nexport default () => {\r\n const { widgetData: widget, setLoading } = useContext(WidgetDataContext)\r\n const { expandedWidgetId, setExpandedWidgetId } = useContext(\r\n CurrentDashboardContext\r\n )\r\n\r\n const setExpandedWidget = (widgetId) => {\r\n setLoading(true)\r\n setExpandedWidgetId(widgetId)\r\n setTimeout(() => {\r\n setLoading(false)\r\n }, 200)\r\n }\r\n\r\n if (!widget) {\r\n return null\r\n }\r\n\r\n const expanded = expandedWidgetId === widget.WidgetId\r\n const tooltipId = `expand-${widget.WidgetId}`\r\n return (\r\n By
*/}\r\n \r\n setGroupBy(value)}\r\n />\r\n
\r\n \r\n {expanded ? (\r\n setExpandedWidget(null)}\r\n style={{zIndex: 10 }}\r\n >\r\n
\r\n ) : (\r\n \r\n setShowLegend(false)}\r\n >\r\n Hide Legend\r\n
\r\n )}\r\n \r\n {widget.WidgetType !== 'ThemeMap' ? (\r\n \r\n {!showLegend ? (\r\n setShowLegend(true)}\r\n >\r\n Show Legend\r\n
\r\n ) : (\r\n \r\n {showLegend ? (\r\n
\r\n ) : null}\r\n \r\n )\r\n}\r\n","export default [\r\n '2DFeatureMap',\r\n '3DFeatureMap',\r\n 'BarChart',\r\n 'Form',\r\n 'Grid',\r\n 'LineChart',\r\n 'ScatterChart',\r\n 'PieChart',\r\n 'ThemeMap'\r\n]","import ReactHtmlParser from 'react-html-parser'\r\nconst linkToHref = item => {\r\n const transformed = Object.keys(item).reduce((acc, curr) => {\r\n const value = item[curr]\r\n if (typeof value === 'string' && value.includes('')) {\r\n // parse links and set to the csv syntax for hyperlinks\r\n try {\r\n const parsed = ReactHtmlParser(value)\r\n const csvString = `=HYPERLINK(\"${parsed[0].props.href}\",\"${parsed[0].props.children[0]}\")`\r\n return {\r\n ...acc,\r\n [curr]: csvString\r\n }\r\n } catch (e) {\r\n // when failing to parse the link, juts default to the og value\r\n return {\r\n ...acc,\r\n [curr]: value\r\n }\r\n }\r\n } else {\r\n // let all values that are not strings with tags pass through uneffected\r\n return {\r\n ...acc,\r\n [curr]: value\r\n }\r\n }\r\n }, {})\r\n return transformed \r\n}\r\nconst transforms = [linkToHref]\r\nexport default transforms","import React, { useCallback, useContext, useState } from 'react'\r\nimport { IconContext } from 'react-icons'\r\nimport { FaDownload, FaSpinner } from 'react-icons/fa'\r\nimport { Parser } from 'json2csv'\r\nimport { saveAs } from 'file-saver'\r\n\r\nimport { WidgetDataContext } from '../../../wrappers/WidgetDataContext'\r\nimport { DefaultTooltip as Tooltip } from '../../Tooltip'\r\nimport exportableWidgetTypes from '../../../../utils/constants/widgets/exportableWidgetTypes'\r\nimport csvTransforms from '../../../../utils/constants/widgets/exportTransforms'\r\nimport { DateContext } from '../../../wrappers/DateContext'\r\nimport dayjs from 'dayjs'\r\nimport withConfig from '../../../wrappers/withConfig'\r\nimport { CurrentDashboardContext } from '../../../wrappers/CurrentDashboardContext'\r\nimport { APIRequestContext } from '../../../wrappers/APIRequestContext'\r\n\r\nconst constructDownloadName = (widget, date, exportPrefix, page) => {\r\n let applyDateFilter = page ? page.ApplyDateFilter : true\r\n let downloadName = exportPrefix\r\n ? `${exportPrefix}_${widget.WidgetName}`\r\n : `${widget.PageName}_${widget.WidgetName}`\r\n if (applyDateFilter) {\r\n if (!date.minDate) {\r\n const maxDateString = dayjs(date.maxDate).format('YYYYMMDD').toString()\r\n downloadName += `_Ending_${maxDateString}`\r\n } else {\r\n const minDateString = dayjs(date.minDate).format('YYYYMMDD').toString()\r\n const maxDateString = dayjs(date.maxDate).format('YYYYMMDD').toString()\r\n \r\n downloadName += `_${minDateString}-${maxDateString}`\r\n }\r\n }\r\n const dateString = dayjs(Date.now()).format('YYYYMMDD')\r\n downloadName += `_Generated_${dateString}`\r\n return downloadName\r\n}\r\n\r\nexport default withConfig(({ config }) => {\r\n const { widgetData: widget } = useContext(WidgetDataContext)\r\n const { detailKey, currentWidgetGroup } = useContext(CurrentDashboardContext)\r\n const { authenticatedFetch } = useContext(APIRequestContext)\r\n const { API_URL } = config\r\n const { date } = useContext(DateContext)\r\n const [exporting, setExporting] = useState(false)\r\n\r\n const fetchExportPrefix = useCallback(async () => {\r\n try {\r\n var url = widget.DetailKey\r\n ? `${API_URL}/widget/exportPrefix/${widget.WidgetId}?id=${detailKey}`\r\n : `${API_URL}/widget/exportPrefix/${widget.WidgetId}`\r\n return await authenticatedFetch(url)\r\n .then(async (response) => {\r\n if (response.ok) {\r\n return await response.text()\r\n } else {\r\n const error = await response.text()\r\n throw new Error(error)\r\n }\r\n })\r\n .then((response) => {\r\n return response\r\n })\r\n } catch (e) {\r\n return null\r\n }\r\n }, [widget, detailKey, API_URL])\r\n\r\n const downloadData = useCallback(async () => {\r\n if (!exporting) {\r\n setExporting(true)\r\n var exportPrefix = await fetchExportPrefix()\r\n try {\r\n const parser = new Parser({\r\n transforms: csvTransforms\r\n })\r\n // convert the data to .csv\r\n let csv = parser.parse(widget.Data)\r\n\r\n // update the Value label field, if exists\r\n if (widget.ValueLabel) {\r\n csv = csv.replace('\"Value\"', `\"${widget.ValueLabel}\"`)\r\n }\r\n const downloadName = `${constructDownloadName(\r\n widget,\r\n date,\r\n exportPrefix,\r\n currentWidgetGroup\r\n )}.csv`\r\n saveAs(new Blob([csv], { type: 'text/csv' }), downloadName)\r\n } catch (e) {\r\n console.log('csv export error:', e)\r\n }\r\n setExporting(false)\r\n }\r\n }, [widget, date, exporting, fetchExportPrefix, currentWidgetGroup])\r\n\r\n // if there is no widget or no data, do not render this button\r\n if (!(widget && widget.Data && widget.Data.length)) {\r\n return null\r\n }\r\n\r\n // if the widget is not a supported exportable type,\r\n // then do not render this button\r\n if (!exportableWidgetTypes.includes(widget.WidgetType)) {\r\n return null\r\n }\r\n\r\n const tooltipId = `download-${widget.WidgetId}`\r\n return (\r\n \r\n {show ? 'Select All' : 'Deselect All'}\r\n
\r\n ) : null}\r\n \r\n \r\n \r\n
\r\n )}\r\n \r\n
\r\n)","const allowsOverflow = widget => {\r\n const widgetType = widget && widget.WidgetType ? widget.WidgetType : null\r\n switch (widgetType) {\r\n case \"BarChart\":\r\n return false\r\n case \"LineChart\":\r\n return false\r\n case \"ScatterChart\":\r\n return false\r\n case \"PieChart\":\r\n return false\r\n default:\r\n return true\r\n }\r\n}\r\n\r\nexport { allowsOverflow }","import React, { useContext } from 'react'\r\nimport { WidgetDataContext } from '../../wrappers/WidgetDataContext'\r\nimport LoadingSpinner from '../LoadingSpinner'\r\nimport GroupBySelector from './shared/GroupBySelector'\r\nimport MaximizeButton from './shared/MaximizeButton'\r\nimport LegendButton from './shared/LegendButton'\r\nimport ExportButton from './shared/ExportButton'\r\nimport NoDataComponent from './NoDataComponent'\r\nimport { allowsOverflow } from '../../../utils/widgets/contentStyle'\r\n\r\nexport default ({ children }) => {\r\n const {\r\n widgetName: name,\r\n widgetIcon: icon,\r\n loading,\r\n widgetData: widget,\r\n } = useContext(WidgetDataContext)\r\n const widgetHasData = widget && widget.Data && widget.Data.length\r\n return (\r\n \r\n No Data\r\n
\r\n \r\n
\r\n )\r\n}\r\n","const compactFormat = new Intl.NumberFormat('en-US', { notation: \"compact\", compactDisplay: \"short\" })\r\nconst longFormat = new Intl.NumberFormat('en-US', { maximumFractionDigits: 2})\r\n\r\nconst formatNumber = (value, type) => {\r\n if (type === 'compact') {\r\n return compactFormat.format(value)\r\n } else {\r\n return longFormat.format(value)\r\n }\r\n}\r\n\r\nexport { formatNumber }","import React, { useContext } from 'react'\r\nimport { WidgetDataContext } from '../../../wrappers/WidgetDataContext'\r\nimport NoDataComponent from '../NoDataComponent'\r\nimport { formatNumber } from '../../../../utils/numberFormatting'\r\n\r\nconst getValue = data => {\r\n if (data && data && data.length && data[0].Value) {\r\n return formatNumber(data[0].Value)\r\n } else {\r\n return \r\n
\r\n \r\n
\r\n \r\n
\r\n {icon}
\r\n {name}
\r\n \r\n
\r\n \r\n
\r\n \r\n {loading ? (\r\n
\r\n \r\n
\r\n )\r\n}\r\n","import React from 'react'\r\nimport ReactHtmlParser, { convertNodeToElement } from 'react-html-parser'\r\nimport { Link } from 'react-router-dom'\r\nimport dayjs from 'dayjs'\r\n\r\nimport { formatNumber } from './numberFormatting'\r\n\r\nconst transform = (node, index) => {\r\n if (node.name === 'a') {\r\n if (\r\n node.attribs.href.includes('http') ||\r\n node.attribs.href.includes('www') || node.attribs.href.includes('javascript')\r\n ) {\r\n return convertNodeToElement(node, index, transform)\r\n } else {\r\n return {convertNodeToElement(node, index, transform)}\r\n }\r\n } else {\r\n return convertNodeToElement(node, index, transform)\r\n }\r\n}\r\n\r\nconst formatValue = (value) => {\r\n if (typeof value !== 'undefined' && value !== null) {\r\n if (isNaN(value)) {\r\n if (dayjs(value).isValid()) {\r\n return dayjs(value).format('YYYY/MM/DD').toString()\r\n } else {\r\n return ReactHtmlParser(value, {transform})\r\n }\r\n } else {\r\n return formatNumber(value)\r\n }\r\n } else {\r\n return 'NULL'\r\n }\r\n}\r\n\r\nexport default formatValue\r\n","import React from 'react'\r\n\r\nimport formatValue from '../../../../utils/valueFormatting'\r\n\r\nexport default ({value, type}) => (\r\n \r\n
\r\n \r\n {value}\r\n
\r\n {type === 'string' ? value : formatValue(value)}
\r\n)","export default [\r\n 'ID',\r\n 'Name',\r\n 'API 14',\r\n 'OperatorKey',\r\n 'Operator Number',\r\n 'API No',\r\n 'Well Name',\r\n 'Incident',\r\n 'Postal Code',\r\n 'Lease',\r\n \"Well Type\",\r\n \"Producing Geological Formation\",\r\n \"Surface Managing Entity\",\r\n \"Subsurface Managing Entity\",\r\n \"Tribe\",\r\n \"Pre-Plugging Methane Emissions (grams/hr)\",\r\n \"Post-Plugging Methane Emissions (grams/hr)\",\r\n \"Methane Measurement Method\",\r\n \"Habitat Restored (acres)\",\r\n \"Restoration Endpoint\",\r\n \"Surface Water Contamination Indicators\",\r\n \"Surface Water Remediation Method\",\r\n \"Groundwater Contamination Indicators\",\r\n \"Groundwater Remediation Method\",\r\n \"Community Impact\",\r\n \"Community Impact Indicators\",\r\n \"Witness Name & Certification\",\r\n \"Result\",\r\n \"Place Value\",\r\n \"Package Name\",\r\n \"Plugged Year-Month\",\r\n 'Field',\r\n \"Date Restoration Complete\",\r\n \"Surface Water Remediation Completion Date\",\r\n \"Groundwater Remediation Completion Date\",\r\n \"Witness Date\",\r\n \"Tribal\"\r\n]","import React, {\r\n useContext,\r\n useMemo,\r\n useCallback\r\n} from 'react'\r\nimport { useTable, useSortBy, useFlexLayout, useFilters } from 'react-table'\r\nimport AutoSizer from 'react-virtualized-auto-sizer'\r\nimport { TableVirtuoso } from 'react-virtuoso'\r\nimport { WidgetDataContext } from '../../../wrappers/WidgetDataContext'\r\nimport Cell from './Cell'\r\nimport { CurrentDashboardContext } from '../../../wrappers/CurrentDashboardContext'\r\nimport { FaChevronUp, FaChevronDown } from 'react-icons/fa'\r\nimport stringFields from '../../../../utils/constants/widgets/stringFields'\r\n\r\n// Define a default UI for filtering\r\nfunction DefaultColumnFilter({\r\n column: { filterValue, preFilteredRows, setFilter },\r\n }) {\r\n const count = preFilteredRows.length\r\n \r\n return (\r\n \r\n \r\n {({ height }) => {\r\n return (\r\n\r\n
,\r\n TableBody: React.forwardRef(({ style, ...props }, ref) => ),\r\n TableRow: (props) => {\r\n const index = props['data-index']\r\n const row = rows[index]\r\n return (\r\n onClick(row)}\r\n className={`tr ${\r\n sharedPageKey &&\r\n sharedPageId === row.original[sharedPageKey]\r\n ? 'active'\r\n : ''\r\n } ${sharedPageKey ? 'pointer' : ''}`}\r\n />\r\n )}\r\n }}\r\n fixedHeaderContent={() => {\r\n return headerGroups.map((headerGroup) => (\r\n \r\n {headerGroup.headers.map((column) => (\r\n \r\n \r\n ))\r\n }}\r\n itemContent={(index) => {\r\n const row = rows[index]\r\n prepareRow(row)\r\n return row.cells.map((cell) => {cell.render('Cell')} )\r\n }}\r\n />\r\n )\r\n }}\r\n \r\n
\r\n )\r\n}\r\n","const getHiddenColumns = (widget) => {\r\n const options = widget.WidgetOptions\r\n if (options && options !== '') {\r\n try {\r\n const config = JSON.parse(options)\r\n if (config.hiddenColumns) {\r\n return config.hiddenColumns\r\n }\r\n } catch {}\r\n return\r\n }\r\n return []\r\n}\r\n\r\nexport default getHiddenColumns","// palette obtained from ColorBrewer: https://colorbrewer2.org/#type=qualitative&scheme=Paired&n=12\r\n// and mixed with material design palette https://www.materialpalette.com/colors\r\nconst qualitative = [\r\n '#1f78b4', // blue\r\n '#33a02c', // green\r\n '#fdbf6f', // creme\r\n '#a6cee3', // light blue\r\n '#ff7f00', // orange\r\n '#b2df8a', // light green\r\n '#b15928', // light brown\r\n '#cab2d6', // lavender\r\n '#6a3d9a', // purple\r\n '#3f51b5', // indigo 500\r\n '#009688', // teal 500\r\n '#ab47bc', // purple 400\r\n '#f44336', // red 500\r\n '#90a4ae', // blue grey 300\r\n '#673ab7', // deep purple 500\r\n '#00bcd4', // cyan 500\r\n '#e91e63', // pink 500\r\n '#aeea00', // lime green A700\r\n '#ffc107', // amber 500\r\n '#ff5722', // deep orange 500\r\n //additional colors added\r\n '#880e4f', //dark purple\r\n '#f48fb1', // light pink\r\n '#1b5e20', //dark green\r\n '#ffab40', // med orange\r\n '#b71c1c', //dark red\r\n]\r\n\r\n// palette obtained from ColorBrewer: https://colorbrewer2.org/#type=sequential&scheme=Reds&n=6\r\nconst heatMap = [\r\n '#fee5d9',\r\n '#fcbba1',\r\n '#fc9272',\r\n '#fb6a4a',\r\n '#de2d26',\r\n '#a50f15',\r\n]\r\nexport default qualitative\r\nexport { qualitative, heatMap }\r\n","import React, { useState, useEffect, createContext, useCallback } from 'react'\r\nimport deepEqual from 'deep-equal'\r\nimport qualitative from '../../utils/colors/chartPalette'\r\n\r\nconst ColorContext = createContext(null)\r\n\r\nconst getNextColor = (idx) => qualitative[idx % qualitative.length]\r\nconst getColorMapArray = (series, colorMap, groupName) =>\r\n series.map((seriesName, idx) => ({\r\n series: seriesName,\r\n color: getNextColor(\r\n colorMap[groupName] ? colorMap[groupName].length + idx : idx\r\n ),\r\n }))\r\n\r\nconst ColorContextProvider = ({ children }) => {\r\n const [colorMap, setColorMap] = useState(null)\r\n const getAssociatedColor = useCallback(\r\n (seriesName, groupKey) => {\r\n if (groupKey && colorMap && colorMap[groupKey]) {\r\n const matchingSeries = colorMap[groupKey].find(x => x.series === seriesName)\r\n if (matchingSeries) {\r\n return matchingSeries ? matchingSeries.color : null\r\n }\r\n } else {\r\n if (colorMap && colorMap[null]) {\r\n const nullSeries = colorMap[null].find(x => x.series === seriesName)\r\n return nullSeries ? nullSeries.color : null\r\n }\r\n }\r\n },\r\n [colorMap]\r\n )\r\n\r\n const updateColorMap = useCallback(\r\n (groupName, groupSeries) => {\r\n if (colorMap) {\r\n let updatedColorMap = colorMap\r\n // find the associated color map that is tied to the groupName we have\r\n const associatedColorMap =\r\n colorMap && colorMap[groupName] ? colorMap[groupName] : null\r\n if (associatedColorMap) {\r\n const associatedSeries = associatedColorMap.map(\r\n (x) => x.series\r\n )\r\n const seriesWithoutColorMaps = groupSeries.filter(\r\n (x) => !associatedSeries.includes(x)\r\n )\r\n updatedColorMap = {\r\n ...colorMap,\r\n [groupName]: [\r\n ...colorMap[groupName],\r\n ...getColorMapArray(\r\n seriesWithoutColorMaps,\r\n colorMap,\r\n groupName\r\n ),\r\n ],\r\n }\r\n } else {\r\n updatedColorMap = {\r\n ...colorMap,\r\n [groupName]: getColorMapArray(\r\n groupSeries,\r\n colorMap,\r\n groupName\r\n ),\r\n }\r\n }\r\n if (!deepEqual(updatedColorMap, colorMap)) {\r\n setColorMap(updatedColorMap)\r\n }\r\n } else {\r\n const updatedColorMap = {\r\n [groupName]: getColorMapArray(groupSeries, {}, groupName),\r\n }\r\n setColorMap(updatedColorMap)\r\n }\r\n },\r\n [colorMap, setColorMap]\r\n )\r\n\r\n return (\r\n \r\n
\r\n \r\n ))}\r\n \r\n \r\n {column.render('Header')}\r\n \r\n {column.isSorted ? (\r\n column.isSortedDesc ? (\r\n
\r\n {/* {column.canFilter ? column.render('Filter') : null}
*/}\r\n - \r\n {payload.map((item, index) => (\r\n
- \r\n {legendPayload.map((item, index) => (\r\n
\r\n {tooltipData.filter(x => x.field !== \"PKey\").map((d, idx) => (\r\n
\r\n \r\n )\r\n}\r\n\r\nexport { getTooltipPositionProps }","import React from 'react'\r\nimport ReactDOM from 'react-dom'\r\nimport VectorLayer from 'ol/layer/Vector'\r\nimport Vector from 'ol/source/Vector'\r\nimport { Select } from 'ol/interaction'\r\nimport { ZoomToExtent } from 'ol/control'\r\nimport Polygon from 'ol/geom/Polygon'\r\n\r\nimport { FaGlobe } from 'react-icons/fa'\r\nimport { IconTooltip } from '../../Tooltip'\r\nimport { getTooltipPositionProps } from './Tooltip'\r\n\r\nconst createLabel = (element, name, tooltip) => {\r\n const div = document.createElement('div')\r\n div.setAttribute('class', 'zoomToExtentDiv')\r\n if (name && tooltip) {\r\n div.setAttribute('data-for', name)\r\n div.setAttribute('data-tip', tooltip)\r\n }\r\n ReactDOM.render(element, div)\r\n return div\r\n}\r\n\r\nconst getLayers = () => {\r\n return {\r\n polygon: new VectorLayer({\r\n source: new Vector(),\r\n title: 'Polygon',\r\n visible: false,\r\n }),\r\n }\r\n}\r\n\r\nconst zoomControls = (extent) => {\r\n return [\r\n new ZoomToExtent({\r\n extent,\r\n label: createLabel(\r\n <>\r\n \r\n
\r\n ))}\r\n \r\n {`${d.field} :`}\r\n
\r\n \r\n {`${d.value}`}\r\n
\r\n \r\n {legendData.map((legendItem, idx) => (\r\n
\r\n )\r\n}\r\n","import React, { createContext, useState, useEffect, useContext } from 'react'\r\nimport GeoJSON from 'ol/format/GeoJSON'\r\n\r\nimport toast from '../../../Toast'\r\nimport { WidgetDataContext } from '../../../../wrappers/WidgetDataContext'\r\nimport { CurrentDashboardContext } from '../../../../wrappers/CurrentDashboardContext'\r\nimport { APIRequestContext } from '../../../../wrappers/APIRequestContext'\r\nimport withConfig from '../../../../wrappers/withConfig'\r\n\r\nconst FeatureContext = createContext(null)\r\n\r\nconst getFeatureFilepathAssociatedWithGroupBy = (widget, activeGroupBy) => {\r\n const groupByOptions = widget.GroupBy.split('|')\r\n const filenameOptions = widget.FeatureFiles.split('|')\r\n const activeIndex = groupByOptions.findIndex(\r\n (groupBy) => groupBy === activeGroupBy\r\n )\r\n const activeFilename = filenameOptions[activeIndex]\r\n return activeFilename\r\n}\r\n\r\nconst FeatureContextProvider = ({ config, children }) => {\r\n // get the map widget data\r\n const { widgetData: widget, activeGroupBy } = useContext(WidgetDataContext)\r\n const { dashboardName } = useContext(CurrentDashboardContext)\r\n const { authenticatedFetch } = useContext(APIRequestContext)\r\n const { MAP: mapConfig } = config\r\n const { SOURCE_PROJECTION } = mapConfig[dashboardName]\r\n const targetProjection = 'EPSG:4326'\r\n const sourceProjection = SOURCE_PROJECTION ? SOURCE_PROJECTION : targetProjection\r\n const [features, setFeatures] = useState([])\r\n\r\n useEffect(() => {\r\n // get the file name we are going to fetch from\r\n // the /public directory\r\n const featureFilename = getFeatureFilepathAssociatedWithGroupBy(\r\n widget,\r\n activeGroupBy\r\n )\r\n\r\n // fetch the file contents\r\n authenticatedFetch(`/${featureFilename}`)\r\n .then(async (response) => {\r\n if (response.ok) {\r\n return response.json()\r\n } else {\r\n const error = await response.text()\r\n throw new Error(error)\r\n }\r\n })\r\n .then((response) => {\r\n const f = new GeoJSON({\r\n dataProjection: sourceProjection,\r\n featureProjection: targetProjection\r\n }).readFeatures(response)\r\n setFeatures(f)\r\n })\r\n .catch((e) => {\r\n toast({\r\n level: 'error',\r\n message: `Map Feature File: No file found at ${featureFilename}`,\r\n })\r\n })\r\n }, [activeGroupBy, widget])\r\n\r\n return (\r\n \r\n
\r\n ))}\r\n \r\n
\r\n \r\n {`${formatNumber(legendItem.dataMin, 'compact')} - ${formatNumber(legendItem.dataMax, 'compact')}`}\r\n
\r\n \r\n
\r\n \r\n )\r\n}\r\n\r\nexport default withConfig(ThemeMap)","import React from 'react'\r\n\r\nimport Map from './Map'\r\nimport FeatureContextProvider from './FeatureContext'\r\n\r\nexport default () => {\r\n return (\r\n <>\r\n \r\n
\r\n \r\n {legendData.map((legendItem, idx) => {\r\n const visible = legendItem.visible\r\n const backgroundColor = visible ? legendItem.fillColor : 'white'\r\n return (\r\n \r\n toggleLayerVisibility(legendItem.layerName)\r\n }\r\n >\r\n
\r\n )\r\n })}\r\n \r\n )\r\n}\r\n","import React, { useContext, useRef, useState, useEffect } from 'react'\r\nimport Map from 'ol/Map'\r\n// import { defaults as defaultInteractions } from 'ol/interaction'\r\nimport View from 'ol/View'\r\nimport TileLayer from 'ol/layer/Tile'\r\nimport OSM from 'ol/source/OSM'\r\nimport { unByKey } from 'ol/Observable'\r\nimport { ZoomToExtent } from 'ol/control'\r\n\r\nimport getLayers, { getMinimumLayerExtent } from './getLayers'\r\n\r\nimport withConfig from '../../../../wrappers/withConfig'\r\nimport { WidgetDataContext } from '../../../../wrappers/WidgetDataContext'\r\nimport { CurrentDashboardContext } from '../../../../wrappers/CurrentDashboardContext'\r\nimport MapContextProvider, { MapContext } from '../MapContext'\r\nimport { displayPopup, getSelectControl, zoomControls } from '../mapConfig'\r\nimport MapTooltip from '../Tooltip'\r\nimport MapLegend from './MapLegend'\r\nimport { getLegendDataFromLayers } from './styleFunctions'\r\n\r\nconst getTooltipDataFromFeature = (tooltipState) => {\r\n if (tooltipState) {\r\n const { feature } = tooltipState\r\n const data = feature ? feature.get('data') : []\r\n if (data) {\r\n return Object.keys(data).map(d => ({\r\n field: d,\r\n value: data[d]\r\n }))\r\n }\r\n }\r\n return []\r\n}\r\n\r\nconst FeatureMap = withConfig(({ config, loading, layers }) => {\r\n const { dashboardName, expandedWidgetId, sharedPageKey, sharedPageId, setSharedPageId } = useContext(CurrentDashboardContext)\r\n const { legendState } = useContext(MapContext)\r\n\r\n // get map config associated w/ the dashboard name\r\n const { MAP: mapConfig } = config\r\n const { INITIAL_ZOOM_LEVEL, CENTER_LAT_LNG } = mapConfig[dashboardName]\r\n \r\n\r\n // create internal state + refs\r\n const mapRef = useRef(null)\r\n const mapHeightRef = useRef(null)\r\n const [map, setMap] = useState(null)\r\n const [popupKey, setPopupKey] = useState(null)\r\n const [eventKeys, setEventKeys] = useState([])\r\n const [tooltipState, setTooltipState] = useState(null)\r\n const selectControl = getSelectControl()\r\n\r\n // on load, set up the map\r\n useEffect(() => {\r\n const map = new Map({\r\n target: mapRef.current,\r\n controls: zoomControls(null),\r\n // interactions: defaultInteractions({ mouseWheelZoom: false }),\r\n layers: [\r\n new TileLayer({\r\n source: new OSM(),\r\n }),\r\n ],\r\n view: new View({\r\n projection: 'EPSG:4326',\r\n center: CENTER_LAT_LNG,\r\n zoom: INITIAL_ZOOM_LEVEL\r\n })\r\n })\r\n\r\n // set initial extent to that of the view\r\n const initialExtent = map.getView().calculateExtent()\r\n map.getControls().getArray().find(x => x instanceof ZoomToExtent).extent = initialExtent\r\n setMap(map)\r\n }, [ \r\n CENTER_LAT_LNG, \r\n INITIAL_ZOOM_LEVEL\r\n ])\r\n\r\n useEffect(() => {\r\n if (map && mapRef) {\r\n map.setSize(mapRef.current.clientWidth, mapRef.current.clientHeight)\r\n map.updateSize()\r\n }\r\n }, [loading, map, mapRef, expandedWidgetId])\r\n\r\n // add tooltip event listeners when map loads\r\n useEffect(() => {\r\n if (map) {\r\n if (!popupKey) {\r\n const key = map.on('pointermove', (e) =>\r\n displayPopup(e, map, setTooltipState)\r\n )\r\n setPopupKey(key)\r\n }\r\n } else {\r\n if (popupKey) {\r\n unByKey(popupKey)\r\n setPopupKey(null)\r\n }\r\n }\r\n }, [map, popupKey])\r\n \r\n // on layers update, add layers to map\r\n // and set the extent to the largest of the layers\r\n useEffect(() => {\r\n if (layers.length && map) {\r\n // remove existing select interactions\r\n map.removeInteraction(selectControl.control)\r\n if (eventKeys.length) {\r\n eventKeys.forEach(eventKey => unByKey(eventKey))\r\n }\r\n\r\n // add select interactions to each layer\r\n map.addInteraction(selectControl.control)\r\n const keys = layers.reduce((acc, layer) => {\r\n const source = layer.getSource()\r\n const eventKey = selectControl.on(source, sharedPageKey, setSharedPageId, layer)\r\n return [...acc, ...eventKey]\r\n }, [])\r\n setEventKeys(keys)\r\n \r\n // add layers\r\n layers.map(layer => {\r\n map.addLayer(layer)\r\n return null\r\n })\r\n // set view to minimum extent that\r\n // fits all the data\r\n const fit = getMinimumLayerExtent(layers)\r\n map.getView().fit(fit, { size: map.getSize(), padding: [10, 10, 10, 10]})\r\n // set the zoom to extent toggle to the right size\r\n map.getControls().getArray().find(x => x instanceof ZoomToExtent ).extent = map.getView().calculateExtent()\r\n }\r\n }, [map, layers, setSharedPageId, sharedPageKey])\r\n\r\n // zoom to new feature when selected from table\r\n useEffect(() => {\r\n // remove all previously selected features\r\n layers.map(layer => layer.getSource().getFeatures().forEach(feature => feature.set('selected', 0)))\r\n if (sharedPageKey && sharedPageId) {\r\n\r\n // add new selection to feature layer\r\n layers.map(layer => layer.getSource().getFeatures().forEach(feature => {\r\n const featureSharedId = feature.get(sharedPageKey)\r\n\r\n if (featureSharedId === sharedPageId) {\r\n // set the selected value to true\r\n feature.set('selected', 1)\r\n \r\n // thl 2021.12.12 - remove \"zoom to feature\" on click\r\n // // and zoom to fit the map around the selected feature\r\n // const featurePoint = feature.getGeometry()\r\n // map.getView().fit(featurePoint, {padding: [10, 10, 10, 10], duration: 500, maxZoom: 15})\r\n }\r\n return null\r\n }))\r\n map.render() \r\n }\r\n }, [ map, layers, sharedPageKey, sharedPageId])\r\n\r\n \r\n useEffect(() => {\r\n if (map && legendState.length) {\r\n // set visibility when legendState changes\r\n map.getLayers().getArray()\r\n .filter(x => !!x.get('name')) // filter out layers without names\r\n .forEach(x => {\r\n x.setVisible(legendState.find(y => y.layerName === x.get('name')).visible)\r\n })\r\n }\r\n }, [legendState, map])\r\n\r\n // when the legend comes in, recalculate the extent\r\n useEffect(() => {\r\n if (map && layers && mapRef) {\r\n if (mapHeightRef.current !== mapRef.current?.clientHeight) {\r\n mapHeightRef.current = mapRef.current.clientHeight\r\n map.setSize(mapRef.current.clientWidth, mapRef.current.clientHeight)\r\n map.updateSize()\r\n // set view to minimum extent that\r\n // fits all the data\r\n const fit = getMinimumLayerExtent(layers)\r\n map.getView().fit(fit, { size: map.getSize(), padding: [10, 10, 10, 10]})\r\n // set the zoom to extent toggle to the right size\r\n map.getControls().getArray().find(x => x instanceof ZoomToExtent ).extent = map.getView().calculateExtent()\r\n }\r\n }\r\n }, [map, layers, legendState, mapRef.current?.clientHeight])\r\n\r\n if (loading) {\r\n return null\r\n }\r\n\r\n return (\r\n \r\n
\r\n \r\n {legendItem.layerName}\r\n
\r\n \r\n
\r\n \r\n )\r\n})\r\n\r\nconst FeatureMapWrapper = () => {\r\n const {\r\n loading,\r\n widgetData: widget,\r\n } = useContext(WidgetDataContext)\r\n const [layers, setLayers] = useState([])\r\n\r\n useEffect(() => {\r\n if (widget && widget.Data) {\r\n const {Data: data, WidgetOptions: options, SharedKey: sharedKey} = widget\r\n setLayers(getLayers(data, options, sharedKey))\r\n }\r\n }, [widget])\r\n \r\n return (\r\n \r\n
\r\n \r\n {legendState.map((legendItem, idx) => {\r\n const backgroundColor = legendItem.visible\r\n ? legendItem.fillColor\r\n : 'white'\r\n const border = legendItem.visible\r\n ? legendItem.strokeColor\r\n ? `solid 1px ${legendItem.strokeColor}`\r\n : null\r\n : 'solid 1px black'\r\n const borderRadius = legendItem.visible\r\n ? legendItem.geometryType === 'LineString'\r\n ? '10px'\r\n : null\r\n : '0px'\r\n\r\n return (\r\n \r\n toggleLayerVisibility(legendItem.layerName)\r\n }\r\n >\r\n
\r\n )\r\n })}\r\n \r\n )\r\n}\r\n","import React, { useContext, useState, useRef, useEffect } from 'react'\r\n\r\nimport { WidgetDataContext } from '../../../../wrappers/WidgetDataContext'\r\nimport Scene from './Scene'\r\nimport { prepareData } from './utils'\r\nimport MapLegend from './MapLegend'\r\nimport MapTooltip from '../Tooltip'\r\nimport TooltipContextProvider, { TooltipContext } from './TooltipContext'\r\nimport { CurrentDashboardContext } from '../../../../wrappers/CurrentDashboardContext'\r\nimport MapContextProvider from '../MapContext'\r\nimport { getLegendDataFromLayers } from './utils'\r\n\r\nconst getTooltipDataFromFeature = (tooltipState) => {\r\n if (tooltipState) {\r\n const { data } = tooltipState\r\n return Object.keys(data).map(fieldName => (\r\n {\r\n field: fieldName,\r\n value: data[fieldName]\r\n }\r\n ))\r\n }\r\n return []\r\n}\r\n\r\nexport default () => {\r\n const { sharedPageKey } = useContext(CurrentDashboardContext)\r\n const { loading, widgetData: widget } = useContext(WidgetDataContext)\r\n const mapRef = useRef(null)\r\n const compassRef = useRef(null)\r\n const [layerData, setLayerData] = useState([])\r\n\r\n useEffect(() => {\r\n if (widget && widget.Data) {\r\n // obtain layer data + stringified options object from\r\n // the widget\r\n const { Data: data, WidgetOptions: stringifiedOptions } = widget\r\n\r\n // parse the options object and get the \"layers\" field\r\n let parsedOptions = stringifiedOptions\r\n ? JSON.parse(stringifiedOptions)\r\n : { layers: [] }\r\n const { layers: options } = parsedOptions\r\n\r\n // prepare data - turns into shape\r\n // [{layerName: \r\n
\r\n \r\n {legendItem.layerName}\r\n
\r\n \r\n \r\n \r\n {({ tooltipState }) => (\r\n \r\n \r\n
\r\n \r\n \r\n )\r\n}\r\n","import React, {\r\n useContext,\r\n useEffect,\r\n useState,\r\n useMemo,\r\n useCallback,\r\n} from 'react'\r\nimport {\r\n PieChart,\r\n Pie,\r\n Legend,\r\n Cell,\r\n Sector,\r\n Tooltip,\r\n ResponsiveContainer,\r\n} from 'recharts'\r\n\r\nimport { WidgetDataContext } from '../../../wrappers/WidgetDataContext'\r\n\r\nimport { formatNumber } from '../../../../utils/numberFormatting'\r\nimport { ColorContext } from '../../../wrappers/ColorContext'\r\n\r\nconst createInitialState = (uniqueGroups) =>\r\n uniqueGroups.reduce(\r\n (acc, curr) => ({\r\n ...acc,\r\n [curr]: { hidden: false, highlight: false },\r\n }),\r\n {}\r\n )\r\n\r\nconst resetStateField = (displayState, field, state) =>\r\n Object.keys(displayState).reduce(\r\n (acc, curr) => ({\r\n ...acc,\r\n [curr]: { ...displayState[curr], [field]: state },\r\n }),\r\n {}\r\n )\r\n\r\nconst renderActiveShape = (props) => {\r\n const {\r\n cx,\r\n cy,\r\n innerRadius,\r\n outerRadius,\r\n startAngle,\r\n endAngle,\r\n fill,\r\n payload,\r\n } = props\r\n return (\r\n \r\n 
\r\n \r\n \r\n
\r\n \r\n - \r\n {legendPayload.map((item, index) => (\r\n
\r\n
\r\n )\r\n}","import React from 'react'\r\nimport { dateToString } from '../../../../utils/dateFormatting'\r\n\r\nexport default ({ active, payload, label }) => {\r\n if (active) {\r\n const formattedLabel = dateToString(label)\r\n return (\r\n \r\n
\r\n \r\n {fieldData.map((f, idx) => (\r\n
\r\n \r\n
\r\n ))}\r\n \r\n \r\n
\r\n {stringFields.includes(f.field) ? f.value : formatValue(f.value)}
\r\n \r\n
\r\n )\r\n }\r\n return null\r\n}\r\n","import React, { useContext, useEffect, useState, useMemo } from 'react'\r\nimport {\r\n XAxis,\r\n Line,\r\n YAxis,\r\n Label,\r\n CartesianGrid,\r\n Tooltip,\r\n Legend,\r\n ResponsiveContainer,\r\n Scatter,\r\n ComposedChart\r\n} from 'recharts'\r\nimport dayjs from 'dayjs'\r\n\r\nimport { WidgetDataContext } from '../../../wrappers/WidgetDataContext'\r\nimport CustomTooltip from './CustomTooltip'\r\nimport { formatNumber } from '../../../../utils/numberFormatting'\r\nimport { dateToString } from '../../../../utils/dateFormatting'\r\nimport getHiddenColumns from '../../../../utils/widgets/getHiddenColumns'\r\nimport { ColorContext } from '../../../wrappers/ColorContext'\r\n\r\nconst CustomLegend = ({ legendPayload, bold, setBold, updateHiddenState }) => {\r\n return (\r\n {formattedLabel}
\r\n- \r\n {payload && payload.map((x, idx) =>\r\n x.name !== 'NoTooltipItem' ? (\r\n
- \r\n \r\n {x.name}\r\n \r\n : \r\n \r\n {Math.round(x.value * 100) / 100}\r\n \r\n \r\n ) : null\r\n )}\r\n
- \r\n {legendPayload.map((item, index) => (\r\n
\r\n
\r\n )\r\n\r\n}\r\n\r\nexport default TextWidget","import React, { useContext } from 'react'\r\n\r\nimport { WidgetDataContext } from '../../wrappers/WidgetDataContext'\r\n\r\nimport WidgetWrapper from './WidgetWrapper'\r\nimport Number from './number/Number'\r\nimport Grid from './grid/Grid'\r\nimport BarChart from './bar/BarChart'\r\nimport LineChart from './line/LineChart'\r\nimport ThemeMap from './map/theme-map/ThemeMap'\r\nimport FeatureMap from './map/feature-map/FeatureMap'\r\nimport ThreeDimensionalMap from './map/3d-map/ThreeDimensionalMap'\r\nimport PieChart from './pie/PieChart'\r\nimport Form from './form/Form'\r\nimport ScatterChart from './scatter/ScatterChart'\r\nimport TextWidget from './text/Text'\r\n\r\nconst getWidgetComponentFromWidgetType = (widgetType) => {\r\n switch (widgetType) {\r\n case 'Number':\r\n return Number\r\n case 'Grid':\r\n return Grid\r\n case 'BarChart':\r\n return BarChart\r\n case 'LineChart':\r\n return LineChart\r\n case 'ScatterChart':\r\n return ScatterChart\r\n case 'ThemeMap':\r\n return ThemeMap\r\n case 'PieChart':\r\n return PieChart\r\n case 'Form':\r\n return Form\r\n case '2DFeatureMap':\r\n return FeatureMap\r\n case '3DFeatureMap':\r\n return ThreeDimensionalMap\r\n case 'Text':\r\n return TextWidget\r\n default:\r\n return 'div'\r\n }\r\n}\r\n\r\nexport default () => {\r\n const { widgetType } = useContext(WidgetDataContext)\r\n const WidgetComponent = getWidgetComponentFromWidgetType(widgetType)\r\n return (\r\n \r\n {data[0].Value}\r\n
\r\n \r\n \r\n {children}\r\n \r\n
\r\n )\r\n}\r\n\r\n","import React from 'react'\r\nimport Widgets from '../../elem/widgets/Widgets'\r\n\r\nexport default () => (\r\n \r\n
\r\n)\r\n","import React, { useContext, useState } from 'react'\r\nimport { Redirect } from 'react-router-dom'\r\nimport toast from '../../elem/Toast'\r\nimport AdminLayout from '../../elem/admin/AdminLayout'\r\nimport { FaCheckCircle, FaTimesCircle } from 'react-icons/fa'\r\nimport withConfig from '../../wrappers/withConfig'\r\nimport { APIRequestContext } from '../../wrappers/APIRequestContext'\r\n\r\n\r\n\r\nconst DeleteItem = ({config, location}) => {\r\n const {deleteProps: item} = location\r\n const itemType = item.itemType\r\n const [redirect, setRedirect] = useState(null)\r\n const { authenticatedFetch } = useContext(APIRequestContext)\r\n const { API_URL } = config\r\n\r\n const DELETE = () => {\r\n return {\r\n method: 'DELETE',\r\n }\r\n }\r\n\r\n const deleteItem = (id) => {\r\n authenticatedFetch(`${API_URL}/admin/${itemType}/delete/${id}`, DELETE())\r\n .then(async (response) => {\r\n if (response.ok) {\r\n return\r\n } else {\r\n const error = await response.text()\r\n throw new Error(error)\r\n }\r\n })\r\n .catch((e) => {\r\n toast({\r\n level: 'error',\r\n message:\r\n `Delete ${itemType}:` +\r\n (e.message ? e.message : `${itemType} delete failed`),\r\n })\r\n })\r\n .finally(() => {\r\n setRedirect(itemType)\r\n })\r\n }\r\n\r\n if (redirect === 'widget') {\r\n return (\r\n \r\n
\r\n )\r\n}\r\n","import React, { useMemo } from 'react'\r\nimport { useTable, usePagination } from 'react-table'\r\n\r\nimport NoDataComponent from '../../../elem/widgets/NoDataComponent'\r\n\r\nconst createColumns = (data) => {\r\n const keys = data && data.length ? Object.keys(data[0]) : []\r\n return keys.map((key) => ({ Header: key, accessor: key }))\r\n}\r\n\r\nconst PreviewQueryTable = ({ data }) => {\r\n const removeEmpty = (array) => {\r\n array.forEach((obj) => {\r\n Object.keys(obj).forEach((k) => {\r\n if (typeof obj[k] === 'object') {\r\n obj[k] = ''\r\n }\r\n })\r\n })\r\n return array\r\n }\r\n\r\n const columns = useMemo(() => createColumns(data), [data])\r\n const tableData = useMemo(() => removeEmpty(data), [data])\r\n const {\r\n getTableProps,\r\n getTableBodyProps,\r\n headerGroups,\r\n prepareRow,\r\n page,\r\n canPreviousPage,\r\n canNextPage,\r\n pageOptions,\r\n nextPage,\r\n previousPage,\r\n state: { pageIndex },\r\n } = useTable(\r\n {\r\n columns,\r\n data: tableData,\r\n initialState: { pageIndex: 0, pageSize: 5 },\r\n },\r\n usePagination\r\n )\r\n\r\n if (!(data && data.length)) {\r\n return \r\n
\r\n\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n {helper && (\r\n
\r\n \r\n \r\n
\r\n )}\r\n \r\n
\r\n \r\n {errors && errors[name] ? errors[name].message : null}\r\n
\r\n\r\n \r\n \r\n {headerGroups.map((headerGroup) => (\r\n \r\n {headerGroup.headers.map((column) => (\r\n \r\n {column.render('Header')}\r\n \r\n ))}\r\n \r\n ))}\r\n \r\n \r\n {page.map((row, i) => {\r\n prepareRow(row)\r\n return (\r\n \r\n {row.cells.map((cell) => {\r\n return (\r\n \r\n {cell.render('Cell')}\r\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 PreviewQueryTable\r\n","import React, { useContext, useState } from 'react'\r\nimport toast from '../../../elem/Toast'\r\nimport { useForm } from 'react-hook-form'\r\nimport Select from '../../../elem/form/Select'\r\nimport WidgetTypes from '../../../elem/admin/SelectWidgetTypes'\r\nimport Databases from '../../../elem/admin/SelectDatabases'\r\nimport Input from '../../../elem/form/TextInput'\r\nimport Checkbox from '../../../elem/form/Checkbox'\r\nimport NumberInput from '../../../elem/form/NumberInput'\r\nimport MultiSelect from '../../../elem/form/MultiSelect'\r\nimport PreviewQueryTable from './PreviewQueryTable'\r\nimport { Link } from 'react-router-dom'\r\nimport withConfig from '../../../wrappers/withConfig'\r\nimport { APIRequestContext } from '../../../wrappers/APIRequestContext'\r\n\r\nconst CreateWidgetForm = ({ config, closeForm, back, page, dateFilter }) => {\r\n const { authenticatedFetch } = useContext(APIRequestContext)\r\n const { register, unregister, handleSubmit, control, errors } = useForm({\r\n mode: 'onChange',\r\n })\r\n const { API_URL } = config\r\n const [id, setId] = useState(null)\r\n const [type, setType] = useState('')\r\n const [query, setQuery] = useState(null)\r\n const [string, setString] = useState(null)\r\n const [preview, setPreview] = useState(null)\r\n const functionOptions = [\r\n { value: 'COUNT', label: 'Count (COUNT)' },\r\n { value: 'SUM', label: 'Sum (SUM)' },\r\n { value: 'AVG', label: 'Average (AVG)' },\r\n { value: 'MIN', label: 'Minimum (MIN)' },\r\n { value: 'MAX', label: 'Maximum (MAX)' },\r\n ]\r\n const initialState = {\r\n AggregateFunction: 'COUNT',\r\n AggregateColumn: '*',\r\n ApplyFiltersToBaseQuery: false,\r\n ApplyDateFilter: dateFilter,\r\n DetailKey: '',\r\n DetailKeyValue: '',\r\n GroupBy: '',\r\n NumRows: null,\r\n }\r\n\r\n const [state, setState] = useState(initialState)\r\n\r\n if (id) {\r\n closeForm(id)\r\n }\r\n\r\n const POST = (widget) => {\r\n return {\r\n method: 'POST',\r\n mode: 'cors',\r\n headers: {\r\n 'Content-Type': 'application/json',\r\n 'Access-Control-Allow-Origin': '*',\r\n 'Access-Control-Allow-Headers':\r\n 'Access-Control-Allow-Origin, X-Requested-With, Content-Type, Accept',\r\n },\r\n body: JSON.stringify(widget),\r\n }\r\n }\r\n\r\n const generateQueryString = (data) => {\r\n authenticatedFetch(`${API_URL}/widget/generate`, POST(data))\r\n .then(async (response) => {\r\n const queryString = await response.text()\r\n if (response.ok) {\r\n return queryString\r\n } else {\r\n throw new Error(queryString)\r\n }\r\n })\r\n .then((response) => {\r\n setString(response)\r\n setQuery(response)\r\n })\r\n .catch((e) => {\r\n setString(e.message)\r\n })\r\n }\r\n\r\n const previewQuery = (queryString) => {\r\n setPreview(null)\r\n authenticatedFetch(`${API_URL}/widget/preview`, POST(queryString))\r\n .then(async (response) => {\r\n if (response.ok) {\r\n return response.json()\r\n } else {\r\n const error = await response.text()\r\n throw new Error(error)\r\n }\r\n })\r\n .then((response) => {\r\n setPreview(response.data)\r\n })\r\n .catch((e) => {\r\n toast({\r\n level: 'error',\r\n message:\r\n 'Create Widget:' +\r\n (e.message ? e.message : 'Query preview failed'),\r\n })\r\n })\r\n }\r\n\r\n const createWidget = (widget) => {\r\n authenticatedFetch(`${API_URL}/admin/widget/create`, POST(widget))\r\n .then(async (response) => {\r\n if (response.ok) {\r\n return response.json()\r\n } else {\r\n const error = await response.text()\r\n throw new Error(error)\r\n }\r\n })\r\n .then((response) => {\r\n setId(response)\r\n })\r\n .catch((e) => {\r\n toast({\r\n level: 'error',\r\n message:\r\n 'Create Widget:' +\r\n (e.message ? e.message : 'Widget create failed'),\r\n })\r\n })\r\n }\r\n\r\n const handleSelectChange = (event) => {\r\n setState({ ...state, [event[1].name]: event[0].value })\r\n if (event[1].name === 'WidgetType') {\r\n setType(event[0].value)\r\n }\r\n return event\r\n }\r\n\r\n const handleMultiChange = (event) => {\r\n event[0]\r\n ? setState({\r\n ...state,\r\n [event[1].name]: event[0]\r\n .map((x) => x.value)\r\n .toString()\r\n .replaceAll(',', '|'),\r\n })\r\n : delete state[event[1].name]\r\n return event[0]\r\n }\r\n\r\n const formChange = (event) => {\r\n if (event.target.name !== '') {\r\n setState({\r\n ...state,\r\n [event.target.name]: event.target.value,\r\n })\r\n }\r\n if (event.target.type === 'checkbox') {\r\n setState({\r\n ...state,\r\n [event.target.name]: event.target.checked,\r\n })\r\n }\r\n if (event.target.name === 'NumRows') {\r\n setState({\r\n ...state,\r\n NumRows:\r\n event.target.value !== ''\r\n ? Number(event.target.value)\r\n : null,\r\n })\r\n }\r\n }\r\n\r\n const handleClick = () => {\r\n const queryString = {\r\n TargetDatabase: state.TargetDatabase,\r\n QueryString: string,\r\n }\r\n previewQuery(queryString)\r\n }\r\n\r\n const trimData = (data) => {\r\n Object.keys(data).map((key) =>\r\n typeof data[key] === 'string'\r\n ? (data[key] = data[key].replace(/\\s\\s+/g, ' ').trim())\r\n : data[key]\r\n )\r\n return data\r\n }\r\n\r\n const onSubmit = (data) => {\r\n createWidget({ ...trimData(state), PageId: page })\r\n }\r\n\r\n const validateOptions = (value) => {\r\n try {\r\n JSON.parse(value)\r\n return true\r\n } catch {\r\n return false\r\n }\r\n }\r\n\r\n return (\r\n <>\r\n Response Data Preview
\r\n\r\n previousPage()}\r\n disabled={!canPreviousPage}\r\n >\r\n {'<'}\r\n {' '}\r\n \r\n Page{' '}\r\n \r\n {pageIndex + 1} of {pageOptions.length}\r\n {' '}\r\n \r\n nextPage()}\r\n disabled={!canNextPage}\r\n >\r\n {'>'}\r\n {' '}\r\n
\r\n \r\n \r\n Preview Query\r\n \r\n \r\n \r\n
\r\n \r\n {preview ? \r\n \r\n
\r\n \r\n \r\n setEditing(true)}\r\n className={textClass}\r\n >\r\n \r\n
\r\n \r\n ”, “style”: {“fillColor”: “fillColor1”, “strokeColor”: “strokeColor1”, “zIndex”: “zIndex1”}}, {“layerName”: “”, “style”: {“fillColor”: “fillColor2”, “strokeColor”: “strokeColor2”, “zIndex”: “zIndex2”}, …]}'\r\n // For 3DFeatureMap, shape should be:\r\n // '{“layers”: [{“layerName”: “”, “style”: {“color”: “color1”, “width”: “width1”, “zIndex”: “zIndex1”}}, {“layerName”: “”, “style”: {“color”: “color2”, “width”: “width2”, “zIndex”: “zIndex2”}, …]}'\"\r\n />\r\n ({\r\n label: item,\r\n value: item,\r\n }))\r\n : null\r\n }\r\n value={state && state.GroupBy ? state.GroupBy.split('|').map((item) => ({\r\n label: item,\r\n value: item,\r\n })) : null}\r\n className={\r\n type.match(/Form|2DFeatureMap|3DFeatureMap/)\r\n ? 'hidden'\r\n : null\r\n }\r\n control={control}\r\n rules={\r\n type.match(/BarChart|ThemeMap/)\r\n ? {\r\n required: {\r\n value: true,\r\n message: 'This field is required.',\r\n },\r\n }\r\n : null\r\n }\r\n errors={errors}\r\n onChange={handleMultiChange}\r\n // helper=\"The type of the Widget. This determines the format in which the Widget data is displayed.\"\r\n // example=\"if you wish to see a Grid that has counts of Permits which can be grouped by District, County, or Township, District + County + Township should each be entered as individual options in this field.\"\r\n />\r\n ({\r\n label: item,\r\n value: item,\r\n }))\r\n : null\r\n }\r\n value={state && state.FeatureFiles ? state.FeatureFiles.split('|').map((item) => ({\r\n label: item,\r\n value: item,\r\n })) : null}\r\n disabled={!editing}\r\n control={control}\r\n className={type !== 'ThemeMap' ? 'hidden' : null}\r\n rules={\r\n type === 'ThemeMap'\r\n ? {\r\n required: {\r\n value: true,\r\n message: 'This field is required.',\r\n },\r\n }\r\n : null\r\n }\r\n onChange={handleMultiChange}\r\n errors={errors}\r\n // helper=\"This is the name of the .json file in the /public directory that contains the GEOJSON features that you wish to associate with the values returned by the Widget Query (in order to create a theme map). There should be exactly one file for every value in the Group By field, and the files should be in the same order listed as Group By.\"\r\n // example=\"We wish to visualize Permit count over Districts or Counties. Group By has values 1) District and 2) County. We have districts.json and counties.json as the corresponding GEOJSON files. So the values in this field should be 1) districts.json and 2) counties.json. If you do not know the names of the .json files associated with different geographical features, or wish to request one, please contact your system administrator.\"\r\n />\r\n
\r\n \r\n {preview ? \r\n \r\n Preview Query\r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n )\r\n}\r\n\r\nexport default withConfig(EditWidget)","import React, { useEffect, useState, useContext } from 'react'\r\nimport toast from '../../../elem/Toast'\r\nimport AdminLayout from '../../../elem/admin/AdminLayout'\r\nimport { CurrentDashboardContext } from '../../../wrappers/CurrentDashboardContext'\r\nimport Widgets from '../../../elem/widgets/Widgets'\r\nimport getLayouts from '../../../../utils/widgets/getLayouts'\r\nimport { Redirect } from 'react-router-dom'\r\nimport withConfig from '../../../wrappers/withConfig'\r\nimport { APIRequestContext } from '../../../wrappers/APIRequestContext'\r\n\r\nconst PageLayoutEditor = ({config}) => {\r\n const {API_URL} = config\r\n const {\r\n currentWidgetGroup,\r\n setLayoutState,\r\n layoutState,\r\n setLayoutEditingState,\r\n } = useContext(CurrentDashboardContext)\r\n const { authenticatedFetch } = useContext(APIRequestContext)\r\n const [edited, setEdited] = useState(null)\r\n const { Widgets: widgets } = currentWidgetGroup\r\n const [initialState, setInitialState] = useState(getLayouts(widgets))\r\n\r\n useEffect(() => {\r\n setLayoutEditingState(true)\r\n !Object.keys(layoutState).length\r\n ? setInitialState(getLayouts(currentWidgetGroup.Widgets))\r\n : setInitialState(layoutState)\r\n }, [currentWidgetGroup])\r\n\r\n if (!widgets && !Object.keys(layoutState).length) {\r\n return null\r\n }\r\n\r\n const PUT = (page) => {\r\n return {\r\n method: 'PUT',\r\n mode: 'cors',\r\n headers: {\r\n 'Content-Type': 'application/json',\r\n 'Access-Control-Allow-Origin': '*',\r\n 'Access-Control-Allow-Headers':\r\n 'Access-Control-Allow-Origin, X-Requested-With, Content-Type, Accept',\r\n },\r\n body: JSON.stringify(page),\r\n }\r\n }\r\n\r\n const updateLayout = (layouts) => {\r\n const pageLayout = {\r\n PageId: widgets[0].PageId,\r\n Widgets: layouts.map((layout) => ({\r\n Width: layout.w,\r\n Height: layout.h,\r\n X: layout.x,\r\n Y: layout.y,\r\n WidgetId: Number(layout.i.replace(/[^0-9.]+/g, '')),\r\n })),\r\n }\r\n \r\n authenticatedFetch(`${API_URL}/admin/updatePageLayout`, PUT(pageLayout))\r\n .then(async (response) => {\r\n if (response.ok) {\r\n return\r\n } else {\r\n const error = await response.text()\r\n throw new Error(error)\r\n }\r\n })\r\n .then(() => {\r\n setLayoutState(layoutState)\r\n setInitialState(layoutState)\r\n setEdited(true)\r\n })\r\n .catch((e) => {\r\n toast({\r\n level: 'error',\r\n message:\r\n 'Page Layout:' +\r\n (e.message\r\n ? e.message\r\n : 'Unable to connect to the server'),\r\n })\r\n })\r\n }\r\n\r\n if (edited) {\r\n return (\r\n \r\n \r\n \r\n
\r\n )\r\n}\r\n\r\nexport default withConfig(PageLayoutEditor)\r\n","export default {\r\n background: {},\r\n backgroundMask: {\r\n cover: {\r\n color: {\r\n value: '#fff',\r\n },\r\n opacity: 1,\r\n },\r\n enable: false,\r\n },\r\n detectRetina: true,\r\n fpsLimit: 30,\r\n infection: {\r\n cure: false,\r\n delay: 0,\r\n enable: false,\r\n infections: 0,\r\n stages: [],\r\n },\r\n interactivity: {\r\n detectsOn: 'canvas',\r\n events: {\r\n onClick: {\r\n enable: false,\r\n mode: 'push',\r\n },\r\n onDiv: {\r\n elementId: '',\r\n enable: false,\r\n mode: [],\r\n },\r\n onHover: {\r\n enable: false,\r\n mode: 'repulse',\r\n parallax: {\r\n enable: false,\r\n force: 60,\r\n smooth: 10,\r\n },\r\n },\r\n resize: true,\r\n },\r\n modes: {\r\n bubble: {\r\n distance: 400,\r\n duration: 2,\r\n opacity: 0.8,\r\n size: 40,\r\n },\r\n connect: {\r\n distance: 80,\r\n links: {\r\n opacity: 0.5,\r\n },\r\n radius: 60,\r\n },\r\n grab: {\r\n distance: 400,\r\n links: {\r\n opacity: 1,\r\n },\r\n },\r\n push: {\r\n quantity: 4,\r\n },\r\n remove: {\r\n quantity: 2,\r\n },\r\n repulse: {\r\n distance: 200,\r\n duration: 0.4,\r\n speed: 1,\r\n },\r\n slow: {\r\n factor: 3,\r\n radius: 200,\r\n },\r\n },\r\n },\r\n particles: {\r\n collisions: {\r\n enable: false,\r\n mode: 'bounce',\r\n },\r\n color: {\r\n value: 'rgb(163, 9, 9)',\r\n animation: {\r\n enable: false,\r\n speed: 1,\r\n sync: true,\r\n },\r\n },\r\n links: {\r\n blink: false,\r\n color: {\r\n value: 'rgb(163, 9, 9)',\r\n },\r\n consent: false,\r\n distance: 150,\r\n enable: true,\r\n opacity: 0.4,\r\n shadow: {\r\n blur: 5,\r\n color: {\r\n value: 'lime',\r\n },\r\n enable: false,\r\n },\r\n triangles: {\r\n enable: false,\r\n },\r\n width: 1,\r\n warp: false,\r\n },\r\n move: {\r\n attract: {\r\n enable: false,\r\n rotate: {\r\n x: 600,\r\n y: 1200,\r\n },\r\n },\r\n direction: 'none',\r\n enable: true,\r\n noise: {\r\n delay: {\r\n random: {\r\n enable: false,\r\n minimumValue: 0,\r\n },\r\n value: 0,\r\n },\r\n enable: false,\r\n factor: {\r\n horizontal: {\r\n value: 50,\r\n offset: 0,\r\n },\r\n vertical: {\r\n value: 10,\r\n offset: 40000,\r\n },\r\n },\r\n },\r\n outMode: 'out',\r\n random: false,\r\n speed: 2,\r\n straight: false,\r\n trail: {\r\n enable: false,\r\n length: 10,\r\n fillColor: {\r\n value: '#000000',\r\n },\r\n },\r\n vibrate: false,\r\n warp: false,\r\n },\r\n number: {\r\n density: {\r\n enable: true,\r\n area: 800,\r\n factor: 1000,\r\n },\r\n limit: 0,\r\n value: 80,\r\n },\r\n opacity: {\r\n animation: {\r\n enable: false,\r\n minimumValue: 0.1,\r\n speed: 1,\r\n sync: false,\r\n },\r\n random: {\r\n enable: false,\r\n minimumValue: 1,\r\n },\r\n value: 0.5,\r\n },\r\n rotate: {\r\n animation: {\r\n enable: false,\r\n speed: 0,\r\n sync: false,\r\n },\r\n direction: 'clockwise',\r\n random: false,\r\n value: 0,\r\n },\r\n shadow: {\r\n blur: 0,\r\n color: {\r\n value: '#000000',\r\n },\r\n enable: false,\r\n offset: {\r\n x: 0,\r\n y: 0,\r\n },\r\n },\r\n shape: {\r\n options: {\r\n character: {\r\n fill: true,\r\n close: true,\r\n font: 'Verdana',\r\n style: '',\r\n value: '*',\r\n weight: '400',\r\n },\r\n char: {\r\n fill: true,\r\n close: true,\r\n font: 'Verdana',\r\n style: '',\r\n value: '*',\r\n weight: '400',\r\n },\r\n image: {\r\n fill: true,\r\n close: true,\r\n height: 100,\r\n replaceColor: false,\r\n src:\r\n 'https://cdn.matteobruni.it/images/particles/github.svg',\r\n width: 100,\r\n },\r\n images: {\r\n fill: true,\r\n close: true,\r\n height: 100,\r\n replaceColor: false,\r\n src:\r\n 'https://cdn.matteobruni.it/images/particles/github.svg',\r\n width: 100,\r\n },\r\n polygon: {\r\n fill: true,\r\n close: true,\r\n sides: 5,\r\n },\r\n star: {\r\n fill: true,\r\n close: true,\r\n sides: 5,\r\n },\r\n },\r\n type: 'circle',\r\n },\r\n size: {\r\n animation: {\r\n destroy: 'none',\r\n enable: false,\r\n minimumValue: 0.1,\r\n speed: 40,\r\n startValue: 'max',\r\n sync: false,\r\n },\r\n random: {\r\n enable: true,\r\n minimumValue: 1,\r\n },\r\n value: 5,\r\n },\r\n stroke: {\r\n color: {\r\n value: '#000000',\r\n },\r\n width: 0,\r\n opacity: 1,\r\n },\r\n twinkle: {\r\n lines: {\r\n enable: false,\r\n frequency: 0.05,\r\n opacity: 1,\r\n },\r\n particles: {\r\n enable: false,\r\n frequency: 0.05,\r\n opacity: 1,\r\n },\r\n },\r\n },\r\n pauseOnBlur: true,\r\n}","import React from 'react'\r\n// import { Link } from 'react-router-dom'\r\nimport Particles from 'react-particles-js'\r\nimport particleConfig from './particleConfig'\r\n\r\nconst ErrorFallback = ({ errorMessage }) => {\r\n\r\n\r\n return(\r\n <>\r\n \r\n
\r\n \r\n {\r\n setLayoutState(initialState)\r\n }}\r\n >\r\n Reset\r\n \r\n {\r\n updateLayout(layoutState.lg)\r\n }}\r\n >\r\n Save\r\n \r\n
\r\n \r\n resetError()}\r\n to={{\r\n pathname: `/`,\r\n }}\r\n >\r\n Return Home\r\n */}\r\n
\r\n Something went wrong...
\r\n{errorMessage}
\r\n {/*\r\n
\r\n \r\n Please {' '}\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n (\r\n \r\n \r\n \r\n \r\n (\r\n \r\n \r\n \r\n \r\n )}\r\n />\r\n (\r\n \r\n \r\n \r\n \r\n )}\r\n />\r\n (\r\n \r\n \r\n \r\n \r\n )}\r\n />\r\n (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )}\r\n />\r\n (\r\n \r\n \r\n \r\n \r\n )}\r\n />\r\n (\r\n \r\n \r\n \r\n \r\n )}\r\n />\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n