onDeleteFtp(id)} />;\n });\n }\n\n const onDeleteFtp = index => {\n let updatedAdditionalFtps = [];\n\n state.additionalFtp.forEach(item => {\n if (item.id === index) {\n item.deleted = true;\n }\n\n updatedAdditionalFtps.push(item);\n });\n\n if (!updatedAdditionalFtps.length) {\n unCheckAdditionalFtpBox();\n }\n\n setState({ ...state, additionalFtp: updatedAdditionalFtps });\n }\n\n const addAdditionalFtp = () => {\n let additionalFtpArrayLength = state.additionalFtp.length;\n let additionalFtpsDuplicate = [...state.additionalFtp];\n\n additionalFtpsDuplicate.push({ id: additionalFtpArrayLength, deleted: false, is_new: 1 });\n\n setState({ ...state, additionalFtp: additionalFtpsDuplicate });\n }\n\n return (\n \n {renderAdditionalFtps()}\n\n {checked && (\n addAdditionalFtp()}>\n {i18n['Add one more FTP Account'] ?? 'Add'}\n )}\n
\n );\n}\n\nexport default AdditionalFtpWrapper;\n","import React, { useState } from 'react';\nimport { useSelector } from 'react-redux';\n\nimport './SslSupport.scss';\n\nconst SslSupport = props => {\n const { i18n } = useSelector(state => state.session);\n const [letsEncrypt, setLetsEncrypt] = useState(false);\n\n return (\n \n
\n
\n setLetsEncrypt(!letsEncrypt)} />\n {i18n['Lets Encrypt Support']} \n
\n
{letsEncrypt ? i18n['Your certificate will be automatically issued in 5 minutes'] : null} \n
\n\n
\n {i18n['SSL Home Directory']} \n \n public_html \n public_shtml \n \n
\n\n
\n {i18n['SSL Certificate']} \n \n
\n\n
\n {i18n['SSL Key']} \n \n
\n\n
\n {i18n['SSL Certificate Authority / Intermediate']} \n \n
\n
\n );\n}\n\nexport default SslSupport;","import React, { useEffect, useState } from 'react';\nimport { useSelector } from 'react-redux';\nimport Password from '../../../../components/ControlPanel/AddItemLayout/Form/Password/Password';\nimport AdditionalFtpWrapper from '../AdditionalFtpWrapper/AdditionalFtpWrapper';\nimport Checkbox from 'src/components/ControlPanel/AddItemLayout/Form/Checkbox/Checkbox';\nimport SslSupport from '../SslSupport/SslSupport';\n\nimport './AdvancedOptions.scss';\n\nconst AdvancedOptions = ({ prefixI18N, prePath, ...props }) => {\n const { i18n } = useSelector(state => state.session);\n const [state, setState] = useState({\n sslSupport: false,\n additionalFtp: false,\n statisticsAuthCheckbox: false,\n statisticsAuth: false,\n });\n\n useEffect(() => {\n let updatedDomain = `www.${props.domain}`;\n setState({ ...state, aliases: updatedDomain });\n }, [props.domain]);\n\n const renderSslSupport = () => {\n if (state.sslSupport) {\n return ;\n }\n }\n\n const renderWebStats = () => {\n return props.webStats.map(stat => {stat} );\n }\n\n const onChangeWebStatsSelect = value => {\n if (value !== 'none') {\n setState({ ...state, statisticsAuth: true });\n } else {\n setState({ ...state, statisticsAuth: false, statisticsAuthCheckbox: false });\n }\n }\n\n return (\n \n
\n
\n setState({ ...state, sslSupport: !state.sslSupport })} />\n {i18n['SSL Support']} \n
\n
\n\n {renderSslSupport()}\n\n
\n {i18n['Web Statistics']} \n onChangeWebStatsSelect(event.target.value)}>\n {renderWebStats()}\n \n
\n\n
\n
\n setState({ ...state, statisticsAuthCheckbox: !state.statisticsAuthCheckbox })} />\n {i18n['Statistics Authorization']} \n
\n
\n\n
\n
\n {i18n.Username} \n \n
\n\n
\n
\n\n
setState({ ...state, additionalFtp: checked })}\n name=\"v_ftp\"\n id=\"add-ftp\"\n checked={state.additionalFtp}\n title={i18n['Additional FTP Account']} />\n\n setState({ ...state, additionalFtp: false })} />\n \n );\n}\n\nexport default AdvancedOptions;\n","import React, { useEffect, useState } from 'react';\n\nimport { addActiveElement, removeFocusedElement } from \"../../../actions/MainNavigation/mainNavigationActions\";\nimport AddItemLayout from '../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { addWeb, getWebDomainInfo } from '../../../ControlPanelService/Web';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport AdvancedOptions from './AdvancedOptions/AdvancedOptions';\nimport Checkbox from 'src/components/ControlPanel/AddItemLayout/Form/Checkbox/Checkbox';\nimport SelectInput from 'src/components/ControlPanel/AddItemLayout/Form/SelectInput/SelectInput';\nimport TextArea from 'src/components/ControlPanel/AddItemLayout/Form/TextArea/TextArea';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport Spinner from '../../Spinner/Spinner';\nimport { useDispatch, useSelector } from 'react-redux';\n\nimport './AddWebDomain.scss';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\nimport HtmlParser from 'react-html-parser';\n\nconst AddWebDomain = props => {\n const { i18n, panel, userName } = useSelector(state => state.session);\n const { session } = useSelector(state => state.userSession);\n const dispatch = useDispatch();\n const token = localStorage.getItem(\"token\");\n const history = useHistory();\n const [state, setState] = useState({\n loading: false,\n dnsSupport: true,\n mailSupport: true,\n proxySupport: true,\n showAdvancedOptions: false,\n okMessage: '',\n domain: '',\n errorMessage: '',\n webStats: [],\n prefixI18N: '',\n prePath: '',\n proxy_ext: '',\n internetProtocols: []\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/web/'));\n dispatch(removeFocusedElement());\n\n setState({ ...state, loading: true });\n getWebDomainInfo()\n .then(res => {\n setState({\n ...state,\n internetProtocols: getInternetProtocolNames(res.data.ips),\n webStats: res.data.stats,\n prefixI18N: res.data.prefix,\n proxy_ext: res.data.proxy_ext,\n prePath: res.data.ftp_pre_path,\n loading: false\n });\n })\n .catch(err => {\n setState({ ...state, loading: false });\n console.error(err);\n })\n }, []);\n\n const getInternetProtocolNames = internetProtocols => {\n let result = [];\n\n for (let i in internetProtocols) {\n result.push(i);\n }\n\n return result;\n }\n\n const renderInternetProtocolsOptions = () => {\n return state.internetProtocols.map(ip => {ip} );\n }\n\n const showAdvancedOption = () => {\n setState({ ...state, showAdvancedOptions: !state.showAdvancedOptions });\n }\n\n const renderAdvancedOptions = () => {\n if (state.showAdvancedOptions) {\n return ;\n }\n }\n\n const onBlurChangeAliases = value => {\n setState({ ...state, domain: value });\n }\n\n const checkboxHandler = (input, checked) => {\n setState({ ...state, [input]: checked });\n }\n\n const submitFormHandler = event => {\n event.preventDefault();\n let newWebDomain = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n newWebDomain[name] = value;\n }\n\n if (Object.keys(newWebDomain).length !== 0 && newWebDomain.constructor === Object) {\n setState({ loading: true });\n addWeb(newWebDomain)\n .then(result => {\n if (result.status === 200) {\n const { error_msg: errorMessage, ok_msg: okMessage } = result.data;\n\n if (errorMessage) {\n setState({ ...state, errorMessage, okMessage, loading: false });\n } else {\n dispatch(refreshCounters()).then(() => {\n setState({ ...state, okMessage, errorMessage: '', loading: false });\n });\n }\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n return (\n \n
\n {`Vesta - ${i18n.WEB}`} \n \n
\n
\n {i18n['Adding Domain']}
\n \n \n {state.errorMessage ? : ''}\n {state.errorMessage} \n
\n \n \n {state.okMessage ? : ''}\n {HtmlParser(state.okMessage)} \n \n
\n \n
\n {state.loading ? : (\n \n )}\n \n
\n );\n}\n\nexport default AddWebDomain;","import React, { useEffect, useState } from 'react';\n\nimport './TextInputWithTextOnTheRight.scss';\n\nconst TextInputWithTextOnTheRight = ({ id, title, name, defaultValue = '', optionalTitle = '', disabled = false }) => {\n const [inputValue, setInputValue] = useState('');\n\n useEffect(() => {\n if (defaultValue) {\n setInputValue(defaultValue);\n }\n }, [defaultValue]);\n\n return (\n \n
\n {title}\n {optionalTitle || ''} \n \n
\n setInputValue(event.target.value)}\n disabled={disabled}\n name={name} />\n {`${inputValue}`} \n
\n
\n );\n}\n\nexport default TextInputWithTextOnTheRight;","import axios from \"axios\";\nimport { getAuthToken } from \"src/utils/token\";\n\nconst BASE_URL = window.location.origin;\nconst webApiUri = '/api/v1/list/db/index.php';\nconst addDbApiUri = '/api/v1/add/db/index.php';\nconst optionalDbInfoUri = '/api/v1/add/db/index.php';\nconst dbInfoUri = '/api/v1/edit/db/index.php';\nconst updateDatabaseUri = '/api/v1/edit/db/index.php';\n\nexport const getDatabaseList = () => {\n return axios.get(BASE_URL + webApiUri);\n}\n\nexport const bulkAction = (action, domainNameSystems) => {\n const formData = new FormData();\n formData.append(\"action\", action);\n formData.append(\"token\", getAuthToken());\n\n domainNameSystems.forEach(domainNameSystem => {\n formData.append(\"database[]\", domainNameSystem);\n });\n\n return axios.post(BASE_URL + '/api/v1/bulk/db/', formData);\n};\n\nexport const handleAction = uri => {\n return axios.get(BASE_URL + uri, {\n params: {\n token: getAuthToken()\n }\n });\n}\n\nexport const getDbOptionalInfo = () => {\n return axios.get(BASE_URL + optionalDbInfoUri);\n}\n\nexport const addDatabase = data => {\n let formDataObject = new FormData();\n\n for (let key in data) {\n formDataObject.append(key, data[key]);\n }\n\n return axios.post(BASE_URL + addDbApiUri, formDataObject);\n}\n\nexport const dbCharsets = [\n 'big5',\n 'dec8',\n 'cp850',\n 'hp8',\n 'koi8r',\n 'latin1',\n 'latin2',\n 'swe7',\n 'ascii',\n 'ujis',\n 'sjis',\n 'hebrew',\n 'tis620',\n 'euckr',\n 'koi8u',\n 'gb2312',\n 'greek',\n 'cp1250',\n 'gbk',\n 'latin5',\n 'armscii8',\n 'utf8',\n 'ucs2',\n 'cp866',\n 'keybcs2',\n 'macce',\n 'macroman',\n 'cp852',\n 'latin7',\n 'cp1251',\n 'cp1256',\n 'cp1257',\n 'binary',\n 'geostd8',\n 'cp932',\n 'eucjpms'\n];\n\nexport const getDatabaseInfo = database => {\n return axios.get(BASE_URL + dbInfoUri, {\n params: {\n database,\n token: getAuthToken()\n }\n });\n}\n\nexport const updateDatabase = (data, database) => {\n let formDataObject = new FormData();\n\n for (let key in data) {\n formDataObject.append(key, data[key]);\n }\n\n return axios.post(BASE_URL + updateDatabaseUri, formDataObject, {\n params: {\n database,\n token: getAuthToken()\n }\n });\n}","import React, { useEffect, useState } from 'react';\nimport TextInputWithTextOnTheRight from '../../ControlPanel/AddItemLayout/Form/TextInputWithTextOnTheRight/TextInputWithTextOnTheRight';\nimport { addActiveElement, removeFocusedElement } from \"../../../actions/MainNavigation/mainNavigationActions\";\nimport { getDatabaseInfo, updateDatabase } from '../../../ControlPanelService/Db';\nimport TextInput from '../../ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport Password from '../../ControlPanel/AddItemLayout/Form/Password/Password';\nimport AddItemLayout from '../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Spinner from '../../../components/Spinner/Spinner';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\nimport QS from 'qs';\n\nimport './EditDatabase.scss';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\nimport HtmlParser from 'react-html-parser';\n\nconst EditDatabase = props => {\n const token = localStorage.getItem(\"token\");\n const { i18n, userName } = useSelector(state => state.session);\n const history = useHistory();\n const dispatch = useDispatch();\n const [errorMessage, setErrorMessage] = useState('');\n const [okMessage, setOkMessage] = useState('');\n const [state, setState] = useState({\n data: {},\n loading: false,\n databaseUserInputValue: ''\n });\n\n useEffect(() => {\n let queryParams = QS.parse(history.location.search, { ignoreQueryPrefix: true });\n const { database } = queryParams;\n\n dispatch(addActiveElement('/list/db/'));\n dispatch(removeFocusedElement());\n\n if (database) {\n setState({ ...state, loading: true });\n fetchData(database);\n }\n }, []);\n\n const fetchData = database => {\n getDatabaseInfo(database)\n .then(response => {\n setState({\n ...state,\n data: response.data,\n databaseUserInputValue: response.data.dbuser.split('_').splice(1).join('_'),\n loading: false\n });\n })\n .catch(err => {\n setState({ ...state, loading: false });\n console.error(err);\n });\n }\n\n const submitFormHandler = event => {\n event.preventDefault();\n let updatedDatabase = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n updatedDatabase[name] = value;\n }\n\n updatedDatabase['v_database'] = state.data.database;\n updatedDatabase['v_dbuser'] = `${userName}_${state.databaseUserInputValue}`;\n\n if (Object.keys(updatedDatabase).length !== 0 && updatedDatabase.constructor === Object) {\n setState({ ...state, loading: true });\n\n updateDatabase(updatedDatabase, state.data.database)\n .then(result => {\n if (result.status === 200) {\n const { error_msg, ok_msg } = result.data;\n\n if (error_msg) {\n setOkMessage('');\n setErrorMessage(error_msg);\n } else {\n dispatch(refreshCounters()).then(() => {\n setOkMessage(ok_msg);\n setErrorMessage('');\n });\n }\n }\n })\n .then(() => fetchData(state.data.database))\n .catch(err => console.error(err));\n }\n }\n\n const databaseUserInputHandler = value => {\n setState({ ...state, databaseUserInputValue: value });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.DB}`} \n \n
\n
\n {i18n['Editing Database']}
\n \n \n {errorMessage ? : ''} {errorMessage}\n \n
\n \n \n {okMessage ? : ''} {HtmlParser(okMessage)} \n \n
\n \n
\n {state.loading ? :\n submitFormHandler(event)} id=\"edit-db\">\n \n \n\n \n\n \n
\n {i18n.User} \n
\n
\n databaseUserInputHandler(event.target.value)}\n name=\"v_dbuser\" />\n {`${userName}_${state.databaseUserInputValue}`} \n
\n
\n\n \n\n \n\n \n\n \n\n \n {i18n.Save} \n history.push('/list/db/')}>{i18n.Back} \n
\n\n \n }\n \n
\n );\n}\n\nexport default EditDatabase;","import axios from 'axios';\nimport { getAuthToken } from 'src/utils/token';\n\nconst BASE_URL = window.location.origin;\nconst usersUri = '/api/v1/list/firewall/index.php';\nconst addFirewallUri = '/api/v1/add/firewall/index.php';\nconst firewallInfoUri = '/api/v1/edit/firewall/index.php';\nconst updateFirewallUri = '/api/v1/edit/firewall/index.php';\nconst addBanIpsUri = '/api/v1/add/firewall/banlist/index.php';\nconst banListUri = '/api/v1/list/firewall/banlist/index.php';\n\nexport const getFirewallList = () => {\n return axios.get(BASE_URL + usersUri);\n}\n\nexport const getBanList = () => {\n return axios.get(BASE_URL + banListUri);\n}\n\nexport const bulkAction = (action, ips, banIps) => {\n const formData = new FormData();\n formData.append(\"action\", action);\n formData.append(\"token\", getAuthToken());\n\n ips.forEach(ip => {\n const banIp = banIps.find(banIp => banIp.NAME === ip);\n formData.append(\"ipchain[]\", `${ip}:${banIp['CHAIN']}`);\n });\n\n return axios.post(BASE_URL + '/api/v1/bulk/firewall/banlist/', formData);\n};\n\nexport const handleAction = uri => {\n return axios.get(BASE_URL + uri, {\n params: {\n token: getAuthToken()\n }\n });\n}\n\nexport const getBanIps = data => {\n let formDataObject = new FormData();\n\n for (let key in data) {\n formDataObject.append(key, data[key]);\n }\n\n return axios.get(BASE_URL + addBanIpsUri, {\n params: {\n token: getAuthToken()\n }\n });\n}\n\nexport const addBanIp = (data) => {\n let formDataObject = new FormData();\n\n formDataObject.append('token', getAuthToken());\n\n for (let key in data) {\n formDataObject.append(key, data[key]);\n }\n\n return axios.post(BASE_URL + addBanIpsUri, formDataObject, {\n params: {\n token: getAuthToken()\n }\n });\n}\n\nexport const addFirewall = data => {\n let formDataObject = new FormData();\n\n for (let key in data) {\n formDataObject.append(key, data[key]);\n }\n\n return axios.post(BASE_URL + addFirewallUri, formDataObject);\n}\n\nexport const getFirewallInfo = rule => {\n return axios.get(BASE_URL + firewallInfoUri, {\n params: {\n rule,\n token: getAuthToken()\n }\n });\n}\n\nexport const updateFirewall = (data, rule) => {\n let formDataObject = new FormData();\n\n for (let key in data) {\n formDataObject.append(key, data[key]);\n }\n\n return axios.post(BASE_URL + updateFirewallUri, formDataObject, {\n params: {\n rule,\n token: getAuthToken()\n }\n });\n}","import React, { useEffect, useState } from 'react';\nimport { addActiveElement, removeFocusedElement } from \"../../../actions/MainNavigation/mainNavigationActions\";\nimport { getFirewallInfo, updateFirewall } from '../../../ControlPanelService/Firewalls';\nimport SelectInput from '../../ControlPanel/AddItemLayout/Form/SelectInput/SelectInput';\nimport TextInput from '../../ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport AddItemLayout from '../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Spinner from '../../../components/Spinner/Spinner';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\nimport QS from 'qs';\n\nimport './EditFirewall.scss';\nimport { Helmet } from 'react-helmet';\nimport HtmlParser from 'react-html-parser';\n\nconst EditFirewall = props => {\n const token = localStorage.getItem(\"token\");\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const dispatch = useDispatch();\n const [errorMessage, setErrorMessage] = useState('');\n const [okMessage, setOkMessage] = useState('');\n const [state, setState] = useState({\n data: {},\n loading: false\n });\n\n useEffect(() => {\n let queryParams = QS.parse(history.location.search, { ignoreQueryPrefix: true });\n const { rule } = queryParams;\n\n dispatch(addActiveElement('/list/firewall/'));\n dispatch(removeFocusedElement());\n\n if (rule) {\n setState({ ...state, loading: true });\n fetchData(rule);\n }\n }, []);\n\n const fetchData = rule => {\n getFirewallInfo(rule)\n .then(response => {\n setState({\n ...state,\n data: response.data,\n loading: false\n });\n })\n .catch(err => {\n setState({ ...state, loading: false });\n console.error(err);\n });\n }\n\n const submitFormHandler = event => {\n event.preventDefault();\n let updatedDomain = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n updatedDomain[name] = value;\n }\n\n if (Object.keys(updatedDomain).length !== 0 && updatedDomain.constructor === Object) {\n setState({ ...state, loading: true });\n\n updateFirewall(updatedDomain, state.data.rule)\n .then(result => {\n if (result.status === 200) {\n const { error_msg, ok_msg } = result.data;\n\n setErrorMessage(error_msg || '');\n setOkMessage(ok_msg || '');\n }\n })\n .then(() => fetchData(state.data.rule))\n .catch(err => console.error(err));\n }\n }\n\n return (\n \n
\n {`Vesta - ${i18n.FIREWALL}`} \n \n
\n
\n {i18n['Editing Firewall Rule']}
\n \n \n {errorMessage ? : ''} {errorMessage}\n \n
\n \n \n {okMessage ? : ''} {HtmlParser(okMessage)} \n \n
\n \n
\n {state.loading ? :\n submitFormHandler(event)} id=\"edit-firewall\">\n \n \n\n \n \n {i18n['Action']}\n \n \n DROP \n ACCEPT \n \n
\n\n \n \n {i18n['Protocol']}\n \n \n {i18n['TCP']} \n {i18n['UDP']} \n {i18n['ICMP']} \n \n
\n\n \n\n \n\n \n\n \n {i18n.Save} \n history.push('/list/firewall/')}>{i18n.Back} \n
\n\n \n }\n \n
\n );\n}\n\nexport default EditFirewall;","import React, { useEffect } from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport './Hotkeys.scss';\nimport { useSelector } from 'react-redux';\n\nconst Hotkeys = props => {\n const { i18n } = useSelector(state => state.session);\n\n useEffect(() => {\n window.addEventListener(\"keyup\", toggleShortcutsLit);\n\n return () => window.removeEventListener(\"keyup\", toggleShortcutsLit);\n }, [props.reference]);\n\n const toggleShortcutsLit = event => {\n let isSearchInputFocused = document.querySelector('input:focus') || document.querySelector('textarea:focus');\n\n if (event.keyCode === 72 && !isSearchInputFocused) {\n props.toggleHotkeys();\n }\n }\n\n return (\n \n
\n
{i18n.Shortcuts}
\n
props.toggleHotkeys()}>
\n
\n
\n
\n \n a \n {i18n['Add New object']} \n \n \n Ctrl + Open \n {i18n['Save Form']} \n \n \n Ctrl + Backspace \n {i18n['Cancel saving form']} \n \n \n 1 \n {i18n['Go to USER list']} \n \n \n 2 \n {i18n['Go to WEB list']} \n \n \n 3 \n {i18n['Go to DNS list']} \n \n \n 4 \n {i18n['Go to MAIL list']} \n \n \n 5 \n {i18n['Go to DB list']} \n \n \n 6 \n {i18n['Go to CRON list']} \n \n \n 7 \n {i18n['Go to BACKUP list']} \n \n \n
\n \n f \n {i18n['Focus on search']} \n \n \n h \n {i18n['Display/Close shortcuts']} \n \n \n ← \n {i18n['Move backward through top menu']} \n \n \n → \n {i18n['Move forward through top menu']} \n \n \n Enter \n {i18n['Enter focused element']} \n \n \n ↑ \n {i18n['Move up through elements list']} \n \n \n ↓ \n {i18n['Move down through elements list']} \n \n \n
\n
\n );\n}\n\nexport default Hotkeys;","import React, { memo, useEffect, useState } from 'react';\n\nimport { addActiveElement, removeFocusedElement } from \"../../../actions/MainNavigation/mainNavigationActions\";\nimport { dbCharsets, addDatabase, getDbOptionalInfo } from '../../../ControlPanelService/Db';\nimport AddItemLayout from '../../ControlPanel/AddItemLayout/AddItemLayout';\nimport Password from '../../ControlPanel/AddItemLayout/Form/Password/Password';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport Spinner from '../../Spinner/Spinner';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\nimport HtmlParser from 'react-html-parser';\nimport './AddDatabase.scss'\n\nconst AddDatabase = memo(props => {\n const { i18n } = useSelector(state => state.session);\n const token = localStorage.getItem(\"token\");\n const dispatch = useDispatch();\n const history = useHistory();\n const [state, setState] = useState({\n loading: false,\n okMessage: '',\n errorMessage: '',\n dbTypes: [],\n dbHosts: [],\n dbCharsets: [],\n user: '',\n maxCharLength: '',\n databaseInputValue: '',\n databaseUserInputValue: '',\n prefixI18N: ''\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/db/'));\n dispatch(removeFocusedElement());\n\n setState({ ...state, loading: true });\n\n getDbOptionalInfo()\n .then(result => {\n if (result.status === 200) {\n setState({\n ...state,\n dbCharsets,\n user: result.data.user,\n dbTypes: result.data.dbTypes,\n prefixI18N: result.data.prefixI18N,\n maxCharLength: result.data.maxCharLength,\n dbHosts: result.data.dbHosts,\n loading: false\n });\n }\n })\n .catch(err => console.err(err));\n }, []);\n\n const renderDatabaseTypesOptions = () => {\n return state.dbTypes.map((dbType, index) => {dbType} )\n }\n\n const renderDatabaseHostsOptions = () => {\n return state.dbHosts.map((dbHost, index) => {dbHost} )\n }\n\n const renderDatabaseCharsetOptions = () => {\n return state.dbCharsets.map((dbCharset, index) =>\n \n {dbCharset}\n \n );\n }\n\n const databaseUserInputHandler = value => {\n setState({ ...state, databaseUserInputValue: value });\n }\n\n const databaseInputHandler = value => {\n setState({ ...state, databaseInputValue: value });\n }\n\n const submitFormHandler = event => {\n event.preventDefault();\n let newDatabase = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n newDatabase[name] = value;\n }\n\n newDatabase['v_database'] = state.databaseInputValue;\n newDatabase['v_dbuser'] = state.databaseUserInputValue;\n\n if (Object.keys(newDatabase).length !== 0 && newDatabase.constructor === Object) {\n setState({ ...state, loading: true });\n addDatabase(newDatabase)\n .then(result => {\n if (result.status === 200) {\n const { error_msg: errorMessage, ok_msg: okMessage } = result.data;\n\n if (errorMessage) {\n setState({ ...state, errorMessage, okMessage: '', loading: false });\n } else {\n dispatch(refreshCounters()).then(() => {\n setState({ ...state, okMessage, errorMessage: '', loading: false });\n });\n }\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n return (\n \n
\n {`Vesta - ${i18n.DB}`} \n \n
\n
\n {i18n['Adding database']}
\n \n \n {state.errorMessage ? : ''}\n {state.errorMessage} \n
\n \n \n {state.okMessage ? : ''}\n {HtmlParser(state.okMessage)} \n \n
\n \n
\n {state.loading ? : (\n submitFormHandler(event)}>\n \n \n\n {HtmlParser(state.prefixI18N)} \n\n \n
{i18n.Database} \n
\n databaseInputHandler(event.target.value)}\n value={state.databaseInputValue}\n name=\"v_database\" />\n {`${state.user}_${state.databaseInputValue}`} \n
\n
\n\n \n
\n {i18n.User} \n ({state.maxCharLength}) \n
\n
\n databaseUserInputHandler(event.target.value)}\n name=\"v_dbuser\" />\n {`${state.user}_${state.databaseUserInputValue}`} \n
\n
\n\n \n\n \n {i18n.Type} \n \n {renderDatabaseTypesOptions()}\n \n
\n\n \n {i18n.Host} \n \n {renderDatabaseHostsOptions()}\n \n
\n\n \n {i18n.Charset} \n \n {renderDatabaseCharsetOptions()}\n \n
\n\n \n {i18n['Send login credentials to email address']} \n \n
\n\n \n {i18n.Add} \n history.push('/list/db/')}>{i18n.Back} \n
\n \n )}\n \n
\n );\n});\n\nexport default AddDatabase;\n","import React, { useEffect, useState } from 'react';\n\nimport { addActiveElement, removeFocusedElement } from \"../../../actions/MainNavigation/mainNavigationActions\";\nimport SelectInput from '../../ControlPanel/AddItemLayout/Form/SelectInput/SelectInput';\nimport TextInput from '../../ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport AddItemLayout from '../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { addFirewall } from '../../../ControlPanelService/Firewalls';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\n\nimport './AddFirewall.scss';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\nimport HtmlParser from 'react-html-parser';\n\nconst AddFirewall = props => {\n const token = localStorage.getItem(\"token\");\n const { i18n } = useSelector(state => state.session);\n const dispatch = useDispatch();\n const history = useHistory();\n const [state, setState] = useState({\n loading: false,\n actions: [\n i18n['DROP'],\n i18n['ACCEPT']\n ],\n protocols: [\n i18n['TCP'],\n i18n['UDP'],\n i18n['ICMP']\n ],\n okMessage: '',\n errorMessage: ''\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/firewall/'));\n dispatch(removeFocusedElement());\n }, []);\n\n const submitFormHandler = event => {\n event.preventDefault();\n let newFirewall = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n newFirewall[name] = value;\n }\n\n if (Object.keys(newFirewall).length !== 0 && newFirewall.constructor === Object) {\n setState({ ...state, loading: true });\n addFirewall(newFirewall)\n .then(result => {\n if (result.status === 200) {\n const { error_msg: errorMessage, ok_msg: okMessage } = result.data;\n\n if (errorMessage) {\n setState({ ...state, errorMessage, okMessage, loading: false });\n } else {\n dispatch(refreshCounters()).then(() => {\n setState({ ...state, okMessage, errorMessage: '', loading: false });\n });\n }\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n return (\n \n
\n {`Vesta - ${i18n.FIREWALL}`} \n \n
\n
\n {i18n['Adding Firewall Rule']}
\n \n \n {state.errorMessage ? : ''}\n {state.errorMessage} \n
\n \n \n {state.okMessage ? : ''}\n {HtmlParser(state.okMessage)} \n \n
\n \n
\n submitFormHandler(event)}>\n \n \n\n \n\n \n\n \n\n \n\n \n\n \n {i18n.Add} \n history.push('/list/firewall/')}>{i18n.Back} \n
\n \n \n
\n );\n}\n\nexport default AddFirewall;","import axios from \"axios\";\nimport { getAuthToken } from \"src/utils/token\";\n\nconst BASE_URL = window.location.origin;\nconst webApiUri = '/api/v1/list/cron/index.php';\nconst cronAddApiUri = '/api/v1/add/cron/index.php';\nconst jobInfoUri = '/api/v1/edit/cron/index.php';\nconst updateCronJobUri = '/api/v1/edit/cron/index.php';\n\nexport const getCronList = () => {\n return axios.get(BASE_URL + webApiUri);\n}\n\nexport const bulkAction = (action, domainNameSystems) => {\n const formData = new FormData();\n formData.append(\"action\", action);\n formData.append(\"token\", getAuthToken());\n\n domainNameSystems.forEach(domainNameSystem => {\n formData.append(\"job[]\", domainNameSystem);\n });\n\n return axios.post(BASE_URL + '/api/v1/bulk/cron/', formData);\n};\n\nexport const handleAction = uri => {\n return axios.get(BASE_URL + uri, {\n params: {\n token: getAuthToken()\n }\n });\n}\n\nexport const addCronJob = data => {\n let formDataObject = new FormData();\n\n for (let key in data) {\n formDataObject.append(key, data[key]);\n }\n\n return axios.post(BASE_URL + cronAddApiUri, formDataObject);\n}\n\nexport const getCronJobInfo = job => {\n return axios.get(BASE_URL + jobInfoUri, {\n params: {\n job,\n token: getAuthToken()\n }\n });\n}\n\nexport const updateCronJob = (data, job) => {\n let formDataObject = new FormData();\n\n for (let key in data) {\n formDataObject.append(key, data[key]);\n }\n\n return axios.post(BASE_URL + updateCronJobUri, formDataObject, {\n params: {\n job,\n token: getAuthToken()\n }\n });\n}","export const generatorOptions = i18n => {\n return {\n minutesRunCommandsOptions: [\n { name: i18n['every minute'] ?? 'every minute', value: '*' },\n { name: i18n['every two minutes'] ?? 'every two minutes', value: '*/2' },\n { name: `${i18n.every || 'every'} 5`, value: '*/5' },\n { name: `${i18n.every || 'every'} 10`, value: '*/10' },\n { name: `${i18n.every || 'every'} 15`, value: '*/15' },\n { name: `${i18n.every || 'every'} 30`, value: '*/30' }\n ],\n hoursRunCommandsOptions: [\n { name: i18n['every hour'] ?? 'every hour', value: '*' },\n { name: i18n['every two hours'] ?? 'every two hours', value: '*/2' },\n { name: `${i18n.every || 'every'} 6`, value: '*/6' },\n { name: `${i18n.every || 'every'} 12`, value: '*/12' }\n ],\n daysRunCommandsOptions: [\n { name: i18n['every day'] ?? 'every day', value: '*' },\n { name: i18n['every odd day'] ?? 'every odd day', value: '1-31/2' },\n { name: i18n['every even day'] ?? 'every even day', value: '*/2' },\n { name: `${i18n.every || 'every'} 3`, value: '*/3' },\n { name: `${i18n.every || 'every'} 5`, value: '*/5' },\n { name: `${i18n.every || 'every'} 10`, value: '*/10' },\n { name: `${i18n.every || 'every'} 15`, value: '*/15' }\n ],\n hoursOptions: [\n { name: '00', value: '0' },\n { name: '01', value: '1' },\n { name: '02', value: '2' },\n { name: '03', value: '3' },\n { name: '04', value: '4' },\n { name: '05', value: '5' },\n { name: '06', value: '6' },\n { name: '07', value: '7' },\n { name: '08', value: '8' },\n { name: '09', value: '9' },\n { name: '10', value: '10' },\n { name: '11', value: '11' },\n { name: '12', value: '12' },\n { name: '13', value: '13' },\n { name: '14', value: '14' },\n { name: '15', value: '15' },\n { name: '16', value: '16' },\n { name: '17', value: '17' },\n { name: '18', value: '18' },\n { name: '19', value: '19' },\n { name: '20', value: '20' },\n { name: '21', value: '21' },\n { name: '22', value: '22' },\n { name: '23', value: '23' }\n ],\n hourlyMinutesOptions: [\n { name: '00', value: '0' },\n { name: '15', value: '15' },\n { name: '30', value: '30' },\n { name: '45', value: '45' }\n ],\n dailyMinutesOptions: [\n { name: '00', value: '0' },\n { name: '01', value: '1' },\n { name: '02', value: '2' },\n { name: '05', value: '5' },\n { name: '10', value: '10' },\n { name: '15', value: '15' },\n { name: '20', value: '20' },\n { name: '25', value: '25' },\n { name: '30', value: '30' },\n { name: '35', value: '35' },\n { name: '40', value: '40' },\n { name: '45', value: '45' },\n { name: '50', value: '50' },\n { name: '55', value: '55' }\n ],\n weeklyRunCommandOptions: [\n { name: i18n['every day'] ?? 'every day', value: '*' },\n { name: i18n['weekdays (5 days)'] ?? 'weekdays (5 days)', value: '1,2,3,4,5' },\n { name: i18n['weekend (2 days)'] ?? 'weekend (2 days)', value: '0,6' },\n { name: i18n.Monday ?? 'Monday', value: '1' },\n { name: i18n.Tuesday ?? 'Tuesday', value: '2' },\n { name: i18n.Wednesday ?? 'Wednesday', value: '3' },\n { name: i18n.Thursday ?? 'Thursday', value: '4' },\n { name: i18n.Friday ?? 'Friday', value: '5' },\n { name: i18n.Saturday ?? 'Saturday', value: '6' },\n { name: i18n.Sunday ?? 'Sunday', value: '0' }\n ],\n monthlyRunCommandOptions: [\n { name: i18n['every month'] ?? 'every month', value: '*' },\n { name: i18n['every odd month'] ?? 'every odd month', value: '1-11/2' },\n { name: i18n['every even month'] ?? 'every even month', value: '*/2' },\n { name: `${i18n.every || 'every'} 3`, value: '*/3' },\n { name: `${i18n.every || 'every'} 6`, value: '*/6' },\n { name: i18n.Jan ?? 'Jan', value: '1' },\n { name: i18n.Feb ?? 'Feb', value: '2' },\n { name: i18n.Mar ?? 'Mar', value: '3' },\n { name: i18n.Apr ?? 'Apr', value: '4' },\n { name: i18n.May ?? 'May', value: '5' },\n { name: i18n.Jun ?? 'Jun', value: '6' },\n { name: i18n.Jul ?? 'Jul', value: '7' },\n { name: i18n.Aug ?? 'Aug', value: '8' },\n { name: i18n.Sep ?? 'Sep', value: '9' },\n { name: i18n.Oct ?? 'Oct', value: '10' },\n { name: i18n.Nov ?? 'Nov', value: '11' },\n { name: i18n.Dec ?? 'Dec', value: '12' }\n ],\n dateOptions: [\n { name: '1', value: '1' },\n { name: '2', value: '2' },\n { name: '3', value: '3' },\n { name: '4', value: '4' },\n { name: '5', value: '5' },\n { name: '6', value: '6' },\n { name: '7', value: '7' },\n { name: '8', value: '8' },\n { name: '9', value: '9' },\n { name: '10', value: '10' },\n { name: '11', value: '11' },\n { name: '12', value: '12' },\n { name: '13', value: '13' },\n { name: '14', value: '14' },\n { name: '15', value: '15' },\n { name: '16', value: '16' },\n { name: '17', value: '17' },\n { name: '18', value: '18' },\n { name: '19', value: '19' },\n { name: '20', value: '20' },\n { name: '21', value: '21' },\n { name: '22', value: '22' },\n { name: '23', value: '23' },\n { name: '24', value: '24' },\n { name: '25', value: '25' },\n { name: '26', value: '26' },\n { name: '27', value: '27' },\n { name: '28', value: '28' },\n { name: '29', value: '29' },\n { name: '30', value: '30' },\n { name: '31', value: '31' }\n ]\n }\n}\n","import React, { useEffect, useState } from 'react';\nimport { useSelector } from 'react-redux';\nimport { generatorOptions } from '../../../../ControlPanelService/GeneratorOptions';\n\nconst RunCommandSelect = props => {\n const { i18n } = useSelector(state => state.session);\n\n const [state, setState] = useState({\n activeTab: ''\n });\n\n useEffect(() => {\n setState({ ...state, activeTab: props.activeTab });\n }, [props]);\n\n const renderOptions = () => {\n const { daysRunCommandsOptions, hoursRunCommandsOptions, minutesRunCommandsOptions, monthlyRunCommandOptions, weeklyRunCommandOptions } = generatorOptions(i18n);\n\n switch (state.activeTab) {\n case '1': return minutesRunCommandsOptions.map(option => {option.name} );\n case '2': return hoursRunCommandsOptions.map(option => {option.name} );\n case '3': return daysRunCommandsOptions.map(option => {option.name} );\n case '4': return weeklyRunCommandOptions.map(option => {option.name} );\n case '5': return monthlyRunCommandOptions.map(option => {option.name} );\n default: break;\n }\n }\n\n const selectName = () => {\n switch (state.activeTab) {\n case '1': return 'h_min';\n case '2': return 'h_hour';\n case '3': return 'h_day';\n case '4': return 'h_wday';\n case '5': return 'h_month';\n default: break;\n }\n }\n\n return (\n \n {i18n['Run Command']}: \n \n {renderOptions()}\n \n
\n );\n}\n\nexport default RunCommandSelect;","import React from 'react';\nimport { useSelector } from 'react-redux';\nimport { generatorOptions } from '../../../../ControlPanelService/GeneratorOptions';\n\nexport default function SecondTabSelects() {\n const { i18n } = useSelector(state => state.session);\n const { hourlyMinutesOptions } = generatorOptions(i18n);\n\n const renderOptions = () => {\n return hourlyMinutesOptions.map((option, index) => {option.name} );\n }\n\n return (\n \n );\n}","import React from 'react';\nimport { useSelector } from 'react-redux';\nimport { generatorOptions } from '../../../../ControlPanelService/GeneratorOptions';\n\nexport default function ThirdTabSelects() {\n const { i18n } = useSelector(state => state.session);\n const { dailyMinutesOptions, hoursOptions } = generatorOptions(i18n);\n\n const renderHours = () => {\n return hoursOptions.map((option, index) => {option.name} );\n }\n\n const renderOptions = () => {\n return dailyMinutesOptions.map((option, index) => {option.name} );\n }\n\n return (\n \n
\n
\n\n
\n {i18n.Hour ?? 'Hour'}: \n \n {renderHours()}\n \n
\n\n
\n {i18n.Minute ?? 'Minute'}: \n \n {renderOptions()}\n \n
\n
\n );\n}","import React from 'react';\nimport { useSelector } from 'react-redux';\nimport { generatorOptions } from '../../../../ControlPanelService/GeneratorOptions';\n\nexport default function FourthTabSelects() {\n const { i18n } = useSelector(state => state.session);\n const { dailyMinutesOptions, hoursOptions } = generatorOptions(i18n);\n\n const renderHours = () => {\n return hoursOptions.map((option, index) => {option.name} );\n }\n\n const renderMinutes = () => {\n return dailyMinutesOptions.map((option, index) => {option.name} );\n }\n\n return (\n \n
\n
\n\n
\n {i18n.Hour ?? 'Hour'}: \n \n {renderHours()}\n \n
\n\n
\n {i18n.Minute ?? 'Minute'}: \n \n {renderMinutes()}\n \n
\n
\n );\n}","import React from 'react';\nimport { useSelector } from 'react-redux';\nimport { generatorOptions } from '../../../../ControlPanelService/GeneratorOptions';\n\nexport default function FifthTabSelects() {\n const { i18n } = useSelector(state => state.session);\n const { dailyMinutesOptions, hoursOptions, dateOptions } = generatorOptions(i18n);\n\n const renderDate = () => {\n return dateOptions.map((option, index) => {option.name} );\n }\n\n const renderHours = () => {\n return hoursOptions.map((option, index) => {option.name} );\n }\n\n const renderMinutes = () => {\n return dailyMinutesOptions.map((option, index) => {option.name} );\n }\n\n return (\n \n
\n\n
\n {i18n.Date ?? 'Date'}: \n \n {renderDate()}\n \n
\n\n
\n {i18n.Hour ?? 'Hour'}: \n \n {renderHours()}\n \n
\n\n
\n {i18n.Minute ?? 'Minute'}: \n \n {renderMinutes()}\n \n
\n
\n );\n}","import React, { useEffect, useState } from 'react';\n\nimport SecondTabSelects from './SecondTabSelects';\nimport ThirdTabSelects from './ThirdTabSelects';\nimport FourthTabSelects from './FourthTabSelects';\nimport FifthTabSelects from './FifthTabSelects';\n\nimport './SelectsWrapper.scss';\n\nconst OtherSelects = props => {\n const [state, setState] = useState({\n activeTab: ''\n });\n\n useEffect(() => {\n setState({ ...state, activeTab: props.activeTab });\n }, [props.activeTab]);\n\n const renderSelects = () => {\n switch (state.activeTab) {\n case '1': return (\n \n \n \n \n \n
\n )\n case '2': return ;\n case '3': return ;\n case '4': return ;\n case '5': return ;\n default: break;\n }\n }\n\n return (\n \n {renderSelects()}\n
\n );\n}\n\nexport default OtherSelects;\n","import React, { useEffect, useRef, useState } from 'react';\n\nimport RunCommandSelect from './RunCommandSelect/RunCommandSelect';\nimport SelectsWrapper from './OtherSelects/SelectsWrapper';\nimport { Link, useHistory } from 'react-router-dom';\nimport QS from 'qs';\n\nimport './Generator.scss';\nimport { useSelector } from 'react-redux';\n\nconst Generator = props => {\n const formElement = useRef(null);\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const [state, setState] = useState({\n activeTab: '1'\n });\n\n useEffect(() => {\n let parsedQuery = QS.parse(history.location.search, { ignoreQueryPrefix: true });\n let activeTab = parsedQuery.activeTab || '1';\n\n setState({ ...state, activeTab });\n }, [history.location.search]);\n\n const activeClassName = tab => {\n return state.activeTab === tab ? 'active' : '';\n }\n\n const emulateFormSubmit = () => {\n let generatedCronJob = {};\n\n for (let i = 0; i <= 4; i++) {\n let iterableFormElement = formElement.current[i];\n\n generatedCronJob[iterableFormElement.name] = iterableFormElement.value;\n }\n\n props.generatedCronJob(generatedCronJob);\n }\n\n const formatLink = tab => {\n const { job, mode } = props;\n\n return `/${mode}/cron/?${!!job ? `job=${job}&` : ''}activeTab=${tab}`;\n }\n\n return (\n \n
\n {i18n.Minutes}\n {i18n.Hourly}\n {i18n.Daily}\n {i18n.Weekly}\n {i18n.Monthly}\n
\n\n
\n\n
\n \n\n \n\n \n {i18n.Generate} \n
\n \n\n
\n
\n );\n}\n\nexport default Generator;","import React, { useEffect, useState } from 'react';\nimport { addActiveElement, removeFocusedElement } from \"../../../actions/MainNavigation/mainNavigationActions\";\nimport TextInput from '../../ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport { getCronJobInfo, updateCronJob } from '../../../ControlPanelService/Cron';\nimport AddItemLayout from '../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Spinner from '../../../components/Spinner/Spinner';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport Generator from '../Generator/Generator';\nimport { useHistory } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\nimport QS from 'qs';\n\nimport './EditCronJob.scss';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\nimport HtmlParser from 'react-html-parser';\n\nconst EditMail = props => {\n const token = localStorage.getItem(\"token\");\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const dispatch = useDispatch();\n const [errorMessage, setErrorMessage] = useState('');\n const [okMessage, setOkMessage] = useState('');\n const [state, setState] = useState({\n data: {},\n loading: false,\n generatedCronJob: {\n h_min: '*',\n h_hour: '*',\n h_day: '*',\n h_wday: '*',\n h_month: '*'\n }\n });\n\n useEffect(() => {\n let queryParams = QS.parse(history.location.search, { ignoreQueryPrefix: true });\n const { job } = queryParams;\n\n dispatch(addActiveElement('/list/cron/'));\n dispatch(removeFocusedElement());\n\n if (job) {\n setState({ ...state, loading: true });\n fetchData(job)\n }\n }, []);\n\n const fetchData = job => {\n getCronJobInfo(job)\n .then(response => {\n setState({\n ...state,\n generatedCronJob: {\n ...state.generatedCronJob,\n h_min: response.data.min,\n h_hour: response.data.hour,\n h_day: response.data.day,\n h_wday: response.data.wday,\n h_month: response.data.month\n },\n data: response.data,\n loading: false\n });\n })\n .catch(err => {\n setState({ ...state, loading: false });\n console.error(err);\n });\n }\n\n const submitFormHandler = event => {\n event.preventDefault();\n let updatedJob = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n updatedJob[name] = value;\n }\n\n if (Object.keys(updatedJob).length !== 0 && updatedJob.constructor === Object) {\n setState({ ...state, loading: true });\n\n updateCronJob(updatedJob, state.data.job)\n .then(result => {\n if (result.status === 200) {\n const { error_msg, ok_msg } = result.data;\n\n if (error_msg) {\n setOkMessage('');\n setErrorMessage(error_msg);\n } else {\n dispatch(refreshCounters()).then(() => {\n setOkMessage(ok_msg);\n setErrorMessage('');\n });\n }\n }\n })\n .then(() => fetchData(state.data.job))\n .catch(err => console.error(err));\n }\n }\n\n const saveGeneratedCronJob = generatedCronJob => {\n setState({\n ...state,\n generatedCronJob\n });\n }\n\n const changeInput = input => {\n let updatedGeneratedCronJob = {\n ...state.generatedCronJob,\n [input.id]: input.value\n };\n\n setState({\n ...state,\n generatedCronJob: updatedGeneratedCronJob\n });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.CRON}`} \n \n
\n
\n {i18n['Editing Cron Job']}
\n \n \n {errorMessage ? : ''} {errorMessage}\n \n
\n \n \n {okMessage ? : ''} {HtmlParser(okMessage)} \n \n
\n \n
\n {state.loading ? :\n submitFormHandler(event)} id=\"edit-cron\">\n \n \n\n \n\n \n\n
\n \n\n \n\n \n\n \n\n \n
\n\n
\n \n
\n\n
\n\n \n {i18n.Save} \n history.push('/list/cron/')}>{i18n.Back} \n
\n\n \n }\n \n
\n );\n}\n\nexport default EditMail;","import React, { useEffect, useState } from 'react';\n\nconst TextInputWithExtraButton = props => {\n const [state, setState] = useState({\n value: '',\n previousValue: ''\n });\n\n useEffect(() => {\n setState({ ...state, value: props.value });\n }, [props.value]);\n\n useEffect(() => {\n setState({ ...state, value: props.value, previousValue: props.value });\n }, []);\n\n const changeValue = event => {\n let inputValue = event.target.value;\n\n setState({ ...state, value: inputValue, previousValue: inputValue });\n }\n\n return (\n \n );\n}\n\nexport default TextInputWithExtraButton;","import React, { useEffect, useState } from 'react';\nimport { useSelector } from 'react-redux';\n\nconst NameServers = props => {\n const { i18n } = useSelector(state => state.session);\n const [state, setState] = useState({\n nameServersAmount: [],\n usersNS: []\n });\n\n useEffect(() => {\n if (props.usersNS) {\n let initNameServersAmount = props.usersNS.map((userNS, index) => index + 1);\n setState({ ...state, usersNS: props.usersNS, nameServersAmount: initNameServersAmount });\n }\n }, [props.usersNS]);\n\n const renderNameServerInputs = () => {\n return state.nameServersAmount.map((nameServer, index) => {\n if (nameServer < 9) {\n return (\n \n \n onDeleteNameServer(index)}>\n {i18n.delete ?? 'Delete'}\n \n
\n );\n }\n });\n }\n\n const addNameServerClassName = () => {\n return state.nameServersAmount.length === 8 ? 'hide' : 'show optional';\n }\n\n const addNameServer = () => {\n let nameServersLength = state.nameServersAmount.length;\n let nameServersDuplicate = [...state.nameServersAmount];\n\n nameServersDuplicate.push(nameServersLength + 1);\n\n setState({ ...state, nameServersAmount: nameServersDuplicate });\n }\n\n const onDeleteNameServer = index => {\n let nameServersDuplicate = [...state.nameServersAmount];\n\n nameServersDuplicate.splice(index - 1, 1);\n\n setState({ ...state, nameServersAmount: nameServersDuplicate });\n }\n\n return (\n <>\n \n {i18n['Name servers'] ?? 'Name servers'} \n {renderNameServerInputs()}\n
\n\n addNameServer()}>\n {i18n['Add one more Name Server'] ?? 'Add one more Name Server'}\n \n >\n );\n}\n\nexport default NameServers;","import axios from \"axios\";\nimport { getAuthToken } from \"src/utils/token\";\n\nconst BASE_URL = window.location.origin;\nconst webApiUri = '/api/v1/list/package/index.php';\nconst additionalPackageInfoUri = '/api/v1/add/package/index.php';\nconst addPackageUri = '/api/v1/add/package/index.php';\nconst packageInfoUri = '/api/v1/edit/package/index.php';\nconst updatePackageUri = '/api/v1/edit/package/index.php';\n\nexport const getPackageList = () => {\n return axios.get(BASE_URL + webApiUri);\n}\n\nexport const bulkAction = (action, backups) => {\n const formData = new FormData();\n formData.append(\"action\", action);\n formData.append(\"token\", getAuthToken());\n\n backups.forEach(backup => {\n formData.append(\"package[]\", backup);\n });\n\n return axios.post(BASE_URL + '/api/v1/bulk/package/', formData);\n};\n\nexport const handleAction = uri => {\n return axios.get(BASE_URL + uri, {\n params: {\n token: getAuthToken()\n }\n });\n}\n\nexport const addPackage = data => {\n let formDataObject = new FormData();\n\n for (let key in data) {\n formDataObject.append(key, data[key]);\n }\n\n return axios.post(BASE_URL + addPackageUri, formDataObject);\n}\n\nexport const getAdditionalPackageInfo = () => {\n return axios.get(BASE_URL + additionalPackageInfoUri);\n}\n\nexport const getPackageInfo = item => {\n return axios.get(BASE_URL + packageInfoUri, {\n params: {\n package: item,\n token: getAuthToken()\n }\n });\n}\n\nexport const updatePackage = (data, item) => {\n let formDataObject = new FormData();\n\n for (let key in data) {\n formDataObject.append(key, data[key]);\n }\n\n return axios.post(BASE_URL + updatePackageUri, formDataObject, {\n params: {\n package: item\n }\n });\n}\n","import React, { useEffect, useState } from 'react';\n\nimport TextInputWithExtraButton from '../../ControlPanel/AddItemLayout/Form/TextInputWithExtraButton/TextInputWithExtraButton';\nimport { addActiveElement, removeFocusedElement } from \"../../../actions/MainNavigation/mainNavigationActions\";\nimport SelectInput from '../../ControlPanel/AddItemLayout/Form/SelectInput/SelectInput';\nimport NameServers from '../../ControlPanel/AddItemLayout/Form/NameServers/NameServers';\nimport { getPackageInfo, updatePackage } from '../../../ControlPanelService/Package';\nimport TextInput from '../../ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport AddItemLayout from '../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Spinner from '../../../components/Spinner/Spinner';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\nimport QS from 'qs';\n\nimport './EditPackage.scss';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\nimport HtmlParser from 'react-html-parser';\n\nconst EditPackage = props => {\n const token = localStorage.getItem(\"token\");\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const dispatch = useDispatch();\n const [errorMessage, setErrorMessage] = useState('');\n const [okMessage, setOkMessage] = useState('');\n const [state, setState] = useState({\n data: {},\n loading: false\n });\n\n useEffect(() => {\n let queryParams = QS.parse(history.location.search, { ignoreQueryPrefix: true });\n\n dispatch(addActiveElement('/list/package/'));\n dispatch(removeFocusedElement());\n\n if (queryParams.package) {\n setState({ ...state, loading: true });\n fetchData(queryParams.package);\n }\n }, []);\n\n const fetchData = pkg => {\n getPackageInfo(pkg)\n .then(response => {\n setState({\n ...state,\n data: response.data,\n loading: false\n });\n })\n .catch(err => {\n setState({ ...state, loading: false });\n console.error(err);\n });\n }\n\n const submitFormHandler = event => {\n event.preventDefault();\n let updatedPackage = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n updatedPackage[name] = value;\n }\n\n updatedPackage['token'] = token;\n updatedPackage['save'] = 'save';\n updatedPackage['v_package'] = state.data.package;\n\n if (Object.keys(updatedPackage).length !== 0 && updatedPackage.constructor === Object) {\n setState({ ...state, loading: true });\n\n updatePackage(updatedPackage, state.data.package)\n .then(result => {\n if (result.status === 200) {\n const { error_msg, ok_msg } = result.data;\n\n if (error_msg) {\n setErrorMessage(error_msg);\n setOkMessage('');\n } else {\n dispatch(refreshCounters()).then(() => {\n setErrorMessage('');\n setOkMessage(ok_msg);\n });\n }\n }\n })\n .then(() => fetchData(state.data.package))\n .catch(err => console.error(err));\n }\n }\n\n const toggleUnlimited = inputName => {\n let inputNameToUpdate = state.data[inputName];\n let defaultValue;\n\n if (inputName === 'quota' || inputName === 'bandwidth') {\n defaultValue = '1000';\n } else {\n defaultValue = '1';\n }\n\n setState({\n ...state,\n data: {\n ...state.data,\n [inputName]: inputNameToUpdate !== 'unlimited' ? 'unlimited' : defaultValue\n }\n });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.PACKAGE}`} \n \n
\n
\n {i18n['Editing Package']}
\n \n \n {errorMessage ? : ''} {errorMessage}\n \n
\n \n \n {okMessage ? : ''} {HtmlParser(okMessage)} \n \n
\n \n
\n {state.loading ? :\n \n \n\n \n\n {\n state.data.web_backend && (\n \n )\n }\n\n {\n state.data.proxy_system && (\n \n )\n }\n\n {\n state.data.dns_system && (\n \n )\n }\n\n \n\n \n toggleUnlimited('web_domains')}>\n \n \n \n\n \n toggleUnlimited('web_aliases')}>\n \n \n \n\n \n toggleUnlimited('dns_domains')}>\n \n \n \n\n \n toggleUnlimited('dns_records')}>\n \n \n \n\n \n toggleUnlimited('mail_domains')}>\n \n \n \n\n \n toggleUnlimited('mail_accounts')}>\n \n \n \n\n \n toggleUnlimited('databases')}>\n \n \n \n\n \n toggleUnlimited('cron_jobs')}>\n \n \n \n\n \n\n \n toggleUnlimited('disk_quota')}>\n \n \n \n\n \n toggleUnlimited('bandwidth')}>\n \n \n \n\n \n\n \n {i18n.Save} \n history.push('/list/package/')}>{i18n.Back} \n
\n\n \n }\n \n
\n );\n}\n\nexport default EditPackage;","import React, { useEffect, useState } from 'react';\nimport { addActiveElement, removeFocusedElement } from \"../../../../actions/MainNavigation/mainNavigationActions\";\nimport Checkbox from '../../../ControlPanel/AddItemLayout/Form/Checkbox/Checkbox';\nimport TextArea from '../../../ControlPanel/AddItemLayout/Form/TextArea/TextArea';\nimport AddItemLayout from '../../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { getServiceInfo, updateService } from 'src/ControlPanelService/Server';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Spinner from '../../../../components/Spinner/Spinner';\nimport Toolbar from '../../../MainNav/Toolbar/Toolbar';\nimport { Link, useHistory } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\n\nimport './EditHttpd.scss';\nimport { Helmet } from 'react-helmet';\nimport HtmlParser from 'react-html-parser';\n\nconst EditHttpd = props => {\n const token = localStorage.getItem(\"token\");\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const dispatch = useDispatch();\n const [errorMessage, setErrorMessage] = useState('');\n const [okMessage, setOkMessage] = useState('');\n const [state, setState] = useState({\n data: {},\n loading: false,\n errorMessage: '',\n okMessage: ''\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/server/'));\n dispatch(removeFocusedElement());\n\n setState({ ...state, loading: true });\n fetchData();\n }, []);\n\n const fetchData = () => {\n getServiceInfo('httpd')\n .then(response => {\n setState({\n ...state,\n data: response.data,\n loading: false\n });\n })\n .catch(err => {\n setState({ ...state, loading: false });\n console.error(err);\n });\n }\n\n const submitFormHandler = event => {\n event.preventDefault();\n let updatedService = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n updatedService[name] = value;\n }\n\n if (Object.keys(updatedService).length !== 0 && updatedService.constructor === Object) {\n setState({ ...state, loading: true });\n\n updateService(updatedService, '/httpd')\n .then(result => {\n if (result.status === 200) {\n const { error_msg, ok_msg } = result.data;\n\n if (error_msg) {\n setErrorMessage(error_msg);\n setOkMessage('');\n } else {\n setErrorMessage('');\n setOkMessage(ok_msg);\n }\n }\n })\n .then(() => fetchData())\n .catch(err => console.error(err));\n }\n }\n\n return (\n \n
\n {`Vesta - ${i18n.SERVER}`} \n \n
\n
\n {i18n['Configuring Server']} / {state.data.service_name}
\n {i18n['Configure']} php.ini
\n \n \n {errorMessage ? : ''} {errorMessage}\n \n
\n \n \n {okMessage ? : ''} {HtmlParser(okMessage)} \n \n
\n \n
\n {state.loading ? :\n submitFormHandler(event)} id=\"edit-httpd\">\n \n \n\n \n\n \n\n \n\n \n {i18n.Save} \n history.push('/list/server/')}>{i18n.Back} \n
\n\n \n }\n \n
\n );\n}\n\nexport default EditHttpd;","import React, { useEffect, useState } from 'react';\n\nimport { addActiveElement, removeFocusedElement } from \"../../../actions/MainNavigation/mainNavigationActions\";\nimport AddItemLayout from '../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { addCronJob } from '../../../ControlPanelService/Cron';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport Generator from '../Generator/Generator';\nimport { useHistory } from 'react-router-dom';\nimport Spinner from '../../Spinner/Spinner';\nimport { useDispatch, useSelector } from 'react-redux';\n\nimport './AddCronJob.scss';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\nimport HtmlParser from 'react-html-parser';\n\nconst AddCronJob = props => {\n const { i18n } = useSelector(state => state.session);\n const token = localStorage.getItem(\"token\");\n const history = useHistory();\n const dispatch = useDispatch();\n const [state, setState] = useState({\n loading: false,\n okMessage: '',\n errorMessage: '',\n generatedCronJob: {\n h_min: '*',\n h_hour: '*',\n h_day: '*',\n h_wday: '*',\n h_month: '*'\n }\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/cron/'));\n dispatch(removeFocusedElement());\n }, []);\n\n const submitFormHandler = event => {\n event.preventDefault();\n let newCronJob = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n newCronJob[name] = value;\n }\n\n if (Object.keys(newCronJob).length !== 0 && newCronJob.constructor === Object) {\n setState({ ...state, loading: true });\n addCronJob(newCronJob)\n .then(result => {\n if (result.status === 200) {\n const { error_msg: errorMessage, ok_msg: okMessage } = result.data;\n\n if (errorMessage) {\n setState({ ...state, errorMessage, okMessage, loading: false });\n } else {\n dispatch(refreshCounters()).then(() => {\n setState({ ...state, okMessage, errorMessage: '', loading: false });\n });\n }\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n const saveGeneratedCronJob = generatedCronJob => {\n setState({\n ...state,\n generatedCronJob\n });\n }\n\n const changeInput = input => {\n let updatedGeneratedCronJob = {\n ...state.generatedCronJob,\n [input.id]: input.value\n };\n\n setState({\n ...state,\n generatedCronJob: updatedGeneratedCronJob\n });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.CRON}`} \n \n
\n
\n {i18n['Adding Cron Job']}
\n \n \n {state.errorMessage ? : ''}\n {state.errorMessage} \n
\n \n \n {state.okMessage ? : ''}\n {HtmlParser(state.okMessage)} \n \n
\n \n
\n {state.loading ? : (\n submitFormHandler(event)}>\n \n \n\n \n {i18n.Command ?? 'Command'} \n \n
\n\n \n\n \n {i18n.Add ?? 'Add'} \n history.push('/list/cron/')}>{i18n.Back ?? 'Back'} \n
\n \n )}\n \n
\n );\n}\n\nexport default AddCronJob;","import React, { useEffect, useState } from 'react';\n\nimport TextInputWithExtraButton from '../../ControlPanel/AddItemLayout/Form/TextInputWithExtraButton/TextInputWithExtraButton';\nimport { addActiveElement, removeFocusedElement } from \"../../../actions/MainNavigation/mainNavigationActions\";\nimport { getAdditionalPackageInfo, addPackage } from '../../../ControlPanelService/Package';\nimport NameServers from '../../ControlPanel/AddItemLayout/Form/NameServers/NameServers';\nimport SelectInput from '../../ControlPanel/AddItemLayout/Form/SelectInput/SelectInput';\nimport TextInput from '../../ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport AddItemLayout from '../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport Spinner from '../../Spinner/Spinner';\nimport { useDispatch, useSelector } from 'react-redux';\n\nimport './AddPackage.scss';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\nimport HtmlParser from 'react-html-parser';\n\nconst AddPackage = props => {\n const token = localStorage.getItem(\"token\");\n const { i18n } = useSelector(state => state.session);\n const dispatch = useDispatch();\n const history = useHistory();\n const [state, setState] = useState({\n loading: false,\n okMessage: '',\n errorMessage: '',\n webTemplates: [],\n webSystem: '',\n backendTemplates: [],\n backendSystem: '',\n proxySystem: '',\n proxyTemplates: [],\n dnsTemplates: [],\n dnsSystem: '',\n sshTemplates: [],\n usersNS: [],\n webDomains: '1',\n webAliases: '1',\n dnsDomains: '1',\n dnsRecords: '1',\n mailDomains: '1',\n mailAccounts: '1',\n databases: '1',\n cronJobs: '1',\n quota: '1000',\n bandwidth: '1000',\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/package/'));\n dispatch(removeFocusedElement());\n\n setState({ ...state, loading: true });\n\n fetchData();\n }, []);\n\n const fetchData = () => {\n getAdditionalPackageInfo()\n .then(result => {\n setState({\n ...state,\n webTemplates: result.data.web_templates,\n webSystem: result.data.web_system,\n backendTemplates: result.data.backend_templates,\n backendSystem: result.data.web_backend,\n dnsTemplates: result.data.dns_templates,\n dnsSystem: result.data.dns_system,\n proxySystem: result.data.proxy_system,\n proxyTemplates: result.data.proxy_templates,\n sshTemplates: result.data.ssh_access,\n loading: false\n });\n })\n .catch(err => console.err(err));\n }\n\n const submitFormHandler = event => {\n event.preventDefault();\n let newPackage = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n newPackage[name] = value;\n }\n\n newPackage['token'] = token;\n newPackage['ok'] = 'Add';\n\n if (Object.keys(newPackage).length !== 0 && newPackage.constructor === Object) {\n setState({ ...state, loading: true });\n addPackage(newPackage)\n .then(result => {\n if (result.status === 200) {\n const { error_msg: errorMessage, ok_msg: okMessage } = result.data;\n\n if (errorMessage) {\n setState({ ...state, errorMessage, okMessage, loading: false });\n } else {\n dispatch(refreshCounters()).then(() => {\n setState({ ...state, okMessage, errorMessage: '', loading: false });\n });\n }\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n const toggleUnlimited = inputName => {\n let inputNameToUpdate = state[inputName];\n let defaultValue;\n\n if (inputName === 'quota' || inputName === 'bandwidth') {\n defaultValue = '1000';\n } else {\n defaultValue = '1';\n }\n\n if (inputNameToUpdate !== 'unlimited') {\n setState({ ...state, [inputName]: 'unlimited' });\n } else {\n setState({ ...state, [inputName]: defaultValue });\n }\n }\n\n return (\n \n
\n {`Vesta - ${i18n.PACKAGE}`} \n \n
\n
\n {i18n['Adding Package']}
\n \n \n {state.errorMessage ? : ''}\n {state.errorMessage} \n
\n \n \n {state.okMessage ? : ''}\n {HtmlParser(state.okMessage)} \n \n
\n \n
\n {state.loading ? : (\n submitFormHandler(event)}>\n \n\n \n\n \n\n \n\n \n\n \n\n \n toggleUnlimited('webDomains')}>\n \n \n \n\n \n toggleUnlimited('webAliases')}>\n \n \n \n\n \n toggleUnlimited('dnsDomains')}>\n \n \n \n\n \n toggleUnlimited('dnsRecords')}>\n \n \n \n\n \n toggleUnlimited('mailDomains')}>\n \n \n \n\n \n toggleUnlimited('mailAccounts')}>\n \n \n \n\n \n toggleUnlimited('databases')}>\n \n \n \n\n \n toggleUnlimited('cronJobs')}>\n \n \n \n\n \n\n \n toggleUnlimited('quota')}>\n \n \n \n\n \n toggleUnlimited('bandwidth')}>\n \n \n \n\n \n\n \n {i18n.Add} \n history.push('/list/package/')}>{i18n.Back} \n
\n \n )}\n \n
\n );\n}\n\nexport default AddPackage;","import React from 'react';\n\nimport TextInput from 'src/components/ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport { Link } from 'react-router-dom';\nimport { useSelector } from 'react-redux';\n\nconst EditServerWebOption = ({ proxySystem, webSystem, webBackend, webBackendPool, visible = false }) => {\n const { i18n } = useSelector(state => state.session);\n\n return (\n \n\n {\n proxySystem && (\n {i18n['configure']}}\n title={i18n['Proxy Server'] + ' / '}\n name=\"v_proxy_system\"\n value={proxySystem}\n id=\"proxy_system\"\n disabled />\n )\n }\n\n {\n webSystem && (\n {i18n['configure']}}\n title={i18n['Web Server'] + ' / '}\n name=\"v_web_system\"\n value={webSystem}\n id=\"web_system\"\n disabled />\n )\n }\n\n {\n webBackend && (\n \n )\n }\n\n {\n webBackendPool && (\n {i18n['configure']}}\n title={i18n['Backend Pool Mode']}\n name=\"v_web_backend_pool\"\n value={webBackendPool}\n id=\"web_backend_pool\"\n disabled\n />\n )\n }\n\n
\n );\n}\n\nexport default EditServerWebOption;","import React from 'react';\n\nimport SelectInput from 'src/components/ControlPanel/AddItemLayout/Form/SelectInput/SelectInput';\nimport TextInput from 'src/components/ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport { Link } from 'react-router-dom';\nimport { useSelector } from 'react-redux';\n\nconst EditServerDnsOption = ({ dnsSystem, selected, dnsCluster, visible }) => {\n const { i18n } = useSelector(state => state.session);\n\n const printHosts = () => {\n return Object.keys(dnsCluster).map((cluster, index) => (\n \n ));\n }\n\n return (\n \n
{i18n['configure']}}\n title={i18n['DNS Server'] + ' / '}\n name=\"v_dns_system\"\n value={dnsSystem}\n id=\"dns_system\"\n disabled />\n\n \n\n {\n selected === 'yes' && (\n \n {printHosts()}\n
\n )\n }\n \n );\n}\n\nexport default EditServerDnsOption;","import React, { useState } from 'react';\n\nimport SelectInput from 'src/components/ControlPanel/AddItemLayout/Form/SelectInput/SelectInput';\nimport TextInput from 'src/components/ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport { useSelector } from 'react-redux';\n\nconst EditVestaPluginsOption = ({ data, visible }) => {\n const { i18n } = useSelector(state => state.session);\n const { session } = useSelector(state => state.userSession);\n const [sftpValue, setSftpValue] = useState(data.lead || session['SFTPJAIL_KEY'] ? 'yes' : 'no');\n const [fmValue, setFmValue] = useState(data.fm_lead || session['FILEMANAGER_KEY'] ? 'yes' : 'no');\n const [softaculousValue, setSoftaculousValue] = useState(session['SOFTACULOUS'] === 'yes' ? 'yes' : 'no');\n\n const renderSoftaculous = () => {\n if (softaculousValue === 'yes') {\n if (session['SOFTACULOUS'] === 'yes') {\n return (\n
\n {i18n['* plugin installation will run in background']} \n \n Softaculous is a great Auto Installer having 426 great scripts, 1115 PHP Classes\n and we are still adding more. Softaculous is ideal for Web Hosting companies and\n it could give a significant boost to your sales. These scripts cover most of the\n uses a customer could ever have. We have covered a wide array of Categories so that\n everyone could find the required script one would need to power their Web Site.\n \n
\n\n
\n
);\n }\n }\n }\n\n const renderSftp = () => {\n if (sftpValue === 'yes') {\n if (!data.sftp_license_key && session['SFTPJAIL_KEY']) {\n return (\n
{i18n['Restrict users so that they cannot use SSH and access only their home directory.']}
\n
\n {i18n['Licence Key']}: \n \n
\n
)\n } else {\n return (\n <>\n
{i18n['Restrict users so that they cannot use SSH and access only their home directory.']} \n
{i18n['This is a commercial module, you would need to purchace license key to enable it.']} \n >\n
\n {i18n['Enter License Key']}: \n \n
\n\n
\n\n
2Checkout.com Inc. (Ohio, USA) is a payment facilitator for goods and services provided by vestacp.com. \n
)\n }\n }\n }\n\n const renderFm = () => {\n if (fmValue === 'yes') {\n if (!data.fm_license_key && session['FILEMANAGER_KEY']) {\n return (\n
{i18n['Browse, copy, edit, view, and retrieve all of your web domain files using fully featured File Manager.']}
\n
\n {i18n['Licence Key']}: \n \n
\n
);\n } else {\n return (\n <>\n
{i18n['Browse, copy, edit, view, and retrieve all of your web domain files using fully featured File Manager.']} \n
{i18n['This is a commercial module, you would need to purchace license key to enable it.']} \n >\n
\n {i18n['Enter License Key']}: \n \n
\n\n
\n\n
2Checkout.com Inc. (Ohio, USA) is a payment facilitator for goods and services provided by vestacp.com. \n
)\n }\n }\n }\n\n return (\n \n
\n\n
\n \n {i18n['FileSystem Disk Quota']}\n \n \n {i18n['no']} \n {i18n['yes']} \n \n
\n\n
\n\n
\n \n {i18n['Firewall']}\n \n \n {i18n['no']} \n {i18n['yes']} \n \n
\n\n
\n\n
\n\n
\n \n {i18n['SFTP Chroot']}\n \n setSftpValue(event.target.value)}>\n {\n session['SFTPJAIL_KEY']\n ? {i18n['Disable and Cancel Licence']} \n : {i18n['no']} \n }\n\n {i18n['yes']} \n \n
\n\n {renderSftp()}\n\n
\n\n
\n \n {i18n['File Manager']}\n \n setFmValue(event.target.value)}>\n {\n session['FILEMANAGER_KEY']\n ? {i18n['Disable and Cancel Licence']} \n : {i18n['no']} \n }\n\n {i18n['yes']} \n \n
\n\n {renderFm()}\n\n
\n\n
\n \n {i18n['Softaculous'] ?? 'Softaculous'}\n \n setSoftaculousValue(event.target.value)}>\n {i18n['no']} \n {i18n['yes']} \n \n
\n\n {renderSoftaculous()}\n
\n );\n}\n\nexport default EditVestaPluginsOption;\n","import React, { useEffect, useState } from 'react';\n\nimport SelectInput from 'src/components/ControlPanel/AddItemLayout/Form/SelectInput/SelectInput';\nimport TextArea from 'src/components/ControlPanel/AddItemLayout/Form/TextArea/TextArea';\nimport Checkbox from 'src/components/ControlPanel/AddItemLayout/Form/Checkbox/Checkbox';\nimport { Link } from 'react-router-dom';\nimport { useSelector } from 'react-redux';\n\nconst EditVestaSslOption = ({ data, visible }) => {\n const { i18n } = useSelector(state => state.session);\n const [domainsVisible, setDomainsVisible] = useState(false);\n const [sslDomains, setSslDomains] = useState([]);\n\n useEffect(() => {\n const { ssl_domains } = data;\n\n if (ssl_domains) {\n setSslDomains(['', ...ssl_domains]);\n } else {\n setSslDomains(['']);\n }\n\n }, []);\n\n return (\n \n
setDomainsVisible(checked)}\n title={i18n['Use Web Domain SSL Certificate']}\n defaultChecked={data.vesta_certificate}\n name=\"v_web_ssl_domain_checkbox\"\n id=\"web_ssl_domain_checkbox\"\n checked={domainsVisible}\n />\n\n {\n domainsVisible && (\n \n \n
\n )\n }\n\n \n\n \n\n \n {\n data.sys_ssl_subject && (\n
\n {i18n['SUBJECT']}: \n {data.sys_ssl_subject} \n
\n )\n }\n\n {\n data.sys_ssl_aliases && (\n
\n {i18n['ALIASES']}: \n {data.sys_ssl_aliases} \n
\n )\n }\n\n {\n data.sys_ssl_not_before && (\n
\n {i18n['NOT_BEFORE']}: \n {data.sys_ssl_not_before} \n
\n )\n }\n\n {\n data.sys_ssl_not_after && (\n
\n {i18n['NOT_AFTER']}: \n {data.sys_ssl_not_after} \n
\n )\n }\n\n {\n data.sys_ssl_signature && (\n
\n {i18n['SIGNATURE']}: \n {data.sys_ssl_signature} \n
\n )\n }\n\n {\n data.sys_ssl_pub_key && (\n
\n {i18n['PUB_KEY']}: \n {data.sys_ssl_pub_key} \n
\n )\n }\n\n {\n data.sys_ssl_issuer && (\n
\n {i18n['ISSUER']}: \n {data.sys_ssl_issuer} \n
\n )\n }\n
\n \n );\n}\n\nexport default EditVestaSslOption;","import React, { useEffect, useState } from 'react';\n\nimport SelectInput from 'src/components/ControlPanel/AddItemLayout/Form/SelectInput/SelectInput';\nimport TextInput from 'src/components/ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport Checkbox from 'src/components/ControlPanel/AddItemLayout/Form/Checkbox/Checkbox';\nimport { Link } from 'react-router-dom';\nimport { useSelector } from 'react-redux';\n\nconst EditDatabaseOption = ({ data, visible }) => {\n const { i18n } = useSelector(state => state.session);\n\n const printPhpMyAdminHosts = () => {\n if (data.mysql_hosts.length) {\n return data.mysql_hosts.map((host, index) => (\n \n \n\n \n\n \n\n \n
\n ));\n }\n }\n\n const printPgSqlHosts = () => {\n return data.pgsql_hosts.map((host, index) => (\n \n \n\n \n\n \n
\n ));\n }\n\n return (\n \n {i18n['configure']}}\n title={i18n['MySQL Support'] + ' / '}\n selected={data.mysql}\n options={[i18n['no'], i18n['yes']]}\n name=\"v_mysql\"\n id=\"mysql\"\n disabled />\n\n {\n data.mysql === 'yes' && (\n <>\n \n\n {printPhpMyAdminHosts()}\n >\n )\n }\n\n {i18n['configure']}}\n title={i18n['PostgreSQL Support'] + ' / '}\n selected={data.pgsql}\n options={[i18n['no'], i18n['yes']]}\n name=\"v_pgsql\"\n id=\"pgsql\"\n disabled />\n\n {\n data.pgsql === 'yes' && (\n <>\n \n\n {printPgSqlHosts()}\n >\n )\n }\n
\n );\n}\n\nexport default EditDatabaseOption;","import React, { useState } from 'react';\n\nimport SelectInput from 'src/components/ControlPanel/AddItemLayout/Form/SelectInput/SelectInput';\nimport TextInput from 'src/components/ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { useSelector } from 'react-redux';\n\nconst EditBackupOption = ({ data, visible }) => {\n const { i18n } = useSelector(state => state.session);\n const [remoteBackup, setRemoteBackup] = useState(false);\n\n return (\n \n \n\n \n\n \n\n {\n data.backup_remote_adv && (\n <>\n setRemoteBackup(!remoteBackup)}>\n {i18n['Remote backup']}\n {remoteBackup ? : }\n \n\n {\n remoteBackup && (\n <>\n \n\n \n\n \n\n \n\n \n >\n )\n }\n >\n )\n }\n
\n );\n}\n\nexport default EditBackupOption;","import React, { useEffect, useState } from 'react';\n\nimport SelectInput from 'src/components/ControlPanel/AddItemLayout/Form/SelectInput/SelectInput';\nimport TextInput from 'src/components/ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport Checkbox from 'src/components/ControlPanel/AddItemLayout/Form/Checkbox/Checkbox';\nimport { Link } from 'react-router-dom';\nimport { useSelector } from 'react-redux';\n\nconst EditMailOption = ({ data, visible }) => {\n const { i18n } = useSelector(state => state.session);\n const [mailCertificateSystem, setMailCertificateSystem] = useState(false);\n\n useEffect(() => {\n if (data.mail_certificate) {\n setMailCertificateSystem(true);\n }\n }, []);\n\n const getMailCertificateOptions = () => {\n let result = ['', ...data.ssl_domains];\n return result;\n }\n\n return (\n \n
{i18n['configure']}}\n title={i18n['MAIL Server'] + ' / '}\n name=\"v_mail_system\"\n value={data.mail_system}\n id=\"mail_system\"\n disabled />\n\n {\n data.antivirus_system && (\n {i18n['configure']}}\n title={i18n['Antivirus'] + ' / '}\n name=\"v_antivirus_system\"\n value={data.antivirus_system}\n id=\"antivirus_system\"\n disabled />\n )\n }\n\n {\n data.antispam_system && (\n {i18n['configure']}}\n title={i18n['DNS Server'] + ' / '}\n name=\"v_antispam_system\"\n value={data.antispam_system}\n id=\"antispam_system\"\n disabled />\n )\n }\n\n \n\n \n\n setMailCertificateSystem(checked)}\n title={i18n['Use Web Domain SSL Certificate']}\n name=\"v_mail_ssl_domain_checkbox\"\n id=\"mail-ssl-domain-checkbox\"\n checked={!!data.mail_certificate} />\n\n {\n mailCertificateSystem && (\n \n
\n\n
\n {\n data.sys_ssl_subject && (\n
\n {i18n['SUBJECT']}: \n {data.sys_ssl_subject} \n
\n )\n }\n\n {\n data.sys_ssl_aliases && (\n
\n {i18n['ALIASES']}: \n {data.sys_ssl_aliases} \n
\n )\n }\n\n {\n data.sys_ssl_not_before && (\n
\n {i18n['NOT_BEFORE']}: \n {data.sys_ssl_not_before} \n
\n )\n }\n\n {\n data.sys_ssl_not_after && (\n
\n {i18n['NOT_AFTER']}: \n {data.sys_ssl_not_after} \n
\n )\n }\n\n {\n data.sys_ssl_signature && (\n
\n {i18n['SIGNATURE']}: \n {data.sys_ssl_signature} \n
\n )\n }\n\n {\n data.sys_ssl_pub_key && (\n
\n {i18n['PUB_KEY']}: \n {data.sys_ssl_pub_key} \n
\n )\n }\n\n {\n data.sys_ssl_issuer && (\n
\n {i18n['ISSUER']}: \n {data.sys_ssl_issuer} \n
\n )\n }\n
\n
\n )\n }\n \n );\n}\n\nexport default EditMailOption;","import axios from \"axios\";\n\nconst BASE_URL = window.location.origin;\nconst resetPasswordUri = '/api/v1/reset/index.php';\n\nexport const resetPassword = (user = '', code = '', password = '', confirmPassword = '') => {\n const formData = new FormData();\n\n if (password) {\n formData.append('password', password);\n }\n\n if (confirmPassword) {\n formData.append('password_confirm', confirmPassword);\n }\n\n if (user) {\n formData.append('user', user);\n }\n\n if (code) {\n formData.append('code', code);\n }\n\n return axios.post(BASE_URL + resetPasswordUri, formData);\n};\n","import { LOGIN, LOGOUT, LOGGED_OUT_AS, CHECK_AUTH, RESET_PASSWORD } from './sessionTypes';\nimport { checkAuth, signIn, signInAs, signOut } from 'src/services/session';\nimport { resetPassword } from 'src/ControlPanelService/ResetPassword';\nimport { resetAuthToken, setAuthToken } from 'src/utils/token';\nimport { REFRESH_COUNTERS } from '../MenuCounters/menuCounterTypes';\nimport { SET_USER_SESSION } from '../UserSession/userSessionTypes';\n\nconst LOGOUT_RESPONSE = 'logged_out';\nconst LOGOUT_AS_RESPONSE = 'logged_out_as';\n\nexport const login = (user, password) => dispatch => {\n return new Promise((resolve, reject) => {\n signIn({ user, password }).then((response) => {\n const { error, session, token, panel, data, user, i18n } = response.data;\n\n if (token) setAuthToken(token);\n\n dispatch({\n type: LOGIN,\n value: {\n token: token || '',\n panel,\n i18n: i18n || {},\n userName: user,\n error\n },\n });\n dispatch({\n type: REFRESH_COUNTERS,\n value: {\n user: data,\n }\n });\n dispatch({\n type: SET_USER_SESSION,\n value: session\n });\n resolve(token);\n }, (error) => {\n reject(error);\n });\n });\n}\n\nexport const reset = ({ user = '', code = '', password = '', password_confirm = '' }) => dispatch => {\n return new Promise((resolve, reject) => {\n resetPassword(user, code, password, password_confirm).then((response) => {\n const { error, session, token, panel, user } = response.data;\n\n dispatch({\n type: RESET_PASSWORD,\n value: {\n token,\n panel,\n userName: user,\n error\n },\n });\n dispatch({\n type: REFRESH_COUNTERS,\n value: {\n user: {},\n }\n });\n dispatch({\n type: SET_USER_SESSION,\n value: session\n });\n resolve(token);\n }, (error) => {\n reject(error);\n });\n });\n}\n\nexport const loginAs = username => dispatch => {\n return new Promise((resolve, reject) => {\n signInAs(username).then((response) => {\n const { error, token, session, panel, data, user, i18n } = response.data;\n if (token) setAuthToken(token);\n\n dispatch({\n type: LOGIN,\n value: {\n userName: user,\n i18n,\n panel,\n token,\n error\n }\n });\n dispatch({\n type: REFRESH_COUNTERS,\n value: {\n user: data,\n }\n });\n dispatch({\n type: SET_USER_SESSION,\n value: session\n });\n\n resolve(token);\n }, (error) => {\n console.error(error);\n reject();\n });\n });\n}\n\nexport const logout = () => (dispatch, getState) => {\n return new Promise((resolve, reject) => {\n signOut().then((response) => {\n const { logout_response, error, userName, user, i18n, session, panel } = response.data;\n\n if (logout_response === LOGOUT_RESPONSE) {\n resetAuthToken();\n\n dispatch({\n type: LOGOUT,\n value: {\n userName: '',\n token: '',\n panel: {},\n session: {},\n i18n: [],\n error,\n },\n });\n dispatch({\n type: REFRESH_COUNTERS,\n value: {\n user: {},\n }\n });\n dispatch({\n type: SET_USER_SESSION,\n value: {}\n });\n\n resolve();\n } else if (logout_response === LOGOUT_AS_RESPONSE) {\n dispatch({\n type: LOGGED_OUT_AS,\n value: {\n userName,\n panel,\n token: '',\n i18n,\n error,\n },\n });\n dispatch({\n type: REFRESH_COUNTERS,\n value: {\n user,\n }\n });\n dispatch({\n type: SET_USER_SESSION,\n value: session\n });\n\n resolve();\n } else {\n resolve(`Error while signing out: ${logout_response}`);\n }\n }, (error) => {\n console.error(error);\n reject();\n });\n });\n}\n\nexport const checkAuthHandler = () => (dispatch, getState) => {\n return new Promise((resolve, reject) => {\n checkAuth()\n .then(res => {\n const { user, data, session, panel, error, i18n, token } = res.data;\n\n if (token) setAuthToken(token);\n\n dispatch({\n type: CHECK_AUTH,\n value: {\n userName: user,\n i18n,\n panel,\n token,\n error\n }\n });\n dispatch({\n type: REFRESH_COUNTERS,\n value: {\n user: data,\n }\n });\n dispatch({\n type: SET_USER_SESSION,\n value: session\n });\n\n resolve(token);\n })\n .catch(err => {\n reject();\n console.error(err);\n });\n });\n}\n\nexport const refreshUserSession = () => (dispatch, getState) => {\n return new Promise((resolve, reject) => {\n checkAuth()\n .then(res => {\n const { session, token } = res.data;\n\n if (token) setAuthToken(token);\n dispatch({\n type: SET_USER_SESSION,\n value: session\n });\n\n resolve(token);\n })\n .catch(err => {\n reject();\n console.error(err);\n });\n });\n}\n\nexport const removeToken = () => {\n return {\n type: LOGOUT,\n value: {\n token: '',\n error: ''\n }\n }\n}\n","import React, { useEffect, useState } from 'react';\nimport { addActiveElement, removeFocusedElement } from \"../../../actions/MainNavigation/mainNavigationActions\";\nimport { getServerAdditionalInfo, updateService } from '../../../ControlPanelService/Server';\nimport SelectInput from '../../ControlPanel/AddItemLayout/Form/SelectInput/SelectInput';\nimport TextInput from '../../ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport AddItemLayout from '../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Spinner from '../../../components/Spinner/Spinner';\nimport EditServerWebOption from './EditServerWebOption';\nimport EditServerDnsOption from './EditServerDnsOption';\nimport EditVestaPluginsOption from './EditVestaPlugins';\nimport EditVestaSslOption from './EditVestaSslOption';\nimport EditDatabaseOption from './EditDatabaseOption';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport EditBackupOption from './EditBackupOption';\nimport EditMailOption from './EditMailOption';\nimport { useHistory } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\n\nimport './EditServer.scss';\nimport { Helmet } from 'react-helmet';\nimport HtmlParser from 'react-html-parser';\nimport { refreshUserSession } from 'src/actions/Session/sessionActions';\n\nconst EditServer = props => {\n const token = localStorage.getItem(\"token\");\n const { i18n } = useSelector(state => state.session);\n const { session } = useSelector(state => state.userSession);\n const history = useHistory();\n const dispatch = useDispatch();\n const [errorMessage, setErrorMessage] = useState('');\n const [okMessage, setOkMessage] = useState('');\n const [state, setState] = useState({\n data: {},\n loading: false,\n webOption: false,\n dnsOption: false,\n mailOption: false,\n backupOption: false,\n sslOption: false,\n pluginsOption: false,\n dbOption: false\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/server/'));\n dispatch(removeFocusedElement());\n\n setState({ ...state, loading: true });\n fetchData();\n }, []);\n\n const fetchData = () => {\n getServerAdditionalInfo()\n .then(response => {\n setState({\n ...state,\n data: response.data,\n loading: false\n });\n })\n .catch(err => {\n setState({ ...state, loading: false });\n console.error(err);\n });\n }\n\n const submitFormHandler = event => {\n event.preventDefault();\n let updatedServer = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n updatedServer[name] = value;\n }\n\n updatedServer['save'] = 'save';\n updatedServer['token'] = token;\n\n if (updatedServer['v_softaculous'] === 'no' && !session['SOFTACULOUS']) {\n delete updatedServer['v_softaculous'];\n }\n\n if (Object.keys(updatedServer).length !== 0 && updatedServer.constructor === Object) {\n setState({ ...state, loading: true });\n\n updateService(updatedServer)\n .then(result => {\n if (result.status === 200) {\n const { error_msg, ok_msg } = result.data;\n\n if (error_msg) {\n setErrorMessage(error_msg);\n setOkMessage('');\n } else {\n setErrorMessage('');\n setOkMessage(ok_msg);\n }\n }\n })\n .then(() => dispatch(refreshUserSession()).then(() => fetchData()))\n .catch(err => console.error(err));\n }\n }\n\n const toggleOption = option => {\n setState({\n ...state,\n [option]: !state[option]\n });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.SERVER}`} \n \n
\n
\n {i18n['Configuring Server']}
\n \n \n {errorMessage ? : ''} {errorMessage}\n \n
\n \n \n {okMessage ? : ''} {HtmlParser(okMessage)} \n \n
\n \n
\n {state.loading ? :\n submitFormHandler(event)} id=\"edit-server\">\n \n\n {\n state.data.timezones && (\n \n \n {i18n['Time Zone']}\n \n \n {\n Object.keys(state.data.timezones).map(key => {\n const value = state.data.timezones[key];\n\n return {value} ;\n })\n }\n \n
\n )\n }\n\n \n\n \n toggleOption('webOption')}>\n {i18n['WEB']}\n {state.webOption ? : }\n \n\n \n\n toggleOption('dnsOption')}>\n {i18n['DNS']}\n {state.dnsOption ? : }\n \n\n \n\n toggleOption('mailOption')}>\n {i18n['MAIL']}\n {state.mailOption ? : }\n \n\n \n\n toggleOption('dbOption')}>\n {i18n['DB']}\n {state.dbOption ? : }\n \n\n \n\n toggleOption('backupOption')}>\n {i18n['BACKUP']}\n {state.backupOption ? : }\n \n\n \n\n toggleOption('sslOption')}>\n {i18n['Vesta SSL']}\n {state.sslOption ? : }\n \n\n \n\n toggleOption('pluginsOption')}>\n {i18n['Vesta Control Panel Plugins']}\n {state.pluginsOption ? : }\n \n\n \n
\n\n \n {i18n.Save} \n history.push('/list/server/')}>{i18n.Back} \n
\n\n \n }\n \n
\n );\n}\n\nexport default EditServer;\n","import React, { useEffect, useState } from 'react';\nimport { addActiveElement, removeFocusedElement } from \"../../../../actions/MainNavigation/mainNavigationActions\";\nimport Checkbox from '../../../ControlPanel/AddItemLayout/Form/Checkbox/Checkbox';\nimport TextArea from '../../../ControlPanel/AddItemLayout/Form/TextArea/TextArea';\nimport { getServiceInfo, updateService } from 'src/ControlPanelService/Server';\nimport AddItemLayout from '../../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Spinner from '../../../../components/Spinner/Spinner';\nimport Toolbar from '../../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\n\nimport './Dovecot.scss';\nimport { Helmet } from 'react-helmet';\nimport HtmlParser from 'react-html-parser';\n\nconst Dovecot = () => {\n const token = localStorage.getItem(\"token\");\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const dispatch = useDispatch();\n const [errorMessage, setErrorMessage] = useState('');\n const [okMessage, setOkMessage] = useState('');\n const [state, setState] = useState({\n data: {},\n loading: false\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/server/'));\n dispatch(removeFocusedElement());\n\n setState({ ...state, loading: true });\n fetchData();\n }, []);\n\n const fetchData = () => {\n getServiceInfo('dovecot')\n .then(response => {\n if (!response.data.config) {\n history.push('/list/server');\n }\n\n setState({\n ...state,\n data: response.data,\n loading: false\n });\n })\n .catch(err => {\n setState({ ...state, loading: false });\n console.error(err);\n });\n }\n\n const submitFormHandler = event => {\n event.preventDefault();\n let updatedService = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n updatedService[name] = value;\n }\n\n if (Object.keys(updatedService).length !== 0 && updatedService.constructor === Object) {\n setState({ ...state, loading: true });\n\n updateService(updatedService, '/dovecot')\n .then(result => {\n if (result.status === 200) {\n const { error_msg, ok_msg } = result.data;\n\n setErrorMessage(error_msg || '');\n setOkMessage(ok_msg || '');\n }\n })\n .then(() => fetchData())\n .catch(err => console.error(err));\n }\n }\n\n return (\n \n
\n {`Vesta - ${i18n.SERVER}`} \n \n
\n
\n \n {i18n['Configuring Server']} / {state.data.service_name}\n
\n \n \n {errorMessage ? : ''} {errorMessage}\n \n
\n \n \n {okMessage ? : ''} {HtmlParser(okMessage)} \n \n
\n \n
\n {state.loading ? :\n submitFormHandler(event)} id=\"edit-dovecot\">\n \n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n {i18n.Save} \n history.push('/list/server/')}>{i18n.Back} \n
\n\n \n }\n \n
\n );\n}\n\nexport default Dovecot;","import axios from \"axios\";\nimport { getAuthToken } from \"src/utils/token\";\n\nconst BASE_URL = window.location.origin;\nconst webApiUri = '/api/v1/list/mail/index.php';\nconst addMailApiUri = '/api/v1/add/mail/index.php';\nconst mailInfoUri = '/api/v1/edit/mail/index.php';\nconst updateMailUri = '/api/v1/edit/mail/index.php';\n\nexport const getMailList = () => {\n return axios.get(BASE_URL + webApiUri);\n}\n\nexport const getMailAccountList = domain => {\n return axios.get(`${BASE_URL}${webApiUri}?domain=${domain}`)\n}\n\nexport const getMailAccountInfo = (domain, account) => {\n return axios.get(`${BASE_URL}${mailInfoUri}?domain=${domain}&account=${account}`)\n}\n\nexport const bulkAction = (action, domainNameSystems) => {\n const formData = new FormData();\n formData.append(\"action\", action);\n formData.append(\"token\", getAuthToken());\n\n domainNameSystems.forEach(domainNameSystem => {\n formData.append(\"domain[]\", domainNameSystem);\n });\n\n return axios.post(BASE_URL + '/api/v1/bulk/mail/', formData);\n};\n\nexport const bulkMailAccountAction = (action, domain, accounts = []) => {\n const formData = new FormData();\n formData.append(\"action\", action);\n formData.append(\"token\", getAuthToken());\n formData.append(\"domain\", domain);\n\n accounts.forEach(account => {\n formData.append(\"account[]\", account);\n });\n\n return axios.post(BASE_URL + '/api/v1/bulk/mail/', formData);\n};\n\nexport const handleAction = uri => {\n return axios.get(BASE_URL + uri, {\n params: {\n token: getAuthToken()\n }\n });\n}\n\nexport const addMail = data => {\n let formDataObject = new FormData();\n\n for (let key in data) {\n formDataObject.append(key, data[key]);\n }\n\n return axios.post(BASE_URL + addMailApiUri, formDataObject);\n}\n\nexport const addMailAccount = (data, domain) => {\n let formDataObject = new FormData();\n\n for (let key in data) {\n formDataObject.append(key, data[key]);\n }\n\n return axios.post(`${BASE_URL}${addMailApiUri}?domain=${domain}`, formDataObject);\n}\n\nexport const editMailAccount = (data, domain, account) => {\n let formDataObject = new FormData();\n\n for (let key in data) {\n formDataObject.append(key, data[key]);\n }\n\n return axios.post(`${BASE_URL}${updateMailUri}?domain=${domain}&account=${account}`, formDataObject);\n}\n\nexport const getMailInfo = domain => {\n return axios.get(BASE_URL + mailInfoUri, {\n params: {\n domain,\n token: getAuthToken()\n }\n });\n}\n\nexport const updateMail = (data, domain) => {\n let formDataObject = new FormData();\n\n for (let key in data) {\n formDataObject.append(key, data[key]);\n }\n\n return axios.post(BASE_URL + updateMailUri, formDataObject, {\n params: {\n domain,\n token: getAuthToken()\n }\n });\n}\n\nexport const mailInfoBlockSelectOptions = i18n => [\n {\n value: i18n['Use server hostname'],\n type: 'hostname',\n },\n {\n value: i18n['Use domain hostname'],\n type: 'domain',\n },\n {\n value: i18n['Use STARTTLS'],\n type: 'starttls',\n },\n {\n value: i18n['Use SSL / TLS'],\n type: 'ssl',\n },\n {\n value: i18n['No encryption'],\n type: 'no_encryption',\n }\n];","import React, { useEffect, useState } from 'react';\nimport { useSelector } from 'react-redux';\nimport { Link } from 'react-router-dom';\nimport { mailInfoBlockSelectOptions } from 'src/ControlPanelService/Mail';\n\nimport './MailInfoBlock.scss';\n\nexport default function MailInfoBlock({ webMail, hostName, domain, userName = '', password }) {\n const { i18n } = useSelector(state => state.session);\n const [selectedOption, setSelectedOption] = useState('');\n const [state, setState] = useState({\n imapHostName: hostName,\n smtpHostName: hostName,\n imapEncryption: i18n['STARTTLS'],\n smtpEncryption: i18n['STARTTLS'],\n imapPort: '143',\n smtpPort: '587',\n });\n\n useEffect(() => {\n if (selectedOption === 'hostname') {\n setState({ ...state, imapHostName: hostName, smtpHostName: hostName });\n } else if (selectedOption === \"domain\") {\n setState({ ...state, imapHostName: domain, smtpHostName: domain });\n } else if (selectedOption === \"starttls\") {\n setState({ ...state, imapPort: '143', imapEncryption: 'STARTTLS', smtpPort: '587', smtpEncryption: 'STARTTLS' });\n } else if (selectedOption === \"ssl\") {\n setState({ ...state, imapPort: '993', imapEncryption: 'SSL / TLS', smtpPort: '465', smtpEncryption: 'SSL / TLS' });\n } else if (selectedOption === \"no_encryption\") {\n setState({\n ...state,\n imapHostName: domain,\n smtpHostName: domain,\n imapPort: '143',\n smtpPort: '25',\n imapEncryption: i18n['No encryption'],\n smtpEncryption: i18n['No encryption']\n });\n }\n }, [selectedOption]);\n\n const renderSelectOptions = () => {\n const options = mailInfoBlockSelectOptions(i18n);\n return options.map(option =>\n {option.value} \n );\n }\n\n return (\n \n );\n}","import React, { useEffect, useState } from 'react';\n\nimport TextInputWithExtraButton from 'src/components/ControlPanel/AddItemLayout/Form/TextInputWithExtraButton/TextInputWithExtraButton';\nimport { addActiveElement, removeFocusedElement } from \"../../../actions/MainNavigation/mainNavigationActions\";\nimport TextInput from 'src/components/ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport Password from 'src/components/ControlPanel/AddItemLayout/Form/Password/Password';\nimport TextArea from 'src/components/ControlPanel/AddItemLayout/Form/TextArea/TextArea';\nimport Checkbox from 'src/components/ControlPanel/AddItemLayout/Form/Checkbox/Checkbox';\nimport { editMailAccount, getMailAccountInfo } from '../../../ControlPanelService/Mail';\nimport AddItemLayout from '../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport MailInfoBlock from '../MailInfoBlock/MailInfoBlock';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport Spinner from '../../Spinner/Spinner';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\nimport HtmlParser from 'react-html-parser';\n\nexport default function EditMailAccount(props) {\n const [autoreplyChecked, setAutoreplyChecked] = useState(false);\n const token = localStorage.getItem(\"token\");\n const { i18n } = useSelector(state => state.session);\n const dispatch = useDispatch();\n const history = useHistory();\n const [errorMessage, setErrorMessage] = useState('');\n const [okMessage, setOkMessage] = useState('');\n const [state, setState] = useState({\n data: {},\n quotaValue: '',\n loading: false,\n password: ''\n });\n\n useEffect(() => {\n dispatch(addActiveElement(`/list/mail/`));\n dispatch(removeFocusedElement());\n setState({ ...state, loading: true });\n\n fetchData();\n }, []);\n\n const submitFormHandler = event => {\n event.preventDefault();\n let newMailDomain = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n newMailDomain[name] = value;\n }\n\n newMailDomain['v_domain'] = props.domain;\n newMailDomain['v_account'] = props.account;\n newMailDomain['Password'] = newMailDomain['v_password'];\n\n if (Object.keys(newMailDomain).length !== 0 && newMailDomain.constructor === Object) {\n setState({ ...state, loading: true });\n editMailAccount(newMailDomain, props.domain, props.account)\n .then(result => {\n if (result.status === 200) {\n const { error_msg, ok_msg } = result.data;\n\n if (error_msg) {\n setErrorMessage(error_msg);\n setOkMessage('');\n } else {\n dispatch(refreshCounters()).then(() => {\n setErrorMessage('');\n setOkMessage(ok_msg);\n });\n }\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n const fetchData = () => {\n setState({ ...state, loading: true });\n\n getMailAccountInfo(props.domain, props.account)\n .then(response => {\n setState({\n ...state,\n data: response.data,\n loading: false\n });\n\n setAutoreplyChecked(response.data.autoreply === 'yes');\n })\n .catch(err => console.error(err));\n }\n\n const toggleQuota = () => {\n const value = state.data.quota === 'unlimited' ? '1000' : 'unlimited';\n setState({ ...state, data: { ...state.data, quota: value } });\n }\n\n const goBack = () => {\n history.push(`/list/mail/?domain=${props.domain}`);\n }\n\n return (\n \n
\n {`Vesta - ${i18n.MAIL}`} \n \n
\n
\n {i18n['Editing Mail Account']}
\n \n \n {errorMessage ? : ''}\n {errorMessage} \n
\n \n \n {okMessage ? : ''}\n {HtmlParser(okMessage)} \n \n
\n \n
\n {state.loading ? : (\n submitFormHandler(event)}>\n \n \n\n \n
\n
\n\n
setState({ ...state, password })} />\n\n \n \n \n \n \n\n \n\n \n\n \n\n setAutoreplyChecked(checked)}\n name=\"v_autoreply\"\n id=\"autoreply\" />\n\n {\n autoreplyChecked && (\n \n \n
\n )\n }\n\n \n \n\n
\n \n
\n
\n\n \n {i18n.Add} \n {i18n.Back} \n
\n \n )}\n \n
\n );\n}","import React, { useEffect, useState } from 'react';\nimport { addActiveElement, removeFocusedElement } from \"../../../actions/MainNavigation/mainNavigationActions\";\nimport TextInput from '../../ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport Checkbox from '../../ControlPanel/AddItemLayout/Form/Checkbox/Checkbox';\nimport { getMailInfo, updateMail } from '../../../ControlPanelService/Mail';\nimport AddItemLayout from '../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Spinner from '../../../components/Spinner/Spinner';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\nimport QS from 'qs';\n\nimport './EditMail.scss';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\nimport HtmlParser from 'react-html-parser';\n\nconst EditMail = props => {\n const token = localStorage.getItem(\"token\");\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const dispatch = useDispatch();\n const [errorMessage, setErrorMessage] = useState('');\n const [okMessage, setOkMessage] = useState('');\n const [state, setState] = useState({\n data: {},\n loading: false\n });\n\n useEffect(() => {\n let queryParams = QS.parse(history.location.search, { ignoreQueryPrefix: true });\n const { domain } = queryParams;\n\n dispatch(addActiveElement('/list/mail/'));\n dispatch(removeFocusedElement());\n\n if (domain) {\n setState({ ...state, loading: true });\n fetchData(domain);\n }\n }, []);\n\n const fetchData = domain => {\n getMailInfo(domain)\n .then(response => {\n setState({\n ...state,\n data: response.data,\n loading: false\n });\n })\n .catch(err => {\n setState({ ...state, loading: false });\n console.error(err);\n });\n }\n\n const submitFormHandler = event => {\n event.preventDefault();\n let updatedDomain = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n updatedDomain[name] = value;\n }\n\n updatedDomain['v_domain'] = state.data.domain;\n\n if (Object.keys(updatedDomain).length !== 0 && updatedDomain.constructor === Object) {\n setState({ ...state, loading: true });\n\n updateMail(updatedDomain, state.data.domain)\n .then(result => {\n if (result.status === 200) {\n const { error_msg, ok_msg } = result.data;\n\n if (error_msg) {\n setErrorMessage(error_msg);\n setOkMessage('');\n } else {\n dispatch(refreshCounters()).then(() => {\n setErrorMessage('');\n setOkMessage(ok_msg);\n });\n }\n }\n })\n .then(() => fetchData(state.data.domain))\n .catch(err => console.error(err));\n }\n }\n\n return (\n \n
\n {`Vesta - ${i18n.MAIL}`} \n \n
\n
\n {i18n['Editing Mail Domain']}
\n \n \n {errorMessage ? : ''} {errorMessage}\n \n
\n \n \n {okMessage ? : ''} {HtmlParser(okMessage)} \n \n
\n \n
\n {state.loading ? :\n submitFormHandler(event)} id=\"edit-mail\">\n \n \n\n \n\n \n\n \n\n \n\n \n\n \n {i18n.Save} \n history.push('/list/mail/')}>{i18n.Back} \n
\n\n \n }\n \n
\n );\n}\n\nexport default EditMail;","import React, { useEffect, useState } from 'react';\nimport EditMailAccount from 'src/components/MailAccount/Edit/EditMailAccount';\nimport EditMail from 'src/components/Mail/Edit/EditMail';\nimport { useHistory } from 'react-router-dom';\nimport QueryString from 'qs';\nimport { Helmet } from 'react-helmet';\nimport { useSelector } from 'react-redux';\n\nexport default function EditMailWrapper() {\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const parsedQueryString = QueryString.parse(history.location.search, { ignoreQueryPrefix: true });\n const [isMailAccount, setIsMailAccount] = useState(false);\n\n useEffect(() => {\n if (parsedQueryString.domain && parsedQueryString.account) {\n setIsMailAccount(true);\n } else {\n setIsMailAccount(false);\n }\n }, [history.location]);\n\n return (\n <>\n \n {`Vesta - ${i18n.MAIL}`} \n \n {\n isMailAccount\n ? \n : \n }\n >\n );\n}","import React, { useEffect, useState } from 'react';\nimport { addActiveElement, removeFocusedElement } from \"../../../../actions/MainNavigation/mainNavigationActions\";\nimport Checkbox from '../../../ControlPanel/AddItemLayout/Form/Checkbox/Checkbox';\nimport TextArea from '../../../ControlPanel/AddItemLayout/Form/TextArea/TextArea';\nimport AddItemLayout from '../../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { getServiceInfo, updateService } from 'src/ControlPanelService/Server';\nimport Spinner from '../../../../components/Spinner/Spinner';\nimport Toolbar from '../../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\n\nimport './Service.scss';\nimport { Helmet } from 'react-helmet';\nimport HtmlParser from 'react-html-parser';\n\nconst Service = ({ serviceName = '' }) => {\n const token = localStorage.getItem(\"token\");\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const dispatch = useDispatch();\n const [errorMessage, setErrorMessage] = useState('');\n const [okMessage, setOkMessage] = useState('');\n const [state, setState] = useState({\n data: {},\n loading: false\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/server/'));\n dispatch(removeFocusedElement());\n\n if (!serviceName) {\n history.push('/list/server');\n }\n\n setState({ ...state, loading: true });\n fetchData(serviceName);\n }, []);\n\n const fetchData = serviceName => {\n getServiceInfo(serviceName)\n .then(response => {\n const { config } = response.data;\n\n if (!config || config.includes(\"file doesn't exist\")) {\n history.push('/list/server');\n }\n\n setState({ ...state, data: response.data, loading: false });\n })\n .catch(err => console.error(err));\n }\n\n const submitFormHandler = event => {\n event.preventDefault();\n let updatedService = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n updatedService[name] = value;\n }\n\n if (Object.keys(updatedService).length !== 0 && updatedService.constructor === Object) {\n setState({ ...state, loading: true });\n\n updateService(updatedService, serviceName)\n .then(result => {\n if (result.status === 200) {\n const { error_msg, ok_msg } = result.data;\n\n setErrorMessage(error_msg || '');\n setOkMessage(ok_msg || '');\n }\n })\n .then(() => fetchData(serviceName))\n .catch(err => console.error(err));\n }\n }\n\n return (\n \n
\n {`Vesta - ${i18n.SERVER}`} \n \n
\n
\n \n {i18n['Configuring Server']} / {state.data.service_name}\n
\n \n \n {errorMessage ? : ''} {errorMessage}\n \n
\n \n \n {okMessage ? : ''} {HtmlParser(okMessage)} \n \n
\n \n
\n {state.loading ? :\n submitFormHandler(event)} id=\"edit-service\">\n \n \n\n \n\n \n\n \n\n \n {i18n.Save} \n history.push('/list/server/')}>{i18n.Back} \n
\n\n \n }\n \n
\n );\n}\n\nexport default Service;","import React, { useEffect, useState } from 'react';\n\nimport TextInputWithExtraButton from 'src/components/ControlPanel/AddItemLayout/Form/TextInputWithExtraButton/TextInputWithExtraButton';\nimport { addActiveElement, removeFocusedElement } from \"../../../actions/MainNavigation/mainNavigationActions\";\nimport TextInput from 'src/components/ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport Password from 'src/components/ControlPanel/AddItemLayout/Form/Password/Password';\nimport TextArea from 'src/components/ControlPanel/AddItemLayout/Form/TextArea/TextArea';\nimport Checkbox from 'src/components/ControlPanel/AddItemLayout/Form/Checkbox/Checkbox';\nimport AddItemLayout from '../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { addMailAccount, getMailList } from '../../../ControlPanelService/Mail';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport MailInfoBlock from '../MailInfoBlock/MailInfoBlock';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport Spinner from '../../Spinner/Spinner';\nimport { useDispatch, useSelector } from 'react-redux';\n\nimport './AddMailAccount.scss';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\nimport HtmlParser from 'react-html-parser';\n\nexport default function AddMailAccount(props) {\n const { i18n } = useSelector(state => state.session);\n const dispatch = useDispatch();\n const token = localStorage.getItem(\"token\");\n const history = useHistory();\n const [state, setState] = useState({\n data: {},\n advancedOptions: false,\n autoreplyChecked: false,\n quotaValue: '',\n loading: false,\n password: '',\n userName: '',\n okMessage: '',\n errorMessage: '',\n });\n\n useEffect(() => {\n dispatch(addActiveElement(`/list/mail/`));\n dispatch(removeFocusedElement());\n\n fetchData();\n }, []);\n\n const submitFormHandler = event => {\n event.preventDefault();\n let newMailDomain = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n newMailDomain[name] = value;\n }\n\n newMailDomain['ok_acc'] = 'add';\n newMailDomain['token'] = token;\n newMailDomain['v_domain'] = props.domain;\n newMailDomain['Password'] = newMailDomain['v_password'];\n\n if (Object.keys(newMailDomain).length !== 0 && newMailDomain.constructor === Object) {\n setState({ ...state, loading: true });\n addMailAccount(newMailDomain, props.domain)\n .then(result => {\n if (result.status === 200) {\n const { error_msg: errorMessage, ok_msg: okMessage } = result.data;\n\n if (errorMessage) {\n setState({ ...state, errorMessage, okMessage, loading: false });\n } else {\n dispatch(refreshCounters()).then(() => {\n setState({ ...state, okMessage, errorMessage: '', loading: false });\n });\n }\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n const fetchData = () => {\n setState({ ...state, loading: true });\n\n getMailList()\n .then(response => {\n setState({\n ...state,\n data: response.data,\n errorMessage: response.data['error_msg'],\n okMessage: response.data['ok_msg'],\n loading: false\n });\n })\n .catch(err => console.error(err));\n }\n\n const toggleOptions = () => {\n setState({ ...state, advancedOptions: !state.advancedOptions });\n }\n\n const toggleQuotaValue = () => {\n if (state.quotaValue !== 'unlimited') {\n setState({ ...state, quotaValue: 'unlimited' });\n } else {\n setState({ ...state, quotaValue: '' });\n }\n }\n\n return (\n \n
\n {`Vesta - ${i18n.MAIL}`} \n \n
\n
\n {i18n['Adding Mail Account']}
\n \n \n {state.errorMessage ? : ''}\n {state.errorMessage} \n
\n \n \n {state.okMessage ? : ''}\n {HtmlParser(state.okMessage)} \n \n
\n \n
\n {state.loading ? : (\n submitFormHandler(event)}>\n \n
\n
\n\n
setState({ ...state, username: e.target.value })}\n name=\"v_account\"\n id=\"account\" />\n\n setState({ ...state, password })} />\n \n\n
\n \n
\n
\n\n \n \n {i18n['Advanced options']}\n {state.advancedOptions ? : }\n \n\n {\n state.advancedOptions && (\n <>\n \n \n \n \n \n\n \n\n \n\n \n >\n )\n }\n\n \n
\n\n \n {i18n.Add} \n history.push(`/list/mail/?domain=${props.domain}`)}>{i18n.Back} \n
\n \n )}\n \n
\n );\n}","import React, { useEffect, useState } from 'react';\n\nimport { addActiveElement, removeFocusedElement } from \"../../../actions/MainNavigation/mainNavigationActions\";\nimport AddItemLayout from '../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { addMail } from '../../../ControlPanelService/Mail';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport Spinner from '../../Spinner/Spinner';\nimport { useDispatch, useSelector } from 'react-redux';\n\nimport './AddMail.scss'\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\nimport HtmlParser from 'react-html-parser';\n\nconst AddMail = props => {\n const { i18n } = useSelector(state => state.session);\n const dispatch = useDispatch();\n const token = localStorage.getItem(\"token\");\n const history = useHistory();\n const [state, setState] = useState({\n loading: false,\n antiSpamChecked: true,\n antiVirusChecked: true,\n dkimChecked: true,\n okMessage: '',\n errorMessage: '',\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/mail/'));\n dispatch(removeFocusedElement());\n }, []);\n\n const submitFormHandler = event => {\n event.preventDefault();\n let newMailDomain = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n newMailDomain[name] = value;\n }\n\n if (Object.keys(newMailDomain).length !== 0 && newMailDomain.constructor === Object) {\n setState({ ...state, loading: true });\n addMail(newMailDomain)\n .then(result => {\n if (result.status === 200) {\n const { error_msg: errorMessage, ok_msg: okMessage } = result.data;\n\n if (errorMessage) {\n setState({ ...state, errorMessage, okMessage, loading: false });\n } else {\n dispatch(refreshCounters()).then(() => {\n setState({ ...state, okMessage, errorMessage: '', loading: false });\n });\n }\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n return (\n \n
\n {`Vesta - ${i18n.MAIL}`} \n \n
\n
\n {i18n['Adding Mail Domain']}
\n \n \n {state.errorMessage ? : ''}\n {state.errorMessage} \n
\n \n \n {state.okMessage ? : ''}\n {HtmlParser(state.okMessage)} \n \n
\n \n
\n {state.loading ? : (\n submitFormHandler(event)}>\n \n \n\n \n {i18n.Domain} \n \n
\n\n \n
\n setState({ ...state, antiSpamChecked: event.target.checked })}\n checked={state.antiSpamChecked} />\n {i18n['AntiSpam Support']} \n
\n
\n\n \n
\n setState({ ...state, antiVirusChecked: event.target.checked })}\n checked={state.antiVirusChecked} />\n {i18n['AntiVirus Support']} \n
\n
\n\n \n
\n setState({ ...state, dkimChecked: event.target.checked })}\n checked={state.dkimChecked} />\n {i18n['DKIM Support']} \n
\n
\n\n \n {i18n.Add} \n history.push('/list/mail/')}>{i18n.Back} \n
\n \n )}\n \n
\n );\n}\n\nexport default AddMail;","import React, { useEffect, useState } from 'react';\nimport AddMailAccount from 'src/components/MailAccount/Add/AddMailAccount';\nimport AddMail from 'src/components/Mail/Add/AddMail';\nimport { useHistory } from 'react-router-dom';\nimport QueryString from 'qs';\nimport { Helmet } from 'react-helmet';\nimport { useSelector } from 'react-redux';\n\nexport default function AddMailWrapper() {\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const [domain, setDomain] = useState(false);\n\n useEffect(() => {\n const parsedQueryString = QueryString.parse(history.location.search, { ignoreQueryPrefix: true });\n\n if (parsedQueryString.domain) {\n setDomain(parsedQueryString.domain);\n } else {\n setDomain('');\n }\n }, [history.location]);\n\n return (\n <>\n \n {`Vesta - ${i18n.MAIL}`} \n \n {\n domain\n ? \n : \n }\n >\n );\n}","import axios from \"axios\";\nimport { getAuthToken } from \"src/utils/token\";\n\nconst updateDNSUri = '/api/v1/edit/dns/index.php';\nconst addDnsApiUri = '/api/v1/add/dns/index.php';\nconst dNSInfoUri = '/api/v1/edit/dns/index.php';\nconst BASE_URL = window.location.origin;\nconst dnsApiUri = '/api/v1/list/dns/index.php';\n\nexport const getDnsList = () => {\n return axios.get(BASE_URL + dnsApiUri);\n}\n\nexport const getDNSRecordsList = domain => {\n return axios.get(`${BASE_URL}${dnsApiUri}?domain=${domain}`);\n}\n\nexport const getDNSRecordInfo = (domain, recordId) => {\n return axios.get(`${BASE_URL}${updateDNSUri}?domain=${domain}&record_id=${recordId}`);\n}\n\nexport const bulkDomainAction = (action, domains) => {\n const formData = new FormData();\n formData.append(\"action\", action);\n formData.append(\"token\", getAuthToken());\n\n domains.forEach(record => {\n formData.append(\"domain[]\", record);\n });\n\n return axios.post(BASE_URL + '/api/v1/bulk/dns/', formData);\n};\n\nexport const bulkAction = (action, records, domain) => {\n const formData = new FormData();\n formData.append(\"action\", action);\n formData.append(\"token\", getAuthToken());\n formData.append(\"domain\", domain);\n\n records.forEach(record => {\n formData.append(\"record[]\", record);\n });\n\n return axios.post(BASE_URL + '/api/v1/bulk/dns/', formData);\n};\n\nexport const handleAction = uri => {\n return axios.get(BASE_URL + uri, {\n params: {\n token: getAuthToken()\n }\n });\n}\n\nexport const addDomainNameSystem = data => {\n let formDataObject = new FormData();\n\n for (let key in data) {\n formDataObject.append(key, data[key]);\n }\n\n return axios.post(BASE_URL + addDnsApiUri, formDataObject);\n}\n\nexport const addDomainNameSystemRecord = data => {\n let formDataObject = new FormData();\n\n for (let key in data) {\n formDataObject.append(key, data[key]);\n }\n\n return axios.post(BASE_URL + addDnsApiUri, formDataObject);\n}\n\nexport const getDNSInfo = domain => {\n return axios.get(BASE_URL + dNSInfoUri, {\n params: {\n domain,\n token: getAuthToken()\n }\n });\n}\n\nexport const updateDNS = (data, domain, recordId) => {\n let formDataObject = new FormData();\n\n for (let key in data) {\n formDataObject.append(key, data[key]);\n }\n\n return axios.post(BASE_URL + updateDNSUri, formDataObject, {\n params: {\n domain,\n record_id: recordId,\n token: getAuthToken()\n }\n });\n}","import React, { useEffect, useState } from 'react';\nimport { addActiveElement, removeFocusedElement } from \"../../../actions/MainNavigation/mainNavigationActions\";\nimport SelectInput from '../../ControlPanel/AddItemLayout/Form/SelectInput/SelectInput';\nimport TextInput from '../../ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport AddItemLayout from '../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { getDNSInfo, updateDNS } from '../../../ControlPanelService/Dns';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Spinner from '../../../components/Spinner/Spinner';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\nimport QS from 'qs';\n\nimport './EditDomainNameSystem.scss';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\nimport HtmlParser from 'react-html-parser';\n\nconst EditDomainNameSystem = props => {\n const token = localStorage.getItem(\"token\");\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const dispatch = useDispatch();\n const [errorMessage, setErrorMessage] = useState('');\n const [okMessage, setOkMessage] = useState('');\n const [state, setState] = useState({\n data: {},\n loading: false\n });\n\n useEffect(() => {\n let queryParams = QS.parse(history.location.search, { ignoreQueryPrefix: true });\n const { domain } = queryParams;\n\n dispatch(addActiveElement('/list/dns/'));\n dispatch(removeFocusedElement());\n\n if (domain) {\n setState({ ...state, loading: true });\n fetchData(domain);\n }\n }, []);\n\n const fetchData = domain => {\n getDNSInfo(domain)\n .then(response => {\n setState({\n ...state,\n data: response.data,\n loading: false\n });\n })\n .catch(err => {\n setState({ ...state, loading: false });\n console.error(err)\n });\n }\n\n const submitFormHandler = event => {\n event.preventDefault();\n let updatedDomain = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n updatedDomain[name] = value;\n }\n\n updatedDomain['v_domain'] = state.data.domain;\n\n if (Object.keys(updatedDomain).length !== 0 && updatedDomain.constructor === Object) {\n setState({ ...state, loading: true });\n\n updateDNS(updatedDomain, state.data.domain)\n .then(result => {\n if (result.status === 200) {\n const { error_msg, ok_msg } = result.data;\n\n if (error_msg) {\n setErrorMessage(error_msg);\n setOkMessage('');\n } else {\n dispatch(refreshCounters()).then(() => {\n setErrorMessage('');\n setOkMessage(ok_msg);\n });\n }\n }\n })\n .then(() => fetchData(state.data.domain))\n .catch(err => console.error(err));\n }\n }\n\n return (\n \n
\n {`Vesta - ${i18n.DNS}`} \n \n
\n
\n {i18n['Editing DNS Domain']}
\n \n \n {errorMessage ? : ''} {errorMessage}\n \n
\n \n \n {okMessage ? : ''} {HtmlParser(okMessage)} \n \n
\n \n
\n {state.loading ? :\n submitFormHandler(event)} id=\"edit-dns\">\n \n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n {i18n.Save} \n history.push('/list/dns/')}>{i18n.Back} \n
\n\n \n }\n \n
\n );\n}\n\nexport default EditDomainNameSystem;","import React, { useEffect, useState } from 'react';\nimport { addActiveElement, removeFocusedElement } from \"../../../actions/MainNavigation/mainNavigationActions\";\nimport SelectInput from 'src/components/ControlPanel/AddItemLayout/Form/SelectInput/SelectInput';\nimport TextInput from '../../ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport AddItemLayout from '../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { updateDNS, getDNSRecordInfo } from 'src/ControlPanelService/Dns';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Spinner from '../../../components/Spinner/Spinner';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\nimport QS from 'qs';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\nimport HtmlParser from 'react-html-parser';\n\nexport default function EditDNSRecord(props) {\n const token = localStorage.getItem(\"token\");\n const { i18n } = useSelector(state => state.session);\n const dispatch = useDispatch();\n const history = useHistory();\n const [errorMessage, setErrorMessage] = useState('');\n const [okMessage, setOkMessage] = useState('');\n const [state, setState] = useState({\n data: {},\n selectOptions: [\n 'A',\n 'AAAA',\n 'NS',\n 'CNAME',\n 'MX',\n 'TXT',\n 'SRV',\n 'DNSKEY',\n 'KEY',\n 'IPSECKEY',\n 'PTR',\n 'SPF',\n 'TLSA',\n 'CAA'\n ],\n loading: false\n });\n\n useEffect(() => {\n const { domain, record_id } = props;\n\n dispatch(addActiveElement('/list/dns/'));\n dispatch(removeFocusedElement());\n\n if (domain && record_id) {\n setState({ ...state, loading: true });\n fetchData(domain, record_id);\n }\n }, []);\n\n const fetchData = (domain, record_id) => {\n getDNSRecordInfo(domain, record_id)\n .then(response => {\n setState({\n ...state,\n data: response.data,\n loading: false\n });\n })\n .catch(err => console.error(err));\n }\n\n const submitFormHandler = event => {\n event.preventDefault();\n let updatedRecord = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n updatedRecord[name] = value;\n }\n\n updatedRecord['v_domain'] = state.data.domain;\n updatedRecord['v_record_id'] = props.record_id;\n updatedRecord['v_type'] = state.data.type;\n\n if (Object.keys(updatedRecord).length !== 0 && updatedRecord.constructor === Object) {\n setState({ ...state, loading: true });\n\n updateDNS(updatedRecord, props.domain, props.record_id)\n .then(result => {\n if (result.status === 200) {\n const { error_msg, ok_msg } = result.data;\n\n if (error_msg) {\n setOkMessage('');\n setErrorMessage(error_msg);\n } else {\n dispatch(refreshCounters()).then(() => {\n setOkMessage(ok_msg);\n setErrorMessage('');\n });\n }\n }\n })\n .then(() => fetchData(props.domain, props.record_id))\n .catch(err => console.error(err));\n }\n }\n\n return (\n \n
\n {`Vesta - ${i18n.DNS}`} \n \n
\n
\n {i18n['Editing DNS Record']}
\n \n \n {errorMessage ? : ''} {errorMessage}\n \n
\n \n \n {okMessage ? : ''} {HtmlParser(okMessage)} \n \n
\n \n
\n {state.loading ? :\n submitFormHandler(event)} id=\"edit-dns-rec\">\n \n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n {i18n.Save} \n history.push(`/list/dns?domain=${props.domain}`)}>{i18n.Back} \n
\n\n \n }\n \n
\n );\n}","import React, { useEffect, useState } from 'react';\nimport EditDomainNameSystem from 'src/components/DomainNameSystem/Edit/EditDomainNameSystem';\nimport EditDNSRecord from 'src/components/DNSRecord/Edit/EditDNSRecord';\nimport { useHistory } from 'react-router-dom';\nimport QueryString from 'qs';\nimport { Helmet } from 'react-helmet';\nimport { useSelector } from 'react-redux';\n\nexport default function EditDNSWrapper() {\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const parsedQueryString = QueryString.parse(history.location.search, { ignoreQueryPrefix: true });\n const [isDnsRecord, setIsDnsRecord] = useState(false);\n\n useEffect(() => {\n if (parsedQueryString.domain && parsedQueryString.record_id) {\n setIsDnsRecord(true);\n } else {\n setIsDnsRecord(false);\n }\n }, [history.location]);\n\n return (\n <>\n \n {`Vesta - ${i18n.DNS}`} \n \n {\n isDnsRecord\n ? \n : \n }\n >\n );\n}","import React, { useEffect, useState } from 'react';\nimport { useSelector } from 'react-redux';\nimport { Link } from 'react-router-dom';\nimport Checkbox from '../../../ControlPanel/AddItemLayout/Form/Checkbox/Checkbox';\nimport SelectInput from '../../../ControlPanel/AddItemLayout/Form/SelectInput/SelectInput';\nimport TextArea from '../../../ControlPanel/AddItemLayout/Form/TextArea/TextArea';\n\nimport './SslSupport.scss';\n\nconst SslSupport = props => {\n const { i18n } = useSelector(state => state.session);\n const [letsEncrypt, setLetsEncrypt] = useState(false);\n const [sslHomeOptions, setSslHomeOptions] = useState(['public_html', 'public_shtml']);\n\n useEffect(() => {\n setLetsEncrypt(props.letsEncrypt);\n }, []);\n\n const onChangeLetsEncrypt = checked => {\n setLetsEncrypt(checked);\n }\n\n return (\n \n
\n\n
\n\n
/ {i18n['Generate CSR']}>)\n : ''\n } />\n\n \n\n \n\n \n {\n props.sslSubject.length > 0\n && (\n
\n {i18n['SUBJECT']}: \n {props.sslSubject} \n
\n )\n }\n\n {\n props.sslAliases.length > 0\n && (\n
\n {i18n['ALIASES']}: \n {props.sslAliases} \n
\n )\n }\n\n {\n props.sslNotBefore.length > 0\n && (\n
\n {i18n['NOT_BEFORE']}: \n {props.sslNotBefore} \n
\n )\n }\n\n {\n props.sslNotAfter.length > 0\n && (\n
\n {i18n['NOT_AFTER']}: \n {props.sslNotAfter} \n
\n )\n }\n\n {\n props.sslSignature.length > 0\n && (\n
\n {i18n['SIGNATURE']}: \n {props.sslSignature} \n
\n )\n }\n\n {\n props.sslPubKey.length > 0\n && (\n
\n {i18n['PUB_KEY']}: \n {props.sslPubKey} \n
\n )\n }\n\n {\n props.sslIssuer.length > 0\n && (\n
\n {i18n['ISSUER']}: \n {props.sslIssuer} \n
\n )\n }\n
\n\n \n \n \n );\n}\n\nexport default SslSupport;","import React, { useEffect, useState } from 'react';\nimport { addActiveElement, removeFocusedElement } from \"../../../actions/MainNavigation/mainNavigationActions\";\nimport { updateWebDomain, getDomainInfo } from '../../../ControlPanelService/Web';\nimport Password from '../../../components/ControlPanel/AddItemLayout/Form/Password/Password';\nimport SelectInput from '../../ControlPanel/AddItemLayout/Form/SelectInput/SelectInput';\nimport AdditionalFtpWrapper from '../Add/AdditionalFtpWrapper/AdditionalFtpWrapper';\nimport TextInput from '../../ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport Checkbox from '../../ControlPanel/AddItemLayout/Form/Checkbox/Checkbox';\nimport AddItemLayout from '../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Spinner from '../../../components/Spinner/Spinner';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport SslSupport from './SslSupport/SslSupport';\nimport { useHistory } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\nimport QS from 'qs';\n\nimport './EditWeb.scss';\nimport TextArea from '../../ControlPanel/AddItemLayout/Form/TextArea/TextArea';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\nimport HtmlParser from 'react-html-parser';\n\nconst EditWeb = props => {\n const token = localStorage.getItem(\"token\");\n const { i18n } = useSelector(state => state.session);\n const { session } = useSelector(state => state.userSession);\n const history = useHistory();\n const dispatch = useDispatch();\n const [errorMessage, setErrorMessage] = useState('');\n const [okMessage, setOkMessage] = useState('');\n const [state, setState] = useState({\n data: {},\n domain: '',\n webStat: '',\n sslSupport: false,\n letsEncrypt: false,\n additionalFtp: false,\n proxySupport: false,\n statAuth: false,\n loading: false\n });\n\n useEffect(() => {\n let queryParams = QS.parse(history.location.search, { ignoreQueryPrefix: true });\n const { domain } = queryParams;\n\n dispatch(addActiveElement('/list/web/'));\n dispatch(removeFocusedElement());\n\n if (domain) {\n setState({ ...state, loading: true });\n fetchData(domain);\n }\n }, []);\n\n const fetchData = domain => {\n getDomainInfo(domain)\n .then(response => {\n setState({\n ...state,\n domain,\n webStat: response.data.v_stats ? response.data.v_stats : 'none',\n sslSupport: response.data.ssl === 'yes',\n letsEncrypt: response.data.letsencrypt === 'yes',\n proxySupport: !!response.data.proxy,\n data: response.data,\n additionalFtp: !!response.data.ftp_user,\n statAuth: response.data.stats_user,\n loading: false\n });\n })\n .catch(err => console.error(err));\n }\n\n const submitFormHandler = event => {\n event.preventDefault();\n let updatedDomain = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n updatedDomain[name] = value;\n }\n\n updatedDomain['v_domain'] = state.domain;\n\n if (updatedDomain['v_ssl'] === 'on') {\n updatedDomain['v_ssl'] = 'yes';\n }\n\n if (Object.keys(updatedDomain).length !== 0 && updatedDomain.constructor === Object) {\n setState({ ...state, loading: true });\n\n updateWebDomain(updatedDomain, state.domain)\n .then(result => {\n if (result.status === 200) {\n const { error_msg, ok_msg } = result.data;\n\n if (error_msg) {\n setErrorMessage(error_msg);\n setOkMessage('');\n setState({ ...state, loading: false });\n } else {\n dispatch(refreshCounters()).then(() => {\n setErrorMessage('');\n setOkMessage(ok_msg);\n fetchData(state.domain);\n });\n }\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n const formatData = object => {\n let result = [];\n\n for (let i in object) {\n result.push(i);\n }\n\n return result;\n }\n\n const onChangeSslSupport = checked => {\n setState({ ...state, sslSupport: checked });\n }\n\n const onChangeProxySupport = checked => {\n setState({ ...state, proxySupport: checked });\n }\n\n const onChangeWebStats = webStat => {\n setState({ ...state, webStat });\n }\n\n const onChangeStatisticsAuth = statAuth => {\n setState({ ...state, statAuth });\n }\n\n const onChangeAdditionalFtp = additionalFtp => {\n setState({ ...state, additionalFtp });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.WEB}`} \n \n
\n
\n {i18n['Editing Domain']}
\n {errorMessage ? : ''} {errorMessage}
\n \n {okMessage ? : ''} {HtmlParser(okMessage)} \n
\n \n
\n {state.loading ? :\n submitFormHandler(event)} id=\"add-web\">\n \n \n\n \n\n \n\n \n\n \n\n {\n session.WEB_BACKEND && (\n \n )\n }\n\n {\n state.data.proxy_system && (\n <>\n \n\n {\n state.proxySupport && (\n \n\n \n
)\n }\n >\n )\n }\n\n \n\n {\n state.sslSupport && (\n \n )\n }\n\n \n\n {\n state.webStat !== 'none' && (\n \n
\n\n {\n state.statAuth && (\n <>\n
\n\n
\n >\n )\n }\n
\n )\n }\n\n \n\n onChangeAdditionalFtp(false)} />\n\n \n {i18n.Save} \n history.push('/list/web/')}>{i18n.Back} \n
\n\n \n }\n \n
\n );\n}\n\nexport default EditWeb;\n","import React, { useEffect, useState } from 'react';\nimport { addActiveElement, removeFocusedElement } from \"../../../../actions/MainNavigation/mainNavigationActions\";\nimport TextInput from '../../../ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport Checkbox from '../../../ControlPanel/AddItemLayout/Form/Checkbox/Checkbox';\nimport TextArea from '../../../ControlPanel/AddItemLayout/Form/TextArea/TextArea';\nimport { getServiceInfo, updateService } from 'src/ControlPanelService/Server';\nimport AddItemLayout from '../../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Spinner from '../../../../components/Spinner/Spinner';\nimport Toolbar from '../../../MainNav/Toolbar/Toolbar';\nimport { Link, useHistory } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\n\nimport './EditPhp.scss';\nimport { Helmet } from 'react-helmet';\nimport HtmlParser from 'react-html-parser';\n\nconst EditPhp = ({ serviceName = '' }) => {\n const token = localStorage.getItem(\"token\");\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const dispatch = useDispatch();\n const [errorMessage, setErrorMessage] = useState('');\n const [okMessage, setOkMessage] = useState('');\n const [restart, setRestart] = useState(true);\n const [state, setState] = useState({\n data: {},\n loading: false,\n basicOptions: true,\n advancedOptions: false\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/server/'));\n dispatch(removeFocusedElement());\n\n if (!serviceName) {\n history.push('/list/server');\n }\n\n setState({ ...state, loading: true });\n fetchData();\n }, []);\n\n const fetchData = () => {\n getServiceInfo(serviceName)\n .then(response => {\n setState({\n ...state,\n data: response.data,\n loading: false\n });\n })\n .catch(err => {\n setState({ ...state, loading: false });\n console.error(err);\n });\n }\n\n const submitFormHandler = event => {\n event.preventDefault();\n let updatedService = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n updatedService[name] = value;\n }\n\n if (Object.keys(updatedService).length !== 0 && updatedService.constructor === Object) {\n setState({ ...state, loading: true });\n\n updatedService['v_config'] = state.data.config;\n updatedService['v_restart'] = restart ? 'yes' : 'no';\n\n updateService(updatedService, `/${serviceName}`)\n .then(result => {\n if (result.status === 200) {\n const { error_msg, ok_msg } = result.data;\n\n setErrorMessage(error_msg || '');\n setOkMessage(ok_msg || '');\n }\n })\n .then(() => fetchData())\n .catch(err => console.error(err));\n }\n }\n\n const toggleOptions = () => {\n setState({\n ...state,\n advancedOptions: !state.advancedOptions,\n basicOptions: !state.basicOptions\n });\n }\n\n const onUpdateConfig = ({ id, value }) => {\n if (!value) return;\n\n var regexp = new RegExp(`(${id})(.+)(${state.data[id]})`, 'gm');\n const updatedConfig = state.data.config.replace(regexp, `$1$2${value}`);\n setState({ ...state, data: { ...state.data, config: updatedConfig, [id]: value } });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.SERVER}`} \n \n
\n
\n {i18n['Configuring Server']} / {state.data.web_system}
\n {i18n['Configure']} php.ini
\n \n \n {errorMessage ? : ''} {errorMessage}\n \n
\n \n \n {okMessage ? : ''} {HtmlParser(okMessage)} \n \n
\n \n
\n {state.loading ? :\n submitFormHandler(event)} id=\"edit-mail\">\n \n \n\n {\n !state.basicOptions && (\n toggleOptions()}>\n {i18n['Basic options']}\n {state.basicOptions ? : }\n \n )\n }\n\n {\n state.basicOptions && (\n <>\n onUpdateConfig(event.target)}\n value={parseInt(state.data.max_execution_time)} />\n\n onUpdateConfig(event.target)}\n value={parseInt(state.data.max_input_time)} />\n\n onUpdateConfig(event.target)}\n value={parseInt(state.data.memory_limit)} />\n\n onUpdateConfig(event.target)}\n value={state.data.error_reporting} />\n\n onUpdateConfig(event.target)}\n value={state.data.display_errors} />\n\n onUpdateConfig(event.target)}\n value={state.data.post_max_size} />\n\n onUpdateConfig(event.target)}\n value={state.data.upload_max_filesize} />\n >\n )\n }\n\n {\n !state.advancedOptions && (\n toggleOptions()}>\n {i18n['Advanced options']}\n {state.advancedOptions ? : }\n \n )\n }\n\n \n \n\n {\n state.advancedOptions && (\n <>\n setState({ ...state, data: { ...state.data, config: e.target.value } })}\n defaultValue={state.data.config}\n title={state.data.config_path}\n name=\"v_config\"\n id=\"v_config\"\n rows=\"25\" />\n\n \n\n setRestart(checked)}\n name=\"v_restart\"\n id=\"restart\" />\n >\n )\n }\n\n \n {i18n.Save} \n history.push('/list/server/')}>{i18n.Back} \n
\n\n \n }\n \n
\n );\n}\n\nexport default EditPhp;","import React from 'react';\nimport ListItem from '../ControlPanel/ListItem/ListItem';\nimport Container from '../ControlPanel/Container/Container';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { Link } from 'react-router-dom';\nimport { useSelector } from 'react-redux';\n\nconst Database = props => {\n const { data } = props;\n const { i18n } = useSelector(state => state.session);\n const token = localStorage.getItem(\"token\");\n\n const toggleFav = (starred) => {\n if (starred) {\n props.toggleFav(data.NAME, 'add');\n } else {\n props.toggleFav(data.NAME, 'delete');\n }\n }\n\n const checkItem = () => {\n props.checkItem(data.NAME);\n }\n\n const handleSuspend = () => {\n let suspendedStatus = data.SUSPENDED === 'yes' ? 'unsuspend' : 'suspend' === 'yes' ? 'unsuspend' : 'suspend';\n props.handleModal(data.suspend_conf, `/api/v1/${suspendedStatus}/db/index.php?database=${data.NAME}`);\n }\n\n const handleDelete = () => {\n props.handleModal(data.delete_conf, `/api/v1/delete/db/index.php?database=${data.NAME}`);\n }\n\n return (\n \n\n \n {data.DATABASE}
\n \n \n
\n {i18n.Disk}: {data.U_DISK} {i18n.mb}
\n \n
\n {i18n.User}: {data.DBUSER}
\n {i18n.Charset}: {data.CHARSET}
\n \n
\n {i18n.Host}: {data.HOST}
\n {i18n.Type}: {data.TYPE}
\n \n
\n \n \n
\n \n {i18n.edit}\n {data.FOCUSED ? ↩ : }\n \n
\n\n
\n handleSuspend()}>\n {i18n[data.suspend_action]}\n {data.FOCUSED ? S : }\n \n
\n\n
\n handleDelete()}>\n {i18n.Delete}\n {data.FOCUSED ? Del : }\n \n
\n
\n \n );\n}\n\nexport default Database;","import React, { useState, useEffect } from 'react';\nimport { addControlPanelContentFocusedElement, removeControlPanelContentFocusedElement } from '../../actions/ControlPanelContent/controlPanelContentActions';\nimport { addActiveElement, removeFocusedElement } from '../../actions/MainNavigation/mainNavigationActions';\nimport DropdownFilter from '../../components/MainNav/Toolbar/DropdownFilter/DropdownFilter';\nimport { bulkAction, getDatabaseList, handleAction } from '../../ControlPanelService/Db';\nimport * as MainNavigation from '../../actions/MainNavigation/mainNavigationActions';\nimport SearchInput from '../../components/MainNav/Toolbar/SearchInput/SearchInput';\nimport { addFavorite, deleteFavorite } from '../../ControlPanelService/Favorites';\nimport LeftButton from '../../components/MainNav/Toolbar/LeftButton/LeftButton';\nimport Checkbox from '../../components/MainNav/Toolbar/Checkbox/Checkbox';\nimport Select from '../../components/MainNav/Toolbar/Select/Select';\nimport Toolbar from '../../components/MainNav/Toolbar/Toolbar';\nimport Modal from '../../components/ControlPanel/Modal/Modal';\nimport Database from '../../components/Database/Database';\nimport { useSelector, useDispatch } from 'react-redux';\nimport Spinner from '../../components/Spinner/Spinner';\nimport './Databases.scss';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\n\nconst Databases = props => {\n const { i18n } = useSelector(state => state.session);\n const { controlPanelFocusedElement } = useSelector(state => state.controlPanelContent);\n const { focusedElement } = useSelector(state => state.mainNavigation);\n const dispatch = useDispatch();\n const [loading, setLoading] = useState(false);\n const [modal, setModal] = useState({\n text: '',\n visible: false,\n actionUrl: '',\n });\n const [state, setState] = useState({\n databases: [],\n dbFav: [],\n toggledAll: false,\n dbAdmin: '',\n dbAdminLink: '',\n sorting: i18n.Date,\n order: \"descending\",\n selection: [],\n totalAmount: ''\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/db/'));\n dispatch(removeFocusedElement());\n dispatch(removeControlPanelContentFocusedElement());\n fetchData().then(() => setLoading(false));\n\n return () => {\n dispatch(removeControlPanelContentFocusedElement());\n }\n }, []);\n\n useEffect(() => {\n window.addEventListener(\"keydown\", handleContentSelection);\n window.addEventListener(\"keydown\", handleFocusedElementShortcuts);\n\n return () => {\n window.removeEventListener(\"keydown\", handleContentSelection);\n window.removeEventListener(\"keydown\", handleFocusedElementShortcuts);\n };\n }, [controlPanelFocusedElement, focusedElement, state.databases]);\n\n const handleContentSelection = event => {\n if (event.keyCode === 38 || event.keyCode === 40) {\n if (focusedElement) {\n dispatch(MainNavigation.removeFocusedElement());\n }\n }\n\n if (event.keyCode === 38) {\n event.preventDefault();\n handleArrowUp();\n } else if (event.keyCode === 40) {\n event.preventDefault();\n handleArrowDown();\n }\n }\n\n const initFocusedElement = databases => {\n databases[0]['FOCUSED'] = databases[0]['NAME'];\n setState({ ...state, databases });\n dispatch(addControlPanelContentFocusedElement(databases[0]['NAME']));\n }\n\n const handleArrowDown = () => {\n let databases = [...state.databases];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(databases);\n return;\n }\n\n let focusedElementPosition = databases.findIndex(database => database.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== databases.length - 1) {\n let nextFocusedElement = databases[focusedElementPosition + 1];\n databases[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, databases });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleArrowUp = () => {\n let databases = [...state.databases];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(databases);\n return;\n }\n\n let focusedElementPosition = databases.findIndex(database => database.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== 0) {\n let nextFocusedElement = databases[focusedElementPosition - 1];\n databases[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, databases });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleFocusedElementShortcuts = event => {\n let isSearchInputFocused = document.querySelector('input:focus') || document.querySelector('textarea:focus');\n\n if (controlPanelFocusedElement && !isSearchInputFocused) {\n switch (event.keyCode) {\n case 8: return handleDelete();\n case 13: return handleEdit();\n case 83: return handleSuspend();\n default: break;\n }\n }\n }\n\n const handleEdit = () => {\n props.history.push(`/edit/database?domain=${controlPanelFocusedElement}`);\n }\n\n const handleSuspend = () => {\n const { databases } = state;\n let currentDatabaseData = databases.filter(database => database.NAME === controlPanelFocusedElement)[0];\n let suspendedStatus = currentDatabaseData.SUSPENDED === 'yes' ? 'unsuspend' : 'suspend';\n\n displayModal(currentDatabaseData.suspend_conf, `/api/v1/${suspendedStatus}/database/index.php?domain=${controlPanelFocusedElement}`);\n }\n\n const handleDelete = () => {\n const { databases } = state;\n let currentDatabaseData = databases.filter(database => database.NAME === controlPanelFocusedElement)[0];\n\n displayModal(currentDatabaseData.delete_conf, `/api/v1/delete/database/index.php?domain=${controlPanelFocusedElement}`);\n }\n\n const fetchData = () => {\n setLoading(true);\n return new Promise((resolve, reject) => {\n getDatabaseList()\n .then(result => {\n setState({\n ...state,\n databases: reformatData(result.data.data),\n dbAdmin: result.data.db_admin,\n dbAdminLink: result.data.db_admin_link,\n dbFav: result.data.dbFav,\n selection: [],\n toggledAll: false,\n totalAmount: result.data.totalAmount\n });\n resolve();\n })\n .catch(err => console.error(err));\n });\n }\n\n const reformatData = data => {\n let databases = [];\n\n for (let i in data) {\n data[i]['NAME'] = i;\n data[i]['FOCUSED'] = controlPanelFocusedElement === i;\n databases.push(data[i]);\n }\n\n return databases;\n }\n\n const changeSorting = (sorting, order) => {\n setState({\n ...state,\n sorting,\n order\n });\n }\n\n const databases = () => {\n const { databases } = state;\n const result = [];\n const dbFav = { ...state.dbFav };\n\n databases.forEach(database => {\n database.FOCUSED = controlPanelFocusedElement === database.NAME;\n\n if (dbFav[database.NAME]) {\n database.STARRED = dbFav[database.NAME];\n } else {\n database.STARRED = 0;\n }\n\n result.push(database);\n });\n\n let sortedResult = sortArray(result);\n\n return sortedResult.map((item, index) => {\n return ;\n });\n }\n\n const checkItem = name => {\n const { selection, databases } = state;\n let duplicate = [...selection];\n let dbDuplicate = databases;\n let checkedItem = duplicate.indexOf(name);\n\n let incomingItem = dbDuplicate.findIndex(db => db.NAME === name);\n dbDuplicate[incomingItem].isChecked = !dbDuplicate[incomingItem].isChecked;\n\n if (checkedItem !== -1) {\n duplicate.splice(checkedItem, 1);\n } else {\n duplicate.push(name);\n }\n\n setState({ ...state, databases: dbDuplicate, selection: duplicate });\n }\n\n const sortArray = array => {\n const { order, sorting } = state;\n let sortingColumn = sortBy(sorting);\n\n if (order === \"descending\") {\n return array.sort((a, b) => (a[sortingColumn] < b[sortingColumn]) ? 1 : ((b[sortingColumn] < a[sortingColumn]) ? -1 : 0));\n } else {\n return array.sort((a, b) => (a[sortingColumn] > b[sortingColumn]) ? 1 : ((b[sortingColumn] > a[sortingColumn]) ? -1 : 0));\n }\n }\n\n const sortBy = sorting => {\n const { Date, Database, Disk, User, Host, Starred } = i18n;\n\n switch (sorting) {\n case Date: return 'DATE';\n case Database: return 'DATABASE';\n case Disk: return 'U_DISK';\n case User: return 'DBUSER';\n case Host: return 'HOST';\n case Starred: return 'STARRED';\n default: break;\n }\n }\n\n const toggleFav = (value, type) => {\n const { dbFav } = state;\n let dbFavDuplicate = dbFav;\n\n if (type === 'add') {\n dbFavDuplicate[value] = 1;\n\n addFavorite(value, 'db')\n .then(() => {\n setState({ ...state, dbFav: dbFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n } else {\n dbFavDuplicate[value] = undefined;\n\n deleteFavorite(value, 'db')\n .then(() => {\n setState({ ...state, dbFav: dbFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n }\n }\n\n const toggleAll = toggled => {\n const databasesDuplicate = [...state.databases];\n\n if (toggled) {\n let dbNames = []\n\n let databases = databasesDuplicate.map(database => {\n dbNames.push(database.NAME);\n database.isChecked = true;\n return database;\n });\n\n setState({ ...state, databases, selection: dbNames, toggledAll: toggled });\n } else {\n let databases = databasesDuplicate.map(database => {\n database.isChecked = false;\n return database;\n });\n\n setState({ ...state, databases, selection: [], toggledAll: toggled });\n }\n }\n\n const bulk = action => {\n const { selection } = state;\n\n if (selection.length && action) {\n setLoading(true);\n bulkAction(action, selection)\n .then(result => {\n if (result.status === 200) {\n toggleAll(false);\n fetchData().then(() => refreshMenuCounters());\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n const displayModal = (text, url) => {\n setModal({\n ...modal,\n visible: true,\n text: text,\n actionUrl: url\n });\n }\n\n const modalConfirmHandler = () => {\n if (!modal.actionUrl) {\n return modalCancelHandler();\n }\n\n modalCancelHandler();\n setLoading(true);\n handleAction(modal.actionUrl)\n .then(res => {\n if (res.data.error) {\n setLoading(false);\n return displayModal(res.data.error, '');\n }\n fetchData().then(() => refreshMenuCounters())\n })\n .catch(err => { setLoading(false); console.error(err); });\n }\n\n const refreshMenuCounters = () => {\n dispatch(refreshCounters()).then(() => setLoading(false));\n }\n\n const modalCancelHandler = () => {\n setModal({\n ...modal,\n visible: false,\n text: '',\n actionUrl: ''\n });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.DB}`} \n \n
\n \n \n \n
\n {loading\n ?
\n : (<>\n {databases()}\n
{state.totalAmount}
\n >)}\n
\n
\n
\n );\n}\n\nexport default Databases;\n","import React from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Container from '../ControlPanel/Container/Container';\nimport ListItem from '../ControlPanel/ListItem/ListItem';\nimport { Link } from 'react-router-dom';\nimport './Firewall.scss';\nimport { useSelector } from 'react-redux';\n\nconst Firewall = ({ data, ...props }) => {\n const { i18n } = useSelector(state => state.session);\n\n const toggleFav = (starred) => {\n if (starred) {\n props.toggleFav(data.NAME, 'add');\n } else {\n props.toggleFav(data.NAME, 'delete');\n }\n }\n\n const checkItem = () => {\n props.checkItem(data.NAME);\n }\n\n const handleSuspend = () => {\n let suspendedStatus = data.SUSPENDED === 'yes' ? 'unsuspend' : 'suspend';\n props.handleModal(data.suspend_conf, `/api/v1/${suspendedStatus}/firewall/index.php?rule=${data.NAME}`);\n }\n\n const handleDelete = () => {\n props.handleModal(data.delete_conf, `/api/v1/delete/firewall/index.php?rule=${data.NAME}`);\n }\n\n return (\n \n\n \n \n
\n {data.ACTION}
\n \n
\n {data.PROTOCOL} / {data.COMMENT}
\n \n
\n
\n \n
\n {data.PORT}
\n \n
\n {data.IP}
\n \n
\n \n \n
\n \n {i18n.edit}\n {data.FOCUSED ? ↩ : }\n \n
\n\n
\n handleSuspend()}>\n {i18n[data.suspend_action]}\n {data.FOCUSED ? S : }\n \n
\n\n
\n handleDelete()}>\n {i18n.Delete}\n {data.FOCUSED ? Del : }\n \n
\n
\n \n );\n}\n\nexport default Firewall;\n","import React, { useEffect, useState } from 'react';\nimport { addControlPanelContentFocusedElement, removeControlPanelContentFocusedElement } from '../../actions/ControlPanelContent/controlPanelContentActions';\nimport { addActiveElement, removeFocusedElement } from '../../actions/MainNavigation/mainNavigationActions';\nimport { bulkAction, getFirewallList, handleAction } from '../../ControlPanelService/Firewalls';\nimport DropdownFilter from '../../components/MainNav/Toolbar/DropdownFilter/DropdownFilter';\nimport * as MainNavigation from '../../actions/MainNavigation/mainNavigationActions';\nimport SearchInput from '../../components/MainNav/Toolbar/SearchInput/SearchInput';\nimport { addFavorite, deleteFavorite } from '../../ControlPanelService/Favorites';\nimport LeftButton from '../../components/MainNav/Toolbar/LeftButton/LeftButton';\nimport Checkbox from '../../components/MainNav/Toolbar/Checkbox/Checkbox';\nimport Select from '../../components/MainNav/Toolbar/Select/Select';\nimport Toolbar from '../../components/MainNav/Toolbar/Toolbar';\nimport Modal from '../../components/ControlPanel/Modal/Modal';\nimport Firewall from '../../components/Firewall/Firewall';\nimport Spinner from '../../components/Spinner/Spinner';\nimport { useDispatch, useSelector } from 'react-redux';\nimport './Firewalls.scss';\nimport { Helmet } from 'react-helmet';\nimport { Link } from 'react-router-dom';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\n\nconst Firewalls = props => {\n const { i18n } = useSelector(state => state.session);\n const { controlPanelFocusedElement } = useSelector(state => state.controlPanelContent);\n const { focusedElement } = useSelector(state => state.mainNavigation);\n const dispatch = useDispatch();\n const [loading, setLoading] = useState(false);\n const [modal, setModal] = useState({\n text: '',\n visible: false,\n actionUrl: ''\n });\n const [state, setState] = useState({\n firewalls: [],\n firewallFav: [],\n selection: [],\n firewallExtension: '',\n toggledAll: false,\n sorting: i18n.Action,\n order: \"descending\",\n totalAmount: ''\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/firewall/'));\n dispatch(removeFocusedElement());\n dispatch(removeControlPanelContentFocusedElement());\n fetchData().then(() => setLoading(false));\n\n return () => {\n dispatch(removeControlPanelContentFocusedElement());\n }\n }, []);\n\n useEffect(() => {\n window.addEventListener(\"keydown\", handleContentSelection);\n window.addEventListener(\"keydown\", handleFocusedElementShortcuts);\n\n return () => {\n window.removeEventListener(\"keydown\", handleContentSelection);\n window.removeEventListener(\"keydown\", handleFocusedElementShortcuts);\n };\n }, [controlPanelFocusedElement, focusedElement, state.firewalls]);\n\n const handleContentSelection = event => {\n if (event.keyCode === 38 || event.keyCode === 40) {\n if (focusedElement) {\n dispatch(MainNavigation.removeFocusedElement());\n }\n }\n\n if (event.keyCode === 38) {\n event.preventDefault();\n handleArrowUp();\n } else if (event.keyCode === 40) {\n event.preventDefault();\n handleArrowDown();\n }\n }\n\n const initFocusedElement = firewalls => {\n firewalls[0]['FOCUSED'] = firewalls[0]['NAME'];\n setState({ ...state, firewalls });\n dispatch(addControlPanelContentFocusedElement(firewalls[0]['NAME']));\n }\n\n const handleArrowDown = () => {\n let firewalls = [...state.firewalls];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(firewalls);\n return;\n }\n\n let focusedElementPosition = firewalls.findIndex(firewall => firewall.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== firewalls.length - 1) {\n let nextFocusedElement = firewalls[focusedElementPosition + 1];\n firewalls[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, firewalls });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleArrowUp = () => {\n let firewalls = [...state.firewalls];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(firewalls);\n return;\n }\n\n let focusedElementPosition = firewalls.findIndex(firewall => firewall.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== 0) {\n let nextFocusedElement = firewalls[focusedElementPosition - 1];\n firewalls[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, firewalls });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleFocusedElementShortcuts = event => {\n let isSearchInputFocused = document.querySelector('input:focus') || document.querySelector('textarea:focus');\n\n if (controlPanelFocusedElement && !isSearchInputFocused) {\n switch (event.keyCode) {\n case 8: return handleDelete();\n case 13: return handleEdit();\n case 83: return handleSuspend();\n default: break;\n }\n }\n }\n\n const handleEdit = () => {\n props.history.push(`/edit/firewall?rule=${controlPanelFocusedElement}`);\n }\n\n const handleSuspend = () => {\n const { firewalls } = state;\n let currentFirewallData = firewalls.filter(firewall => firewall.NAME === controlPanelFocusedElement)[0];\n let suspendedStatus = currentFirewallData.SUSPENDED === 'yes' ? 'unsuspend' : 'suspend';\n\n displayModal(currentFirewallData.suspend_conf, `/api/v1/${suspendedStatus}/firewall/index.php?rule=${controlPanelFocusedElement}`);\n }\n\n const handleDelete = () => {\n const { firewalls } = state;\n let currentFirewallData = firewalls.filter(firewall => firewall.NAME === controlPanelFocusedElement)[0];\n\n displayModal(currentFirewallData.delete_conf, `/api/v1/delete/firewall/index.php?rule=${controlPanelFocusedElement}`);\n }\n\n const fetchData = () => {\n setLoading(true);\n return new Promise((resolve, reject) => {\n getFirewallList()\n .then(result => {\n setState({\n ...state,\n firewalls: reformatData(result.data.data),\n firewallFav: result.data.firewallFav,\n selection: [],\n firewallExtension: result.data.firewallExtension,\n totalAmount: result.data.totalAmount,\n toggledAll: false\n });\n resolve();\n })\n .catch(err => console.error(err));\n });\n }\n\n const reformatData = data => {\n let firewalls = [];\n\n for (let i in data) {\n data[i]['NAME'] = i;\n data[i]['FOCUSED'] = controlPanelFocusedElement === i;\n firewalls.push(data[i]);\n }\n\n return firewalls;\n }\n\n const changeSorting = (sorting, order) => {\n setState({\n ...state,\n sorting,\n order\n });\n }\n\n const firewalls = () => {\n const firewallFav = { ...state.firewallFav };\n let firewalls = [...state.firewalls];\n\n firewalls.forEach(firewall => {\n firewall.FOCUSED = controlPanelFocusedElement === firewall.NAME;\n\n if (firewallFav[firewall.NAME]) {\n firewall.STARRED = firewallFav[firewall.NAME];\n } else {\n firewall.STARRED = 0;\n }\n });\n\n let sortedResult = sortArray(firewalls);\n\n return sortedResult.map((item, index) => {\n return ;\n });\n }\n\n const checkItem = name => {\n const { selection, firewalls } = state;\n let duplicate = [...selection];\n let firewallsDuplicate = firewalls;\n let checkedItem = duplicate.indexOf(name);\n\n let incomingItem = firewallsDuplicate.findIndex(db => db.NAME === name);\n firewallsDuplicate[incomingItem].isChecked = !firewallsDuplicate[incomingItem].isChecked;\n\n if (checkedItem !== -1) {\n duplicate.splice(checkedItem, 1);\n } else {\n duplicate.push(name);\n }\n\n setState({ ...state, firewalls: firewallsDuplicate, selection: duplicate });\n }\n\n const sortArray = array => {\n const { order, sorting } = state;\n let sortingColumn = sortBy(sorting);\n\n if (order === \"descending\") {\n return array.sort((a, b) => (a[sortingColumn] < b[sortingColumn]) ? 1 : ((b[sortingColumn] < a[sortingColumn]) ? -1 : 0));\n } else {\n return array.sort((a, b) => (a[sortingColumn] > b[sortingColumn]) ? 1 : ((b[sortingColumn] > a[sortingColumn]) ? -1 : 0));\n }\n }\n\n const sortBy = sorting => {\n const { Action, Protocol, Port, Comment, Starred } = i18n;\n\n switch (sorting) {\n case Action: return 'ACTION';\n case Protocol: return 'PROTOCOL';\n case Port: return 'PORT';\n case i18n['IP address']: return 'IP';\n case Comment: return 'COMMENT';\n case Starred: return 'STARRED';\n default: break;\n }\n }\n\n const toggleFav = (value, type) => {\n const { firewallFav } = state;\n let firewallFavDuplicate = firewallFav;\n\n if (type === 'add') {\n firewallFavDuplicate[value] = 1;\n\n addFavorite(value, 'firewall')\n .then(() => {\n setState({ ...state, firewallFav: firewallFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n } else {\n firewallFavDuplicate[value] = undefined;\n\n deleteFavorite(value, 'firewall')\n .then(() => {\n setState({ ...state, firewallFav: firewallFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n }\n }\n\n const toggleAll = toggled => {\n if (toggled) {\n let firewallNames = [];\n\n let firewalls = state.firewalls.map(firewall => {\n firewallNames.push(firewall.NAME);\n firewall.isChecked = true;\n return firewall;\n });\n\n setState({ ...state, firewalls, selection: firewallNames, toggledAll: toggled });\n } else {\n let firewalls = state.firewalls.map(firewall => {\n firewall.isChecked = false;\n return firewall;\n });\n\n setState({ ...state, firewalls, selection: [], toggledAll: toggled });\n }\n }\n\n const bulk = action => {\n const { selection } = state;\n\n if (selection.length && action) {\n setLoading(true);\n bulkAction(action, selection)\n .then(result => {\n if (result.status === 200) {\n toggleAll(false);\n fetchData().then(() => refreshMenuCounters());\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n const displayModal = (text, actionUrl) => {\n setModal({ ...modal, visible: !modal.visible, text, actionUrl });\n }\n\n const modalConfirmHandler = () => {\n if (!modal.actionUrl) {\n return modalCancelHandler();\n }\n\n modalCancelHandler();\n setLoading(true);\n handleAction(modal.actionUrl)\n .then(res => {\n if (res.data.error) {\n setLoading(false);\n return displayModal(res.data.error, '');\n }\n fetchData().then(() => refreshMenuCounters())\n })\n .catch(err => { setLoading(false); console.error(err); });\n }\n\n const refreshMenuCounters = () => {\n dispatch(refreshCounters()).then(() => setLoading(false));\n }\n\n const modalCancelHandler = () => {\n setModal({ ...modal, visible: !modal.visible, text: '', actionUrl: '' });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.FIREWALL}`} \n \n
\n \n \n
\n {i18n['list fail2ban']}\n \n \n \n props.changeSearchTerm(term)} />\n
\n
\n \n
\n {loading\n ?
\n : (<>\n {firewalls()}\n
{state.totalAmount}
\n >)}\n
\n
\n
\n );\n}\n\nexport default Firewalls;\n","import axios from 'axios';\nimport { getAuthToken } from 'src/utils/token';\n\nconst BASE_URL = window.location.origin;\nconst usersUri = '/api/v1/list/user/index.php';\nconst addUsersUri = '/api/v1/add/user/index.php';\nconst userInfoUri = '/api/v1/edit/user/index.php';\nconst updateUserUri = '/api/v1/edit/user/index.php';\n\nexport const getUsersList = () => {\n return axios.get(BASE_URL + usersUri, {\n params: {\n token: getAuthToken()\n }\n });\n}\n\nexport const bulkAction = (action, selectedUsers) => {\n const formData = new FormData();\n formData.append(\"token\", getAuthToken());\n formData.append(\"action\", action);\n\n selectedUsers.forEach(user => {\n formData.append(\"user[]\", user);\n });\n\n return axios.post(BASE_URL + '/api/v1/bulk/user/', formData);\n};\n\nexport const handleAction = uri => {\n return axios.get(BASE_URL + uri, {\n params: {\n token: getAuthToken()\n }\n });\n}\n\nexport const addUser = data => {\n let formDataObject = new FormData();\n\n for (let key in data) {\n formDataObject.append(key, data[key]);\n }\n\n formDataObject.append(\"token\", getAuthToken());\n formDataObject.append(\"ok\", \"Add\");\n\n return axios.post(BASE_URL + addUsersUri, formDataObject);\n}\n\nexport const getUserInfo = username => {\n return axios.get(BASE_URL + userInfoUri, {\n params: {\n user: username,\n token: getAuthToken()\n }\n });\n}\n\nexport const updateUser = (data, user) => {\n let formDataObject = new FormData();\n\n for (let key in data) {\n formDataObject.append(key, data[key]);\n }\n\n return axios.post(BASE_URL + updateUserUri, formDataObject, {\n params: {\n user,\n token: getAuthToken()\n }\n });\n}\n","import React, { useEffect, useState } from 'react';\nimport { addActiveElement, removeFocusedElement } from \"../../../actions/MainNavigation/mainNavigationActions\";\nimport Password from '../../../components/ControlPanel/AddItemLayout/Form/Password/Password';\nimport SelectInput from '../../ControlPanel/AddItemLayout/Form/SelectInput/SelectInput';\nimport NameServers from '../../ControlPanel/AddItemLayout/Form/NameServers/NameServers';\nimport TextInput from '../../ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport { updateUser, getUserInfo } from '../../../ControlPanelService/Users';\nimport AddItemLayout from '../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Spinner from '../../../components/Spinner/Spinner';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { Helmet } from 'react-helmet';\nimport HtmlParser from 'react-html-parser';\nimport QS from 'qs';\nimport './EditUser.scss';\n\nconst EditUser = props => {\n const token = localStorage.getItem(\"token\");\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const dispatch = useDispatch();\n const [errorMessage, setErrorMessage] = useState('');\n const [okMessage, setOkMessage] = useState('');\n const [state, setState] = useState({\n data: {},\n loading: false,\n username: ''\n });\n\n useEffect(() => {\n let queryParams = QS.parse(history.location.search, { ignoreQueryPrefix: true });\n const { user } = queryParams;\n\n dispatch(addActiveElement('/list/user/'));\n dispatch(removeFocusedElement());\n\n if (user) {\n setState({ ...state, loading: true });\n fetchData(user);\n }\n }, []);\n\n const fetchData = user => {\n getUserInfo(user)\n .then(response => {\n setState({\n ...state,\n username: user,\n data: response.data,\n loading: false\n });\n })\n .catch(err => {\n setState({ ...state, loading: false });\n console.error(err);\n });\n }\n\n const submitFormHandler = event => {\n event.preventDefault();\n let updatedUser = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n updatedUser[name] = value;\n }\n\n updatedUser['v_username'] = state.username;\n\n if (Object.keys(updatedUser).length !== 0 && updatedUser.constructor === Object) {\n setState({ ...state, loading: true });\n\n updateUser(updatedUser, state.username)\n .then(result => {\n if (result.status === 200) {\n const { error_msg: errorMessage, ok_msg: okMessage } = result.data;\n\n if (errorMessage) {\n setErrorMessage(errorMessage);\n setOkMessage('');\n } else {\n setErrorMessage('');\n setOkMessage(okMessage);\n }\n }\n })\n .then(() => fetchData(state.username))\n .catch(err => console.error(err));\n }\n }\n\n const convertObjectOfObjectsToArrayOfObjects = object => {\n let result = [];\n\n for (let i in object) {\n result.push(i);\n }\n\n return result;\n }\n\n return (\n \n
\n {`Vesta - ${i18n.USER}`} \n \n
\n
\n {i18n['Editing User']}
\n {errorMessage ? : ''} {errorMessage}
\n \n {okMessage ? : ''} {HtmlParser(okMessage)} \n
\n \n
\n {state.loading ? :\n submitFormHandler(event)} id=\"add-user\">\n \n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n {i18n.Save} \n history.push('/list/user/')}>{i18n.Back} \n
\n\n \n }\n \n
\n );\n}\n\nexport default EditUser;","import React, { useEffect, useState } from 'react';\nimport { addActiveElement, removeFocusedElement } from \"../../../../actions/MainNavigation/mainNavigationActions\";\nimport Checkbox from '../../../ControlPanel/AddItemLayout/Form/Checkbox/Checkbox';\nimport TextArea from '../../../ControlPanel/AddItemLayout/Form/TextArea/TextArea';\nimport AddItemLayout from '../../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { getServiceInfo, updateService } from 'src/ControlPanelService/Server';\nimport Spinner from '../../../../components/Spinner/Spinner';\nimport Toolbar from '../../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\n\nimport './Bind9.scss';\nimport { Helmet } from 'react-helmet';\nimport HtmlParser from 'react-html-parser';\n\nconst Bind9 = () => {\n const token = localStorage.getItem(\"token\");\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const dispatch = useDispatch();\n const [errorMessage, setErrorMessage] = useState('');\n const [okMessage, setOkMessage] = useState('');\n const [state, setState] = useState({\n data: {},\n loading: false\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/server/'));\n dispatch(removeFocusedElement());\n\n setState({ ...state, loading: true });\n fetchData();\n }, []);\n\n const fetchData = () => {\n getServiceInfo('bind9')\n .then(response => {\n if (response.data.config.includes('Error')) {\n history.push('/list/server');\n }\n\n setState({ ...state, data: response.data, loading: false });\n })\n .catch(err => {\n setState({ ...state, loading: false });\n console.error(err);\n });\n }\n\n const submitFormHandler = event => {\n event.preventDefault();\n let updatedService = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n updatedService[name] = value;\n }\n\n if (Object.keys(updatedService).length !== 0 && updatedService.constructor === Object) {\n setState({ ...state, loading: true });\n\n updateService(updatedService, '/bind9')\n .then(result => {\n if (result.status === 200) {\n const { error_msg, ok_msg } = result.data;\n\n setErrorMessage(error_msg || '');\n setOkMessage(ok_msg || '');\n }\n })\n .then(() => fetchData())\n .catch(err => console.error(err));\n }\n }\n\n return (\n \n
\n {`Vesta - ${i18n.SERVER}`} \n \n
\n
\n \n {i18n['Configuring Server']} / {state.data.service_name}\n
\n \n \n {errorMessage ? : ''} {errorMessage}\n \n
\n \n \n {okMessage ? : ''} {HtmlParser(okMessage)} \n \n
\n \n
\n {state.loading ? :\n submitFormHandler(event)} id=\"edit-bind9\">\n \n \n\n \n\n \n\n \n\n \n\n \n\n \n {i18n.Save} \n history.push('/list/server/')}>{i18n.Back} \n
\n\n \n }\n \n
\n );\n}\n\nexport default Bind9;","import React, { useEffect, useState } from 'react';\nimport { addActiveElement, removeFocusedElement } from \"../../../../actions/MainNavigation/mainNavigationActions\";\nimport TextInput from '../../../ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport Checkbox from '../../../ControlPanel/AddItemLayout/Form/Checkbox/Checkbox';\nimport TextArea from '../../../ControlPanel/AddItemLayout/Form/TextArea/TextArea';\nimport { getServiceInfo, updateService } from 'src/ControlPanelService/Server';\nimport AddItemLayout from '../../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Spinner from '../../../../components/Spinner/Spinner';\nimport Toolbar from '../../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\n\nimport './Mysql.scss';\nimport { Helmet } from 'react-helmet';\nimport HtmlParser from 'react-html-parser';\n\nconst Mysql = ({ serviceName = '' }) => {\n const token = localStorage.getItem(\"token\");\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const dispatch = useDispatch();\n const [errorMessage, setErrorMessage] = useState('');\n const [okMessage, setOkMessage] = useState('');\n const [restart, setRestart] = useState(true);\n const [state, setState] = useState({\n data: {},\n loading: false,\n basicOptions: true,\n advancedOptions: false\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/server/'));\n dispatch(removeFocusedElement());\n\n if (!serviceName) {\n history.push('/list/server');\n }\n\n setState({ ...state, loading: true });\n fetchData();\n }, []);\n\n const fetchData = () => {\n getServiceInfo('mysql')\n .then(response => {\n if (response.data.config.includes('Error')) {\n history.push('/list/server');\n }\n\n setState({ ...state, data: response.data, loading: false });\n })\n .catch(err => {\n setState({ ...state, loading: false });\n console.error(err);\n });\n }\n\n const submitFormHandler = event => {\n event.preventDefault();\n let updatedService = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n updatedService[name] = value;\n }\n\n if (Object.keys(updatedService).length !== 0 && updatedService.constructor === Object) {\n setState({ ...state, loading: true });\n\n updatedService['v_config'] = state.data.config;\n updatedService['v_restart'] = restart ? 'yes' : 'no';\n\n updateService(updatedService, `/${serviceName}`)\n .then(result => {\n if (result.status === 200) {\n const { error_msg, ok_msg } = result.data;\n\n setErrorMessage(error_msg || '');\n setOkMessage(ok_msg || '');\n }\n })\n .then(() => fetchData())\n .catch(err => console.error(err));\n }\n }\n\n const toggleOptions = () => {\n setState({\n ...state,\n advancedOptions: !state.advancedOptions,\n basicOptions: !state.basicOptions\n });\n }\n\n const onUpdateConfig = ({ id, value }) => {\n if (!value) return;\n\n var regexp = new RegExp(`(${id})(.+)(${state.data[id]})`, 'gm');\n const updatedConfig = state.data.config.replace(regexp, `$1$2${value}`);\n setState({ ...state, data: { ...state.data, config: updatedConfig, [id]: value } });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.SERVER}`} \n \n
\n
\n {i18n['Configuring Server']} / {state.data.service_name}
\n \n \n {errorMessage ? : ''} {errorMessage}\n \n
\n \n \n {okMessage ? : ''} {HtmlParser(okMessage)} \n \n
\n \n
\n {state.loading ? :\n submitFormHandler(event)} id=\"edit-mysql\">\n \n \n\n {\n !state.basicOptions && (\n toggleOptions()}>\n {i18n['Basic options']}\n {state.basicOptions ? : }\n \n )\n }\n\n {\n state.basicOptions && (\n <>\n onUpdateConfig(event.target)}\n value={state.data.max_connections} />\n\n onUpdateConfig(event.target)}\n value={state.data.max_user_connections} />\n\n onUpdateConfig(event.target)}\n value={state.data.wait_timeout} />\n\n onUpdateConfig(event.target)}\n value={state.data.interactive_timeout} />\n\n onUpdateConfig(event.target)}\n value={state.data.max_allowed_packet} />\n >\n )\n }\n\n {\n !state.advancedOptions && (\n toggleOptions()}>\n {i18n['Advanced options']}\n {state.advancedOptions ? : }\n \n )\n }\n\n \n \n\n {\n state.advancedOptions && (\n <>\n setState({ ...state, data: { ...state.data, config: e.target.value } })}\n name=\"v_config\"\n id=\"v_config\"\n rows=\"25\" />\n\n \n\n setRestart(checked)}\n name=\"v_restart\"\n id=\"restart\" />\n >\n )\n }\n\n \n {i18n.Save} \n history.push('/list/server/')}>{i18n.Back} \n
\n\n \n }\n \n
\n );\n}\n\nexport default Mysql;","import axios from \"axios\";\n\nconst BASE_URL = window.location.origin;\nconst userNSApiUri = '/api/v1/list-user-ns.php';\n\nexport const getUserNS = () => {\n return axios.get(BASE_URL + userNSApiUri);\n}","import React, { useEffect, useState } from 'react';\nimport dayjs from 'dayjs';\n\nimport './AdvancedOptions.scss';\nimport { useSelector } from 'react-redux';\n\nconst AdvancedOptions = props => {\n const { i18n } = useSelector(state => state.session);\n const [state, setState] = useState({\n nameServersAmount: [],\n userNS: props.userNS\n });\n\n useEffect(() => {\n if (props.userNS.length) {\n let initNameServersAmount = props.userNS.map((userNS, index) => index + 1);\n setState({ ...state, nameServersAmount: initNameServersAmount });\n }\n }, []);\n\n const renderNameServerInputs = () => {\n return state.nameServersAmount.map((nameServer, index) => {\n return (\n \n \n onDeleteNameServer(nameServer)}>\n {i18n.delete ?? 'Delete'}\n \n
\n );\n });\n }\n\n const onDeleteNameServer = index => {\n let nameServersDuplicate = [...state.nameServersAmount];\n\n nameServersDuplicate.splice(index - 1, 1);\n\n setState({ ...state, nameServersAmount: nameServersDuplicate });\n }\n\n const addNameServer = () => {\n let nameServersLength = state.nameServersAmount.length;\n let nameServersDuplicate = [...state.nameServersAmount];\n\n nameServersDuplicate.push(nameServersLength + 1);\n\n setState({ ...state, nameServersAmount: nameServersDuplicate });\n }\n\n const addNameServerClassName = () => {\n return state.nameServersAmount.length === 8 ? 'hide' : 'show optional';\n }\n\n const getCurrentDatePlusYear = () => {\n let currentDatePlusYear = dayjs().add(1, 'year').format('YYYY-MM-DD');\n return currentDatePlusYear;\n }\n\n return (\n \n
\n \n {i18n['Expiration Date'] ?? 'Expiration Date'}\n ({i18n['YYYY-MM-DD'] ?? 'YYYY-MM-DD'}) \n \n \n
\n\n
\n TTL \n \n
\n\n
\n {i18n['Name servers'] ?? 'Name servers'} \n {renderNameServerInputs()}\n
\n\n
addNameServer()}>\n {i18n['Add one more Name Server'] ?? 'Add one more Name Server'}\n \n
\n );\n}\n\nexport default AdvancedOptions;","import React, { useEffect, useState } from 'react';\n\nimport { addActiveElement, removeFocusedElement } from \"../../../actions/MainNavigation/mainNavigationActions\";\nimport AddItemLayout from '../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { getUserNS } from '../../../ControlPanelService/UserNS';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport Spinner from '../../Spinner/Spinner';\nimport { useDispatch, useSelector } from 'react-redux';\n\nimport './AddDomainNameSystem.scss';\nimport AdvancedOptions from './AdvancedOptions/AdvancedOptions';\nimport { addDomainNameSystem } from '../../../ControlPanelService/Dns';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\nimport HtmlParser from 'react-html-parser';\n\nconst AddDomainNameSystem = props => {\n const { i18n } = useSelector(state => state.session);\n const dispatch = useDispatch();\n const token = localStorage.getItem(\"token\");\n const history = useHistory();\n const [state, setState] = useState({\n loading: false,\n showAdvancedOptions: false,\n okMessage: '',\n domain: '',\n errorMessage: '',\n userNS: []\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/dns/'));\n dispatch(removeFocusedElement());\n\n setState({ ...state, loading: true });\n getUserNS()\n .then(result => {\n if (result.data.length) {\n setState({ ...state, userNS: result.data, loading: false });\n }\n })\n .catch(err => console.error(err));\n }, []);\n\n const submitFormHandler = event => {\n event.preventDefault();\n let domainNameSystem = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n domainNameSystem[name] = value;\n }\n\n if (Object.keys(domainNameSystem).length !== 0 && domainNameSystem.constructor === Object) {\n setState({ ...state, loading: true });\n addDomainNameSystem(domainNameSystem)\n .then(result => {\n if (result.status === 200) {\n const { error_msg: errorMessage, ok_msg: okMessage } = result.data;\n\n if (errorMessage) {\n setState({ ...state, errorMessage, okMessage, loading: false });\n } else {\n dispatch(refreshCounters()).then(() => {\n setState({ ...state, okMessage, errorMessage: '', loading: false });\n });\n }\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n const renderAdvancedOptions = () => {\n if (state.showAdvancedOptions) {\n return ;\n }\n }\n\n const showAdvancedOption = () => {\n setState({ ...state, showAdvancedOptions: !state.showAdvancedOptions });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.DNS}`} \n \n
\n
\n {i18n['Adding DNS Domain'] ?? 'Adding DNS Domain'}
\n \n \n {state.errorMessage ? : ''}\n {state.errorMessage} \n
\n \n \n {state.okMessage ? : ''}\n {HtmlParser(state.okMessage)} \n \n
\n \n\n
\n {state.loading ? : (\n submitFormHandler(event)}>\n \n \n\n \n {i18n.Domain ?? 'Domain'} \n \n
\n\n \n {i18n['IP address'] ?? 'IP address'} \n \n
\n\n \n showAdvancedOption()}>\n {i18n['Advanced options'] ?? 'Advanced options'}\n {state.showAdvancedOptions ? : }\n \n
\n\n {renderAdvancedOptions()}\n\n \n {i18n.Add ?? 'Add'} \n history.push('/list/dns/')}>{i18n.Back ?? 'Back'} \n
\n \n )}\n \n
\n );\n}\n\nexport default AddDomainNameSystem;","import React, { useEffect, useState } from 'react';\n\nimport { addActiveElement, removeFocusedElement } from \"../../../actions/MainNavigation/mainNavigationActions\";\nimport SelectInput from 'src/components/ControlPanel/AddItemLayout/Form/SelectInput/SelectInput';\nimport TextInput from 'src/components/ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport AddItemLayout from '../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { addDomainNameSystemRecord } from '../../../ControlPanelService/Dns';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport Spinner from '../../Spinner/Spinner';\nimport { useDispatch, useSelector } from 'react-redux';\n\nimport './AddDNSRecord.scss'\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\nimport HtmlParser from 'react-html-parser';\n\nexport default function AddDNSRecord(props) {\n const { i18n } = useSelector(state => state.session);\n const dispatch = useDispatch();\n const token = localStorage.getItem(\"token\");\n const history = useHistory();\n const [state, setState] = useState({\n data: {},\n selectOptions: [\n 'A',\n 'AAAA',\n 'NS',\n 'CNAME',\n 'MX',\n 'TXT',\n 'SRV',\n 'DNSKEY',\n 'KEY',\n 'IPSECKEY',\n 'PTR',\n 'SPF',\n 'TLSA',\n 'CAA'\n ],\n loading: false,\n okMessage: '',\n errorMessage: '',\n });\n\n useEffect(() => {\n dispatch(addActiveElement(`/list/dns/`));\n dispatch(removeFocusedElement());\n }, []);\n\n const submitFormHandler = event => {\n event.preventDefault();\n let newDnsRecord = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n newDnsRecord[name] = value;\n }\n\n newDnsRecord['ok_rec'] = 'add';\n newDnsRecord['token'] = token;\n newDnsRecord['v_domain'] = props.domain;\n\n if (Object.keys(newDnsRecord).length !== 0 && newDnsRecord.constructor === Object) {\n setState({ ...state, loading: true });\n addDomainNameSystemRecord(newDnsRecord)\n .then(result => {\n if (result.status === 200) {\n const { error_msg: errorMessage, ok_msg: okMessage } = result.data;\n\n if (errorMessage) {\n setState({ ...state, errorMessage, okMessage, loading: false });\n } else {\n dispatch(refreshCounters()).then(() => {\n setState({ ...state, okMessage, errorMessage: '', loading: false });\n });\n }\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n return (\n \n
\n {`Vesta - ${i18n.DNS}`} \n \n
\n
\n {i18n['Adding DNS Record']}
\n \n \n {state.errorMessage ? : ''}\n {state.errorMessage} \n
\n \n \n {state.okMessage ? : ''}\n {HtmlParser(state.okMessage)} \n \n
\n \n
\n {state.loading ? : (\n submitFormHandler(event)}>\n \n\n \n\n \n\n \n\n \n\n \n {i18n.Add} \n history.push(`/list/dns/?domain=${props.domain}`)}>{i18n.Back} \n
\n \n )}\n \n
\n );\n}","import React, { useEffect, useState } from 'react';\nimport AddDomainNameSystem from 'src/components/DomainNameSystem/Add/AddDomainNameSystem';\nimport AddDNSRecord from 'src/components/DNSRecord/Add/AddDNSRecord';\nimport { useHistory } from 'react-router-dom';\nimport QueryString from 'qs';\nimport { Helmet } from 'react-helmet';\nimport { useSelector } from 'react-redux';\n\nexport default function AddDNSWrapper() {\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const parsedQueryString = QueryString.parse(history.location.search, { ignoreQueryPrefix: true });\n const [isDnsRecord, setIsDnsRecord] = useState(false);\n\n useEffect(() => {\n if (parsedQueryString.domain) {\n setIsDnsRecord(true);\n } else {\n setIsDnsRecord(false);\n }\n }, [history.location]);\n\n return (\n <>\n \n {`Vesta - ${i18n.DNS}`} \n \n {\n isDnsRecord\n ? \n : \n }\n >\n );\n}","import React from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Container from '../../ControlPanel/Container/Container';\nimport ListItem from '../../ControlPanel/ListItem/ListItem';\nimport { Link } from 'react-router-dom';\n\nimport './RestoreSetting.scss';\nimport { useSelector } from 'react-redux';\n\nexport default function RestoreSetting({ data, checkItemFunc = () => { }, restoreSetting = () => { } }) {\n const { i18n } = useSelector(state => state.session);\n\n const displayBackupDetailName = type => {\n switch (type) {\n case 'WEB': return `WEB ${i18n['domain']}`;\n case 'MAIL': return `MAIL ${i18n['domain']}`;\n case 'DNS': return `DNS ${i18n['domain']}`;\n case 'CRON': return i18n['cron'];\n case 'UDIR': return i18n['user dir'];\n default: return i18n['domain'];\n }\n }\n\n const checkItem = () => {\n checkItemFunc(data.NAME);\n }\n\n return (\n \n\n \n \n
\n {displayBackupDetailName(data.type)}
\n \n
\n {data.name} \n \n
\n
\n
\n
\n \n \n
\n restoreSetting(data.restoreLinkParams)}>\n {i18n['restore']}\n {data.FOCUSED ? R : }\n \n
\n
\n \n );\n}","import React, { useState, useEffect } from 'react';\nimport { addControlPanelContentFocusedElement, removeControlPanelContentFocusedElement } from 'src/actions/ControlPanelContent/controlPanelContentActions';\nimport * as MainNavigation from 'src/actions/MainNavigation/mainNavigationActions';\nimport SearchInput from 'src/components/MainNav/Toolbar/SearchInput/SearchInput';\nimport LeftButton from 'src/components/MainNav/Toolbar/LeftButton/LeftButton';\nimport { getBackupDetails, restoreBackupSetting, bulkRestore } from 'src/ControlPanelService/Backup';\nimport Checkbox from 'src/components/MainNav/Toolbar/Checkbox/Checkbox';\nimport Select from 'src/components/MainNav/Toolbar/Select/Select';\nimport Toolbar from 'src/components/MainNav/Toolbar/Toolbar';\nimport RestoreSetting from '../RestoreSetting/RestoreSetting';\nimport Modal from 'src/components/ControlPanel/Modal/Modal';\nimport { useSelector, useDispatch } from 'react-redux';\nimport Spinner from 'src/components/Spinner/Spinner';\nimport { Link } from 'react-router-dom';\nimport { Helmet } from 'react-helmet';\n\nimport './BackupRestoreSettings.scss';\n\nexport default function BackupRestoreSettings(props) {\n const { i18n } = useSelector(state => state.session);\n const token = localStorage.getItem(\"token\");\n const { controlPanelFocusedElement } = useSelector(state => state.controlPanelContent);\n const { focusedElement } = useSelector(state => state.mainNavigation);\n const dispatch = useDispatch();\n const [backupDetailsData, setBackupDetailsData] = useState([]);\n const [modal, setModal] = useState({\n text: '',\n visible: false,\n });\n const [state, setState] = useState({\n loading: false,\n backupDetails: [],\n toggledAll: false,\n selection: [],\n totalAmount: ''\n });\n\n useEffect(() => {\n dispatch(removeControlPanelContentFocusedElement());\n fetchData();\n\n return () => dispatch(removeControlPanelContentFocusedElement());\n }, []);\n\n useEffect(() => {\n window.addEventListener(\"keydown\", handleContentSelection);\n window.addEventListener(\"keydown\", handleFocusedElementShortcuts);\n\n return () => {\n window.removeEventListener(\"keydown\", handleContentSelection);\n window.removeEventListener(\"keydown\", handleFocusedElementShortcuts);\n };\n }, [controlPanelFocusedElement, focusedElement, backupDetailsData]);\n\n const handleContentSelection = event => {\n if (event.keyCode === 65) {\n handleRestore(`?backup=${props.backup}`);\n return;\n }\n\n if (event.keyCode === 38 || event.keyCode === 40) {\n if (focusedElement) {\n dispatch(MainNavigation.removeFocusedElement());\n }\n }\n\n if (event.keyCode === 38) {\n event.preventDefault();\n handleArrowUp();\n } else if (event.keyCode === 40) {\n event.preventDefault();\n handleArrowDown();\n }\n }\n\n const initFocusedElement = backupDetails => {\n backupDetails[0]['FOCUSED'] = backupDetails[0]['NAME'];\n setBackupDetailsData(backupDetails);\n dispatch(addControlPanelContentFocusedElement(backupDetails[0]['NAME']));\n }\n\n const handleArrowDown = () => {\n let backupDetails = [...backupDetailsData];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(backupDetails);\n return;\n }\n\n let nextFocusedElement = backupDetails[controlPanelFocusedElement + 1];\n\n if (nextFocusedElement) {\n backupDetails[controlPanelFocusedElement]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setBackupDetailsData(backupDetails);\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleArrowUp = () => {\n let backupDetails = [...backupDetailsData];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(backupDetails);\n return;\n }\n\n let nextFocusedElement = backupDetails[controlPanelFocusedElement - 1];\n\n if (nextFocusedElement) {\n backupDetails[controlPanelFocusedElement]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setBackupDetailsData(backupDetails);\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleFocusedElementShortcuts = event => {\n let isSearchInputFocused = document.querySelector('input:focus') || document.querySelector('textarea:focus');\n\n if (controlPanelFocusedElement > 0 || controlPanelFocusedElement !== '' && !isSearchInputFocused) {\n switch (event.keyCode) {\n case 82: return handleRestore();\n default: break;\n }\n }\n }\n\n const handleRestore = params => {\n const paramsUri = params ? params : backupDetailsData[controlPanelFocusedElement].restoreLinkParams;\n\n restoreBackupSetting(paramsUri)\n .then(response => displayModal(response.data.message))\n .catch(err => console.error(err));\n }\n\n const fetchData = () => {\n setState({ ...state, loading: true });\n\n getBackupDetails(props.backup)\n .then(result => {\n reformatData(result.data.data[props.backup]);\n setState({\n ...state,\n totalAmount: result.data.totalAmount,\n selection: [],\n toggledAll: false,\n loading: false\n });\n })\n .catch(err => console.error(err));\n }\n\n const reformatData = data => {\n let reformattedData = ['WEB', 'DNS', 'MAIL', 'DB', 'UDIR', 'CRON'].reduce((acc, cat) => {\n data[cat].split(',').map(item => {\n acc.push({\n type: cat,\n name: item,\n restoreLinkParams: `?backup=${props.backup}&type=${cat.toLowerCase()}&object=${item}`\n });\n });\n\n return acc;\n }, []);\n\n setBackupDetailsData(reformattedData);\n }\n\n const listBackups = () => {\n const backupDetails = [...backupDetailsData];\n const result = [];\n\n backupDetails.forEach((backupDetail, index) => {\n backupDetail.NAME = index;\n backupDetail.FOCUSED = controlPanelFocusedElement === index;\n result.push(backupDetail);\n });\n\n return result.map((item, index) => {\n return checkItem(name)} restoreSetting={handleRestore} />;\n });\n }\n\n const checkItem = name => {\n const { selection } = state;\n let duplicate = [...selection];\n let backupDetailsDuplicate = [...backupDetailsData];\n let checkedItem = duplicate.indexOf(name);\n\n let incomingItem = backupDetailsDuplicate.findIndex(backupDetail => backupDetail.NAME === name);\n backupDetailsDuplicate[incomingItem].isChecked = !backupDetailsDuplicate[incomingItem].isChecked;\n\n if (checkedItem !== -1) {\n duplicate.splice(backupDetailsDuplicate[name]['name'], 1);\n } else {\n duplicate.push(backupDetailsDuplicate[name]['name']);\n }\n\n setState({ ...state, selection: duplicate });\n setBackupDetailsData(backupDetailsDuplicate);\n }\n\n const toggleAll = toggled => {\n const backupDetailsDuplicate = [...backupDetailsData];\n\n if (toggled) {\n let backupDetailNames = [];\n let backupDetails = backupDetailsDuplicate.map(backupDetail => {\n backupDetailNames.push(backupDetail.name);\n backupDetail.isChecked = true;\n return backupDetail;\n });\n\n setState({ ...state, selection: backupDetailNames, toggledAll: toggled });\n setBackupDetailsData(backupDetails);\n } else {\n let backupDetails = backupDetailsDuplicate.map(backupDetail => {\n backupDetail.isChecked = false;\n return backupDetail;\n });\n\n setState({ ...state, selection: [], toggledAll: toggled });\n setBackupDetailsData(backupDetails);\n }\n }\n\n const bulk = action => {\n const { selection } = state;\n\n if (selection.length && action) {\n setState({ ...state, loading: true });\n bulkRestore(action, selection, props.backup)\n .then(result => {\n if (result.status === 200) {\n displayModal(result.data.message);\n toggleAll(false);\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n const displayModal = text => {\n setState({ ...state, loading: false });\n setModal({ ...modal, visible: true, text });\n }\n\n const modalCancelHandler = () => {\n setModal({ ...modal, visible: false, text: '' });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.BACKUP}`} \n \n
\n handleRestore(`?backup=${props.backup}`)} showLeftMenu={true} />\n \n
\n \n \n props.changeSearchTerm(term)} />\n
\n
\n \n {state.loading\n ?
\n : (\n <>\n
\n
\n {`${i18n['Listing']} ${props.backup}`} \n
\n {listBackups()}\n
\n
\n
{state.totalAmount}
\n
\n {i18n['Back']}\n
\n
\n >\n )\n }\n\n
\n
\n );\n}","import React, { } from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport ListItem from '../ControlPanel/ListItem/ListItem';\nimport Container from '../ControlPanel/Container/Container';\nimport { faFileDownload } from '@fortawesome/free-solid-svg-icons'\nimport './Backup.scss';\nimport { Link } from 'react-router-dom';\nimport { useSelector } from 'react-redux';\n\nconst Backup = props => {\n const { data } = props;\n const { i18n } = useSelector(state => state.session);\n const token = localStorage.getItem(\"token\");\n\n const toggleFav = (starred) => {\n if (starred) {\n props.toggleFav(props.data.NAME, 'add');\n } else {\n props.toggleFav(props.data.NAME, 'delete');\n }\n }\n\n const checkItem = () => {\n props.checkItem(props.data.NAME);\n }\n\n const handleDelete = () => {\n props.handleModal(data.delete_conf, `/api/v1/delete/backup/?backup=${data.NAME}`);\n }\n\n return (\n \n\n \n {data.NAME}
\n \n
\n {i18n['Backup Size']}: {data.SIZE} {i18n.mb}
\n \n
\n {i18n.Type}: {data.TYPE}
\n \n
\n {i18n['Run Time']}: {data.RUNTIME} minute
\n \n
\n \n \n\n {data.UPDATED === 'no' &&
}\n\n
\n\n
\n \n {i18n['configure restore settings']}\n {data.FOCUSED ? ↩ : }\n \n
\n\n
\n handleDelete()}>\n {i18n.Delete}\n {data.FOCUSED ? Del : }\n \n
\n\n
\n \n );\n}\n\nexport default Backup;","import React, { useState, useEffect } from 'react';\nimport { addControlPanelContentFocusedElement, removeControlPanelContentFocusedElement } from '../../actions/ControlPanelContent/controlPanelContentActions';\nimport { addActiveElement, removeFocusedElement } from '../../actions/MainNavigation/mainNavigationActions';\nimport { bulkAction, getBackupList, handleAction, scheduleBackup } from '../../ControlPanelService/Backup';\nimport * as MainNavigation from '../../actions/MainNavigation/mainNavigationActions';\nimport SearchInput from '../../components/MainNav/Toolbar/SearchInput/SearchInput';\nimport { addFavorite, deleteFavorite } from '../../ControlPanelService/Favorites';\nimport Checkbox from '../../components/MainNav/Toolbar/Checkbox/Checkbox';\nimport Select from '../../components/MainNav/Toolbar/Select/Select';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Toolbar from '../../components/MainNav/Toolbar/Toolbar';\nimport Modal from '../../components/ControlPanel/Modal/Modal';\nimport Spinner from '../../components/Spinner/Spinner';\nimport { useSelector, useDispatch } from 'react-redux';\nimport Backup from '../../components/Backup/Backup';\nimport { Helmet } from 'react-helmet';\nimport { Link } from 'react-router-dom';\nimport './Backups.scss';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\n\nconst Backups = props => {\n const { i18n } = useSelector(state => state.session);\n const { controlPanelFocusedElement } = useSelector(state => state.controlPanelContent);\n const { focusedElement } = useSelector(state => state.mainNavigation);\n const dispatch = useDispatch();\n const [loading, setLoading] = useState(false);\n const [modal, setModal] = useState({\n text: '',\n visible: false,\n actionUrl: ''\n });\n const [state, setState] = useState({\n backups: [],\n backupFav: [],\n toggledAll: false,\n selection: [],\n totalAmount: ''\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/backup/'));\n dispatch(removeFocusedElement());\n dispatch(removeControlPanelContentFocusedElement());\n fetchData().then(() => setLoading(false));\n\n return () => {\n dispatch(removeControlPanelContentFocusedElement());\n }\n }, []);\n\n useEffect(() => {\n window.addEventListener(\"keydown\", handleContentSelection);\n window.addEventListener(\"keydown\", handleFocusedElementShortcuts);\n\n return () => {\n window.removeEventListener(\"keydown\", handleContentSelection);\n window.removeEventListener(\"keydown\", handleFocusedElementShortcuts);\n };\n }, [controlPanelFocusedElement, focusedElement, state.backups]);\n\n const handleContentSelection = event => {\n if (event.keyCode === 38 || event.keyCode === 40) {\n if (focusedElement) {\n dispatch(MainNavigation.removeFocusedElement());\n }\n }\n\n if (event.keyCode === 38) {\n event.preventDefault();\n handleArrowUp();\n } else if (event.keyCode === 40) {\n event.preventDefault();\n handleArrowDown();\n }\n }\n\n const initFocusedElement = backups => {\n backups[0]['FOCUSED'] = backups[0]['NAME'];\n setState({ ...state, backups });\n dispatch(addControlPanelContentFocusedElement(backups[0]['NAME']));\n }\n\n const handleArrowDown = () => {\n let backups = [...state.backups];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(backups);\n return;\n }\n\n let focusedElementPosition = backups.findIndex(backup => backup.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== backups.length - 1) {\n let nextFocusedElement = backups[focusedElementPosition + 1];\n backups[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, backups });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleArrowUp = () => {\n let backups = [...state.backups];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(backups);\n return;\n }\n\n let focusedElementPosition = backups.findIndex(backup => backup.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== 0) {\n let nextFocusedElement = backups[focusedElementPosition - 1];\n backups[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, backups });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleFocusedElementShortcuts = event => {\n let isSearchInputFocused = document.querySelector('input:focus') || document.querySelector('textarea:focus');\n\n if (controlPanelFocusedElement && !isSearchInputFocused) {\n switch (event.keyCode) {\n case 8: return handleDelete();\n case 13: return configureRestoreSettings();\n case 68: return download();\n default: break;\n }\n }\n }\n\n const configureRestoreSettings = () => {\n props.history.push(`/list/backup?backup=${controlPanelFocusedElement}`);\n }\n\n const download = () => {\n window.open(`/api/v1/download/backup?backup=${controlPanelFocusedElement}`);\n }\n\n const handleDelete = () => {\n const { backups } = state;\n let currentBackupData = backups.filter(backup => backup.NAME === controlPanelFocusedElement)[0];\n\n displayModal(currentBackupData.delete_conf, `/api/v1/delete/cron/?job=${controlPanelFocusedElement}`);\n }\n\n const fetchData = () => {\n setLoading(true);\n return new Promise((resolve, reject) => {\n getBackupList()\n .then(result => {\n setState({\n ...state,\n backups: reformatData(result.data.data),\n backupFav: result.data.backup_fav,\n totalAmount: result.data.totalAmount,\n selection: [],\n toggledAll: false\n });\n resolve();\n })\n .catch(err => console.error(err));\n });\n }\n\n const reformatData = data => {\n let backups = [];\n\n for (let i in data) {\n data[i]['NAME'] = i;\n data[i]['isChecked'] = false;\n data[i]['FOCUSED'] = controlPanelFocusedElement === i;\n backups.push(data[i]);\n }\n\n return backups;\n }\n\n const backups = () => {\n const { backups } = state;\n const result = [];\n const backupFav = { ...state.backupFav };\n\n backups.forEach(backup => {\n backup.FOCUSED = controlPanelFocusedElement === backup.NAME;\n\n if (backupFav[backup.NAME]) {\n backup.STARRED = backupFav[backup.NAME];\n } else {\n backup.STARRED = 0;\n }\n\n result.push(backup);\n });\n\n return result.map((item, index) => {\n return ;\n });\n }\n\n const checkItem = name => {\n const { selection, backups } = state;\n let duplicate = [...selection];\n let backupDuplicate = [...backups];\n let checkedItem = duplicate.indexOf(name);\n\n let incomingItem = backupDuplicate.findIndex(backup => backup.NAME === name);\n backupDuplicate[incomingItem].isChecked = !backupDuplicate[incomingItem].isChecked;\n\n if (checkedItem !== -1) {\n duplicate.splice(checkedItem, 1);\n } else {\n duplicate.push(name);\n }\n\n setState({ ...state, backups: backupDuplicate, selection: duplicate });\n }\n\n const toggleFav = (value, type) => {\n const { backupFav } = state;\n let backupFavDuplicate = backupFav;\n\n if (type === 'add') {\n backupFavDuplicate[value] = 1;\n\n addFavorite(value, 'backup')\n .then(() => {\n setState({ ...state, backupFav: backupFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n } else {\n backupFavDuplicate[value] = undefined;\n\n deleteFavorite(value, 'backup')\n .then(() => {\n setState({ ...state, backupFav: backupFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n }\n }\n\n const toggleAll = toggled => {\n const backupsDuplicate = [...state.backups];\n\n if (toggled) {\n let backupNames = [];\n\n let backups = backupsDuplicate.map(backup => {\n backupNames.push(backup.NAME);\n backup.isChecked = true;\n return backup;\n });\n\n setState({ ...state, backups, selection: backupNames, toggledAll: toggled });\n } else {\n let backups = backupsDuplicate.map(backup => {\n backup.isChecked = false;\n return backup;\n });\n setState({ ...state, backups, selection: [], toggledAll: toggled });\n }\n }\n\n const bulk = action => {\n const { selection } = state;\n\n if (selection.length && action) {\n setLoading(true);\n bulkAction(action, selection)\n .then(result => {\n if (result.status === 200) {\n toggleAll(false);\n fetchData().then(() => refreshMenuCounters());\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n const displayModal = (text, url) => {\n setLoading(false);\n setModal({\n ...modal,\n visible: true,\n text: text,\n actionUrl: url\n });\n }\n\n const modalConfirmHandler = () => {\n if (!modal.actionUrl) {\n return modalCancelHandler();\n }\n\n modalCancelHandler();\n setLoading(true);\n handleAction(modal.actionUrl)\n .then(res => {\n if (res.data.error) {\n setLoading(false);\n return displayModal(res.data.error, '');\n }\n fetchData().then(() => refreshMenuCounters())\n })\n .catch(err => { setLoading(false); console.error(err); });\n }\n\n const refreshMenuCounters = () => {\n dispatch(refreshCounters()).then(() => setLoading(false));\n }\n\n const modalCancelHandler = () => {\n setModal({\n ...modal,\n visible: false,\n text: '',\n actionUrl: ''\n });\n }\n\n const scheduleBackupButton = () => {\n setLoading(true);\n scheduleBackup()\n .then(result => {\n if (result.data.error) {\n displayModal(result.data.error, '');\n } else {\n displayModal(result.data.ok, '');\n }\n })\n .catch(err => console.error(err));\n }\n\n return (\n \n
\n {`Vesta - ${i18n.BACKUP}`} \n \n
\n \n \n \n {i18n[\"Create Backup\"]} \n \n
\n \n
\n {i18n['backup exclusions']}\n \n \n props.changeSearchTerm(term)} />\n
\n
\n \n
\n {loading\n ?
\n : (<>\n {backups()}\n
{state.totalAmount}
\n >)}\n
\n
\n
\n );\n}\n\nexport default Backups;\n","import React, { useEffect, useState } from 'react';\nimport BackupRestoreSettings from '../../components/Backup/RestoreSettings/BackupRestoreSettings';\nimport { useHistory } from 'react-router-dom';\nimport Backups from '../Backups/Backups';\nimport QueryString from 'qs';\nimport { Helmet } from 'react-helmet';\nimport { useSelector } from 'react-redux';\n\nexport default function BackupWrapper(props) {\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const parsedQueryString = QueryString.parse(history.location.search, { ignoreQueryPrefix: true });\n const [isBackupSettings, setIsBackupSettings] = useState(false);\n\n useEffect(() => {\n if (parsedQueryString.backup) {\n setIsBackupSettings(true);\n } else {\n setIsBackupSettings(false);\n }\n }, [history.location]);\n\n return (\n <>\n \n {`Vesta - ${i18n.DNS}`} \n \n {\n isBackupSettings\n ? \n : \n }\n >\n );\n}","import React, { useEffect, useState } from 'react';\nimport { addActiveElement, removeFocusedElement } from \"src/actions/MainNavigation/mainNavigationActions\";\nimport AddItemLayout from 'src/components/ControlPanel/AddItemLayout/AddItemLayout';\nimport { getBanIps, addBanIp } from 'src/ControlPanelService/Firewalls';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Spinner from 'src/components/Spinner/Spinner';\nimport Toolbar from '../../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { Helmet } from 'react-helmet';\nimport HtmlParser from 'react-html-parser';\n\nconst AddBanIP = () => {\n const { i18n } = useSelector(state => state.session);\n const userLanguage = localStorage.getItem(\"language\");\n const history = useHistory();\n const dispatch = useDispatch();\n const [state, setState] = useState({\n banIps: [],\n errorMessage: '',\n okMessage: '',\n loading: false\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/firewall/'));\n dispatch(removeFocusedElement());\n\n setState({ ...state, loading: true });\n\n getBanIps()\n .then(result => {\n setState({ ...state, ip: result.data.ip, chain: result.data.chain, loading: false });\n });\n }, []);\n\n const submitFormHandler = event => {\n event.preventDefault();\n let newUser = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n newUser[name] = value;\n }\n\n if (Object.keys(newUser).length !== 0 && newUser.constructor === Object) {\n setState({ ...state, loading: true });\n addBanIp(newUser)\n .then(result => {\n if (result.status === 200) {\n const { error_msg, ok_msg } = result.data;\n\n if (error_msg) {\n setState({ ...state, errorMessage: error_msg, okMessage: '', loading: false });\n } else if (ok_msg) {\n setState({ ...state, errorMessage: '', okMessage: ok_msg, loading: false });\n } else {\n setState({ ...state, loading: false });\n }\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n const renderChainOptions = () => {\n return ['SSH', 'WEB', 'FTP', 'DNS', 'MAIL', 'DB', 'VESTA'].map((chain, index) => (\n {chain} \n ));\n }\n\n return (\n \n
\n {`Vesta - ${i18n.FIREWALL}`} \n \n
\n
\n {i18n['Adding IP Address to Banlist']}
\n {state.errorMessage ? : ''} {state.errorMessage}
\n \n {state.okMessage ? : ''} {HtmlParser(state.okMessage)} \n
\n \n
\n {state.loading ? :\n submitFormHandler(event)} id=\"add-user\">\n \n\n \n {i18n.Banlist} \n \n {renderChainOptions()}\n \n
\n\n \n \n {i18n['IP address']}\n ({i18n['CIDR format is supported']}) \n \n \n
\n\n \n {i18n.Add} \n history.push('/list/firewall/banlist')}>{i18n.Back} \n
\n\n \n }\n \n
\n );\n}\n\nexport default AddBanIP;\n","import React from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport ListItem from '../ControlPanel/ListItem/ListItem';\nimport Container from '../ControlPanel/Container/Container';\nimport './CronJob.scss';\nimport { Link } from 'react-router-dom';\nimport { useSelector } from 'react-redux';\n\nconst CronJob = props => {\n const { data } = props;\n const { i18n } = useSelector(state => state.session);\n const token = localStorage.getItem(\"token\");\n\n const toggleFav = (starred) => {\n if (starred) {\n props.toggleFav(props.data.NAME, 'add');\n } else {\n props.toggleFav(props.data.NAME, 'delete');\n }\n }\n\n const checkItem = () => {\n props.checkItem(props.data.NAME);\n }\n\n const handleSuspend = () => {\n let suspendedStatus = data.SUSPENDED === 'yes' ? 'unsuspend' : 'suspend' === 'yes' ? 'unsuspend' : 'suspend';\n props.handleModal(data.suspend_conf, `/api/v1/${suspendedStatus}/cron/index.php?job=${data.NAME}`);\n }\n\n const handleDelete = () => {\n props.handleModal(data.delete_conf, `/api/v1/delete/cron/index.php?job=${data.NAME}`);\n }\n\n return (\n \n\n \n {data.CMD}
\n \n
\n {i18n.Min} {data.MIN}
\n \n
\n {i18n.Hour} {data.HOUR}
\n \n
\n {i18n.Day} {data.DAY}
\n \n
\n {i18n.Month} {data.MONTH}
\n \n
\n {i18n['Day of week']} {data.WDAY}
\n \n
\n \n \n\n
\n \n {i18n.edit}\n {data.FOCUSED ? ↩ : }\n \n
\n\n
\n handleSuspend()}>\n {i18n[data.suspend_action]}\n {data.FOCUSED ? S : }\n \n
\n\n
\n handleDelete()}>\n {i18n.Delete}\n {data.FOCUSED ? Del : }\n \n
\n\n
\n \n );\n}\n\nexport default CronJob;","import React, { useState, useEffect } from 'react';\nimport { addControlPanelContentFocusedElement, removeControlPanelContentFocusedElement } from '../../actions/ControlPanelContent/controlPanelContentActions';\nimport { addActiveElement, removeFocusedElement } from '../../actions/MainNavigation/mainNavigationActions';\nimport DropdownFilter from '../../components/MainNav/Toolbar/DropdownFilter/DropdownFilter';\nimport { bulkAction, getCronList, handleAction } from '../../ControlPanelService/Cron';\nimport * as MainNavigation from '../../actions/MainNavigation/mainNavigationActions';\nimport SearchInput from '../../components/MainNav/Toolbar/SearchInput/SearchInput';\nimport { addFavorite, deleteFavorite } from '../../ControlPanelService/Favorites';\nimport LeftButton from '../../components/MainNav/Toolbar/LeftButton/LeftButton';\nimport Checkbox from '../../components/MainNav/Toolbar/Checkbox/Checkbox';\nimport Select from '../../components/MainNav/Toolbar/Select/Select';\nimport Toolbar from '../../components/MainNav/Toolbar/Toolbar';\nimport Modal from '../../components/ControlPanel/Modal/Modal';\nimport CronJob from '../../components/CronJob/CronJob';\nimport Spinner from '../../components/Spinner/Spinner';\nimport { useSelector, useDispatch } from 'react-redux';\nimport './CronJobs.scss';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\n\nconst CronJobs = props => {\n const { i18n } = useSelector(state => state.session);\n const { controlPanelFocusedElement } = useSelector(state => state.controlPanelContent);\n const { focusedElement } = useSelector(state => state.mainNavigation);\n const dispatch = useDispatch();\n const [loading, setLoading] = useState(false);\n const [modal, setModal] = useState({\n text: '',\n visible: false,\n actionUrl: '',\n });\n const [state, setState] = useState({\n cronJobs: [],\n cronFav: [],\n toggledAll: false,\n cronReports: '',\n sorting: i18n.Date,\n order: \"descending\",\n selection: [],\n totalAmount: ''\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/cron/'));\n dispatch(removeFocusedElement());\n dispatch(removeControlPanelContentFocusedElement());\n fetchData().then(() => setLoading(false));\n\n return () => {\n dispatch(removeControlPanelContentFocusedElement());\n }\n }, []);\n\n useEffect(() => {\n window.addEventListener(\"keydown\", handleContentSelection);\n window.addEventListener(\"keydown\", handleFocusedElementShortcuts);\n\n return () => {\n window.removeEventListener(\"keydown\", handleContentSelection);\n window.removeEventListener(\"keydown\", handleFocusedElementShortcuts);\n };\n }, [controlPanelFocusedElement, focusedElement, state.cronJobs]);\n\n const handleContentSelection = event => {\n if (event.keyCode === 38 || event.keyCode === 40) {\n if (focusedElement) {\n dispatch(MainNavigation.removeFocusedElement());\n }\n }\n\n if (event.keyCode === 38) {\n event.preventDefault();\n handleArrowUp();\n } else if (event.keyCode === 40) {\n event.preventDefault();\n handleArrowDown();\n }\n }\n\n const initFocusedElement = cronJobs => {\n cronJobs[0]['FOCUSED'] = cronJobs[0]['NAME'];\n setState({ ...state, cronJobs });\n dispatch(addControlPanelContentFocusedElement(cronJobs[0]['NAME']));\n }\n\n const handleArrowDown = () => {\n let cronJobs = [...state.cronJobs];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(cronJobs);\n return;\n }\n\n let focusedElementPosition = cronJobs.findIndex(cronJob => cronJob.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== cronJobs.length - 1) {\n let nextFocusedElement = cronJobs[focusedElementPosition + 1];\n cronJobs[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, cronJobs });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleArrowUp = () => {\n let cronJobs = [...state.cronJobs];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(cronJobs);\n return;\n }\n\n let focusedElementPosition = cronJobs.findIndex(cronJob => cronJob.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== 0) {\n let nextFocusedElement = cronJobs[focusedElementPosition - 1];\n cronJobs[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, cronJobs });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleFocusedElementShortcuts = event => {\n let isSearchInputFocused = document.querySelector('input:focus') || document.querySelector('textarea:focus');\n\n if (controlPanelFocusedElement && !isSearchInputFocused) {\n switch (event.keyCode) {\n case 8: return handleDelete();\n case 13: return handleEdit();\n case 83: return handleSuspend();\n default: break;\n }\n }\n }\n\n const handleEdit = () => {\n props.history.push(`/edit/cron?job=${controlPanelFocusedElement}`);\n }\n\n const handleSuspend = () => {\n const { cronJobs } = state;\n let currentCronJobData = cronJobs.filter(cronJob => cronJob.NAME === controlPanelFocusedElement)[0];\n let suspendedStatus = currentCronJobData.SUSPENDED === 'yes' ? 'unsuspend' : 'suspend';\n\n displayModal(currentCronJobData.suspend_conf, `/api/v1/${suspendedStatus}/cron/index.php?job=${controlPanelFocusedElement}`);\n }\n\n const handleDelete = () => {\n const { cronJobs } = state;\n let currentCronJobData = cronJobs.filter(cronJob => cronJob.NAME === controlPanelFocusedElement)[0];\n\n displayModal(currentCronJobData.delete_conf, `/api/v1/delete/cron/index.php?job=${controlPanelFocusedElement}`);\n }\n\n const fetchData = () => {\n setLoading(true);\n return new Promise((resolve, reject) => {\n getCronList()\n .then(result => {\n setState({\n ...state,\n cronJobs: reformatData(result.data.data),\n cronReports: result.data.cron_reports,\n cronFav: result.data.cron_fav,\n selection: [],\n toggledAll: false,\n totalAmount: result.data.totalAmount\n });\n resolve();\n })\n .catch(err => console.error(err));\n });\n }\n\n const reformatData = data => {\n let cronJobs = [];\n\n for (let i in data) {\n data[i]['NAME'] = i;\n data[i]['isChecked'] = false;\n data[i]['FOCUSED'] = controlPanelFocusedElement === i;\n cronJobs.push(data[i]);\n }\n\n return cronJobs;\n }\n\n const changeSorting = (sorting, order) => {\n setState({\n ...state,\n sorting,\n order\n });\n }\n\n const cronJobs = () => {\n const { cronJobs } = state;\n const result = [];\n const cronFav = { ...state.cronFav };\n\n cronJobs.forEach(cronJob => {\n cronJob.FOCUSED = controlPanelFocusedElement === cronJob.NAME;\n\n if (cronFav[cronJob.NAME]) {\n cronJob.STARRED = cronFav[cronJob.NAME];\n } else {\n cronJob.STARRED = 0;\n }\n\n result.push(cronJob);\n });\n\n let sortedResult = sortArray(result);\n\n return sortedResult.map((item, index) => {\n return ;\n });\n }\n\n const checkItem = name => {\n const { selection, cronJobs } = state;\n let duplicate = [...selection];\n let cronDuplicate = cronJobs;\n let checkedItem = duplicate.indexOf(name);\n\n let incomingItem = cronDuplicate.findIndex(cronJob => cronJob.NAME === name);\n cronDuplicate[incomingItem].isChecked = !cronDuplicate[incomingItem].isChecked;\n\n if (checkedItem !== -1) {\n duplicate.splice(checkedItem, 1);\n } else {\n duplicate.push(name);\n }\n\n setState({ ...state, cronJobs: cronDuplicate, selection: duplicate });\n }\n\n const sortArray = array => {\n const { order, sorting } = state;\n let sortingColumn = sortBy(sorting);\n\n if (order === \"descending\") {\n return array.sort((a, b) => (a[sortingColumn] < b[sortingColumn]) ? 1 : ((b[sortingColumn] < a[sortingColumn]) ? -1 : 0));\n } else {\n return array.sort((a, b) => (a[sortingColumn] > b[sortingColumn]) ? 1 : ((b[sortingColumn] > a[sortingColumn]) ? -1 : 0));\n }\n }\n\n const sortBy = sorting => {\n const { Date, Command, Starred } = i18n;\n\n switch (sorting) {\n case Date: return 'DATE';\n case Command: return 'CMD';\n case Starred: return 'STARRED';\n default: break;\n }\n }\n\n const toggleFav = (value, type) => {\n const { cronFav } = state;\n let cronFavDuplicate = cronFav;\n\n if (type === 'add') {\n cronFavDuplicate[value] = 1;\n\n addFavorite(value, 'cron')\n .then(() => {\n setState({ ...state, cronFav: cronFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n } else {\n cronFavDuplicate[value] = undefined;\n\n deleteFavorite(value, 'cron')\n .then(() => {\n setState({ ...state, cronFav: cronFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n }\n }\n\n const toggleAll = toggled => {\n const cronJobsDuplicate = [...state.cronJobs];\n\n if (toggled) {\n let cronJobNames = [];\n\n let cronJobs = cronJobsDuplicate.map(cronJob => {\n cronJobNames.push(cronJob.NAME);\n cronJob.isChecked = true;\n return cronJob;\n });\n\n setState({ ...state, cronJobs, selection: cronJobNames, toggledAll: toggled });\n } else {\n let cronJobs = cronJobsDuplicate.map(cronJob => {\n cronJob.isChecked = false;\n return cronJob;\n });\n setState({ ...state, cronJobs, selection: [], toggledAll: toggled });\n }\n }\n\n const bulk = action => {\n const { selection } = state;\n const notifications = state.cronReports === 'yes' ? 'delete-cron-reports' : 'add-cron-reports';\n\n if (action === notifications) {\n return handleCronNotifications();\n }\n\n if (selection.length && action) {\n setLoading(true);\n bulkAction(action, selection)\n .then(result => {\n if (result.status === 200) {\n toggleAll(false);\n fetchData().then(() => refreshMenuCounters());\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n const displayModal = (text, url) => {\n setModal({\n ...modal,\n visible: !state.modalVisible,\n text,\n actionUrl: url\n });\n }\n\n const modalConfirmHandler = () => {\n if (!modal.actionUrl) {\n return modalCancelHandler();\n }\n\n modalCancelHandler();\n setLoading(true);\n handleAction(modal.actionUrl)\n .then(res => {\n if (res.data.error) {\n setLoading(false);\n return displayModal(res.data.error, '');\n }\n fetchData().then(() => refreshMenuCounters())\n })\n .catch(err => { setLoading(false); console.error(err); });\n }\n\n const refreshMenuCounters = () => {\n dispatch(refreshCounters()).then(() => setLoading(false));\n }\n\n const modalCancelHandler = () => {\n setModal({\n ...modal,\n visible: false,\n text: '',\n actionUrl: ''\n });\n }\n\n const handleCronNotifications = () => {\n const token = localStorage.getItem(\"token\");\n const url = `/api/v1/${state.cronReports === 'yes' ? 'delete' : 'add'}/cron/reports/?token=${token}`;\n\n handleAction(url)\n .then(res => {\n displayModal(res.data.message, '');\n fetchData();\n })\n .catch(err => console.error(err));\n }\n\n return (\n \n
\n {`Vesta - ${i18n.CRON}`} \n \n
\n \n \n
\n \n {state.cronReports === 'yes' ? i18n['turn off notifications'] : i18n['turn on notifications']}\n \n \n \n \n props.changeSearchTerm(term)} />\n
\n
\n \n
\n {loading\n ?
\n : (<>\n {cronJobs()}\n
{state.totalAmount}
\n >)}\n
\n
\n
\n );\n}\n\nexport default CronJobs;\n","import React, { } from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Container from '../ControlPanel/Container/Container';\nimport ListItem from '../ControlPanel/ListItem/ListItem';\nimport './Package.scss';\nimport { Link } from 'react-router-dom';\nimport { useSelector } from 'react-redux';\n\nconst Package = props => {\n const { data } = props;\n const { i18n } = useSelector(state => state.session);\n\n const printNameServers = servers => {\n let serversArray = servers.split(',');\n\n return serversArray.map(\n (server, index) => {server}
\n );\n }\n\n const toggleFav = (starred) => {\n if (starred) {\n props.toggleFav(data.NAME, 'add');\n } else {\n props.toggleFav(data.NAME, 'delete');\n }\n }\n\n const checkItem = () => {\n props.checkItem(data.NAME);\n }\n\n const handleDelete = () => {\n props.handleModal(data.delete_conf, `/api/v1/delete/package/index.php?package=${data.NAME}`);\n }\n\n return (\n \n\n \n {data.NAME}
\n {data.FNAME} {data.LNAME}
\n \n
\n {i18n['Web Template']}: {data.WEB_TEMPLATE}
\n {i18n['Proxy Template']}: {data.PROXY_TEMPLATE}
\n {i18n['DNS Template']}: {data.DNS_TEMPLATE}
\n {i18n['SSH Access']}: {data.SHELL}
\n {i18n['Web Domains']}: {data.WEB_DOMAINS}
\n {i18n['Web Aliases']}: {data.WEB_ALIASES}
\n \n
\n {i18n['DNS domains']}: {data.DNS_DOMAINS}
\n {i18n['DNS records']}: {data.DNS_RECORDS}
\n {i18n['Mail Domains']}: {data.MAIL_DOMAINS}
\n {i18n['Mail Accounts']}: {data.MAIL_ACCOUNTS}
\n {i18n.Databases}: {data.DATABASES}
\n {i18n['Cron Jobs']}: {data.CRON_JOBS}
\n \n
\n {i18n.Backups}: {data.BACKUPS}
\n {i18n.Bandwidth}: {data.BANDWIDTH} {i18n.mb}
\n {i18n.Disk}: {data.DISK_QUOTA} {i18n.mb}
\n {i18n['Name Servers']}: {printNameServers(data.NS)}
\n \n
\n \n \n
\n \n {i18n.edit}\n {data.FOCUSED ? ↩ : }\n \n
\n\n
\n handleDelete()}>\n {i18n.Delete}\n {data.FOCUSED ? Del : }\n \n
\n
\n \n );\n}\n\nexport default Package;","import React, { useEffect, useState } from 'react';\nimport { addControlPanelContentFocusedElement, removeControlPanelContentFocusedElement } from '../../actions/ControlPanelContent/controlPanelContentActions';\nimport { addActiveElement, removeFocusedElement } from '../../actions/MainNavigation/mainNavigationActions';\nimport { bulkAction, getPackageList, handleAction } from '../../ControlPanelService/Package';\nimport DropdownFilter from '../../components/MainNav/Toolbar/DropdownFilter/DropdownFilter';\nimport * as MainNavigation from '../../actions/MainNavigation/mainNavigationActions';\nimport SearchInput from '../../components/MainNav/Toolbar/SearchInput/SearchInput';\nimport { addFavorite, deleteFavorite } from '../../ControlPanelService/Favorites';\nimport LeftButton from '../../components/MainNav/Toolbar/LeftButton/LeftButton';\nimport Checkbox from '../../components/MainNav/Toolbar/Checkbox/Checkbox';\nimport Select from '../../components/MainNav/Toolbar/Select/Select';\nimport Toolbar from '../../components/MainNav/Toolbar/Toolbar';\nimport Modal from '../../components/ControlPanel/Modal/Modal';\nimport Package from '../../components/Package/Package';\nimport Spinner from '../../components/Spinner/Spinner';\nimport { useDispatch, useSelector } from 'react-redux';\nimport './Packages.scss';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\n\nconst Packages = props => {\n const { i18n } = useSelector(state => state.session);\n const { controlPanelFocusedElement } = useSelector(state => state.controlPanelContent);\n const { focusedElement } = useSelector(state => state.mainNavigation);\n const dispatch = useDispatch();\n const [loading, setLoading] = useState(false);\n const [modal, setModal] = useState({\n text: '',\n visible: false,\n actionUrl: ''\n });\n const [state, setState] = useState({\n packages: [],\n packagesFav: [],\n toggledAll: false,\n sorting: i18n.Date,\n order: \"descending\",\n selection: [],\n totalAmount: ''\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/package/'));\n dispatch(removeFocusedElement());\n dispatch(removeControlPanelContentFocusedElement());\n fetchData().then(() => setLoading(false));\n\n return () => {\n dispatch(removeControlPanelContentFocusedElement());\n }\n }, []);\n\n useEffect(() => {\n window.addEventListener(\"keydown\", handleContentSelection);\n window.addEventListener(\"keydown\", handleFocusedElementShortcuts);\n\n return () => {\n window.removeEventListener(\"keydown\", handleContentSelection);\n window.removeEventListener(\"keydown\", handleFocusedElementShortcuts);\n };\n }, [controlPanelFocusedElement, focusedElement, state.packages]);\n\n const handleContentSelection = event => {\n if (event.keyCode === 38 || event.keyCode === 40) {\n if (focusedElement) {\n dispatch(MainNavigation.removeFocusedElement());\n }\n }\n\n if (event.keyCode === 38) {\n event.preventDefault();\n handleArrowUp();\n } else if (event.keyCode === 40) {\n event.preventDefault();\n handleArrowDown();\n }\n }\n\n const initFocusedElement = packages => {\n packages[0]['FOCUSED'] = packages[0]['NAME'];\n setState({ ...state, packages });\n dispatch(addControlPanelContentFocusedElement(packages[0]['NAME']));\n }\n\n const handleArrowDown = () => {\n let packages = [...state.packages];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(packages);\n return;\n }\n\n let focusedElementPosition = packages.findIndex(pack => pack.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== packages.length - 1) {\n let nextFocusedElement = packages[focusedElementPosition + 1];\n packages[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, packages });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleArrowUp = () => {\n let packages = [...state.packages];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(packages);\n return;\n }\n\n let focusedElementPosition = packages.findIndex(pack => pack.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== 0) {\n let nextFocusedElement = packages[focusedElementPosition - 1];\n packages[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, packages });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleFocusedElementShortcuts = event => {\n let isSearchInputFocused = document.querySelector('input:focus') || document.querySelector('textarea:focus');\n\n if (controlPanelFocusedElement && !isSearchInputFocused) {\n switch (event.keyCode) {\n case 8: return handleDelete();\n case 13: return handleEdit();\n default: break;\n }\n }\n }\n\n const handleEdit = () => {\n props.history.push(`/edit/package/?package=${controlPanelFocusedElement}`);\n }\n\n const handleDelete = () => {\n const { packages } = state;\n let currentPackageData = packages.filter(pack => pack.NAME === controlPanelFocusedElement)[0];\n\n displayModal(currentPackageData.delete_conf, `/api/v1/delete/package/index.php?package=${controlPanelFocusedElement}`);\n }\n\n const fetchData = () => {\n setLoading(true);\n return new Promise((resolve, reject) => {\n getPackageList()\n .then(result => {\n setState({\n ...state,\n packages: reformatData(result.data.data),\n packagesFav: result.data.packagesFav,\n totalAmount: result.data.totalAmount,\n selection: [],\n toggledAll: false\n });\n resolve();\n })\n .catch(err => console.error(err));\n });\n }\n\n const reformatData = data => {\n let packages = [];\n\n for (let i in data) {\n data[i]['NAME'] = i;\n data[i]['FOCUSED'] = controlPanelFocusedElement === i;\n packages.push(data[i]);\n }\n\n return packages;\n }\n\n const changeSorting = (sorting, order) => {\n setState({\n ...state,\n sorting,\n order\n });\n }\n\n const packages = () => {\n const { packages } = state;\n const packagesFav = { ...state.packagesFav };\n const result = [];\n\n packages.forEach(pack => {\n pack.FOCUSED = controlPanelFocusedElement === pack.NAME;\n\n if (packagesFav[pack.NAME]) {\n pack.STARRED = packagesFav[pack.NAME];\n } else {\n pack.STARRED = 0;\n }\n\n result.push(pack);\n });\n\n let sortedResult = sortArray(result);\n\n return sortedResult.map((item, index) => {\n return ;\n });\n }\n\n const checkItem = name => {\n const { selection, packages } = state;\n let duplicate = [...selection];\n let packagesDuplicate = packages;\n let checkedItem = duplicate.indexOf(name);\n\n let incomingItem = packagesDuplicate.findIndex(pack => pack.NAME === name);\n packagesDuplicate[incomingItem].isChecked = !packagesDuplicate[incomingItem].isChecked;\n\n if (checkedItem !== -1) {\n duplicate.splice(checkedItem, 1);\n } else {\n duplicate.push(name);\n }\n\n setState({ ...state, packages: packagesDuplicate, selection: duplicate });\n }\n\n const sortArray = array => {\n const { order, sorting } = state;\n let sortingColumn = sortBy(sorting);\n\n if (order === \"descending\") {\n return array.sort((a, b) => (a[sortingColumn] < b[sortingColumn]) ? 1 : ((b[sortingColumn] < a[sortingColumn]) ? -1 : 0));\n } else {\n return array.sort((a, b) => (a[sortingColumn] > b[sortingColumn]) ? 1 : ((b[sortingColumn] > a[sortingColumn]) ? -1 : 0));\n }\n }\n\n const sortBy = sorting => {\n const { Date, Starred } = i18n;\n\n switch (sorting) {\n case Date: return 'DATE';\n case i18n['Package Name']: return 'NAME';\n case Starred: return 'STARRED';\n default: break;\n }\n }\n\n const toggleFav = (value, type) => {\n const { packagesFav } = state;\n let packagesFavDuplicate = packagesFav;\n\n if (type === 'add') {\n packagesFavDuplicate[value] = 1;\n\n addFavorite(value, 'package')\n .then(() => {\n setState({ ...state, packagesFav: packagesFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n } else {\n packagesFavDuplicate[value] = undefined;\n\n deleteFavorite(value, 'package')\n .then(() => {\n setState({ ...state, packagesFav: packagesFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n }\n }\n\n const toggleAll = toggled => {\n const packagesDuplicate = [...state.packages];\n\n if (toggled) {\n let packageNames = [];\n\n let packages = packagesDuplicate.map(pack => {\n packageNames.push(pack.NAME);\n pack.isChecked = true;\n return pack;\n });\n\n setState({ ...state, packages, selection: packageNames, toggledAll: toggled });\n } else {\n let packages = packagesDuplicate.map(pack => {\n pack.isChecked = false;\n return pack;\n });\n\n setState({ ...state, packages, selection: [], toggledAll: toggled });\n }\n }\n\n const bulk = action => {\n const { selection } = state;\n\n if (selection.length && action) {\n setLoading(true);\n bulkAction(action, selection)\n .then(result => {\n if (result.status === 200) {\n toggleAll(false);\n fetchData().then(() => refreshMenuCounters());\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n const displayModal = (text, actionUrl) => {\n setModal({ ...modal, visible: !modal.visible, text, actionUrl })\n }\n\n const modalConfirmHandler = () => {\n if (!modal.actionUrl) {\n return modalCancelHandler();\n }\n\n modalCancelHandler();\n setLoading(true);\n handleAction(modal.actionUrl)\n .then(res => {\n if (res.data.error) {\n setLoading(false);\n return displayModal(res.data.error, '');\n }\n fetchData().then(() => refreshMenuCounters())\n })\n .catch(err => { setLoading(false); console.error(err); });\n }\n\n const refreshMenuCounters = () => {\n dispatch(refreshCounters()).then(() => setLoading(false));\n }\n\n const modalCancelHandler = () => {\n setModal({ ...modal, visible: false, text: '', actionUrl: '' })\n }\n\n return (\n \n
\n {`Vesta - ${i18n.PACKAGE}`} \n \n
\n \n \n
\n \n \n \n props.changeSearchTerm(term)} />\n
\n
\n \n
\n {\n loading\n ?
\n : (<>\n {packages()}\n
{state.totalAmount}
\n >)\n }\n
\n
\n
\n );\n}\n\nexport default Packages;\n","import axios from \"axios\";\n\nconst webApiUri = '/api/v1/languages.php';\nconst BASE_URL = window.location.origin;\n\nexport const getLanguages = () => {\n return axios.get(BASE_URL + webApiUri);\n}\n\nexport const languagesMock = [\n \"ar\",\n \"az\",\n \"bg\",\n \"bs\",\n \"cn\",\n \"cz\",\n \"da\",\n \"de\",\n \"el\",\n \"en\",\n \"es\",\n \"fa\",\n \"fi\",\n \"fr\",\n \"hu\",\n \"id\",\n \"it\",\n \"ja\",\n \"ka\",\n \"ko\",\n \"nl\",\n \"no\",\n \"pl\",\n \"pt-BR\",\n \"pt\",\n \"ro\",\n \"ru\",\n \"se\",\n \"sr\",\n \"th\",\n \"tr\",\n \"tw\",\n \"ua\",\n \"ur\",\n \"vi\"\n];","import React, { useEffect, useState } from 'react';\nimport { addActiveElement, removeFocusedElement } from \"../../../actions/MainNavigation/mainNavigationActions\";\nimport Password from '../../../components/ControlPanel/AddItemLayout/Form/Password/Password';\nimport AddItemLayout from '../../ControlPanel/AddItemLayout/AddItemLayout';\nimport { getLanguages } from '../../../ControlPanelService/Languages';\nimport { getPackageList } from '../../../ControlPanelService/Package';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { addUser } from '../../../ControlPanelService/Users';\nimport Spinner from '../../../components/Spinner/Spinner';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport { useHistory } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\n\nimport './AddUser.scss';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\nimport HtmlParser from 'react-html-parser';\n\nconst AddUser = props => {\n const { i18n } = useSelector(state => state.session);\n const { session } = useSelector(state => state.userSession);\n const userLanguage = localStorage.getItem(\"language\");\n const history = useHistory();\n const dispatch = useDispatch();\n const [state, setState] = useState({\n vEmail: '',\n vNotify: '',\n languages: [],\n packages: [],\n errorMessage: '',\n okMessage: '',\n loading: false\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/user/'));\n dispatch(removeFocusedElement());\n\n setState({ ...state, loading: true });\n\n Promise.all([getAllPackages(), getAllLanguages()])\n .then(result => {\n const [packages, languages] = result;\n let packageNames = getPackageNames(packages.data.data);\n\n setState({ ...state, packages: packageNames, languages: languages.data, loading: false });\n });\n }, []);\n\n const getAllPackages = () => {\n return getPackageList().catch(err => console.error(err));\n }\n\n const getAllLanguages = () => {\n return getLanguages().catch(err => console.error(err));\n }\n\n const getPackageNames = packages => {\n let result = [];\n\n for (let i in packages) {\n result.push(i);\n }\n\n return result;\n }\n\n const submitFormHandler = event => {\n event.preventDefault();\n let newUser = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n newUser[name] = value;\n }\n\n if (Object.keys(newUser).length !== 0 && newUser.constructor === Object) {\n setState({ ...state, loading: true });\n addUser(newUser)\n .then(result => {\n const { error_msg: errorMessage, ok_msg: okMessage } = result.data;\n\n if (errorMessage) {\n setState({ ...state, errorMessage, okMessage, loading: false });\n } else {\n dispatch(refreshCounters()).then(() => {\n setState({ ...state, okMessage, errorMessage: '', loading: false });\n });\n }\n })\n .catch(err => {\n setState({ ...state, loading: false });\n console.error(err);\n });\n }\n }\n\n const renderPackageOptions = () => {\n return state.packages.map((pack, index) => (\n {pack} \n ));\n }\n\n const renderLanguageOptions = () => {\n return state.languages.map((language, index) => (\n {language} \n ));\n }\n\n const onChangeEmail = value => {\n setState({ ...state, vEmail: value });\n }\n\n const onBlurEmail = () => {\n if (!state.vNotify) {\n setState({ ...state, vNotify: state.vEmail });\n }\n }\n\n const onChangeSecondEmail = value => {\n setState({ ...state, vNotify: value });\n }\n\n const repeatEmailHandler = checked => {\n if (checked) {\n if (state.vEmail) {\n setState({ ...state, vNotify: state.vEmail });\n }\n } else {\n setState({ ...state, vNotify: '' });\n }\n }\n\n return (\n \n
\n {`Vesta - ${i18n.USER}`} \n \n
\n
\n {i18n['Adding User']}
\n {state.errorMessage ? : ''} {state.errorMessage}
\n \n {state.okMessage ? : ''} {HtmlParser(state.okMessage)} \n
\n \n
\n {state.loading ? :\n submitFormHandler(event)} id=\"add-user\">\n \n {i18n.Username} \n \n
\n\n \n\n \n\n \n {i18n.Package} \n \n {renderPackageOptions()}\n \n
\n\n \n {i18n.Language} \n \n {renderLanguageOptions()}\n \n
\n\n \n {i18n['First Name']} \n \n
\n\n \n {i18n['Last Name']} \n \n
\n\n \n {i18n['Send login credentials to email address']} \n onChangeSecondEmail(e.target.value)}\n name=\"v_notify\" />\n
\n\n \n {i18n.Add} \n history.push('/list/user/')}>{i18n.Back} \n
\n\n \n }\n \n
\n );\n}\n\nexport default AddUser;","import axios from \"axios\";\nimport { getAuthToken } from \"src/utils/token\";\n\nconst deleteAutoUpdateUri = '/api/v1/delete/cron/autoupdate/';\nconst addAutoUpdateUri = '/api/v1/add/cron/autoupdate/';\nconst webApiUri = '/api/v1/list/updates/index.php';\nconst BASE_URL = window.location.origin;\n\nexport const getUpdatesList = () => {\n return axios.get(BASE_URL + webApiUri);\n}\n\nexport const bulkAction = (action, updates) => {\n const formData = new FormData();\n formData.append(\"action\", action);\n formData.append(\"token\", getAuthToken());\n\n updates.forEach(update => {\n formData.append(\"pkg[]\", update);\n });\n\n return axios.post(BASE_URL + '/api/v1/bulk/vesta/', formData);\n};\n\nexport const handleAction = uri => {\n return axios.get(BASE_URL + uri, {\n params: {\n token: getAuthToken()\n }\n });\n}\n\nexport const enableAutoUpdate = () => {\n return axios.get(`${BASE_URL}${addAutoUpdateUri}`, {\n params: {\n token: getAuthToken()\n }\n });\n};\n\nexport const disableAutoUpdate = () => {\n return axios.get(`${BASE_URL}${deleteAutoUpdateUri}`, {\n params: {\n token: getAuthToken()\n }\n });\n};","import React, { } from 'react';\nimport { useSelector } from 'react-redux';\nimport Container from '../ControlPanel/Container/Container';\nimport ListItem from '../ControlPanel/ListItem/ListItem';\nimport './Update.scss';\n\nconst Update = props => {\n const { data } = props;\n const { i18n } = useSelector(state => state.session);\n\n const isUpdated = status => {\n if (status === 'no') {\n return 'OUTDATED';\n }\n\n return 'UPDATED';\n }\n\n const isOutdated = status => {\n return status === \"no\";\n }\n\n const checkItem = () => {\n props.checkItem(props.data.NAME);\n }\n\n return (\n \n\n \n {data.NAME}
\n \n
\n {data.DESCR}
\n \n
\n {i18n.Version}: {data.VERSION} {`(${data.ARCH})`}
\n \n
\n {i18n.Release}: {data.RELEASE}
\n \n
\n \n\n \n );\n}\n\nexport default Update;","import React, { useEffect, useState } from 'react';\nimport { addControlPanelContentFocusedElement, removeControlPanelContentFocusedElement } from '../../actions/ControlPanelContent/controlPanelContentActions';\nimport { addActiveElement, removeFocusedElement } from '../../actions/MainNavigation/mainNavigationActions';\nimport { bulkAction, getUpdatesList, enableAutoUpdate, disableAutoUpdate } from '../../ControlPanelService/Updates';\nimport * as MainNavigation from '../../actions/MainNavigation/mainNavigationActions';\nimport SearchInput from '../../components/MainNav/Toolbar/SearchInput/SearchInput';\nimport LeftButton from '../../components/MainNav/Toolbar/LeftButton/LeftButton';\nimport Modal from 'src/components/ControlPanel/Modal/Modal';\nimport Checkbox from '../../components/MainNav/Toolbar/Checkbox/Checkbox';\nimport Select from '../../components/MainNav/Toolbar/Select/Select';\nimport Toolbar from '../../components/MainNav/Toolbar/Toolbar';\nimport { useDispatch, useSelector } from 'react-redux';\nimport Spinner from '../../components/Spinner/Spinner';\nimport Update from '../../components/Update/Update';\nimport './Updates.scss';\nimport { Helmet } from 'react-helmet';\n\nconst Updates = props => {\n const { i18n } = useSelector(state => state.session);\n const { controlPanelFocusedElement } = useSelector(state => state.controlPanelContent);\n const { focusedElement } = useSelector(state => state.mainNavigation);\n const dispatch = useDispatch();\n const [state, setState] = useState({\n updates: [],\n selection: [],\n autoUpdate: '',\n token: '',\n loading: false,\n toggledAll: false\n });\n const [modal, setModal] = useState({\n text: '',\n visible: false,\n actionUrl: ''\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/updates/'));\n dispatch(removeFocusedElement());\n dispatch(removeControlPanelContentFocusedElement());\n fetchData();\n\n return () => {\n dispatch(removeControlPanelContentFocusedElement());\n }\n }, []);\n\n useEffect(() => {\n window.addEventListener(\"keydown\", handleContentSelection);\n\n return () => {\n window.removeEventListener(\"keydown\", handleContentSelection);\n };\n }, [controlPanelFocusedElement, focusedElement, state.updates]);\n\n const handleContentSelection = event => {\n if (event.keyCode === 38 || event.keyCode === 40) {\n if (focusedElement) {\n dispatch(MainNavigation.removeFocusedElement());\n }\n }\n\n if (event.keyCode === 38) {\n event.preventDefault();\n handleArrowUp();\n } else if (event.keyCode === 40) {\n event.preventDefault();\n handleArrowDown();\n }\n }\n\n const initFocusedElement = updates => {\n updates[0]['FOCUSED'] = updates[0]['NAME'];\n setState({ ...state, updates });\n dispatch(addControlPanelContentFocusedElement(updates[0]['NAME']));\n }\n\n const handleArrowDown = () => {\n let updates = [...state.updates];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(updates);\n return;\n }\n\n let focusedElementPosition = updates.findIndex(update => update.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== updates.length - 1) {\n let nextFocusedElement = updates[focusedElementPosition + 1];\n updates[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, updates });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleArrowUp = () => {\n let updates = [...state.updates];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(updates);\n return;\n }\n\n let focusedElementPosition = updates.findIndex(update => update.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== 0) {\n let nextFocusedElement = updates[focusedElementPosition - 1];\n updates[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, updates });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const fetchData = () => {\n setState({ ...state, loading: true });\n\n getUpdatesList()\n .then(result => {\n setState({\n ...state,\n selection: [],\n updates: reformatData(result.data.data),\n autoUpdate: result.data.autoUpdate,\n loading: false\n });\n })\n .catch(err => console.error(err));\n }\n\n const reformatData = data => {\n let updates = [];\n\n for (let i in data) {\n data[i]['NAME'] = i;\n data[i]['FOCUSED'] = controlPanelFocusedElement === i;\n updates.push(data[i]);\n }\n\n return updates;\n }\n\n const updates = () => {\n let updates = [...state.updates];\n\n updates.forEach(update => {\n update.FOCUSED = controlPanelFocusedElement === update.NAME;\n });\n\n return updates.map((item, index) => {\n return ;\n });\n }\n\n const checkItem = name => {\n let duplicate = [...state.selection];\n let updatesDuplicate = [...state.updates];\n let checkedItem = duplicate.indexOf(name);\n\n let incomingItem = updatesDuplicate.findIndex(update => update.NAME === name);\n updatesDuplicate[incomingItem].isChecked = !updatesDuplicate[incomingItem].isChecked;\n\n if (checkedItem !== -1) {\n duplicate.splice(checkedItem, 1);\n } else {\n duplicate.push(name);\n }\n\n setState({ ...state, updates: updatesDuplicate, selection: duplicate });\n }\n\n const toggleAll = toggled => {\n const updatesDuplicate = [...state.updates];\n\n if (toggled) {\n let updateNames = [];\n\n let updates = updatesDuplicate.map(update => {\n updateNames.push(update.NAME);\n update.isChecked = true;\n return update;\n });\n\n setState({ ...state, updates, selection: updateNames, toggledAll: toggled });\n } else {\n let updates = updatesDuplicate.map(update => {\n update.isChecked = false;\n return update;\n });\n\n setState({ ...state, updates, selection: [], toggledAll: toggled });\n }\n }\n\n const bulk = action => {\n const { selection } = state;\n\n if (selection.length && action !== 'apply to selected') {\n bulkAction(action, selection)\n .then(res => {\n toggleAll(false);\n if (res.status === 200) {\n if (res.data.error) {\n setState({ ...state, loading: false });\n return displayModal(res.data.error, '');\n }\n\n displayModal(res.data.message, '');\n fetchData();\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n const handleAutoUpdate = () => {\n if (state.autoUpdate === 'Enabled') {\n disableAutoUpdate()\n .then(res => {\n if (res.data.error) {\n setState({ ...state, loading: false });\n return displayModal(res.data.error, '');\n }\n\n displayModal(res.data.message, '');\n fetchData();\n })\n .catch(err => {\n setState({ ...state, loading: false });\n console.error(err);\n });\n } else {\n enableAutoUpdate()\n .then(res => {\n if (res.data.error) {\n setState({ ...state, loading: false });\n return displayModal(res.data.error, '');\n }\n\n displayModal(res.data.message, '');\n fetchData();\n })\n .catch(err => {\n setState({ ...state, loading: false });\n console.error(err);\n });\n }\n }\n\n const displayModal = (text, url) => {\n setState({ ...state, loading: true });\n setModal({\n ...modal,\n visible: true,\n text: text,\n actionUrl: url\n });\n }\n\n const modalCancelHandler = () => {\n setModal({\n ...modal,\n visible: false,\n text: '',\n actionUrl: ''\n });\n }\n\n const printAutoUpdateButtonName = () => {\n if (state.autoUpdate === 'Enabled') {\n return i18n['disable autoupdate'];\n } else {\n return i18n['enable autoupdate'];\n }\n }\n\n return (\n \n
\n {`Vesta - ${i18n.UPDATES}`} \n \n
\n \n \n
\n {printAutoUpdateButtonName()} \n \n \n props.changeSearchTerm(term)} />\n
\n
\n \n {state.loading ?
: updates()}\n
\n
\n );\n}\n\nexport default Updates;","import React from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Container from '../ControlPanel/Container/Container';\nimport ListItem from '../ControlPanel/ListItem/ListItem';\nimport './ServerSys.scss';\nimport { Link } from 'react-router-dom';\nimport { useSelector } from 'react-redux';\n\nconst Server = props => {\n const { data } = props;\n const { i18n } = useSelector(state => state.session);\n\n const checkItem = () => {\n props.checkItem(props.data.HOSTNAME);\n }\n\n return (\n \n\n \n {data.HOSTNAME}
\n \n
\n {data.OS} {data.VERSION} {`(${data.ARCH})`}
\n \n
\n {i18n['Load Average']}: {data.LOADAVERAGE}
\n \n
\n {i18n.Uptime}: {data.UPTIME}
\n \n
\n \n \n\n
\n \n {i18n.configure}\n {data.FOCUSED ? ↩ : }\n \n
\n\n
\n
props.handleAction(`/api/v1/restart/system/?hostname=${data.NAME}`)}>\n {i18n.restart}\n {\n data.FOCUSED\n ? R \n : \n \n \n \n }\n \n
\n
\n \n );\n}\n\nexport default Server;","import React from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Container from '../ControlPanel/Container/Container';\nimport ListItem from '../ControlPanel/ListItem/ListItem';\nimport './Server.scss';\nimport { Link } from 'react-router-dom';\nimport { useSelector } from 'react-redux';\n\nconst Server = props => {\n const { data } = props;\n const { i18n } = useSelector(state => state.session);\n\n const checkItem = () => {\n props.checkItem(data.NAME);\n }\n\n return (\n \n\n \n {data.NAME}
\n \n
\n {i18n[data.SYSTEM]}
\n \n
\n
\n {i18n.CPU}: {data.CPU}
\n \n
\n {i18n.Memory}: {data.MEM} {i18n.mb}
\n \n
\n {i18n.Uptime}: {data.RTIME}
\n \n
\n
\n \n \n\n
\n \n {i18n.configure}\n {data.FOCUSED ? ↩ : }\n \n
\n\n
\n props.handleAction('/api/v1' + data.action_url)}>\n {data.STATE === 'running' ? i18n.stop : i18n.start}\n {data.FOCUSED ? S : }\n \n
\n\n
\n
props.handleAction(`/api/v1/restart/service/?srv=${data.NAME}`)}>\n {i18n.restart}\n {\n data.FOCUSED\n ? R \n : \n \n \n \n }\n \n
\n\n
\n \n );\n}\n\nexport default Server;\n","import React, { useEffect, useState } from 'react';\nimport { addControlPanelContentFocusedElement, removeControlPanelContentFocusedElement } from '../../actions/ControlPanelContent/controlPanelContentActions';\nimport { addActiveElement, removeFocusedElement } from '../../actions/MainNavigation/mainNavigationActions';\nimport { bulkAction, getServersList, handleAction } from '../../ControlPanelService/Server';\nimport SearchInput from '../../components/MainNav/Toolbar/SearchInput/SearchInput';\nimport LeftButton from '../../components/MainNav/Toolbar/LeftButton/LeftButton';\nimport Checkbox from '../../components/MainNav/Toolbar/Checkbox/Checkbox';\nimport Select from '../../components/MainNav/Toolbar/Select/Select';\nimport Toolbar from '../../components/MainNav/Toolbar/Toolbar';\nimport Modal from '../../components/ControlPanel/Modal/Modal';\nimport ServerSys from '../../components/Server/ServerSys';\nimport Spinner from '../../components/Spinner/Spinner';\nimport { useDispatch, useSelector } from 'react-redux';\nimport Server from '../../components/Server/Server';\nimport { Link } from 'react-router-dom';\nimport { Helmet } from 'react-helmet';\nimport './Servers.scss';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\n\nconst Servers = props => {\n const { i18n } = useSelector(state => state.session);\n const { controlPanelFocusedElement } = useSelector(state => state.controlPanelContent);\n const { focusedElement } = useSelector(state => state.mainNavigation);\n const dispatch = useDispatch();\n const [loading, setLoading] = useState(false);\n const [modal, setModal] = useState({\n text: '',\n visible: false,\n actionUrl: '',\n });\n const [state, setState] = useState({\n servers: [],\n selection: [],\n toggledAll: false,\n sorting: i18n.Action,\n order: \"descending\",\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/server/'));\n dispatch(removeFocusedElement());\n dispatch(removeControlPanelContentFocusedElement());\n fetchData().then(() => setLoading(false));\n\n return () => {\n dispatch(removeControlPanelContentFocusedElement());\n }\n }, []);\n\n useEffect(() => {\n window.addEventListener(\"keydown\", handleContentSelection);\n window.addEventListener(\"keydown\", handleFocusedElementShortcuts);\n\n return () => {\n window.removeEventListener(\"keydown\", handleContentSelection);\n window.removeEventListener(\"keydown\", handleFocusedElementShortcuts);\n };\n }, [controlPanelFocusedElement, focusedElement, state.servers]);\n\n const handleContentSelection = event => {\n if (event.keyCode === 38 || event.keyCode === 40) {\n if (focusedElement) {\n dispatch(removeFocusedElement());\n }\n }\n\n if (event.keyCode === 38) {\n event.preventDefault();\n handleArrowUp();\n } else if (event.keyCode === 40) {\n event.preventDefault();\n handleArrowDown();\n }\n }\n\n const initFocusedElement = servers => {\n servers[0]['FOCUSED'] = servers[0]['NAME'];\n setState({ ...state, servers });\n dispatch(addControlPanelContentFocusedElement(servers[0]));\n }\n\n const handleArrowDown = () => {\n let servers = [...state.servers];\n\n if (focusedElement) {\n removeFocusedElement();\n }\n\n if (controlPanelFocusedElement.NAME === '' || controlPanelFocusedElement === '') {\n initFocusedElement(servers);\n return;\n }\n\n let focusedElementPosition = servers.findIndex(server => server.NAME === controlPanelFocusedElement.NAME);\n\n if (focusedElementPosition !== servers.length - 1) {\n let nextFocusedElement = servers[focusedElementPosition + 1];\n servers[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, servers });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement));\n }\n }\n\n const handleArrowUp = () => {\n let servers = [...state.servers];\n\n if (focusedElement) {\n removeFocusedElement();\n }\n\n if (controlPanelFocusedElement.NAME === '' || controlPanelFocusedElement === '') {\n initFocusedElement(servers);\n return;\n }\n\n let focusedElementPosition = servers.findIndex(server => server.NAME === controlPanelFocusedElement.NAME);\n\n if (focusedElementPosition !== 0) {\n let nextFocusedElement = servers[focusedElementPosition - 1];\n servers[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, servers });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement));\n }\n }\n\n const handleFocusedElementShortcuts = event => {\n let isSearchInputFocused = document.querySelector('input:focus') || document.querySelector('textarea:focus');\n\n if (controlPanelFocusedElement.NAME && !isSearchInputFocused) {\n switch (event.keyCode) {\n case 13: return handleConfigure();\n case 82: return handleRestart();\n case 83: return handleStop();\n default: break;\n }\n }\n }\n\n const handleConfigure = () => {\n if (controlPanelFocusedElement.NAME !== state.servers[0].NAME) {\n props.history.push(`/edit/server/${controlPanelFocusedElement.NAME}`);\n } else {\n props.history.push('/edit/server/');\n }\n }\n\n const handleStop = () => {\n onHandleAction('/api/v1' + controlPanelFocusedElement.action_url);\n }\n\n const handleRestart = () => {\n onHandleAction(`/api/v1/restart/service/?srv=${controlPanelFocusedElement.NAME}`);\n }\n\n const fetchData = () => {\n setLoading(true);\n return new Promise((resolve, reject) => {\n getServersList()\n .then(result => {\n setState({\n ...state,\n selection: [],\n toggledAll: false,\n servers: reformatData(result.data.data, result.data.sys)\n });\n resolve();\n })\n .catch(err => console.error(err));\n });\n }\n\n const reformatData = (servers, sysInfo) => {\n let result = [];\n\n for (let i in servers) {\n servers[i]['NAME'] = i;\n servers[i]['FOCUSED'] = controlPanelFocusedElement.NAME === i;\n\n result.push(servers[i]);\n }\n\n result.splice(0, 0, Object.values(sysInfo)[0]);\n result[0]['NAME'] = result[0]['HOSTNAME'];\n\n return result;\n }\n\n const servers = () => {\n const result = [];\n\n state.servers.forEach(server => {\n server.FOCUSED = controlPanelFocusedElement.NAME === server.NAME;\n result.push(server);\n });\n\n return result.map((item, index) => {\n if (item.HOSTNAME) {\n return \n } else {\n return \n }\n });\n }\n\n const onHandleAction = uri => {\n dispatch(removeControlPanelContentFocusedElement());\n if (uri) {\n setLoading(true);\n handleAction(uri)\n .then(res => {\n if (res.data.error) {\n displayModal(res.data.error);\n }\n\n setLoading(false);\n })\n .catch(err => {\n setLoading(false);\n console.error(err)\n });\n }\n }\n\n const toggleAll = toggled => {\n let serversDuplicate = [...state.servers];\n\n if (toggled) {\n let serverNames = [];\n\n let servers = serversDuplicate.map(server => {\n serverNames.push(server.NAME);\n server.isChecked = true;\n return server;\n });\n\n setState({ ...state, servers, selection: serverNames, toggledAll: toggled });\n } else {\n let servers = serversDuplicate.map(server => {\n server.isChecked = false;\n return server;\n });\n\n setState({ ...state, servers, selection: [], toggledAll: toggled });\n }\n }\n\n const bulk = action => {\n const { selection } = state;\n\n if (selection.length && action) {\n setState({ ...state, loading: true });\n bulkAction(action, selection)\n .then(res => {\n if (res.data.error) {\n displayModal(res.data.error);\n }\n\n toggleAll(false);\n fetchData().then(() => refreshMenuCounters());\n })\n .catch(err => console.error(err));\n }\n }\n\n const checkItem = name => {\n const { selection } = state;\n let duplicate = [...selection];\n let serversDuplicate = [...state.servers];\n let checkedItem = duplicate.indexOf(name);\n\n let incomingItem = serversDuplicate.findIndex(server => server.NAME === name);\n serversDuplicate[incomingItem].isChecked = !serversDuplicate[incomingItem].isChecked;\n\n if (checkedItem !== -1) {\n duplicate.splice(checkedItem, 1);\n } else {\n duplicate.push(name);\n }\n\n setState({ ...state, servers: serversDuplicate, selection: duplicate });\n }\n\n const displayModal = text => {\n setModal({ ...modal, visible: true, text });\n }\n\n const modalConfirmHandler = () => {\n if (!modal.actionUrl) {\n return modalCancelHandler();\n }\n\n modalCancelHandler();\n setLoading(true);\n handleAction(modal.actionUrl)\n .then(res => {\n if (res.data.error) {\n setLoading(false);\n return displayModal(res.data.error, '');\n }\n\n fetchData().then(() => refreshMenuCounters());\n })\n .catch(err => { setLoading(false); console.error(err); });\n }\n\n const refreshMenuCounters = () => {\n dispatch(refreshCounters()).then(() => setLoading(false));\n }\n\n const modalCancelHandler = () => {\n setModal({ ...modal, visible: false, text: '' });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.SERVER}`} \n \n
\n \n \n
\n {i18n['show: CPU / MEM / NET / DISK']}\n \n \n props.changeSearchTerm(term)} />\n
\n
\n \n {loading ?
: (\n
\n {servers()}\n
\n )}\n\n
\n
\n );\n}\n\nexport default Servers;\n","import React, { useEffect } from 'react';\nimport { addActiveElement } from '../../../actions/MainNavigation/mainNavigationActions';\nimport { useSelector, useDispatch } from \"react-redux\";\nimport { Link } from \"react-router-dom\";\n\nimport './Menu.scss';\n\nconst className = height => {\n if (height === 35) {\n return \"menu-stat shadow\";\n } else {\n return \"menu-stat\";\n }\n}\n\nconst style = ({ menuHeight, mobile }) => {\n if (mobile) {\n return;\n }\n\n if (document.documentElement.clientWidth > 900) {\n return menuHeight\n } else {\n return 45;\n }\n}\n\nconst Menu = props => {\n const { activeElement, focusedElement } = useSelector(state => state.mainNavigation);\n const { i18n } = useSelector(state => state.session);\n const { session: { look } } = useSelector(state => state.userSession);\n const { user } = useSelector(state => state.menuCounters);\n const dispatch = useDispatch();\n\n useEffect(() => {\n if (user.LANGUAGE) {\n localStorage.setItem(\"language\", user.LANGUAGE);\n }\n }, [user]);\n\n const handleState = (tab, event) => {\n if (`${window.location.pathname}${window.location.search}` === tab) {\n return event.preventDefault();\n }\n\n dispatch(addActiveElement(tab));\n }\n\n const statClassName = activeName => {\n return `stat ${activeName === activeElement && 'l-active'} ${activeName === focusedElement && 'focus'}`;\n }\n\n const sizeFormatter = (bytes, decimals) => {\n if (!bytes) return null;\n\n if (bytes === \"0\") {\n return 0 b ;\n }\n\n let k = 1024,\n dm = decimals <= 0 ? 0 : decimals || 2,\n sizes = ['b', 'kb', 'Mb', 'GB'],\n i = Math.floor(Math.log(bytes) / Math.log(k));\n return ({parseFloat((bytes / Math.pow(k, i)).toFixed(dm))} {sizes[i]} );\n }\n\n return (\n \n
\n
\n
handleState(\"/list/user/\", event)} onKeyPress={event => event.preventDefault()}>\n
{i18n.USER} \n
\n {\n look\n ? (<>\n
{i18n.Disk}: {sizeFormatter(user.U_DISK)}
\n
{i18n.Bandwidth}: {sizeFormatter(user.U_BANDWIDTH)}
\n >)\n : (<>\n
{i18n.users}: {user.U_USERS}
\n
{i18n.spnd}: {user.SUSPENDED_USERS}
\n >)\n }\n
\n \n
\n
\n
handleState(\"/list/web/\", event)} onKeyPress={event => event.preventDefault()}>\n
{i18n.WEB} \n
\n
{i18n.domains}: {user.U_WEB_DOMAINS}
\n
{i18n.aliases}: {user.U_WEB_ALIASES}
\n
{i18n.spnd}: {user.SUSPENDED_WEB}
\n
\n \n
\n
\n
handleState(\"/list/dns/\", event)} onKeyPress={event => event.preventDefault()}>\n
{i18n.DNS} \n
\n
{i18n.domains}: {user.U_DNS_DOMAINS}
\n
{i18n.records}: {user.U_DNS_RECORDS}
\n
{i18n.spnd}: {user.SUSPENDED_DNS}
\n
\n \n
\n
\n
handleState(\"/list/mail/\", event)} onKeyPress={event => event.preventDefault()}>\n
{i18n.MAIL} \n
\n
{i18n.domains}: {user.U_MAIL_DOMAINS}
\n
{i18n.accounts}: {user.U_MAIL_ACCOUNTS}
\n
{i18n.spnd}: {user.SUSPENDED_MAIL}
\n
\n \n
\n
\n
handleState(\"/list/db/\", event)} onKeyPress={event => event.preventDefault()}>\n
{i18n.DB} \n
\n
{i18n.databases}: {user.U_DATABASES}
\n
{i18n.spnd}: {user.SUSPENDED_DB}
\n
\n \n
\n
\n
handleState(\"/list/cron/\", event)} onKeyPress={event => event.preventDefault()}>\n
{i18n.CRON} \n
\n
{i18n.jobs}: {user.U_CRON_JOBS}
\n
{i18n.spnd}: {user.SUSPENDED_CRON}
\n
\n \n
\n
\n
handleState(\"/list/backup/\", event)} onKeyPress={event => event.preventDefault()}>\n
{i18n.BACKUP} \n
\n
{i18n.backups}: {user.U_BACKUPS}
\n
\n \n
\n
\n
\n );\n}\n\nexport default Menu;\n","import React, { Component } from 'react';\nimport Menu from '../../MainNav/Stat-menu/Menu';\nimport Toolbar from '../../MainNav/Toolbar/Toolbar';\nimport './MobileTopNav.scss';\n\nclass MobileTopNav extends Component {\n render() {\n return (\n \n
\n
\n
Packages
\n
IP
\n
Graphs
\n
Statistics
\n
Log
\n
\n
\n
Updates
\n
Firewall
\n
File Manager
\n
Apps
\n
Server
\n
\n
\n
\n
\n \n
\n \n
\n
\n );\n }\n}\n\nexport default MobileTopNav;","import axios from \"axios\";\nimport { getAuthToken } from \"src/utils/token\";\nlet BASE_URL = window.location.origin;\nlet getNotificationsUri = '/api/v1/list/notifications/index.php';\nlet deleteNotificationsUri = '/api/v1/delete/notification/index.php';\n\nexport const getAppNotifications = () => {\n return axios.get(BASE_URL + getNotificationsUri, {\n params: {\n ajax: 1,\n token: getAuthToken()\n }\n });\n}\n\nexport const deleteNotification = id => {\n return axios.get(BASE_URL + deleteNotificationsUri, {\n params: {\n 'delete': 1,\n 'notification_id': id,\n token: getAuthToken()\n }\n });\n}","import React from 'react';\n\nexport default function Bell(props) {\n return (\n \n \n \n );\n}\n","import React from 'react';\n\nexport default function BellUnread(props) {\n return (\n \n \n \n );\n}\n","import React, { useState, useEffect } from 'react';\nimport { getAppNotifications, deleteNotification } from 'src/ControlPanelService/Notifications';\nimport { addNotifications } from 'src/actions/Notification/notificationActions';\nimport Bell from './Bell';\nimport BellUnread from './BellUnread';\nimport { useDispatch, useSelector } from 'react-redux';\nimport './Notifications.scss';\nimport HtmlParser from 'react-html-parser';\n\nconst Notifications = () => {\n const { i18n } = useSelector(state => state.session);\n const { notifications } = useSelector(state => state.notifications);\n const dispatch = useDispatch();\n const [loading, setLoading] = useState(false);\n\n useEffect(() => {\n if (!notifications) {\n fetchData();\n }\n }, [notifications]);\n\n const fetchData = () => {\n setLoading(true);\n getAppNotifications()\n .then(res => {\n const result = [];\n\n for (let notification in res.data.result) {\n result.push(res.data.result[notification]);\n }\n\n dispatch(addNotifications(result));\n setLoading(false);\n })\n .catch(err => {\n console.error(err);\n setLoading(false);\n });\n }\n\n const removeNotification = id => {\n deleteNotification(id)\n .then(() => {\n fetchData();\n })\n .catch(err => console.error(err));\n }\n\n const renderOptions = () => {\n if (notifications && notifications.length) {\n return notifications.map(item => {\n return (\n <>\n \n {item.TOPIC} \n removeNotification(item.ID)}> \n
\n {HtmlParser(item.NOTICE)}
\n
\n >\n );\n });\n } else {\n return (\n \n {i18n['no notifications']} \n
\n );\n }\n }\n\n return (\n \n
\n \n {\n notifications && notifications.length\n ? \n : \n }\n
\n \n
\n {loading ? 'Loading' : renderOptions()}\n
\n
\n );\n};\n\nexport default Notifications;","import { ADD_NOTIFICATIONS, REMOVE_NOTIFICATIONS } from './notificationTypes';\n\nexport const addNotifications = value => {\n return {\n type: ADD_NOTIFICATIONS,\n value\n };\n};\n\nexport const removeNotifications = () => {\n return {\n type: REMOVE_NOTIFICATIONS,\n value: []\n };\n};\n","import React, { useState } from 'react';\nimport { addActiveElement } from '../../../actions/MainNavigation/mainNavigationActions';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { logout } from 'src/actions/Session/sessionActions';\nimport Notifications from './Notifications/Notifications';\nimport { useSelector, useDispatch } from \"react-redux\";\nimport Spinner from 'src/components/Spinner/Spinner';\nimport { Link } from \"react-router-dom\";\nimport './Panel.scss';\n\nconst Panel = props => {\n const { i18n, userName } = useSelector(state => state.session);\n const { session: { look, user, FIREWALL_SYSTEM, FILEMANAGER_KEY, SOFTACULOUS } } = useSelector(state => state.userSession);\n const { activeElement, focusedElement } = useSelector(state => state.mainNavigation);\n const dispatch = useDispatch();\n const [loading, setLoading] = useState(false);\n const [state, setState] = useState({\n smallNavigationClass: 'small-navigation hidden'\n });\n\n const toggleNavigation = event => {\n props.showTopNav();\n\n if (state.smallNavigationClass === 'small-navigation hidden') {\n setState({ ...state, smallNavigationClass: 'small-navigation show' });\n } else {\n setState({ ...state, smallNavigationClass: 'small-navigation hidden' });\n }\n }\n\n const className = (activeName, extraClass = '') => {\n let className = 'top-link';\n\n if (activeName === activeElement) {\n className += ' active';\n }\n\n if (activeName === focusedElement) {\n className += ' focus';\n }\n\n return className + ` ${extraClass}`;\n }\n\n const handleState = (tab, event) => {\n if (`${window.location.pathname}${window.location.search}` === tab) {\n return event.preventDefault();\n }\n\n dispatch(addActiveElement(tab));\n }\n\n const signOut = () => {\n setLoading(true);\n\n dispatch(logout())\n .then(() => {\n setLoading(false);\n },\n error => {\n setLoading(false);\n console.error(error);\n });\n }\n\n return (\n \n {loading &&
}\n\n
\n
\n
\n
dispatch(addActiveElement('/list/user/'))}>\n
\n
\n
\n \n
\n {userName === 'admin' && (<>\n
\n handleState(\"/list/package/\", event)} onKeyPress={event => event.preventDefault()}>{i18n.Packages}\n
\n
\n handleState(\"/list/ip/\", event)} onKeyPress={event => event.preventDefault()}>{i18n.IP}\n
\n
\n handleState(\"/list/rrd/\", event)} onKeyPress={event => event.preventDefault()}>{i18n.Graphs}\n
\n >)}\n
\n handleState(\"/list/stats/\", event)} onKeyPress={event => event.preventDefault()}>{i18n.Statistics}\n
\n
\n handleState(\"/list/log/\", event)} onKeyPress={event => event.preventDefault()}>{i18n.Log}\n
\n {userName === 'admin' && (<>\n
\n handleState(\"/list/updates/\", event)} onKeyPress={event => event.preventDefault()}>{i18n.Updates}\n
\n {FIREWALL_SYSTEM &&
\n handleState(\"/list/firewall/\", event)} onKeyPress={event => event.preventDefault()}>{i18n.Firewall}\n
}\n >)}\n {FILEMANAGER_KEY &&
\n {i18n['File Manager']}\n
}\n {SOFTACULOUS === \"yes\" &&
{i18n.Apps ?? 'Apps'}\n
}\n {userName === 'admin' && (\n
\n handleState(\"/list/server/\", event)} onKeyPress={event => event.preventDefault()}>{i18n.Server}\n
\n )}\n
\n
\n
\n
\n
\n {look\n ?
\n {user} \n \n {look} \n
\n : userName\n }\n \n
\n
{i18n['Log out']}
\n
\n
\n\n
\n
\n
\n \n \n \n
\n
\n
\n \n
\n
{userName}
\n
{i18n['Log out']}
\n
\n
\n
\n );\n}\n\nexport default Panel;","import React, { useState, useEffect, useCallback } from 'react';\nimport { addFocusedElement, addActiveElement, removeActiveElement, removeFocusedElement } from \"../../actions/MainNavigation/mainNavigationActions\";\nimport * as ControlPanelContentActions from \"../../actions/ControlPanelContent/controlPanelContentActions\";\nimport { useSelector, useDispatch } from \"react-redux\";\nimport MobileTopNav from '../MainNav/Mobile/MobileTopNav';\nimport Menu from '../MainNav/Stat-menu/Menu';\nimport Panel from '../MainNav/Panel/Panel';\nimport './MainNav.scss';\nimport { useHistory } from 'react-router';\nimport Spinner from '../Spinner/Spinner';\n\nconst MainNav = () => {\n const history = useHistory();\n const [loading, setLoading] = useState(true);\n const [state, setState] = useState({\n menuHeight: 135,\n tabs: [],\n showTopNav: false\n });\n\n const { userName } = useSelector(state => state.session);\n const { session: { look } } = useSelector(state => state.userSession);\n const { user } = useSelector(state => state.menuCounters);\n const { activeElement, focusedElement, adminMenuTabs, userMenuTabs } = useSelector(state => state.mainNavigation);\n const { controlPanelFocusedElement } = useSelector(state => state.controlPanelContent);\n const dispatch = useDispatch();\n\n useEffect(() => {\n if (!userName || !Object.entries(user).length) {\n return history.push('/login');\n }\n\n if (look) {\n const commonUserRoutes = ['package', 'ip', 'rrd', 'updates', 'firewall', 'server'];\n const splitPath = history.location.pathname.split('/')[2];\n\n if (history.location.pathname === '/add/user/') return history.push('/');\n\n if (commonUserRoutes.includes(splitPath)) {\n return history.push('/');\n }\n }\n\n const tabs = look ? userMenuTabs : adminMenuTabs;\n setState({ ...state, tabs });\n\n setLoading(false);\n }, [userName, user, history, look]);\n\n const controlFocusedTabWithCallback = useCallback(event => {\n let isSearchInputFocused = document.querySelector('input:focus') || document.querySelector('textarea:focus') || document.querySelector('textarea:focus');\n let currentActiveTabPositionInArray;\n\n if (isSearchInputFocused) {\n return;\n }\n\n if (event.keyCode === 37 || event.keyCode === 39) {\n if (controlPanelFocusedElement) {\n dispatch(ControlPanelContentActions.removeControlPanelContentFocusedElement());\n }\n\n if (!focusedElement) {\n dispatch(addFocusedElement(activeElement));\n currentActiveTabPositionInArray = state.tabs.indexOf(activeElement);\n } else {\n currentActiveTabPositionInArray = state.tabs.indexOf(focusedElement);\n }\n }\n\n if (currentActiveTabPositionInArray === -1) {\n return;\n }\n\n if (event.keyCode === 37) {\n let newFocusedMenuTab = handleLeftArrowKey(state.tabs, currentActiveTabPositionInArray);\n dispatch(addFocusedElement(newFocusedMenuTab));\n } else if (event.keyCode === 39) {\n let newFocusedMenuTab = handleRightArrowKey(state.tabs, currentActiveTabPositionInArray);\n dispatch(addFocusedElement(newFocusedMenuTab));\n } else if (event.keyCode === 13) {\n if (!controlPanelFocusedElement && focusedElement && (focusedElement !== activeElement)) {\n history.push({ pathname: focusedElement });\n dispatch(addActiveElement(focusedElement));\n dispatch(removeFocusedElement());\n }\n }\n }, [activeElement, focusedElement, controlPanelFocusedElement]);\n\n useEffect(() => {\n window.addEventListener(\"resize\", handleTopNav);\n window.addEventListener(\"keyup\", controlFocusedTabWithCallback);\n window.addEventListener(\"scroll\", hideMenu);\n\n return () => {\n window.removeEventListener(\"resize\", handleTopNav);\n window.removeEventListener(\"keyup\", controlFocusedTabWithCallback);\n window.removeEventListener(\"scroll\", hideMenu);\n };\n }, [controlFocusedTabWithCallback]);\n\n useEffect(() => {\n dispatch(removeFocusedElement());\n }, [activeElement]);\n\n useEffect(() => {\n dispatch(addActiveElement(history.location.pathname));\n }, []);\n\n const handleLeftArrowKey = (array, indexInArray) => {\n if (indexInArray === 0) {\n return array[array.length - 1];\n } else {\n return array[indexInArray - 1];\n }\n }\n\n const handleRightArrowKey = (array, indexInArray) => {\n if (indexInArray === (array.length - 1)) {\n return array[0];\n } else {\n return array[indexInArray + 1];\n }\n }\n\n const handleTopNav = () => {\n if (document.documentElement.clientWidth < 900) {\n setState({\n ...state,\n menuHeight: 45\n });\n } else {\n setState({\n ...state,\n menuHeight: 135\n });\n }\n }\n\n const hideMenu = () => {\n if (document.documentElement.clientWidth > 900) {\n let scrollTop = window.scrollY;\n let menuHeight = Math.max(45, 135 - scrollTop);\n setState({ ...state, menuHeight });\n }\n }\n\n const showTopNav = () => {\n let showTopNav = !state.showTopNav;\n setState({ ...state, showTopNav });\n }\n\n const topNavClassName = () => {\n if (state.showTopNav) {\n return \"nav-wrapper show-nav\";\n } else {\n return \"nav-wrapper hide-nav\";\n }\n }\n\n const topNavMobile = () => {\n if (state.showTopNav) {\n return \"mobile-top-nav-wrapper show\";\n } else {\n return \"mobile-top-nav-wrapper hide\";\n }\n }\n const topNavigation = () => {\n if (document.documentElement.clientWidth > 900) {\n return (\n \n
\n \n );\n } else {\n return ;\n }\n }\n\n return (\n \n {\n loading\n ?
\n : (<>\n
\n {topNavigation()}\n >)\n }\n
\n );\n}\n\nexport default MainNav;","import React from 'react';\nimport { useSelector } from 'react-redux';\nimport Container from '../../ControlPanel/Container/Container';\n\nimport './style.scss';\n\nconst Exclusion = ({ data, focused }) => {\n const { i18n } = useSelector(state => state.session);\n\n const renderExclusionItems = () => {\n if (!Array.isArray(data.ITEMS)) {\n for (let item in data.ITEMS) {\n return <>{item} {data.ITEMS[item]} >;\n }\n } else {\n return i18n['no exclusions'];\n }\n }\n\n return (\n \n
\n
\n \n
{data.NAME}
\n
{renderExclusionItems()}
\n
\n \n
\n );\n}\n\nexport default Exclusion;\n","import React, { useEffect, useState } from 'react';\nimport { addControlPanelContentFocusedElement, removeControlPanelContentFocusedElement } from 'src/actions/ControlPanelContent/controlPanelContentActions';\nimport { addActiveElement, removeFocusedElement } from 'src/actions/MainNavigation/mainNavigationActions';\nimport * as MainNavigation from 'src/actions/MainNavigation/mainNavigationActions';\nimport SearchInput from 'src/components/MainNav/Toolbar/SearchInput/SearchInput';\nimport LeftButton from 'src/components/MainNav/Toolbar/LeftButton/LeftButton';\nimport Toolbar from 'src/components/MainNav/Toolbar/Toolbar';\nimport Spinner from 'src/components/Spinner/Spinner';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { Helmet } from 'react-helmet';\nimport Exclusion from 'src/components/Backup/Exclusion';\nimport { getBackupExclusions } from 'src/ControlPanelService/Backup';\n\nconst BackupExclusions = props => {\n const { i18n } = useSelector(state => state.session);\n const { controlPanelFocusedElement } = useSelector(state => state.controlPanelContent);\n const { focusedElement } = useSelector(state => state.mainNavigation);\n const dispatch = useDispatch();\n const [state, setState] = useState({\n exclusions: [],\n loading: false,\n total: 0\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/backup/'));\n dispatch(removeFocusedElement());\n dispatch(removeControlPanelContentFocusedElement());\n fetchData();\n\n return () => {\n dispatch(removeControlPanelContentFocusedElement());\n }\n }, []);\n\n useEffect(() => {\n window.addEventListener(\"keydown\", handleContentSelection);\n\n return () => {\n window.removeEventListener(\"keydown\", handleContentSelection);\n };\n }, [controlPanelFocusedElement, focusedElement, state.exclusions]);\n\n const handleContentSelection = event => {\n if (event.keyCode === 38 || event.keyCode === 40) {\n if (focusedElement) {\n dispatch(MainNavigation.removeFocusedElement());\n }\n }\n\n if (event.keyCode === 38) {\n event.preventDefault();\n handleArrowUp();\n } else if (event.keyCode === 40) {\n event.preventDefault();\n handleArrowDown();\n }\n }\n\n const initFocusedElement = exclusions => {\n exclusions[0]['FOCUSED'] = exclusions[0]['NAME'];\n setState({ ...state, exclusions });\n dispatch(addControlPanelContentFocusedElement(exclusions[0]['NAME']));\n }\n\n const handleArrowDown = () => {\n let exclusions = [...state.exclusions];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(exclusions);\n return;\n }\n\n let focusedElementPosition = exclusions.findIndex(exclusion => exclusion.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== exclusions.length - 1) {\n let nextFocusedElement = exclusions[focusedElementPosition + 1];\n exclusions[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, exclusions });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleArrowUp = () => {\n let exclusions = [...state.exclusions];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(exclusions);\n return;\n }\n\n let focusedElementPosition = exclusions.findIndex(exclusion => exclusion.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== 0) {\n let nextFocusedElement = exclusions[focusedElementPosition - 1];\n exclusions[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, exclusions });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const fetchData = () => {\n setState({ ...state, loading: true });\n\n getBackupExclusions()\n .then(result => {\n setState({\n exclusions: reformatData(result.data.data),\n loading: false\n });\n })\n .catch(err => console.error(err));\n }\n\n const reformatData = data => {\n let exclusions = [];\n\n for (let i in data) {\n exclusions.push({ NAME: i, ITEMS: data[i] });\n }\n\n return exclusions;\n }\n\n const exclusions = () => {\n return state.exclusions.map((item, index) => );\n }\n\n return (\n \n
\n {`Vesta - ${i18n.BACKUP}`} \n \n
\n \n \n
\n props.changeSearchTerm(term)} />\n
\n
\n \n
\n {state.loading ? : exclusions()}\n
\n
\n );\n}\n\nexport default BackupExclusions;\n","import React from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Container from '../ControlPanel/Container/Container';\nimport ListItem from '../ControlPanel/ListItem/ListItem';\nimport { Link } from 'react-router-dom';\nimport { useSelector } from 'react-redux';\n\nexport default function MailAccount(props) {\n const { data, domain } = props;\n const { i18n } = useSelector(state => state.session);\n const token = localStorage.getItem(\"token\");\n const printStat = (stat, text) => {\n if (text === 'no') {\n return {stat}
;\n }\n\n return {stat}: {text}
;\n }\n\n const toggleFav = (starred) => {\n if (starred) {\n props.toggleFav(props.data.NAME, 'add');\n } else {\n props.toggleFav(props.data.NAME, 'delete');\n }\n }\n\n const checkItem = () => {\n props.checkItem(props.data.NAME);\n }\n\n const handleSuspend = () => {\n let suspendedStatus = data.SUSPENDED === 'yes' ? 'unsuspend' : 'suspend' === 'yes' ? 'unsuspend' : 'suspend';\n props.handleModal(data.suspend_conf, `/api/v1/${suspendedStatus}/mail/index.php?domain=${domain}&account=${data.NAME}`);\n }\n\n const handleDelete = () => {\n props.handleModal(data.delete_conf, `/api/v1/delete/mail/index.php?domain=${domain}&account=${data.NAME}`);\n }\n\n return (\n \n\n \n {`${data.NAME}@${domain}`}
\n \n
\n {i18n.Disk} {data.U_DISK} {i18n.mb}
\n \n
\n {i18n['Quota']}: {data.QUOTA} {i18n.mb}
\n {i18n['Forward to']}: {data.FWD}
\n \n
\n {printStat(i18n['Autoreply'], data.AUTOREPLY)}\n \n
\n \n \n\n
\n \n {i18n.edit}\n {data.FOCUSED ? ↩ : }\n \n
\n\n
\n handleSuspend()}>\n {i18n[data.suspend_action]}\n {data.FOCUSED ? S : }\n \n
\n\n
\n handleDelete()}>\n {i18n.Delete}\n {data.FOCUSED ? Del : }\n \n
\n
\n \n );\n}","import React, { useState, useEffect } from 'react';\nimport { addControlPanelContentFocusedElement, removeControlPanelContentFocusedElement } from '../../actions/ControlPanelContent/controlPanelContentActions';\nimport { bulkMailAccountAction, getMailAccountList, handleAction } from '../../ControlPanelService/Mail';\nimport DropdownFilter from '../../components/MainNav/Toolbar/DropdownFilter/DropdownFilter';\nimport * as MainNavigation from '../../actions/MainNavigation/mainNavigationActions';\nimport SearchInput from '../../components/MainNav/Toolbar/SearchInput/SearchInput';\nimport { addFavorite, deleteFavorite } from '../../ControlPanelService/Favorites';\nimport LeftButton from '../../components/MainNav/Toolbar/LeftButton/LeftButton';\nimport Checkbox from '../../components/MainNav/Toolbar/Checkbox/Checkbox';\nimport Select from '../../components/MainNav/Toolbar/Select/Select';\nimport MailAccount from 'src/components/MailAccount/MailAccount';\nimport Toolbar from '../../components/MainNav/Toolbar/Toolbar';\nimport Modal from '../../components/ControlPanel/Modal/Modal';\nimport { useSelector, useDispatch } from 'react-redux';\nimport Spinner from '../../components/Spinner/Spinner';\nimport { Link } from 'react-router-dom';\n\nimport './MailAccounts.scss';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\n\nexport default function MailAccounts(props) {\n const { i18n } = useSelector(state => state.session);\n const { controlPanelFocusedElement } = useSelector(state => state.controlPanelContent);\n const { focusedElement } = useSelector(state => state.mainNavigation);\n const dispatch = useDispatch();\n const [loading, setLoading] = useState(false);\n const [modal, setModal] = useState({\n text: '',\n visible: false,\n actionUrl: '',\n });\n const [state, setState] = useState({\n mailAccounts: [],\n mailAccountsFav: [],\n domain: props.domain,\n toggledAll: false,\n sorting: i18n.Date,\n order: \"descending\",\n selection: [],\n totalAmount: ''\n });\n\n useEffect(() => {\n dispatch(removeControlPanelContentFocusedElement());\n fetchData().then(() => setLoading(false));\n\n return () => {\n dispatch(removeControlPanelContentFocusedElement());\n }\n }, []);\n\n useEffect(() => {\n window.addEventListener(\"keydown\", handleContentSelection);\n window.addEventListener(\"keydown\", handleFocusedElementShortcuts);\n\n return () => {\n window.removeEventListener(\"keydown\", handleContentSelection);\n window.removeEventListener(\"keydown\", handleFocusedElementShortcuts);\n };\n }, [controlPanelFocusedElement, focusedElement, state.mailAccounts]);\n\n const handleContentSelection = event => {\n if (event.keyCode === 38 || event.keyCode === 40) {\n if (focusedElement) {\n dispatch(MainNavigation.removeFocusedElement());\n }\n }\n\n if (event.keyCode === 38) {\n event.preventDefault();\n handleArrowUp();\n } else if (event.keyCode === 40) {\n event.preventDefault();\n handleArrowDown();\n }\n }\n\n const initFocusedElement = mailAccounts => {\n mailAccounts[0]['FOCUSED'] = mailAccounts[0]['NAME'];\n setState({ ...state, mailAccounts });\n dispatch(addControlPanelContentFocusedElement(mailAccounts[0]['NAME']));\n }\n\n const handleArrowDown = () => {\n let mailAccounts = [...state.mailAccounts];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(mailAccounts);\n return;\n }\n\n let focusedElementPosition = mailAccounts.findIndex(mailAccount => mailAccount.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== mailAccounts.length - 1) {\n let nextFocusedElement = mailAccounts[focusedElementPosition + 1];\n mailAccounts[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, mailAccounts });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleArrowUp = () => {\n let mailAccounts = [...state.mailAccounts];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(mailAccounts);\n return;\n }\n\n let focusedElementPosition = mailAccounts.findIndex(mailAccount => mailAccount.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== 0) {\n let nextFocusedElement = mailAccounts[focusedElementPosition - 1];\n mailAccounts[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, mailAccounts });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleFocusedElementShortcuts = event => {\n let isSearchInputFocused = document.querySelector('input:focus') || document.querySelector('textarea:focus');\n\n if (controlPanelFocusedElement && !isSearchInputFocused) {\n switch (event.keyCode) {\n case 8: return handleDelete();\n case 13: return handleEdit();\n case 83: return handleSuspend();\n default: break;\n }\n }\n }\n\n const handleEdit = () => {\n props.history.push(`/edit/mail?domain=${props.domain}&account=${controlPanelFocusedElement}`);\n }\n\n const handleSuspend = () => {\n const { mailAccounts } = state;\n let currentMailData = mailAccounts.filter(mail => mail.NAME === controlPanelFocusedElement)[0];\n let suspendedStatus = currentMailData.SUSPENDED === 'yes' ? 'unsuspend' : 'suspend';\n\n displayModal(currentMailData.suspend_conf, `/api/v1/${suspendedStatus}/mail/index.php?domain=${props.domain}&account=${controlPanelFocusedElement}`);\n }\n\n const handleDelete = () => {\n const { mailAccounts } = state;\n let currentMailData = mailAccounts.filter(mail => mail.NAME === controlPanelFocusedElement)[0];\n\n displayModal(currentMailData.delete_conf, `/api/v1/delete/mail/index.php?domain=${props.domain}&account=${controlPanelFocusedElement}`);\n }\n\n const fetchData = () => {\n setLoading(true);\n return new Promise((resolve, reject) => {\n getMailAccountList(props.domain)\n .then(result => {\n setState({\n ...state,\n mailAccounts: reformatData(result.data.data),\n webMail: result.data.webmail,\n selection: [],\n toggledAll: false,\n mailAccountsFav: result.data.mailAccountsFav,\n totalAmount: result.data.totalAmount\n });\n resolve();\n })\n .catch(err => console.error(err));\n });\n }\n\n const reformatData = data => {\n let mailAccounts = [];\n\n for (let i in data) {\n data[i]['NAME'] = i;\n data[i]['FOCUSED'] = controlPanelFocusedElement === i;\n mailAccounts.push(data[i]);\n }\n\n return mailAccounts;\n }\n\n const changeSorting = (sorting, order) => {\n setState({\n ...state,\n sorting,\n order\n });\n }\n\n const mailAccounts = () => {\n const { mailAccounts } = state;\n const mailAccountsFav = { ...state.mailAccountsFav };\n const result = [];\n\n mailAccounts.forEach(mailAccount => {\n mailAccount.FOCUSED = controlPanelFocusedElement === mailAccount.NAME;\n\n if (mailAccountsFav[mailAccount.NAME]) {\n mailAccount.STARRED = mailAccountsFav[mailAccount.NAME];\n } else {\n mailAccount.STARRED = 0;\n }\n\n result.push(mailAccount);\n });\n let sortedResult = sortArray(result);\n\n return sortedResult.map((item, index) => {\n return ;\n });\n }\n\n const checkItem = name => {\n const { selection, mailAccounts } = state;\n let duplicate = [...selection];\n let mailAccountsDuplicate = mailAccounts;\n let checkedItem = duplicate.indexOf(name);\n\n let incomingItem = mailAccountsDuplicate.findIndex(mailAccount => mailAccount.NAME === name);\n mailAccountsDuplicate[incomingItem].isChecked = !mailAccountsDuplicate[incomingItem].isChecked;\n\n if (checkedItem !== -1) {\n duplicate.splice(checkedItem, 1);\n } else {\n duplicate.push(name);\n }\n\n setState({ ...state, mailAccounts: mailAccountsDuplicate, selection: duplicate });\n }\n\n const sortArray = array => {\n const { order, sorting } = state;\n let sortingColumn = sortBy(sorting);\n\n if (order === \"descending\") {\n return array.sort((a, b) => (a[sortingColumn] < b[sortingColumn]) ? 1 : ((b[sortingColumn] < a[sortingColumn]) ? -1 : 0));\n } else {\n return array.sort((a, b) => (a[sortingColumn] > b[sortingColumn]) ? 1 : ((b[sortingColumn] > a[sortingColumn]) ? -1 : 0));\n }\n }\n\n const sortBy = sorting => {\n const { Date: date, Accounts, Disk, Starred } = i18n;\n\n switch (sorting) {\n case date: return 'DATE';\n case Accounts: return 'ACCOUNTS';\n case Disk: return 'U_DISK';\n case Starred: return 'STARRED';\n default: break;\n }\n }\n\n const toggleFav = (value, type) => {\n const { mailAccountsFav } = state;\n let mailAccountsFavDuplicate = mailAccountsFav;\n\n if (type === 'add') {\n mailAccountsFavDuplicate[value] = 1;\n\n addFavorite(value, 'mail_acc')\n .then(() => {\n setState({ ...state, mailAccountsFav: mailAccountsFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n } else {\n mailAccountsFavDuplicate[value] = undefined;\n\n deleteFavorite(value, 'mail_acc')\n .then(() => {\n setState({ ...state, mailAccountsFav: mailAccountsFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n }\n }\n\n const toggleAll = toggled => {\n const mailAccountsDuplicate = [...state.mailAccounts];\n\n if (toggled) {\n let mailAccountNames = [];\n\n let mailAccounts = mailAccountsDuplicate.map(mailAccount => {\n mailAccountNames.push(mailAccount.NAME);\n mailAccount.isChecked = true;\n return mailAccount;\n });\n\n setState({ ...state, mailAccounts, selection: mailAccountNames, toggledAll: toggled });\n } else {\n let mailAccounts = mailAccountsDuplicate.map(mailAccount => {\n mailAccount.isChecked = false;\n return mailAccount;\n });\n\n setState({ ...state, mailAccounts, selection: [], toggledAll: toggled });\n }\n }\n\n const bulk = action => {\n const { selection } = state;\n if (selection.length && action) {\n setLoading(true);\n bulkMailAccountAction(action, props.domain, selection)\n .then(result => {\n if (result.status === 200) {\n toggleAll(false);\n fetchData().then(() => refreshMenuCounters());\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n const displayModal = (text, url) => {\n setModal({\n ...modal,\n visible: true,\n text: text,\n actionUrl: url\n });\n }\n\n const modalConfirmHandler = () => {\n if (!modal.actionUrl) {\n return modalCancelHandler();\n }\n\n modalCancelHandler();\n setLoading(true);\n handleAction(modal.actionUrl)\n .then(res => {\n if (res.data.error) {\n setLoading(false);\n return displayModal(res.data.error, '');\n }\n fetchData().then(() => refreshMenuCounters())\n })\n .catch(err => { setLoading(false); console.error(err); });\n }\n\n const refreshMenuCounters = () => {\n dispatch(refreshCounters()).then(() => setLoading(false));\n }\n\n const modalCancelHandler = () => {\n setModal({\n ...modal,\n visible: false,\n text: '',\n actionUrl: ''\n });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.MAIL}`} \n \n
\n \n \n \n {loading\n ?
\n : (\n <>\n
\n
\n {`${i18n['Listing']} ${state.domain}`} \n
\n {mailAccounts()}\n
\n
\n
{state.totalAmount}
\n
\n {i18n['Back']}\n
\n
\n >\n )\n }\n
\n
\n );\n}","import React, { Component } from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Container from '../ControlPanel/Container/Container';\nimport ListItem from '../ControlPanel/ListItem/ListItem';\nimport { Link } from 'react-router-dom';\nimport './Mail.scss';\nimport { useSelector } from 'react-redux';\n\nconst Mail = props => {\n const { data } = props;\n const { i18n } = useSelector(state => state.session);\n const token = localStorage.getItem(\"token\");\n const printStat = (stat, text) => {\n if (text === 'no') {\n return {stat}
;\n }\n\n return {stat}: {text}
;\n }\n\n const toggleFav = (starred) => {\n if (starred) {\n props.toggleFav(props.data.NAME, 'add');\n } else {\n props.toggleFav(props.data.NAME, 'delete');\n }\n }\n\n const checkItem = () => {\n props.checkItem(props.data.NAME);\n }\n\n const handleSuspend = () => {\n let suspendedStatus = data.SUSPENDED === 'yes' ? 'unsuspend' : 'suspend' === 'yes' ? 'unsuspend' : 'suspend';\n props.handleModal(data.suspend_conf, `/api/v1/${suspendedStatus}/mail/index.php?domain=${data.NAME}`);\n }\n\n const handleDelete = () => {\n props.handleModal(data.delete_conf, `/api/v1/delete/mail/index.php?domain=${data.NAME}`);\n }\n\n return (\n \n\n \n {data.NAME}
\n \n
\n {i18n.Disk} {data.U_DISK} {i18n.mb}
\n \n
\n {printStat(i18n['AntiVirus Support'], data.ANTIVIRUS)}\n {printStat(i18n['DKIM Support'], data.DKIM)}\n \n
\n {printStat(i18n['AntiSpam Support'], data.ANTISPAM)}\n {i18n['Catchall email']}: {data.CATCHALL}
\n \n
\n \n \n
\n \n {data.list_accounts_button}\n {data.FOCUSED ? L : }\n \n
\n\n
\n \n {i18n['add account']}\n {data.FOCUSED ? N : }\n \n
\n\n
\n \n {i18n.edit}\n {data.FOCUSED ? ↩ : }\n \n
\n\n
\n handleSuspend()}>\n {i18n[data.suspend_action]}\n {data.FOCUSED ? S : }\n \n
\n\n
\n handleDelete()}>\n {i18n.Delete}\n {data.FOCUSED ? Del : }\n \n
\n
\n \n );\n}\n\nexport default Mail;","import React, { useState, useEffect } from 'react';\nimport { addControlPanelContentFocusedElement, removeControlPanelContentFocusedElement } from '../../actions/ControlPanelContent/controlPanelContentActions';\nimport { addActiveElement, removeFocusedElement } from '../../actions/MainNavigation/mainNavigationActions';\nimport DropdownFilter from '../../components/MainNav/Toolbar/DropdownFilter/DropdownFilter';\nimport { bulkAction, getMailList, handleAction } from '../../ControlPanelService/Mail';\nimport * as MainNavigation from '../../actions/MainNavigation/mainNavigationActions';\nimport SearchInput from '../../components/MainNav/Toolbar/SearchInput/SearchInput';\nimport { addFavorite, deleteFavorite } from '../../ControlPanelService/Favorites';\nimport LeftButton from '../../components/MainNav/Toolbar/LeftButton/LeftButton';\nimport Checkbox from '../../components/MainNav/Toolbar/Checkbox/Checkbox';\nimport Select from '../../components/MainNav/Toolbar/Select/Select';\nimport Toolbar from '../../components/MainNav/Toolbar/Toolbar';\nimport Modal from '../../components/ControlPanel/Modal/Modal';\nimport Spinner from '../../components/Spinner/Spinner';\nimport Mail from '../../components/Mail/Mail';\nimport './Mails.scss';\n\nimport { useSelector, useDispatch } from 'react-redux';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\nimport { Link } from 'react-router-dom';\n\nconst Mails = props => {\n const { i18n } = useSelector(state => state.session);\n const { controlPanelFocusedElement } = useSelector(state => state.controlPanelContent);\n const { focusedElement } = useSelector(state => state.mainNavigation);\n const dispatch = useDispatch();\n const [loading, setLoading] = useState(false);\n const [modal, setModal] = useState({\n text: '',\n visible: false,\n actionUrl: '',\n });\n const [state, setState] = useState({\n mails: [],\n mailFav: [],\n toggledAll: false,\n webmail: '',\n sorting: i18n.Date,\n order: \"descending\",\n selection: [],\n totalAmount: ''\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/mail/'));\n dispatch(removeFocusedElement());\n dispatch(removeControlPanelContentFocusedElement());\n fetchData().then(() => setLoading(false));\n\n return () => {\n dispatch(removeControlPanelContentFocusedElement());\n }\n }, []);\n\n useEffect(() => {\n window.addEventListener(\"keydown\", handleContentSelection);\n window.addEventListener(\"keydown\", handleFocusedElementShortcuts);\n\n return () => {\n window.removeEventListener(\"keydown\", handleContentSelection);\n window.removeEventListener(\"keydown\", handleFocusedElementShortcuts);\n };\n }, [controlPanelFocusedElement, focusedElement, state.mails]);\n\n const handleContentSelection = event => {\n if (event.keyCode === 38 || event.keyCode === 40) {\n if (focusedElement) {\n dispatch(MainNavigation.removeFocusedElement());\n }\n }\n\n if (event.keyCode === 38) {\n event.preventDefault();\n handleArrowUp();\n } else if (event.keyCode === 40) {\n event.preventDefault();\n handleArrowDown();\n }\n }\n\n const initFocusedElement = mails => {\n mails[0]['FOCUSED'] = mails[0]['NAME'];\n setState({ ...state, mails });\n dispatch(addControlPanelContentFocusedElement(mails[0]['NAME']));\n }\n\n const handleArrowDown = () => {\n let mails = [...state.mails];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(mails);\n return;\n }\n\n let focusedElementPosition = mails.findIndex(mail => mail.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== mails.length - 1) {\n let nextFocusedElement = mails[focusedElementPosition + 1];\n mails[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, mails });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleArrowUp = () => {\n let mails = [...state.mails];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(mails);\n return;\n }\n\n let focusedElementPosition = mails.findIndex(mail => mail.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== 0) {\n let nextFocusedElement = mails[focusedElementPosition - 1];\n mails[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, mails });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleFocusedElementShortcuts = event => {\n let isSearchInputFocused = document.querySelector('input:focus') || document.querySelector('textarea:focus');\n\n if (controlPanelFocusedElement && !isSearchInputFocused) {\n switch (event.keyCode) {\n case 8: return handleDelete();\n case 13: return handleEdit();\n case 76: return handleLogs();\n case 78: return handleAddRecord();\n case 83: return handleSuspend();\n default: break;\n }\n }\n }\n\n const handleAddRecord = () => {\n props.history.push(`/add/mail/?domain=${controlPanelFocusedElement}`);\n }\n\n const handleLogs = () => {\n props.history.push(`/list/mail?domain=${controlPanelFocusedElement}&type=access`);\n }\n\n const handleEdit = () => {\n props.history.push(`/edit/mail?domain=${controlPanelFocusedElement}`);\n }\n\n const handleSuspend = () => {\n const { mails } = state;\n let currentMailData = mails.filter(mail => mail.NAME === controlPanelFocusedElement)[0];\n let suspendedStatus = currentMailData.SUSPENDED === 'yes' ? 'unsuspend' : 'suspend';\n\n displayModal(currentMailData.suspend_conf, `/api/v1/${suspendedStatus}/mail/index.php?domain=${controlPanelFocusedElement}`);\n }\n\n const handleDelete = () => {\n const { mails } = state;\n let currentMailData = mails.filter(mail => mail.NAME === controlPanelFocusedElement)[0];\n\n displayModal(currentMailData.delete_conf, `/api/v1/delete/mail/index.php?domain=${controlPanelFocusedElement}`);\n }\n\n const fetchData = () => {\n setLoading(true);\n return new Promise((resolve, reject) => {\n getMailList()\n .then(result => {\n setState({\n ...state,\n mails: reformatData(result.data.data),\n webmail: result.data.webmail,\n mailFav: result.data.mailFav,\n selection: [],\n toggledAll: false,\n totalAmount: result.data.totalAmount\n });\n resolve();\n })\n .catch(err => console.error(err));\n });\n }\n\n const reformatData = data => {\n let mails = [];\n\n for (let i in data) {\n data[i]['NAME'] = i;\n data[i]['FOCUSED'] = controlPanelFocusedElement === i;\n mails.push(data[i]);\n }\n\n return mails;\n }\n\n const changeSorting = (sorting, order) => {\n setState({\n ...state,\n sorting,\n order\n });\n }\n\n const mails = () => {\n const { mails } = state;\n const mailFav = { ...state.mailFav };\n const result = [];\n\n mails.forEach(mail => {\n mail.FOCUSED = controlPanelFocusedElement === mail.NAME;\n\n if (mailFav[mail.NAME]) {\n mail.STARRED = mailFav[mail.NAME];\n } else {\n mail.STARRED = 0;\n }\n\n result.push(mail);\n });\n let sortedResult = sortArray(result);\n\n return sortedResult.map((item, index) => {\n return ;\n });\n }\n\n const checkItem = name => {\n const { selection, mails } = state;\n let duplicate = [...selection];\n let mailsDuplicate = mails;\n let checkedItem = duplicate.indexOf(name);\n\n let incomingItem = mailsDuplicate.findIndex(mail => mail.NAME === name);\n mailsDuplicate[incomingItem].isChecked = !mailsDuplicate[incomingItem].isChecked;\n\n if (checkedItem !== -1) {\n duplicate.splice(checkedItem, 1);\n } else {\n duplicate.push(name);\n }\n\n setState({ ...state, mails: mailsDuplicate, selection: duplicate });\n }\n\n const sortArray = array => {\n const { order, sorting } = state;\n let sortingColumn = sortBy(sorting);\n\n if (order === \"descending\") {\n return array.sort((a, b) => (a[sortingColumn] < b[sortingColumn]) ? 1 : ((b[sortingColumn] < a[sortingColumn]) ? -1 : 0));\n } else {\n return array.sort((a, b) => (a[sortingColumn] > b[sortingColumn]) ? 1 : ((b[sortingColumn] > a[sortingColumn]) ? -1 : 0));\n }\n }\n\n const sortBy = sorting => {\n const { Date, Domains, Accounts, Disk, Starred } = i18n;\n\n switch (sorting) {\n case Date: return 'DATE';\n case Domains: return 'domain_account';\n case Accounts: return 'ACCOUNTS';\n case Disk: return 'U_DISK';\n case Starred: return 'STARRED';\n default: break;\n }\n }\n\n const toggleFav = (value, type) => {\n const { mailFav } = state;\n let mailFavDuplicate = mailFav;\n\n if (type === 'add') {\n mailFavDuplicate[value] = 1;\n\n addFavorite(value, 'mail')\n .then(() => {\n setState({ ...state, mailFav: mailFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n } else {\n mailFavDuplicate[value] = undefined;\n\n deleteFavorite(value, 'mail')\n .then(() => {\n setState({ ...state, mailFav: mailFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n }\n }\n\n const toggleAll = toggled => {\n const mailsDuplicate = [...state.mails];\n\n if (toggled) {\n let mailNames = [];\n\n let mails = mailsDuplicate.map(mail => {\n mailNames.push(mail.NAME);\n mail.isChecked = true;\n return mail;\n });\n\n setState({ ...state, mails, selection: mailNames, toggledAll: toggled });\n } else {\n let mails = mailsDuplicate.map(mail => {\n mail.isChecked = false;\n return mail;\n });\n\n setState({ ...state, mails, selection: [], toggledAll: toggled });\n }\n }\n\n const bulk = action => {\n const { selection } = state;\n\n if (selection.length && action) {\n setLoading(true);\n bulkAction(action, selection)\n .then(result => {\n if (result.status === 200) {\n toggleAll(false);\n fetchData().then(() => refreshMenuCounters());\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n const displayModal = (text, url) => {\n setModal({\n ...modal,\n visible: true,\n text: text,\n actionUrl: url\n });\n }\n\n const modalConfirmHandler = () => {\n if (!modal.actionUrl) {\n return modalCancelHandler();\n }\n\n modalCancelHandler();\n setLoading(true);\n handleAction(modal.actionUrl)\n .then(res => {\n if (res.data.error) {\n setLoading(false);\n return displayModal(res.data.error, '');\n }\n fetchData().then(() => refreshMenuCounters())\n })\n .catch(err => { setLoading(false); console.error(err); });\n }\n\n const refreshMenuCounters = () => {\n dispatch(refreshCounters()).then(() => setLoading(false));\n }\n\n const modalCancelHandler = () => {\n setModal({\n ...modal,\n visible: false,\n text: '',\n actionUrl: ''\n });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.MAIL}`} \n \n
\n \n \n
\n \n {i18n['open webmail']}\n \n \n \n \n props.changeSearchTerm(term)} />\n
\n
\n \n
\n {loading\n ?
\n : (<>\n {mails()}\n
{state.totalAmount}
\n >)}\n
\n
\n
\n );\n}\n\nexport default Mails;","import React, { useEffect, useState } from 'react';\nimport MailAccounts from '../MailAccounts/MailAccounts';\nimport { useHistory } from 'react-router-dom';\nimport Mails from '../Mails/Mails';\nimport QueryString from 'qs';\nimport { Helmet } from 'react-helmet';\nimport { useSelector } from 'react-redux';\n\nexport default function MailWrapper(props) {\n const { i18n } = useSelector(state => state.session);\n const [mailDomain, setMailDomain] = useState('');\n const history = useHistory();\n\n useEffect(() => {\n const parsedQueryString = QueryString.parse(history.location.search, { ignoreQueryPrefix: true });\n\n if (parsedQueryString.domain) {\n setMailDomain(parsedQueryString.domain);\n } else {\n setMailDomain('');\n }\n }, [history.location]);\n\n return (\n <>\n \n {`Vesta - ${i18n.MAIL}`} \n \n {\n mailDomain\n ? \n : \n }\n >\n );\n}","import React from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Container from '../ControlPanel/Container/Container';\nimport ListItem from '../ControlPanel/ListItem/ListItem';\nimport { Link } from 'react-router-dom';\nimport { useSelector } from 'react-redux';\n\nexport default function DnsRecord({ data, domain, handleModal, ...props }) {\n const { i18n } = useSelector(state => state.session);\n\n const toggleFav = (starred) => {\n if (starred) {\n props.toggleFav(data.NAME, 'add');\n } else {\n props.toggleFav(data.NAME, 'delete');\n }\n }\n\n const checkItem = () => {\n props.checkItem(data.NAME);\n }\n\n const handleDelete = () => {\n handleModal(data.delete_conf, `/api/v1/delete/dns/?domain=${domain}&record_id=${data.ID}`);\n }\n\n const handleSuspend = () => {\n handleModal(data.suspend_conf, `/api/v1/${data.suspend_action}/dns/?domain=${domain}&record_id=${data.ID}`);\n }\n\n return (\n \n\n \n {data.dnsRecord}
\n \n \n \n {`${data.RECORD.substring(0, 12)}${data.RECORD.length > 12 ? '...' : ''}`} \n \n \n {data.TYPE} \n \n \n {data.PRIORITY} \n \n \n {data.VALUE} \n \n
\n \n \n
\n \n {i18n.edit}\n {data.FOCUSED ? ↩ : }\n \n
\n\n
\n \n {data.suspend_action}\n {data.FOCUSED ? S : }\n \n
\n\n
\n handleDelete()}>\n {i18n.Delete}\n {data.FOCUSED ? Del : }\n \n
\n
\n \n );\n}","import React, { useState, useEffect } from 'react';\nimport { addControlPanelContentFocusedElement, removeControlPanelContentFocusedElement } from '../../actions/ControlPanelContent/controlPanelContentActions';\nimport { bulkAction, getDNSRecordsList, handleAction } from '../../ControlPanelService/Dns';\nimport * as MainNavigation from '../../actions/MainNavigation/mainNavigationActions';\nimport SearchInput from '../../components/MainNav/Toolbar/SearchInput/SearchInput';\nimport { addFavorite, deleteFavorite } from '../../ControlPanelService/Favorites';\nimport LeftButton from '../../components/MainNav/Toolbar/LeftButton/LeftButton';\nimport Checkbox from '../../components/MainNav/Toolbar/Checkbox/Checkbox';\nimport Select from '../../components/MainNav/Toolbar/Select/Select';\nimport Toolbar from '../../components/MainNav/Toolbar/Toolbar';\nimport Modal from 'src/components/ControlPanel/Modal/Modal';\nimport DnsRecord from 'src/components/DNSRecord/DNSRecord';\nimport { useSelector, useDispatch } from 'react-redux';\nimport Spinner from '../../components/Spinner/Spinner';\nimport { Link, useHistory } from 'react-router-dom';\nimport QueryString from 'qs';\n\nimport './DNSRecords.scss';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\n\nexport default function DnsRecords(props) {\n const { i18n } = useSelector(state => state.session);\n const { controlPanelFocusedElement } = useSelector(state => state.controlPanelContent);\n const { focusedElement } = useSelector(state => state.mainNavigation);\n const dispatch = useDispatch();\n const history = useHistory();\n const [loading, setLoading] = useState(false);\n const [modal, setModal] = useState({\n text: '',\n visible: false,\n actionUrl: '',\n });\n const [state, setState] = useState({\n dnsRecords: [],\n dnsRecordFav: [],\n domain: '',\n toggledAll: false,\n sorting: i18n.Date,\n order: \"descending\",\n selection: [],\n totalAmount: ''\n });\n\n useEffect(() => {\n dispatch(removeControlPanelContentFocusedElement());\n fetchData().then(() => setLoading(false));\n\n return () => {\n dispatch(removeControlPanelContentFocusedElement());\n }\n }, []);\n\n useEffect(() => {\n window.addEventListener(\"keydown\", handleContentSelection);\n window.addEventListener(\"keydown\", handleFocusedElementShortcuts);\n\n return () => {\n window.removeEventListener(\"keydown\", handleContentSelection);\n window.removeEventListener(\"keydown\", handleFocusedElementShortcuts);\n };\n }, [controlPanelFocusedElement, focusedElement, state.dnsRecords]);\n\n const handleContentSelection = event => {\n if (event.keyCode === 38 || event.keyCode === 40) {\n if (focusedElement) {\n dispatch(MainNavigation.removeFocusedElement());\n }\n }\n\n if (event.keyCode === 38) {\n event.preventDefault();\n handleArrowUp();\n } else if (event.keyCode === 40) {\n event.preventDefault();\n handleArrowDown();\n }\n }\n\n const initFocusedElement = dnsRecords => {\n dnsRecords[0]['FOCUSED'] = dnsRecords[0]['NAME'];\n setState({ ...state, dnsRecords });\n dispatch(addControlPanelContentFocusedElement(dnsRecords[0]['NAME']));\n }\n\n const handleArrowDown = () => {\n let dnsRecords = [...state.dnsRecords];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(dnsRecords);\n return;\n }\n\n let focusedElementPosition = dnsRecords.findIndex(dnsRecord => dnsRecord.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== dnsRecords.length - 1) {\n let nextFocusedElement = dnsRecords[focusedElementPosition + 1];\n dnsRecords[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, dnsRecords });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleArrowUp = () => {\n let dnsRecords = [...state.dnsRecords];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(dnsRecords);\n return;\n }\n\n let focusedElementPosition = dnsRecords.findIndex(dnsRecord => dnsRecord.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== 0) {\n let nextFocusedElement = dnsRecords[focusedElementPosition - 1];\n dnsRecords[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, dnsRecords });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleFocusedElementShortcuts = event => {\n let isSearchInputFocused = document.querySelector('input:focus') || document.querySelector('textarea:focus');\n\n if (controlPanelFocusedElement && !isSearchInputFocused) {\n if (event.keyCode === 13) {\n return handleEdit();\n } else if (event.keyCode === 8) {\n return handleDelete();\n }\n }\n }\n\n const handleEdit = () => {\n props.history.push(`/edit/dns/?domain=${controlPanelFocusedElement}`);\n }\n\n const handleDelete = () => {\n const { databases } = state;\n let currentDatabaseData = databases.filter(database => database.NAME === controlPanelFocusedElement)[0];\n\n displayModal(currentDatabaseData.delete_conf, `/api/v1/delete/database/?domain=${controlPanelFocusedElement}`);\n }\n\n const fetchData = () => {\n let parsedQueryString = QueryString.parse(history.location.search, { ignoreQueryPrefix: true });\n setLoading(true);\n return new Promise((resolve, reject) => {\n getDNSRecordsList(parsedQueryString.domain || '')\n .then(result => {\n setState({\n ...state,\n dnsRecords: reformatData(result.data.data),\n dnsRecordFav: result.data.dnsRecordsFav,\n totalAmount: result.data.totalAmount,\n domain: parsedQueryString.domain,\n toggledAll: false,\n selection: []\n });\n resolve();\n })\n .catch(err => console.error(err));\n });\n }\n\n const reformatData = data => {\n let dnsRecords = [];\n\n for (let i in data) {\n data[i]['NAME'] = i;\n data[i]['FOCUSED'] = controlPanelFocusedElement === i;\n dnsRecords.push(data[i]);\n }\n\n return dnsRecords;\n }\n\n const dnsRecords = () => {\n const { dnsRecords } = state;\n const result = [];\n const dnsRecordFav = { ...state.dnsRecordFav };\n\n dnsRecords.forEach(dnsRecord => {\n dnsRecord.FOCUSED = controlPanelFocusedElement === dnsRecord.NAME;\n\n if (dnsRecordFav[dnsRecord.NAME]) {\n dnsRecord.STARRED = dnsRecordFav[dnsRecord.NAME];\n } else {\n dnsRecord.STARRED = 0;\n }\n\n result.push(dnsRecord);\n });\n\n return result.map((item, index) => {\n return ;\n });\n }\n\n const checkItem = name => {\n const { selection, dnsRecords } = state;\n let duplicate = [...selection];\n let dnsDuplicate = dnsRecords;\n let checkedItem = duplicate.indexOf(name);\n\n let incomingItem = dnsDuplicate.findIndex(dns => dns.NAME === name);\n dnsDuplicate[incomingItem].isChecked = !dnsDuplicate[incomingItem].isChecked;\n\n if (checkedItem !== -1) {\n duplicate.splice(checkedItem, 1);\n } else {\n duplicate.push(name);\n }\n\n setState({ ...state, dnsRecords: dnsDuplicate, selection: duplicate });\n }\n\n const toggleFav = (value, type) => {\n const { dnsRecordFav } = state;\n let dnsRecFavDuplicate = dnsRecordFav;\n\n if (type === 'add') {\n dnsRecFavDuplicate[value] = 1;\n\n addFavorite(value, 'dns_rec')\n .then(() => {\n setState({ ...state, dnsRecordFav: dnsRecFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n } else {\n dnsRecFavDuplicate[value] = undefined;\n\n deleteFavorite(value, 'dns_rec')\n .then(() => {\n setState({ ...state, dnsRecordFav: dnsRecFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n }\n }\n\n const toggleAll = toggled => {\n const dnsRecordsDuplicate = [...state.dnsRecords];\n\n if (toggled) {\n let dnsRecordNames = []\n\n let dnsRecords = dnsRecordsDuplicate.map(dnsRecord => {\n dnsRecordNames.push(dnsRecord.NAME);\n dnsRecord.isChecked = true;\n return dnsRecord;\n });\n\n setState({ ...state, dnsRecords, selection: dnsRecordNames, toggledAll: toggled });\n } else {\n let dnsRecords = dnsRecordsDuplicate.map(dnsRecord => {\n dnsRecord.isChecked = false;\n return dnsRecord;\n });\n\n setState({ ...state, dnsRecords, selection: [], toggledAll: toggled });\n }\n }\n\n const bulk = action => {\n const { selection } = state;\n\n if (selection.length && action) {\n setLoading(true);\n bulkAction(action, selection, state.domain)\n .then(result => {\n if (result.status === 200) {\n toggleAll(false);\n fetchData().then(() => refreshMenuCounters());\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n const displayModal = (text, url) => {\n setModal({\n ...modal,\n visible: true,\n text: text,\n actionUrl: url\n });\n }\n\n const modalConfirmHandler = () => {\n if (!modal.actionUrl) {\n return modalCancelHandler();\n }\n\n modalCancelHandler();\n setLoading(true);\n handleAction(modal.actionUrl)\n .then(res => {\n if (res.data.error) {\n setLoading(false);\n return displayModal(res.data.error, '');\n }\n fetchData().then(() => refreshMenuCounters())\n })\n .catch(err => { setLoading(false); console.error(err); });\n }\n\n const refreshMenuCounters = () => {\n dispatch(refreshCounters()).then(() => setLoading(false));\n }\n\n const modalCancelHandler = () => {\n setModal({\n ...modal,\n visible: false,\n text: '',\n actionUrl: ''\n });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.DNS}`} \n \n
\n \n \n
\n \n \n props.changeSearchTerm(term)} />\n
\n
\n \n {loading\n ?
\n : (\n <>\n
\n
\n {`${i18n['Listing']} ${state.domain}`} \n
\n {dnsRecords()}\n
\n
\n
{state.totalAmount}
\n
\n {i18n['Back']}\n
\n
\n >\n )\n }\n
\n
\n );\n}","import React from 'react';\nimport ListItem from '../ControlPanel/ListItem/ListItem';\nimport Container from '../ControlPanel/Container/Container';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport './DomainNameSystem.scss';\nimport { Link } from 'react-router-dom';\nimport { useSelector } from 'react-redux';\n\nconst DomainNameSystem = props => {\n const { data } = props;\n const { i18n } = useSelector(state => state.session);\n const token = localStorage.getItem(\"token\");\n\n const toggleFav = (starred) => {\n if (starred) {\n props.toggleFav(props.data.NAME, 'add');\n } else {\n props.toggleFav(props.data.NAME, 'delete');\n }\n }\n\n const checkItem = () => {\n props.checkItem(props.data.NAME);\n }\n\n const handleSuspend = () => {\n let suspendedStatus = data.SUSPENDED === 'yes' ? 'unsuspend' : 'suspend' === 'yes' ? 'unsuspend' : 'suspend';\n props.handleModal(data.suspend_conf, `/api/v1/${suspendedStatus}/dns/index.php?domain=${data.NAME}`);\n }\n\n const handleDelete = () => {\n props.handleModal(data.delete_conf, `/api/v1/delete/dns/index.php?domain=${data.NAME}`);\n }\n\n return (\n \n \n {data.NAME} / {data.RECORDS}
\n \n \n
\n {data.IP}
\n {data.SOA}
\n \n
\n {i18n.TTL}: {data.TTL}
\n {i18n.Serial}: {data.SERIAL}
\n \n
\n {i18n.Template}: {data.TPL}
\n {i18n.Expire}: {data.EXP}
\n \n
\n \n \n
\n \n {data.RECORDS_I18N}\n {data.FOCUSED ? L : }\n \n
\n\n
\n \n {i18n['add record']}\n {data.FOCUSED ? N : }\n \n
\n\n
\n \n {i18n.edit}\n {data.FOCUSED ? ↩ : }\n \n
\n\n
\n handleSuspend()}>\n {i18n[data.suspend_action]}\n {data.FOCUSED ? S : }\n \n
\n\n
\n handleDelete()}>\n {i18n.Delete}\n {data.FOCUSED ? Del : }\n \n
\n
\n \n );\n}\n\nexport default DomainNameSystem;","import React, { useState, useEffect } from 'react';\nimport { addControlPanelContentFocusedElement, removeControlPanelContentFocusedElement } from '../../actions/ControlPanelContent/controlPanelContentActions';\nimport { addActiveElement, removeFocusedElement } from '../../actions/MainNavigation/mainNavigationActions';\nimport DropdownFilter from '../../components/MainNav/Toolbar/DropdownFilter/DropdownFilter';\nimport { bulkDomainAction, getDnsList, handleAction } from '../../ControlPanelService/Dns';\nimport * as MainNavigation from '../../actions/MainNavigation/mainNavigationActions';\nimport SearchInput from '../../components/MainNav/Toolbar/SearchInput/SearchInput';\nimport DomainNameSystem from '../../components/DomainNameSystem/DomainNameSystem';\nimport { addFavorite, deleteFavorite } from '../../ControlPanelService/Favorites';\nimport LeftButton from '../../components/MainNav/Toolbar/LeftButton/LeftButton';\nimport Checkbox from '../../components/MainNav/Toolbar/Checkbox/Checkbox';\nimport Select from '../../components/MainNav/Toolbar/Select/Select';\nimport Toolbar from '../../components/MainNav/Toolbar/Toolbar';\nimport Modal from '../../components/ControlPanel/Modal/Modal';\nimport Spinner from '../../components/Spinner/Spinner';\nimport './DomainNameSystems.scss';\n\nimport { useDispatch, useSelector } from 'react-redux';\nimport { Helmet } from 'react-helmet';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\n\nconst DomainNameSystems = props => {\n const { i18n } = useSelector(state => state.session);\n const { controlPanelFocusedElement } = useSelector(state => state.controlPanelContent);\n const { focusedElement } = useSelector(state => state.mainNavigation);\n const dispatch = useDispatch();\n const [loading, setLoading] = useState(false);\n const [modal, setModal] = useState({\n text: '',\n visible: false,\n actionUrl: ''\n });\n const [state, setState] = useState({\n domainNameSystems: [],\n dnsFav: [],\n toggledAll: false,\n sorting: i18n.Date,\n order: \"descending\",\n selection: [],\n totalAmount: '',\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/dns/'));\n dispatch(removeFocusedElement());\n dispatch(removeControlPanelContentFocusedElement());\n fetchData().then(() => setLoading(false));\n\n return () => {\n dispatch(removeControlPanelContentFocusedElement());\n }\n }, []);\n\n useEffect(() => {\n window.addEventListener(\"keydown\", handleContentSelection);\n window.addEventListener(\"keydown\", handleFocusedElementShortcuts);\n\n return () => {\n window.removeEventListener(\"keydown\", handleContentSelection);\n window.removeEventListener(\"keydown\", handleFocusedElementShortcuts);\n };\n }, [controlPanelFocusedElement, focusedElement, state.domainNameSystems]);\n\n const handleContentSelection = event => {\n if (event.keyCode === 38 || event.keyCode === 40) {\n if (focusedElement) {\n dispatch(MainNavigation.removeFocusedElement());\n }\n }\n\n if (event.keyCode === 38) {\n event.preventDefault();\n handleArrowUp();\n } else if (event.keyCode === 40) {\n event.preventDefault();\n handleArrowDown();\n }\n }\n\n const initFocusedElement = domainNameSystems => {\n domainNameSystems[0]['FOCUSED'] = domainNameSystems[0]['NAME'];\n setState({ ...state, domainNameSystems });\n dispatch(addControlPanelContentFocusedElement(domainNameSystems[0]['NAME']));\n }\n\n const handleArrowDown = () => {\n let domainNameSystems = [...state.domainNameSystems];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(domainNameSystems);\n return;\n }\n\n let focusedElementPosition = domainNameSystems.findIndex(domainNameSystem => domainNameSystem.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== domainNameSystems.length - 1) {\n let nextFocusedElement = domainNameSystems[focusedElementPosition + 1];\n domainNameSystems[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, domainNameSystems });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleArrowUp = () => {\n let domainNameSystems = [...state.domainNameSystems];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(domainNameSystems);\n return;\n }\n\n let focusedElementPosition = domainNameSystems.findIndex(domainNameSystem => domainNameSystem.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== 0) {\n let nextFocusedElement = domainNameSystems[focusedElementPosition - 1];\n domainNameSystems[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, domainNameSystems });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleFocusedElementShortcuts = event => {\n let isSearchInputFocused = document.querySelector('input:focus') || document.querySelector('textarea:focus');\n\n if (controlPanelFocusedElement && !isSearchInputFocused) {\n switch (event.keyCode) {\n case 8: return handleDelete();\n case 13: return handleEdit();\n case 76: return handleLogs();\n case 78: return handleAddRecord();\n case 83: return handleSuspend();\n default: break;\n }\n }\n }\n\n const handleAddRecord = () => {\n props.history.push(`/add/dns/?domain=${controlPanelFocusedElement}`);\n }\n\n const handleLogs = () => {\n props.history.push(`/list/dns?domain=${controlPanelFocusedElement}&type=access`);\n }\n\n const handleEdit = () => {\n props.history.push(`/edit/dns?domain=${controlPanelFocusedElement}`);\n }\n\n const handleSuspend = () => {\n const { domainNameSystems } = state;\n let currentDomainNameSystemData = domainNameSystems.filter(domainNameSystem => domainNameSystem.NAME === controlPanelFocusedElement)[0];\n let suspendedStatus = currentDomainNameSystemData.SUSPENDED === 'yes' ? 'unsuspend' : 'suspend';\n\n displayModal(currentDomainNameSystemData.suspend_conf, `/api/v1/${suspendedStatus}/dns/index.php?domain=${controlPanelFocusedElement}`);\n }\n\n const handleDelete = () => {\n const { domainNameSystems } = state;\n let currentDomainNameSystemData = domainNameSystems.filter(domainNameSystem => domainNameSystem.NAME === controlPanelFocusedElement)[0];\n\n displayModal(currentDomainNameSystemData.delete_conf, `/api/v1/delete/dns/index.php?domain=${controlPanelFocusedElement}`);\n }\n\n const fetchData = () => {\n setLoading(true);\n return new Promise((resolve, reject) => {\n getDnsList()\n .then(result => {\n setState({\n ...state,\n domainNameSystems: reformatData(result.data.data),\n dnsFav: result.data.dnsFav,\n selection: [],\n toggledAll: false,\n totalAmount: result.data.totalAmount\n });\n resolve();\n })\n .catch(err => console.error(err));\n });\n }\n\n const reformatData = data => {\n let domainNameSystems = [];\n\n for (let i in data) {\n data[i]['NAME'] = i;\n data[i]['RECORDS'] = Number(data[i]['RECORDS']);\n data[i]['FOCUSED'] = controlPanelFocusedElement === i;\n domainNameSystems.push(data[i]);\n }\n\n return domainNameSystems;\n }\n\n const changeSorting = (sorting, order) => {\n setState({\n ...state,\n sorting,\n order\n });\n }\n\n const dns = () => {\n const { domainNameSystems } = state;\n const dnsFav = { ...state.dnsFav };\n const result = [];\n\n domainNameSystems.forEach(domainNameSystem => {\n domainNameSystem.FOCUSED = controlPanelFocusedElement === domainNameSystem.NAME;\n\n if (dnsFav[domainNameSystem.NAME]) {\n domainNameSystem.STARRED = dnsFav[domainNameSystem.NAME];\n } else {\n domainNameSystem.STARRED = 0;\n }\n\n result.push(domainNameSystem);\n });\n\n let sortedResult = sortArray(result);\n\n return sortedResult.map((item, index) => {\n return ;\n });\n }\n\n const checkItem = name => {\n const { selection, domainNameSystems } = state;\n let duplicate = [...selection];\n let domainNameSystemsDuplicate = domainNameSystems;\n let checkedItem = duplicate.indexOf(name);\n\n let incomingItem = domainNameSystemsDuplicate.findIndex(domainNameSystem => domainNameSystem.NAME === name);\n domainNameSystemsDuplicate[incomingItem].isChecked = !domainNameSystemsDuplicate[incomingItem].isChecked;\n\n if (checkedItem !== -1) {\n duplicate.splice(checkedItem, 1);\n } else {\n duplicate.push(name);\n }\n\n setState({ ...state, domainNameSystems: domainNameSystemsDuplicate, selection: duplicate });\n }\n\n const sortArray = array => {\n const { order, sorting } = state;\n let sortingColumn = sortBy(sorting);\n\n if (order === \"descending\") {\n return array.sort((a, b) => {\n const first = a[sortingColumn];\n const second = b[sortingColumn];\n return (first < second) ? 1 : ((second < first) ? -1 : 0);\n });\n } else {\n return array.sort((a, b) => {\n const first = a[sortingColumn];\n const second = b[sortingColumn];\n return (first > second) ? 1 : ((second > first) ? -1 : 0)\n });\n }\n }\n\n const sortBy = sorting => {\n const { Date, Expire, Domain, IP, Records, Starred } = i18n;\n\n switch (sorting) {\n case Date: return 'DATE';\n case Expire: return 'EXP';\n case Domain: return 'NAME';\n case IP: return 'IP';\n case Records: return 'RECORDS';\n case Starred: return 'STARRED';\n default: break;\n }\n }\n\n const toggleFav = (value, type) => {\n const { dnsFav } = state;\n let dnsFavDuplicate = dnsFav;\n\n if (type === 'add') {\n dnsFavDuplicate[value] = 1;\n\n addFavorite(value, 'dns')\n .then(() => {\n setState({ ...state, dnsFav: dnsFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n } else {\n dnsFavDuplicate[value] = undefined;\n\n deleteFavorite(value, 'dns')\n .then(() => {\n setState({ ...state, dnsFav: dnsFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n }\n }\n\n const toggleAll = toggled => {\n const domainNameSystemsDuplicate = [...state.domainNameSystems];\n\n if (toggled) {\n let domainNameSystemsNames = [];\n\n let domainNameSystems = domainNameSystemsDuplicate.map(domainNameSystem => {\n domainNameSystemsNames.push(domainNameSystem.NAME);\n domainNameSystem.isChecked = true;\n return domainNameSystem;\n });\n\n setState({ ...state, domainNameSystems, selection: domainNameSystemsNames, toggledAll: toggled });\n } else {\n let domainNameSystems = domainNameSystemsDuplicate.map(domainNameSystem => {\n domainNameSystem.isChecked = false;\n return domainNameSystem;\n });\n\n setState({ ...state, domainNameSystems, selection: [], toggledAll: toggled });\n }\n }\n\n const bulk = action => {\n const { selection } = state;\n\n if (selection.length && action) {\n setLoading(true);\n bulkDomainAction(action, selection)\n .then(result => {\n if (result.status === 200) {\n toggleAll(false);\n fetchData().then(() => refreshMenuCounters());\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n const displayModal = (text, url) => {\n setModal({\n ...modal,\n visible: true,\n text: text,\n actionUrl: url\n });\n }\n\n const modalConfirmHandler = () => {\n if (!modal.actionUrl) {\n return modalCancelHandler();\n }\n\n modalCancelHandler();\n setLoading(true);\n handleAction(modal.actionUrl)\n .then(res => {\n if (res.data.error) {\n setLoading(false);\n return displayModal(res.data.error, '');\n }\n fetchData().then(() => refreshMenuCounters())\n })\n .catch(err => { setLoading(false); console.error(err); });\n }\n\n const refreshMenuCounters = () => {\n dispatch(refreshCounters()).then(() => setLoading(false));\n }\n\n const modalCancelHandler = () => {\n setModal({\n ...modal,\n visible: false,\n text: '',\n actionUrl: ''\n });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.DNS}`} \n \n
\n \n \n
\n \n \n \n props.changeSearchTerm(term)} />\n
\n
\n \n
\n {loading ? : dns()}\n
\n
{state.totalAmount}
\n
\n
\n );\n}\n\nexport default DomainNameSystems;","import QueryString from 'qs';\nimport React, { useEffect, useState } from 'react';\nimport { Helmet } from 'react-helmet';\nimport { useSelector } from 'react-redux';\nimport { useHistory } from 'react-router-dom';\nimport DnsRecords from '../DNSRecords/DNSRecords';\nimport DomainNameSystems from '../DomainNameSystems/DomainNameSystems';\n\nexport default function DNSWrapper(props) {\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const parsedQueryString = QueryString.parse(history.location.search, { ignoreQueryPrefix: true });\n const [isDnsRecords, setIsDnsRecords] = useState(false);\n\n useEffect(() => {\n if (parsedQueryString.domain) {\n setIsDnsRecords(true);\n } else {\n setIsDnsRecords(false);\n }\n }, [history.location]);\n\n return (\n <>\n \n {`Vesta - ${i18n.DNS}`} \n \n {\n isDnsRecords\n ? \n : \n }\n >\n );\n}","import axios from \"axios\";\n\nconst BASE_URL = window.location.origin;\nconst webApiUri = '/api/v1/list/stats/index.php';\n\nexport const getStatisticsList = user => {\n return axios.get(BASE_URL + webApiUri + '?user=' + user);\n}","import React from 'react';\nimport { useSelector } from 'react-redux';\nimport Container from '../ControlPanel/Container/Container';\nimport './Statistic.scss';\n\nconst Statistic = props => {\n const { data } = props;\n const { i18n } = useSelector(state => state.session);\n\n const printDate = date => {\n let newDate = new Date(date);\n let day = newDate.getDate();\n let month = newDate.getMonth();\n let year = newDate.getFullYear();\n let months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];\n\n return {day} {months[month]} {year}
;\n }\n\n const printName = date => {\n let newDate = new Date(date);\n let month = newDate.getMonth();\n let year = newDate.getFullYear();\n let months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];\n\n return {months[month]} {year}
;\n }\n\n return (\n \n
\n {printDate(data.DATE)}\n \n
\n {printName(data.DATE)}
\n \n
\n {i18n.Bandwidth} {data.U_BANDWIDTH} {i18n.mb}
\n {i18n.Disk}: {data.U_DISK} {i18n.mb}
\n \n
\n
{i18n.Web}: {data.U_DISK_WEB} {i18n.mb}
\n
{i18n.Mail}: {data.U_DISK_MAIL} {i18n.mb}
\n
\n
\n
{i18n.Databases}: {data.U_DATABASES} {i18n.mb}
\n
{i18n['User Directories']}: {data.U_DISK_DIRS} {i18n.mb}
\n
\n
\n \n
\n {i18n['Web Domains']}: {data.U_WEB_DOMAINS}
\n {i18n['SSL Domains']}: {data.U_WEB_SSL}
\n {i18n['Web Aliases']}: {data.U_WEB_ALIASES}
\n {i18n['DNS Domains']}: {data.U_DNS_DOMAINS}
\n {i18n['DNS records']}: {data.U_DNS_RECORDS}
\n \n
\n {i18n['Mail Domains']}: {data.U_MAIL_DOMAINS}
\n {i18n['Mail Accounts']}: {data.U_MAIL_ACCOUNTS}
\n {i18n['Databases']}: {data.U_DATABASES}
\n {i18n['Cron Jobs']}: {data.U_CRON_JOBS}
\n {i18n['IP Addresses']}: {data.IP_OWNED}
\n \n
\n \n
\n );\n}\n\nexport default Statistic;","import React, { useEffect, useState } from 'react';\nimport { addControlPanelContentFocusedElement, removeControlPanelContentFocusedElement } from '../../actions/ControlPanelContent/controlPanelContentActions';\nimport { addActiveElement, removeFocusedElement } from '../../actions/MainNavigation/mainNavigationActions';\nimport * as MainNavigation from '../../actions/MainNavigation/mainNavigationActions';\nimport SearchInput from '../../components/MainNav/Toolbar/SearchInput/SearchInput';\nimport { getStatisticsList } from '../../ControlPanelService/Statistics';\nimport Select from '../../components/MainNav/Toolbar/Select/Select';\nimport Toolbar from '../../components/MainNav/Toolbar/Toolbar';\nimport Statistic from '../../components/Statistic/Statistic';\nimport Spinner from '../../components/Spinner/Spinner';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { Link } from 'react-router-dom';\nimport './Statistics.scss';\nimport { Helmet } from 'react-helmet';\n\nconst Statistics = props => {\n const { i18n } = useSelector(state => state.session);\n const { controlPanelFocusedElement } = useSelector(state => state.controlPanelContent);\n const { focusedElement } = useSelector(state => state.mainNavigation);\n const dispatch = useDispatch();\n const [state, setState] = useState({\n statistics: [],\n users: [],\n totalAmount: '',\n loading: false,\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/stats/'));\n dispatch(removeFocusedElement());\n dispatch(removeControlPanelContentFocusedElement());\n fetchData();\n\n return () => {\n dispatch(removeControlPanelContentFocusedElement());\n }\n }, []);\n\n useEffect(() => {\n window.addEventListener(\"keydown\", handleContentSelection);\n\n return () => {\n window.removeEventListener(\"keydown\", handleContentSelection);\n };\n }, [controlPanelFocusedElement, focusedElement, state.statistics]);\n\n const handleContentSelection = event => {\n if (event.keyCode === 38 || event.keyCode === 40) {\n if (focusedElement) {\n dispatch(MainNavigation.removeFocusedElement());\n }\n }\n\n if (event.keyCode === 38) {\n event.preventDefault();\n handleArrowUp();\n } else if (event.keyCode === 40) {\n event.preventDefault();\n handleArrowDown();\n }\n }\n\n const initFocusedElement = statistics => {\n statistics[0]['FOCUSED'] = statistics[0]['NAME'];\n setState({ ...state, statistics });\n dispatch(addControlPanelContentFocusedElement(statistics[0]['NAME']));\n }\n\n const handleArrowDown = () => {\n let statistics = [...state.statistics];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(statistics);\n return;\n }\n\n let focusedElementPosition = statistics.findIndex(statistic => statistic.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== statistics.length - 1) {\n let nextFocusedElement = statistics[focusedElementPosition + 1];\n statistics[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, statistics });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleArrowUp = () => {\n let statistics = [...state.statistics];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(statistics);\n return;\n }\n\n let focusedElementPosition = statistics.findIndex(statistic => statistic.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== 0) {\n let nextFocusedElement = statistics[focusedElementPosition - 1];\n statistics[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, statistics });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const fetchData = () => {\n dispatch(removeControlPanelContentFocusedElement());\n setState({ ...state, loading: true });\n\n let search = window.location.search;\n let user = search ? search.split('=')[1] : '';\n\n getStatisticsList(user)\n .then(result => {\n setState({\n ...state,\n statistics: reformatData(result.data.data),\n users: result.data.users || [],\n totalAmount: result.data.totalAmount,\n loading: false\n });\n })\n .catch(err => console.error(err));\n }\n\n const reformatData = data => {\n let statistics = [];\n\n for (let i in data) {\n data[i]['DATE'] = i;\n data[i]['NAME'] = i;\n data[i]['FOCUSED'] = controlPanelFocusedElement === i;\n statistics.push(data[i]);\n }\n\n return statistics;\n }\n\n const statistics = () => {\n let statistics = [...state.statistics];\n\n statistics.forEach(statistic => {\n statistic.FOCUSED = controlPanelFocusedElement === statistic.NAME;\n });\n\n return statistics.map((item, index) => {\n return ;\n });\n }\n\n const bulkAction = value => {\n let user = value !== '' ? `?user=${value}` : '';\n props.history.push({ search: user });\n fetchData();\n };\n\n return (\n \n
\n {`Vesta - ${i18n.STATS}`} \n \n
\n \n
\n {i18n['Overall Statistics']}\n \n props.changeSearchTerm(term)} />\n
\n
\n \n
\n {state.loading ? : statistics()}\n
\n
{state.totalAmount}
\n
\n );\n}\n\nexport default Statistics;","import React from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { loginAs, logout } from 'src/actions/Session/sessionActions';\nimport Container from '../ControlPanel/Container/Container';\nimport ListItem from '../ControlPanel/ListItem/ListItem';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { Link } from 'react-router-dom';\n\nimport './User.scss';\n\nconst User = ({ data, toggleFav, handleModal, checkItem }) => {\n const { i18n, userName } = useSelector(state => state.session);\n const dispatch = useDispatch();\n\n const printNameServers = servers => {\n let serversArray = servers.split(',');\n\n return serversArray.map(\n (server, index) => {server}
\n );\n }\n\n const signInAs = username => {\n dispatch(loginAs(username));\n }\n\n const signOut = () => {\n dispatch(logout());\n }\n\n const printLoginActionButton = user => {\n let currentUser = userName;\n if (currentUser === user) {\n return (\n \n {i18n['Log out']}\n {data.FOCUSED ? L : }\n \n
\n );\n } else {\n return (\n \n signInAs(user)}>{i18n['login as']} {user}\n {data.FOCUSED ? L : }\n \n
\n );\n }\n }\n\n const toggleFavorite = (starred) => {\n if (starred) {\n toggleFav(data.NAME, 'add');\n } else {\n toggleFav(data.NAME, 'delete');\n }\n }\n\n const checkItemName = () => {\n checkItem(data.NAME);\n }\n\n const handleSuspend = () => {\n let suspendedStatus = data.SUSPENDED === 'yes' ? 'unsuspend' : 'suspend';\n handleModal(data.spnd_conf, `/api/v1/${suspendedStatus}/user/index.php?user=${data.NAME}`);\n }\n\n const handleDelete = () => {\n handleModal(data.delete_conf, `/api/v1/delete/user/index.php?user=${data.NAME}`);\n }\n\n return (\n \n\n \n {data.NAME}
\n {data.FNAME} {data.LNAME}
\n \n
\n {i18n.Bandwidth} {data.U_BANDWIDTH} {i18n.mb}
\n {i18n.Disk}: {data.U_DISK} {i18n.mb}
\n \n
\n
{i18n.Web}: {data.U_DISK_WEB} {i18n.mb}
\n
{i18n.Mail}: {data.U_DISK_MAIL} {i18n.mb}
\n
\n
\n
{i18n.Databases}: {data.U_DATABASES} {i18n.mb}
\n
{i18n['User Directories']}: {data.U_DISK_DIRS} {i18n.mb}
\n
\n
\n \n
\n {i18n['Web Domains']}: {data.U_WEB_DOMAINS} / {data.WEB_DOMAINS}
\n {i18n['DNS Domains']}: {data.U_DNS_DOMAINS} / {data.DNS_DOMAINS}
\n {i18n['Mail Domains']}: {data.U_MAIL_DOMAINS} / {data.MAIL_DOMAINS}
\n {i18n.Databases}: {data.U_DATABASES} / {data.DATABASES}
\n {i18n['Cron Jobs']}: {data.U_CRON_JOBS} / {data.CRON_JOBS}
\n {i18n.Backups}: {data.U_BACKUPS} / {data.BACKUPS}
\n \n
\n {i18n.Email}: {data.CONTACT}
\n {i18n.Package}: {data.PACKAGE}
\n {i18n['SSH Access']}: {data.SHELL}
\n {i18n['IP Addresses']}: {data.IP_OWNED}
\n {i18n['Name Servers']}: {printNameServers(data.NS)}
\n \n
\n \n \n {printLoginActionButton(data.NAME)}\n
\n {i18n.edit}\n {data.FOCUSED ? ↩ : }\n \n
\n
\n \n {data.spnd_action}\n {data.FOCUSED ? S : }\n \n
\n
\n \n {i18n.Delete}\n {data.FOCUSED ? Del : }\n \n
\n
\n \n );\n}\n\nexport default User;","import React, { useState, useEffect } from 'react';\nimport { addControlPanelContentFocusedElement, removeControlPanelContentFocusedElement } from '../../actions/ControlPanelContent/controlPanelContentActions';\nimport { addActiveElement, removeFocusedElement } from \"../../actions/MainNavigation/mainNavigationActions\";\nimport DropdownFilter from '../../components/MainNav/Toolbar/DropdownFilter/DropdownFilter';\nimport { bulkAction, getUsersList, handleAction } from '../../ControlPanelService/Users';\nimport * as MainNavigation from '../../actions/MainNavigation/mainNavigationActions';\nimport SearchInput from '../../components/MainNav/Toolbar/SearchInput/SearchInput';\nimport { addFavorite, deleteFavorite } from '../../ControlPanelService/Favorites';\nimport LeftButton from '../../components/MainNav/Toolbar/LeftButton/LeftButton';\nimport Checkbox from '../../components/MainNav/Toolbar/Checkbox/Checkbox';\nimport Select from '../../components/MainNav/Toolbar/Select/Select';\nimport Toolbar from '../../components/MainNav/Toolbar/Toolbar';\nimport Modal from '../../components/ControlPanel/Modal/Modal';\nimport { useDispatch, useSelector } from 'react-redux';\nimport Spinner from '../../components/Spinner/Spinner';\nimport User from '../../components/User/User';\nimport { Helmet } from 'react-helmet';\nimport './Users.scss';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\nimport { useHistory } from 'react-router';\n\nconst Users = props => {\n const { userName, i18n } = useSelector(state => state.session);\n const { session: { look } } = useSelector(state => state.userSession);\n const { controlPanelFocusedElement } = useSelector(state => state.controlPanelContent);\n const { focusedElement } = useSelector(state => state.mainNavigation);\n const dispatch = useDispatch();\n const history = useHistory();\n const [loading, setLoading] = useState(false);\n const [modal, setModal] = useState({\n text: '',\n visible: false,\n actionUrl: ''\n });\n const [state, setState] = useState({\n users: [],\n userFav: [],\n toggledAll: false,\n sorting: i18n.Date,\n order: \"descending\",\n selection: [],\n totalAmount: ''\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/user/'));\n dispatch(removeFocusedElement());\n dispatch(removeControlPanelContentFocusedElement());\n fetchData().then(() => setLoading(false));\n\n return () => {\n dispatch(removeControlPanelContentFocusedElement());\n }\n }, []);\n\n useEffect(() => {\n window.addEventListener(\"keydown\", handleContentSelection);\n window.addEventListener(\"keydown\", handleFocusedElementShortcuts);\n window.addEventListener(\"keyup\", addNewObject);\n\n return () => {\n window.removeEventListener(\"keydown\", handleContentSelection);\n window.removeEventListener(\"keydown\", handleFocusedElementShortcuts);\n window.removeEventListener(\"keyup\", addNewObject);\n };\n }, [controlPanelFocusedElement, focusedElement, state.users]);\n\n const addNewObject = event => {\n let isSearchInputFocused = document.querySelector('input:focus') || document.querySelector('textarea:focus');\n\n if (isSearchInputFocused) {\n return;\n }\n\n if (event.keyCode === 65) {\n switch (history.location.pathname) {\n case '/list/user/': return look ? history.push('/add/web/') : history.push('/add/user/');\n default: break;\n }\n }\n }\n\n const fetchData = () => {\n setLoading(true);\n return new Promise((resolve, reject) => {\n getUsersList()\n .then(result => {\n setState({\n ...state,\n users: reformatData(result.data.data),\n userFav: result.data.userFav,\n totalAmount: result.data.totalAmount,\n toggledAll: false,\n selection: []\n });\n resolve();\n })\n .catch(err => console.error(err));\n });\n }\n\n const handleFocusedElementShortcuts = event => {\n let isSearchInputFocused = document.querySelector('input:focus') || document.querySelector('textarea:focus');\n\n if (controlPanelFocusedElement && !isSearchInputFocused) {\n switch (event.keyCode) {\n case 76: return handleLogin();\n case 83: return handleSuspend();\n case 8: return handleDelete();\n case 13: return handleEdit();\n default: break;\n }\n }\n }\n\n const handleLogin = () => {\n if (userName === controlPanelFocusedElement) {\n props.history.push('/logout');\n } else {\n props.history.push(`/login/?loginas=${controlPanelFocusedElement}`);\n }\n }\n\n const handleEdit = () => {\n props.history.push(`/edit/user?user=${controlPanelFocusedElement}`);\n }\n\n const handleSuspend = () => {\n const { users } = state;\n let currentUserData = users.filter(user => user.NAME === controlPanelFocusedElement)[0];\n let suspendedStatus = currentUserData.SUSPENDED === 'yes' ? 'unsuspend' : 'suspend';\n\n displayModal(currentUserData.spnd_conf, `/api/v1/${suspendedStatus}/user/index.php?user=${controlPanelFocusedElement}`);\n }\n\n const handleDelete = () => {\n const { users } = state;\n let currentUserData = users.filter(user => user.NAME === controlPanelFocusedElement)[0];\n\n displayModal(currentUserData.delete_conf, `/api/v1/delete/user/index.php?user=${controlPanelFocusedElement}`);\n }\n\n const handleContentSelection = event => {\n if (event.keyCode === 38 || event.keyCode === 40) {\n if (focusedElement) {\n dispatch(MainNavigation.removeFocusedElement());\n }\n }\n\n if (event.keyCode === 38) {\n event.preventDefault();\n handleArrowUp();\n } else if (event.keyCode === 40) {\n event.preventDefault();\n handleArrowDown();\n }\n }\n\n const initFocusedElement = users => {\n users[0]['FOCUSED'] = users[0]['NAME'];\n setState({ ...state, users });\n dispatch(addControlPanelContentFocusedElement(users[0]['NAME']));\n }\n\n const handleArrowDown = () => {\n let users = [...state.users];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(users);\n return;\n }\n\n let focusedElementPosition = users.findIndex(user => user.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== users.length - 1) {\n let nextFocusedElement = users[focusedElementPosition + 1];\n users[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, users });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleArrowUp = () => {\n let users = [...state.users];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(users);\n return;\n }\n\n let focusedElementPosition = users.findIndex(user => user.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== 0) {\n let nextFocusedElement = users[focusedElementPosition - 1];\n users[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, users });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const changeSorting = (sorting, order) => {\n setState({\n ...state,\n sorting,\n order\n });\n }\n\n const reformatData = data => {\n let users = [];\n\n for (let i in data) {\n data[i]['NAME'] = i;\n data[i]['isChecked'] = false;\n data[i]['FOCUSED'] = controlPanelFocusedElement === i;\n users.push(data[i]);\n }\n\n return users;\n }\n\n const users = () => {\n const userFav = { ...state.userFav };\n let users = [...state.users];\n\n users.forEach(user => {\n user.FOCUSED = controlPanelFocusedElement === user.NAME;\n\n if (userFav[user.NAME]) {\n user.STARRED = userFav[user.NAME];\n } else {\n user.STARRED = 0;\n }\n });\n\n let sortedResult = sortArray(users);\n\n return sortedResult.map((item, index) => {\n return ;\n });\n }\n\n const checkItem = name => {\n const { selection, users } = state;\n let duplicate = [...selection];\n let userDuplicate = [...users];\n let checkedItem = duplicate.indexOf(name);\n\n let incomingItem = userDuplicate.findIndex(user => user.NAME === name);\n userDuplicate[incomingItem].isChecked = !userDuplicate[incomingItem].isChecked;\n\n if (checkedItem !== -1) {\n duplicate.splice(checkedItem, 1);\n } else {\n duplicate.push(name);\n }\n\n setState({ ...state, users: userDuplicate, selection: duplicate });\n }\n\n const sortArray = array => {\n let sortingColumn = sortBy(state.sorting);\n\n if (state.order === \"descending\") {\n return array.sort((a, b) => (a[sortingColumn] < b[sortingColumn]) ? 1 : ((b[sortingColumn] < a[sortingColumn]) ? -1 : 0));\n } else {\n return array.sort((a, b) => (a[sortingColumn] > b[sortingColumn]) ? 1 : ((b[sortingColumn] > a[sortingColumn]) ? -1 : 0));\n }\n }\n\n const sortBy = sorting => {\n const { Date: date, Username, Disk, Bandwidth, Starred } = i18n;\n\n switch (sorting) {\n case date: return 'DATE';\n case Username: return 'NAME';\n case Disk: return 'U_DISK';\n case Bandwidth: return 'U_BANDWIDTH';\n case Starred: return 'STARRED';\n default: break;\n }\n }\n\n const toggleFav = (value, type) => {\n let userFavDuplicate = state.userFav;\n\n if (type === 'add') {\n userFavDuplicate[value] = 1;\n\n addFavorite(value, 'user')\n .then(() => {\n setState({ ...state, userFav: userFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n } else {\n userFavDuplicate[value] = undefined;\n\n deleteFavorite(value, 'user')\n .then(() => {\n setState({ ...state, userFav: userFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n }\n }\n\n const toggleAll = toggled => {\n const usersDuplicate = [...state.users];\n\n if (toggled) {\n let userNames = [];\n\n let users = usersDuplicate.map(user => {\n userNames.push(user.NAME);\n user.isChecked = true;\n return user;\n });\n\n setState({ ...state, users, selection: userNames, toggledAll: toggled });\n } else {\n let users = usersDuplicate.map(user => {\n user.isChecked = false;\n return user;\n });\n\n setState({ ...state, users, selection: [], toggledAll: toggled });\n }\n }\n\n const bulk = action => {\n if (state.selection.length && action) {\n setLoading(true);\n bulkAction(action, state.selection)\n .then(result => {\n if (result.status === 200) {\n toggleAll(false);\n fetchData().then(() => refreshMenuCounters());\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n const displayModal = (text, url) => {\n setModal({\n ...modal,\n visible: true,\n text: text,\n actionUrl: url\n });\n }\n\n const modalConfirmHandler = () => {\n if (!modal.actionUrl) {\n return modalCancelHandler();\n }\n\n modalCancelHandler();\n setLoading(true);\n handleAction(modal.actionUrl)\n .then(res => {\n if (res.data.error) {\n setLoading(false);\n return displayModal(res.data.error, '');\n }\n fetchData().then(() => refreshMenuCounters())\n })\n .catch(err => { setLoading(false); console.error(err); });\n }\n\n const refreshMenuCounters = () => {\n dispatch(refreshCounters()).then(() => setLoading(false));\n }\n\n const modalCancelHandler = () => {\n setModal({\n ...modal,\n visible: false,\n text: '',\n actionUrl: ''\n });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.USER}`} \n \n
\n \n \n
\n \n \n \n props.changeSearchTerm(term)} />\n
\n
\n \n
\n {loading\n ?
\n : (<>\n {users()}\n
{state.totalAmount}
\n >)}\n
\n
\n
\n );\n}\n\nexport default Users;\n","import axios from \"axios\";\n\nconst BASE_URL = window.location.origin;\nconst webApiUri = '/api/v1/list/rrd/index.php';\n\nexport const getRrdList = () => {\n return axios.get(BASE_URL + webApiUri);\n}\n\nexport function generateImagePath(period, type, rrd) {\n return `/api/v1/list/rrd/image.php?/rrd/${type}/${period}-${rrd}.png`;\n}\n","import React, { useEffect, useState } from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport './Timer.scss';\n\nconst Timer = props => {\n const [isActive, setIsActive] = useState(true);\n\n useEffect(() => {\n let interval = null;\n\n if (isActive) {\n interval = setInterval(props.countDown, 1000);\n } else if (!isActive && props.time !== 0) {\n clearInterval(interval);\n }\n\n return () => clearInterval(interval);\n }, [isActive, props.time]);\n\n const handlePause = () => {\n setIsActive(!isActive);\n }\n\n return (\n \n
handlePause()}>\n {!isActive ? : }\n \n
\n {/* \n \n */}\n {props.time} \n
\n
\n )\n}\n\nexport default Timer;","import React from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faFileDownload } from '@fortawesome/free-solid-svg-icons';\nimport Container from '../ControlPanel/Container/Container';\nimport { generateImagePath } from '../../ControlPanelService/RRD';\nimport './RRD.scss';\nimport { useSelector } from 'react-redux';\n\nconst RRD = props => {\n const { data } = props;\n const { i18n } = useSelector(state => state.session);\n\n const printDate = date => {\n let newDate = new Date(date);\n let day = newDate.getDate();\n let month = newDate.getMonth();\n let year = newDate.getFullYear();\n let months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];\n\n return {day} {months[month]} {year}
;\n }\n\n return (\n \n
\n {printDate(data.DATE)}\n \n
\n {i18n[data.NAME]}
\n \n \n
\n
\n );\n}\n\nexport default RRD;","import React, { useEffect, useState } from 'react';\nimport { addControlPanelContentFocusedElement, removeControlPanelContentFocusedElement } from '../../actions/ControlPanelContent/controlPanelContentActions';\nimport { addActiveElement, removeFocusedElement } from '../../actions/MainNavigation/mainNavigationActions';\nimport * as MainNavigation from '../../actions/MainNavigation/mainNavigationActions';\nimport SearchInput from '../../components/MainNav/Toolbar/SearchInput/SearchInput';\nimport Toolbar from '../../components/MainNav/Toolbar/Toolbar';\nimport { getRrdList } from '../../ControlPanelService/RRD';\nimport Spinner from '../../components/Spinner/Spinner';\nimport { useDispatch, useSelector } from 'react-redux';\nimport Timer from '../../components/RRD/Timer/Timer';\nimport RRD from '../../components/RRD/RRD';\nimport './RRDs.scss';\nimport { Helmet } from 'react-helmet';\n\nconst RRDs = props => {\n const { i18n } = useSelector(state => state.session);\n const { controlPanelFocusedElement } = useSelector(state => state.controlPanelContent);\n const { focusedElement } = useSelector(state => state.mainNavigation);\n const dispatch = useDispatch();\n const [data, setData] = useState([]);\n const [state, setState] = useState({\n period: 'daily',\n periodI18N: i18n.Daily,\n time: 15,\n loading: false,\n total: 0\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/rrd/'));\n dispatch(removeFocusedElement());\n dispatch(removeControlPanelContentFocusedElement());\n fetchData();\n\n return () => {\n dispatch(removeControlPanelContentFocusedElement());\n }\n }, []);\n\n useEffect(() => {\n window.addEventListener(\"keydown\", handleContentSelection);\n\n return () => {\n window.removeEventListener(\"keydown\", handleContentSelection);\n };\n }, [controlPanelFocusedElement, focusedElement, data]);\n\n const handleContentSelection = event => {\n if (event.keyCode === 38 || event.keyCode === 40) {\n if (focusedElement) {\n dispatch(MainNavigation.removeFocusedElement());\n }\n }\n\n if (event.keyCode === 38) {\n event.preventDefault();\n handleArrowUp();\n } else if (event.keyCode === 40) {\n event.preventDefault();\n handleArrowDown();\n }\n }\n\n const initFocusedElement = data => {\n data[0]['FOCUSED'] = data[0]['NAME'];\n setData(data);\n dispatch(addControlPanelContentFocusedElement(data[0]['NAME']));\n }\n\n const handleArrowDown = () => {\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(data);\n return;\n }\n\n let focusedElementPosition = data.findIndex(pack => pack.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== data.length - 1) {\n let nextFocusedElement = data[focusedElementPosition + 1];\n data[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setData(data);\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleArrowUp = () => {\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(data);\n return;\n }\n\n let focusedElementPosition = data.findIndex(pack => pack.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== 0) {\n let nextFocusedElement = data[focusedElementPosition - 1];\n data[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setData(data);\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const countDown = () => {\n if (state.time === 0) {\n fetchData();\n } else {\n setState({ ...state, time: state.time - 1 });\n }\n }\n\n const fetchData = () => {\n dispatch(removeControlPanelContentFocusedElement());\n\n setState({ ...state, loading: true });\n\n getRrdList()\n .then(result => {\n setData(reformatData(result.data.data));\n setState({ ...state, time: 15, loading: false });\n })\n .catch(err => console.error(err));\n }\n\n const reformatData = data => {\n let rrds = [];\n\n for (let i in data) {\n data[i]['NAME'] = data[i]['TITLE'];\n data[i]['FOCUSED'] = controlPanelFocusedElement === i;\n rrds.push(data[i]);\n }\n\n return rrds;\n }\n\n const rrds = () => {\n let dataDuplicate = [...data];\n\n dataDuplicate.forEach(rrd => {\n rrd.FOCUSED = controlPanelFocusedElement === rrd.NAME;\n });\n\n return dataDuplicate.map((item, index) => {\n return ;\n });\n }\n\n const printPeriods = () => {\n const periods = [i18n.Daily, i18n.Weekly, i18n.Monthly, i18n.Yearly];\n\n return periods.map(period => ( changePeriod(period)}>{period}
));\n }\n\n const periodClass = period => {\n if (state.periodI18N === period) {\n return \"period active\";\n } else {\n return \"period\";\n }\n }\n\n const changePeriod = period => {\n switch (period) {\n case i18n.Daily: setState({ ...state, period: 'daily', periodI18N: i18n.Daily, time: 15 }); break;\n case i18n.Weekly: setState({ ...state, period: 'weekly', periodI18N: i18n.Weekly, time: 15 }); break;\n case i18n.Monthly: setState({ ...state, period: 'monthly', periodI18N: i18n.Monthly, time: 15 }); break;\n case i18n.Yearly: setState({ ...state, period: 'yearly', periodI18N: i18n.Yearly, time: 15 }); break;\n default: break;\n }\n }\n\n return (\n \n
\n {`Vesta - ${i18n.RRD}`} \n \n
\n \n {printPeriods()}\n \n
\n props.changeSearchTerm(term)} />\n \n
\n {state.loading ? : rrds()}\n
\n
\n );\n}\n\nexport default RRDs;","import React from 'react';\nimport ListItem from 'src/components/ControlPanel/ListItem/ListItem';\nimport Container from 'src/components/ControlPanel/Container/Container';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { useSelector } from 'react-redux';\n\nconst Ban = ({ data, ...props }) => {\n const { i18n } = useSelector(state => state.session);\n\n const checkItem = () => {\n props.checkItem(data.NAME);\n }\n\n const handleDelete = () => {\n props.handleModal(data.delete_confirmation, `/api/v1/delete/firewall/banlist/?ip=${data.NAME}&chain=${data.CHAIN}`);\n }\n\n return (\n \n \n \n
\n {data.DATE} {data.TIME}
\n \n
\n
\n \n
\n {data.CHAIN}
\n \n
\n {data.NAME}
\n \n
\n \n \n
\n handleDelete()}>\n {i18n.Delete}\n {data.FOCUSED ? Del : }\n \n
\n
\n \n );\n}\n\nexport default Ban;","import React, { useEffect, useState } from 'react';\nimport { addControlPanelContentFocusedElement, removeControlPanelContentFocusedElement } from 'src/actions/ControlPanelContent/controlPanelContentActions';\nimport { addActiveElement, removeFocusedElement } from 'src/actions/MainNavigation/mainNavigationActions';\nimport { bulkAction, getBanList, handleAction } from 'src/ControlPanelService/Firewalls';\nimport * as MainNavigation from 'src/actions/MainNavigation/mainNavigationActions';\nimport SearchInput from 'src/components/MainNav/Toolbar/SearchInput/SearchInput';\nimport LeftButton from 'src/components/MainNav/Toolbar/LeftButton/LeftButton';\nimport Checkbox from 'src/components/MainNav/Toolbar/Checkbox/Checkbox';\nimport Select from 'src/components/MainNav/Toolbar/Select/Select';\nimport Toolbar from 'src/components/MainNav/Toolbar/Toolbar';\nimport Modal from 'src/components/ControlPanel/Modal/Modal';\nimport { useDispatch, useSelector } from 'react-redux';\nimport Spinner from 'src/components/Spinner/Spinner';\nimport Ban from 'src/components/Firewall/Ban';\nimport { Helmet } from 'react-helmet';\nimport { useHistory } from 'react-router';\n\nimport './styles.scss';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\n\nconst BanLists = props => {\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const { controlPanelFocusedElement } = useSelector(state => state.controlPanelContent);\n const { focusedElement } = useSelector(state => state.mainNavigation);\n const dispatch = useDispatch();\n const [loading, setLoading] = useState(false);\n const [modal, setModal] = useState({\n text: '',\n visible: false,\n actionUrl: ''\n });\n const [state, setState] = useState({\n banIps: [],\n selection: [],\n toggledAll: false,\n sorting: i18n.Action,\n order: \"descending\",\n totalAmount: ''\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/firewall/'));\n dispatch(removeFocusedElement());\n dispatch(removeControlPanelContentFocusedElement());\n fetchData().then(() => setLoading(false));\n\n return () => {\n dispatch(removeControlPanelContentFocusedElement());\n }\n }, []);\n\n useEffect(() => {\n window.addEventListener(\"keydown\", handleContentSelection);\n window.addEventListener(\"keydown\", handleFocusedElementShortcuts);\n\n return () => {\n window.removeEventListener(\"keydown\", handleContentSelection);\n window.removeEventListener(\"keydown\", handleFocusedElementShortcuts);\n };\n }, [controlPanelFocusedElement, focusedElement, state.banIps]);\n\n const handleContentSelection = event => {\n if (event.keyCode === 38 || event.keyCode === 40) {\n if (focusedElement) {\n dispatch(MainNavigation.removeFocusedElement());\n }\n }\n\n if (event.keyCode === 38) {\n event.preventDefault();\n handleArrowUp();\n } else if (event.keyCode === 40) {\n event.preventDefault();\n handleArrowDown();\n }\n }\n\n const initFocusedElement = banIps => {\n banIps[0]['FOCUSED'] = banIps[0]['NAME'];\n setState({ ...state, banIps });\n dispatch(addControlPanelContentFocusedElement(banIps[0]['NAME']));\n }\n\n const handleArrowDown = () => {\n let banIps = [...state.banIps];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement.NAME === '') {\n initFocusedElement(banIps);\n return;\n }\n\n let focusedElementPosition = banIps.findIndex(banIp => banIp.NAME === controlPanelFocusedElement.NAME);\n\n if (focusedElementPosition !== banIps.length - 1) {\n let nextFocusedElement = banIps[focusedElementPosition + 1];\n banIps[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, banIps });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleArrowUp = () => {\n let banIps = [...state.banIps];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement.NAME === '') {\n initFocusedElement(banIps);\n return;\n }\n\n let focusedElementPosition = banIps.findIndex(banIp => banIp.NAME === controlPanelFocusedElement.NAME);\n\n if (focusedElementPosition !== 0) {\n let nextFocusedElement = banIps[focusedElementPosition - 1];\n banIps[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, banIps });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleFocusedElementShortcuts = event => {\n let isSearchInputFocused = document.querySelector('input:focus') || document.querySelector('textarea:focus');\n\n if (controlPanelFocusedElement && !isSearchInputFocused) {\n switch (event.keyCode) {\n case 8: return handleDelete();\n default: break;\n }\n }\n }\n\n const handleDelete = () => {\n const { banIps } = state;\n let currentBanIpData = banIps.filter(banIp => banIp.NAME === controlPanelFocusedElement.NAME)[0];\n\n displayModal(currentBanIpData.delete_conf, controlPanelFocusedElement.delete_url);\n }\n\n const fetchData = () => {\n setLoading(true);\n return new Promise((resolve, reject) => {\n getBanList()\n .then(result => {\n setState({\n ...state,\n banIps: reformatData(result.data.data),\n totalAmount: result.data.total_amount,\n toggledAll: false,\n selection: []\n });\n resolve();\n })\n .catch(err => console.error(err));\n });\n }\n\n const reformatData = data => {\n let banIps = [];\n\n for (let i in data) {\n data[i]['NAME'] = i;\n data[i]['FOCUSED'] = controlPanelFocusedElement.NAME === i;\n banIps.push(data[i]);\n }\n\n return banIps;\n }\n\n const banIps = () => {\n let banIps = [...state.banIps];\n\n banIps.forEach(banIp => {\n banIp.FOCUSED = controlPanelFocusedElement.NAME === banIp.NAME;\n });\n\n return banIps.map((item, index) => {\n return ;\n });\n }\n\n const checkItem = name => {\n const { selection, banIps } = state;\n let duplicate = [...selection];\n let banIpsDuplicate = banIps;\n let checkedItem = duplicate.indexOf(name);\n\n let incomingItem = banIpsDuplicate.findIndex(banIp => banIp.NAME === name);\n banIpsDuplicate[incomingItem].isChecked = !banIpsDuplicate[incomingItem].isChecked;\n\n if (checkedItem !== -1) {\n duplicate.splice(checkedItem, 1);\n } else {\n duplicate.push(name);\n }\n\n setState({ ...state, banIps: banIpsDuplicate, selection: duplicate });\n }\n\n const toggleAll = toggled => {\n if (toggled) {\n let banIpNames = [];\n\n let banIps = state.banIps.map(banIp => {\n banIpNames.push(banIp.NAME);\n banIp.isChecked = true;\n return banIp;\n });\n\n setState({ ...state, banIps, selection: banIpNames, toggledAll: toggled });\n } else {\n let banIps = state.banIps.map(banIp => {\n banIp.isChecked = false;\n return banIp;\n });\n\n setState({ ...state, banIps, selection: [], toggledAll: toggled });\n }\n }\n\n const bulk = action => {\n const { selection } = state;\n\n if (selection.length && action) {\n bulkAction(action, selection, state.banIps)\n .then(result => {\n if (result.status === 200) {\n toggleAll(false);\n fetchData();\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n const displayModal = (text, actionUrl) => {\n setModal({ ...modal, visible: !modal.visible, text, actionUrl });\n }\n\n const modalConfirmHandler = () => {\n if (!modal.actionUrl) {\n return modalCancelHandler();\n }\n\n modalCancelHandler();\n setLoading(true);\n handleAction(modal.actionUrl)\n .then(res => {\n if (res.data.error) {\n setLoading(false);\n return displayModal(res.data.error, '');\n }\n fetchData();\n })\n .catch(err => { setLoading(false); console.error(err); });\n }\n\n const modalCancelHandler = () => {\n setModal({ ...modal, visible: !modal.visible, text: '', actionUrl: '' });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.FIREWALL}`} \n \n
\n \n \n
\n \n \n props.changeSearchTerm(term)} />\n
\n
\n \n {loading\n ?
\n : (<>\n
\n {banIps()}\n
\n
{state.totalAmount}
\n
history.push('/list/firewall/')}>{i18n.Back} \n
\n
\n >)\n }\n
\n
\n );\n}\n\nexport default BanLists;\n","import React from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Container from '../ControlPanel/Container/Container';\nimport ListItem from '../ControlPanel/ListItem/ListItem';\nimport { Link } from 'react-router-dom';\nimport './WebDomain.scss';\nimport { useSelector } from 'react-redux';\n\nexport default function WebDomain(props) {\n const { data } = props;\n const { i18n } = useSelector(state => state.session);\n\n const printStat = (stat, text) => {\n if (text === 'no' || text === '') {\n return {stat}
;\n }\n\n return {stat}: {text}
;\n }\n\n const toggleFav = (starred) => {\n if (starred) {\n props.toggleFav(data.NAME, 'add');\n } else {\n props.toggleFav(data.NAME, 'delete');\n }\n }\n\n const checkItem = () => {\n props.checkItem(data.NAME);\n }\n\n const renderProxySupport = () => {\n if (!data.PROXY_SYSTEM) return;\n\n if (data.PROXY_SUPPORT === 'no') {\n printStat(i18n['Proxy Support'], '');\n } else {\n printStat(i18n['Proxy Support'], data.PROXY_SUPPORT);\n }\n }\n\n const renderBackedSupport = () => {\n if (!data.WEB_BACKEND) return;\n\n if (data.BACKEND_SUPPORT === 'no') {\n printStat(i18n['Backend Support'] ?? 'Backend Support', '');\n } else {\n printStat(i18n['Backend Support'] ?? 'Backend Support', data.BACKEND_SUPPORT);\n }\n }\n\n const handleSuspend = () => {\n let suspendedStatus = data.SUSPENDED === 'yes' ? 'unsuspend' : 'suspend';\n props.handleModal(data.spnd_confirmation, `/api/v1/${suspendedStatus}/web/index.php?domain=${data.NAME}`);\n }\n\n const handleDelete = () => {\n props.handleModal(data.delete_confirmation, `/api/v1/delete/web/index.php?domain=${data.NAME}`);\n }\n\n return (\n \n \n \n
{data.NAME}
\n
{data.ALIAS}
\n
\n {data.IP}
\n \n
\n {i18n.Bandwidth} {data.U_BANDWIDTH_SIZE} {data.U_BANDWIDTH_MEASURE}
\n {i18n.Disk}: {data.U_DISK_SIZE} {data.U_DISK_MEASURE}
\n \n
\n {i18n['Web Template']}: {data.TPL}
\n {data.SSL === 'no'\n ? printStat(i18n['SSL Support'], '')\n : printStat(i18n['SSL Support'], data.LETSENCRYPT === 'yes' ? i18n['Lets Encrypt'] : i18n[data.SSL])}\n {printStat(i18n['Web Statistics'], data.WEB_STATS)}\n \n
\n {renderProxySupport()}\n {data.PROXY_SYSTEM && printStat(i18n['Proxy Template'] ?? 'Proxy Template', data.PROXY)}\n {renderBackedSupport()}\n {data.WEB_BACKEND && printStat(i18n['Backend Template'] ?? 'Backend Template', data.BACKEND)}\n {printStat(i18n['Additional FTP Account'], data.FTP)}\n \n
\n \n \n
\n \n {i18n.edit}\n {data.FOCUSED ? ↩ : }\n \n
\n
\n \n {i18n['view logs']}\n {data.FOCUSED ? L : }\n \n
\n {\n data.STATS && (\n
\n )\n }\n
\n \n {i18n[data.spnd_action]}\n {data.FOCUSED ? S : }\n \n
\n
\n \n {i18n.Delete}\n {data.FOCUSED ? Del : }\n \n
\n
\n \n );\n}\n","import React, { useState, useEffect } from 'react';\nimport { addControlPanelContentFocusedElement, removeControlPanelContentFocusedElement } from '../../actions/ControlPanelContent/controlPanelContentActions';\nimport { addActiveElement, removeFocusedElement } from '../../actions/MainNavigation/mainNavigationActions';\nimport DropdownFilter from '../../components/MainNav/Toolbar/DropdownFilter/DropdownFilter';\nimport { bulkAction, getWebList, handleAction } from '../../ControlPanelService/Web';\nimport * as MainNavigation from '../../actions/MainNavigation/mainNavigationActions';\nimport SearchInput from '../../components/MainNav/Toolbar/SearchInput/SearchInput';\nimport { addFavorite, deleteFavorite } from '../../ControlPanelService/Favorites';\nimport LeftButton from '../../components/MainNav/Toolbar/LeftButton/LeftButton';\nimport Checkbox from '../../components/MainNav/Toolbar/Checkbox/Checkbox';\nimport Select from '../../components/MainNav/Toolbar/Select/Select';\nimport Toolbar from '../../components/MainNav/Toolbar/Toolbar';\nimport WebDomain from '../../components/WebDomain/WebDomain';\nimport Spinner from '../../components/Spinner/Spinner';\nimport Modal from '../../components/ControlPanel/Modal/Modal';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { Helmet } from 'react-helmet';\nimport './Web.scss';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\n\nconst Web = props => {\n const { i18n } = useSelector(state => state.session);\n const { controlPanelFocusedElement } = useSelector(state => state.controlPanelContent);\n const { focusedElement } = useSelector(state => state.mainNavigation);\n const dispatch = useDispatch();\n const [loading, setLoading] = useState(false);\n const [modal, setModal] = useState({\n text: '',\n visible: false,\n actionUrl: ''\n });\n const [state, setState] = useState({\n webDomains: [],\n webFav: [],\n toggledAll: false,\n sorting: i18n.Date,\n order: \"descending\",\n selection: [],\n totalAmount: ''\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/web/'));\n dispatch(removeFocusedElement());\n dispatch(removeControlPanelContentFocusedElement());\n fetchData().then(() => setLoading(false));\n\n return () => {\n dispatch(removeControlPanelContentFocusedElement());\n }\n }, []);\n\n useEffect(() => {\n window.addEventListener(\"keydown\", handleContentSelection);\n window.addEventListener(\"keydown\", handleFocusedElementShortcuts);\n\n return () => {\n window.removeEventListener(\"keydown\", handleContentSelection);\n window.removeEventListener(\"keydown\", handleFocusedElementShortcuts);\n };\n }, [controlPanelFocusedElement, focusedElement, state.webDomains]);\n\n const handleContentSelection = event => {\n if (event.keyCode === 38 || event.keyCode === 40) {\n if (focusedElement) {\n dispatch(MainNavigation.removeFocusedElement());\n }\n }\n\n if (event.keyCode === 38) {\n event.preventDefault();\n handleArrowUp();\n } else if (event.keyCode === 40) {\n event.preventDefault();\n handleArrowDown();\n }\n }\n\n const initFocusedElement = webDomains => {\n webDomains[0]['FOCUSED'] = webDomains[0]['NAME'];\n setState({ ...state, webDomains });\n dispatch(addControlPanelContentFocusedElement(webDomains[0]['NAME']));\n }\n\n const handleArrowDown = () => {\n let webDomains = [...state.webDomains];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(webDomains);\n return;\n }\n\n let focusedElementPosition = webDomains.findIndex(webDomain => webDomain.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== webDomains.length - 1) {\n let nextFocusedElement = webDomains[focusedElementPosition + 1];\n webDomains[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, webDomains });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleArrowUp = () => {\n let webDomains = [...state.webDomains];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(webDomains);\n return;\n }\n\n let focusedElementPosition = webDomains.findIndex(webDomain => webDomain.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== 0) {\n let nextFocusedElement = webDomains[focusedElementPosition - 1];\n webDomains[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, webDomains });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleFocusedElementShortcuts = event => {\n let isSearchInputFocused = document.querySelector('input:focus') || document.querySelector('textarea:focus');\n\n if (controlPanelFocusedElement && !isSearchInputFocused) {\n switch (event.keyCode) {\n case 76: return handleLogs();\n case 83: return handleSuspend();\n case 8: return handleDelete();\n case 13: return handleEdit();\n default: break;\n }\n }\n }\n\n const handleLogs = () => {\n props.history.push(`/list/web-log?domain=${controlPanelFocusedElement}&type=access`);\n }\n\n const handleEdit = () => {\n props.history.push(`/edit/web?domain=${controlPanelFocusedElement}`);\n }\n\n const handleSuspend = () => {\n const { webDomains } = state;\n let currentWebDomainData = webDomains.filter(webDomain => webDomain.NAME === controlPanelFocusedElement)[0];\n let suspendedStatus = currentWebDomainData.SUSPENDED === 'yes' ? 'unsuspend' : 'suspend';\n\n displayModal(currentWebDomainData.spnd_confirmation, `/api/v1/${suspendedStatus}/web/index.php?domain=${controlPanelFocusedElement}`);\n }\n\n const handleDelete = () => {\n const { webDomains } = state;\n let currentWebDomainData = webDomains.filter(webDomain => webDomain.NAME === controlPanelFocusedElement)[0];\n\n displayModal(currentWebDomainData.delete_confirmation, `/api/v1/web/index.php?domain=${controlPanelFocusedElement}`);\n }\n\n const fetchData = () => {\n setLoading(true);\n return new Promise((resolve, reject) => {\n getWebList()\n .then(result => {\n setState({\n ...state,\n webDomains: reformatData(result.data.data),\n webFav: result.data.webFav,\n totalAmount: result.data.totalAmount,\n toggledAll: false,\n selection: []\n });\n resolve();\n })\n .catch(err => console.error(err));\n });\n }\n\n const changeSorting = (sorting, order) => {\n setState({\n ...state,\n sorting,\n order\n });\n }\n\n const reformatData = data => {\n let webDomains = [];\n\n for (let i in data) {\n data[i]['NAME'] = i;\n data[i]['FOCUSED'] = controlPanelFocusedElement === i;\n webDomains.push(data[i]);\n }\n\n return webDomains;\n }\n\n const webDomains = () => {\n const webFav = { ...state.webFav };\n let webDomains = [...state.webDomains];\n\n webDomains.forEach(webDomain => {\n webDomain.FOCUSED = controlPanelFocusedElement === webDomain.NAME;\n\n if (webFav[webDomain.NAME]) {\n webDomain.STARRED = webFav[webDomain.NAME];\n } else {\n webDomain.STARRED = 0;\n }\n });\n\n let sortedResult = sortArray(webDomains);\n\n return sortedResult.map((item, index) => {\n return ;\n });\n }\n\n const checkItem = name => {\n let duplicate = [...state.selection];\n let webDomainsDuplicate = state.webDomains;\n let checkedItem = duplicate.indexOf(name);\n\n let incomingItem = webDomainsDuplicate.findIndex(webDomain => webDomain.NAME === name);\n webDomainsDuplicate[incomingItem].isChecked = !webDomainsDuplicate[incomingItem].isChecked;\n\n if (checkedItem !== -1) {\n duplicate.splice(checkedItem, 1);\n } else {\n duplicate.push(name);\n }\n\n setState({ ...state, webDomains: webDomainsDuplicate, selection: duplicate });\n }\n\n const sortArray = array => {\n let sortingColumn = sortBy(state.sorting);\n\n if (state.order === \"descending\") {\n return array.sort((a, b) => (a[sortingColumn] < b[sortingColumn]) ? 1 : ((b[sortingColumn] < a[sortingColumn]) ? -1 : 0));\n } else {\n return array.sort((a, b) => (a[sortingColumn] > b[sortingColumn]) ? 1 : ((b[sortingColumn] > a[sortingColumn]) ? -1 : 0));\n }\n }\n\n const sortBy = sorting => {\n const { Date: date, Domain, Disk, Bandwidth, Starred } = i18n;\n\n switch (sorting) {\n case date: return 'DATE';\n case Domain: return 'ALIAS';\n case i18n['IP Addresses']: return 'IP';\n case Disk: return 'U_DISK';\n case Bandwidth: return 'U_BANDWIDTH';\n case Starred: return 'STARRED';\n default: break;\n }\n }\n\n const toggleFav = (value, type) => {\n let webFavDuplicate = state.webFav;\n\n if (type === 'add') {\n webFavDuplicate[value] = 1;\n\n addFavorite(value, 'web')\n .then(() => {\n setState({ ...state, webFav: webFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n } else {\n webFavDuplicate[value] = undefined;\n\n deleteFavorite(value, 'web')\n .then(() => {\n setState({ ...state, webFav: webFavDuplicate });\n })\n .catch(err => {\n console.error(err);\n });\n }\n }\n\n const toggleAll = toggled => {\n const webDomainsDuplicate = [...state.webDomains];\n\n if (toggled) {\n let webDomainNames = [];\n\n let webDomains = webDomainsDuplicate.map(webDomain => {\n webDomainNames.push(webDomain.NAME);\n webDomain.isChecked = true;\n return webDomain;\n });\n\n setState({ ...state, webDomains, selection: webDomainNames, toggledAll: toggled });\n } else {\n let webDomains = webDomainsDuplicate.map(webDomain => {\n webDomain.isChecked = false;\n return webDomain;\n });\n\n setState({ ...state, webDomains, selection: [], toggledAll: toggled });\n }\n }\n\n const bulk = action => {\n if (state.selection.length && action) {\n setLoading(true);\n bulkAction(action, state.selection)\n .then(result => {\n toggleAll(false);\n fetchData().then(() => refreshMenuCounters());\n })\n .catch(err => console.error(err));\n }\n }\n\n const displayModal = (text, url) => {\n setModal({\n ...modal,\n visible: true,\n text,\n actionUrl: url\n });\n }\n\n const modalConfirmHandler = () => {\n if (!modal.actionUrl) {\n return modalCancelHandler();\n }\n\n modalCancelHandler();\n setLoading(true);\n handleAction(modal.actionUrl)\n .then(res => {\n if (res.data.error) {\n setLoading(false);\n return displayModal(res.data.error, '');\n }\n fetchData().then(() => refreshMenuCounters())\n })\n .catch(err => { setLoading(false); console.error(err); });\n }\n\n const refreshMenuCounters = () => {\n dispatch(refreshCounters()).then(() => setLoading(false));\n }\n\n const modalCancelHandler = () => {\n setModal({\n ...modal,\n visible: false,\n text: '',\n actionUrl: ''\n });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.WEB}`} \n \n
\n \n \n
\n \n \n \n props.changeSearchTerm(term)} />\n
\n
\n \n
\n {loading\n ?
\n : (\n <>\n {webDomains()}\n
{state.totalAmount}
\n >\n )\n }\n
\n
\n
\n );\n}\n\nexport default Web;","import React, { useEffect, useState } from 'react';\nimport { addActiveElement, removeFocusedElement } from \"src/actions/MainNavigation/mainNavigationActions\";\nimport TextInput from 'src/components/ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport AddItemLayout from 'src/components/ControlPanel/AddItemLayout/AddItemLayout';\nimport TextArea from 'src/components/ControlPanel/AddItemLayout/Form/TextArea/TextArea';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Toolbar from 'src/components/MainNav/Toolbar/Toolbar';\nimport { generateCSR, getCsrInitialData } from 'src/ControlPanelService/Web';\nimport { useDispatch, useSelector } from 'react-redux';\nimport Spinner from 'src/components/Spinner/Spinner';\nimport { useHistory } from 'react-router-dom';\nimport HtmlParser from 'react-html-parser';\nimport { Helmet } from 'react-helmet';\nimport QS from 'qs';\n\nconst GenerateSSL = props => {\n const token = localStorage.getItem(\"token\");\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const dispatch = useDispatch();\n const [errorMessage, setErrorMessage] = useState('');\n const [okMessage, setOkMessage] = useState('');\n const [state, setState] = useState({\n data: {},\n generatedData: {},\n loading: false,\n domain: ''\n });\n\n useEffect(() => {\n let queryParams = QS.parse(history.location.search, { ignoreQueryPrefix: true });\n const { domain } = queryParams;\n\n dispatch(addActiveElement('/list/web/'));\n dispatch(removeFocusedElement());\n\n if (domain) {\n fetchData(domain);\n } else {\n fetchData();\n }\n }, []);\n\n const fetchData = (domain = '') => {\n getCsrInitialData(domain)\n .then(response => {\n setState({\n ...state,\n domain,\n generatedData: {},\n data: response.data,\n loading: false\n });\n })\n .catch(err => {\n setState({ ...state, loading: false });\n console.error(err);\n });\n }\n\n const submitFormHandler = event => {\n event.preventDefault();\n let newCsr = {};\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n newCsr[name] = value;\n }\n\n newCsr['generate'] = 'generate';\n\n if (Object.keys(newCsr).length !== 0 && newCsr.constructor === Object) {\n setState({ ...state, loading: true });\n\n generateCSR(newCsr)\n .then(result => {\n if (result.status === 200) {\n const { error_msg: errorMessage, ok_msg: okMessage, crt, key, csr } = result.data;\n\n if (errorMessage) {\n setErrorMessage(errorMessage);\n setOkMessage('');\n setState({ ...state, generatedData: {}, loading: false });\n } else {\n setErrorMessage('');\n setOkMessage(okMessage);\n\n setState({ ...state, generatedData: { crt, key, csr }, loading: false });\n }\n }\n })\n .catch(err => console.error(err));\n }\n }\n\n return (\n \n
\n {`Vesta - ${i18n.WEB}`} \n \n
\n
\n {i18n['Generating CSR']}
\n {errorMessage ? : ''} {errorMessage}
\n \n {okMessage ? : ''} {HtmlParser(okMessage)} \n
\n \n
\n {state.loading ? :\n submitFormHandler(event)} id=\"add-user\">\n \n\n {\n Object.entries(state.generatedData).length\n ? (<>\n \n\n \n\n \n\n \n history.push(`/edit/web/?domain=${state.domain}`)}>{i18n.Back} \n
\n >)\n : (<>\n \n\n \n\n \n\n \n\n \n\n \n\n \n {i18n.Save} \n history.push(`/edit/web/?domain=${state.domain}`)}>{i18n.Back} \n
\n >)\n }\n\n \n }\n \n
\n );\n}\n\nexport default GenerateSSL;\n","import axios from \"axios\";\nimport { getAuthToken } from \"src/utils/token\";\n\nconst BASE_URL = window.location.origin;\nconst webApiUri = '/api/v1/search/';\n\nexport const getSearchResultsList = term => {\n return axios.get(BASE_URL + webApiUri + '?q=' + term);\n}\n\nexport const handleAction = uri => {\n return axios.get(BASE_URL + uri, {\n params: {\n token: getAuthToken()\n }\n });\n}\n","import React from 'react';\nimport { loginAs, logout } from 'src/actions/Session/sessionActions';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Container from '../ControlPanel/Container/Container';\nimport ListItem from '../ControlPanel/ListItem/ListItem';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { Link, useHistory } from 'react-router-dom';\nimport './SearchItem.scss';\n\nconst SearchItem = ({ data, handleModal }) => {\n const { i18n, userName } = useSelector(state => state.session);\n const dispatch = useDispatch();\n const history = useHistory()\n\n const signInAs = user => {\n dispatch(loginAs(user)).then(() => history.push('/'));\n }\n\n const signOut = () => {\n dispatch(logout()).then(() => history.push('/'));\n }\n\n const handleDelete = () => {\n handleModal(data.delete_confirmation, `/api/v1/${data.TYPE === 'user' ? `/api/v1/delete/user/index.php?user=${data.USER}` : data.delete_link}`);\n }\n\n const handleSuspend = () => {\n handleModal(data.spnd_confirmation, `/api/v1/${data.TYPE === 'user' ? `${data.spnd_action}/user/index.php?user=${data.USER}` : data.spnd_link}`);\n }\n\n const printLoginActionButton = () => {\n if (data.TYPE !== 'user') return;\n\n if (userName === data.USER) {\n return (\n \n {i18n['Log out']}\n {data.FOCUSED ? L : }\n \n
\n );\n } else {\n return (\n \n signInAs(data.USER)}>{i18n['login as']} {data.USER}\n {data.FOCUSED ? L : }\n \n
\n );\n }\n }\n\n return (\n \n \n {data.RESULT}
\n \n
\n {data.TYPE === 'user' ? i18n['USER'] : i18n[data.object]}
\n \n
\n {i18n.Owner}: {data.USER}
\n \n
\n {i18n.Status}: {data.status}
\n \n
\n \n \n {printLoginActionButton()}\n
{i18n.edit}
\n
\n \n {data.spnd_action}\n \n \n
\n
\n \n {i18n.Delete}\n \n \n
\n
\n \n );\n}\n\nexport default SearchItem;\n","import React, { Component, useEffect, useState } from 'react';\nimport DropdownFilter from '../../components/MainNav/Toolbar/DropdownFilter/DropdownFilter';\nimport { getSearchResultsList, handleAction } from '../../ControlPanelService/Search';\nimport SearchInput from '../../components/MainNav/Toolbar/SearchInput/SearchInput';\nimport SearchItem from '../../components/Searchitem/SearchItem';\nimport Toolbar from '../../components/MainNav/Toolbar/Toolbar';\nimport Modal from '../../components/ControlPanel/Modal/Modal';\nimport Spinner from '../../components/Spinner/Spinner';\nimport './Search.scss';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { useHistory } from 'react-router-dom';\nimport { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';\n\nconst Search = props => {\n const { i18n } = useSelector(state => state.session);\n const history = useHistory();\n const dispatch = useDispatch();\n const [loading, setLoading] = useState(false);\n const [state, setState] = useState({\n searchResults: [],\n totalAmount: '',\n sorting: i18n.Date,\n order: \"descending\",\n total: 0\n });\n const [modal, setModal] = useState({\n visible: false,\n text: '',\n actionUrl: ''\n });\n\n useEffect(() => {\n const { search } = history.location;\n\n if (search) {\n let searchTerm = search.split('=')[1];\n\n if (searchTerm !== '') {\n fetchData(searchTerm).then(() => setLoading(false));\n } else {\n return history.push({ pathname: '/list/user/', search: '' });\n }\n } else if (props.searchTerm !== '') {\n fetchData(props.searchTerm).then(() => setLoading(false));\n } else {\n return history.push({ pathname: '/list/user/', search: '' });\n }\n }, []);\n\n const fetchData = searchTerm => {\n setLoading(true);\n return new Promise((resolve, reject) => {\n getSearchResultsList(searchTerm)\n .then(result => {\n setState({\n ...state,\n searchResults: result.data.data,\n totalAmount: result.data.total\n });\n resolve();\n })\n .catch(err => console.error(err));\n });\n }\n\n const searchResults = () => {\n const { searchResults } = state;\n const result = [];\n\n for (let i in searchResults) {\n result.push(searchResults[i]);\n }\n\n let sortedResult = sortArray(result);\n\n return sortedResult.map((item, index) => {\n return ;\n });\n }\n\n const changeSorting = (sorting, order) => {\n setState({\n ...state,\n sorting,\n order\n });\n }\n\n const sortArray = array => {\n const { order, sorting } = state;\n let sortBy = sortByHandler(sorting);\n\n if (order === \"descending\") {\n return array.sort((a, b) => (a[sortBy] < b[sortBy]) ? 1 : ((b[sortBy] < a[sortBy]) ? -1 : 0));\n } else {\n return array.sort((a, b) => (a[sortBy] > b[sortBy]) ? 1 : ((b[sortBy] > a[sortBy]) ? -1 : 0));\n }\n }\n\n const sortByHandler = sorting => {\n const { Date, Name, Starred } = i18n;\n\n switch (sorting) {\n case Date: return 'DATE';\n case Name: return 'RESULT';\n default: break;\n }\n }\n\n const displayModal = (text, url) => {\n setModal({\n ...modal,\n visible: !modal.visible,\n text,\n actionUrl: url\n });\n }\n\n const modalConfirmHandler = () => {\n if (!modal.actionUrl) {\n return modalCancelHandler();\n }\n\n modalCancelHandler();\n setLoading(true);\n handleAction(modal.actionUrl)\n .then(res => {\n if (res.data.error) {\n setLoading(false);\n return displayModal(res.data.error, '');\n }\n fetchData().then(() => refreshMenuCounters())\n })\n .catch(err => { setLoading(false); console.error(err); });\n }\n\n const refreshMenuCounters = () => {\n dispatch(refreshCounters()).then(() => setLoading(false));\n }\n\n const modalCancelHandler = () => {\n setModal({\n ...modal,\n visible: false,\n text: '',\n actionUrl: ''\n });\n }\n\n return (\n \n
\n {i18n['Search Results']}
\n \n \n props.changeSearchTerm(term)} />\n
\n \n
\n {loading\n ?
\n : (<>\n {searchResults()}\n
{state.totalAmount}
\n >)}\n
\n
\n
\n );\n}\n\nexport default Search;\n","import axios from \"axios\";\n\nconst BASE_URL = window.location.origin;\nconst webApiUri = '/api/v1/list/log/index.php';\n\nexport const getLogsList = () => {\n return axios.get(BASE_URL + webApiUri);\n}","import React from 'react';\nimport Container from '../ControlPanel/Container/Container';\nimport './Log.scss';\n\nconst Log = props => {\n const { data } = props;\n\n const printDate = date => {\n let newDate = new Date(date);\n let day = newDate.getDate();\n let month = newDate.getMonth();\n let year = newDate.getFullYear();\n let months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];\n\n return {day} {months[month]} {year}
;\n }\n\n return (\n \n
\n {printDate(data.DATE)}\n {data.TIME}\n \n
\n {data.CMD}
\n \n
\n );\n}\n\nexport default Log;","import React, { useEffect, useState } from 'react';\nimport { addControlPanelContentFocusedElement, removeControlPanelContentFocusedElement } from '../../actions/ControlPanelContent/controlPanelContentActions';\nimport { addActiveElement, removeFocusedElement } from '../../actions/MainNavigation/mainNavigationActions';\nimport * as MainNavigation from '../../actions/MainNavigation/mainNavigationActions';\nimport SearchInput from '../../components/MainNav/Toolbar/SearchInput/SearchInput';\nimport LeftButton from '../../components/MainNav/Toolbar/LeftButton/LeftButton';\nimport Toolbar from '../../components/MainNav/Toolbar/Toolbar';\nimport { getLogsList } from '../../ControlPanelService/Logs';\nimport Spinner from '../../components/Spinner/Spinner';\nimport { useDispatch, useSelector } from 'react-redux';\nimport Log from '../../components/Log/Log';\nimport './Logs.scss';\nimport { Helmet } from 'react-helmet';\n\nconst Logs = props => {\n const { i18n } = useSelector(state => state.session);\n const { controlPanelFocusedElement } = useSelector(state => state.controlPanelContent);\n const { focusedElement } = useSelector(state => state.mainNavigation);\n const dispatch = useDispatch();\n const [state, setState] = useState({\n logs: [],\n totalAmount: '',\n loading: false,\n total: 0\n });\n\n useEffect(() => {\n dispatch(addActiveElement('/list/log/'));\n dispatch(removeFocusedElement());\n dispatch(removeControlPanelContentFocusedElement());\n fetchData();\n\n return () => {\n dispatch(removeControlPanelContentFocusedElement());\n }\n }, []);\n\n useEffect(() => {\n window.addEventListener(\"keydown\", handleContentSelection);\n\n return () => {\n window.removeEventListener(\"keydown\", handleContentSelection);\n };\n }, [controlPanelFocusedElement, focusedElement, state.logs]);\n\n const handleContentSelection = event => {\n if (event.keyCode === 38 || event.keyCode === 40) {\n if (focusedElement) {\n dispatch(MainNavigation.removeFocusedElement());\n }\n }\n\n if (event.keyCode === 38) {\n event.preventDefault();\n handleArrowUp();\n } else if (event.keyCode === 40) {\n event.preventDefault();\n handleArrowDown();\n }\n }\n\n const initFocusedElement = logs => {\n logs[0]['FOCUSED'] = logs[0]['NAME'];\n setState({ ...state, logs });\n dispatch(addControlPanelContentFocusedElement(logs[0]['NAME']));\n }\n\n const handleArrowDown = () => {\n let logs = [...state.logs];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(logs);\n return;\n }\n\n let focusedElementPosition = logs.findIndex(log => log.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== logs.length - 1) {\n let nextFocusedElement = logs[focusedElementPosition + 1];\n logs[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, logs });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const handleArrowUp = () => {\n let logs = [...state.logs];\n\n if (focusedElement) {\n MainNavigation.removeFocusedElement();\n }\n\n if (controlPanelFocusedElement === '') {\n initFocusedElement(logs);\n return;\n }\n\n let focusedElementPosition = logs.findIndex(log => log.NAME === controlPanelFocusedElement);\n\n if (focusedElementPosition !== 0) {\n let nextFocusedElement = logs[focusedElementPosition - 1];\n logs[focusedElementPosition]['FOCUSED'] = '';\n nextFocusedElement['FOCUSED'] = nextFocusedElement['NAME'];\n document.getElementById(nextFocusedElement['NAME']).scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n setState({ ...state, logs });\n dispatch(addControlPanelContentFocusedElement(nextFocusedElement['NAME']));\n }\n }\n\n const fetchData = () => {\n setState({ ...state, loading: true });\n\n getLogsList()\n .then(result => {\n setState({\n logs: reformatData(result.data.data),\n totalAmount: result.data.totalAmount,\n loading: false\n });\n })\n .catch(err => console.error(err));\n }\n\n const reformatData = data => {\n let logs = [];\n\n for (let i in data) {\n data[i]['NAME'] = i;\n data[i]['FOCUSED'] = controlPanelFocusedElement === i;\n logs.push(data[i]);\n }\n\n return logs;\n }\n\n const logs = () => {\n let logs = [...state.logs];\n\n logs.forEach(log => {\n log.FOCUSED = controlPanelFocusedElement === log.NAME;\n });\n\n return logs.map((item, index) => {\n return ;\n });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.LOG}`} \n \n
\n \n \n
\n props.changeSearchTerm(term)} />\n
\n
\n \n
\n {state.loading ? : logs()}\n
\n
{state.totalAmount}
\n
\n );\n}\n\nexport default Logs;","import React, { useEffect, useState } from 'react';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { addActiveElement, removeFocusedElement } from \"../../actions/MainNavigation/mainNavigationActions\";\nimport EditInternetProtocol from '../../components/InternetProtocol/Edit/EditInternetProtocol';\nimport AddInternetProtocol from '../../components/InternetProtocol/Add/AddInternetProtocol';\nimport EditServerNginx from 'src/components/Server/Edit/Nginx/EditServerNginx';\nimport Postgresql from 'src/components/Server/Edit/Postgresql/Postgresql';\nimport EditBackupExclusions from 'src/components/Backup/Exclusion/Edit';\nimport { Route, Switch, Redirect, useHistory } from \"react-router-dom\";\nimport InternetProtocols from '../InternetProtocols/InternetProtocols';\nimport AddWebDomain from '../../components/WebDomain/Add/AddWebDomain';\nimport EditDatabase from '../../components/Database/Edit/EditDatabase';\nimport EditFirewall from '../../components/Firewall/Edit/EditFirewall';\nimport Hotkeys from '../../components/ControlPanel/Hotkeys/Hotkeys';\nimport AddDatabase from '../../components/Database/Add/AddDatabase';\nimport AddFirewall from '../../components/Firewall/Add/AddFirewall';\nimport EditCronJob from '../../components/CronJob/Edit/EditCronJob';\nimport EditPackage from '../../components/Package/Edit/EditPackage';\nimport EditHttpd from 'src/components/Server/Edit/Httpd/EditHttpd';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport AddCronJob from '../../components/CronJob/Add/AddCronJob';\nimport AddPackage from '../../components/Package/Add/AddPackage';\nimport EditServer from '../../components/Server/Edit/EditServer';\nimport Dovecot from 'src/components/Server/Edit/Dovecot/Dovecot';\nimport EditMailWrapper from '../EditMailWrapper/EditMailWrapper';\nimport Service from 'src/components/Server/Edit/Service/Service';\nimport AddMailWrapper from '../AddMailWrapper/AddMailWrapper';\nimport EditDNSWrapper from '../EditDNSWrapper/EditDNSWrapper';\nimport EditWeb from '../../components/WebDomain/Edit/EditWeb';\nimport EditPhp from 'src/components/Server/Edit/PHP/EditPhp';\nimport Databases from '../../containers/Databases/Databases';\nimport Firewalls from '../../containers/Firewalls/Firewalls';\nimport EditUser from '../../components/User/Edit/EditUser';\nimport Bind9 from 'src/components/Server/Edit/Bind9/Bind9';\nimport Mysql from 'src/components/Server/Edit/Mysql/Mysql';\nimport AddDNSWrapper from '../AddDNSWrapper/AddDNSWrapper';\nimport BackupWrapper from '../BackupWrapper/BackupWrapper';\nimport AddBanIP from 'src/components/Firewall/Add/Banlist';\nimport CronJobs from '../../containers/CronJobs/CronJobs';\nimport Packages from '../../containers/Packages/Packages';\nimport { services } from 'src/ControlPanelService/Server';\nimport AddUser from '../../components/User/Add/AddUser';\nimport Updates from '../../containers/Updates/Updates';\nimport Servers from '../../containers/Servers/Servers';\nimport MainNav from '../../components/MainNav/MainNav';\nimport BackupExclusions from '../Backups/Exclusions';\nimport MailWrapper from '../MailWrapper/MailWrapper';\nimport Spinner from 'src/components/Spinner/Spinner';\nimport DNSWrapper from '../DNSWrapper/DNSWrapper';\nimport Statistics from '../Statistics/Statistics';\nimport Users from '../../containers/Users/Users';\nimport RRDs from '../../containers/RRDs/RRDs';\nimport BanList from '../Firewalls/Banlist';\nimport Web from '../../containers/Web/Web';\nimport GenerateCSR from '../GenerateCSR';\nimport Search from '../Search/Search';\nimport Logs from '../Logs/Logs';\n\nimport './ControlPanelContent.scss';\n\nconst ControlPanelContent = props => {\n const { userName } = useSelector(state => state.session);\n const history = useHistory();\n const [searchTerm, setSearchTerm] = useState('');\n const [hotkeysList, setHotkeysList] = useState(null);\n const [loading, setLoading] = useState(true);\n const dispatch = useDispatch();\n\n useEffect(() => {\n if (!userName) {\n return history.push('/login');\n } else {\n setLoading(false);\n }\n }, [userName]);\n\n useEffect(() => {\n dispatch(removeFocusedElement());\n window.addEventListener(\"keyup\", switchPanelTab);\n window.addEventListener(\"keyup\", addNewObject);\n\n return () => {\n window.removeEventListener(\"keyup\", switchPanelTab);\n window.removeEventListener(\"keyup\", addNewObject);\n }\n }, []);\n\n const switchPanelTab = event => {\n let isSearchInputFocused = document.querySelector('input:focus') || document.querySelector('textarea:focus');\n\n if (isSearchInputFocused) {\n return;\n }\n\n switch (event.keyCode) {\n case 49: return history.push('/list/user/');\n case 50: return history.push('/list/web/');\n case 51: return history.push('/list/dns/');\n case 52: return history.push('/list/mail/');\n case 53: return history.push('/list/db/');\n case 54: return history.push('/list/cron/');\n case 55: return history.push('/list/backup/');\n default: break;\n }\n }\n\n const addNewObject = event => {\n let isSearchInputFocused = document.querySelector('input:focus') || document.querySelector('textarea:focus');\n\n if (isSearchInputFocused) {\n return;\n }\n\n if (event.keyCode === 65) {\n switch (history.location.pathname) {\n case '/list/web/': return history.push('/add/web/');\n case '/list/dns/': return history.push('/add/dns/');\n case '/list/mail/': return history.push('/add/mail/');\n case '/list/db/': return history.push('/add/db/');\n case '/list/cron/': return history.push('/add/cron/');\n case '/list/backup/exclusions': return history.push('/edit/backup/exclusions/');\n case '/list/package/': return history.push('/add/package/');\n case '/list/ip/': return history.push('/add/ip/');\n case '/list/firewall/': return history.push('/add/firewall/');\n default: break;\n }\n }\n }\n\n const handleSearchTerm = searchTerm => {\n setSearchTerm(searchTerm);\n history.push({\n pathname: '/search/',\n search: `?q=${searchTerm}`\n });\n }\n\n const scrollToTop = () => {\n window.scrollTo({ top: 0, behavior: 'smooth' });\n }\n\n return (\n \n
\n
\n {\n loading\n ?
\n : (\n
\n \n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n \n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n\n {\n !!services.length && services.map((service, index) => {\n if (service === 'iptables') {\n return \n } else {\n return } />\n }\n })\n }\n\n } />\n } />\n \n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n } />\n \n } />\n \n )}\n
\n
\n
\n hotkeysList.classList.toggle('hide')}>\n \n \n
\n
\n scrollToTop()}>\n \n \n
\n
\n
setHotkeysList(inp)} toggleHotkeys={() => hotkeysList.classList.toggle('hide')} />\n \n );\n}\n\nexport default ControlPanelContent;\n","import React, { useState } from 'react';\nimport { addActiveElement } from 'src/actions/MainNavigation/mainNavigationActions';\nimport { logout } from 'src/actions/Session/sessionActions';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { Link, useHistory } from 'react-router-dom';\nimport Spinner from '../Spinner/Spinner';\n\nimport './TopPanel.scss';\n\nconst TopPanel = ({ menuItems = [], extraMenuItems = [] }) => {\n const mainNavigation = useSelector(state => state.mainNavigation);\n const [loading, setLoading] = useState(false);\n const { i18n, userName } = useSelector(state => state.session);\n const dispatch = useDispatch();\n const history = useHistory();\n\n const className = cls => {\n let className = 'nav-link';\n\n if (mainNavigation.activeElement === cls) {\n return className += ' active';\n }\n\n return className;\n }\n\n const renderMenuItems = () => {\n if (!menuItems.length) return;\n\n return menuItems.map(({ route, name }) => (\n \n handleState(event, route)}>{name} \n
\n ));\n }\n\n const renderExtraMenuItems = () => {\n if (!extraMenuItems.length) return;\n\n return extraMenuItems.map(({ link, text, type }, index) => (\n \n {\n type === 'download'\n ?
{text} \n :
{text}\n }\n
\n ));\n }\n\n const handleState = (event, route) => {\n event.preventDefault();\n history.push(route);\n dispatch(addActiveElement(route));\n }\n\n const signOut = () => {\n setLoading(true);\n\n dispatch(logout())\n .then(() => {\n history.push('/login/');\n setLoading(false);\n },\n error => {\n setLoading(false);\n console.error(error);\n });\n }\n\n return (\n \n {loading &&
}\n\n
\n
\n
\n
\n
\n
\n
\n \n
\n\n {renderMenuItems()}\n\n {renderExtraMenuItems()}\n
\n\n
\n
{userName}
\n
{i18n['Log out']}
\n
\n
\n
\n );\n}\n\nexport default TopPanel;\n","import axios from \"axios\";\n\nconst BASE_URL = window.location.origin;\n\nexport const getWebLogs = uri => {\n return axios.get(BASE_URL + '/api/v1' +uri);\n}","import React, { useEffect, useState } from 'react';\n\nimport { addActiveElement } from 'src/actions/MainNavigation/mainNavigationActions';\nimport TopPanel from 'src/components/TopPanel/TopPanel';\nimport { useHistory } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\nimport QueryString from 'qs';\n\nimport './WebLogs.scss';\nimport { getWebLogs } from 'src/ControlPanelService/WebLogs';\nimport Spinner from 'src/components/Spinner/Spinner';\nimport { Helmet } from 'react-helmet';\n\nexport default function WebLogs() {\n const { i18n, userName } = useSelector(state => state.session);\n const history = useHistory();\n const dispatch = useDispatch();\n const mainNavigation = useSelector(state => state.mainNavigation);\n const [domain, setDomain] = useState();\n const [state, setState] = useState({\n data: \"\",\n loading: false\n });\n\n useEffect(() => {\n if (!userName) {\n history.push('/login/');\n }\n }, []);\n\n useEffect(() => {\n let parsedQueryString = QueryString.parse(history.location.search, { ignoreQueryPrefix: true });\n const { domain, type } = parsedQueryString;\n\n if (!parsedQueryString && !domain && !type) {\n return history.goBack();\n }\n\n setDomain(domain);\n let uri = `/list/web-log/?domain=${domain}&type=${type}`;\n fetchData(uri);\n\n dispatch(addActiveElement(`/list/web-log/${type}`));\n }, [mainNavigation.activeElement]);\n\n const fetchData = uri => {\n setState({\n ...state,\n loading: true\n });\n\n getWebLogs(uri)\n .then(result => {\n if (result.data) {\n setState({ ...state, data: result.data.data, loading: false });\n }\n })\n .catch(error => {\n console.error(error);\n setState({ ...state, loading: false });\n });\n }\n\n const menuItems = [\n {\n route: `/list/web-log/?domain=${domain}&type=access`,\n name: i18n['AccessLog']\n },\n {\n route: `/list/web-log/?domain=${domain}&type=error`,\n name: i18n['ErrorLog']\n }\n ];\n\n const extraMenuItems = [\n {\n link: `/download/web-log/?domain=${domain ?? ''}&type=access`,\n type: 'download',\n text: i18n['Download AccessLog']\n },\n {\n link: `/download/web-log/?domain=${domain ?? ''}&type=error`,\n type: 'download',\n text: i18n['Download ErrorLog'],\n }\n ];\n\n return (\n \n
\n {`Vesta - ${i18n.WEB}`} \n \n
\n
\n {\n state.loading\n ?
\n : (\n
\n {state.data}\n \n )\n }\n
\n
\n );\n}\n","import React from 'react';\n\nimport '../AddItemLayout/AddItemLayout.scss';\nimport './LoginLayout.scss';\n\nconst LoginLayout = ({ children }) => {\n return (\n \n {children}\n
\n );\n}\n\nexport default LoginLayout;","import React, { useEffect, useState } from 'react';\n\nimport { Link, useHistory } from 'react-router-dom';\nimport Spinner from '../Spinner/Spinner';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { login } from '../../actions/Session/sessionActions';\nimport LoginLayout from '../ControlPanel/LoginLayout/LoginLayout';\nimport TextInput from '../ControlPanel/AddItemLayout/Form/TextInput/TextInput';\n\nimport './Login.scss';\nimport { Helmet } from 'react-helmet';\n\nexport default function LoginForm() {\n const { i18n } = useSelector(state => state.session);\n const dispatch = useDispatch();\n const history = useHistory();\n const [loading, setLoading] = useState(false);\n const [formValues, setFormValues] = useState({\n user: '',\n password: ''\n });\n const session = useSelector(state => state.session);\n const [errorMessage, setErrorMessage] = useState('');\n\n useEffect(() => {\n if (session.error) {\n setErrorMessage(session.error);\n return;\n }\n\n if (session.token && session.userName) {\n history.push('/list/user/');\n }\n }, [session]);\n\n const submitHandler = event => {\n event.preventDefault();\n const { user, password } = formValues;\n\n setLoading(true);\n\n dispatch(login(user, password))\n .then((res) => {\n setLoading(false);\n });\n }\n\n const changeInputHandler = event => {\n const { value, name } = event.target;\n\n setFormValues({\n ...formValues,\n [name]: value\n });\n }\n\n return (\n \n
\n {`Vesta - ${i18n.LOGIN ?? 'LOGIN'}`} \n \n {loading &&
}\n
\n
\n \n \n
\n
\n \n
\n \n
\n\n
\n {i18n['forgot password'] ?? 'forgot password'}\n \n )}\n name=\"password\"\n type=\"password\"\n id=\"password\" />\n\n \n {i18n['Log in'] ?? 'Log in'}\n \n\n {errorMessage}
\n \n \n\n \n vestacp.com \n \n \n
\n
\n );\n}\n","import React, { useEffect, useState } from 'react';\n\nimport { addActiveElement } from 'src/actions/MainNavigation/mainNavigationActions';\nimport TopPanel from 'src/components/TopPanel/TopPanel';\nimport { useParams, useHistory } from 'react-router-dom';\nimport { useDispatch, useSelector } from 'react-redux';\n\nimport { getServiceLogs } from 'src/ControlPanelService/Server';\nimport Spinner from 'src/components/Spinner/Spinner';\nimport { Helmet } from 'react-helmet';\nimport ReactHtmlParser from 'react-html-parser';\n\nimport './styles.scss';\n\nconst ServiceInfo = () => {\n const { i18n, userName } = useSelector(state => state.session);\n const dispatch = useDispatch();\n const { activeElement } = useSelector(state => state.mainNavigation);\n const history = useHistory();\n const { service } = useParams();\n const [state, setState] = useState({\n data: \"\",\n loading: false\n });\n\n useEffect(() => {\n if (!userName) {\n history.push('/login/');\n }\n }, [userName]);\n\n useEffect(() => {\n fetchData();\n dispatch(addActiveElement(`/list/server/${service}`));\n }, [activeElement]);\n\n const fetchData = () => {\n setState({ ...state, loading: true });\n\n getServiceLogs(service)\n .then(result => {\n setState({ ...state, data: result.data.service_log, loading: false });\n })\n .catch(error => {\n console.error(error);\n setState({ ...state, loading: false });\n });\n }\n\n const menuItems = [\n {\n route: '/list/server/cpu',\n name: i18n['CPU']\n },\n {\n route: '/list/server/mem',\n name: i18n['MEMORY']\n },\n {\n route: '/list/server/disk',\n name: i18n['DISK']\n },\n {\n route: '/list/server/net',\n name: i18n['NETWORK']\n },\n {\n route: '/list/server/web',\n name: i18n['WEB']\n },\n {\n route: '/list/server/dns',\n name: i18n['DNS']\n },\n {\n route: '/list/server/mail',\n name: i18n['MAIL']\n },\n {\n route: '/list/server/db',\n name: i18n['DB']\n }\n ];\n\n return (\n \n
\n {`Vesta - ${i18n.SERVER}`} \n \n
\n
\n {\n state.loading\n ?
\n : (
\n {state.data.length && state.data.map(line => (<>{ReactHtmlParser(line)} >))}\n )\n }\n
\n
\n );\n}\n\nexport default ServiceInfo;\n","import React, { useEffect, useState } from 'react';\n\nimport TextInput from 'src/components/ControlPanel/AddItemLayout/Form/TextInput/TextInput';\nimport Password from 'src/components/ControlPanel/AddItemLayout/Form/Password/Password';\nimport LoginLayout from 'src/components/ControlPanel/LoginLayout/LoginLayout';\nimport { resetPassword } from 'src/ControlPanelService/ResetPassword';\nimport { Link, useHistory, useLocation } from 'react-router-dom';\nimport { reset } from 'src/actions/Session/sessionActions';\nimport { useDispatch, useSelector } from 'react-redux';\nimport Spinner from 'src/components/Spinner/Spinner';\nimport ReactHtmlParser from 'react-html-parser';\nimport { Helmet } from 'react-helmet';\nimport QueryString from 'qs';\n\nexport default function ForgotPassword() {\n const { i18n } = useSelector(state => state.session);\n const dispatch = useDispatch();\n const history = useHistory();\n const [loading, setLoading] = useState(false);\n const [state, setState] = useState({\n action: '',\n user: '',\n code: '',\n });\n const session = useSelector(state => state.session);\n const location = useLocation();\n const [errorMessage, setErrorMessage] = useState('');\n\n useEffect(() => {\n const parsedQueryString = QueryString.parse(location.search, { ignoreQueryPrefix: true });\n\n setState({\n ...state,\n action: parsedQueryString.action || '',\n user: parsedQueryString.user || '',\n code: parsedQueryString.code || ''\n });\n }, []);\n\n useEffect(() => {\n if (session.error) {\n setErrorMessage(session.error);\n return;\n }\n\n if (session.token && session.userName) {\n history.push('/list/user/');\n }\n }, [session]);\n\n const submitHandler = event => {\n event.preventDefault();\n\n if (!state.code && !state.user) return;\n\n if (!state.action && state.user) {\n completeStep1();\n return;\n }\n\n if (state.action === 'code' && state.user && state.code) {\n completeStep2();\n return;\n }\n\n setLoading(true);\n const data = { user: state.user, code: state.code };\n\n for (var [name, value] of (new FormData(event.target)).entries()) {\n data[name] = value;\n }\n\n dispatch(reset(data))\n .then(res => {\n if (res.error) {\n setErrorMessage(res.error);\n } else {\n history.push('/login');\n setErrorMessage('');\n }\n\n setLoading(false);\n });\n }\n\n const changeInputHandler = event => {\n const { value, name } = event.target;\n\n setState({ ...state, [name]: value });\n }\n\n const completeStep1 = () => {\n if (!state.user) return;\n setLoading(true);\n\n resetPassword(state.user)\n .then(res => {\n setErrorMessage(res.data.error || '');\n setState({ ...state, action: 'code' });\n setLoading(false);\n })\n .catch(error => {\n console.error(error);\n setLoading(false);\n });\n }\n\n const completeStep2 = () => {\n setState({ ...state, action: 'confirm' });\n }\n\n return (\n \n
\n {`Vesta - ${i18n['RESET PASSWORD']}`} \n \n {loading &&
}\n
\n
\n \n \n
\n
\n \n
\n \n {\n !state.action && (\n <>\n
\n\n
\n {i18n.Submit} \n history.push('/login')}>{i18n.Back} \n
\n >\n )\n }\n\n {\n state.action === 'code' && (\n <>\n
{ReactHtmlParser(i18n['RESET_CODE_SENT'])} \n\n
\n\n
\n {i18n.Confirm} \n setState({ ...state, action: '', code: '', user: '' })}>{i18n.Back} \n
\n >\n )\n }\n\n {\n state.action === 'confirm' && (\n <>\n
\n\n
\n\n
\n {i18n.Reset} \n setState({ ...state, action: 'code', code: '', user: state.user })}>{i18n.Back} \n
\n >\n )\n }\n\n
{errorMessage}
\n
\n \n\n \n vestacp.com \n \n \n
\n
\n );\n}\n","import React, { useEffect, useState } from 'react';\nimport FileManager from '../FileManager/FileManager';\nimport { Route, Switch, useHistory, Redirect } from \"react-router\";\nimport Preview from '../../components/Preview/Preview';\nimport { library } from '@fortawesome/fontawesome-svg-core';\nimport * as Icon from '@fortawesome/free-solid-svg-icons';\nimport 'bootstrap/dist/css/bootstrap.css';\nimport 'bootstrap/dist/js/bootstrap.min';\nimport './App.scss';\nimport ControlPanelContent from '../ControlPanelContent/ControlPanelContent';\nimport WebLogs from '../WebLogs/WebLogs';\nimport LoginForm from 'src/components/Login/LoginForm';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { checkAuthHandler } from 'src/actions/Session/sessionActions';\nimport ServiceInfo from 'src/containers/ServiceInfo';\nimport ForgotPassword from 'src/components/ForgotPassword';\nimport Spinner from 'src/components/Spinner/Spinner';\n\nlibrary.add(\n Icon.faBook,\n Icon.faDownload,\n Icon.faFile,\n Icon.faFileAlt,\n Icon.faFolderOpen,\n Icon.faImage,\n Icon.faEllipsisH,\n Icon.faFolder,\n Icon.faItalic,\n Icon.faUser,\n Icon.faCopy,\n Icon.faPaste,\n Icon.faTrash,\n Icon.faBoxOpen,\n Icon.faArrowDown,\n Icon.faArrowUp,\n Icon.faBell,\n Icon.faPlus,\n Icon.faAngleRight,\n Icon.faStar,\n Icon.faUserLock,\n Icon.faPen,\n Icon.faLock,\n Icon.faTimes,\n Icon.faSearch,\n Icon.faCog,\n Icon.faList,\n Icon.faWrench,\n Icon.faFileDownload,\n Icon.faPause,\n Icon.faPlay,\n Icon.faCogs,\n Icon.faStop,\n Icon.faUnlock,\n Icon.faLongArrowAltUp,\n Icon.faEye,\n Icon.faEyeSlash,\n Icon.faLongArrowAltRight,\n Icon.faCaretDown,\n Icon.faCaretUp,\n Icon.faInfinity,\n Icon.faPlay\n);\n\nconst App = () => {\n const history = useHistory();\n const dispatch = useDispatch();\n const session = useSelector(state => state.session);\n const [loading, setLoading] = useState(true);\n\n useEffect(() => {\n if (!Object.entries(session.i18n).length) {\n dispatch(checkAuthHandler())\n .then(token => {\n setLoading(false);\n }, (error) => {\n console.error(error);\n return history.push('/login');\n });\n }\n }, [dispatch, history, session]);\n\n const AuthenticatedRoute = ({ authenticated, ...rest }) => {\n return (\n \n authenticated\n ? \n : } />\n );\n }\n\n return (\n \n {\n loading\n ?
\n : (\n
\n \n \n \n \n \n \n \n \n )\n }\n
\n );\n}\n\nexport default App;\n","// This optional code is used to register a service worker.\n// register() is not called by default.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on subsequent visits to a page, after all the\n// existing tabs open on the page have been closed, since previously cached\n// resources are updated in the background.\n\n// To learn more about the benefits of this model and instructions on how to\n// opt-in, read http://bit.ly/CRA-PWA\n\nconst isLocalhost = Boolean(\n window.location.hostname === 'localhost' ||\n // [::1] is the IPv6 localhost address.\n window.location.hostname === '[::1]' ||\n // 127.0.0.1/8 is considered localhost for IPv4.\n window.location.hostname.match(\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\n )\n);\n\nexport function register(config) {\n if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\n // The URL constructor is available in all browsers that support SW.\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);\n if (publicUrl.origin !== window.location.origin) {\n // Our service worker won't work if PUBLIC_URL is on a different origin\n // from what our page is served on. This might happen if a CDN is used to\n // serve assets; see https://github.com/facebook/create-react-app/issues/2374\n return;\n }\n\n window.addEventListener('load', () => {\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\n\n if (isLocalhost) {\n // This is running on localhost. Let's check if a service worker still exists or not.\n checkValidServiceWorker(swUrl, config);\n\n // Add some additional logging to localhost, pointing developers to the\n // service worker/PWA documentation.\n navigator.serviceWorker.ready.then(() => {\n console.log(\n 'This web app is being served cache-first by a service ' +\n 'worker. To learn more, visit http://bit.ly/CRA-PWA'\n );\n });\n } else {\n // Is not localhost. Just register service worker\n registerValidSW(swUrl, config);\n }\n });\n }\n}\n\nfunction registerValidSW(swUrl, config) {\n navigator.serviceWorker\n .register(swUrl)\n .then(registration => {\n registration.onupdatefound = () => {\n const installingWorker = registration.installing;\n if (installingWorker == null) {\n return;\n }\n installingWorker.onstatechange = () => {\n if (installingWorker.state === 'installed') {\n if (navigator.serviceWorker.controller) {\n // At this point, the updated precached content has been fetched,\n // but the previous service worker will still serve the older\n // content until all client tabs are closed.\n console.log(\n 'New content is available and will be used when all ' +\n 'tabs for this page are closed. See http://bit.ly/CRA-PWA.'\n );\n\n // Execute callback\n if (config && config.onUpdate) {\n config.onUpdate(registration);\n }\n } else {\n // At this point, everything has been precached.\n // It's the perfect time to display a\n // \"Content is cached for offline use.\" message.\n console.log('Content is cached for offline use.');\n\n // Execute callback\n if (config && config.onSuccess) {\n config.onSuccess(registration);\n }\n }\n }\n };\n };\n })\n .catch(error => {\n console.error('Error during service worker registration:', error);\n });\n}\n\nfunction checkValidServiceWorker(swUrl, config) {\n // Check if the service worker can be found. If it can't reload the page.\n fetch(swUrl)\n .then(response => {\n // Ensure service worker exists, and that we really are getting a JS file.\n const contentType = response.headers.get('content-type');\n if (\n response.status === 404 ||\n (contentType != null && contentType.indexOf('javascript') === -1)\n ) {\n // No service worker found. Probably a different app. Reload the page.\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister().then(() => {\n window.location.reload();\n });\n });\n } else {\n // Service worker found. Proceed as normal.\n registerValidSW(swUrl, config);\n }\n })\n .catch(() => {\n console.log(\n 'No internet connection found. App is running in offline mode.'\n );\n });\n}\n\nexport function unregister() {\n if ('serviceWorker' in navigator) {\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister();\n });\n }\n}\n","import React from 'react';\nimport ReactDOM from 'react-dom';\nimport { Provider } from 'react-redux'\nimport configureStore from './store';\nimport './index.css';\nimport App from './containers/App/App';\nimport * as serviceWorker from './containers/App/serviceWorker';\nimport { BrowserRouter as Router } from 'react-router-dom';\n\nReactDOM.render(\n \n \n \n \n ,\n document.getElementById('root')\n);\n\n// If you want your app to work offline and load faster, you can change\n// unregister() to register() below. Note this comes with some pitfalls.\n// Learn more about service workers: http://bit.ly/CRA-PWA\nserviceWorker.unregister();\n","import { composeWithDevTools } from 'redux-devtools-extension';\nimport { createStore, applyMiddleware } from 'redux';\nimport rootReducer from './reducers/rootReducer';\nimport thunk from 'redux-thunk';\n\nexport default function configureStore() {\n return createStore(\n rootReducer,\n composeWithDevTools(applyMiddleware(thunk))\n );\n}"],"sourceRoot":""}
\ No newline at end of file