\r\n
\r\n );\r\n }\r\n}\r\nexport default (withStyles(styles)(LoginForm));\r\n","import React from 'react';\r\nimport PropTypes from \"prop-types\";\r\nimport { withRouter } from \"react-router\";\r\nimport LoginForm from '../components/forms/loginform/LoginForm';\r\nimport SessionServices from '../utils/SessionServices';\r\nimport { connect } from 'react-redux';\r\nimport { setLoggedUser, SetUserData} from '../redux/actions/UserActions';\r\n\r\nconst LoginPage = ({setUserData, setUserinStore, history}) => {\r\n const login = (result, user, keepLogged) => { \r\n if(result === true){\r\n SessionServices.setAuthContext(user.token, user.name, keepLogged);\r\n setUserinStore();\r\n setUserData(user);\r\n\r\n redirectUser();\r\n }\r\n\r\n return { success: result };\r\n }\r\n \r\n const redirectUser = () => {\r\n //because firefox save the variable in local storage to fast... \r\n setTimeout(() => redirectUserTo(), 100);\r\n }\r\n\r\n const redirectUserTo = () => {\r\n const redirectTo = SessionServices.getRedirectTo();\r\n SessionServices.cleanRedirectTo();\r\n\r\n if (!redirectTo) {\r\n history.replace(\"/dashboard\")\r\n\r\n }\r\n else {\r\n history.replace(redirectTo.substring(1))\r\n } \r\n }\r\n\r\n const renderLogin = () => {\r\n return(\r\n
\r\n \r\n {this.renderSnackbar()}\r\n \r\n\r\n
\r\n \r\n \r\n \r\n 
\r\n \r\n\r\n \r\n {ResourceLang.eneida_backoffice}\r\n \r\n\r\n
\r\n \r\n \r\n \r\n
\r\n\r\n \r\n \r\n \r\n
\r\n\r\n \r\n \r\n \r\n \r\n
\r\n \r\n {this.renderSubmit()}\r\n
\r\n \r\n \r\n
);\r\n }\r\n\r\n\r\n return (- \r\n
\r\n \r\n
);\r\n }\r\n\r\n const handleMenu = (event) => {\r\n setAnchorEl(event.currentTarget);\r\n };\r\n\r\n const handleClose = () => {\r\n setAnchorEl(null);\r\n };\r\n\r\n const handleLogout = async () => {\r\n try{\r\n await requestLogout();\r\n }\r\n catch {}\r\n\r\n SessionServices.cleanAuthContext();\r\n props.logout();\r\n props.clearUserData();\r\n }\r\n\r\n\r\n const renderAppMenu = () => {\r\n return (\r\n \r\n \r\n {renderAppMenu()}\r\n \r\n {ResourceLang.eneida_backoffice}\r\n \r\n {envName ? <> \r\n \r\n \r\n
);\r\n}\r\n\r\n\r\nNavBar.propTypes = {\r\n match: PropTypes.object.isRequired,\r\n location: PropTypes.object.isRequired,\r\n history: PropTypes.object.isRequired\r\n}\r\n\r\nconst mapStateToProps = (state) => {\r\n\treturn {\r\n userStatus: state.userStatus,\r\n userData: state.userData\r\n };\r\n};\r\n\r\nconst mapDispatchToProps = (dispatch) => {\r\n\treturn {\r\n logout: () => dispatch(setLoggedUser(false)),\r\n clearUserData:() => dispatch(SetUserData({})),\r\n };\r\n};\r\n\r\nexport default connect(mapStateToProps, mapDispatchToProps)(withRouter(NavBar));","import React from 'react'\r\nimport PropTypes from 'prop-types';\r\nimport { makeStyles } from '@material-ui/core/styles';\r\nimport { Toolbar, Typography } from '@material-ui/core';\r\n\r\n\r\nconst useStyles = makeStyles(theme => ({\r\n leftIcon: {\r\n margin: theme.spacing(1),\r\n float: 'left'\r\n },\r\n toolbar: {\r\n paddingLeft: theme.spacing(2),\r\n paddingRight: theme.spacing(2),\r\n display: 'flex',\r\n alignItems: 'center',\r\n boxSizing: 'border-box',\r\n flexDirection: 'row',\r\n },\r\n divider: {\r\n marginTop: theme.spacing(2),\r\n marginLeft: theme.spacing(2),\r\n marginRight: theme.spacing(2),\r\n },\r\n title: {\r\n flex: 1,\r\n }\r\n}));\r\n\r\n\r\nconst PageHeader = ({title, icon, ...props}) => {\r\n const classes = useStyles();\r\n\r\n return (<>\r\n \r\n {icon}\r\n
\r\n \r\n \r\n \r\n {renderHeader()}\r\n \r\n \r\n {state.isLoading ? \r\n \r\n\r\n {renderEnvironmentModal()}\r\n {renderConfirmationModal()}\r\n {renderSnackbar()}\r\n
);\r\n}\r\n\r\nexport default withRouter(DashboardPage);","import React from 'react'\r\nimport { withRouter } from \"react-router\";\r\nimport ResourceLang from '../resources/Language';\r\nimport { makeStyles } from '@material-ui/core/styles';\r\nimport PageHeader from '../components/headers/PageHeader';\r\nimport ApartmentIcon from '@material-ui/icons/Apartment';\r\nimport { EnvironmentAPI } from '../utils/APIRequester';\r\nimport { Grid, Typography } from '@material-ui/core';\r\nimport CircularLoading from '../components/loadings/CircularLoading';\r\nimport GenericCard from '../components/cards/GenericCard';\r\nimport MemoryIcon from '@material-ui/icons/Memory';\r\n\r\nconst useStyles = makeStyles(theme => ({\r\n root: {\r\n padding: theme.spacing(1)\r\n },\r\n contentRoot: {\r\n marginLeft: theme.spacing(1),\r\n marginRight: theme.spacing(1)\r\n },\r\n grid: {\r\n padding: theme.spacing(2)\r\n },\r\n cardRoot: {\r\n backgroundColor: '#f5f5f5'\r\n },\r\n}));\r\n\r\n\r\nconst EnvironmentPage = ({ match, location, history, ...props }) => {\r\n const classes = useStyles();\r\n const [state, setState] = React.useState({\r\n isLoading: false,\r\n environment: undefined\r\n\r\n });\r\n\r\n React.useEffect(() => {\r\n if (!state.environment) {\r\n setState((prevState) => ({ ...prevState, isLoading: true }));\r\n\r\n EnvironmentAPI.getOne(match.params.envId)\r\n .then(response => {\r\n setState((prevState) => ({\r\n ...prevState,\r\n isLoading: false,\r\n environment: response\r\n }));\r\n })\r\n .catch(error => {\r\n setState((prevState) => ({\r\n ...prevState,\r\n isLoading: false,\r\n environment: undefined,\r\n }));\r\n });\r\n }\r\n }, [state.environment, match.params.envId]);\r\n\r\n const handleUploadFirmwareClick = () => event => {\r\n history.push(`/environment/${match.params.envId}/uploadfirmware`,\r\n { context: state.environment.Name });\r\n }\r\n\r\n const handleUpdateFirmwareClick = () => event => {\r\n history.push(`/environment/${match.params.envId}/updatefirmware`,\r\n { context: state.environment.Name });\r\n }\r\n\r\n const handleListDeviceClick = () => event => {\r\n history.push(`/environment/${match.params.envId}/device`,\r\n { context: state.environment.Name });\r\n }\r\n\r\n\r\n const renderUploadFirmwareCard = () => {\r\n return (\r\n \r\n \r\n \r\n {renderHeader()}\r\n \r\n \r\n {state.isLoading ? \r\n \r\n
);\r\n}\r\n\r\nexport default withRouter(EnvironmentPage);","import React from 'react'\r\nimport { Typography } from '@material-ui/core'\r\nimport ResourceLang from '../../resources/Language'\r\nimport PropTypes from 'prop-types'\r\nimport { makeStyles } from '@material-ui/core/styles'\r\nimport TreeView from '@material-ui/lab/TreeView'\r\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore'\r\nimport ChevronRightIcon from '@material-ui/icons/ChevronRight'\r\nimport TreeItem from '@material-ui/lab/TreeItem'\r\nimport { colors } from '@material-ui/core'\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n root: {\r\n justifyContent: 'left',\r\n paddingTop: '20px',\r\n overflow: 'auto',\r\n },\r\n item: {\r\n display: 'flex',\r\n paddingTop: 0,\r\n paddingBottom: 0,\r\n },\r\n\r\n button: {\r\n color: colors.yellow[700],\r\n padding: '10px 8px',\r\n justifyContent: 'flex-start',\r\n letterSpacing: 0,\r\n '&:hover': {\r\n color: '#efefef',\r\n },\r\n },\r\n}))\r\n\r\nconst handleSelection = (nodeId, children, ItemSelected) => {\r\n if (children === undefined) {\r\n //this means that the user was clicked in the lowest level\r\n ItemSelected(nodeId)\r\n }\r\n}\r\n\r\nconst DeviceMenuItems = ({ menuItems, ItemSelected }) => {\r\n const classes = useStyles()\r\n const renderTree = (nodes) => {\r\n return (\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n }\r\n onClick={uploadToServer}\r\n >\r\n {ResourceLang.upload}\r\n \r\n
);\r\n }\r\n\r\n const renderDropZoneArea = () => {\r\n if (!micro_controller || !device_type_name || !device_version ) {\r\n return null;\r\n }\r\n \r\n return(\r\n \r\n \r\n \r\n \r\n {renderHeader()}\r\n
\r\n \r\n {!MenuItems ?
);\r\n}\r\n\r\n\r\nexport default withRouter(UploadFirmwarePage);","import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { makeStyles } from '@material-ui/core/styles';\r\nimport { Stepper, Step, StepLabel } from '@material-ui/core';\r\n\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n root: {\r\n width: '100%',\r\n },\r\n button: {\r\n marginRight: theme.spacing(1),\r\n },\r\n instructions: {\r\n marginTop: theme.spacing(1),\r\n marginBottom: theme.spacing(1),\r\n },\r\n}));\r\n\r\n\r\nconst DialogStepper = ({\r\n activeStep, steps, stepProps = {}, labelProps = {}, ...other\r\n}) => {\r\n const classes = useStyles();\r\n return (\r\n \r\n
\r\n {ResourceLang.micro_controller_info} \r\n {ResourceLang.micro_controller} \r\n {renderDeviceTypeIcon()}\r\n {renderExtensionIcon()}\r\n {renderMemoryIcon()}\r\n
\r\n \r\n {renderDropZoneArea()}\r\n
\r\n {renderUploadButton()}\r\n {renderSnackbar()}\r\n \r\n \r\n {steps.map((label) => {\r\n return (\r\n {label} \r\n );\r\n })}\r\n \r\n
\r\n );\r\n}\r\n\r\nDialogStepper.propTypes = {\r\n activeStep: PropTypes.number.isRequired,\r\n steps: PropTypes.array.isRequired\r\n};\r\n\r\nexport default DialogStepper;\r\n","import PropTypes from 'prop-types';\r\nimport Grid from '@material-ui/core/Grid';\r\nimport React from 'react';\r\nimport {makeStyles } from '@material-ui/core/styles';\r\nimport InputLabel from '@material-ui/core/InputLabel';\r\nimport MenuItem from '@material-ui/core/MenuItem';\r\nimport FormControl from '@material-ui/core/FormControl';\r\nimport Select from '@material-ui/core/Select';\r\nimport ResourceLang from '../../resources/Language';\r\nimport { Typography } from '@material-ui/core';\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n button: {\r\n display: 'block',\r\n marginTop: theme.spacing(2),\r\n },\r\n formControl: {\r\n margin: theme.spacing(1),\r\n minWidth: 120,\r\n },\r\n body_content:{\r\n marginTop: 30,\r\n textAlign: 'center'\r\n }\r\n}));\r\n\r\n\r\nconst SelectVersions = ({availableVersions, versionSelected}) => {\r\n const classes = useStyles();\r\n const [versionChoosen, setVersionChoosen] = React.useState('');\r\n const [open, setOpen] = React.useState(false);\r\n\r\n const renderContent = () => {\r\n const handleChange = (event) => {\r\n setVersionChoosen(event.target.value)\r\n versionSelected(availableVersions[event.target.value].current_firmware_version)\r\n };\r\n \r\n const handleClose = () => {\r\n setOpen(false);\r\n };\r\n \r\n const handleOpen = () => {\r\n setOpen(true);\r\n };\r\n\r\n const renderVersionChoosenOnDropDown = () =>{\r\n return(\r\n \r\n \r\n {renderVersionChoosenOnDropDown}\r\n \r\n \r\n
\r\n )\r\n }\r\n\r\n return(\r\n \r\n \r\n {ResourceLang.update_version_choose} \r\n \r\n {renderContent()}\r\n
\r\n \r\n \r\n {({width, height}) => {\r\n const scrollBarSize = scrollbarSize();\r\n const headerRowHeight = rowHeight;\r\n return (<>\r\n \r\n );\r\n }}\r\n \r\n
);\r\n }\r\n\r\n\r\n return (\r\n
\r\n \r\n
);\r\n }\r\n return (<>{renderContent()})\r\n}\r\n\r\nUploadReview.propTypes = {\r\n devices: PropTypes.object.isRequired,\r\n next_version: PropTypes.string.isRequired\r\n};\r\n\r\nexport default UploadReview;","import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport ResourceLang from '../../resources/Language'\r\nimport {\r\n AutoSizer,\r\n Column,\r\n Table,\r\n InfiniteLoader,\r\n SortIndicator,\r\n defaultTableRowRenderer,\r\n} from 'react-virtualized'\r\nimport { Link } from 'react-router-dom'\r\nimport {\r\n ContextMenu,\r\n ContextMenuTrigger,\r\n connectMenu,\r\n hideMenu,\r\n} from 'react-contextmenu'\r\nimport { withStyles } from '@material-ui/core/styles'\r\nimport clsx from 'clsx'\r\nimport {\r\n TableRow,\r\n TableCell,\r\n Tooltip,\r\n Typography,\r\n IconButton,\r\n Paper,\r\n MenuList,\r\n MenuItem,\r\n Checkbox,\r\n} from '@material-ui/core'\r\nimport ExpandLessIcon from '@material-ui/icons/ExpandLess'\r\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore'\r\n\r\nconst styles = (theme) => ({\r\n flexContainer: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n boxSizing: 'border-box',\r\n },\r\n table: {\r\n // temporary right-to-left patch, waiting for\r\n // https://github.com/bvaughn/react-virtualized/issues/454\r\n '& .ReactVirtualized__Table__headerRow': {\r\n flip: false,\r\n paddingRight: theme.direction === 'rtl' ? '0px !important' : undefined,\r\n },\r\n },\r\n tableRow: {\r\n cursor: 'pointer',\r\n },\r\n tableRowHover: {\r\n '&:hover': {\r\n backgroundColor: theme.palette.grey[200],\r\n },\r\n },\r\n tableCell: {\r\n flex: 1,\r\n },\r\n tableFooter: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n },\r\n footerlabel: {\r\n marginLeft: theme.spacing(3),\r\n },\r\n firstCell: {\r\n marginLeft: theme.spacing(1),\r\n },\r\n noClick: {\r\n cursor: 'initial',\r\n },\r\n})\r\n\r\nconst MENU_TYPE = 'DYNAMIC'\r\nconst collectTriggerProps = (props) => props\r\n\r\nconst DynamicMenu = ({ id, contextMenuOptions, trigger }) => {\r\n const { data } = trigger || {}\r\n\r\n return (\r\n {rowIndex + 1}
\r\n } else if (column.render) {\r\n value = column.render(rowData)\r\n } else if (column.date === true) {\r\n const date = new Date(cellData)\r\n value = `${date.toLocaleDateString()} ${date.toLocaleTimeString()}`\r\n } else if (column.numeric === true) {\r\n const decimalPlaces = column.decimalPlaces || 2\r\n if (cellData && !isNaN(cellData)) {\r\n value = Number(\r\n Math.round(value + ('e' + decimalPlaces)) + ('e-' + decimalPlaces)\r\n ).toFixed(decimalPlaces)\r\n } else value = '-'\r\n }\r\n\r\n if (column.link) {\r\n value = (\r\n \r\n \r\n {\r\n selectAll(e)\r\n }}\r\n color='primary'\r\n checked={allSelected}\r\n />\r\n \r\n {sortBy === dataKey && (\r\n
\r\n )\r\n } else {\r\n content = (\r\n <>\r\n {label}\r\n {sortBy === dataKey && (\r\n {rowIndex + 1}
\r\n } else if (column.render) {\r\n value = column.render(rowData)\r\n } else if (column.date === true) {\r\n const date = new Date(cellData)\r\n value = `${date.toLocaleDateString()} ${date.toLocaleTimeString()}`\r\n } else if (column.numeric === true) {\r\n const decimalPlaces = column.decimalPlaces || 2\r\n if (cellData && !isNaN(cellData)) {\r\n value = Number(\r\n Math.round(value + ('e' + decimalPlaces)) + ('e-' + decimalPlaces)\r\n ).toFixed(decimalPlaces)\r\n } else value = '-'\r\n }\r\n\r\n if (column.link) {\r\n value = (\r\n \r\n {label}\r\n {sortBy === dataKey && (\r\n
\r\n )\r\n } else {\r\n content = (\r\n <>\r\n {label}\r\n {sortBy === dataKey && (\r\n {renderContent()}
\r\n \r\n )\r\n}\r\n\r\nFilterPopover.propTypes = {\r\n filters: PropTypes.arrayOf(\r\n PropTypes.shape({\r\n key: PropTypes.string.isRequired,\r\n label: PropTypes.string.isRequired,\r\n type: PropTypes.oneOf(['date', 'text', 'select']),\r\n options: PropTypes.arrayOf(\r\n PropTypes.shape({\r\n name: PropTypes.string.isRequired,\r\n value: PropTypes.oneOfType([PropTypes.number, PropTypes.string])\r\n .isRequired,\r\n })\r\n ),\r\n getOptions: PropTypes.func,\r\n value: PropTypes.oneOfType([\r\n PropTypes.string,\r\n PropTypes.number,\r\n PropTypes.instanceOf(Date),\r\n PropTypes.arrayOf(\r\n PropTypes.shape({\r\n name: PropTypes.string.isRequired,\r\n value: PropTypes.oneOfType([PropTypes.number, PropTypes.string])\r\n .isRequired,\r\n })\r\n ),\r\n ]),\r\n multiple: PropTypes.bool,\r\n maxValueKey: PropTypes.string,\r\n minValueKey: PropTypes.string,\r\n })\r\n ).isRequired,\r\n anchorEl: PropTypes.oneOfType([\r\n PropTypes.instanceOf(Element),\r\n PropTypes.func,\r\n ]),\r\n updateAnchorEl: PropTypes.func.isRequired,\r\n onChange: PropTypes.func.isRequired,\r\n}\r\n\r\nexport default withStyles(styles)(FilterPopover)\r\n","export function getLocalDateTimeString(value){\r\n if(!value || value === '')\r\n return '';\r\n\r\n const date = (typeof(value) === 'string' || typeof(value) === 'number' ?\r\n new Date(value) : value);\r\n\r\n return `${date.toLocaleDateString()} ${date.toLocaleTimeString()}`;\r\n}\r\n\r\nexport function getDateTimeStringFormat(date){\r\n if(date === null || date === undefined || date === '')\r\n return '';\r\n \r\n return date.toLocaleDateString() + \" \" + date.toLocaleTimeString();\r\n}\r\n\r\nexport function is12Hours(date) {\r\n return date.toLocaleTimeString().match(/am|pm/i);\r\n}\r\n\r\nexport function addDays (date, days) {\r\n const newDate = new Date(date);\r\n newDate.setDate(date.getDate() + days);\r\n return newDate;\r\n}\r\n\r\nexport function addMonths (date, moths) {\r\n const newDate = new Date(date);\r\n newDate.setMonth(date.getMonth() + moths);\r\n return newDate;\r\n}\r\n\r\n\r\n","import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport { withStyles } from '@material-ui/core/styles'\r\nimport FilterListIcon from '@material-ui/icons/FilterList'\r\nimport FilterPopover from '../filters/FilterPopover'\r\nimport Tooltip from '@material-ui/core/Tooltip'\r\nimport { IconButton } from '@material-ui/core'\r\nimport ResourceLang from '../../resources/Language'\r\n\r\nconst styles = () => ({\r\n header: {\r\n display: 'flex',\r\n flexDirection: 'row',\r\n height: '2rem',\r\n alignItems: 'center',\r\n backgroundColor: 'rgba(0, 0, 0, 0.05)',\r\n border: '1px solid rgba(0, 0, 0, 0.15)',\r\n borderRadius: '0.5vh',\r\n },\r\n title: {\r\n fontWeight: 'bold',\r\n fontSize: '14px',\r\n },\r\n leftCell: {\r\n marginLeft: '1.5rem',\r\n marginRight: 'auto',\r\n },\r\n rightCell: {\r\n marginRight: '1.5rem',\r\n marginLeft: 'auto',\r\n },\r\n})\r\n\r\nconst TableHeader = ({\r\n tableTitle,\r\n filters,\r\n anchorEl,\r\n updateAnchorEl,\r\n setFilters,\r\n classes,\r\n showFilters,\r\n}) => {\r\n return (\r\n <>\r\n \r\n
\r\n \r\n )\r\n}\r\n\r\nTableHeader.propTypes = {\r\n tableTitle: PropTypes.string,\r\n filters: PropTypes.array.isRequired,\r\n anchorEl: PropTypes.oneOfType([\r\n PropTypes.instanceOf(Element),\r\n PropTypes.func,\r\n ]),\r\n updateAnchorEl: PropTypes.func.isRequired,\r\n setFilters: PropTypes.func.isRequired,\r\n showFilters: PropTypes.bool,\r\n}\r\n\r\nexport default withStyles(styles)(TableHeader)\r\n","import React, { useEffect, useState } from 'react'\r\nimport ResourceLang from '../../resources/Language'\r\nimport { withRouter } from 'react-router'\r\nimport Grid from '@material-ui/core/Grid'\r\nimport Checkbox from '@material-ui/core/Checkbox'\r\nimport { compareValues } from '../../utils/BrowserServices'\r\nimport MuiFiltersSelectAllVirtualizedTable from '../tables/MuiFiltersSelectAllVirtualizedTable'\r\nimport MuiVirtualizedTable from '../tables/MuiVirtualizedTable'\r\nimport CircularLoading from '../loadings/CircularLoading'\r\nimport { SortDirection } from 'react-virtualized'\r\nimport PropTypes from 'prop-types'\r\nimport { DEVICE_KEYS_ENUM } from '../../utils/Enums'\r\nimport TableHeader from '../tables/TableHeader'\r\n\r\nconst SelectDevices = ({\r\n devices,\r\n selectedDevices,\r\n availableVersions,\r\n filteredAvailableVersions,\r\n handleSelection,\r\n handleAllSelections,\r\n isLoading,\r\n currentVersions,\r\n updateVersions,\r\n handleFilters,\r\n}) => {\r\n const pageHeight = window.innerHeight\r\n const percentageOffSet = 0.45\r\n const [versionsSort, setVersionsSort] = useState({\r\n sortBy: DEVICE_KEYS_ENUM.CURRENT_VERSION,\r\n sortDirection: 'DESC',\r\n })\r\n const [devicesSort, setDevicesSort] = useState({\r\n sortBy: DEVICE_KEYS_ENUM.SERIAL_NUMBER,\r\n sortDirection: 'DESC',\r\n })\r\n const [allSelected, setAllSelected] = useState(false)\r\n\r\n const [anchorEl, updateAnchorEl] = useState(null)\r\n const [filters, setFilters] = useState([\r\n {\r\n key: 'current_version',\r\n label: ResourceLang.current_version,\r\n type: 'select',\r\n options: currentVersions,\r\n },\r\n {\r\n key: 'update_version',\r\n label: ResourceLang.update_version,\r\n type: 'select',\r\n options: updateVersions,\r\n },\r\n ])\r\n\r\n useEffect(() => {\r\n filters.forEach((filter) => {\r\n if (filter.key === 'current_version') {\r\n filter.options = currentVersions\r\n }\r\n\r\n if (filter.key === 'update_version') {\r\n filter.options = updateVersions\r\n }\r\n })\r\n }, [currentVersions, updateVersions, filters])\r\n\r\n useEffect(() => {\r\n handleFilters(filters)\r\n }, [filters, handleFilters])\r\n\r\n const handleSelectDevice = (rowData, event) => {\r\n handleSelection(rowData, event.target.checked)\r\n }\r\n\r\n const isSelected = (rowData) => {\r\n const isChecked = selectedDevices.some(function (device) {\r\n return device.device_id === rowData.device_id\r\n })\r\n\r\n return isChecked\r\n }\r\n\r\n const getTableItems = (items, sort) => {\r\n if (sort.sortDirection === SortDirection.ASC) {\r\n items.sort((a, b) => compareValues(b[sort.sortBy], a[sort.sortBy]))\r\n } else {\r\n items.sort((a, b) => compareValues(a[sort.sortBy], b[sort.sortBy]))\r\n }\r\n return items\r\n }\r\n\r\n const selectAll = (event) => {\r\n handleAllSelections(devices, event.target.checked)\r\n setAllSelected(event.target.checked)\r\n }\r\n\r\n const renderDevicesTable = () => {\r\n if (devices !== undefined && devices.length > 0) {\r\n const columns = [\r\n {\r\n columnWidth: 35,\r\n label: '#',\r\n dataKey: DEVICE_KEYS_ENUM.DEVICE_ID,\r\n disableSort: true,\r\n render: (rowData) => {\r\n return (\r\n \r\n {tableTitle}\r\n
\r\n {showFilters === false ? (\r\n <>\r\n ) : (\r\n <>\r\n \r\n \r\n updateAnchorEl(event.currentTarget)}\r\n >\r\n \r\n
\r\n \r\n )}\r\n \r\n
\r\n )\r\n }\r\n\r\n const renderFooter = () => {\r\n return (\r\n \r\n
\r\n )\r\n }\r\n\r\n return (\r\n \r\n
\r\n \r\n \r\n <>{ResourceLang.back}\r\n \r\n \r\n {state.activeStep === steps.length - 1 ? 'submit' : 'next'}\r\n \r\n
\r\n \r\n \r\n \r\n \r\n {renderHeader()}\r\n
\r\n
\r\n \r\n
\r\n \r\n {ResourceLang.micro_controller_info}\r\n \r\n {/* TODO: Do not have inline styles */}\r\n {/* */}\r\n {ResourceLang.micro_controller} \r\n {renderDeviceTypeIcon()}\r\n {renderExtensionIcon()}\r\n {renderMemoryIcon()}\r\n {renderUpdateFirmwareButton()}\r\n {/*
*/}\r\n \r\n {renderFilterButton()}\r\n
\r\n {renderFirmwarePanel()}
\r\n {renderSnackbar()}\r\n \r\n {!MenuItems ? {rowIndex + 1}
\r\n } else if (column.render) {\r\n value = column.render(rowData)\r\n } else if (column.date === true) {\r\n const date = new Date(cellData)\r\n value = `${date.toLocaleDateString()} ${date.toLocaleTimeString()}`\r\n } else if (column.numeric === true) {\r\n const decimalPlaces = column.decimalPlaces || 2\r\n if (cellData && !isNaN(cellData)) {\r\n value = Number(\r\n Math.round(value + ('e' + decimalPlaces)) + ('e-' + decimalPlaces)\r\n ).toFixed(decimalPlaces)\r\n } else value = '-'\r\n }\r\n\r\n if (column.link) {\r\n value = (\r\n \r\n {label}\r\n {sortBy === dataKey && (\r\n
\r\n )\r\n } else {\r\n content = (\r\n <>\r\n {label}\r\n {sortBy === dataKey && (\r\n \r\n \r\n \r\n \r\n {renderPageHeader()}\r\n \r\n {hasFilters ? (\r\n \r\n {renderFilters(filterValues)}\r\n \r\n ) : null}\r\n \r\n \r\n \r\n {renderTable()}\r\n \r\n \r\n \r\n {isLoading ?
\r\n )\r\n}\r\n\r\nexport default withRouter(ListDevicePage)","export function isDTVI(typeDescription){\r\n \r\n return (typeDescription === \"DTVIg\"\r\n || typeDescription === \"DTVIm\"\r\n || typeDescription === \"DTVI4g\"\r\n || typeDescription === \"DTVI-g PMT2\"\r\n || typeDescription === \"DTVI4-g PMT2\"\r\n || typeDescription === \"Pole Mount DTVIg\"\r\n || typeDescription === \"Pole Mount DTVI4-g\");\r\n}\r\n\r\nexport function isPoleMountedOrDtvi4G(typeDescription){\r\n return (typeDescription === \"DTVI-g PMT2\"\r\n || typeDescription === \"DTVI4-g PMT2\"\r\n || typeDescription === \"Pole Mount DTVIg\"\r\n || typeDescription === \"Pole Mount DTVI4-g\"\r\n || typeDescription === \"DTVI4-g\");\r\n}\r\n\r\nexport function isDTE(typeDescription){\r\n return (typeDescription === \"DTE\");\r\n}","import React, { useState } from 'react';\r\nimport {InputGroup, InputGroupAddon, InputGroupText, Input, FormFeedback } from 'reactstrap';\r\nimport { makeStyles } from '@material-ui/core/styles';\r\nimport VisibilityIcon from '@material-ui/icons/Visibility';\r\nimport VisibilityOffIcon from '@material-ui/icons/VisibilityOff';\r\n\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n passwordToogle: {\r\n cursor: 'pointer'\r\n }\r\n}));\r\n\r\n\r\nconst usePasswordToggle = () => {\r\n const [visible, setVisiblity] = useState(false);\r\n\r\n const Icon = (\r\n visible === true ?\r\n \r\n \r\n \r\n {titleRenderer()}\r\n \r\n \r\n {children}\r\n \r\n {actionsRenderer ?(\r\n \r\n {actionsRenderer()}\r\n ) : null\r\n }\r\n \r\n
);\r\n}\r\n\r\n\r\nDialog.propTypes = {\r\n open: PropTypes.bool.isRequired,\r\n fullWidth: PropTypes.bool,\r\n disableBackdropClick: PropTypes.bool,\r\n disableEscapeKeyDown: PropTypes.bool,\r\n onClose: PropTypes.func.isRequired,\r\n closeLabel: PropTypes.string,\r\n titleRenderer: PropTypes.func.isRequired,\r\n actionsRenderer: PropTypes.func\r\n};\r\n\r\nexport default Dialog;","\r\nimport MuiVirtualizedTable from '../../../components/tables/MuiVirtualizedTable';\r\nimport ResourceLang from '../../../resources/Language';\r\nimport PropTypes from 'prop-types';\r\nimport cloneDeep from 'lodash/cloneDeep';\r\n\r\nconst NTPSettings = ({settings}) => {\r\n\r\n const DEVICE_SETTINGS_KEYS = {\r\n TIMESERVER_URL: 'timeserver_url',\r\n TIMESERVER_PORT:'timeserver_port',\r\n TIMESERVER_PROTOCOL: 'timeserver_protocol',\r\n TIMESERVER_TYPE: 'timeserver_type' \r\n }\r\n const translatedSettings = cloneDeep(settings);\r\n\r\n function translateSettingsToTableRender(settingsToUpdate) {\r\n if(settingsToUpdate.timeserver_type !== undefined){\r\n if(settingsToUpdate.timeserver_type === 0){\r\n settingsToUpdate.timeserver_type = ResourceLang.ntp\r\n }\r\n else if (settingsToUpdate.timeserver_type === 1)\r\n {\r\n settingsToUpdate.timeserver_type = ResourceLang.htp\r\n }\r\n else if (settingsToUpdate.timeserver_type === 2)\r\n {\r\n settingsToUpdate.timeserver_type = ResourceLang.deepgrid\r\n }\r\n }\r\n }\r\n\r\n\r\n const renderSettingsTable = () => {\r\n if (translatedSettings !== undefined ) {\r\n translateSettingsToTableRender(translatedSettings[0])\r\n const columns = [\r\n {\r\n columnWidth: 75,\r\n label: ResourceLang.timeserver_url,\r\n dataKey: DEVICE_SETTINGS_KEYS.TIMESERVER_URL,\r\n disableSort: false,\r\n },\r\n {\r\n columnWidth: 75,\r\n label: ResourceLang.timeserver_port,\r\n dataKey: DEVICE_SETTINGS_KEYS.TIMESERVER_PORT,\r\n disableSort: false,\r\n },\r\n {\r\n columnWidth: 75,\r\n label: ResourceLang.timeserver_protocol,\r\n dataKey: DEVICE_SETTINGS_KEYS.TIMESERVER_PROTOCOL,\r\n disableSort: false,\r\n },\r\n {\r\n columnWidth: 75,\r\n label: ResourceLang.timeserver_type,\r\n dataKey: DEVICE_SETTINGS_KEYS.TIMESERVER_TYPE,\r\n disableSort: false,\r\n }\r\n ];\r\n \r\n return (\r\n
);\r\n }\r\n\r\n const renderNTPSettings = () => {\r\n translateSettingsToTableRender(translatedSettings[0])\r\n const gridRowGetter = (index) => { return translatedSettings[index]; }\r\n const columns = [\r\n {\r\n columnWidth: 75,\r\n label: ResourceLang.timeserver_url,\r\n dataKey: DEVICE_SETTINGS_KEYS.TIMESERVER_URL,\r\n disableSort: false,\r\n },\r\n {\r\n columnWidth: 75,\r\n label: ResourceLang.timeserver_port,\r\n dataKey: DEVICE_SETTINGS_KEYS.TIMESERVER_PORT,\r\n disableSort: false,\r\n },\r\n {\r\n columnWidth: 75,\r\n label: ResourceLang.timeserver_protocol,\r\n dataKey: DEVICE_SETTINGS_KEYS.TIMESERVER_PROTOCOL,\r\n disableSort: false,\r\n },\r\n {\r\n columnWidth: 75,\r\n label: ResourceLang.timeserver_type,\r\n dataKey: DEVICE_SETTINGS_KEYS.TIMESERVER_TYPE,\r\n disableSort: false,\r\n }\r\n ];\r\n \r\n return (\r\n
);\r\n }\r\n\r\n\r\n return (<>{renderContent()})\r\n}\r\n\r\nUpdateNTPSettings.propTypes = {\r\n devices: PropTypes.array.isRequired,\r\n dataToBeUpdated: PropTypes.array.isRequired\r\n};\r\n\r\nexport default UpdateNTPSettings;","import React from 'react';\r\nimport ResourceLang from '../../../resources/Language';\r\nimport PropTypes from 'prop-types';\r\nimport { Grid, InputLabel } from '@material-ui/core';\r\nimport RawVirtualizedGrid from '../../tables/RawVirtualizedGrid';\r\nimport cloneDeep from 'lodash/cloneDeep';\r\n\r\nconst UpdateAPNSettings = ({devices, dataToBeUpdated}) => {\r\n\r\n const DeviceKeysEnum = {\r\n SERIAL_NUMBER: 'serial_number'\r\n }\r\n\r\n const DEVICE_SETTINGS_KEYS = {\r\n APN_NAME: 'apn_name',\r\n APN_USER:'apn_user',\r\n APN_PWD: 'apn_pwd',\r\n APN_AUTH_TYPE: 'apn_auth_type' \r\n }\r\n\r\n const APN_SETTINGS_INDEX = {\r\n PAP: 1,\r\n CHAP: 2,\r\n PAP_OR_CHAP: 3\r\n }\r\n\r\n function translateApnAuthType(translatedSettings){\r\n if(translatedSettings.apn_auth_type === APN_SETTINGS_INDEX.PAP){\r\n translatedSettings.apn_auth_type = ResourceLang.PAP\r\n }\r\n else if (translatedSettings.apn_auth_type === APN_SETTINGS_INDEX.CHAP)\r\n {\r\n translatedSettings.apn_auth_type = ResourceLang.CHAP\r\n }\r\n else if (translatedSettings.apn_auth_type === APN_SETTINGS_INDEX.PAP_OR_CHAP)\r\n {\r\n translatedSettings.apn_auth_type = ResourceLang.PAP_OR_CHAP\r\n }\r\n }\r\n \r\n function translatePwd(translatedSettings){\r\n let password_chars=\"\";\r\n for(let index = 0;index\r\n
);\r\n }\r\n\r\n const renderApnSettings = () => {\r\n translateSettingsToTableRender(translatedSettings[0])\r\n const gridRowGetter = (index) => { return translatedSettings[index]; }\r\n const columns = [\r\n {\r\n columnWidth: 150,\r\n label: ResourceLang.name,\r\n dataKey: DEVICE_SETTINGS_KEYS.APN_NAME,\r\n disableSort: false,\r\n },\r\n {\r\n columnWidth: 75,\r\n label: ResourceLang.User,\r\n dataKey: DEVICE_SETTINGS_KEYS.APN_USER,\r\n disableSort: false,\r\n },\r\n {\r\n columnWidth: 75,\r\n label: ResourceLang.password,\r\n dataKey: DEVICE_SETTINGS_KEYS.APN_PWD,\r\n disableSort: false,\r\n },\r\n {\r\n columnWidth: 100,\r\n label: ResourceLang.Auth,\r\n dataKey: DEVICE_SETTINGS_KEYS.APN_AUTH_TYPE,\r\n disableSort: false\r\n }\r\n ];\r\n return (\r\n
);\r\n }\r\n\r\n\r\n return (<>{renderContent()})\r\n}\r\n\r\nUpdateAPNSettings.propTypes = {\r\n devices: PropTypes.array.isRequired,\r\n dataToBeUpdated: PropTypes.array.isRequired\r\n};\r\n\r\nexport default UpdateAPNSettings;","import React, { useEffect } from 'react';\r\nimport Button from '@material-ui/core/Button';\r\nimport ResourceLang from '../../../resources/Language';\r\nimport PropTypes from 'prop-types';\r\nimport DialogStepper from '../../stepper/DialogStepper'\r\nimport Grid from '@material-ui/core/Grid';\r\nimport Dialog from '../Dialog';\r\nimport SelectDeviceSettings from \"../../panels/settings/SelectDeviceSettings\";\r\nimport UpdateNTPSettingsReview from '../../panels/settings/UpdateNTPSettingsReview';\r\nimport UpdateAPNSettingsReview from '../../panels/settings/UpdateAPNSettingsReview';\r\nimport MessageSnackbar from '../../notifications/MessageSnackbar';\r\nimport { FirmwareAPI } from \"../../../utils/APIRequester\";\r\nimport {SETTINGS_TYPE_ENUM } from '../../../utils/Enums';\r\n\r\n\r\nfunction getSteps() {\r\n return [ResourceLang.select_devices,\r\n ResourceLang.review_and_confirmation];\r\n}\r\n\r\nconst SELECT_DEVICES_STEP = 0;\r\nconst REVIEW_STEP = 1;\r\n\r\nconst DeviceSettingsDialog = ({ isOpen, closeModal, settingsType, envId,\r\n deviceItemId, dataToBeUpdated }) => {\r\n const [ snackbar, setSnackbar] = React.useState({ open: false, variant: 'error', message: ''});\r\n const [ state, setState] = React.useState({\r\n devices: [],\r\n selectedDevices: [],\r\n activeStep: 0,\r\n name: undefined,\r\n description: undefined,\r\n disableNext: true,\r\n error: false,\r\n isLoading: true,\r\n selectedSds: []\r\n });\r\n const steps = getSteps();\r\n\r\n const getAllData = React.useCallback(() => {\r\n Promise.all([\r\n FirmwareAPI.getDevicesFamilyByDeviceId(envId, deviceItemId)\r\n ])\r\n .then(responses => {\r\n if (responses[0] && Array.isArray(responses[0])) {\r\n setState(prevState => ({\r\n ...prevState,\r\n isLoading: false,\r\n devices: responses[0]\r\n }));\r\n }\r\n }).catch(error => {\r\n setState((prevState) => ({\r\n ...prevState,\r\n isLoading: false,\r\n }));\r\n })\r\n },[envId, deviceItemId]);\r\n\r\n\r\n useEffect(() => {\r\n const load = async () => {\r\n getAllData()\r\n }\r\n if(isOpen){\r\n load();\r\n setState(prevState => ({\r\n ...prevState,\r\n isLoading: false\r\n }));\r\n }\r\n\r\n }, [isOpen, getAllData]);\r\n\r\n\r\n const handleClose = () => {\r\n setState((prevState) => ({\r\n ...prevState, \r\n activeStep: SELECT_DEVICES_STEP,\r\n devices: [],\r\n selectedDevices: [],\r\n disableNext: true\r\n }));\r\n closeModal()\r\n };\r\n\r\n function updateAPNSettingsIntoServer(deviceIds, dataToUpdate){\r\n const formData = new FormData();\r\n formData.append('gprs', JSON.stringify(dataToUpdate));\r\n formData.append('ids', JSON.stringify(deviceIds));\r\n FirmwareAPI.putGPRSSettingsInBatchByDevice(envId, formData)\r\n .then(response => {\r\n setSnackbar((prevState) => ({...prevState, \r\n open: true,\r\n variant: \"success\",\r\n message: ResourceLang.update_devices_with_success\r\n }));\r\n }).catch(error => {\r\n setSnackbar((prevState) => ({...prevState, \r\n open: true,\r\n variant: \"error\",\r\n message: ResourceLang.generic_error\r\n }));\r\n })\r\n }\r\n\r\n function updateNTPSettingsIntoServer(deviceIds,dataToUpdate ){\r\n const formData = new FormData();\r\n formData.append('ntp', JSON.stringify(dataToUpdate));\r\n formData.append('ids', JSON.stringify(deviceIds));\r\n FirmwareAPI.putNTPSettingsInBatchByDevice(envId, formData)\r\n .then(response => {\r\n setSnackbar((prevState) => ({...prevState, \r\n open: true,\r\n variant: \"success\",\r\n message: ResourceLang.update_devices_with_success\r\n }));\r\n }).catch(error => {\r\n setSnackbar((prevState) => ({...prevState, \r\n open: true,\r\n variant: \"error\",\r\n message: ResourceLang.generic_error\r\n }));\r\n })\r\n }\r\n\r\n function prepareItemsToUpdateOnServer(devices, dataToUpdate) {\r\n var deviceIds = []\r\n if(devices && dataToUpdate){\r\n devices.forEach(item => {\r\n deviceIds.push(item.device_id)\r\n });\r\n if(settingsType === SETTINGS_TYPE_ENUM.APN){\r\n updateAPNSettingsIntoServer(deviceIds, dataToUpdate)\r\n }\r\n else if (settingsType === SETTINGS_TYPE_ENUM.NTP){\r\n updateNTPSettingsIntoServer(deviceIds, dataToUpdate)\r\n }\r\n }\r\n }\r\n\r\n const submitUpdate = () => {\r\n prepareItemsToUpdateOnServer(state.selectedDevices, dataToBeUpdated[0])\r\n setState((prevState) => ({\r\n ...prevState, \r\n activeStep: SELECT_DEVICES_STEP,\r\n devices: [],\r\n selectedDevices: [],\r\n disableNext: true\r\n }));\r\n closeModal();\r\n }\r\n\r\n const handleNext = () => {\r\n if(state.activeStep === REVIEW_STEP){\r\n submitUpdate()\r\n }\r\n else{\r\n setState((prevState) => ({\r\n ...prevState, \r\n activeStep: state.activeStep + 1\r\n }));\r\n }\r\n };\r\n\r\n const handleBack = () => {\r\n if(state.activeStep === SELECT_DEVICES_STEP){\r\n setState((prevState) => ({\r\n ...prevState, \r\n activeStep: SELECT_DEVICES_STEP,\r\n devices: [],\r\n selectedDevices: [],\r\n disableNext: true\r\n }));\r\n closeModal();\r\n }\r\n else{\r\n setState((prevState) => ({\r\n ...prevState, \r\n activeStep: state.activeStep - 1\r\n }));\r\n }\r\n };\r\n\r\n const setDeviceSelected = (rowData, isChecked) => {\r\n var devices = state.selectedDevices;\r\n\r\n if (isChecked === true) {\r\n devices.push(rowData);\r\n } else {\r\n devices = state.selectedDevices.filter(function (device) {\r\n return device.device_id !== rowData.device_id;\r\n });\r\n }\r\n\r\n return devices;\r\n }\r\n\r\n\r\n const handleSelection = (rowData, isChecked) => {\r\n if (rowData !== undefined) {\r\n const devices = setDeviceSelected(rowData, isChecked)\r\n if(devices.length){\r\n setState((prevState) => ({\r\n ...prevState, \r\n selectedDevices: devices,\r\n disableNext: false\r\n }));\r\n }\r\n else{\r\n setState((prevState) => ({\r\n ...prevState, \r\n selectedDevices: devices,\r\n disableNext: true\r\n }));\r\n }\r\n }\r\n }\r\n\r\n const selectAllDevices = () =>{\r\n setState((prevState) => ({\r\n ...prevState, \r\n selectedDevices: state.devices,\r\n disableNext: false\r\n }));\r\n }\r\n\r\n const clearAllSelectedDevices = () =>{\r\n setState((prevState) => ({\r\n ...prevState, \r\n selectedDevices: [],\r\n disableNext:true\r\n }));\r\n }\r\n\r\n const renderBody = () => {\r\n if(state.devices !== undefined)\r\n {\r\n switch (state.activeStep) {\r\n case 0:\r\n return(\r\n
\r\n )\r\n }\r\n\r\n const renderFooter = () => {\r\n return (\r\n \r\n
\r\n )\r\n }\r\n\r\n const handleSnackbarClose = () =>{\r\n setSnackbar((prevState) => ({...prevState, \r\n open: false, \r\n }));\r\n }\r\n\r\n const renderSnackbar = () => {\r\n return (\r\n
\r\n \r\n \r\n \r\n {state.activeStep === steps.length - 1 ? 'submit' : 'next'}\r\n \r\n
\r\n \r\n \r\n {renderSnackbar()}\r\n
\r\n );\r\n}\r\n\r\nDeviceSettingsDialog.propTypes = {\r\n isOpen: PropTypes.bool.isRequired,\r\n closeModal: PropTypes.func.isRequired,\r\n settingsType: PropTypes.number.isRequired,\r\n envId: PropTypes.string.isRequired,\r\n deviceItemId: PropTypes.string.isRequired,\r\n dataToBeUpdated: PropTypes.array.isRequired\r\n};\r\n\r\nexport default DeviceSettingsDialog;","import React, { useState } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport ResourceLang from '../../../resources/Language';\r\nimport InputPassword from '../../../components/inputs/InputPassword';\r\nimport {FirmwareAPI} from '../../../utils/APIRequester';\r\nimport { OvalButtonPrimary, useStyles as ovalByttonsStyleBase } from '../../../components/buttons/OvalButtons';\r\nimport { CircularButtonTransparent } from '../../../components/buttons/CircularButtons';\r\nimport { makeStyles } from '@material-ui/core/styles';\r\nimport { Row, Col, FormGroup, Label, Input } from 'reactstrap';\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\r\nimport { faSignal } from '@fortawesome/free-solid-svg-icons';\r\nimport {SETTINGS_TYPE_ENUM } from '../../../utils/Enums';\r\nimport EditIcon from '@material-ui/icons/Edit';\r\nimport DeviceSettingsDialog from '../../../components/dialogs/add/DeviceSettingsDialog';\r\nimport MessageSnackbar from '../../../components/notifications/MessageSnackbar';\r\nimport CheckIcon from '@material-ui/icons/Check';\r\nimport CancelIcon from '@material-ui/icons/NotInterested';\r\nimport Paper from '@material-ui/core/Paper';\r\nimport Tooltip from '@material-ui/core/Tooltip';\r\nimport Divider from '@material-ui/core/Divider';\r\nimport Button from '@material-ui/core/Button';\r\nimport Typography from '@material-ui/core/Typography';\r\n\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n paper: {\r\n padding: theme.spacing(3),\r\n margin: theme.spacing(1),\r\n },\r\n button: {\r\n margin: theme.spacing(1),\r\n float:'right'\r\n },\r\n label_title: {\r\n color: \"#94A3A7\",\r\n fontWeight: 'bold',\r\n marginBottom: theme.spacing(0)\r\n },\r\n divider:{\r\n marginTop: theme.spacing(2),\r\n marginBottom: theme.spacing(1),\r\n }\r\n}));\r\n\r\n\r\nconst APNSettings = ({\r\n envId, interfaceGPRS, deviceItemId\r\n}) => {\r\n const classes = useStyles();\r\n const ovalButtonsStyle = ovalByttonsStyleBase();\r\n const [editMode, setEditMode] = useState(false);\r\n const [openApplyToDialog, setApplyToDialog] = useState(false);\r\n const [ snackbar, setSnackbar] = useState({ open: false, variant: 'error', message: ''});\r\n const [data, setData] = useState(interfaceGPRS);\r\n \r\n const readOnly = editMode ? '' : 'readonly';\r\n\r\n\r\n const handleEditClick = () => {\r\n setEditMode(!editMode);\r\n }\r\n\r\n const renderPanelHeader = () => {\r\n return (\r\n \r\n \r\n \r\n {renderPageHeader()}\r\n \r\n \r\n \r\n {renderSettings()}\r\n \r\n \r\n {!state.deviceItem ?
);\r\n\r\n}\r\n\r\nexport default withRouter(EditDevicePage);\r\n","import React from 'react';\r\nimport { Route, Redirect } from \"react-router\";\r\nimport { connect } from 'react-redux';\r\nimport { setLoggedUser, SetUserData} from '../redux/actions/UserActions';\r\nimport SessionServices from '../utils/SessionServices';\r\nimport NavBar from '../components/navigation/NavBar';\r\nimport DashboardPage from '../pages/DashboardPage';\r\nimport EnvironmentPage from '../pages/EnvironmentPage';\r\nimport UploadFirmwarePage from '../pages/UploadFirmwarePage';\r\nimport UpdateFirmwarePage from '../pages/UpdateFirmwarePage';\r\nimport DevicePage from '../pages/devices/ListDevicePage';\r\nimport EditDevicePage from '../pages/devices/EditDevicePage';\r\n\r\nconst ProtectedRoutes = (props) => {\r\n const {isLoggedIn} = props;\r\n const {location} = props;\r\n\r\n const renderRoutes = () => {\r\n if (isLoggedIn) {\r\n return(<>\r\n Loading...
);\r\n }\r\n else{\r\n return (\r\n