-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
48210e4
commit a2e3e21
Showing
5 changed files
with
216 additions
and
202 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,43 +1,48 @@ | ||
import { BrowserRouter } from 'react-router-dom'; | ||
import { useEffect } from 'react'; | ||
import AppRoutes from './routes/AppRoutes'; | ||
import { Footer } from '@/components/Footer/Footer'; | ||
import NavBar from './components/NavBar/NavBar'; | ||
import { supabase } from './lib/supabaseClient'; | ||
import { AuthChangeEvent, Session } from '@supabase/supabase-js'; | ||
import { BrowserRouter } from 'react-router-dom' | ||
import { useEffect } from 'react' | ||
import AppRoutes from './routes/AppRoutes' | ||
import { Footer } from '@/components/Footer/Footer' | ||
import NavBar from './components/NavBar/NavBar' | ||
import { supabase } from './lib/supabaseClient' | ||
import { AuthChangeEvent, Session } from '@supabase/supabase-js' | ||
import { AuthProvider } from './AuthContext'; | ||
|
||
function App() { | ||
useEffect(() => { | ||
const { data: authListener } = supabase.auth.onAuthStateChange( | ||
(event: AuthChangeEvent, session: Session | null) => { | ||
if (event === 'SIGNED_IN') { | ||
// Handle sign in | ||
console.log('User signed in:', session?.user) | ||
// You might want to update your app state or context here | ||
} else if (event === 'SIGNED_OUT') { | ||
// Handle sign out | ||
console.log('User signed out') | ||
// You might want to clear user data from your app state or context here | ||
} | ||
} | ||
) | ||
|
||
return () => { | ||
authListener.subscription.unsubscribe() | ||
} | ||
}, []) | ||
|
||
useEffect(() => { | ||
const { data: authListener } = supabase.auth.onAuthStateChange((event: AuthChangeEvent, session: Session | null) => { | ||
if (event === 'SIGNED_IN') { | ||
// Handle sign in | ||
console.log('User signed in:', session?.user); | ||
// You might want to update your app state or context here | ||
} else if (event === 'SIGNED_OUT') { | ||
// Handle sign out | ||
console.log('User signed out'); | ||
// You might want to clear user data from your app state or context here | ||
} | ||
}); | ||
|
||
return () => { | ||
authListener.subscription.unsubscribe(); | ||
}; | ||
}, []); | ||
|
||
return ( | ||
<> | ||
<BrowserRouter> | ||
<div className='grid min-h-[100dvh] grid-rows-[auto_1fr_auto]'> | ||
<NavBar /> | ||
<AppRoutes /> | ||
<Footer></Footer> | ||
</div> | ||
</BrowserRouter> | ||
</> | ||
); | ||
return ( | ||
<> | ||
<AuthProvider> | ||
{' '} | ||
{/* Wrap the entire app with AuthProvider */} | ||
<BrowserRouter> | ||
<div className='grid min-h-[100dvh] grid-rows-[auto_1fr_auto]'> | ||
<NavBar /> | ||
<AppRoutes /> | ||
<Footer></Footer> | ||
</div> | ||
</BrowserRouter> | ||
</AuthProvider> | ||
</> | ||
) | ||
} | ||
|
||
export default App; | ||
export default App |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,50 +1,40 @@ | ||
import { Link } from 'react-router-dom'; | ||
import { useState, useEffect } from 'react'; // Added useEffect | ||
import { useMediaQuery } from 'react-responsive'; | ||
import NavItems from './NavItems'; | ||
import MobileNavItems from './MobileNavItems'; | ||
import { Button } from '../ui/button'; | ||
import { Sheet, SheetContent, SheetTrigger } from '@/components/ui/sheet'; | ||
import { FaBars } from 'react-icons/fa6'; | ||
import { getCurrentUser } from '@/lib/auth'; | ||
import { useAuth } from '@/AuthContext'; // Import useAuth | ||
|
||
function NavBar() { | ||
const isMobile = useMediaQuery({ maxWidth: 768 }); | ||
const [isLoggedIn, setIsLoggedIn] = useState(false); | ||
const isMobile = useMediaQuery({ maxWidth: 768 }); | ||
const { isLoggedIn } = useAuth(); // Use the isLoggedIn state from AuthContext | ||
|
||
// useEffect check user's login status on component mount | ||
useEffect(() => { | ||
const checkLoginStatus = async () => { | ||
const user = await getCurrentUser(); | ||
setIsLoggedIn(!!user); | ||
}; | ||
checkLoginStatus(); | ||
}, []); | ||
|
||
return ( | ||
<header className='w-full flex items-center justify-between p-4 sticky top-0 bg-white z-10 shadow-md'> | ||
<Link to='/' className='shrink-0'> | ||
<img src='./logo.png' className='size-20' alt='Nisa Invest' /> | ||
</Link> | ||
{isMobile ? ( | ||
<Sheet> | ||
<SheetTrigger asChild> | ||
<Button variant='outline' size='icon'> | ||
<FaBars className='h-6 w-6' /> | ||
</Button> | ||
</SheetTrigger> | ||
<SheetContent side='right'> | ||
<MobileNavItems | ||
classNameValue={'flex-col gap-2'} | ||
isLoggedIn={isLoggedIn} | ||
/> | ||
</SheetContent> | ||
</Sheet> | ||
) : ( | ||
<NavItems classNameValue='' isLoggedIn={isLoggedIn} /> | ||
)} | ||
</header> | ||
); | ||
return ( | ||
<header className='w-full flex items-center justify-between p-4 sticky top-0 bg-white z-10 shadow-md'> | ||
<Link to='/' className='shrink-0'> | ||
<img src='./logo.png' className='size-20' alt='Nisa Invest' /> | ||
</Link> | ||
{isMobile ? ( | ||
<Sheet> | ||
<SheetTrigger asChild> | ||
<Button variant='outline' size='icon'> | ||
<FaBars className='h-6 w-6' /> | ||
</Button> | ||
</SheetTrigger> | ||
<SheetContent side='right'> | ||
<MobileNavItems | ||
classNameValue={'flex-col gap-2'} | ||
isLoggedIn={isLoggedIn} | ||
/> | ||
</SheetContent> | ||
</Sheet> | ||
) : ( | ||
<NavItems classNameValue='' isLoggedIn={isLoggedIn} /> | ||
)} | ||
</header> | ||
); | ||
} | ||
|
||
export default NavBar; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.