Bugfix/link not found (#1296)

Redirect to login page if anonymous tries to access a page without permission

Co-authored-by: Eduard Heimbuch <eduard.heimbuch@cloudogu.com>
Co-authored-by: Sebastian Sdorra <sebastian.sdorra@cloudogu.com>

scm-ui/ui-components/src/ErrorBoundary.tsx

@@ -21,14 +21,24 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
-import React, { ReactNode } from "react";
+import React, { ComponentType, ReactNode } from "react";
 import ErrorNotification from "./ErrorNotification";
+import { MissingLinkError } from "./errors";
+import { withContextPath } from "./urls";
+import { withRouter, RouteComponentProps } from "react-router-dom";
+import ErrorPage from "./ErrorPage";
+import { WithTranslation, withTranslation } from "react-i18next";
+import { compose } from "redux";
+import { connect } from "react-redux";
 
-type Props = {
+type ExportedProps = {
   fallback?: React.ComponentType<any>;
   children: ReactNode;
+  loginLink?: string;
 };
 
+type Props = WithTranslation & RouteComponentProps & ExportedProps;
+
 type ErrorInfo = {
   componentStack: string;
 };
@@ -44,16 +54,44 @@ class ErrorBoundary extends React.Component<Props, State> {
     this.state = {};
   }
 
-  componentDidCatch(error: Error, errorInfo: ErrorInfo) {
-    // Catch errors in any components below and re-render with error message
-    this.setState({
-      error,
-      errorInfo
-    });
+  componentDidUpdate(prevProps: Readonly<Props>) {
+    // we must reset the error if the url has changed
+    if (this.state.error && prevProps.location !== this.props.location) {
+      this.setState({ error: undefined, errorInfo: undefined });
+    }
   }
 
+  componentDidCatch(error: Error, errorInfo: ErrorInfo) {
+    this.setState(
+      {
+        error,
+        errorInfo
+      },
+      () => this.redirectToLogin(error)
+    );
+  }
+
+  redirectToLogin = (error: Error) => {
+    const { loginLink } = this.props;
+    if (error instanceof MissingLinkError) {
+      if (loginLink) {
+        window.location.assign(withContextPath("/login"));
+      }
+    }
+  };
+
   renderError = () => {
+    const { t } = this.props;
+    const { error } = this.state;
+
     let FallbackComponent = this.props.fallback;
+
+    if (error instanceof MissingLinkError) {
+      return (
+        <ErrorPage error={error} title={t("errorNotification.prefix")} subtitle={t("errorNotification.forbidden")} />
+      );
+    }
+
     if (!FallbackComponent) {
       FallbackComponent = ErrorNotification;
     }
@@ -69,4 +107,17 @@ class ErrorBoundary extends React.Component<Props, State> {
     return this.props.children;
   }
 }
-export default ErrorBoundary;
+
+const mapStateToProps = (state: any) => {
+  const loginLink = state.indexResources?.links?.login?.href;
+
+  return {
+    loginLink
+  };
+};
+
+export default compose<ComponentType<ExportedProps>>(
+  withRouter,
+  withTranslation("commons"),
+  connect(mapStateToProps)
+)(ErrorBoundary);