nvrl/ultimate-ban-tracker
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases 6 Wiki Activity

feat/revoke-share #3

Merged
nvrl merged 8 commits from feat/revoke-share into main 2026-02-21 03:19:34 +01:00
Conversation 0 Commits 8 Files Changed 9 +504 -226
9 changed files with 504 additions and 226 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
frontend/dist-electron/main.js
View File

@@ -502,10 +502,30 @@ electron_1.ipcMain.handle('share-account-with-user', async (event, steamId, targ
}
throw new Error('Backend not configured');
});
electron_1.ipcMain.handle('revoke-account-access', async (event, steamId, targetSteamId) => {
initBackend();
if (backend)
return await backend.revokeAccess(steamId, targetSteamId);
throw new Error('Backend not configured');
});
electron_1.ipcMain.handle('revoke-all-account-access', async (event, steamId) => {
initBackend();
if (backend)
return await backend.revokeAllAccess(steamId);
throw new Error('Backend not configured');
});
electron_1.ipcMain.handle('get-community-accounts', async () => { initBackend(); return backend ? await backend.getCommunityAccounts() : []; });
electron_1.ipcMain.handle('get-server-users', async () => { initBackend(); return backend ? await backend.getServerUsers() : []; });
electron_1.ipcMain.handle('switch-account', async (event, loginName) => await handleSwitchAccount(loginName));
electron_1.ipcMain.handle('open-external', (event, url) => electron_1.shell.openExternal(url));
electron_1.ipcMain.handle('open-steam-app-login', async () => {
console.log('[SteamClient] Triggering desktop login window...');
// Force Steam to show login window.
// steam://open/login is the protocol for this.
const command = process.platform === 'win32' ? 'start steam://open/login' : 'xdg-open steam://open/login';
(0, child_process_1.exec)(command);
return true;
});
electron_1.ipcMain.handle('open-steam-login', async (event, expectedSteamId) => {
const loginSession = electron_1.session.fromPartition('persist:steam-login');
// Removed: automatic clearStorageData to allow cookie persistence

3
frontend/dist-electron/preload.js
View File

@@ -8,7 +8,10 @@ electron_1.contextBridge.exposeInMainWorld('electronAPI', {
deleteAccount: (id) => electron_1.ipcRenderer.invoke('delete-account', id),
switchAccount: (loginName) => electron_1.ipcRenderer.invoke('switch-account', loginName),
shareAccountWithUser: (steamId, targetSteamId) => electron_1.ipcRenderer.invoke('share-account-with-user', steamId, targetSteamId),
revokeAccountAccess: (steamId, targetSteamId) => electron_1.ipcRenderer.invoke('revoke-account-access', steamId, targetSteamId),
revokeAllAccountAccess: (steamId) => electron_1.ipcRenderer.invoke('revoke-all-account-access', steamId),
openExternal: (url) => electron_1.ipcRenderer.invoke('open-external', url),
openSteamAppLogin: () => electron_1.ipcRenderer.invoke('open-steam-app-login'),
openSteamLogin: (steamId) => electron_1.ipcRenderer.invoke('open-steam-login', steamId),
// Server Config & Auth
getServerConfig: () => electron_1.ipcRenderer.invoke('get-server-config'),

32
frontend/dist-electron/services/backend.js
View File

@@ -67,7 +67,8 @@ class BackendService {
gameBans: account.gameBans,
loginName: account.loginName,
steamLoginSecure: account.steamLoginSecure,
loginConfig: account.loginConfig
loginConfig: account.loginConfig,
sessionUpdatedAt: account.sessionUpdatedAt
}, { headers: this.headers });
}
catch (e) {
@@ -100,5 +101,34 @@ class BackendService {
throw new Error(e.response?.data?.message || 'Failed to share account');
}
}
async revokeAccess(steamId, targetSteamId) {
if (!this.token)
return;
try {
const response = await axios_1.default.delete(`${this.url}/api/sync/${steamId}/share`, {
headers: this.headers,
data: { targetSteamId }
});
return response.data;
}
catch (e) {
console.error(`[Backend] Failed to revoke access for ${steamId} from ${targetSteamId}`);
throw new Error(e.response?.data?.message || 'Failed to revoke access');
}
}
async revokeAllAccess(steamId) {
if (!this.token)
return;
try {
const response = await axios_1.default.delete(`${this.url}/api/sync/${steamId}/share/all`, {
headers: this.headers
});
return response.data;
}
catch (e) {
console.error(`[Backend] Failed to revoke all access for ${steamId}`);
throw new Error(e.response?.data?.message || 'Failed to revoke all access');
}
}
}
exports.BackendService = BackendService;

69
frontend/electron/main.ts
View File

@@ -488,19 +488,82 @@ ipcMain.handle('share-account-with-user', async (event, steamId: string, targetS
throw new Error('Backend not configured');
});
ipcMain.handle('revoke-account-access', async (event, steamId: string, targetSteamId: string) => {
initBackend();
if (backend) return await backend.revokeAccess(steamId, targetSteamId);
throw new Error('Backend not configured');
});
ipcMain.handle('revoke-all-account-access', async (event, steamId: string) => {
initBackend();
if (backend) return await backend.revokeAllAccess(steamId);
throw new Error('Backend not configured');
});
ipcMain.handle('get-community-accounts', async () => { initBackend(); return backend ? await backend.getCommunityAccounts() : []; });
ipcMain.handle('get-server-users', async () => { initBackend(); return backend ? await backend.getServerUsers() : []; });
ipcMain.handle('switch-account', async (event, loginName: string) => await handleSwitchAccount(loginName));
ipcMain.handle('open-external', (event, url: string) => shell.openExternal(url));
ipcMain.handle('open-steam-app-login', async () => {
console.log('[SteamClient] Preparing for fresh login...');
await killSteam();
if (process.platform === 'win32') {
// Clear auto-login registry
const clearReg = 'reg add "HKCU\\Software\\Valve\\Steam" /v AutoLoginUser /t REG_SZ /d "" /f';
await new Promise<void>((res) => exec(clearReg, () => res()));
} else if (process.platform === 'linux') {
// On Linux we can use the steamClient helper to set an empty user
await steamClient.setAutoLoginUser("", undefined, "");
}
const command = process.platform === 'win32' ? 'start steam://open/login' : 'xdg-open steam://open/login';
exec(command);
return true;
});
ipcMain.handle('open-steam-login', async (event, expectedSteamId: string) => {
const loginSession = session.fromPartition('persist:steam-login');
// Removed: automatic clearStorageData to allow cookie persistence
// Use a unique partition per account to prevent session bleeding
const partitionId = expectedSteamId ? `persist:steam-login-${expectedSteamId}` : 'persist:steam-login-new';
const loginSession = session.fromPartition(partitionId);
// If adding a brand new account, explicitly clear previous trash
if (!expectedSteamId) {
console.log('[Auth] Clearing session for new account login...');
await loginSession.clearStorageData({ storages: ['cookies', 'localstorage', 'indexdb'] });
}
// If we have an existing cookie string for this account, pre-inject it
if (expectedSteamId) {
const accounts = store.get('accounts') as Account[];
const account = accounts.find(a => a.steamId === expectedSteamId);
if (account?.steamLoginSecure) {
console.log(`[Auth] Pre-injecting existing cookies for ${account.personaName}...`);
const cookiePairs = account.steamLoginSecure.split(';').map(c => c.trim());
for (const pair of cookiePairs) {
const [name, value] = pair.split('=');
if (name && value) {
try {
await loginSession.cookies.set({
url: 'https://steamcommunity.com',
domain: 'steamcommunity.com',
name: name,
value: value,
path: '/',
secure: true,
httpOnly: name.includes('Secure')
});
} catch (e) {}
}
}
}
}
return new Promise<boolean>((resolve) => {
const loginWindow = new BrowserWindow({
width: 800, height: 700, parent: mainWindow || undefined, modal: true, title: 'Login to Steam',
webPreferences: { nodeIntegration: false, contextIsolation: true, partition: 'persist:steam-login' }
webPreferences: { nodeIntegration: false, contextIsolation: true, partition: partitionId }
});
loginWindow.loadURL('https://steamcommunity.com/login/home/?goto=my/gcpd/730');
const checkCookie = setInterval(async () => {

3
frontend/electron/preload.ts
View File

@@ -7,7 +7,10 @@ contextBridge.exposeInMainWorld('electronAPI', {
deleteAccount: (id: string) => ipcRenderer.invoke('delete-account', id),
switchAccount: (loginName: string) => ipcRenderer.invoke('switch-account', loginName),
shareAccountWithUser: (steamId: string, targetSteamId: string) => ipcRenderer.invoke('share-account-with-user', steamId, targetSteamId),
revokeAccountAccess: (steamId: string, targetSteamId: string) => ipcRenderer.invoke('revoke-account-access', steamId, targetSteamId),
revokeAllAccountAccess: (steamId: string) => ipcRenderer.invoke('revoke-all-account-access', steamId),
openExternal: (url: string) => ipcRenderer.invoke('open-external', url),
openSteamAppLogin: () => ipcRenderer.invoke('open-steam-app-login'),
openSteamLogin: (steamId: string) => ipcRenderer.invoke('open-steam-login', steamId),
// Server Config & Auth

30
frontend/electron/services/backend.ts
View File

@@ -61,7 +61,8 @@ export class BackendService {
gameBans: account.gameBans,
loginName: account.loginName,
steamLoginSecure: account.steamLoginSecure,
loginConfig: account.loginConfig
loginConfig: account.loginConfig,
sessionUpdatedAt: account.sessionUpdatedAt
}, { headers: this.headers });
} catch (e) {
console.error('[Backend] Failed to share account');
@@ -91,4 +92,31 @@ export class BackendService {
throw new Error(e.response?.data?.message || 'Failed to share account');
}
}
public async revokeAccess(steamId: string, targetSteamId: string) {
if (!this.token) return;
try {
const response = await axios.delete(`${this.url}/api/sync/${steamId}/share`, {
headers: this.headers,
data: { targetSteamId }
});
return response.data;
} catch (e: any) {
console.error(`[Backend] Failed to revoke access for ${steamId} from ${targetSteamId}`);
throw new Error(e.response?.data?.message || 'Failed to revoke access');
}
}
public async revokeAllAccess(steamId: string) {
if (!this.token) return;
try {
const response = await axios.delete(`${this.url}/api/sync/${steamId}/share/all`, {
headers: this.headers
});
return response.data;
} catch (e: any) {
console.error(`[Backend] Failed to revoke all access for ${steamId}`);
throw new Error(e.response?.data?.message || 'Failed to revoke all access');
}
}
}

23
frontend/src/hooks/useAccounts.tsx
View File

@@ -38,8 +38,11 @@ interface AccountsContextType {
updateAccount: (id: string, data: Partial<Account>) => Promise<void>;
deleteAccount: (id: string) => Promise<void>;
switchAccount: (loginName: string) => Promise<void>;
openSteamAppLogin: () => Promise<void>;
openSteamLogin: (steamId: string) => Promise<void>;
shareAccountWithUser: (steamId: string, targetSteamId: string) => Promise<any>;
revokeAccountAccess: (steamId: string, targetSteamId: string) => Promise<any>;
revokeAllAccountAccess: (steamId: string) => Promise<any>;
// Server Methods
updateServerConfig: (config: Partial<ServerConfig>) => Promise<void>;
@@ -125,6 +128,10 @@ export const AccountsProvider: React.FC<{ children: React.ReactNode }> = ({ chil
await (window as any).electronAPI.switchAccount(loginName);
};
const openSteamAppLogin = async () => {
await (window as any).electronAPI.openSteamAppLogin();
};
const openSteamLogin = async (steamId: string) => {
await (window as any).electronAPI.openSteamLogin(steamId);
await syncNow();
@@ -136,6 +143,18 @@ export const AccountsProvider: React.FC<{ children: React.ReactNode }> = ({ chil
return res;
};
const revokeAccountAccess = async (steamId: string, targetSteamId: string) => {
const res = await (window as any).electronAPI.revokeAccountAccess(steamId, targetSteamId);
await syncNow();
return res;
};
const revokeAllAccountAccess = async (steamId: string) => {
const res = await (window as any).electronAPI.revokeAllAccountAccess(steamId);
await syncNow();
return res;
};
const updateServerConfig = async (config: Partial<ServerConfig>) => {
const updated = await (window as any).electronAPI.updateServerConfig(config);
setServerConfig(updated);
@@ -158,8 +177,8 @@ export const AccountsProvider: React.FC<{ children: React.ReactNode }> = ({ chil
return (
<AccountsContext.Provider value={{
accounts, serverConfig, isLoading, isSyncing, addAccount, updateAccount, deleteAccount,
switchAccount, openSteamLogin, updateServerConfig, loginToServer,
getCommunityAccounts, getServerUsers, shareAccountWithUser, syncNow, refreshAccounts
switchAccount, openSteamAppLogin, openSteamLogin, updateServerConfig, loginToServer,
getCommunityAccounts, getServerUsers, shareAccountWithUser, revokeAccountAccess, revokeAllAccountAccess, syncNow, refreshAccounts
}}>
{children}
</AccountsContext.Provider>

316
frontend/src/pages/Dashboard.tsx
View File

@@ -6,7 +6,7 @@ import {
DialogActions, CircularProgress, Paper, Chip,
Table, TableBody, TableCell, TableContainer, TableHead, TableRow,
Switch, FormControlLabel, Divider, List, ListItem, ListItemText, ListItemSecondaryAction,
Tabs, Tab, Select, MenuItem, FormControl, InputLabel
Select, MenuItem, FormControl, InputLabel
} from '@mui/material';
import SearchIcon from '@mui/icons-material/Search';
import AddIcon from '@mui/icons-material/Add';
@@ -20,11 +20,11 @@ import LockResetIcon from '@mui/icons-material/LockReset';
import SettingsIcon from '@mui/icons-material/Settings';
import ShareIcon from '@mui/icons-material/Share';
import GroupAddIcon from '@mui/icons-material/GroupAdd';
import PublicIcon from '@mui/icons-material/Public';
import ShieldIcon from '@mui/icons-material/Shield';
import GppBadIcon from '@mui/icons-material/GppBad';
import PeopleIcon from '@mui/icons-material/People';
import VerifiedUserIcon from '@mui/icons-material/VerifiedUser';
import WorkspacePremiumIcon from '@mui/icons-material/WorkspacePremium';
import { useAccounts, type Account } from '../hooks/useAccounts';
import { useAppTheme } from '../theme/ThemeContext';
import type { ThemeType } from '../theme/SteamTheme';
@@ -33,62 +33,18 @@ import NebulaBanner from '../components/NebulaBanner';
const Dashboard: React.FC = () => {
const { currentTheme, setTheme } = useAppTheme();
const {
accounts, isLoading, isSyncing, serverConfig, addAccount, deleteAccount,
switchAccount, openSteamLogin, updateServerConfig, loginToServer,
getCommunityAccounts, syncNow
accounts, isLoading, isSyncing, serverConfig, deleteAccount,
switchAccount, openSteamAppLogin, openSteamLogin, updateServerConfig, loginToServer, syncNow
} = useAccounts();
const [searchTerm, setSearchTerm] = useState('');
const [isAddDialogOpen, setIsAddDialogOpen] = useState(false);
const [isSettingsOpen, setIsSettingsOpen] = useState(false);
const [identifier, setIdentifier] = useState('');
const [addTab, setAddTab] = useState(0);
const [communityAccounts, setCommunityAccounts] = useState<any[]>([]);
const [isCommunityLoading, setIsCommunityLoading] = useState(false);
const [serverUrl, setServerUrl] = useState('');
useEffect(() => {
if (serverConfig?.url) {
setServerUrl(serverConfig.url);
}
if (serverConfig?.url) setServerUrl(serverConfig.url);
}, [serverConfig?.url]);
const loadCommunity = async () => {
setIsCommunityLoading(true);
try {
const data = await getCommunityAccounts();
setCommunityAccounts(Array.isArray(data) ? data : []);
} catch (e) {
} finally {
setIsCommunityLoading(false);
}
};
useEffect(() => {
if (isAddDialogOpen && addTab === 1) {
loadCommunity();
}
}, [isAddDialogOpen, addTab]);
const handleAddAccount = async () => {
if (!identifier) return;
try {
await addAccount({ identifier });
setIsAddDialogOpen(false);
setIdentifier('');
} catch (e) {
console.error("[Dashboard] Add failed:", e);
}
};
const handleAddFromCommunity = async (commAcc: any) => {
try {
await addAccount({ identifier: commAcc.steamId });
setIsAddDialogOpen(false);
} catch (e) { }
};
const saveSettings = async () => {
await updateServerConfig({ url: serverUrl });
alert("Server URL updated!");
@@ -148,7 +104,7 @@ const Dashboard: React.FC = () => {
variant="contained"
color="primary"
startIcon={<AddIcon />}
onClick={() => setIsAddDialogOpen(true)}
onClick={() => openSteamAppLogin()}
sx={{ height: 32 }}
>
Add
@@ -194,7 +150,7 @@ const Dashboard: React.FC = () => {
{!isLoading && filteredAccounts.length === 0 && (
<Box sx={{ width: '100%', mt: 10, textAlign: 'center' }}>
<Typography variant="h6" color="textSecondary">
No accounts tracked. Click "Add Account" to get started!
No accounts tracked. Click "Add" to get started!
</Typography>
</Box>
)}
@@ -235,14 +191,7 @@ const Dashboard: React.FC = () => {
InputProps={{
endAdornment: (
<InputAdornment position="end">
<Button
variant="contained"
size="small"
onClick={saveSettings}
sx={{ height: 30 }}
>
Apply
</Button>
<Button variant="contained" size="small" onClick={saveSettings} sx={{ height: 30 }}>Apply</Button>
</InputAdornment>
),
}}
@@ -297,62 +246,6 @@ const Dashboard: React.FC = () => {
<Button onClick={() => setIsSettingsOpen(false)} color="inherit" variant="contained">Done</Button>
</DialogActions>
</Dialog>
{/* Add Account Dialog */}
<Dialog open={isAddDialogOpen} onClose={() => setIsAddDialogOpen(false)} maxWidth="sm" fullWidth>
<DialogTitle sx={{ backgroundColor: 'background.paper', color: 'text.primary', p: 0 }}>
<Tabs value={addTab} onChange={(_, v) => setAddTab(v)} variant="fullWidth" textColor="inherit" indicatorColor="primary">
<Tab label="Manual Add" icon={<AddIcon />} iconPosition="start" />
<Tab label="From Community" icon={<PublicIcon />} iconPosition="start" disabled={!serverConfig?.token} />
</Tabs>
</DialogTitle>
<DialogContent sx={{ backgroundColor: 'background.paper', pt: 2, minHeight: 300 }}>
{addTab === 0 ? (
<>
<Typography variant="body2" color="textSecondary" sx={{ mb: 2 }}>
Enter a SteamID64 or Profile URL. You will need to authenticate to enable full tracking and instant login features.
</Typography>
<TextField
fullWidth
autoFocus
placeholder="SteamID64 or Profile URL"
value={identifier}
onChange={(e) => setIdentifier(e.target.value)}
sx={{ '& .MuiOutlinedInput-root': { backgroundColor: 'rgba(0, 0, 0, 0.1)' } }}
/>
</>
) : (
<Box>
{isCommunityLoading ? (
<Box sx={{ display: 'flex', justifyContent: 'center', p: 4 }}><CircularProgress size={32} /></Box>
) : (
<List>
{communityAccounts
.filter(ca => !safeAccounts.find(a => a.steamId === ca.steamId))
.map((ca) => (
<ListItem key={ca.steamId} divider sx={{ borderColor: 'divider' }}>
<Avatar src={ca.avatar} variant="square" sx={{ width: 32, height: 32, mr: 2 }} />
<ListItemText
primary={ca.personaName}
secondary={ca.steamId}
primaryTypographyProps={{ sx: { color: 'text.primary', fontWeight: 'bold' } }}
/>
<ListItemSecondaryAction>
<Button size="small" variant="contained" onClick={() => handleAddFromCommunity(ca)}>Add</Button>
</ListItemSecondaryAction>
</ListItem>
))}
{communityAccounts.length === 0 && <Typography align="center" color="textSecondary" sx={{ p: 4 }}>No shared accounts found on server.</Typography>}
</List>
)}
</Box>
)}
</DialogContent>
<DialogActions sx={{ backgroundColor: 'background.paper', p: 2 }}>
<Button onClick={() => setIsAddDialogOpen(false)} color="inherit">Cancel</Button>
{addTab === 0 && <Button onClick={handleAddAccount} variant="contained" color="success" disabled={!identifier}>Add</Button>}
</DialogActions>
</Dialog>
</Box>
);
};
@@ -365,7 +258,7 @@ const AccountRow: React.FC<{
onSwitch: (login: string) => void,
onAuth: () => void
}> = ({ account, onDelete, onSwitch, onAuth }) => {
const { shareAccountWithUser, getServerUsers, serverConfig } = useAccounts();
const { shareAccountWithUser, revokeAccountAccess, revokeAllAccountAccess, getServerUsers, serverConfig } = useAccounts();
const [timeLeft, setTimeLeft] = useState<string | null>(null);
const [isShareOpen, setIsShareOpen] = useState(false);
const [targetUserId, setTargetUserId] = useState('');
@@ -376,10 +269,7 @@ const AccountRow: React.FC<{
const isCooldownActive = cooldownDate && !isNaN(cooldownDate.getTime()) && cooldownDate.getTime() > Date.now();
useEffect(() => {
if (!isCooldownActive || !cooldownDate) {
setTimeLeft(null);
return;
}
if (!isCooldownActive || !cooldownDate) { setTimeLeft(null); return; }
const targetTime = cooldownDate.getTime();
const timer = setInterval(() => {
const diff = targetTime - Date.now();
@@ -392,14 +282,9 @@ const AccountRow: React.FC<{
return () => clearInterval(timer);
}, [account?.cooldownExpiresAt, isCooldownActive]);
const avatarSrc = account?.localAvatar
? `steam-resource://${account.localAvatar}`
: (account?.avatar || '');
const avatarSrc = account?.localAvatar ? `steam-resource://${account.localAvatar}` : (account?.avatar || '');
const [imgSrc, setImgSrc] = useState(avatarSrc);
useEffect(() => {
setImgSrc(avatarSrc);
}, [avatarSrc]);
useEffect(() => { setImgSrc(avatarSrc); }, [avatarSrc]);
const handleOpenShare = async () => {
setIsShareOpen(true);
@@ -421,70 +306,79 @@ const AccountRow: React.FC<{
setIsSharing(true);
try {
await shareAccountWithUser(account.steamId, targetUserId);
alert(`Account shared successfully!`);
setIsShareOpen(false);
setTargetUserId('');
} catch (e: any) {
alert(e.message || "Failed to share account");
} finally {
setIsSharing(false);
}
} catch (e: any) { alert(e.message || "Failed to share account");
} finally { setIsSharing(false); }
};
const handleRevoke = async (targetSteamId: string) => {
if (!window.confirm("Revoke access for this user?")) return;
try { await revokeAccountAccess(account.steamId, targetSteamId);
} catch (e: any) { alert(e.message); }
};
const handleRevokeAll = async () => {
if (!window.confirm("Completely stop sharing this account?")) return;
try { await revokeAllAccountAccess(account.steamId); setIsShareOpen(false);
} catch (e: any) { alert(e.message); }
};
const isBanned = account?.vacBanned || (account?.gameBans && account.gameBans > 0);
const isShared = account?._id.startsWith('shared_');
// Primary account check
const isPrimaryAccount = serverConfig?.serverSteamId === account.steamId;
// Refined Shared Logic
const isSharedWithYou = account?._id.startsWith('shared_');
const hasSharedMembers = (account as any).sharedWith && (account as any).sharedWith.length > 0;
const showCommunityIcon = isSharedWithYou || hasSharedMembers;
return (
<TableRow sx={{ '&:hover': { background: 'action.hover' }, borderBottom: '1px solid', borderColor: 'divider' }}>
<TableCell>
<Box sx={{ position: 'relative' }}>
<Avatar src={imgSrc} variant="square" sx={{ width: 32, height: 32, border: '1px solid', borderColor: 'divider' }} />
{isShared && (
<Tooltip title="Community Shared Account">
{isPrimaryAccount && (
<Tooltip title="Primary Community Account">
<WorkspacePremiumIcon sx={{ position: 'absolute', top: -8, left: -8, fontSize: 18, color: '#FFD700', filter: 'drop-shadow(0 0 2px rgba(0,0,0,0.5))' }} />
</Tooltip>
)}
{showCommunityIcon && (
<Tooltip title={isSharedWithYou ? "Remote Shared Account" : "Actively Shared with Community"}>
<PeopleIcon sx={{ position: 'absolute', bottom: -4, right: -4, fontSize: 14, color: 'primary.main', bgcolor: 'background.default', borderRadius: '50%', border: '1px solid', borderColor: 'divider', p: 0.2 }} />
</Tooltip>
)}
</Box>
</TableCell>
<TableCell>
<Typography variant="body2" sx={{ fontWeight: 'bold', color: isBanned ? 'error.main' : 'text.primary' }}>
{account?.personaName || 'Unknown'}
</Typography>
<Typography variant="body2" sx={{ fontWeight: 'bold', color: isBanned ? 'error.main' : 'text.primary' }}>{account?.personaName || 'Unknown'}</Typography>
<Typography variant="caption" sx={{ color: 'text.secondary', display: 'block' }}>{account?.steamId}</Typography>
</TableCell>
<TableCell>
{isBanned ? (
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 0.5 }}>
<Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5, color: 'error.main' }}>
<GppBadIcon sx={{ fontSize: 16 }} />
<Typography variant="caption" sx={{ fontWeight: 'bold', letterSpacing: '0.5px' }}>ACCOUNT BANNED</Typography>
<GppBadIcon sx={{ fontSize: 16 }} /><Typography variant="caption" sx={{ fontWeight: 'bold' }}>BANNED</Typography>
</Box>
<Box sx={{ display: 'flex', gap: 0.5 }}>
{account?.vacBanned && (
<Chip label="VAC" size="small" sx={{ height: 16, fontSize: '0.6rem', bgcolor: 'error.main', color: 'white', fontWeight: 'bold', borderRadius: 0.5 }} />
)}
{account?.gameBans ? account.gameBans > 0 && (
<Chip label={`${account.gameBans} GAME`} size="small" sx={{ height: 16, fontSize: '0.6rem', bgcolor: 'error.main', color: 'white', fontWeight: 'bold', borderRadius: 0.5 }} />
) : null}
{account?.vacBanned && <Chip label="VAC" size="small" sx={{ height: 16, fontSize: '0.6rem', bgcolor: 'error.main', color: 'white', fontWeight: 'bold' }} />}
{account?.gameBans ? account.gameBans > 0 && <Chip label={`${account.gameBans} GAME`} size="small" sx={{ height: 16, fontSize: '0.6rem', bgcolor: 'error.main', color: 'white', fontWeight: 'bold' }} /> : null}
</Box>
</Box>
) : (
<Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5, color: 'success.main' }}>
<ShieldIcon sx={{ fontSize: 16 }} />
<Typography variant="caption" sx={{ fontWeight: 'bold', letterSpacing: '0.5px' }}>SECURE</Typography>
<ShieldIcon sx={{ fontSize: 16 }} /><Typography variant="caption" sx={{ fontWeight: 'bold' }}>SECURE</Typography>
</Box>
)}
</TableCell>
<TableCell>
{account?.authError ? (
<Box sx={{ display: 'flex', alignItems: 'center', color: 'warning.main', gap: 0.5 }}>
<LockResetIcon sx={{ fontSize: 16 }} />
<Typography variant="body2" sx={{ fontWeight: 'bold' }}>Needs Re-auth</Typography>
<LockResetIcon sx={{ fontSize: 16 }} /><Typography variant="body2" sx={{ fontWeight: 'bold' }}>Needs Re-auth</Typography>
</Box>
) : isCooldownActive ? (
<Box sx={{ display: 'flex', alignItems: 'center', color: 'primary.main', gap: 0.5 }}>
<TimerIcon sx={{ fontSize: 16 }} />
<Typography variant="body2" sx={{ fontWeight: 'bold' }}>{timeLeft}</Typography>
<TimerIcon sx={{ fontSize: 16 }} /><Typography variant="body2" sx={{ fontWeight: 'bold' }}>{timeLeft}</Typography>
</Box>
) : (
<Typography variant="caption" sx={{ color: 'text.secondary' }}>Available</Typography>
@@ -492,95 +386,79 @@ const AccountRow: React.FC<{
</TableCell>
<TableCell align="right">
<Box sx={{ display: 'flex', justifyContent: 'flex-end', gap: 0.5, alignItems: 'center' }}>
{/* Fast Switcher Button - Always available if we have a login name */}
{account.loginName && (
<Button
variant="contained"
size="small"
onClick={() => onSwitch(account.loginName || '')}
sx={{
height: 28,
fontSize: '0.7rem',
bgcolor: 'secondary.main',
'&:hover': { opacity: 0.9 },
minWidth: 60
}}
>
LOGIN
</Button>
variant="contained" size="small" onClick={() => onSwitch(account.loginName || '')}
sx={{ height: 28, fontSize: '0.7rem', bgcolor: 'secondary.main', '&:hover': { opacity: 0.9 }, minWidth: 60 }}
>LOGIN</Button>
)}
{/* Scraper Auth Button - Controls the optional cooldown tracking */}
<Tooltip title={account.steamLoginSecure && !account.authError ? "Session valid - Tracking active" : (account.steamLoginSecure ? "Refresh scraper session" : "Authenticate for cooldown tracking")}>
<Tooltip title={account.steamLoginSecure && !account.authError ? "Tracking active" : "Authenticate for cooldowns"}>
<Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5 }}>
<IconButton
size="small"
onClick={onAuth}
disabled={!!(account.steamLoginSecure && !account.authError)}
size="small" onClick={onAuth} disabled={!!(account.steamLoginSecure && !account.authError)}
sx={{
color: account.steamLoginSecure && !account.authError ? 'success.main' : (account.authError ? 'error.main' : 'warning.main'),
border: '1px solid',
borderColor: account.steamLoginSecure && !account.authError ? 'success.main' : 'divider',
borderRadius: 1,
opacity: account.steamLoginSecure && !account.authError ? 1 : 1,
background: account.steamLoginSecure && !account.authError ? 'rgba(163, 207, 6, 0.1)' : 'transparent'
border: '1px solid', borderColor: account.steamLoginSecure && !account.authError ? 'success.main' : 'divider',
borderRadius: 1, background: account.steamLoginSecure && !account.authError ? 'rgba(163, 207, 6, 0.1)' : 'transparent'
}}
>
{account.steamLoginSecure && !account.authError ? <VerifiedUserIcon fontSize="inherit" /> : (account.authError ? <LockResetIcon fontSize="inherit" /> : <BoltIcon fontSize="inherit" />)}
</IconButton>
{account.steamLoginSecure && !account.authError && (
<Typography variant="caption" sx={{ color: 'success.main', fontWeight: 'bold', fontSize: '0.6rem', letterSpacing: '0.5px' }}>
TRACKING
</Typography>
<Typography variant="caption" sx={{ color: 'success.main', fontWeight: 'bold', fontSize: '0.6rem' }}>TRACKING</Typography>
)}
</Box>
</Tooltip>
<Divider orientation="vertical" flexItem sx={{ mx: 0.5, my: 0.5 }} />
<IconButton size="small" onClick={handleOpenShare} disabled={!serverConfig?.token}><ShareIcon fontSize="inherit" sx={{ color: 'primary.main' }}/></IconButton>
<IconButton size="small" sx={{ color: 'text.secondary' }} onClick={() => (window as any).electronAPI.openExternal(account?.profileUrl || '')}><OpenInNewIcon fontSize="inherit"/></IconButton>
<IconButton size="small" sx={{ color: 'error.main' }} onClick={() => onDelete(account?._id || '')}><DeleteIcon fontSize="inherit"/></IconButton>
</Box>
{/* Share Dialog */}
<Dialog open={isShareOpen} onClose={() => setIsShareOpen(false)} maxWidth="xs" fullWidth>
<DialogTitle sx={{ backgroundColor: 'background.paper', color: 'text.primary' }}>Share Account</DialogTitle>
<DialogTitle sx={{ backgroundColor: 'background.paper', color: 'text.primary' }}>Permissions</DialogTitle>
<DialogContent sx={{ backgroundColor: 'background.paper', pt: 2 }}>
<Typography variant="body2" sx={{ mb: 2 }}>
Select a community member to share this account with.
</Typography>
<FormControl fullWidth size="small" sx={{ mt: 1 }}>
<InputLabel sx={{ color: 'text.secondary' }}>Select User</InputLabel>
<Select
value={targetUserId}
label="Select User"
onChange={(e) => setTargetUserId(e.target.value as string)}
sx={{ bgcolor: 'rgba(0,0,0,0.1)', color: 'text.primary' }}
>
{serverUsers.map(user => (
<MenuItem key={user.steamId} value={user.steamId}>
<Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>
<Avatar src={user.avatar} sx={{ width: 24, height: 24 }} />
{user.personaName}
</Box>
</MenuItem>
))}
{serverUsers.length === 0 && <MenuItem disabled>No users found on server</MenuItem>}
</Select>
</FormControl>
<Typography variant="subtitle2" sx={{ mb: 1, color: 'primary.main' }}>GRANT ACCESS</Typography>
<Box sx={{ display: 'flex', gap: 1, mb: 3 }}>
<FormControl fullWidth size="small">
<InputLabel sx={{ color: 'text.secondary' }}>Select User</InputLabel>
<Select
value={targetUserId} label="Select User" onChange={(e) => setTargetUserId(e.target.value as string)}
sx={{ bgcolor: 'rgba(0,0,0,0.1)', color: 'text.primary' }}
>
{serverUsers
.filter(u => !(account as any).sharedWith?.find((sw: any) => sw.steamId === u.steamId))
.map(user => (
<MenuItem key={user.steamId} value={user.steamId}>
<Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}><Avatar src={user.avatar} sx={{ width: 24, height: 24 }} />{user.personaName}</Box>
</MenuItem>
))}
{serverUsers.length === 0 && <MenuItem disabled>No eligible users found</MenuItem>}
</Select>
</FormControl>
<Button onClick={handleShare} variant="contained" disabled={!targetUserId || isSharing} sx={{ minWidth: 80 }}>{isSharing ? <CircularProgress size={16} color="inherit" /> : "Add"}</Button>
</Box>
<Divider sx={{ my: 2, borderColor: 'divider' }} />
<Typography variant="subtitle2" sx={{ mb: 1, color: 'primary.main' }}>CURRENT ACCESS</Typography>
<List size="small" sx={{ bgcolor: 'rgba(0,0,0,0.05)', borderRadius: 1, mb: 2 }}>
{(account as any).sharedWith?.map((sw: any) => (
<ListItem key={sw.steamId} dense divider sx={{ borderColor: 'divider' }}>
<Avatar src={sw.avatar} sx={{ width: 24, height: 24, mr: 1 }} />
<ListItemText primary={sw.personaName} primaryTypographyProps={{ variant: 'body2', sx: { fontWeight: 'bold' } }} />
<ListItemSecondaryAction>
<IconButton size="small" color="error" onClick={() => handleRevoke(sw.steamId)}><DeleteIcon fontSize="inherit" /></IconButton>
</ListItemSecondaryAction>
</ListItem>
))}
{(!(account as any).sharedWith || (account as any).sharedWith.length === 0) && (
<Typography variant="caption" align="center" sx={{ display: 'block', p: 2, opacity: 0.6 }}>Not shared with anyone yet.</Typography>
)}
</List>
{(account as any).sharedWith?.length > 0 && (
<Button fullWidth variant="outlined" color="error" size="small" onClick={handleRevokeAll} startIcon={<GppBadIcon />}>Revoke All Shared Access</Button>
)}
</DialogContent>
<DialogActions sx={{ backgroundColor: 'background.paper', p: 2 }}>
<Button onClick={() => setIsShareOpen(false)} color="inherit" disabled={isSharing}>Cancel</Button>
<Button
onClick={handleShare}
variant="contained"
startIcon={isSharing ? <CircularProgress size={16} color="inherit" /> : <GroupAddIcon />}
disabled={!targetUserId || isSharing}
>
{isSharing ? "Sharing..." : "Grant Access"}
</Button>
</DialogActions>
<DialogActions sx={{ backgroundColor: 'background.paper', p: 2 }}><Button onClick={() => setIsShareOpen(false)} color="inherit" variant="contained">Done</Button></DialogActions>
</Dialog>
</TableCell>
</TableRow>

234
frontend/src/pages/DashboardRow.tsx Normal file
View File

@@ -0,0 +1,234 @@
const AccountRow: React.FC<{
account: Account,
onDelete: (id: string) => void,
onSwitch: (login: string) => void,
onAuth: () => void
}> = ({ account, onDelete, onSwitch, onAuth }) => {
const { shareAccountWithUser, revokeAccountAccess, revokeAllAccountAccess, getServerUsers, serverConfig } = useAccounts();
const [timeLeft, setTimeLeft] = useState<string | null>(null);
const [isShareOpen, setIsShareOpen] = useState(false);
const [targetUserId, setTargetUserId] = useState('');
const [isSharing, setIsSharing] = useState(false);
const [serverUsers, setServerUsers] = useState<any[]>([]);
const cooldownDate = account?.cooldownExpiresAt ? new Date(account.cooldownExpiresAt) : null;
const isCooldownActive = cooldownDate && !isNaN(cooldownDate.getTime()) && cooldownDate.getTime() > Date.now();
useEffect(() => {
if (!isCooldownActive || !cooldownDate) {
setTimeLeft(null);
return;
}
const targetTime = cooldownDate.getTime();
const timer = setInterval(() => {
const diff = targetTime - Date.now();
if (diff <= 0) { setTimeLeft(null); clearInterval(timer); return; }
const hours = Math.floor(diff / 3600000);
const mins = Math.floor((diff % 3600000) / 60000);
const secs = Math.floor((diff % 60000) / 1000);
setTimeLeft(`${hours}h ${mins}m ${secs}s`);
}, 1000);
return () => clearInterval(timer);
}, [account?.cooldownExpiresAt, isCooldownActive]);
const avatarSrc = account?.localAvatar
? `steam-resource://${account.localAvatar}`
: (account?.avatar || '');
const [imgSrc, setImgSrc] = useState(avatarSrc);
useEffect(() => {
setImgSrc(avatarSrc);
}, [avatarSrc]);
const handleOpenShare = async () => {
setIsShareOpen(true);
try {
const [users, selfInfo] = await Promise.all([
getServerUsers(),
(window as any).electronAPI.getServerUserInfo()
]);
const filtered = (Array.isArray(users) ? users : []).filter(u =>
u.steamId !== selfInfo.steamId &&
u.steamId !== account.steamId
);
setServerUsers(filtered);
} catch (e) {}
};
const handleShare = async () => {
if (!targetUserId) return;
setIsSharing(true);
try {
await shareAccountWithUser(account.steamId, targetUserId);
setTargetUserId('');
} catch (e: any) {
alert(e.message || "Failed to share account");
} finally {
setIsSharing(false);
}
};
const handleRevoke = async (targetSteamId: string) => {
if (!window.confirm("Revoke access for this user?")) return;
try {
await revokeAccountAccess(account.steamId, targetSteamId);
} catch (e: any) { alert(e.message); }
};
const handleRevokeAll = async () => {
if (!window.confirm("Completely stop sharing this account with the community?")) return;
try {
await revokeAllAccountAccess(account.steamId);
setIsShareOpen(false);
} catch (e: any) { alert(e.message); }
};
const isBanned = account?.vacBanned || (account?.gameBans && account.gameBans > 0);
const isShared = account?._id.startsWith('shared_');
return (
<TableRow sx={{ '&:hover': { background: 'action.hover' }, borderBottom: '1px solid', borderColor: 'divider' }}>
<TableCell>
<Box sx={{ position: 'relative' }}>
<Avatar src={imgSrc} variant="square" sx={{ width: 32, height: 32, border: '1px solid', borderColor: 'divider' }} />
{isShared && (
<Tooltip title="Community Shared Account">
<PeopleIcon sx={{ position: 'absolute', bottom: -4, right: -4, fontSize: 14, color: 'primary.main', bgcolor: 'background.default', borderRadius: '50%', border: '1px solid', borderColor: 'divider', p: 0.2 }} />
</Tooltip>
)}
</Box>
</TableCell>
<TableCell>
<Typography variant="body2" sx={{ fontWeight: 'bold', color: isBanned ? 'error.main' : 'text.primary' }}>
{account?.personaName || 'Unknown'}
</Typography>
<Typography variant="caption" sx={{ color: 'text.secondary', display: 'block' }}>{account?.steamId}</Typography>
</TableCell>
<TableCell>
{isBanned ? (
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 0.5 }}>
<Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5, color: 'error.main' }}>
<GppBadIcon sx={{ fontSize: 16 }} />
<Typography variant="caption" sx={{ fontWeight: 'bold', letterSpacing: '0.5px' }}>ACCOUNT BANNED</Typography>
</Box>
<Box sx={{ display: 'flex', gap: 0.5 }}>
{account?.vacBanned && (
<Chip label="VAC" size="small" sx={{ height: 16, fontSize: '0.6rem', bgcolor: 'error.main', color: 'white', fontWeight: 'bold', borderRadius: 0.5 }} />
)}
{account?.gameBans ? account.gameBans > 0 && (
<Chip label={`${account.gameBans} GAME`} size="small" sx={{ height: 16, fontSize: '0.6rem', bgcolor: 'error.main', color: 'white', fontWeight: 'bold', borderRadius: 0.5 }} />
) : null}
</Box>
</Box>
) : (
<Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5, color: 'success.main' }}>
<ShieldIcon sx={{ fontSize: 16 }} />
<Typography variant="caption" sx={{ fontWeight: 'bold', letterSpacing: '0.5px' }}>SECURE</Typography>
</Box>
)}
</TableCell>
<TableCell>
{account?.authError ? (
<Box sx={{ display: 'flex', alignItems: 'center', color: 'warning.main', gap: 0.5 }}>
<LockResetIcon sx={{ fontSize: 16 }} />
<Typography variant="body2" sx={{ fontWeight: 'bold' }}>Needs Re-auth</Typography>
</Box>
) : isCooldownActive ? (
<Box sx={{ display: 'flex', alignItems: 'center', color: 'primary.main', gap: 0.5 }}>
<TimerIcon sx={{ fontSize: 16 }} />
<Typography variant="body2" sx={{ fontWeight: 'bold' }}>{timeLeft}</Typography>
</Box>
) : (
<Typography variant="caption" sx={{ color: 'text.secondary' }}>Available</Typography>
)}
</TableCell>
<TableCell align="right">
<Box sx={{ display: 'flex', justifyContent: 'flex-end', gap: 0.5, alignItems: 'center' }}>
{account.loginName && (
<Button
variant="contained" size="small" onClick={() => onSwitch(account.loginName || '')}
sx={{ height: 28, fontSize: '0.7rem', bgcolor: 'secondary.main', '&:hover': { opacity: 0.9 }, minWidth: 60 }}
>
LOGIN
</Button>
)}
<Tooltip title={account.steamLoginSecure && !account.authError ? "Session valid - Tracking active" : (account.steamLoginSecure ? "Refresh scraper session" : "Authenticate for cooldown tracking")}>
<Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5 }}>
<IconButton
size="small" onClick={onAuth}
disabled={!!(account.steamLoginSecure && !account.authError)}
sx={{
color: account.steamLoginSecure && !account.authError ? 'success.main' : (account.authError ? 'error.main' : 'warning.main'),
border: '1px solid', borderColor: account.steamLoginSecure && !account.authError ? 'success.main' : 'divider',
borderRadius: 1, background: account.steamLoginSecure && !account.authError ? 'rgba(163, 207, 6, 0.1)' : 'transparent'
}}
>
{account.steamLoginSecure && !account.authError ? <VerifiedUserIcon fontSize="inherit" /> : (account.authError ? <LockResetIcon fontSize="inherit" /> : <BoltIcon fontSize="inherit" />)}
</IconButton>
{account.steamLoginSecure && !account.authError && (
<Typography variant="caption" sx={{ color: 'success.main', fontWeight: 'bold', fontSize: '0.6rem', letterSpacing: '0.5px' }}>
TRACKING
</Typography>
)}
</Box>
</Tooltip>
<Divider orientation="vertical" flexItem sx={{ mx: 0.5, my: 0.5 }} />
<IconButton size="small" onClick={handleOpenShare} disabled={!serverConfig?.token}><ShareIcon fontSize="inherit" sx={{ color: 'primary.main' }}/></IconButton>
<IconButton size="small" sx={{ color: 'text.secondary' }} onClick={() => (window as any).electronAPI.openExternal(account?.profileUrl || '')}><OpenInNewIcon fontSize="inherit"/></IconButton>
<IconButton size="small" sx={{ color: 'error.main' }} onClick={() => onDelete(account?._id || '')}><DeleteIcon fontSize="inherit"/></IconButton>
</Box>
<Dialog open={isShareOpen} onClose={() => setIsShareOpen(false)} maxWidth="xs" fullWidth>
<DialogTitle sx={{ backgroundColor: 'background.paper', color: 'text.primary' }}>Account Permissions</DialogTitle>
<DialogContent sx={{ backgroundColor: 'background.paper', pt: 2 }}>
<Typography variant="subtitle2" sx={{ mb: 1, color: 'primary.main' }}>GRANT ACCESS</Typography>
<Box sx={{ display: 'flex', gap: 1, mb: 3 }}>
<FormControl fullWidth size="small">
<InputLabel sx={{ color: 'text.secondary' }}>Select User</InputLabel>
<Select
value={targetUserId} label="Select User" onChange={(e) => setTargetUserId(e.target.value as string)}
sx={{ bgcolor: 'rgba(0,0,0,0.1)', color: 'text.primary' }}
>
{serverUsers
.filter(u => !(account as any).sharedWith?.find((sw: any) => sw.steamId === u.steamId))
.map(user => (
<MenuItem key={user.steamId} value={user.steamId}>
<Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}><Avatar src={user.avatar} sx={{ width: 24, height: 24 }} />{user.personaName}</Box>
</MenuItem>
))}
{serverUsers.length === 0 && <MenuItem disabled>No eligible users found</MenuItem>}
</Select>
</FormControl>
<Button onClick={handleShare} variant="contained" disabled={!targetUserId || isSharing} sx={{ minWidth: 80 }}>
{isSharing ? <CircularProgress size={16} color="inherit" /> : "Add"}
</Button>
</Box>
<Divider sx={{ my: 2, borderColor: 'divider' }} />
<Typography variant="subtitle2" sx={{ mb: 1, color: 'primary.main' }}>CURRENT ACCESS</Typography>
<List size="small" sx={{ bgcolor: 'rgba(0,0,0,0.05)', borderRadius: 1, mb: 2 }}>
{(account as any).sharedWith?.map((sw: any) => (
<ListItem key={sw.steamId} dense divider sx={{ borderColor: 'divider' }}>
<Avatar src={sw.avatar} sx={{ width: 24, height: 24, mr: 1 }} />
<ListItemText primary={sw.personaName} primaryTypographyProps={{ variant: 'body2', sx: { fontWeight: 'bold' } }} />
<ListItemSecondaryAction>
<IconButton size="small" color="error" onClick={() => handleRevoke(sw.steamId)}><DeleteIcon fontSize="inherit" /></IconButton>
</ListItemSecondaryAction>
</ListItem>
))}
{(!(account as any).sharedWith || (account as any).sharedWith.length === 0) && (
<Typography variant="caption" align="center" sx={{ display: 'block', p: 2, opacity: 0.6 }}>Not shared with anyone yet.</Typography>
)}
</List>
{(account as any).sharedWith?.length > 0 && (
<Button fullWidth variant="outlined" color="error" size="small" onClick={handleRevokeAll} startIcon={<GppBadIcon />}>Revoke All Shared Access</Button>
)}
</DialogContent>
<DialogActions sx={{ backgroundColor: 'background.paper', p: 2 }}><Button onClick={() => setIsShareOpen(false)} color="inherit" variant="contained">Done</Button></DialogActions>
</Dialog>
</TableCell>
</TableRow>
);
};