feat: complete in-game commands, GUIs, admin panel fixes, and launcher enhancements

launcher/src/pages/Stats.svelte

@@ -2,14 +2,23 @@
   import {
     Trophy, Swords, Skull, Pickaxe, Clock, Box, MessageSquare, LogIn,
     RefreshCw, LoaderCircle, Users, Server, Flame, Sparkles, ChevronDown, Check,
+    Coins, DollarSign, Wallet, ArrowUpRight, ArrowDownLeft, TrendingUp, History,
   } from '@lucide/svelte';
   import Avatar from '../components/Avatar.svelte';
   import { activeAccount, app, toast } from '../lib/store.svelte';
   import { invoke } from '../lib/tauri';
+  import type { ServerEconomyBalance, BaltopEntry, EconomyTransaction } from '../lib/types';
 
-  let activeTab = $state<'personal' | 'leaderboard'>('personal');
+  let activeTab = $state<'personal' | 'economy' | 'leaderboard'>('personal');
   let loadingPersonal = $state(false);
   let loadingLeaderboard = $state(false);
+  let loadingEconomy = $state(false);
+
+  // Economy state
+  let economyBalances = $state<ServerEconomyBalance[]>([]);
+  let selectedEconomyServerId = $state<number | null>(null);
+  let baltopData = $state<BaltopEntry[]>([]);
+  let transactions = $state<EconomyTransaction[]>([]);
 
   // Personal stats data
   let personalData = $state<{
@@ -142,11 +151,47 @@
     }
   }
 
+  async function loadEconomy() {
+    loadingEconomy = true;
+    try {
+      const [balances, txs] = await Promise.all([
+        invoke<ServerEconomyBalance[]>('get_economy_balances').catch(() => []),
+        invoke<EconomyTransaction[]>('get_transactions').catch(() => []),
+      ]);
+      economyBalances = balances;
+      transactions = txs;
+      if (!selectedEconomyServerId && balances.length > 0) {
+        selectedEconomyServerId = balances[0].server_id;
+      }
+      if (selectedEconomyServerId) {
+        await loadBaltop(selectedEconomyServerId);
+      }
+    } catch (e: any) {
+      toast(e?.message ?? 'Failed to load economy data', 'error');
+    } finally {
+      loadingEconomy = false;
+    }
+  }
+
+  async function loadBaltop(serverId: number) {
+    try {
+      baltopData = await invoke<BaltopEntry[]>('get_server_baltop', { serverId });
+    } catch (e) {
+      baltopData = [];
+    }
+  }
+
+  function handleEconomyServerChange(serverId: number) {
+    selectedEconomyServerId = serverId;
+    loadBaltop(serverId);
+  }
+
   $effect(() => {
     if (app.view === 'stats') {
       loadPersonalStats();
       loadServers();
       loadLeaderboard();
+      loadEconomy();
     }
   });
 
@@ -178,6 +223,9 @@
       <button class:active={activeTab === 'personal'} onclick={() => (activeTab = 'personal')}>
         My Stats
       </button>
+      <button class:active={activeTab === 'economy'} onclick={() => { activeTab = 'economy'; loadEconomy(); }}>
+        <Coins size={14} /> Server Economy
+      </button>
       <button class:active={activeTab === 'leaderboard'} onclick={() => (activeTab = 'leaderboard')}>
         Leaderboards
       </button>
@@ -333,6 +381,149 @@
           </div>
         {/if}
       {/if}
+    {:else if activeTab === 'economy'}
+      <!-- Economy & Balances Tab -->
+      <div class="economy-view">
+        {#if loadingEconomy && !economyBalances.length}
+          <div class="center-state"><LoaderCircle size={28} class="spin" /></div>
+        {:else if !me || me.kind === 'offline'}
+          <div class="card glass empty-state">
+            <Coins size={36} class="muted" />
+            <h3>Server account required</h3>
+            <p class="muted small">In-game economy balances and transactions are synced to your SCOPENET server account.</p>
+            <button class="sm primary" onclick={() => (app.addAccount = true)}>Sign in with Server Account</button>
+          </div>
+        {:else}
+          <!-- Balances Section -->
+          <div class="section-card card glass">
+            <div class="row justify-between align-center">
+              <div>
+                <strong class="section-title">My Server Balances</strong>
+                <p class="muted tiny">Synced in real-time from SCOPENET economy plugins and mods.</p>
+              </div>
+              <button class="ghost sm icon" onclick={loadEconomy} title="Refresh balances">
+                <RefreshCw size={14} class={loadingEconomy ? 'spin' : ''} />
+              </button>
+            </div>
+
+            {#if economyBalances.length === 0}
+              <div class="empty-inline muted tiny">
+                No active currency balances found yet. Join a SCOPENET server to start earning money!
+              </div>
+            {:else}
+              <div class="econ-balances-grid">
+                {#each economyBalances as bal (bal.server_id)}
+                  <div
+                    class="econ-balance-card glass"
+                    class:selected={selectedEconomyServerId === bal.server_id}
+                    onclick={() => handleEconomyServerChange(bal.server_id)}
+                  >
+                    <div class="econ-card-top row justify-between align-center">
+                      <span class="server-badge">{bal.server_name}</span>
+                      <Wallet size={16} class="icon-accent" />
+                    </div>
+                    <div class="econ-balance-val">
+                      <span class="currency-sym">{bal.currency_symbol || '$'}</span>
+                      <span>{bal.balance.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}</span>
+                    </div>
+                    <div class="econ-card-footer tiny muted">
+                      Updated {formatDate(bal.last_updated)}
+                    </div>
+                  </div>
+                {/each}
+              </div>
+            {/if}
+          </div>
+
+          <!-- Server Baltop Leaderboard Section -->
+          <div class="section-card card glass">
+            <div class="row justify-between align-center">
+              <div>
+                <strong class="section-title">Server Rich List (Baltop)</strong>
+                <p class="muted tiny">Top richest players on the selected game server.</p>
+              </div>
+
+              {#if servers.length > 0}
+                <div class="row align-center gap-xs">
+                  <span class="tiny muted">Server:</span>
+                  <select
+                    class="filter-select"
+                    value={selectedEconomyServerId}
+                    onchange={(e) => handleEconomyServerChange(Number(e.currentTarget.value))}
+                  >
+                    {#each servers as s (s.id)}
+                      <option value={s.id}>{s.name}</option>
+                    {/each}
+                  </select>
+                </div>
+              {/if}
+            </div>
+
+            {#if baltopData.length === 0}
+              <div class="empty-inline muted tiny">
+                No baltop entries recorded for this server yet.
+              </div>
+            {:else}
+              <div class="baltop-list">
+                {#each baltopData as row}
+                  {@const isMe = row.uuid === me?.uuid}
+                  <div class="baltop-row" class:is-me={isMe}>
+                    <div class="row align-center gap-sm">
+                      <span class="baltop-rank" class:gold={row.rank === 1} class:silver={row.rank === 2} class:bronze={row.rank === 3}>
+                        #{row.rank}
+                      </span>
+                      <Avatar uuid={row.uuid} name={row.username} size={2.2} />
+                      <strong class="baltop-name">{row.username}</strong>
+                      {#if isMe}<span class="badge you">You</span>{/if}
+                    </div>
+                    <span class="baltop-val highlight">
+                      ${row.balance.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}
+                    </span>
+                  </div>
+                {/each}
+              </div>
+            {/if}
+          </div>
+
+          <!-- Transaction History Section -->
+          <div class="section-card card glass">
+            <div class="row justify-between align-center">
+              <div>
+                <strong class="section-title">Recent Transactions</strong>
+                <p class="muted tiny">Payments, player trades, market listings, and server shop logs.</p>
+              </div>
+            </div>
+
+            {#if transactions.length === 0}
+              <div class="empty-inline muted tiny">
+                No recorded economy transactions yet.
+              </div>
+            {:else}
+              <div class="tx-table-wrap">
+                <div class="tx-header">
+                  <span>Type</span>
+                  <span>Description</span>
+                  <span>Date</span>
+                  <span class="text-right">Amount</span>
+                </div>
+                {#each transactions.slice(0, 15) as tx (tx.id)}
+                  {@const isSender = tx.sender_uuid === me?.uuid}
+                  <div class="tx-row">
+                    <span class="tx-type-pill badge" class:send={isSender} class:receive={!isSender}>
+                      {#if isSender}<ArrowUpRight size={12} /> Sent{:else}<ArrowDownLeft size={12} /> Received{/if}
+                    </span>
+                    <span class="tx-desc" title={tx.description}>{tx.description || tx.tx_type}</span>
+                    <span class="tx-date tiny muted">{new Date(tx.created_at).toLocaleString()}</span>
+                    <span class="tx-amount text-right" class:negative={isSender} class:positive={!isSender}>
+                      {isSender ? '-' : '+'}${Math.abs(tx.amount).toFixed(2)}
+                    </span>
+                  </div>
+                {/each}
+              </div>
+            {/if}
+          </div>
+        {/if}
+      </div>
     {:else}
       <!-- Leaderboards Tab -->
       <div class="filters-bar card glass row justify-between align-center">
@@ -500,4 +691,32 @@
     .table-header, .table-row { grid-template-columns: 2.5rem 1fr 7rem; }
     .col-extra { display: none; }
   }
+  .economy-view { display: flex; flex-direction: column; gap: 1.2rem; }
+  .section-title { font-size: 1.05rem; font-weight: 700; }
+  .empty-inline { padding: 1.2rem 0; }
+  .econ-balances-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: 1rem; margin-top: 0.5rem; }
+  .econ-balance-card { display: flex; flex-direction: column; gap: 0.6rem; padding: 1.1rem 1.2rem; border-radius: var(--radius-sm); cursor: pointer; transition: transform 0.15s, border-color 0.15s; }
+  .econ-balance-card:hover { transform: translateY(-2px); }
+  .econ-balance-card.selected { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent); }
+  .server-badge { font-size: 0.82rem; font-weight: 700; color: var(--accent); }
+  .econ-balance-val { font-size: 1.6rem; font-weight: 800; display: flex; align-items: baseline; gap: 0.2rem; font-variant-numeric: tabular-nums; }
+  .currency-sym { font-size: 1.1rem; color: var(--muted); }
+  .baltop-list { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.5rem; }
+  .baltop-row { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1rem; border-radius: var(--radius-sm); background: color-mix(in srgb, var(--bg) 50%, transparent); border: 1px solid var(--line); }
+  .baltop-row.is-me { background: color-mix(in srgb, var(--accent) 10%, transparent); border-color: color-mix(in srgb, var(--accent) 30%, transparent); }
+  .baltop-rank { font-weight: 800; font-size: 0.95rem; min-width: 2rem; font-variant-numeric: tabular-nums; }
+  .baltop-rank.gold { color: #f59e0b; }
+  .baltop-rank.silver { color: #94a3b8; }
+  .baltop-rank.bronze { color: #d97706; }
+  .baltop-name { font-size: 0.95rem; }
+  .baltop-val { font-size: 1.05rem; }
+  .tx-table-wrap { display: flex; flex-direction: column; margin-top: 0.5rem; border: 1px solid var(--line); border-radius: var(--radius-sm); overflow: hidden; }
+  .tx-header { display: grid; grid-template-columns: 7rem 1fr 12rem 8rem; padding: 0.65rem 1rem; font-size: 0.78rem; text-transform: uppercase; font-weight: 600; color: var(--muted); border-bottom: 1px solid var(--line); }
+  .tx-row { display: grid; grid-template-columns: 7rem 1fr 12rem 8rem; align-items: center; padding: 0.7rem 1rem; border-bottom: 1px solid color-mix(in srgb, var(--line) 40%, transparent); font-size: 0.85rem; }
+  .tx-type-pill.send { background: color-mix(in srgb, var(--danger) 15%, transparent); color: var(--danger); }
+  .tx-type-pill.receive { background: color-mix(in srgb, var(--success) 15%, transparent); color: var(--success); }
+  .tx-desc { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+  .tx-amount { font-weight: 700; font-variant-numeric: tabular-nums; }
+  .tx-amount.negative { color: var(--danger); }
+  .tx-amount.positive { color: var(--success); }
 </style>