feat: add more profile stats and auto-populate edit modal

Exposes four new stats on public profiles (bosses defeated, quests
completed, adventurers recruited, achievements unlocked) with
corresponding visibility toggles. The edit modal now auto-populates
the character name, bio, and settings from the server on open.

apps/api/src/routes/profile.ts

@@ -3,25 +3,25 @@ import type {
   ProfileSettings,
   UpdateProfileRequest,
 } from "@elysium/types";
+import { DEFAULT_PROFILE_SETTINGS } from "@elysium/types";
 import { Hono } from "hono";
 import { prisma } from "../db/client.js";
-import { DEFAULT_PROFILE_SETTINGS } from "@elysium/types";
 import { authMiddleware } from "../middleware/auth.js";
 
 export const profileRouter = new Hono();
 
 const parseProfileSettings = (raw: unknown): ProfileSettings => {
-  if (
-    raw !== null &&
-    typeof raw === "object" &&
-    !Array.isArray(raw)
-  ) {
+  if (raw !== null && typeof raw === "object" && !Array.isArray(raw)) {
     const obj = raw as Record<string, unknown>;
     return {
       showTotalGold: obj.showTotalGold !== false,
       showTotalClicks: obj.showTotalClicks !== false,
       showPrestige: obj.showPrestige !== false,
       showGuildFounded: obj.showGuildFounded !== false,
+      showBossesDefeated: obj.showBossesDefeated !== false,
+      showQuestsCompleted: obj.showQuestsCompleted !== false,
+      showAdventurersRecruited: obj.showAdventurersRecruited !== false,
+      showAchievementsUnlocked: obj.showAchievementsUnlocked !== false,
     };
   }
   return { ...DEFAULT_PROFILE_SETTINGS };
@@ -43,6 +43,13 @@ profileRouter.get("/:discordId", async (context) => {
   const prestigeCount = state?.prestige.count ?? 0;
   const profileSettings = parseProfileSettings(player.profileSettings);
 
+  const bossesDefeated = state?.bosses.filter((b) => b.status === "defeated").length ?? 0;
+  const questsCompleted = state?.quests.filter((q) => q.status === "completed").length ?? 0;
+  const adventurersRecruited =
+    state?.adventurers.reduce((sum, a) => sum + a.count, 0) ?? 0;
+  const achievementsUnlocked =
+    (state?.achievements ?? []).filter((a) => a.unlockedAt !== null).length;
+
   return context.json({
     characterName: player.characterName,
     username: player.username,
@@ -52,6 +59,10 @@ profileRouter.get("/:discordId", async (context) => {
     prestigeCount,
     totalGoldEarned: player.totalGoldEarned,
     totalClicks: player.totalClicks,
+    bossesDefeated,
+    questsCompleted,
+    adventurersRecruited,
+    achievementsUnlocked,
     createdAt: player.createdAt,
   });
 });
@@ -67,6 +78,10 @@ profileRouter.put("/", authMiddleware, async (context) => {
     showTotalClicks: body.profileSettings?.showTotalClicks !== false,
     showPrestige: body.profileSettings?.showPrestige !== false,
     showGuildFounded: body.profileSettings?.showGuildFounded !== false,
+    showBossesDefeated: body.profileSettings?.showBossesDefeated !== false,
+    showQuestsCompleted: body.profileSettings?.showQuestsCompleted !== false,
+    showAdventurersRecruited: body.profileSettings?.showAdventurersRecruited !== false,
+    showAchievementsUnlocked: body.profileSettings?.showAchievementsUnlocked !== false,
   };
 
   if (!characterName) {
@@ -75,7 +90,7 @@ profileRouter.put("/", authMiddleware, async (context) => {
 
   const updated = await prisma.player.update({
     where: { discordId },
-    data: { characterName, bio, profileSettings },
+    data: { characterName, bio, profileSettings: profileSettings as object },
   });
 
   return context.json({

apps/web/src/components/game/EditProfileModal.tsx

@@ -1,5 +1,6 @@
 import type { ProfileSettings } from "@elysium/types";
-import { useState } from "react";
+import { DEFAULT_PROFILE_SETTINGS } from "@elysium/types";
+import { useEffect, useState } from "react";
 import { updateProfile } from "../../api/client.js";
 import { useGame } from "../../context/GameContext.js";
 
@@ -11,6 +12,10 @@ const STAT_TOGGLES: { key: keyof ProfileSettings; label: string; icon: string }[
   { key: "showTotalGold", label: "Total Gold Earned", icon: "🪙" },
   { key: "showTotalClicks", label: "Total Clicks", icon: "👆" },
   { key: "showPrestige", label: "Prestige Level", icon: "⭐" },
+  { key: "showBossesDefeated", label: "Bosses Defeated", icon: "💀" },
+  { key: "showQuestsCompleted", label: "Quests Completed", icon: "📜" },
+  { key: "showAdventurersRecruited", label: "Adventurers Recruited", icon: "⚔️" },
+  { key: "showAchievementsUnlocked", label: "Achievements Unlocked", icon: "🏆" },
   { key: "showGuildFounded", label: "Guild Founded Date", icon: "📅" },
 ];
 
@@ -20,16 +25,35 @@ export const EditProfileModal = ({ onClose }: EditProfileModalProps): React.JSX.
 
   const [characterName, setCharacterName] = useState(player?.characterName ?? "");
   const [bio, setBio] = useState("");
-  const [settings, setSettings] = useState<ProfileSettings>({
-    showTotalGold: true,
-    showTotalClicks: true,
-    showPrestige: true,
-    showGuildFounded: true,
-  });
+  const [settings, setSettings] = useState<ProfileSettings>({ ...DEFAULT_PROFILE_SETTINGS });
+  const [loadingProfile, setLoadingProfile] = useState(true);
   const [saving, setSaving] = useState(false);
   const [error, setError] = useState<string | null>(null);
   const [saved, setSaved] = useState(false);
 
+  // Fetch current profile to auto-populate bio and settings
+  useEffect(() => {
+    if (!player?.discordId) return;
+    fetch(`/api/profile/${player.discordId}`)
+      .then(async (res) => {
+        if (!res.ok) return;
+        const data = (await res.json()) as {
+          bio: string;
+          profileSettings: ProfileSettings;
+          characterName: string;
+        };
+        setBio(data.bio ?? "");
+        setSettings({ ...DEFAULT_PROFILE_SETTINGS, ...data.profileSettings });
+        setCharacterName(data.characterName ?? player.characterName ?? "");
+      })
+      .catch(() => {
+        // Fall back to local state if fetch fails — not a blocking error
+      })
+      .finally(() => {
+        setLoadingProfile(false);
+      });
+  }, [player?.discordId, player?.characterName]);
+
   const handleSave = async (): Promise<void> => {
     setSaving(true);
     setError(null);
@@ -63,75 +87,79 @@ export const EditProfileModal = ({ onClose }: EditProfileModalProps): React.JSX.
           </button>
         </div>
 
-        <div className="edit-profile-form">
-          <label className="edit-profile-label" htmlFor="edit-char-name">
-            Display Name
-          </label>
-          <input
-            className="edit-profile-input"
-            id="edit-char-name"
-            maxLength={32}
-            placeholder="Your character's name"
-            type="text"
-            value={characterName}
-            onChange={(e) => { setCharacterName(e.target.value); }}
-          />
-          <span className="edit-profile-hint">{characterName.length} / 32</span>
+        {loadingProfile ? (
+          <p className="edit-profile-loading">Loading your profile…</p>
+        ) : (
+          <div className="edit-profile-form">
+            <label className="edit-profile-label" htmlFor="edit-char-name">
+              Display Name
+            </label>
+            <input
+              className="edit-profile-input"
+              id="edit-char-name"
+              maxLength={32}
+              placeholder="Your character's name"
+              type="text"
+              value={characterName}
+              onChange={(e) => { setCharacterName(e.target.value); }}
+            />
+            <span className="edit-profile-hint">{characterName.length} / 32</span>
 
-          <label className="edit-profile-label" htmlFor="edit-bio">
-            Bio
-          </label>
-          <textarea
-            className="edit-profile-textarea"
-            id="edit-bio"
-            maxLength={200}
-            placeholder="Tell the world about your guild… (optional)"
-            rows={3}
-            value={bio}
-            onChange={(e) => { setBio(e.target.value); }}
-          />
-          <span className="edit-profile-hint">{bio.length} / 200</span>
+            <label className="edit-profile-label" htmlFor="edit-bio">
+              Bio
+            </label>
+            <textarea
+              className="edit-profile-textarea"
+              id="edit-bio"
+              maxLength={200}
+              placeholder="Tell the world about your guild… (optional)"
+              rows={3}
+              value={bio}
+              onChange={(e) => { setBio(e.target.value); }}
+            />
+            <span className="edit-profile-hint">{bio.length} / 200</span>
 
-          <div className="edit-profile-section">
-            <p className="edit-profile-label">Visible Stats</p>
-            <p className="edit-profile-sublabel">Choose which stats appear on your public profile.</p>
-            <div className="stat-toggles">
-              {STAT_TOGGLES.map(({ key, label, icon }) => (
-                <button
-                  key={key}
-                  className={`stat-toggle-btn ${settings[key] ? "stat-toggle-on" : "stat-toggle-off"}`}
-                  onClick={() => { toggleSetting(key); }}
-                  type="button"
-                >
-                  <span>{icon} {label}</span>
-                  <span className="stat-toggle-indicator">
-                    {settings[key] ? "✓ Shown" : "Hidden"}
-                  </span>
-                </button>
-              ))}
+            <div className="edit-profile-section">
+              <p className="edit-profile-label">Visible Stats</p>
+              <p className="edit-profile-sublabel">Choose which stats appear on your public profile.</p>
+              <div className="stat-toggles">
+                {STAT_TOGGLES.map(({ key, label, icon }) => (
+                  <button
+                    key={key}
+                    className={`stat-toggle-btn ${settings[key] ? "stat-toggle-on" : "stat-toggle-off"}`}
+                    onClick={() => { toggleSetting(key); }}
+                    type="button"
+                  >
+                    <span>{icon} {label}</span>
+                    <span className="stat-toggle-indicator">
+                      {settings[key] ? "✓ Shown" : "Hidden"}
+                    </span>
+                  </button>
+                ))}
+              </div>
+            </div>
+
+            {error && <p className="edit-profile-error">{error}</p>}
+
+            <div className="edit-profile-actions">
+              <button
+                className="edit-profile-cancel"
+                onClick={onClose}
+                type="button"
+              >
+                Cancel
+              </button>
+              <button
+                className="edit-profile-save"
+                disabled={saving || !characterName.trim()}
+                onClick={() => { void handleSave(); }}
+                type="button"
+              >
+                {saved ? "✓ Saved!" : saving ? "Saving…" : "Save Profile"}
+              </button>
             </div>
           </div>
-
-          {error && <p className="edit-profile-error">{error}</p>}
-
-          <div className="edit-profile-actions">
-            <button
-              className="edit-profile-cancel"
-              onClick={onClose}
-              type="button"
-            >
-              Cancel
-            </button>
-            <button
-              className="edit-profile-save"
-              disabled={saving || !characterName.trim()}
-              onClick={() => { void handleSave(); }}
-              type="button"
-            >
-              {saved ? "✓ Saved!" : saving ? "Saving…" : "Save Profile"}
-            </button>
-          </div>
-        </div>
+        )}
       </div>
     </div>
   );

apps/web/src/components/game/ProfilePage.tsx

@@ -74,6 +74,30 @@ export const ProfilePage = ({ discordId }: ProfilePageProps): React.JSX.Element
       label: "Total Clicks",
       date: false,
     },
+    s.showBossesDefeated && {
+      icon: "💀",
+      value: String(profile.bossesDefeated),
+      label: "Bosses Defeated",
+      date: false,
+    },
+    s.showQuestsCompleted && {
+      icon: "📜",
+      value: String(profile.questsCompleted),
+      label: "Quests Completed",
+      date: false,
+    },
+    s.showAdventurersRecruited && {
+      icon: "⚔️",
+      value: formatNumber(profile.adventurersRecruited),
+      label: "Adventurers Recruited",
+      date: false,
+    },
+    s.showAchievementsUnlocked && {
+      icon: "🏆",
+      value: String(profile.achievementsUnlocked),
+      label: "Achievements Unlocked",
+      date: false,
+    },
     s.showGuildFounded && {
       icon: "📅",
       value: memberSince,

packages/types/src/interfaces/Api.ts

@@ -75,6 +75,10 @@ export interface PublicProfileResponse {
   prestigeCount: number;
   totalGoldEarned: number;
   totalClicks: number;
+  bossesDefeated: number;
+  questsCompleted: number;
+  adventurersRecruited: number;
+  achievementsUnlocked: number;
   createdAt: number;
 }
 

packages/types/src/interfaces/ProfileSettings.ts

@@ -3,6 +3,10 @@ export interface ProfileSettings {
   showTotalClicks: boolean;
   showPrestige: boolean;
   showGuildFounded: boolean;
+  showBossesDefeated: boolean;
+  showQuestsCompleted: boolean;
+  showAdventurersRecruited: boolean;
+  showAchievementsUnlocked: boolean;
 }
 
 export const DEFAULT_PROFILE_SETTINGS: ProfileSettings = {
@@ -10,4 +14,8 @@ export const DEFAULT_PROFILE_SETTINGS: ProfileSettings = {
   showTotalClicks: true,
   showPrestige: true,
   showGuildFounded: true,
+  showBossesDefeated: true,
+  showQuestsCompleted: true,
+  showAdventurersRecruited: true,
+  showAchievementsUnlocked: true,
 };