Implemented strict mode for the project (broken tests, hundreds of @ts-ignore and new errors are included) [skip ci]

packages/app/components/auth/authError/AuthError.js

@@ -1,45 +0,0 @@
-import PropTypes from 'prop-types';
-import React from 'react';
-
-import errorsDict from 'app/services/errorsDict';
-import { PanelBodyHeader } from 'app/components/ui/Panel';
-
-let autoHideTimer;
-function resetTimer() {
-  if (autoHideTimer) {
-    clearTimeout(autoHideTimer);
-    autoHideTimer = null;
-  }
-}
-export default function AuthError({ error, onClose = function() {} }) {
-  resetTimer();
-
-  if (error.payload && error.payload.canRepeatIn) {
-    error.payload.msLeft = error.payload.canRepeatIn * 1000;
-    setTimeout(onClose, error.payload.msLeft - Date.now() + 1500); // 1500 to let the user see, that time is elapsed
-  }
-
-  return (
-    <PanelBodyHeader
-      type="error"
-      onClose={() => {
-        resetTimer();
-        onClose();
-      }}
-    >
-      {errorsDict.resolve(error)}
-    </PanelBodyHeader>
-  );
-}
-
-AuthError.displayName = 'AuthError';
-AuthError.propTypes = {
-  error: PropTypes.oneOfType([
-    PropTypes.string,
-    PropTypes.shape({
-      type: PropTypes.string,
-      payload: PropTypes.object,
-    }),
-  ]).isRequired,
-  onClose: PropTypes.func,
-};

packages/app/components/auth/authError/AuthError.tsx

@@ -0,0 +1,45 @@
+import React, { ComponentType, useEffect } from 'react';
+
+import { resolve as resolveError } from 'app/services/errorsDict';
+import { PanelBodyHeader } from 'app/components/ui/Panel';
+import { ValidationError } from 'app/components/ui/form/FormModel';
+
+interface Props {
+  error: ValidationError;
+  onClose?: () => void;
+}
+
+let autoHideTimer: number | null = null;
+function resetTimeout(): void {
+  if (autoHideTimer) {
+    clearTimeout(autoHideTimer);
+    autoHideTimer = null;
+  }
+}
+
+const AuthError: ComponentType<Props> = ({ error, onClose }) => {
+  useEffect(() => {
+    resetTimeout();
+
+    if (
+      onClose &&
+      typeof error !== 'string' &&
+      error.payload &&
+      error.payload.canRepeatIn
+    ) {
+      const msLeft = error.payload.canRepeatIn * 1000;
+      // 1500 to let the user see, that time is elapsed
+      setTimeout(onClose, msLeft - Date.now() + 1500);
+    }
+
+    return resetTimeout;
+  }, [error, onClose]);
+
+  return (
+    <PanelBodyHeader type="error" onClose={onClose}>
+      {resolveError(error)}
+    </PanelBodyHeader>
+  );
+};
+
+export default AuthError;