From 050a4bf58bd1c7bdbe45c64fde0ae72dba30d1b5 Mon Sep 17 00:00:00 2001 From: Ben Armstrong Date: Mon, 11 Apr 2022 15:15:29 +0100 Subject: [PATCH] fix: linting repo --- .eslintrc.js | 3 +- .prettierrc | 10 +- src/App.js | 203 +++--------- src/OopCore.js | 125 ++------ src/Utilities.js | 36 +-- src/components/Global/DatetimeFilter.js | 64 ++-- src/components/Global/DeviceAssociator.js | 25 +- src/components/Global/HttpTemprTemplate.js | 38 ++- src/components/Global/NavigationGroup.js | 11 +- src/components/Global/NavigationItem.js | 27 +- src/components/Global/PairInput.js | 62 ++-- src/components/Global/ScheduleAssociator.js | 24 +- src/components/Global/SiteSelector.js | 48 +-- src/components/Global/TemplateInput.js | 90 +++--- src/components/Global/TemprAssociator.js | 40 +-- src/components/Global/TemprForm.js | 45 +-- src/components/Global/TemprModal.js | 22 +- src/components/Global/TemprOutputTest.js | 27 +- src/components/Global/TemprPreview.js | 8 +- src/components/Global/TrueFalseCheckboxes.js | 14 +- .../Universal/AccordionWithCaption.js | 8 +- src/components/Universal/ConfirmModal.js | 12 +- src/components/Universal/DataCircle.js | 4 +- src/components/Universal/DataProvider.js | 6 +- src/components/Universal/DatetimeTooltip.js | 58 ++-- src/components/Universal/ExpandModal.js | 50 +-- src/components/Universal/MaxCard.js | 16 +- src/components/Universal/Modal.js | 6 +- src/components/Universal/Page.js | 33 +- src/components/Universal/PaginatedTable.js | 17 +- src/components/Universal/Pagination.js | 153 +++++---- src/components/Universal/PaginationMobile.js | 35 +- src/components/Universal/PopoverWithButton.js | 2 +- src/components/Universal/Spinner.js | 6 +- src/components/Universal/Table.js | 99 +++--- src/components/Universal/TransmissionTree.js | 90 +++--- src/components/View/Account.js | 44 +-- src/components/View/AuditLog.js | 224 +++++++------ src/components/View/AuditLogs.js | 52 +-- src/components/View/BlacklistEntries.js | 46 +-- src/components/View/BlacklistEntry.js | 52 ++- src/components/View/Dashboard.js | 302 ++++++++---------- src/components/View/Device.js | 228 ++++--------- src/components/View/DeviceDashboard.js | 201 ++++-------- src/components/View/DeviceGroup.js | 44 +-- src/components/View/DeviceGroups.js | 15 +- src/components/View/Devices.js | 50 +-- src/components/View/ForgotPassword.js | 7 +- src/components/View/GlobalHistory.js | 10 +- src/components/View/Header.js | 8 +- src/components/View/Layer.js | 113 +++---- src/components/View/Layers.js | 18 +- src/components/View/Login.js | 4 +- src/components/View/Message.js | 74 ++--- src/components/View/Messages.js | 38 +-- src/components/View/MobileHeader.js | 2 +- src/components/View/MobileNavigation.js | 5 +- src/components/View/PageNotFound.js | 34 +- src/components/View/Profile.js | 22 +- src/components/View/ResetPassword.js | 4 +- src/components/View/Schedule.js | 158 +++------ src/components/View/ScheduleDashboard.js | 184 ++++------- src/components/View/Schedules.js | 20 +- src/components/View/SideNavigation.js | 31 +- src/components/View/Site.js | 149 ++------- src/components/View/Sites.js | 21 +- src/components/View/Tempr.js | 221 ++++++------- src/components/View/TemprMap.js | 117 ++++--- src/components/View/Temprs.js | 52 ++- src/components/View/Transmission.js | 243 +++++++------- src/components/View/Transmissions.js | 31 +- src/components/View/User.js | 129 ++------ src/components/View/UserDashboard.js | 152 +++++---- src/components/View/Users.js | 41 ++- src/theme.js | 8 +- 75 files changed, 1820 insertions(+), 2851 deletions(-) diff --git a/.eslintrc.js b/.eslintrc.js index 03a1fcf39..a043e8246 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -15,8 +15,7 @@ module.exports = { }, plugins: ["prettier", "jest"], rules: { - indent: [1, 4], - curly: ["error", "all"], + "curly": ["error", "all"], "comma-dangle": ["error", "always-multiline"], "prettier/prettier": "error", "linebreak-style": ["error", "unix"] diff --git a/.prettierrc b/.prettierrc index 6c0a01d83..0deb71254 100644 --- a/.prettierrc +++ b/.prettierrc @@ -1,5 +1,11 @@ { + "semi": true, + "bracketSpacing": true, + "jsxBracketSameLine": false, + "singleQuote": false, + "trailingComma": 'all', + "arrowParens": 'avoid', "tabWidth": 4, "useTabs": false, - "trailingComma":"all" -} + "printWidth": 100, +} \ No newline at end of file diff --git a/src/App.js b/src/App.js index f74b6beff..d703318b2 100644 --- a/src/App.js +++ b/src/App.js @@ -6,13 +6,7 @@ import { Client as Styletron } from "styletron-engine-atomic"; import { Provider as StyletronProvider } from "styletron-react"; import oopTheme from "./theme"; -import { - BrowserRouter, - Route, - Redirect, - withRouter, - Switch, -} from "react-router-dom"; +import { BrowserRouter, Route, Redirect, withRouter, Switch } from "react-router-dom"; import { createBrowserHistory } from "history"; @@ -20,12 +14,7 @@ import { GifSpinner } from "./components/Universal"; import OopCore from "./OopCore"; import "./styles/App.scss"; import { QueryParamProvider } from "use-query-params"; -import { - MobileNavigation, - MobileHeader, - SideNavigation, - Header, -} from "./components/View"; +import { MobileNavigation, MobileHeader, SideNavigation, Header } from "./components/View"; const engine = new Styletron(); const queryString = require("query-string"); @@ -33,9 +22,7 @@ const queryString = require("query-string"); const Account = lazy(() => import("./components/View/Account")); const AuditLog = lazy(() => import("./components/View/AuditLog")); const AuditLogs = lazy(() => import("./components/View/AuditLogs")); -const BlacklistEntries = lazy(() => - import("./components/View/BlacklistEntries"), -); +const BlacklistEntries = lazy(() => import("./components/View/BlacklistEntries")); const BlacklistEntry = lazy(() => import("./components/View/BlacklistEntry")); const Dashboard = lazy(() => import("./components/View/Dashboard")); const Device = lazy(() => import("./components/View/Device")); @@ -53,9 +40,7 @@ const Messages = lazy(() => import("./components/View/Messages")); const PageNotFound = lazy(() => import("./components/View/PageNotFound")); const ResetPassword = lazy(() => import("./components/View/ResetPassword")); const Schedule = lazy(() => import("./components/View/Schedule")); -const ScheduleDashboard = lazy(() => - import("./components/View/ScheduleDashboard"), -); +const ScheduleDashboard = lazy(() => import("./components/View/ScheduleDashboard")); const Schedules = lazy(() => import("./components/View/Schedules")); const Site = lazy(() => import("./components/View/Site")); const Sites = lazy(() => import("./components/View/Sites")); @@ -199,31 +184,17 @@ class App extends Component { - this.getComponent(hasUser, Login, props) - } + render={props => this.getComponent(hasUser, Login, props)} /> - this.getComponent( - hasUser, - ForgotPassword, - props, - ) - } + render={props => this.getComponent(hasUser, ForgotPassword, props)} /> - this.getComponent( - hasUser, - ResetPassword, - props, - ) - } + render={props => this.getComponent(hasUser, ResetPassword, props)} /> - this.getComponent(!hasUser, Device, props) - } + render={props => this.getComponent(!hasUser, Device, props)} /> - this.getComponent( - !hasUser, - Transmissions, - props, - ) - } + render={props => this.getComponent(!hasUser, Transmissions, props)} /> - this.getComponent( - !hasUser, - Transmission, - props, - ) - } + render={props => this.getComponent(!hasUser, Transmission, props)} /> - this.getComponent( - !hasUser, - DeviceGroups, - props, - ) - } + render={props => this.getComponent(!hasUser, DeviceGroups, props)} /> - this.getComponent( - !hasUser, - DeviceGroup, - props, - ) - } + render={props => this.getComponent(!hasUser, DeviceGroup, props)} /> - this.getComponent(!hasUser, Temprs, props) - } + render={props => this.getComponent(!hasUser, Temprs, props)} /> - this.getComponent(!hasUser, TemprMap, props) - } + render={props => this.getComponent(!hasUser, TemprMap, props)} /> - this.getComponent( - !hasUser, - Schedules, - props, - ) - } + render={props => this.getComponent(!hasUser, Schedules, props)} /> - this.getComponent(!hasUser, Schedule, props) - } + render={props => this.getComponent(!hasUser, Schedule, props)} /> - this.getComponent(!hasUser, Layers, props) - } + render={props => this.getComponent(!hasUser, Layers, props)} /> - this.getComponent(!hasUser, Layer, props) - } + render={props => this.getComponent(!hasUser, Layer, props)} /> - this.getComponent( - !hasUser, - BlacklistEntries, - props, - ) + this.getComponent(!hasUser, BlacklistEntries, props) } /> - this.getComponent( - !hasUser, - BlacklistEntry, - props, - ) - } + render={props => this.getComponent(!hasUser, BlacklistEntry, props)} /> - this.getComponent(!hasUser, Tempr, props) - } + render={props => this.getComponent(!hasUser, Tempr, props)} /> - this.getComponent(!hasUser, Users, props) - } + render={props => this.getComponent(!hasUser, Users, props)} /> - this.getComponent(!hasUser, User, props) - } + render={props => this.getComponent(!hasUser, User, props)} /> this.getComponent( !hasUser, - props.match.params.userId === "new" - ? User - : UserDashboard, + props.match.params.userId === "new" ? User : UserDashboard, props, ) } @@ -434,88 +345,54 @@ class App extends Component { render={props => { const user = this.state.user; - return this.getComponent( - !hasUser, - UserDashboard, - { - ...props, - user, - }, - ); + return this.getComponent(!hasUser, UserDashboard, { + ...props, + user, + }); }} /> - this.getComponent(!hasUser, Sites, props) - } + render={props => this.getComponent(!hasUser, Sites, props)} /> - this.getComponent(!hasUser, Site, props) - } + render={props => this.getComponent(!hasUser, Site, props)} /> - this.getComponent(!hasUser, Account, props) - } + render={props => this.getComponent(!hasUser, Account, props)} /> - this.getComponent(!hasUser, Messages, props) - } + render={props => this.getComponent(!hasUser, Messages, props)} /> - this.getComponent(!hasUser, Message, props) - } + render={props => this.getComponent(!hasUser, Message, props)} /> - this.getComponent( - !hasUser, - GlobalHistory, - props, - ) - } + render={props => this.getComponent(!hasUser, GlobalHistory, props)} /> - this.getComponent( - !hasUser, - AuditLogs, - props, - ) - } + render={props => this.getComponent(!hasUser, AuditLogs, props)} /> - this.getComponent(!hasUser, AuditLog, props) - } + render={props => this.getComponent(!hasUser, AuditLog, props)} /> - this.getComponent( - !hasUser, - PageNotFound, - props, - ) - } + render={props => this.getComponent(!hasUser, PageNotFound, props)} /> @@ -528,11 +405,7 @@ class App extends Component { return ( - {this.state.isLoading ? ( - - ) : ( - this.renderRoutes() - )} + {this.state.isLoading ? : this.renderRoutes()} ); diff --git a/src/OopCore.js b/src/OopCore.js index b53ff4cdb..990d12c5d 100644 --- a/src/OopCore.js +++ b/src/OopCore.js @@ -123,12 +123,12 @@ class OopCore extends EventEmitter { } if (typeof value === "object" && value !== null) { - if ('gt' in value && value['gt'] === true) { + if ("gt" in value && value["gt"] === true) { const newBase = `${base}[gt]`; - buildParam(newBase, value['val']); - } else if ('gt' in value && value['gt'] === false) { + buildParam(newBase, value["val"]); + } else if ("gt" in value && value["gt"] === false) { const newBase = `${base}[lt]`; - buildParam(newBase, value['val']); + buildParam(newBase, value["val"]); } else { // eslint-disable-next-line for (const [k, v] of Object.entries(value)) { @@ -147,12 +147,7 @@ class OopCore extends EventEmitter { return queryString.stringify(built); } - makeRequest( - endpoint, - requestType = RequestType.GET, - data = false, - requireToken = true, - ) { + makeRequest(endpoint, requestType = RequestType.GET, data = false, requireToken = true) { const token = this.token; if (!token && requireToken) { return Promise.reject(new Error("No token set.")); @@ -163,10 +158,7 @@ class OopCore extends EventEmitter { method: requestType, }; - if ( - requestType === RequestType.POST || - requestType === RequestType.PUT - ) { + if (requestType === RequestType.POST || requestType === RequestType.PUT) { options.headers["Content-Type"] = "application/json"; options.body = JSON.stringify(this.camelToSnake(data)); } @@ -201,16 +193,13 @@ class OopCore extends EventEmitter { } login(email, password) { - return this.makeRequest( - "/auth/login", - RequestType.POST, - { email, password }, - false, - ).then(response => { - this.token = response.token; - this.saveCookie("token", response.token); - return this.getLoggedInUser(); - }); + return this.makeRequest("/auth/login", RequestType.POST, { email, password }, false).then( + response => { + this.token = response.token; + this.saveCookie("token", response.token); + return this.getLoggedInUser(); + }, + ); } requestPasswordReset(user) { @@ -290,11 +279,7 @@ class OopCore extends EventEmitter { updateDevice(data) { const payload = { device: data }; - return this.makeRequest( - `/devices/${data.id}`, - RequestType.PUT, - payload, - ); + return this.makeRequest(`/devices/${data.id}`, RequestType.PUT, payload); } createDevice(device) { @@ -309,11 +294,7 @@ class OopCore extends EventEmitter { updateDeviceGroup(deviceGroup) { const payload = { device_group: deviceGroup }; - return this.makeRequest( - `/device_groups/${deviceGroup.id}`, - RequestType.PUT, - payload, - ); + return this.makeRequest(`/device_groups/${deviceGroup.id}`, RequestType.PUT, payload); } createDeviceGroup(deviceGroup) { @@ -322,10 +303,7 @@ class OopCore extends EventEmitter { } deleteDeviceGroup(deviceGroupId) { - return this.makeRequest( - `/device_groups/${deviceGroupId}`, - RequestType.DELETE, - ); + return this.makeRequest(`/device_groups/${deviceGroupId}`, RequestType.DELETE); } getDeviceGroup(deviceGroupId) { @@ -344,9 +322,7 @@ class OopCore extends EventEmitter { } getTransmission(transmissionId) { - return this.makeRequest( - `/transmissions/${transmissionId}`, - ); + return this.makeRequest(`/transmissions/${transmissionId}`); } getSites(queryParameters) { @@ -436,9 +412,7 @@ class OopCore extends EventEmitter { } createDeviceTempr(queryParameters) { - const parameters = queryString.stringify( - this.camelToSnake(queryParameters), - ); + const parameters = queryString.stringify(this.camelToSnake(queryParameters)); let path = `/device_temprs`; if (parameters) { path += `?${parameters}`; @@ -448,9 +422,7 @@ class OopCore extends EventEmitter { } deleteDeviceTempr(deviceTemprId, queryParameters) { - const parameters = queryString.stringify( - this.camelToSnake(queryParameters), - ); + const parameters = queryString.stringify(this.camelToSnake(queryParameters)); let path = `/device_temprs/${deviceTemprId}`; if (parameters) { path += `?${parameters}`; @@ -492,9 +464,7 @@ class OopCore extends EventEmitter { } getDevicesByGroup(queryParameters) { - const parameters = queryString.stringify( - this.camelToSnake(queryParameters), - ); + const parameters = queryString.stringify(this.camelToSnake(queryParameters)); let path = `/sites/sidebar`; if (parameters) { path += `?${parameters}`; @@ -503,22 +473,6 @@ class OopCore extends EventEmitter { return this.makeRequest(path); } - mapStatsParams(key) { - switch (key) { - case "gteq": - case "gt": - return `filter[transmitted_at[${key}]]`; - case "siteId": - case "deviceId": - return `filter[${key}]`; - case "field": - case "direction": - return `filter[sort][${key}]`; - default: - return key; - } - } - getTransmissionStats(queryParameters) { const parameters = this.getParameters(queryParameters); @@ -561,18 +515,11 @@ class OopCore extends EventEmitter { } updateSchedule(schedule) { - return this.makeRequest( - uri`/schedules/${schedule.id}`, - RequestType.PUT, - { schedule }, - ); + return this.makeRequest(uri`/schedules/${schedule.id}`, RequestType.PUT, { schedule }); } deleteSchedule(scheduleId) { - return this.makeRequest( - uri`/schedules/${scheduleId}`, - RequestType.DELETE, - ); + return this.makeRequest(uri`/schedules/${scheduleId}`, RequestType.DELETE); } getScheduleTemprs(params) { @@ -619,18 +566,11 @@ class OopCore extends EventEmitter { } updateBlacklistEntry(id, blacklistEntry) { - return this.makeRequest( - uri`/blacklist_entries/${id}`, - RequestType.PUT, - { blacklistEntry }, - ); + return this.makeRequest(uri`/blacklist_entries/${id}`, RequestType.PUT, { blacklistEntry }); } deleteBlacklistEntry(id) { - return this.makeRequest( - uri`/blacklist_entries/${id}`, - RequestType.DELETE, - ); + return this.makeRequest(uri`/blacklist_entries/${id}`, RequestType.DELETE); } getLayers(queryParameters) { @@ -653,18 +593,13 @@ class OopCore extends EventEmitter { } updateLayer(layer) { - return this.makeRequest( - uri`/layers/${layer.id}`, - RequestType.PUT, - { layer }, - ); + return this.makeRequest(uri`/layers/${layer.id}`, RequestType.PUT, { + layer, + }); } deleteLayer(layerId) { - return this.makeRequest( - uri`/layers/${layerId}`, - RequestType.DELETE, - ); + return this.makeRequest(uri`/layers/${layerId}`, RequestType.DELETE); } getTemprLayers(params) { @@ -730,13 +665,13 @@ class OopCore extends EventEmitter { getAuditLogs(compType, compId, queryParameters) { const parameters = this.getParameters(queryParameters); - let path = `/${compType}/${compId}/audit_logs` + let path = `/${compType}/${compId}/audit_logs`; if (parameters) { path += `?${parameters}`; } - return this.makeRequest(path) + return this.makeRequest(path); } getAuditLog(auditLogId) { diff --git a/src/Utilities.js b/src/Utilities.js index b175e680c..f3af3c41e 100644 --- a/src/Utilities.js +++ b/src/Utilities.js @@ -13,7 +13,7 @@ export function compareByValue(a, b) { return false; } - const compareSet = key => compareByValue(a[key], b[key]) + const compareSet = key => compareByValue(a[key], b[key]); if (a instanceof Array) { if (a.length !== b.length) { return false; @@ -33,7 +33,7 @@ export function compareByValue(a, b) { } return false; -}; +} export function identicalObject(oldObject, updatedObject) { if (oldObject === updatedObject) { @@ -48,9 +48,7 @@ export function identicalObject(oldObject, updatedObject) { return false; } - return Object.keys(oldObject).every( - key => oldObject[key] === updatedObject[key], - ); + return Object.keys(oldObject).every(key => oldObject[key] === updatedObject[key]); } export function identicalArray(oldArray, updatedArray) { @@ -86,24 +84,24 @@ export function arrayToObject(array, keyField) { } function getWindowDimensions() { - const { innerWidth: width, innerHeight: height } = window; - return { - width, - height - }; + const { innerWidth: width, innerHeight: height } = window; + return { + width, + height, + }; } export function useWindowDimensions() { - const [windowDimensions, setWindowDimensions] = useState(getWindowDimensions()); + const [windowDimensions, setWindowDimensions] = useState(getWindowDimensions()); - useEffect(() => { - function handleResize() { - setWindowDimensions(getWindowDimensions()); - } + useEffect(() => { + function handleResize() { + setWindowDimensions(getWindowDimensions()); + } - window.addEventListener('resize', handleResize); - return () => window.removeEventListener('resize', handleResize); - }, []); + window.addEventListener("resize", handleResize); + return () => window.removeEventListener("resize", handleResize); + }, []); - return windowDimensions; + return windowDimensions; } diff --git a/src/components/Global/DatetimeFilter.js b/src/components/Global/DatetimeFilter.js index 86e956dea..c4e85ef7a 100644 --- a/src/components/Global/DatetimeFilter.js +++ b/src/components/Global/DatetimeFilter.js @@ -1,61 +1,75 @@ import React, { useState } from "react"; import { Checkbox, STYLE_TYPE } from "baseui/checkbox"; -import { Datepicker } from 'baseui/datepicker'; -import {TimePicker} from 'baseui/timepicker'; +import { Datepicker } from "baseui/datepicker"; +import { TimePicker } from "baseui/timepicker"; const DatetimeFilter = props => { - const [greaterThan, setGreaterThan] = useState(props.value['gt'] || true); - const [dateSelected, setDateSelected] = useState(props.value['val'] ? props.value['val'].split(" ")[0] : null); - const [timeSelected, setTimeSelected] = useState(props.value['val'] ? props.value['val'].split(" ")[1] : null); + const [greaterThan, setGreaterThan] = useState(props.value["gt"] || true); + const [dateSelected, setDateSelected] = useState( + props.value["val"] ? props.value["val"].split(" ")[0] : null, + ); + const [timeSelected, setTimeSelected] = useState( + props.value["val"] ? props.value["val"].split(" ")[1] : null, + ); const [datePick, setDatePick] = useState(null); const [timePick, setTimePick] = useState(null); function toggleGreaterThan() { - props.setValue({'gt': !greaterThan, 'val': `${dateSelected} ${timeSelected}`}); + props.setValue({ + gt: !greaterThan, + val: `${dateSelected} ${timeSelected}`, + }); setGreaterThan(!greaterThan); } function setDate(d) { if (d !== null) { - setDateSelected(d.toISOString().slice(0,10)); - props.setValue({'gt': greaterThan, 'val': `${d.toISOString().slice(0,10)} ${timeSelected}`}); + setDateSelected(d.toISOString().slice(0, 10)); + props.setValue({ + gt: greaterThan, + val: `${d.toISOString().slice(0, 10)} ${timeSelected}`, + }); setDatePick(d); } } function setTime(t) { if (t !== null) { - setTimeSelected(t.toISOString().slice(11,19)); - props.setValue({'gt': greaterThan, 'val': `${dateSelected} ${t.toISOString().slice(11,19)}`}); + setTimeSelected(t.toISOString().slice(11, 19)); + props.setValue({ + gt: greaterThan, + val: `${dateSelected} ${t.toISOString().slice(11, 19)}`, + }); setTimePick(t); } } return ( -
-
+
+

Less Than

toggleGreaterThan()} checkmarkType={STYLE_TYPE.toggle_round} /> -

Greater Than

+

Greater Than

setDate(date)} - formatString="yyyy-MM-dd" - placeholder="YYYY-MM-DD" - mask="9999-99-99" - /> - setTime(time)} - format="24" - step={1800} + aria-label="Select a date" + value={datePick} + onChange={({ date }) => setDate(date)} + formatString="yyyy-MM-dd" + placeholder="YYYY-MM-DD" + mask="9999-99-99" /> + setTime(time)} format="24" step={1800} />
); }; diff --git a/src/components/Global/DeviceAssociator.js b/src/components/Global/DeviceAssociator.js index dc2eaace6..9bbcb2ce8 100644 --- a/src/components/Global/DeviceAssociator.js +++ b/src/components/Global/DeviceAssociator.js @@ -4,17 +4,9 @@ import { Link } from "react-router-dom"; import { Button, KIND } from "baseui/button"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; -import { - faExternalLinkAlt, - faCheck, - faTimes, -} from "@fortawesome/free-solid-svg-icons"; +import { faExternalLinkAlt, faCheck, faTimes } from "@fortawesome/free-solid-svg-icons"; -import { - AccordionWithCaption, - IconSpinner, - PaginatedTable, -} from "../Universal"; +import { AccordionWithCaption, IconSpinner, PaginatedTable } from "../Universal"; import OopCore from "../../OopCore"; @@ -37,15 +29,14 @@ const DeviceAssociator = memo(props => { { + getData={pagination => { return Promise.all([ OopCore.getSites({ "page[size]": -1 }), OopCore.getDevices({ filter: { deviceGroupId: props.deviceGroupId }, pagination, }), - ]) - .then(([sites, devices]) => { + ]).then(([sites, devices]) => { const sitesById = {}; // eslint-disable-next-line no-unused-vars for (const s of sites.data) { @@ -59,9 +50,7 @@ const DeviceAssociator = memo(props => { return devices; }); }} - rowClassName={row => - `device-tempr${row.selected ? " selected" : ""}` - } + rowClassName={row => `device-tempr${row.selected ? " selected" : ""}`} mapFunction={(columnName, content, row) => { if (columnName === "action") { return ( @@ -72,9 +61,7 @@ const DeviceAssociator = memo(props => { target="_blank" to={"/devices/" + content} > - + ); diff --git a/src/components/Global/HttpTemprTemplate.js b/src/components/Global/HttpTemprTemplate.js index 1dcd03d95..6ff908c47 100644 --- a/src/components/Global/HttpTemprTemplate.js +++ b/src/components/Global/HttpTemprTemplate.js @@ -62,11 +62,18 @@ const HttpTemprTemplate = memo(props => { searchable={false} clearable={false} onChange={event => { - setValue("protocol", { language, "script": event.option.id}); + setValue("protocol", { + language, + script: event.option.id, + }); }} - value={[protocolOptions.find( - item => item.id === (props.template.protocol && props.template.protocol.script), - ) || "http"]} + value={[ + protocolOptions.find( + item => + item.id === + (props.template.protocol && props.template.protocol.script), + ) || "http", + ]} error={props.error} /> ); @@ -87,11 +94,19 @@ const HttpTemprTemplate = memo(props => { searchable={false} clearable={false} onChange={event => { - setValue("requestMethod", { language, "script": event.option.id}); + setValue("requestMethod", { + language, + script: event.option.id, + }); }} - value={[requestMethodOptions.find( - item => item.id === (props.template.requestMethod && props.template.requestMethod.script), - ) || "GET"]} + value={[ + requestMethodOptions.find( + item => + item.id === + (props.template.requestMethod && + props.template.requestMethod.script), + ) || "GET", + ]} error={props.error} /> ); @@ -103,7 +118,7 @@ const HttpTemprTemplate = memo(props => { label={"Headers"} value={props.template.headers} onChange={val => setValue("headers", val)} - languages={[ "json", "js" ]} + languages={["json", "js"]} json={({ language, script }) => { let headers; @@ -117,7 +132,10 @@ const HttpTemprTemplate = memo(props => { { - setValue("headers", { language, "script": JSON.stringify(data) }); + setValue("headers", { + language, + script: JSON.stringify(data), + }); }} /> ); diff --git a/src/components/Global/NavigationGroup.js b/src/components/Global/NavigationGroup.js index c10c1eb41..eebfdfcd0 100644 --- a/src/components/Global/NavigationGroup.js +++ b/src/components/Global/NavigationGroup.js @@ -3,11 +3,7 @@ import { NavigationItem } from "."; const useOutsideClick = (ref, exception, callback) => { const handleClick = e => { - if ( - ref.current && - ref.current !== e.target && - !exception.current.contains(e.target) - ) { + if (ref.current && ref.current !== e.target && !exception.current.contains(e.target)) { callback(); } }; @@ -42,10 +38,7 @@ const NavigationGroup = props => { icon={props.icon} /> -
+
{props.children}
diff --git a/src/components/Global/NavigationItem.js b/src/components/Global/NavigationItem.js index 7d47bb396..f7b023be0 100644 --- a/src/components/Global/NavigationItem.js +++ b/src/components/Global/NavigationItem.js @@ -6,16 +6,13 @@ const NavigationItem = props => { if (props.button) { return ( ); @@ -26,29 +23,23 @@ const NavigationItem = props => { size={SIZE.compact} disabled > - {props.icon && ( -
{props.icon}
- )} + {props.icon &&
{props.icon}
} {props.children} ); - }else { + } else { return ( <> diff --git a/src/components/Global/ScheduleAssociator.js b/src/components/Global/ScheduleAssociator.js index ee0ef3d39..c7e750822 100644 --- a/src/components/Global/ScheduleAssociator.js +++ b/src/components/Global/ScheduleAssociator.js @@ -4,23 +4,15 @@ import { Link } from "react-router-dom"; import { Button, KIND } from "baseui/button"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; -import { - faExternalLinkAlt, - faCheck, - faTimes, -} from "@fortawesome/free-solid-svg-icons"; +import { faExternalLinkAlt, faCheck, faTimes } from "@fortawesome/free-solid-svg-icons"; -import { - AccordionWithCaption, - IconSpinner, - PaginatedTable, -} from "../Universal"; +import { AccordionWithCaption, IconSpinner, PaginatedTable } from "../Universal"; import OopCore from "../../OopCore"; -const getData = (pagination) => { +const getData = pagination => { return OopCore.getSchedules({ - //scheduleGroupId: updatedTempr.scheduleGroupId, + // scheduleGroupId: updatedTempr.scheduleGroupId, ...pagination, }); }; @@ -44,9 +36,7 @@ const ScheduleAssociator = memo(props => { - `schedule-tempr${row.selected ? " selected" : ""}` - } + rowClassName={row => `schedule-tempr${row.selected ? " selected" : ""}`} mapFunction={(columnName, content, row) => { if (columnName === "action") { return ( @@ -57,9 +47,7 @@ const ScheduleAssociator = memo(props => { target="_blank" to={"/schedules/" + content} > - + ); diff --git a/src/components/Global/SiteSelector.js b/src/components/Global/SiteSelector.js index 8ef4a459a..1403ba2b1 100644 --- a/src/components/Global/SiteSelector.js +++ b/src/components/Global/SiteSelector.js @@ -53,9 +53,7 @@ const SiteSelector = props => { return props.selectSite(null); }; - const currentSiteName = props.selectedSite - ? props.selectedSite.fullName - : "All sites"; + const currentSiteName = props.selectedSite ? props.selectedSite.fullName : "All sites"; if (isEditing) { return ( @@ -76,23 +74,15 @@ const SiteSelector = props => { allowedLanguages.includes(l.value))} - valueKey="value" - labelKey="label" - value={[{ value: language }]} - onChange={selected => { - props.onChange({ language: selected.option.value, script: script }); - }} - overrides={{ - DropdownContainer: { - style: () => { - return { - width: "auto !important", - }; - } - } - }} - /> - - } - + {getControlElement()} + {!fullScreen && ( + + { error={props.errors.deviceGroup} /> - + { - setParentTemprId( - event.value[0] - ? event.value[0].id - : null, - ); + setParentTemprId(event.value[0] ? event.value[0].id : null); }} value={parentTemprId} /> - -