Add eslint rules for sonar issues

src/components/common/GenresItemsContainer.tsx

@@ -90,8 +90,8 @@ const GenresItemsContainer: FC<GenresItemsContainerProps> = ({
                         <h1>{globalize.translate('MessageNothingHere')}</h1>
                         <p>{globalize.translate('MessageNoGenresAvailable')}</p>
                     </div>
-                ) : items.map((item, index) => (
-                    <div key={index} className='verticalSection'>
+                ) : items.map(item => (
+                    <div key={item.Id} className='verticalSection'>
                         <div
                             className='sectionTitleContainer sectionTitleContainer-cards padded-left'
                             dangerouslySetInnerHTML={createLinkElement({

src/components/remotecontrol/remotecontrol.js

@@ -610,7 +610,7 @@ export default function () {
     function onTimeUpdate() {
         const now = new Date().getTime();
 
-        if (!(now - lastUpdateTime < 700)) {
+        if (now - lastUpdateTime >= 700) {
             lastUpdateTime = now;
             const player = this;
             currentRuntimeTicks = playbackManager.duration(player);

src/components/search/LiveTVSearchResults.tsx

@@ -125,7 +125,7 @@ const LiveTVSearchResults: FunctionComponent<LiveTVSearchResultsProps> = ({ serv
                 'searchResults',
                 'padded-bottom-page',
                 'padded-top',
-                { 'hide': !query || !(collectionType === 'livetv') }
+                { 'hide': !query || collectionType !== 'livetv' }
             )}
         >
             <SearchResultsRow

src/components/search/SearchFields.tsx

@@ -1,5 +1,5 @@
 import debounce from 'lodash-es/debounce';
-import React, { FunctionComponent, useEffect, useMemo, useRef } from 'react';
+import React, { FunctionComponent, useCallback, useEffect, useMemo, useRef } from 'react';
 
 import AlphaPicker from '../alphaPicker/AlphaPickerComponent';
 import globalize from '../../scripts/globalize';
@@ -53,7 +53,7 @@ const SearchFields: FunctionComponent<SearchFieldsProps> = ({ onSearch = () => {
         };
     }, [debouncedOnSearch]);
 
-    const onAlphaPicked = (e: Event) => {
+    const onAlphaPicked = useCallback((e: Event) => {
         const value = (e as CustomEvent).detail.value;
         const searchInput = getSearchInput();
 
@@ -70,7 +70,7 @@ const SearchFields: FunctionComponent<SearchFieldsProps> = ({ onSearch = () => {
         }
 
         searchInput.dispatchEvent(new CustomEvent('input', { bubbles: true }));
-    };
+    }, []);
 
     return (
         <div