Auth added and UI improvements

src/AppContainer.tsx

@@ -1,14 +1,25 @@
 import type { Component } from 'solid-js';
-import { A } from '@solidjs/router';
+import { A, useLocation, useNavigate } from '@solidjs/router';
+import { Show } from 'solid-js';
+import { authStore } from './store/authStore';
 
 interface AppContainerProps {
     children?: any;
 }
 
 const AppContainer: Component<AppContainerProps> = (props) => {
+    const location = useLocation();
+    const navigate = useNavigate();
+
+    const handleLogout = () => {
+        authStore.logout();
+        navigate('/login');
+    };
+
     return (
         <div class="min-h-screen bg-gray-50/50">
             {/* Top Navigation Bar */}
+            <Show when={location.pathname !== '/login'}>
             <header class="bg-white border-b border-gray-200 sticky top-0 z-10 no-print">
                 <div class="max-w-[1800px] w-full mx-auto px-4 sm:px-6 lg:px-8">
                     <div class="flex justify-between h-16">
@@ -41,9 +52,18 @@ const AppContainer: Component<AppContainerProps> = (props) => {
                                 </A>
                             </nav>
                         </div>
+                        <div class="flex items-center gap-4">
+                            <button
+                                onClick={handleLogout}
+                                class="inline-flex items-center px-3 py-2 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 shadow-sm transition-colors"
+                            >
+                                Sign out
+                            </button>
+                        </div>
                     </div>
                 </div>
             </header>
+            </Show>
 
             {/* Main Content Area */}
             <main class="max-w-[1800px] w-full mx-auto p-4 sm:p-6 lg:p-8">