Add user icon field and update version number

src/lib/components/UserAvatar.svelte

@@ -2,7 +2,14 @@
   import { enhance } from "$app/forms";
   import { goto } from "$app/navigation";
   export let user: any;
-  let firstLetter = user.first_name.charAt(0);
+
+  let icon: string = "";
+
+  if (user.icon != null && user.icon != "") {
+    icon = user.icon;
+  } else {
+    icon = user.username.charAt(0);
+  }
 
   async function navToSettings() {
     goto("/settings");
@@ -15,7 +22,7 @@
 <div class="dropdown dropdown-bottom dropdown-end" tabindex="0" role="button">
   <div class="avatar placeholder">
     <div class="bg-neutral text-neutral-content rounded-full w-10 ml-4">
-      <span class="text-2xl -mt-0.5">{firstLetter}</span>
+      <span class="text-2xl -mt-0.5">{icon}</span>
     </div>
   </div>
   <!-- svelte-ignore a11y-missing-attribute -->
@@ -26,6 +33,7 @@
   >
     <!-- svelte-ignore a11y-missing-attribute -->
     <!-- svelte-ignore a11y-missing-attribute -->
+    <p class="text-lg ml-4 font-bold">Hi, {user.first_name} {user.last_name}</p>
     <li><a>Profile</a></li>
     <li><button on:click={navToLog}>My Log</button></li>
     <li><button on:click={navToSettings}>Settings</button></li>

src/lib/db/schema.ts

@@ -23,6 +23,7 @@ export const userTable = pgTable("user", {
   username: text("username").notNull(),
   first_name: text("first_name").notNull(),
   last_name: text("last_name").notNull(),
+  icon: text("icon"),
   hashed_password: varchar("hashed_password").notNull(),
 });
 

src/lib/server/auth.ts

@@ -19,6 +19,7 @@ export const lucia = new Lucia(adapter, {
       id: attributes.id,
       first_name: attributes.first_name,
       last_name: attributes.last_name,
+      icon: attributes.icon,
     };
   },
 });
@@ -35,5 +36,6 @@ export interface DatabaseUser {
   username: string;
   first_name: string;
   last_name: string;
+  icon: string;
   hashed_password: string;
 }