From 703f47042a6bd24f7dc44796e4b30da4f06246ae Mon Sep 17 00:00:00 2001
From: Marco Crivellaro <marco.crive@gmail.com>
Date: Thu, 8 Apr 2021 23:15:05 +0100
Subject: [PATCH] handling error by outputing the message to the div

Signed-off-by: Marco Crivellaro <marco.crive@gmail.com>
---
 .../docs/tutorials/aws-alb-aad-oidc-auth.md   | 43 ++++++++++---------
 1 file changed, 23 insertions(+), 20 deletions(-)

diff --git a/contrib/docs/tutorials/aws-alb-aad-oidc-auth.md b/contrib/docs/tutorials/aws-alb-aad-oidc-auth.md
index 2503c31756..ba0aef89ea 100644
--- a/contrib/docs/tutorials/aws-alb-aad-oidc-auth.md
+++ b/contrib/docs/tutorials/aws-alb-aad-oidc-auth.md
@@ -56,29 +56,32 @@ When using ALB authentication Backstage will only be loaded once the user has su
 
 ```ts
 const DummySignInComponent: any = (props: any) => {
-  const config = useApi(configApiRef);
-  const shouldAuth = !!config.getOptionalConfig('auth.providers.awsalb');
-  if (shouldAuth) {
-    fetch(`${window.location.origin}/api/auth/awsalb/refresh`)
-      .then(data => data.json())
-      .then(data => {
-        props.onResult({
-          userId: data.backstageIdentity.id,
-          profile: data.profile,
+  try {
+    const config = useApi(configApiRef);
+    const shouldAuth = !!config.getOptionalConfig('auth.providers.awsalb');
+    if (shouldAuth) {
+      fetch(`${window.location.origin}/api/auth/awsalb/refresh`)
+        .then(data => data.json())
+        .then(data => {
+          props.onResult({
+            userId: data.backstageIdentity.id,
+            profile: data.profile,
+          });
         });
+    } else {
+      props.onResult({
+        userId: 'guest',
+        profile: {
+          email: 'guest@example.com',
+          displayName: 'Guest',
+          picture: '',
+        },
       });
-  } else {
-    props.onResult({
-      userId: 'guest',
-      profile: {
-        email: 'guest@example.com',
-        displayName: 'Guest',
-        picture: '',
-      },
-    });
+    }
+    return <div />;
+  } catch (err) {
+    return <div>{err.message}</div>;
   }
-
-  return <div />;
 };
 ```