Updated to airbnb coding styles

src/servers/helpers/DuplicatedServersModal.tsx

@@ -20,12 +20,12 @@ export const DuplicatedServersModal: FC<DuplicatedServersModalProps> = (
       <ModalBody>
         <p>{hasMultipleServers ? 'The next servers already exist:' : 'There is already a server with:'}</p>
         <ul>
-          {duplicatedServers.map(({ url, apiKey }, index) => !hasMultipleServers ? (
+          {duplicatedServers.map(({ url, apiKey }, index) => (!hasMultipleServers ? (
             <Fragment key={index}>
               <li>URL: <b>{url}</b></li>
               <li>API key: <b>{apiKey}</b></li>
             </Fragment>
-          ) : <li key={index}><b>{url}</b> - <b>{apiKey}</b></li>)}
+          ) : <li key={index}><b>{url}</b> - <b>{apiKey}</b></li>))}
         </ul>
         <span>
           {hasMultipleServers ? 'Do you want to ignore duplicated servers' : 'Do you want to save this server anyway'}?

src/servers/helpers/HighlightCard.tsx

@@ -10,7 +10,7 @@ export interface HighlightCardProps {
   link?: string | false;
 }
 
-const buildExtraProps = (link?: string | false) => !link ? {} : { tag: Link, to: link };
+const buildExtraProps = (link?: string | false) => (!link ? {} : { tag: Link, to: link });
 
 export const HighlightCard: FC<HighlightCardProps> = ({ children, title, link }) => (
   <Card className="highlight-card" body {...buildExtraProps(link)}>

src/servers/helpers/ImportServersBtn.tsx

@@ -1,4 +1,4 @@
-import { useRef, RefObject, ChangeEvent, MutableRefObject, FC, useState, useEffect } from 'react';
+import { useRef, RefObject, ChangeEvent, MutableRefObject, useState, useEffect, FC } from 'react';
 import { Button, UncontrolledTooltip } from 'reactstrap';
 import { complement, pipe } from 'ramda';
 import { faFileUpload as importIcon } from '@fortawesome/free-solid-svg-icons';
@@ -38,9 +38,9 @@ const ImportServersBtn = ({ importServersFromFile }: ServersImporter): FC<Import
   className = '',
 }) => {
   const ref = fileRef ?? useRef<HTMLInputElement>();
-  const [ serversToCreate, setServersToCreate ] = useState<ServerData[] | undefined>();
-  const [ duplicatedServers, setDuplicatedServers ] = useState<ServerData[]>([]);
-  const [ isModalOpen,, showModal, hideModal ] = useToggle();
+  const [serversToCreate, setServersToCreate] = useState<ServerData[] | undefined>();
+  const [duplicatedServers, setDuplicatedServers] = useState<ServerData[]>([]);
+  const [isModalOpen,, showModal, hideModal] = useToggle();
   const create = pipe(createServers, onImport);
   const createAllServers = pipe(() => create(serversToCreate ?? []), hideModal);
   const createNonDuplicatedServers = pipe(
@@ -52,7 +52,7 @@ const ImportServersBtn = ({ importServersFromFile }: ServersImporter): FC<Import
       .then(setServersToCreate)
       .then(() => {
         // Reset input after processing file
-        (target as { value: string | null }).value = null;
+        (target as { value: string | null }).value = null; // eslint-disable-line no-param-reassign
       })
       .catch(onImportError);
 
@@ -62,12 +62,12 @@ const ImportServersBtn = ({ importServersFromFile }: ServersImporter): FC<Import
     }
 
     const existingServers = Object.values(servers);
-    const duplicatedServers = serversToCreate.filter(serversFiltering(existingServers));
-    const hasDuplicatedServers = !!duplicatedServers.length;
+    const dupServers = serversToCreate.filter(serversFiltering(existingServers));
+    const hasDuplicatedServers = !!dupServers.length;
 
-    !hasDuplicatedServers ? create(serversToCreate) : setDuplicatedServers(duplicatedServers);
+    !hasDuplicatedServers ? create(serversToCreate) : setDuplicatedServers(dupServers);
     hasDuplicatedServers && showModal();
-  }, [ serversToCreate ]);
+  }, [serversToCreate]);
 
   return (
     <>

src/servers/helpers/ServerForm.tsx

@@ -11,16 +11,16 @@ interface ServerFormProps {
 }
 
 export const ServerForm: FC<ServerFormProps> = ({ onSubmit, initialValues, children, title }) => {
-  const [ name, setName ] = useState('');
-  const [ url, setUrl ] = useState('');
-  const [ apiKey, setApiKey ] = useState('');
+  const [name, setName] = useState('');
+  const [url, setUrl] = useState('');
+  const [apiKey, setApiKey] = useState('');
   const handleSubmit = handleEventPreventingDefault(() => onSubmit({ name, url, apiKey }));
 
   useEffect(() => {
     initialValues && setName(initialValues.name);
     initialValues && setUrl(initialValues.url);
     initialValues && setApiKey(initialValues.apiKey);
-  }, [ initialValues ]);
+  }, [initialValues]);
 
   return (
     <form className="server-form" onSubmit={handleSubmit}>

src/servers/helpers/withSelectedServer.tsx

@@ -16,7 +16,7 @@ export function withSelectedServer<T = {}>(WrappedComponent: FC<WithSelectedServ
 
     useEffect(() => {
       params.serverId && selectServer(params.serverId);
-    }, [ params.serverId ]);
+    }, [params.serverId]);
 
     if (!selectedServer) {
       return (

src/servers/helpers/withoutSelectedServer.tsx

@@ -6,8 +6,9 @@ interface WithoutSelectedServerProps {
 
 export function withoutSelectedServer<T = {}>(WrappedComponent: FC<WithoutSelectedServerProps & T>) {
   return (props: WithoutSelectedServerProps & T) => {
+    const { resetSelectedServer } = props;
     useEffect(() => {
-      props.resetSelectedServer();
+      resetSelectedServer();
     }, []);
 
     return <WrappedComponent {...props} />;