Extract linting rules into separate file

administration/.eslintrc

@@ -0,0 +1,15 @@
+{
+  "parser": "@typescript-eslint/parser",
+  "extends": ["react-app", "react-app/jest", "eslint-config-prettier", "plugin:@typescript-eslint/recommended"],
+  "ignorePatterns": ["src/generated/**", "build/**"],
+  "rules": {
+    "prefer-template": "error",
+    "testing-library/prefer-screen-queries": "off",
+    "testing-library/no-node-access": "off",
+    "@typescript-eslint/no-non-null-assertion": "off",
+    "@typescript-eslint/no-var-requires": "off",
+    "@typescript-eslint/prefer-ts-expect-error": "error",
+    "@typescript-eslint/no-empty-function": "off",
+    "@typescript-eslint/ban-types": ["error", { "extendDefaults": true, "types": { "{}": false } }]
+  }
+}

administration/package.json

@@ -8,7 +8,6 @@
   "dependencies": {
     "@apollo/client": "^3.7.16",
     "@blueprintjs/core": "^5.0.0",
-    "@blueprintjs/popover2": "^2.0.0",
     "@blueprintjs/select": "^5.0.0",
     "@blueprintjs/table": "^5.0.0",
     "@bufbuild/protobuf": "^1.2.1",
@@ -62,10 +61,9 @@
     "css-loader": "^6.8.1",
     "dotenv": "^16.3.1",
     "dotenv-expand": "^10.0.0",
-    "eslint": "^8.43.0",
+    "eslint": "^8.48.0",
     "eslint-config-prettier": "^8.8.0",
     "eslint-config-react-app": "^7.0.1",
-    "eslint-plugin-jest": "^27.2.3",
     "file-loader": "^6.2.0",
     "html-webpack-plugin": "^5.5.3",
     "jest": "^29.6.2",
@@ -96,21 +94,6 @@
     "generate-protobuf": "protoc -I ../specs --es_out=src/generated --es_opt=target=ts --plugin=protoc-gen-es=./node_modules/.bin/protoc-gen-es ../specs/card.proto",
     "postinstall": "npm run generate-protobuf && npm run generate-graphql"
   },
-  "eslintConfig": {
-    "plugins": [
-      "jest"
-    ],
-    "extends": [
-      "eslint-config-prettier",
-      "react-app",
-      "plugin:jest/recommended",
-      "plugin:jest/style"
-    ],
-    "ignorePatterns": [
-      "src/generated/**",
-      "build/**"
-    ]
-  },
   "browserslist": {
     "production": [
       ">0.2% in DE and not dead"

administration/scripts/build.ts

@@ -15,9 +15,7 @@ import configFactory from '../config/webpack.config'
 const bfj = require('bfj')
 
 // Do this as the first thing so that any code reading it knows the right env.
-// @ts-ignore
 process.env.BABEL_ENV = 'production'
-// @ts-ignore
 process.env.NODE_ENV = 'production'
 
 // Makes the script crash on unhandled rejections instead of silently
@@ -87,10 +85,8 @@ checkBrowsers(paths.appPath, isInteractive)
       if (warnings.length) {
         console.log(chalk.yellow('Compiled with warnings.\n'))
         console.log(warnings.join('\n\n'))
-        console.log(
-          '\nSearch for the ' + chalk.underline(chalk.yellow('keywords')) + ' to learn more about each warning.'
-        )
-        console.log('To ignore, add ' + chalk.cyan('// eslint-disable-next-line') + ' to the line before.\n')
+        console.log(`\nSearch for the ${chalk.underline(chalk.yellow('keywords'))} to learn more about each warning.`)
+        console.log(`To ignore, add ${chalk.cyan('// eslint-disable-next-line')} to the line before.\n`)
       } else {
         console.log(chalk.green('Compiled successfully.\n'))
       }
@@ -198,7 +194,7 @@ function build(previousFileSizes: FileSizeReporter.OpaqueFileSizes): Promise<{
 
       if (writeStatsJson) {
         return bfj
-          .write(paths.appBuild + '/bundle-stats.json', stats.toJson())
+          .write(`${paths.appBuild}/bundle-stats.json`, stats.toJson())
           .then(() => resolve(resolveArgs))
           .catch((error: any) => reject(new Error(error)))
       }

administration/scripts/start.ts

@@ -12,9 +12,7 @@ import configFactory from '../config/webpack.config'
 import createDevServerConfig from '../config/webpackDevServer.config'
 
 // Do this as the first thing so that any code reading it knows the right env.
-// @ts-ignore
 process.env.BABEL_ENV = 'development'
-// @ts-ignore
 process.env.NODE_ENV = 'development'
 
 // Makes the script crash on unhandled rejections instead of silently
@@ -65,10 +63,10 @@ checkBrowsers(paths.appPath, isInteractive)
     const protocol = process.env.HTTPS === 'true' ? 'https' : 'http'
     const appName = require(paths.appPackageJson).name
 
-    // @ts-ignore
+    // @ts-expect-error prepareUrls typed incorrectly
     const urls = prepareUrls(protocol, HOST, port, paths.publicUrlOrPath.slice(0, -1))
     // Create a webpack compiler that is configured with custom messages.
-    // @ts-ignore
+    // @ts-expect-error devSocket actually not required
     const compiler = createCompiler({
       appName,
       config,

administration/src/KeepAliveToken.tsx

@@ -1,5 +1,5 @@
 import { Button, Classes, Dialog } from '@blueprintjs/core'
-import React, { ReactNode, useContext, useEffect, useState } from 'react'
+import { ReactNode, useContext, useEffect, useState } from 'react'
 import { useNavigate } from 'react-router-dom'
 
 import { TokenPayload } from './AuthProvider'

administration/src/bp-modules/ButtonBar.tsx

@@ -5,7 +5,7 @@ const ButtonBar = styled(Card)`
   width: 100%;
   padding: 15px;
   background: #fafafa;
-  z-index: 100;
+  z-index: 10;
   display: flex;
   flex-direction: row;
   justify-content: flex-end;

administration/src/bp-modules/PasswordInput.tsx

@@ -1,10 +1,9 @@
-import { Button, InputGroup, InputGroupProps2, Label } from '@blueprintjs/core'
-import { Tooltip2 } from '@blueprintjs/popover2'
+import { Button, InputGroup, InputGroupProps2, Label, Tooltip } from '@blueprintjs/core'
 import { useState } from 'react'
 
 const ShowPasswordButton = (props: { hidden: boolean; onClick: () => void }) => {
   return (
-    <Tooltip2
+    <Tooltip
       content={props.hidden ? 'Passwort anzeigen' : 'Passwort verstecken'}
       renderTarget={({ isOpen, ref, ...tooltipProps }) => (
         <Button

administration/src/bp-modules/applications/ApplicationsOverview.tsx

@@ -183,7 +183,6 @@ const ApplicationsOverview = (props: { applications: Application[] }) => {
   const { applicationIdForPrint, printApplicationById } = usePrintApplication()
 
   return (
-    // @ts-ignore
     <FlipMove style={{ display: 'flex', justifyContent: 'center', flexWrap: 'wrap' }}>
       {updatedApplications.map(application => (
         <ApplicationViewComponent

administration/src/bp-modules/applications/VerificationsView.tsx

@@ -1,5 +1,4 @@
-import { Colors, Icon } from '@blueprintjs/core'
-import { Tooltip2 } from '@blueprintjs/popover2'
+import { Colors, Icon, Tooltip } from '@blueprintjs/core'
 import React, { ReactNode } from 'react'
 import styled from 'styled-components'
 
@@ -60,7 +59,7 @@ const getStatus = (verification: Application['verifications'][number]) => {
 export const VerificationsQuickIndicator = ({ verifications }: { verifications: Application['verifications'] }) => {
   const verificationStati = verifications.map(getStatus)
   return (
-    <Tooltip2
+    <Tooltip
       content={
         <div>
           <b>Bestätigung(en) durch Organisationen:</b>
@@ -82,7 +81,7 @@ export const VerificationsQuickIndicator = ({ verifications }: { verifications:
           text={verificationStati.filter(v => v === VerificationStatus.Rejected).length}
         />
       </div>
-    </Tooltip2>
+    </Tooltip>
   )
 }
 
@@ -101,9 +100,9 @@ const VerificationsView = ({ verifications }: { verifications: Application['veri
         {verifications.map((verification, index) => {
           const status = getStatus(verification)
           const text = verification.verifiedDate
-            ? 'Bestätigt am ' + new Date(verification.verifiedDate).toLocaleString('de')
+            ? `Bestätigt am ${new Date(verification.verifiedDate).toLocaleString('de')}`
             : verification.rejectedDate
-            ? 'Widersprochen am ' + new Date(verification.rejectedDate).toLocaleString('de')
+            ? `Widersprochen am ${new Date(verification.rejectedDate).toLocaleString('de')}`
             : 'Ausstehend'
           return (
             <VerificationListItem

administration/src/bp-modules/cards/AddCardForm.tsx

@@ -74,7 +74,7 @@ const CreateCardForm = ({ cardBlueprint, onRemove, onUpdate }: CreateCardsFormPr
                 cardBlueprint.expirationDate = PlainDate.from(e.target.value)
                 onUpdate()
               } catch (error) {
-                console.error("Could not parse date from string '" + e.target.value + "'.", error)
+                console.error(`Could not parse date from string '${e.target.value}'.`, error)
               }
             }
           }}