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

This commit is contained in:
scoped committed 2026-09-29 12:14:16 -04:00
1 parent a9ff92e1d1
commit 752f0cc43d
34 files changed
+4170 -181

No files matched your search

+67 -11
View File
@@ -7,9 +7,9 @@ use crate::state::{build, AppState};
use crate::updater;
use scopenet_core::ping::ServerStatus;
use scopenet_shared::{
Achievement, DirectMessage, FriendInfo, GameInvite, Guild, GuildClaim, GuildMember, GuildPost,
LauncherManifest, PlayerProfile, SkinProfile, UserLevelInfo, UserPost, UserProfileView,
UserQuest,
Achievement, BaltopEntry, DirectMessage, EconomyTransaction, FriendInfo, GameInvite, Guild,
GuildClaim, GuildMember, GuildPost, LauncherManifest, MemberProfile, PlayerProfile,
ServerEconomyBalance, SkinProfile, UserLevelInfo, UserPost, UserProfileView, UserQuest,
};
use serde::Serialize;
use tauri::{AppHandle, Manager, State};
@@ -550,14 +550,14 @@ pub async fn get_my_quests(state: State<'_, AppState>) -> Res<Vec<UserQuest>> {
}
#[tauri::command]
pub async fn claim_quest(state: State<'_, AppState>, quest_id: String) -> Res<UserQuest> {
pub async fn claim_quest(state: State<'_, AppState>, quest_id: String) -> Res<UserLevelInfo> {
let req = account_api(&state, reqwest::Method::POST, &format!("/quests/{quest_id}/claim")).await?;
let resp = req.send().await.map_err(err)?;
if !resp.status().is_success() {
let body: serde_json::Value = resp.json().await.unwrap_or_default();
return Err(body["error"].as_str().unwrap_or("unable to claim quest").to_string());
}
resp.json().await.map_err(err)
get_my_level(state).await
}
// ---------------------------------------------------------------------------
@@ -738,9 +738,14 @@ pub async fn get_friends(state: State<'_, AppState>) -> Res<Vec<FriendInfo>> {
}
#[tauri::command]
pub async fn send_friend_request(state: State<'_, AppState>, username: String) -> Res<()> {
pub async fn send_friend_request(
state: State<'_, AppState>,
friend_username: Option<String>,
username: Option<String>,
) -> Res<()> {
let target = friend_username.or(username).ok_or("username is required")?;
let req = account_api(&state, reqwest::Method::POST, "/friends/request").await?;
let resp = req.json(&serde_json::json!({ "username": username })).send().await.map_err(err)?;
let resp = req.json(&serde_json::json!({ "username": target })).send().await.map_err(err)?;
if !resp.status().is_success() {
let body: serde_json::Value = resp.json().await.unwrap_or_default();
return Err(body["error"].as_str().unwrap_or("unable to send friend request").to_string());
@@ -749,9 +754,15 @@ pub async fn send_friend_request(state: State<'_, AppState>, username: String) -
}
#[tauri::command]
pub async fn respond_friend_request(state: State<'_, AppState>, target_uuid: String, accept: bool) -> Res<()> {
pub async fn respond_friend_request(
state: State<'_, AppState>,
friend_uuid: Option<String>,
target_uuid: Option<String>,
accept: bool,
) -> Res<()> {
let target = friend_uuid.or(target_uuid).ok_or("target_uuid is required")?;
let req = account_api(&state, reqwest::Method::POST, "/friends/respond").await?;
let resp = req.json(&serde_json::json!({ "target_uuid": target_uuid, "accept": accept })).send().await.map_err(err)?;
let resp = req.json(&serde_json::json!({ "target_uuid": target, "accept": accept })).send().await.map_err(err)?;
if !resp.status().is_success() {
let body: serde_json::Value = resp.json().await.unwrap_or_default();
return Err(body["error"].as_str().unwrap_or("unable to respond to friend request").to_string());
@@ -760,8 +771,13 @@ pub async fn respond_friend_request(state: State<'_, AppState>, target_uuid: Str
}
#[tauri::command]
pub async fn remove_friend(state: State<'_, AppState>, target_uuid: String) -> Res<()> {
let req = account_api(&state, reqwest::Method::DELETE, &format!("/friends/{target_uuid}")).await?;
pub async fn remove_friend(
state: State<'_, AppState>,
friend_uuid: Option<String>,
target_uuid: Option<String>,
) -> Res<()> {
let target = friend_uuid.or(target_uuid).ok_or("target_uuid is required")?;
let req = account_api(&state, reqwest::Method::DELETE, &format!("/friends/{target}")).await?;
let resp = req.send().await.map_err(err)?;
if !resp.status().is_success() {
let body: serde_json::Value = resp.json().await.unwrap_or_default();
@@ -770,6 +786,46 @@ pub async fn remove_friend(state: State<'_, AppState>, target_uuid: String) -> R
Ok(())
}
#[tauri::command]
pub async fn search_members(state: State<'_, AppState>, query: String) -> Res<Vec<MemberProfile>> {
let req = account_api(&state, reqwest::Method::GET, &format!("/social/members?q={query}")).await?;
let resp = req.send().await.map_err(err)?;
if !resp.status().is_success() {
return Err("unable to search members".into());
}
resp.json().await.map_err(err)
}
#[tauri::command]
pub async fn get_economy_balances(state: State<'_, AppState>) -> Res<Vec<ServerEconomyBalance>> {
let req = account_api(&state, reqwest::Method::GET, "/economy/me").await?;
let resp = req.send().await.map_err(err)?;
if !resp.status().is_success() {
return Err("unable to load economy balances".into());
}
resp.json().await.map_err(err)
}
#[tauri::command]
pub async fn get_server_baltop(state: State<'_, AppState>, server_id: i64) -> Res<Vec<BaltopEntry>> {
let req = account_api(&state, reqwest::Method::GET, &format!("/servers/{server_id}/economy/baltop")).await?;
let resp = req.send().await.map_err(err)?;
if !resp.status().is_success() {
return Err("unable to load baltop leaderboard".into());
}
resp.json().await.map_err(err)
}
#[tauri::command]
pub async fn get_transactions(state: State<'_, AppState>) -> Res<Vec<EconomyTransaction>> {
let req = account_api(&state, reqwest::Method::GET, "/economy/transactions").await?;
let resp = req.send().await.map_err(err)?;
if !resp.status().is_success() {
return Err("unable to load transactions".into());
}
resp.json().await.map_err(err)
}
#[tauri::command]
pub async fn get_direct_messages(state: State<'_, AppState>, friend_uuid: String) -> Res<Vec<DirectMessage>> {
let req = account_api(&state, reqwest::Method::GET, &format!("/messages/{friend_uuid}")).await?;
+4
View File
@@ -101,6 +101,10 @@ pub fn run() {
commands::send_friend_request,
commands::respond_friend_request,
commands::remove_friend,
commands::search_members,
commands::get_economy_balances,
commands::get_server_baltop,
commands::get_transactions,
commands::get_direct_messages,
commands::send_direct_message,
commands::get_game_invites,
+42
View File
@@ -156,6 +156,7 @@ export interface UserLevelInfo {
next_level_xp: number;
progress_pct: number;
title: string | null;
rank?: number | null;
badges: string[];
rewards: LevelReward[];
}
@@ -316,3 +317,44 @@ export interface UserProfileView {
created_at: string;
}
export interface MemberProfile {
uuid: string;
username: string;
role: string;
status: string;
skin_url: string | null;
global_level: number;
title: string | null;
playtime_secs: number;
last_seen: string | null;
online: boolean;
is_friend: boolean;
}
export interface ServerEconomyBalance {
server_id: number;
server_name: string;
balance: number;
currency_symbol: string;
last_updated: string;
}
export interface EconomyTransaction {
id: number;
server_id: number;
server_name?: string;
sender_uuid: string;
recipient_uuid: string;
amount: number;
tx_type: string;
description: string;
created_at: string;
}
export interface BaltopEntry {
rank: number;
uuid: string;
username: string;
balance: number;
}
+67 -19
View File
@@ -51,7 +51,8 @@
levelInfo = updatedLevel;
// Mark as claimed locally
userQuests = userQuests.map((uq) => {
if (uq.quest.id === questId) {
const id = uq.quest?.id || (uq as any).id;
if (id === questId) {
return { ...uq, claimed: true };
}
return uq;
@@ -66,18 +67,29 @@
const filteredQuests = $derived(
userQuests.filter((uq) => {
if (uq.quest.quest_type !== activeTab) return false;
if (selectedCategory !== 'all' && uq.quest.category !== selectedCategory) return false;
const q = uq.quest || uq;
const qType = q.quest_type || (q as any).period || 'daily';
if (qType !== activeTab) return false;
const cat = q.category || 'mining';
if (selectedCategory !== 'all' && cat !== selectedCategory) return false;
return true;
})
);
const completedCount = $derived(
userQuests.filter((uq) => uq.quest.quest_type === activeTab && uq.completed).length
userQuests.filter((uq) => {
const q = uq.quest || uq;
const qType = q.quest_type || (q as any).period || 'daily';
return qType === activeTab && uq.completed;
}).length
);
const totalTabQuests = $derived(
userQuests.filter((uq) => uq.quest.quest_type === activeTab).length
userQuests.filter((uq) => {
const q = uq.quest || uq;
const qType = q.quest_type || (q as any).period || 'daily';
return qType === activeTab;
}).length
);
const unlockedAchievementsCount = $derived(
@@ -128,11 +140,19 @@
<span class="lvl-label">LVL</span>
<span class="lvl-number">{levelInfo.level}</span>
</div>
{#if levelInfo.rank}
<div class="rank-badge-pill">
<Trophy size={11} /> #{levelInfo.rank}
</div>
{/if}
</div>
<div class="level-details">
<div class="level-title-row">
<div class="title-meta">
<span class="level-name">SCOPENET Global Level</span>
<span class="level-name">SCOPENET Progression</span>
{#if levelInfo.rank}
<span class="badge rank-title-badge"><Trophy size={12} /> Global Rank #{levelInfo.rank}</span>
{/if}
{#if levelInfo.title}
<span class="badge title-badge"><Award size={12} /> {levelInfo.title}</span>
{/if}
@@ -146,7 +166,11 @@
</div>
<div class="level-footer">
<span class="muted tiny">
Playing on any SCOPENET server earns Global XP. Unlocks exclusive titles, badges, and cosmetic items.
{#if levelInfo.rank}
You are currently ranked #{levelInfo.rank} globally! Earn XP across all servers to climb the leaderboard.
{:else}
Playing on any SCOPENET server earns Global XP. Unlocks exclusive titles, badges, and cosmetic items.
{/if}
</span>
{#if levelInfo.badges && levelInfo.badges.length > 0}
<div class="badges-row">
@@ -242,9 +266,13 @@
</div>
{:else}
<div class="quests-grid">
{#each filteredQuests as uq (uq.quest.id)}
{@const pct = Math.min(100, Math.round((uq.current_count / Math.max(1, uq.quest.target_count)) * 100))}
{@const IconComponent = categoryIcons[uq.quest.category] || Target}
{#each filteredQuests as uq ((uq.quest?.id || (uq as any).id))}
{@const q = uq.quest || uq}
{@const currentCount = uq.current_count ?? (uq as any).progress ?? 0}
{@const targetCount = q.target_count || (q as any).target_count || 1}
{@const pct = Math.min(100, Math.round((currentCount / Math.max(1, targetCount)) * 100))}
{@const IconComponent = categoryIcons[q.category] || Target}
{@const qId = q.id || (uq as any).id}
<div class="quest-card glass" class:completed={uq.completed} class:claimed={uq.claimed}>
<div class="quest-top">
@@ -253,19 +281,19 @@
</div>
<div class="quest-meta">
<div class="quest-title-row">
<span class="quest-title">{uq.quest.title}</span>
<span class="badge cat-badge">{uq.quest.category}</span>
<span class="quest-title">{q.title}</span>
<span class="badge cat-badge">{q.category}</span>
</div>
<p class="quest-desc">{uq.quest.description}</p>
<p class="quest-desc">{q.description}</p>
</div>
</div>
<div class="quest-progress-wrap">
<div class="progress-labels">
<span class="progress-ratio">
<strong>{uq.current_count}</strong> / {uq.quest.target_count} ({pct}%)
<strong>{currentCount}</strong> / {targetCount} ({pct}%)
</span>
<span class="xp-badge">+{uq.quest.xp_reward} XP</span>
<span class="xp-badge">+{q.xp_reward} XP</span>
</div>
<div class="progress-bar-bg">
<div class="progress-fill" style:width="{pct}%"></div>
@@ -278,15 +306,15 @@
{:else if uq.completed}
<button
class="primary claim-btn"
onclick={() => handleClaimQuest(uq.quest.id)}
disabled={claimingQuestId === uq.quest.id}
onclick={() => handleClaimQuest(qId)}
disabled={claimingQuestId === qId}
>
{#if claimingQuestId === uq.quest.id}
{#if claimingQuestId === qId}
<LoaderCircle size={14} class="spin" />
{:else}
<Gift size={14} />
{/if}
Claim +{uq.quest.xp_reward} XP
Claim +{q.xp_reward} XP
</button>
{:else}
<span class="badge in-progress-badge">In Progress</span>
@@ -369,6 +397,26 @@
line-height: 1;
color: var(--text);
}
.rank-badge-pill {
display: inline-flex;
align-items: center;
gap: 3px;
background: color-mix(in srgb, #f59e0b 25%, transparent);
color: #f59e0b;
border: 1px solid color-mix(in srgb, #f59e0b 50%, transparent);
border-radius: 99rem;
padding: 2px 7px;
font-size: 0.72rem;
font-weight: 700;
margin-top: -6px;
z-index: 2;
}
.rank-title-badge {
background: color-mix(in srgb, #f59e0b 20%, transparent);
color: #f59e0b;
border: 1px solid color-mix(in srgb, #f59e0b 45%, transparent);
font-weight: 700;
}
.level-details {
flex: 1;
display: flex;
+238 -7
View File
@@ -2,15 +2,16 @@
import { onMount } from 'svelte';
import {
Users, UserPlus, MessageSquare, Gamepad2, Send, Check, X, Trash2,
Clock, ExternalLink, LoaderCircle, RefreshCw, Circle, UserX, Sparkles
Clock, ExternalLink, LoaderCircle, RefreshCw, Circle, UserX, Sparkles,
Search, Trophy, Shield
} from '@lucide/svelte';
import Avatar from '../components/Avatar.svelte';
import Modal from '../components/Modal.svelte';
import { activeAccount, app, instances, toast } from '../lib/store.svelte';
import { invoke } from '../lib/tauri';
import type { FriendInfo, DirectMessage, GameInvite } from '../lib/types';
import type { FriendInfo, DirectMessage, GameInvite, MemberProfile } from '../lib/types';
let activeSection = $state<'friends' | 'messages' | 'invites'>('friends');
let activeSection = $state<'friends' | 'members' | 'messages' | 'invites'>('friends');
let friendsFilter = $state<'all' | 'online' | 'pending'>('all');
let loading = $state(false);
@@ -25,6 +26,12 @@
let addFriendUsername = $state('');
let sendingFriendReq = $state(false);
// Members Directory / Search
let memberSearchQuery = $state('');
let membersList = $state<MemberProfile[]>([]);
let loadingMembers = $state(false);
let addingFriendUuid = $state<string | null>(null);
// Send Game Invite Modal
let inviteModalOpen = $state(false);
let inviteTargetFriend = $state<FriendInfo | null>(null);
@@ -47,14 +54,43 @@
}
}
async function searchMembers() {
loadingMembers = true;
try {
membersList = await invoke<MemberProfile[]>('search_members', { query: memberSearchQuery.trim() });
} catch (e: any) {
toast(e?.message ?? 'Failed to search members', 'error');
} finally {
loadingMembers = false;
}
}
async function handleAddMemberAsFriend(username: string, uuid: string) {
addingFriendUuid = uuid;
try {
await invoke('send_friend_request', { username, friendUsername: username });
toast(`Friend request sent to ${username}!`, 'ok');
await searchMembers();
await loadData();
} catch (e: any) {
toast(e?.message ?? 'Failed to send friend request', 'error');
} finally {
addingFriendUuid = null;
}
}
async function handleSendFriendRequest() {
if (!addFriendUsername.trim()) return;
sendingFriendReq = true;
const target = addFriendUsername.trim();
try {
await invoke('send_friend_request', { friendUsername: addFriendUsername.trim() });
toast(`Friend request sent to ${addFriendUsername.trim()}!`, 'ok');
await invoke('send_friend_request', { username: target, friendUsername: target });
toast(`Friend request sent to ${target}!`, 'ok');
addFriendUsername = '';
await loadData();
if (activeSection === 'members') {
await searchMembers();
}
} catch (e: any) {
toast(e?.message ?? 'Failed to send friend request', 'error');
} finally {
@@ -64,7 +100,7 @@
async function handleRespondRequest(friendUuid: string, accept: boolean) {
try {
await invoke('respond_friend_request', { friendUuid, accept });
await invoke('respond_friend_request', { targetUuid: friendUuid, friendUuid, accept });
toast(accept ? 'Friend request accepted!' : 'Request declined.', 'ok');
await loadData();
} catch (e: any) {
@@ -74,7 +110,7 @@
async function handleRemoveFriend(friendUuid: string) {
try {
await invoke('remove_friend', { friendUuid });
await invoke('remove_friend', { targetUuid: friendUuid, friendUuid });
friends = friends.filter((f) => f.uuid !== friendUuid);
if (activeChatFriend?.uuid === friendUuid) {
activeChatFriend = null;
@@ -191,6 +227,9 @@
<button class:active={activeSection === 'friends'} onclick={() => (activeSection = 'friends')}>
<Users size={15} /> Friends ({acceptedFriends.length})
</button>
<button class:active={activeSection === 'members'} onclick={() => { activeSection = 'members'; if (!membersList.length) searchMembers(); }}>
<Sparkles size={15} /> Find Players
</button>
<button class:active={activeSection === 'messages'} onclick={() => (activeSection = 'messages')}>
<MessageSquare size={15} /> Direct Messages
</button>
@@ -346,6 +385,100 @@
</div>
{/if}
</div>
{:else if activeSection === 'members'}
<!-- Members Directory Section -->
<div class="members-layout">
<div class="members-search-bar glass">
<Search size={18} class="muted" />
<input
type="text"
placeholder="Search all SCOPENET network players by username..."
bind:value={memberSearchQuery}
onkeydown={(e) => e.key === 'Enter' && searchMembers()}
class="members-search-input"
/>
<button
class="primary sm"
onclick={searchMembers}
disabled={loadingMembers}
>
{#if loadingMembers}<LoaderCircle size={14} class="spin" />{:else}<Search size={14} /> Search{/if}
</button>
</div>
{#if loadingMembers && !membersList.length}
<div class="center-state"><LoaderCircle class="spin" size={32} /></div>
{:else if membersList.length === 0}
<div class="empty-state glass">
<Users size={36} class="muted" />
<p class="muted">No players found matching "{memberSearchQuery}". Try another username!</p>
</div>
{:else}
<div class="members-grid">
{#each membersList as member (member.uuid)}
{@const isMe = member.uuid === activeAccount()?.uuid}
<div class="member-card glass" class:is-me={isMe}>
<div class="member-card-top">
<div class="avatar-wrap" role="button" tabindex="0" onclick={() => (app.viewProfileUuid = member.uuid)} onkeydown={(e) => e.key === 'Enter' && (app.viewProfileUuid = member.uuid)}>
<Avatar uuid={member.uuid} name={member.username} size={2.8} />
<span class="status-dot" class:online={member.online}></span>
</div>
<div class="member-meta">
<div class="name-row">
<strong class="member-name" onclick={() => (app.viewProfileUuid = member.uuid)}>{member.username}</strong>
{#if isMe}
<span class="badge me-tag">You</span>
{/if}
</div>
<div class="member-sub-info">
<span class="badge level-pill">Lvl {member.global_level}</span>
{#if member.title}
<span class="badge title-pill">{member.title}</span>
{/if}
</div>
<span class="online-status tiny muted">
{member.online ? 'Online on Network' : member.last_seen ? `Active ${new Date(member.last_seen).toLocaleDateString()}` : 'Offline'}
</span>
</div>
</div>
<div class="member-card-actions">
{#if isMe}
<button class="ghost sm w-full" onclick={() => (app.viewProfileUuid = member.uuid)}>
View My Profile
</button>
{:else if member.is_friend}
<button class="secondary sm" onclick={() => {
const friend = friends.find(f => f.uuid === member.uuid) || { uuid: member.uuid, username: member.username, status: 'accepted', is_online: member.online, playing_on: null };
selectChatFriend(friend as FriendInfo);
}}>
<MessageSquare size={13} /> Message
</button>
<button class="ghost sm icon" onclick={() => (app.viewProfileUuid = member.uuid)} title="View Profile">
<ExternalLink size={13} />
</button>
{:else}
<button
class="primary sm"
onclick={() => handleAddMemberAsFriend(member.username, member.uuid)}
disabled={addingFriendUuid === member.uuid}
>
{#if addingFriendUuid === member.uuid}
<LoaderCircle size={13} class="spin" />
{:else}
<UserPlus size={13} /> Add Friend
{/if}
</button>
<button class="ghost sm icon" onclick={() => (app.viewProfileUuid = member.uuid)} title="View Profile">
<ExternalLink size={13} />
</button>
{/if}
</div>
</div>
{/each}
</div>
{/if}
</div>
{:else if activeSection === 'messages'}
<!-- Direct Messages Split View -->
<div class="messages-split glass">
@@ -910,4 +1043,102 @@
text-align: center;
border-radius: var(--radius);
}
.members-layout {
display: flex;
flex-direction: column;
gap: 1rem;
}
.members-search-bar {
display: flex;
align-items: center;
gap: 0.75rem;
padding: 0.6rem 1rem;
border-radius: var(--radius);
}
.members-search-input {
flex: 1;
background: transparent;
border: none;
outline: none;
color: var(--text);
font-size: 0.95rem;
}
.members-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
gap: 1rem;
}
.member-card {
padding: 1.1rem;
border-radius: var(--radius);
display: flex;
flex-direction: column;
gap: 0.9rem;
transition: transform 0.15s, border-color 0.15s;
}
.member-card:hover {
transform: translateY(-2px);
border-color: color-mix(in srgb, var(--accent) 40%, transparent);
}
.member-card-top {
display: flex;
align-items: center;
gap: 0.85rem;
}
.avatar-wrap {
position: relative;
cursor: pointer;
}
.member-meta {
flex: 1;
min-width: 0;
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.name-row {
display: flex;
align-items: center;
gap: 0.4rem;
}
.member-name {
font-size: 1rem;
font-weight: 700;
cursor: pointer;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.member-name:hover {
color: var(--accent);
}
.member-sub-info {
display: flex;
align-items: center;
gap: 0.35rem;
flex-wrap: wrap;
}
.level-pill {
background: color-mix(in srgb, var(--accent) 20%, transparent);
color: var(--accent);
font-weight: 700;
}
.title-pill {
background: color-mix(in srgb, #f59e0b 20%, transparent);
color: #f59e0b;
}
.me-tag {
background: color-mix(in srgb, var(--line) 40%, transparent);
color: var(--muted);
}
.member-card-actions {
display: flex;
align-items: center;
gap: 0.45rem;
border-top: 1px solid color-mix(in srgb, var(--line) 40%, transparent);
padding-top: 0.75rem;
}
.w-full {
width: 100%;
}
</style>
+220 -1
View File
@@ -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>