build: add new react & typescript linter rules and fix their problems

* Add a total of 6 new react and typescript linter rules
* Fix the existing problems that the linter found with the new rules

.eslintrc.json

@@ -48,20 +48,27 @@
     }],
     "@typescript-eslint/no-empty-function": ["warn", { "allow": ["arrowFunctions"] }],
     "@typescript-eslint/no-explicit-any": "off",
+    "@typescript-eslint/no-invalid-void-type": ["warn", { "allowInGenericTypeArguments": true }],
     "@typescript-eslint/no-namespace": "off",
     "@typescript-eslint/no-unused-vars": ["warn", {
       "vars": "all",
       "args": "none"
     }],
     "@typescript-eslint/no-use-before-define": "off",
     "@typescript-eslint/prefer-interface": "off",
-    "react/no-unescaped-entities": ["error", {"forbid": [{
+    //"react/no-access-state-in-setstate": "warn", (requires restructuring of "app.tsx")
+    "react/no-direct-mutation-state": "warn",
+    "react/no-render-return-value": "warn",
+    "react/no-string-refs": "warn",
+    "react/no-unescaped-entities": ["warn", {"forbid": [{
       "char": ">",
       "alternatives": [">"]
     }, {
       "char": "}",
       "alternatives": ["}"]
     }]}],
+    "react/no-unused-prop-types": "warn",
+    "react/no-unused-state": "warn",
     "curly": ["warn", "all"],
     "eol-last": "warn",
     "for-direction": "warn",

src/renderer/components/ConfirmElement.tsx

@@ -16,7 +16,7 @@ export type ConfirmElementArgs<T = undefined> = {
 
 export type ConfirmElementProps<T = undefined> = {
   /** Function that renders the element (render prop). */
-  render?: (args: ConfirmElementArgs<T>) => JSX.Element | void;
+  render?: (args: ConfirmElementArgs<T>) => JSX.Element | undefined;
   /** Number of activations needed to confirm. */
   activationLimit?: number;
   /** Called when confirmed. */

src/renderer/components/EditableTextElement.tsx

@@ -30,7 +30,7 @@ export type EditableTextElementKeyArgs = {
 
 export type EditableTextElementProps<T> = {
   /** Function that renders the text element (render prop). */
-  children?: (args: EditableTextElementArgs<T>) => JSX.Element | void;
+  children?: (args: EditableTextElementArgs<T>) => JSX.Element | undefined;
   /** If the element is editable (if it can enter "edit mode"). */
   editable?: boolean;
   /** Called when editing is confirmed (when the user is done editing and attempts to "lock in" the edited text). */

src/renderer/components/RightTagCategoriesSidebar.tsx

@@ -25,7 +25,6 @@ type OwnProps = {
 export type RightTagCategoriesSidebarProps = OwnProps & WithPreferencesProps;
 
 type RRightTagCategoriesSidebarState = {
-  currentTagInput: string;
 };
 
 export interface RightTagCategoriesSidebar {
@@ -39,9 +38,6 @@ export class RightTagCategoriesSidebar extends React.Component<RightTagCategorie
 
   constructor(props: RightTagCategoriesSidebarProps) {
     super(props);
-    this.state = {
-      currentTagInput: ''
-    };
   }
 
   componentDidMount() {
@@ -197,10 +193,6 @@ export class RightTagCategoriesSidebar extends React.Component<RightTagCategorie
     this.props.onEditCategory({ color: color.hex });
   }
 
-  onCurrentTagChange = (event: React.ChangeEvent<InputElement>) => {
-    this.setState({ currentTagInput: event.currentTarget.value });
-  }
-
   /** When a key is pressed while an input field is selected (except for multiline fields) */
   onInputKeyDown = (event: React.KeyboardEvent): void => {
     // if (event.key === 'Enter') { this.props.onSaveGame(); }

src/renderer/components/pages/CuratePage.tsx

@@ -334,7 +334,7 @@ export function CuratePage(props: CuratePageProps) {
         date: date,
         saveCuration: props.preferencesData.saveImportedCurations,
       }
-    ).then<void>(res => new Promise((resolve, reject) => {
+    ).then<undefined>(res => new Promise((resolve, reject) => {
       if (res.data && res.data.error) {
         reject(res.data.error);
       } else {

src/renderer/components/pages/TagCategoriesPage.tsx

@@ -29,8 +29,6 @@ export type TagCategoriesPageState = {
   selectedCategoryId?: number;
   /** Whether we're editing a tag or not */
   isEditing: boolean;
-  /** Current total tag results  */
-  categoriesTotal: number;
 }
 
 export interface TagCategoriesPage {
@@ -43,8 +41,7 @@ export class TagCategoriesPage extends React.Component<TagCategoriesPageProps, T
   constructor(props: TagCategoriesPageProps) {
     super(props);
     this.state = {
-      isEditing: false,
-      categoriesTotal: 0
+      isEditing: false
     };
   }