From 9a6ec7d7c4964e732a500713085811a515932144 Mon Sep 17 00:00:00 2001
From: Anton Tranelis <31516529+antontranelis@users.noreply.github.com>
Date: Fri, 13 Mar 2026 10:15:20 +0100
Subject: [PATCH] feat(app): add login button to info modal (#755)

Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
---
 app/src/ModalContent.tsx          | 66 ++++++++++++++++++++++---------
 lib/src/Components/Auth/index.tsx |  2 +-
 2 files changed, 48 insertions(+), 20 deletions(-)

diff --git a/app/src/ModalContent.tsx b/app/src/ModalContent.tsx
index c79a850b..1c3b957f 100644
--- a/app/src/ModalContent.tsx
+++ b/app/src/ModalContent.tsx
@@ -5,7 +5,8 @@
 /* eslint-disable @typescript-eslint/prefer-nullish-coalescing */
 
 import { useEffect, useState } from 'react'
-import { TextView } from 'utopia-ui'
+import { useNavigate } from 'react-router-dom'
+import { TextView, useAuth } from 'utopia-ui'
 
 import { config } from './config'
 
@@ -15,20 +16,35 @@ interface ChapterProps {
 }
 
 export function Welcome1({ clickAction1, map }: ChapterProps) {
+  const { isAuthenticated } = useAuth()
+  const navigate = useNavigate()
+
   return (
     <>
       {map.custom_text ? (
         <>
           <TextView rawText={map.custom_text}></TextView>
-          <div className='tw:grid'>
-            <label
-              className='tw:btn tw:btn-primary tw:place-self-end tw:mt-4'
-              onClick={() => {
-                clickAction1()
-              }}
-            >
-              Close
-            </label>
+          <div className='tw:grid tw:mt-4'>
+            {isAuthenticated ? (
+              <label
+                className='tw:btn tw:btn-primary tw:place-self-end'
+                onClick={() => {
+                  clickAction1()
+                }}
+              >
+                Close
+              </label>
+            ) : (
+              <label
+                className='tw:btn tw:btn-primary tw:place-self-end'
+                onClick={() => {
+                  clickAction1()
+                  void navigate('/login')
+                }}
+              >
+                Login
+              </label>
+            )}
           </div>
         </>
       ) : (
@@ -45,15 +61,27 @@ export function Welcome1({ clickAction1, map }: ChapterProps) {
             Join us and grow the network by adding projects and events to the map.
           </p>
           <p className='tw:py-1'>Create your personal profile and place it on the map.</p>
-          <div className='tw:grid'>
-            <label
-              className='tw:btn tw:btn-primary tw:place-self-end tw:mt-4'
-              onClick={() => {
-                clickAction1()
-              }}
-            >
-              Close
-            </label>
+          <div className='tw:grid tw:mt-4'>
+            {isAuthenticated ? (
+              <label
+                className='tw:btn tw:btn-primary tw:place-self-end'
+                onClick={() => {
+                  clickAction1()
+                }}
+              >
+                Close
+              </label>
+            ) : (
+              <label
+                className='tw:btn tw:btn-primary tw:place-self-end'
+                onClick={() => {
+                  clickAction1()
+                  void navigate('/login')
+                }}
+              >
+                Login
+              </label>
+            )}
           </div>
         </>
       )}
diff --git a/lib/src/Components/Auth/index.tsx b/lib/src/Components/Auth/index.tsx
index d1029e26..8d78b834 100644
--- a/lib/src/Components/Auth/index.tsx
+++ b/lib/src/Components/Auth/index.tsx
@@ -1,4 +1,4 @@
-export { AuthProvider } from './useAuth'
+export { AuthProvider, useAuth } from './useAuth'
 export { LoginPage } from './LoginPage'
 export { SignupPage } from './SignupPage'
 export { RequestPasswordPage } from './RequestPasswordPage'