diff --git a/auth0/app/components/login-button.jsx b/auth0/app/components/login-button.jsx
index c52ccb8..daa82e4 100644
--- a/auth0/app/components/login-button.jsx
+++ b/auth0/app/components/login-button.jsx
@@ -1,9 +1,18 @@
+import { useAuth0 } from '@auth0/auth0-react';
 import React from 'react';
+
 function LoginButton(props) {
+    const { loginWithRedirect } = useAuth0()
     return (
         <div>
-            <button className="loginButton">Login</button>
+            <button 
+                onClick={()=>loginWithRedirect()} 
+                className="loginButton"
+                >
+                Login
+                </button>
         </div>
-    );
-};
+    )
+}
+
 export default LoginButton;
diff --git a/auth0/app/components/logout-button.jsx b/auth0/app/components/logout-button.jsx
index 3359e38..5a0d177 100644
--- a/auth0/app/components/logout-button.jsx
+++ b/auth0/app/components/logout-button.jsx
@@ -1,9 +1,18 @@
+import { useAuth0 } from '@auth0/auth0-react';
 import React from 'react';
+
 function LogoutButton(props) {
+    const { loginWithRedirect } = useAuth0()
     return (
         <div>
-            <button className="loginButton">Logout</button>
+            <button 
+                onClick={()=>loginWithRedirect()} 
+                className="loginButton"
+                >
+                Logout
+                </button>
         </div>
-    );
-};
+    )
+}
+
 export default LogoutButton;