Files
csgowtf/src/lib/api/players.ts
vikingowl 8f3b652740 feat: Implement Phase 1 critical features and fix API integration
This commit completes the first phase of feature parity implementation and
resolves all API integration issues to match the backend API format.

## API Integration Fixes

- Remove all hardcoded default values from transformers (tick_rate, kast, player_count, steam_updated)
- Update TypeScript types to make fields optional where backend doesn't guarantee them
- Update Zod schemas to validate optional fields correctly
- Fix mock data to match real API response format (plain arrays, not wrapped objects)
- Update UI components to handle undefined values with proper fallbacks
- Add comprehensive API documentation for Match and Player endpoints

## Phase 1 Features Implemented (3/6)

### 1. Player Tracking System 
- Created TrackPlayerModal.svelte with auth code input
- Integrated track/untrack player API endpoints
- Added UI for providing optional share code
- Displays tracked status on player profiles
- Full validation and error handling

### 2. Share Code Parsing 
- Created ShareCodeInput.svelte component
- Added to matches page for easy match submission
- Real-time validation of share code format
- Parse status feedback with loading states
- Auto-redirect to match page on success

### 3. VAC/Game Ban Status 
- Added VAC and game ban count/date fields to Player type
- Display status badges on player profile pages
- Show ban count and date when available
- Visual indicators using DaisyUI badge components

## Component Improvements

- Modal.svelte: Added Svelte 5 Snippet types, actions slot support
- ThemeToggle.svelte: Removed deprecated svelte:component usage
- Tooltip.svelte: Fixed type safety with Snippet type
- All new components follow Svelte 5 runes pattern ($state, $derived, $bindable)

## Type Safety & Linting

- Fixed all ESLint errors (any types → proper types)
- Fixed form label accessibility issues
- Replaced error: any with error: unknown + proper type guards
- Added Snippet type imports where needed
- Updated all catch blocks to use instanceof Error checks

## Static Assets

- Migrated all files from public/ to static/ directory per SvelteKit best practices
- Moved 200+ map icons, screenshots, and other assets
- Updated all import paths to use /images/ (served from static/)

## Documentation

- Created IMPLEMENTATION_STATUS.md tracking all 15 missing features
- Updated API.md with optional field annotations
- Created MATCHES_API.md with comprehensive endpoint documentation
- Added inline comments marking optional vs required fields

## Testing

- Updated mock fixtures to remove default values
- Fixed mock handlers to return plain arrays like real API
- Ensured all components handle undefined gracefully

## Remaining Phase 1 Tasks

- [ ] Add VAC status column to match scoreboard
- [ ] Create weapons statistics tab for matches
- [ ] Implement recently visited players on home page

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-12 19:31:18 +01:00

123 lines
4.2 KiB
TypeScript

import { apiClient } from './client';
import { parsePlayer } from '$lib/schemas';
import type { Player, PlayerMeta, TrackPlayerResponse } from '$lib/types';
import { transformPlayerProfile, type LegacyPlayerProfile } from './transformers';
/**
* Player API endpoints
*/
export const playersAPI = {
/**
* Get player profile with match history
* @param steamId - Steam ID (uint64 as string to preserve precision)
* @param beforeTime - Optional Unix timestamp for pagination
* @returns Player profile with recent matches
*/
async getPlayer(steamId: string, beforeTime?: number): Promise<Player> {
const url = beforeTime ? `/player/${steamId}/next/${beforeTime}` : `/player/${steamId}`;
const data = await apiClient.get<Player>(url);
// Validate with Zod schema
return parsePlayer(data);
},
/**
* Get lightweight player metadata
* @param steamId - Steam ID (uint64 as string to preserve precision)
* @param limit - Number of recent matches to include (default: 10)
* @returns Player metadata
*/
async getPlayerMeta(steamId: string, limit = 10): Promise<PlayerMeta> {
// Use the /player/{id} endpoint which has the data we need
const url = `/player/${steamId}`;
const legacyData = await apiClient.get<LegacyPlayerProfile>(url);
// Transform legacy API format to our schema format
const transformedData = transformPlayerProfile(legacyData);
// Validate the player data
// parsePlayer throws on validation failure, so player is always defined if we reach this point
const player = parsePlayer(transformedData);
// Calculate aggregated stats from matches
const matches = player.matches || [];
const recentMatches = matches.slice(0, limit);
const totalKills = recentMatches.reduce((sum, m) => sum + (m.stats?.kills || 0), 0);
const totalDeaths = recentMatches.reduce((sum, m) => sum + (m.stats?.deaths || 0), 0);
const totalKast = recentMatches.reduce((sum, _m) => {
// KAST is a percentage, we need to calculate it
// For now, we'll use a placeholder
return sum + 0;
}, 0);
const wins = recentMatches.filter((m) => {
// match_result 1 = win, 2 = loss
return m.match_result === 1;
}).length;
const avgKills = recentMatches.length > 0 ? totalKills / recentMatches.length : 0;
const avgDeaths = recentMatches.length > 0 ? totalDeaths / recentMatches.length : 0;
const winRate = recentMatches.length > 0 ? wins / recentMatches.length : 0;
// Find the most recent match date
const lastMatchDate =
matches.length > 0 && matches[0] ? matches[0].date : new Date().toISOString();
// Transform to PlayerMeta format
const playerMeta: PlayerMeta = {
id: parseInt(player.id, 10),
name: player.name,
avatar: player.avatar, // Already transformed by transformPlayerProfile
recent_matches: recentMatches.length,
last_match_date: lastMatchDate,
avg_kills: avgKills,
avg_deaths: avgDeaths,
avg_kast: recentMatches.length > 0 ? totalKast / recentMatches.length : 0, // Placeholder KAST calculation
win_rate: winRate
};
return playerMeta;
},
/**
* Add player to tracking system
* @param steamId - Steam ID (uint64 as string to preserve precision)
* @param authCode - Steam authentication code
* @returns Success response
*/
async trackPlayer(steamId: string, authCode: string): Promise<TrackPlayerResponse> {
const url = `/player/${steamId}/track`;
return apiClient.post<TrackPlayerResponse>(url, { auth_code: authCode });
},
/**
* Remove player from tracking system
* @param steamId - Steam ID (uint64 as string to preserve precision)
* @returns Success response
*/
async untrackPlayer(steamId: string): Promise<TrackPlayerResponse> {
const url = `/player/${steamId}/track`;
return apiClient.delete<TrackPlayerResponse>(url);
},
/**
* Search players by name (cancelable)
* @param query - Search query
* @param limit - Maximum results
* @returns Array of player matches
*/
async searchPlayers(query: string, limit = 10): Promise<PlayerMeta[]> {
const url = `/players/search`;
const data = await apiClient.getCancelable<PlayerMeta[]>(url, 'player-search', {
params: { q: query, limit }
});
return data;
}
};
/**
* Player API with default export
*/
export default playersAPI;