feat: pass profile settings to launch scripts
Add launcher profile settings for username and language, then thread those values into the Windows script launch path. The game setup, game start, and server start scripts now share the same argument shape: - game path: local - game id - language: en or de - player name Expose a local can_host_server flag in the games payload by checking for server_start.cmd in an installed game's root directory. The detail modal uses that flag to show Start Server only for installed games with the script, and the new start_server command invokes server_start.cmd with the same sanitized settings used by game_setup.cmd and game_start.cmd. Test Plan: - just fmt - just test - just frontend-test - just build - just clippy - git diff --check Refs: design/README.md
This commit is contained in:
@@ -21,6 +21,15 @@ export const Icon = {
|
||||
<path d="M4 2.5v11l10-5.5z" />
|
||||
</svg>
|
||||
),
|
||||
server: (p: Props) => (
|
||||
<svg viewBox="0 0 16 16" width="13" height="13" strokeWidth={1.5} {...baseStroke} {...p}>
|
||||
<rect x="2" y="3" width="12" height="4.5" rx="1" />
|
||||
<rect x="2" y="8.5" width="12" height="4.5" rx="1" />
|
||||
<circle cx="4.6" cy="5.25" r=".55" fill="currentColor" stroke="none" />
|
||||
<circle cx="4.6" cy="10.75" r=".55" fill="currentColor" stroke="none" />
|
||||
<path d="M7 5.25h4.5M7 10.75h4.5" />
|
||||
</svg>
|
||||
),
|
||||
install: (p: Props) => (
|
||||
<svg viewBox="0 0 16 16" width="12" height="12" strokeWidth={1.7} {...baseStroke} {...p}>
|
||||
<path d="M8 2v8" />
|
||||
|
||||
@@ -16,6 +16,7 @@ interface Props {
|
||||
onUninstall: (game: Game) => void;
|
||||
onRemoveDownload: (game: Game) => void;
|
||||
onCancelDownload: (game: Game) => void;
|
||||
onStartServer: (game: Game) => void;
|
||||
onViewFiles: (game: Game) => void;
|
||||
}
|
||||
|
||||
@@ -45,6 +46,7 @@ export const GameDetailModal = ({
|
||||
onUninstall,
|
||||
onRemoveDownload,
|
||||
onCancelDownload,
|
||||
onStartServer,
|
||||
onViewFiles,
|
||||
}: Props) => {
|
||||
const tags = tagsFromGame(game);
|
||||
@@ -116,6 +118,16 @@ export const GameDetailModal = ({
|
||||
onClick={() => onPrimary(game)}
|
||||
onCancelDownload={onCancelDownload}
|
||||
/>
|
||||
{game.installed && game.can_host_server === true && (
|
||||
<button
|
||||
type="button"
|
||||
className="act-btn act-lg act-server"
|
||||
onClick={() => onStartServer(game)}
|
||||
>
|
||||
<Icon.server />
|
||||
<span className="act-label">Start Server</span>
|
||||
</button>
|
||||
)}
|
||||
{game.installed && (
|
||||
<button
|
||||
type="button"
|
||||
|
||||
@@ -8,7 +8,8 @@ import {
|
||||
ASPECT_OPTIONS,
|
||||
BG_OPTIONS,
|
||||
DENSITY_OPTIONS,
|
||||
UISettings,
|
||||
LANGUAGE_OPTIONS,
|
||||
type UISettings,
|
||||
} from '../../hooks/useSettings';
|
||||
|
||||
interface Props {
|
||||
@@ -33,6 +34,26 @@ const Row = ({ label, hint, children }: RowProps) => (
|
||||
</div>
|
||||
);
|
||||
|
||||
interface TextInputProps {
|
||||
value: string;
|
||||
placeholder: string;
|
||||
maxLength: number;
|
||||
onChange: (value: string) => void;
|
||||
}
|
||||
|
||||
const SettingsTextInput = ({ value, placeholder, maxLength, onChange }: TextInputProps) => (
|
||||
<div className="settings-text">
|
||||
<input
|
||||
type="text"
|
||||
value={value}
|
||||
placeholder={placeholder}
|
||||
maxLength={maxLength}
|
||||
spellCheck={false}
|
||||
onChange={(e) => onChange(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
|
||||
export const SettingsDialog = ({ settings, onChange, onClose }: Props) => (
|
||||
<Modal onClose={onClose} className="settings-modal">
|
||||
<div className="settings-head">
|
||||
@@ -48,6 +69,25 @@ export const SettingsDialog = ({ settings, onChange, onClose }: Props) => (
|
||||
</div>
|
||||
|
||||
<div className="settings-body">
|
||||
<section className="settings-section">
|
||||
<div className="settings-section-title">Profile</div>
|
||||
<Row label="Username" hint="Shown to other players on the LAN">
|
||||
<SettingsTextInput
|
||||
value={settings.username}
|
||||
placeholder="Enter a username"
|
||||
maxLength={24}
|
||||
onChange={(v) => onChange('username', v)}
|
||||
/>
|
||||
</Row>
|
||||
<Row label="Language" hint="Interface language">
|
||||
<SegmentedRadio
|
||||
value={settings.language}
|
||||
options={LANGUAGE_OPTIONS}
|
||||
onChange={(v) => onChange('language', v)}
|
||||
/>
|
||||
</Row>
|
||||
</section>
|
||||
|
||||
<section className="settings-section">
|
||||
<div className="settings-section-title">Appearance</div>
|
||||
<Row label="Accent color" hint="Used for primary actions and highlights">
|
||||
|
||||
@@ -1,10 +1,12 @@
|
||||
import { useCallback } from 'react';
|
||||
import { invoke } from '@tauri-apps/api/core';
|
||||
|
||||
import { UseGamesResult } from './useGames';
|
||||
import { type UseGamesResult } from './useGames';
|
||||
import { type UISettings } from './useSettings';
|
||||
|
||||
export interface GameActions {
|
||||
play: (id: string) => Promise<void>;
|
||||
startServer: (id: string) => Promise<void>;
|
||||
install: (id: string) => Promise<void>;
|
||||
update: (id: string) => Promise<void>;
|
||||
uninstall: (id: string) => Promise<void>;
|
||||
@@ -19,14 +21,33 @@ export interface GameActions {
|
||||
* are marked as "checking peers" until the backend emits an authoritative
|
||||
* operation snapshot; cancellation waits for the backend to clear that snapshot.
|
||||
*/
|
||||
export const useGameActions = (games: UseGamesResult): GameActions => {
|
||||
export const useGameActions = (
|
||||
games: UseGamesResult,
|
||||
settings: Pick<UISettings, 'language' | 'username'>,
|
||||
): GameActions => {
|
||||
const play = useCallback(async (id: string) => {
|
||||
try {
|
||||
await invoke('run_game', { id });
|
||||
await invoke('run_game', {
|
||||
id,
|
||||
language: settings.language,
|
||||
username: settings.username,
|
||||
});
|
||||
} catch (err) {
|
||||
console.error('run_game failed:', err);
|
||||
}
|
||||
}, []);
|
||||
}, [settings.language, settings.username]);
|
||||
|
||||
const startServer = useCallback(async (id: string) => {
|
||||
try {
|
||||
await invoke('start_server', {
|
||||
id,
|
||||
language: settings.language,
|
||||
username: settings.username,
|
||||
});
|
||||
} catch (err) {
|
||||
console.error('start_server failed:', err);
|
||||
}
|
||||
}, [settings.language, settings.username]);
|
||||
|
||||
const install = useCallback(async (id: string) => {
|
||||
try {
|
||||
@@ -83,5 +104,5 @@ export const useGameActions = (games: UseGamesResult): GameActions => {
|
||||
}
|
||||
}, []);
|
||||
|
||||
return { play, install, update, uninstall, removeDownload, cancelDownload, viewFiles };
|
||||
return { play, startServer, install, update, uninstall, removeDownload, cancelDownload, viewFiles };
|
||||
};
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import { useCallback, useEffect, useState } from 'react';
|
||||
import { load } from '@tauri-apps/plugin-store';
|
||||
|
||||
import { GameFilter, GameSort } from '../lib/types';
|
||||
import { type GameFilter, type GameSort, type LauncherLanguage } from '../lib/types';
|
||||
import { SETTINGS_FILE, SETTINGS_FILE_OPTIONS, UI_SETTINGS_KEY } from '../lib/store';
|
||||
|
||||
export type Density = 'compact' | 'normal' | 'large';
|
||||
@@ -15,10 +15,14 @@ export interface UISettings {
|
||||
aspect: CoverAspect;
|
||||
sort: GameSort;
|
||||
filter: GameFilter;
|
||||
username: string;
|
||||
language: LauncherLanguage;
|
||||
}
|
||||
|
||||
type StoredGameSort = GameSort | 'size';
|
||||
type StoredUISettings = Partial<Omit<UISettings, 'sort'> & { sort: StoredGameSort }>;
|
||||
const DEFAULT_USERNAME = 'Commander';
|
||||
const MAX_USERNAME_LENGTH = 24;
|
||||
|
||||
export const ACCENT_OPTIONS = [
|
||||
{ value: '#3b82f6', label: 'Blue' },
|
||||
@@ -47,6 +51,18 @@ export const ASPECT_OPTIONS: ReadonlyArray<{ value: CoverAspect; label: string }
|
||||
{ value: 'banner', label: 'Banner' },
|
||||
];
|
||||
|
||||
export const LANGUAGE_OPTIONS: ReadonlyArray<{ value: LauncherLanguage; label: string }> = [
|
||||
{ value: 'en', label: 'English' },
|
||||
{ value: 'de', label: 'Deutsch' },
|
||||
];
|
||||
|
||||
const defaultLanguage = (): LauncherLanguage => {
|
||||
if (typeof navigator !== 'undefined' && navigator.language.toLowerCase().startsWith('de')) {
|
||||
return 'de';
|
||||
}
|
||||
return 'en';
|
||||
};
|
||||
|
||||
export const DEFAULT_SETTINGS: UISettings = {
|
||||
accent: '#3b82f6',
|
||||
bg: 'gradient',
|
||||
@@ -54,6 +70,8 @@ export const DEFAULT_SETTINGS: UISettings = {
|
||||
aspect: 'square',
|
||||
sort: 'status',
|
||||
filter: 'local',
|
||||
username: DEFAULT_USERNAME,
|
||||
language: defaultLanguage(),
|
||||
};
|
||||
|
||||
const sanitize = (raw: StoredUISettings | undefined): UISettings => ({
|
||||
@@ -63,12 +81,23 @@ const sanitize = (raw: StoredUISettings | undefined): UISettings => ({
|
||||
aspect: raw?.aspect ?? DEFAULT_SETTINGS.aspect,
|
||||
sort: sanitizeSort(raw?.sort),
|
||||
filter: raw?.filter ?? DEFAULT_SETTINGS.filter,
|
||||
username: sanitizeUsername(raw?.username),
|
||||
language: sanitizeLanguage(raw?.language),
|
||||
});
|
||||
|
||||
const sanitizeSort = (sort: StoredGameSort | undefined): GameSort => (
|
||||
sort === 'size' ? 'sizeDesc' : sort ?? DEFAULT_SETTINGS.sort
|
||||
);
|
||||
|
||||
const sanitizeLanguage = (language: LauncherLanguage | undefined): LauncherLanguage => (
|
||||
language === 'de' || language === 'en' ? language : DEFAULT_SETTINGS.language
|
||||
);
|
||||
|
||||
const sanitizeUsername = (username: string | undefined): string => {
|
||||
const trimmed = username?.trim() ?? '';
|
||||
return trimmed ? Array.from(trimmed).slice(0, MAX_USERNAME_LENGTH).join('') : DEFAULT_USERNAME;
|
||||
};
|
||||
|
||||
export interface UseSettings {
|
||||
settings: UISettings;
|
||||
set: <K extends keyof UISettings>(key: K, value: UISettings[K]) => void;
|
||||
|
||||
@@ -58,6 +58,7 @@ export interface Game {
|
||||
status_level?: StatusLevel;
|
||||
download_progress?: DownloadProgress;
|
||||
peer_count: number;
|
||||
can_host_server?: boolean;
|
||||
}
|
||||
|
||||
export interface ActiveOperation {
|
||||
@@ -78,3 +79,6 @@ export type GameSort = 'az' | 'sizeDesc' | 'sizeAsc' | 'status';
|
||||
|
||||
/** Visual state of a card. Derived from backend operation status and local flags. */
|
||||
export type DerivedState = 'installed' | 'local' | 'downloading' | 'none' | 'busy';
|
||||
|
||||
/** Two-character language code passed through to game scripts. */
|
||||
export type LauncherLanguage = 'en' | 'de';
|
||||
|
||||
@@ -807,6 +807,20 @@
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: var(--bd-3);
|
||||
}
|
||||
.act-server {
|
||||
color: var(--t-1);
|
||||
background: color-mix(in srgb, var(--accent) 14%, rgba(255, 255, 255, 0.04));
|
||||
border: 1px solid color-mix(in srgb, var(--accent) 55%, transparent);
|
||||
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
|
||||
}
|
||||
.act-server:hover:not(:disabled) {
|
||||
background: color-mix(in srgb, var(--accent) 22%, rgba(255, 255, 255, 0.04));
|
||||
border-color: color-mix(in srgb, var(--accent) 75%, transparent);
|
||||
filter: none;
|
||||
}
|
||||
.act-server svg {
|
||||
color: var(--accent);
|
||||
}
|
||||
.act-busy {
|
||||
color: var(--t-1);
|
||||
background: rgba(255, 255, 255, 0.06);
|
||||
@@ -1475,6 +1489,43 @@
|
||||
filter: brightness(1.1);
|
||||
}
|
||||
|
||||
/* Settings: text input */
|
||||
.settings-text {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
width: 220px;
|
||||
height: 36px;
|
||||
padding: 0 12px;
|
||||
background: var(--bg-3);
|
||||
border: 1px solid var(--bd-1);
|
||||
border-radius: 8px;
|
||||
transition:
|
||||
background 0.15s,
|
||||
border-color 0.15s,
|
||||
box-shadow 0.15s;
|
||||
}
|
||||
.settings-text:focus-within {
|
||||
background: var(--bg-2);
|
||||
border-color: var(--accent);
|
||||
box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent);
|
||||
}
|
||||
.settings-text input {
|
||||
min-width: 0;
|
||||
flex: 1;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
outline: 0;
|
||||
color: var(--t-1);
|
||||
font: inherit;
|
||||
font-size: 13.5px;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
.settings-text input::placeholder {
|
||||
color: var(--t-3);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* Settings: color swatches */
|
||||
.swatch-row {
|
||||
display: inline-flex;
|
||||
|
||||
@@ -47,7 +47,7 @@ export const MainWindow = () => {
|
||||
const { settings, set: setSetting } = useSettings();
|
||||
const { gameDir, setGameDir, rescan } = useGameDirectory();
|
||||
const games = useGames(rescan);
|
||||
const actions = useGameActions(games);
|
||||
const actions = useGameActions(games, settings);
|
||||
const thumbnails = useThumbnails();
|
||||
|
||||
const [openGameId, setOpenGameId] = useState<string | null>(null);
|
||||
@@ -172,6 +172,7 @@ export const MainWindow = () => {
|
||||
onUninstall={handleUninstall}
|
||||
onRemoveDownload={handleRemoveDownload}
|
||||
onCancelDownload={(g) => actions.cancelDownload(g.id)}
|
||||
onStartServer={(g) => actions.startServer(g.id)}
|
||||
onViewFiles={(g) => actions.viewFiles(g.id)}
|
||||
/>
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user