style: add eslint configuration and fixed linter issues (#35)

* style: add eslint configuration as per bee-js * chore: add `plugin:react/reocommended` in `.eslintrc` Co-authored-by: nugaon <50576770+nugaon@users.noreply.github.com> * chore: add `consistent` to `array-bracket-newline` as per review * style: after automatic fixes with `npm run lint` * style: fixed all linter errors * refactor: fixed all linter warnings * chore: added missing new line at end of `.prettierrc` file Co-authored-by: nugaon <50576770+nugaon@users.noreply.github.com>
2021-04-03 14:04:37 +02:00
parent 9838aa70c8
commit bc01d60728
54 changed files with 3454 additions and 2782 deletions
@@ -1,48 +1,62 @@
-import React, { useState } from 'react';
-import { TextField, Button, CircularProgress, Container } from '@material-ui/core';
+import React, { ReactElement, useState } from 'react'
+import { TextField, Button, CircularProgress, Container } from '@material-ui/core'

-interface IProps {
-    defaultHost?: string,
-    hostName: string,
+interface Props {
+  defaultHost?: string
+  hostName: string
 }

-export default function ConnectToHost(props: IProps) {
-    const [hostInputVisible, toggleHostInputVisibility] = useState(false)
-    const [connectingToHost, setConnectingToHost] = useState(false)
-    const [host, setHost] = useState('')
+export default function ConnectToHost(props: Props): ReactElement {
+  const [hostInputVisible, toggleHostInputVisibility] = useState(false)
+  const [connectingToHost, setConnectingToHost] = useState(false)
+  const [host, setHost] = useState('')

-    const handleNewHostConnection = () => {
-        if (host) {
-            setConnectingToHost(true)
-            sessionStorage.setItem(props.hostName, host)
-            toggleHostInputVisibility(!hostInputVisible)
-            window.location.reload();
-        }
+  const handleNewHostConnection = () => {
+    if (host) {
+      setConnectingToHost(true)
+      sessionStorage.setItem(props.hostName, host)
+      toggleHostInputVisibility(!hostInputVisible)
+      window.location.reload()
    }
+  }

-    return (
-        <div>
-            {hostInputVisible ?
-            <div style={{display:'flex'}}>
-                <TextField 
-                defaultValue={props.defaultHost} 
-                label="Enter host" 
-                variant="outlined" 
-                size='small' 
-                onChange={(e) => setHost(e.target.value)}
-                style={{marginRight:'15px', minWidth:'300px'}} 
-                />
-                <Button onClick={() => handleNewHostConnection()} size='small' variant="outlined">Connect</Button>
-                <Button  style={{marginLeft:'7px'}} onClick={() => toggleHostInputVisibility(!hostInputVisible)} size='small'>Cancel</Button>
-            </div>
-            : 
-            connectingToHost ?
-            <Container style={{textAlign:'center', padding:'0px'}}>
-                <CircularProgress size={20} />
-            </Container>
-            :
-            <Button onClick={() => toggleHostInputVisibility(!hostInputVisible)} size='small' variant="outlined">Change host</Button>
-            }
-        </div>
-    )
+  return (
+    <div>
+      {
+        // FIXME: this should be broken up
+        /* eslint-disable no-nested-ternary */
+        hostInputVisible ? (
+          <div style={{ display: 'flex' }}>
+            <TextField
+              defaultValue={props.defaultHost}
+              label="Enter host"
+              variant="outlined"
+              size="small"
+              onChange={e => setHost(e.target.value)}
+              style={{ marginRight: '15px', minWidth: '300px' }}
+            />
+            <Button onClick={() => handleNewHostConnection()} size="small" variant="outlined">
+              Connect
+            </Button>
+            <Button
+              style={{ marginLeft: '7px' }}
+              onClick={() => toggleHostInputVisibility(!hostInputVisible)}
+              size="small"
+            >
+              Cancel
+            </Button>
+          </div>
+        ) : connectingToHost ? (
+          <Container style={{ textAlign: 'center', padding: '0px' }}>
+            <CircularProgress size={20} />
+          </Container>
+        ) : (
+          <Button onClick={() => toggleHostInputVisibility(!hostInputVisible)} size="small" variant="outlined">
+            Change host
+          </Button>
+        )
+        /* eslint-enable no-nested-ternary */
+      }
+    </div>
+  )
 }