Fix eslint errors

config/entropia/index.js

@@ -1,6 +1,5 @@
 // @flow
 import type { Config } from "config/flowtypes";
-import { hex } from "config/colors";
 import * as types from "config/types";
 import * as icons from "@mdi/js";
 import { svg } from "config/icon";

config/rzl/index.js

@@ -4,7 +4,7 @@ import * as types from "config/types";
 import { hex, rainbow } from "config/colors";
 import { svg, withState } from "config/icon";
 import { esper, tasmota } from "./utils";
-import * as icons from "@mdi/js"
+import * as icons from "@mdi/js";
 
 import * as onkyo from "./onkyo";
 import * as olymp from "./olymp";
@@ -277,7 +277,7 @@ const config: Config = {
       name: "LED Stahlträger",
       position: [340, 590],
       icon: svg(icons.mdiWhiteBalanceIridescent).color(({ledStahltraeger}) =>
-        ledStahltraeger === "on" ? rainbow : hex("#000000")),
+        (ledStahltraeger === "on" ? rainbow : hex("#000000"))),
       ui: [
         {
           type: "toggle",
@@ -353,8 +353,8 @@ const config: Config = {
       name: "Twinkle",
       position: [530, 560],
       icon: withState(({twinkle}) =>
-        twinkle === "on" ? svg(icons.mdiLedOn).flipV().color(rainbow)
+        (twinkle === "on" ? svg(icons.mdiLedOn).flipV().color(rainbow)
-          : svg(icons.mdiLedOff).flipV()
+          : svg(icons.mdiLedOff).flipV())
       ),
       ui: [
         {
@@ -369,7 +369,7 @@ const config: Config = {
       name: "Ventilator",
       position: [530, 440],
       icon: svg(icons.mdiFan).color(({fan}) =>
-        fan === "on" ? hex("#00FF00") : hex("#000000")),
+        (fan === "on" ? hex("#00FF00") : hex("#000000"))),
       ui: [
         {
           type: "toggle",
@@ -396,7 +396,7 @@ const config: Config = {
       name: "Fliegenbratgerät",
       position: [450, 570],
       icon: svg(icons.mdiFire).color(({flyfry}) =>
-        flyfry === "on" ? hex("#6666FF") : hex("#000000")),
+        (flyfry === "on" ? hex("#6666FF") : hex("#000000"))),
       ui: esper.statistics("flyfry", [
         {
           type: "toggle",
@@ -431,7 +431,7 @@ const config: Config = {
       name: "Lötarbeitsplatz",
       position: [205, 455],
       icon: svg(icons.mdiEyedropperVariant).color(({loetarbeitsplatz4}) =>
-        loetarbeitsplatz4 === "on" ? hex("#FF0000") : hex("#000000")),
+        (loetarbeitsplatz4 === "on" ? hex("#FF0000") : hex("#000000"))),
       ui: [
         {
           type: "text",
@@ -445,7 +445,7 @@ const config: Config = {
       name: "Lötarbeitsplatz",
       position: [205, 405],
       icon: svg(icons.mdiEyedropperVariant).color(({loetarbeitsplatz4}) =>
-        loetarbeitsplatz4 === "on" ? hex("#FF0000") : hex("#000000")),
+        (loetarbeitsplatz4 === "on" ? hex("#FF0000") : hex("#000000"))),
       ui: [
         {
           type: "text",
@@ -459,7 +459,7 @@ const config: Config = {
       name: "Tür",
       position: [455, 350],
       icon: svg(icons.mdiSwapVertical).color(({doorStatus}) =>
-        doorStatus === "on" ? hex("#00FF00") : hex("#FF0000")),
+        (doorStatus === "on" ? hex("#00FF00") : hex("#FF0000"))),
       ui: [
         {
           type: "link",
@@ -526,8 +526,8 @@ const config: Config = {
       name: "Pilze",
       position: [48, 499],
       icon: withState(({pilze}) =>
-        pilze === "on" ? svg(icons.mdiLedOn) : svg(icons.mdiLedOff)).color(
+        (pilze === "on" ? svg(icons.mdiLedOn) : svg(icons.mdiLedOff))).color(
-          tasmota.iconColor("pilze", rainbow)),
+        tasmota.iconColor("pilze", rainbow)),
       ui: [
         {
           type: "toggle",
@@ -611,8 +611,8 @@ const config: Config = {
       name: "Strom Fablab",
       position: [613, 537],
       icon: withState(({nebenraumPowerStatus}) =>
-        nebenraumPowerStatus === "on" ? svg(icons.mdiFlash).color(hex("#00FF00"))
+        (nebenraumPowerStatus === "on" ?
-          : svg(icons.mdiFlashOff)),
+          svg(icons.mdiFlash).color(hex("#00FF00")) : svg(icons.mdiFlashOff))),
       ui: [
         {
           type: "text",
@@ -627,7 +627,8 @@ const config: Config = {
       position: [1413, 500],
       icon: svg(icons.mdiPool).color(
         ({whirlpoolBubbles}) =>
-          parseInt(whirlpoolBubbles, 10) > 0 ? hex("#00ff00") : hex("#000000")),
+          (parseInt(whirlpoolBubbles, 10) > 0 ? hex("#00ff00")
+            : hex("#000000"))),
       ui: [
         {
           type: "text",

config/rzl/kitchen.js

@@ -4,7 +4,7 @@ import { svg, mdiBattery } from "config/icon";
 import { hex } from "config/colors";
 import * as types from "config/types";
 import { floalt, tradfri, tasmota } from "./utils";
-import * as icons from "@mdi/js"
+import * as icons from "@mdi/js";
 
 export const topics: Topics = {
   //Kuechen-Floalts

config/rzl/olymp.js

@@ -4,7 +4,7 @@ import { svg } from "config/icon";
 import { hex, rainbow } from "config/colors";
 import * as types from "config/types";
 import { tasmota, esper } from "./utils";
-import * as icons from "@mdi/js"
+import * as icons from "@mdi/js";
 
 export const topics: Topics = {
   ...tasmota.topics("8", "ledOlymp"),
@@ -63,7 +63,7 @@ export const controls: Controls = {
     name: "Videospiele",
     position: [100, 100],
     icon: svg(icons.mdiGamepadVariant).color(({videogames}) =>
-      videogames === "on" ? hex("#00FF00") : hex("#000000")),
+      (videogames === "on" ? hex("#00FF00") : hex("#000000"))),
     ui: [
       {
         type: "toggle",
@@ -77,7 +77,7 @@ export const controls: Controls = {
     name: "Rechner",
     position: [297, 90],
     icon: svg(icons.mdiDesktopClassic).color(({olympPC}) =>
-      olympPC === "on" ? hex("#00FF00") : hex("#000000")),
+      (olympPC === "on" ? hex("#00FF00") : hex("#000000"))),
     ui: [
       {
         type: "toggle",
@@ -91,7 +91,7 @@ export const controls: Controls = {
     name: "Rundumleuchte",
     position: [310, 275],
     icon: svg(icons.mdiAlarmLight).color(({rundumleuchte}) =>
-      rundumleuchte === "on" ? hex("#F0DF10") : hex("#000000")),
+      (rundumleuchte === "on" ? hex("#F0DF10") : hex("#000000"))),
     ui: [
       {
         type: "toggle",

config/rzl/utils.js

@@ -3,7 +3,7 @@ import type { ControlUI, Topics } from "config/flowtypes";
 import { svg } from "config/icon";
 import { hex, type Color } from "config/colors";
 import * as types from "config/types";
-import * as icons from "@mdi/js"
+import * as icons from "@mdi/js";
 
 export const tasmota = {
   topics: (id: string, name: string): Topics => ({

config/uwap-home/index.js

@@ -3,7 +3,7 @@ import type { Config } from "config/flowtypes";
 import * as types from "config/types";
 import { svg, withState } from "config/icon";
 import { hex } from "config/colors";
-import * as icons from "@mdi/js"
+import * as icons from "@mdi/js";
 
 const topicBulbHomeRust = (bulb: string, argument: string) => ({
   [`${bulb}${argument}`]: {
@@ -207,7 +207,7 @@ const config: Config = {
       name: "Schlafzimmer",
       position: [180, 130],
       icon: svg(icons.mdiCeilingLight).color(({bedroomState}) =>
-        bedroomState === "on" ? hex("#00FF00") : hex("#000000")),
+        (bedroomState === "on" ? hex("#00FF00") : hex("#000000"))),
       ui: [
         {
           type: "toggle",
@@ -243,7 +243,7 @@ const config: Config = {
       name: "Lüftung Schlafzimmer",
       position: [140, 25],
       icon: svg(icons.mdiFan).color(({fanBedroomState}) =>
-        fanBedroomState === "on" ? hex("#00FF00") : hex("#000000")),
+        (fanBedroomState === "on" ? hex("#00FF00") : hex("#000000"))),
       ui: [
         {
           type: "toggle",
@@ -278,9 +278,9 @@ const config: Config = {
       name: "Lautsprecher",
       position: [245, 658],
       icon: withState(({speakerOfficeState}) =>
-        speakerOfficeState !== "on" ? svg(icons.mdiVolumeOff)
+        (speakerOfficeState !== "on" ? svg(icons.mdiVolumeOff)
-          : svg(icons.mdiVolumeHigh).color(hex("#00FF00"))
+          : svg(icons.mdiVolumeHigh).color(hex("#00FF00")))
-        ),
+      ),
       ui: [
         {
           type: "toggle",
@@ -375,7 +375,7 @@ const config: Config = {
       name: "Büro",
       position: [210, 570],
       icon: svg(icons.mdiCeilingLight).color(({officeState}) =>
-        officeState === "on" ? hex("#00FF00") : hex("#000000")),
+        (officeState === "on" ? hex("#00FF00") : hex("#000000"))),
       ui: [
         {
           type: "toggle",
@@ -397,7 +397,7 @@ const config: Config = {
       name: "Flur",
       position: [520, 370],
       icon: svg(icons.mdiCeilingLight).color(({hallwayState}) =>
-        hallwayState === "on" ? hex("#00FF00") : hex("#000000")),
+        (hallwayState === "on" ? hex("#00FF00") : hex("#000000"))),
       ui: [
         {
           type: "toggle",
@@ -419,7 +419,7 @@ const config: Config = {
       name: "Flur",
       position: [250, 370],
       icon: svg(icons.mdiCeilingLight).color(({hallway2State}) =>
-        hallway2State === "on" ? hex("#00FF00") : hex("#000000")),
+        (hallway2State === "on" ? hex("#00FF00") : hex("#000000"))),
       ui: [
         {
           type: "toggle",
@@ -460,7 +460,7 @@ const config: Config = {
       name: "NAS",
       position: [550, 100],
       icon: svg(icons.mdiNas).color(({nasPower}) =>
-        nasPower === "on" ? hex("#00FF00") : hex("#000000")),
+        (nasPower === "on" ? hex("#00FF00") : hex("#000000"))),
       ui: [
         {
           type: "toggle",
@@ -474,7 +474,7 @@ const config: Config = {
       name: "Wohnzimmer",
       position: [450, 200],
       icon: svg(icons.mdiCeilingLight).color(({livingroomState}) =>
-        livingroomState === "on" ? hex("#00FF00") : hex("#000000")),
+        (livingroomState === "on" ? hex("#00FF00") : hex("#000000"))),
       ui: ([
         {
           type: "toggle",

src/components/App.js

@@ -40,12 +40,12 @@ export type AppState = {
 };
 
 /*
-const App = (props: AppProps) => {
+ *const App = (props: AppProps) => {
-  const topics = Array.isArray(props.config.topics) ?
+ *  const topics = Array.isArray(props.config.topics) ?
-      Object.assign({}, ...props.config.topics) : props.config.topics;
+ *      Object.assign({}, ...props.config.topics) : props.config.topics;
-  const [mqttConnected, setMqttConnected] = useState(false);
+ *  const [mqttConnected, setMqttConnected] = useState(false);
-};
+ *};
-*/
+ */
 
 class App extends React.PureComponent<AppProps & Classes, AppState> {
   controlMap: React.Node

src/components/ControlMap.js

@@ -7,7 +7,7 @@ import filter from "lodash/filter";
 import reduce from "lodash/reduce";
 import MqttContext from "mqtt/context";
 import type { Controls, Control, UIControl, ControlUI } from "config/flowtypes";
-import { renderToString } from 'react-dom/server'
+import { renderToString } from "react-dom/server";
 
 export type Point = [number, number];
 

src/config/flowtypes.js

@@ -1,5 +1,4 @@
 // @flow
-import type { Color } from "config/colors";
 import type { Icon } from "config/icon";
 
 export type TopicType = (msg: Buffer) => string;

src/config/icon.js

@@ -1,9 +1,8 @@
 // @flow
 import React from "react";
 import ReactIcon from "@mdi/react";
-import ReactContext from "mqtt/context";
+import { type Color } from "./colors";
-import { hex, type Color } from "./colors"
+import * as mdiIcons from "@mdi/js";
-import * as mdiIcons from "@mdi/js"
 
 export type Icon = {
   render: (s: State) => React.Node,
@@ -36,7 +35,7 @@ export const svg = (data: string, props?: IconPropHelper): Icon => {
         horizontal={props?.horizontal ?? false}
         vertical={props?.vertical ?? false}
         color={propColor(state)}
-        />
+      />
     ),
     size: (n: number) => svg(data, {...props, size: n}),
     rotate: (n: number) => svg(data, {...props, rotate: n}),
@@ -44,7 +43,7 @@ export const svg = (data: string, props?: IconPropHelper): Icon => {
     flipV: () => svg(data, {...props, vertical: !props?.vertical ?? true}),
     color: (c: Color | (State) => Color) => svg(data, {...props, color: c})
   };
-}
+};
 
 export const withState = (f: (s: State) => Icon): Icon => {
   return {
@@ -55,7 +54,7 @@ export const withState = (f: (s: State) => Icon): Icon => {
     flipV: () => withState(f),
     color: () => withState(f)
   };
-}
+};
 
 export const mdiBattery = (topic: string): Icon => withState((state) => {
   const rawval = state[topic];