Frontend working. Added form vendor profilke

src/routes/(app)/+layout.svelte

@@ -1,6 +1,41 @@
 <script lang="ts">
   import { onMount } from "svelte";
+  import { writable } from "svelte/store";
+  import type { Writable } from 'svelte/store';
   import '../../app.postcss'; // Import Tailwind CSS
+  import { user } from '$lib/states';
+
+  // Define the type for the user store
+  interface User {
+    username: string;
+  }
+
+  // Placeholder for user store - in a real app, this would be managed by an auth library or context
+  let storedUser: User | null = null;
+
+  // Check for user session on mount (this is a placeholder, actual implementation may vary)
+  onMount(() => {
+    const storedUserString = localStorage.getItem('user');
+    if (storedUserString) {
+      storedUser = JSON.parse(storedUserString);
+      user.set(storedUser);
+    }
+  });
+
+  user.subscribe((newUser) => {
+    if (newUser) {
+      storedUser = newUser;
+    } else {
+      storedUser = null;
+    }
+  });
+
+  // Logout function
+  const logout = () => {
+    user.set(null);
+    localStorage.removeItem('user');
+    window.location.href = '/';
+  };
 </script>
 
 <div class="min-h-screen bg-white flex flex-col">
@@ -8,6 +43,21 @@
         <div class="flex-1">
             <a href="/" class="btn btn-ghost normal-case text-xl">Heating Price Hero</a>
         </div>
+        <div class="flex-none">
+            {#if $user}
+                <div class="dropdown dropdown-end">
+                    <button type="button" class="btn btn-ghost normal-case text-lg">
+                        {$user.username}
+                    </button>
+                    <ul class="dropdown-content menu p-2 shadow bg-base-100 rounded-box w-52">
+                        <li><a href="/vendor">Dashboard</a></li>
+                        <li><button type="button" on:click={logout}>Logout</button></li>
+                    </ul>
+                </div>
+            {:else}
+                <a href="/login" class="btn btn-ghost normal-case text-lg">Dealer Login</a>
+            {/if}
+        </div>
     </header>
 
     <main class="flex-grow container mx-auto p-4">