diff --git a/frontend/src/modules/login/Login.tsx b/frontend/src/modules/login/Login.tsx
index 87be39e1acb6307d70ead6e9432a07b50c48d5d6..ff2a706a2015fb9a2c55090743a6e81d9b4508fe 100644
--- a/frontend/src/modules/login/Login.tsx
+++ b/frontend/src/modules/login/Login.tsx
@@ -1,7 +1,7 @@
 /**
  * Login page that starts the OAuth2 authentication flow.
  */
-import React from 'react';
+import React, { useEffect } from 'react';
 import clsx from 'clsx';
 import { LockClosedIcon } from '@heroicons/react/solid';
 
@@ -25,6 +25,14 @@ export function Login() {
     }
   };
 
+  useEffect(() => {
+    // On-load, already start authentication process as there are no other
+    // authentication methods to choose from
+    handleSubmit();
+  });
+
+  // Show login/authentication process. On load of the page the authentication
+  // starts right away, hench the "Authenticating ..." prefiled in the button
   return (
     <div className="min-h-screen flex items-center justify-center bg-gray-50 py-12 px-4 sm:px-6 lg:px-8">
       <div className="max-w-md w-full space-y-8">
@@ -42,7 +50,7 @@ export function Login() {
           <span className="absolute left-0 inset-y-0 flex items-center pl-3">
             <LockClosedIcon className="h-5 w-5 text-white group-hover:text-primary-light" aria-hidden="true" />
           </span>
-          Sign in
+          Authenticating ...
         </button>
       </div>
     </div>