Take firms from the master instead of defining them per machine
This box no longer decides what firms exist. It caches the master's catalog
and stores one thing of its own: the Tradovate login for each firm. Creating
firms locally is gone — app/add, POST /api/firms, the account-config routes
and the banned-symbol route with it.
The cache is the point, not an optimisation. The scheduler needs every
account's target and size on each 60s tick, so fetching them per tick would
stop trading with positions open the first time the master rebooted. It is
one JSON blob in settings, replaced only by a complete valid response, and a
response with zero firms is refused outright: a misconfigured FIRMS_DB serves
{"firms":[]} as a healthy 200, and mirroring that would idle the whole fleet
at once.
Accounts bind to an account type by prefix AND size, the size taken from the
opening funding transaction. That does not arrive with the first sync, so an
account sits Unassigned and the resolver tries again next sync rather than
guessing. A type picked by hand is never overwritten by an auto pass. This
replaces the longest-prefix helper that had been copy-pasted into five files,
which could not tell two types with the same prefix apart at all.
firm_credentials and account_assignments deliberately have no foreign key to
the cached catalog. foreign_keys is ON, so a cascade would erase the Tradovate
passwords the moment a firm was removed on the master — routine, not
exceptional. They survive it, and are re-keyed by name if the master's database
is ever rebuilt with fresh ids.
The legacy firms/account_configs/firm_banned_symbols tables are left on disk,
unreferenced. firms is the only table that ever held plaintext credentials and
dropping it would make a rollback unrecoverable.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
Brandon Li
co-authored by
Claude Opus 5
Claude Opus 5
parent
8b2e78d766
commit
8bdc85080c
+276
-99
@@ -1,9 +1,8 @@
|
||||
'use client';
|
||||
|
||||
import { useEffect, useState } from 'react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import Link from 'next/link';
|
||||
import type { FirmConfig, FirmState, AccountState, AccountConfig } from '@/types';
|
||||
import type { FirmConfig, FirmState, AccountState } from '@/types';
|
||||
import { stagePillClasses } from '@/lib/stage-colors';
|
||||
|
||||
type SortKey = 'name' | 'balance' | 'dayPnL' | 'daysTraded' | 'target' | 'status';
|
||||
@@ -19,13 +18,6 @@ function statusRank(account: AccountState): number {
|
||||
return 3; // In Trade
|
||||
}
|
||||
|
||||
function getAccountConfig(name: string, firm: FirmConfig): AccountConfig | undefined {
|
||||
return [...firm.accounts]
|
||||
.sort((a, b) => b.prefix.length - a.prefix.length)
|
||||
.find((a) => name.startsWith(a.prefix));
|
||||
}
|
||||
|
||||
|
||||
function fmt(value: number) {
|
||||
return value.toLocaleString('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 2 });
|
||||
}
|
||||
@@ -44,6 +36,17 @@ function SettingsIcon() {
|
||||
);
|
||||
}
|
||||
|
||||
function KeyOffIcon() {
|
||||
return (
|
||||
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
|
||||
<circle cx="7.5" cy="15.5" r="4.5" />
|
||||
<path d="M10.7 12.3 21 2" />
|
||||
<path d="m17 6 3 3" />
|
||||
<line x1="2" y1="2" x2="22" y2="22" />
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
|
||||
function ChevronIcon({ open }: { open: boolean }) {
|
||||
return (
|
||||
<svg className={`chevron${open ? ' open' : ''}`} width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round">
|
||||
@@ -113,8 +116,142 @@ function SortHeader({ label, col, sortKey, sortDir, onSort }: {
|
||||
);
|
||||
}
|
||||
|
||||
function AccountRow({ account, firm, hideDead, privacy }: { account: AccountState; firm: FirmConfig; hideDead: boolean; privacy: boolean }) {
|
||||
const cfg = getAccountConfig(account.name, firm);
|
||||
/** The account-type override. "Auto" hands the account back to the resolver;
|
||||
* anything else pins it, and a pin survives every later sync. */
|
||||
function AccountTypeCell({ account, firm, onAssigned }: {
|
||||
account: AccountState;
|
||||
firm: FirmConfig;
|
||||
onAssigned: () => void;
|
||||
}) {
|
||||
const [saving, setSaving] = useState(false);
|
||||
|
||||
async function assign(accountTypeId: string) {
|
||||
setSaving(true);
|
||||
try {
|
||||
if (accountTypeId === '') {
|
||||
await fetch(`/api/accounts/${account.id}/account-type`, { method: 'DELETE' });
|
||||
} else {
|
||||
await fetch(`/api/accounts/${account.id}/account-type`, {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ accountTypeId }),
|
||||
});
|
||||
}
|
||||
onAssigned();
|
||||
} finally {
|
||||
setSaving(false);
|
||||
}
|
||||
}
|
||||
|
||||
// A pinned type that no longer exists on the master: keep the pin, but say
|
||||
// so, because the account has silently stopped trading.
|
||||
const danglingPin = account.assignmentSource === 'unassigned' && account.accountTypeId !== null;
|
||||
|
||||
return (
|
||||
<div className="flex items-center gap-1.5">
|
||||
<select
|
||||
value={account.assignmentSource === 'manual' ? (account.accountTypeId ?? '') : ''}
|
||||
disabled={saving}
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
onChange={(e) => assign(e.target.value)}
|
||||
className={`border border-slate-200 rounded-md px-1.5 py-1 text-xs bg-white focus:outline-none focus:ring-1 focus:ring-blue-400 max-w-[10rem] ${
|
||||
account.accountTypeLabel ? 'text-slate-700' : 'text-slate-400'
|
||||
}`}
|
||||
>
|
||||
<option value="">
|
||||
{account.accountTypeLabel ? `Auto — ${account.accountTypeLabel}` : 'Auto — unassigned'}
|
||||
</option>
|
||||
{firm.accounts.map((type) => (
|
||||
<option key={type.id} value={type.id}>
|
||||
{type.label} · {type.prefix} · {type.accountSize >= 1000 ? `${type.accountSize / 1000}k` : type.accountSize}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
|
||||
{account.assignmentSource === 'manual' && (
|
||||
<span className="w-1.5 h-1.5 rounded-full bg-blue-400 shrink-0" title="Pinned by hand" />
|
||||
)}
|
||||
{account.accountTypeAmbiguous && (
|
||||
<span className="text-amber-500 text-xs font-bold shrink-0" title="Several account types matched — using the most recently updated one">*</span>
|
||||
)}
|
||||
{danglingPin && (
|
||||
<span className="text-amber-600 text-xs shrink-0" title="The pinned account type no longer exists on the master — this account will not trade">!</span>
|
||||
)}
|
||||
{!account.accountTypeLabel && !danglingPin && (
|
||||
<span className="inline-block px-1.5 py-0.5 rounded text-[10px] font-semibold bg-amber-100 text-amber-700 shrink-0">
|
||||
Unassigned
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
/** Inline credential entry, shown to the right of a firm that has none. */
|
||||
function CredentialForm({ firm, onSaved }: { firm: FirmConfig; onSaved: () => void }) {
|
||||
const [username, setUsername] = useState('');
|
||||
const [password, setPassword] = useState('');
|
||||
const [saving, setSaving] = useState(false);
|
||||
const [error, setError] = useState('');
|
||||
|
||||
async function save() {
|
||||
if (!username.trim() || !password.trim()) return;
|
||||
setSaving(true);
|
||||
setError('');
|
||||
try {
|
||||
const res = await fetch(`/api/firms/${firm.id}/credentials`, {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ username, password }),
|
||||
});
|
||||
if (!res.ok) throw new Error((await res.json().catch(() => ({}))).error ?? 'Failed');
|
||||
setUsername('');
|
||||
setPassword('');
|
||||
onSaved();
|
||||
} catch (err) {
|
||||
setError(err instanceof Error ? err.message : 'Failed');
|
||||
} finally {
|
||||
setSaving(false);
|
||||
}
|
||||
}
|
||||
|
||||
const cls = 'border border-slate-200 rounded-md px-2 py-1 text-xs bg-white focus:outline-none focus:ring-1 focus:ring-blue-400 w-32';
|
||||
|
||||
return (
|
||||
<div className="flex items-center gap-1.5" onClick={(e) => e.stopPropagation()}>
|
||||
<input
|
||||
className={cls}
|
||||
placeholder="Tradovate username"
|
||||
value={username}
|
||||
onChange={(e) => setUsername(e.target.value)}
|
||||
/>
|
||||
<input
|
||||
className={cls}
|
||||
type="password"
|
||||
placeholder="Password"
|
||||
value={password}
|
||||
onChange={(e) => setPassword(e.target.value)}
|
||||
onKeyDown={(e) => { if (e.key === 'Enter') void save(); }}
|
||||
/>
|
||||
<button
|
||||
onClick={save}
|
||||
disabled={saving || !username.trim() || !password.trim()}
|
||||
className="px-2.5 py-1 bg-blue-100 hover:bg-blue-200 disabled:opacity-50 text-blue-700 text-xs font-semibold rounded-md transition-colors"
|
||||
>
|
||||
{saving ? '…' : 'Save'}
|
||||
</button>
|
||||
{error && <span className="text-xs text-red-500">{error}</span>}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function AccountRow({ account, firm, hideDead, privacy, onAssigned }: {
|
||||
account: AccountState;
|
||||
firm: FirmConfig;
|
||||
hideDead: boolean;
|
||||
privacy: boolean;
|
||||
onAssigned: () => void;
|
||||
}) {
|
||||
const cfg = account.accountType;
|
||||
const dead = isAccountDead(account);
|
||||
|
||||
if (hideDead && dead) return null;
|
||||
@@ -132,6 +269,9 @@ function AccountRow({ account, firm, hideDead, privacy }: { account: AccountStat
|
||||
<td className={`px-4 py-3 tabular-nums ${pnlColor}`}>
|
||||
{account.realizedPnL >= 0 ? '+' : ''}${fmt(account.realizedPnL)}
|
||||
</td>
|
||||
<td className="px-4 py-3">
|
||||
<AccountTypeCell account={account} firm={firm} onAssigned={onAssigned} />
|
||||
</td>
|
||||
<td className="px-4 py-3 text-slate-600 tabular-nums">
|
||||
{account.daysTraded} / {cfg?.minTradingDays ?? '—'}
|
||||
</td>
|
||||
@@ -173,19 +313,35 @@ function AccountRow({ account, firm, hideDead, privacy }: { account: AccountStat
|
||||
);
|
||||
}
|
||||
|
||||
function FirmRows({ state, firm, deleteMode, selected, onToggle, hideDead, privacy, sortKey, sortDir, tradeSymbol }: {
|
||||
function FirmRows({ state, firm, hideDead, privacy, sortKey, sortDir, tradeSymbol, onChanged }: {
|
||||
state: FirmState;
|
||||
firm: FirmConfig;
|
||||
deleteMode: boolean;
|
||||
selected: boolean;
|
||||
onToggle: () => void;
|
||||
hideDead: boolean;
|
||||
privacy: boolean;
|
||||
sortKey: SortKey | null;
|
||||
sortDir: SortDir;
|
||||
tradeSymbol: string;
|
||||
onChanged: () => void;
|
||||
}) {
|
||||
const [open, setOpen] = useState(true);
|
||||
const [confirmCreds, setConfirmCreds] = useState(false);
|
||||
const [removingCreds, setRemovingCreds] = useState(false);
|
||||
const hasCredentials = firm.hasCredentials;
|
||||
|
||||
// Clearing the login drops the Tradovate client, so the firm's accounts go
|
||||
// with it until someone enters one again — worth a confirm step.
|
||||
async function removeCredentials() {
|
||||
setRemovingCreds(true);
|
||||
try {
|
||||
await fetch(`/api/firms/${firm.id}/credentials`, { method: 'DELETE' });
|
||||
onChanged();
|
||||
} catch {
|
||||
/* the row simply stays as it was */
|
||||
} finally {
|
||||
setRemovingCreds(false);
|
||||
setConfirmCreds(false);
|
||||
}
|
||||
}
|
||||
|
||||
const sortedAccounts = sortKey === null ? state.accounts : [...state.accounts].sort((a, b) => {
|
||||
const dir = sortDir === 'asc' ? 1 : -1;
|
||||
@@ -195,8 +351,8 @@ function FirmRows({ state, firm, deleteMode, selected, onToggle, hideDead, priva
|
||||
case 'dayPnL': return dir * (a.realizedPnL - b.realizedPnL);
|
||||
case 'daysTraded': return dir * (a.daysTraded - b.daysTraded);
|
||||
case 'target': {
|
||||
const at = getAccountConfig(a.name, firm)?.profitTarget ?? 0;
|
||||
const bt = getAccountConfig(b.name, firm)?.profitTarget ?? 0;
|
||||
const at = a.effectiveProfitTarget ?? a.accountType?.profitTarget ?? 0;
|
||||
const bt = b.effectiveProfitTarget ?? b.accountType?.profitTarget ?? 0;
|
||||
return dir * (at - bt);
|
||||
}
|
||||
case 'status': return dir * (statusRank(a) - statusRank(b));
|
||||
@@ -207,54 +363,100 @@ function FirmRows({ state, firm, deleteMode, selected, onToggle, hideDead, priva
|
||||
return (
|
||||
<>
|
||||
<tr
|
||||
className="border-t border-slate-200 bg-slate-50 hover:bg-slate-100 cursor-pointer select-none transition-colors"
|
||||
onClick={() => setOpen((o) => !o)}
|
||||
className={`border-t border-slate-200 bg-slate-50 transition-colors ${
|
||||
hasCredentials ? 'hover:bg-slate-100 cursor-pointer select-none' : 'opacity-50'
|
||||
}`}
|
||||
onClick={() => { if (hasCredentials) setOpen((o) => !o); }}
|
||||
>
|
||||
<td className="px-4 py-3.5">
|
||||
<div className="flex items-center gap-2.5">
|
||||
{deleteMode && (
|
||||
<input
|
||||
type="checkbox"
|
||||
checked={selected}
|
||||
onChange={onToggle}
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
className="w-4 h-4 accent-red-500 cursor-pointer flex-shrink-0"
|
||||
/>
|
||||
)}
|
||||
<span className="font-bold text-sm text-slate-800">{state.firm}</span>
|
||||
<span className="font-bold text-sm text-slate-800">{firm.firm}</span>
|
||||
{firm.bannedSymbols?.includes(tradeSymbol) && (
|
||||
<span className="text-xs bg-red-100 text-red-700 px-1.5 py-0.5 rounded font-semibold">
|
||||
{tradeSymbol} BANNED
|
||||
</span>
|
||||
)}
|
||||
{hasCredentials && !state.connected && (
|
||||
<span className="text-xs bg-slate-200 text-slate-600 px-1.5 py-0.5 rounded font-semibold">
|
||||
Connecting…
|
||||
</span>
|
||||
)}
|
||||
{hasCredentials && state.connected && state.accounts.length === 0 && (
|
||||
<span className="text-xs bg-slate-100 text-slate-500 px-1.5 py-0.5 rounded font-semibold">
|
||||
No accounts
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
</td>
|
||||
<td /><td /><td /><td />
|
||||
{!hasCredentials ? (
|
||||
<td colSpan={5} className="px-4 py-2.5">
|
||||
<CredentialForm firm={firm} onSaved={onChanged} />
|
||||
</td>
|
||||
) : confirmCreds ? (
|
||||
<td colSpan={5} className="px-4 py-2.5">
|
||||
<div className="flex items-center gap-2" onClick={(e) => e.stopPropagation()}>
|
||||
<span className="text-xs text-slate-500">
|
||||
Remove the saved Tradovate login for {firm.firm}? Its accounts disappear until you enter one again.
|
||||
</span>
|
||||
<button
|
||||
onClick={removeCredentials}
|
||||
disabled={removingCreds}
|
||||
className="px-2.5 py-1 bg-red-100 hover:bg-red-200 disabled:opacity-50 text-red-700 text-xs font-semibold rounded-md transition-colors"
|
||||
>
|
||||
{removingCreds ? '…' : 'Remove'}
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setConfirmCreds(false)}
|
||||
className="px-2.5 py-1 bg-slate-100 hover:bg-slate-200 text-slate-600 text-xs font-semibold rounded-md transition-colors"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
) : (
|
||||
<><td /><td /><td /><td /><td /></>
|
||||
)}
|
||||
<td className="px-4 py-3.5">
|
||||
<div className="flex items-center justify-end gap-1">
|
||||
{hasCredentials && !confirmCreds && (
|
||||
<button
|
||||
onClick={(e) => { e.stopPropagation(); setConfirmCreds(true); }}
|
||||
className="text-slate-400 hover:text-red-500 hover:bg-red-50 p-1 rounded-md transition-colors inline-flex"
|
||||
title="Remove saved Tradovate login"
|
||||
>
|
||||
<KeyOffIcon />
|
||||
</button>
|
||||
)}
|
||||
<Link
|
||||
href={`/firms/${firm.id}/settings`}
|
||||
className="text-slate-400 hover:text-slate-600 hover:bg-slate-200 p-1 rounded-md transition-colors inline-flex"
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
title="Settings"
|
||||
title="Account types"
|
||||
>
|
||||
<SettingsIcon />
|
||||
</Link>
|
||||
<ChevronIcon open={open} />
|
||||
{hasCredentials && <ChevronIcon open={open} />}
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
{open && (
|
||||
{open && hasCredentials && (
|
||||
state.accounts.length === 0 ? (
|
||||
<tr>
|
||||
<td colSpan={6} className="px-4 py-5 pl-12 text-sm text-slate-400 italic">
|
||||
Waiting for data...
|
||||
<td colSpan={7} className="px-4 py-5 pl-12 text-sm text-slate-400 italic">
|
||||
{state.connected ? 'No accounts at this firm' : 'Connecting to Tradovate…'}
|
||||
</td>
|
||||
</tr>
|
||||
) : (
|
||||
sortedAccounts.map((acc) => (
|
||||
<AccountRow key={acc.id} account={acc} firm={firm} hideDead={hideDead} privacy={privacy} />
|
||||
<AccountRow
|
||||
key={acc.id}
|
||||
account={acc}
|
||||
firm={firm}
|
||||
hideDead={hideDead}
|
||||
privacy={privacy}
|
||||
onAssigned={onChanged}
|
||||
/>
|
||||
))
|
||||
)
|
||||
)}
|
||||
@@ -273,11 +475,9 @@ interface SchedulerStatus {
|
||||
}
|
||||
|
||||
export default function Home() {
|
||||
const router = useRouter();
|
||||
const [config, setConfig] = useState<FirmConfig[]>([]);
|
||||
const [firms, setFirms] = useState<FirmState[]>([]);
|
||||
const [deleteMode, setDeleteMode] = useState(false);
|
||||
const [selected, setSelected] = useState<Set<number>>(new Set());
|
||||
const [catalog, setCatalog] = useState<{ lastSyncAt: string | null; lastError: string | null; masterUrl: string | null } | null>(null);
|
||||
const [hideDead, setHideDead] = useState(false);
|
||||
const [privacy, setPrivacy] = useState(false);
|
||||
const [sortKey, setSortKey] = useState<SortKey | null>(null);
|
||||
@@ -313,6 +513,21 @@ export default function Home() {
|
||||
}
|
||||
};
|
||||
|
||||
const fetchCatalog = async () => {
|
||||
try {
|
||||
const res = await fetch('/api/firm-catalog');
|
||||
if (res.ok) setCatalog(await res.json());
|
||||
} catch { /* server not running yet */ }
|
||||
};
|
||||
|
||||
const syncCatalogNow = async () => {
|
||||
try {
|
||||
await fetch('/api/firm-catalog', { method: 'POST' });
|
||||
} catch { /* ignore */ }
|
||||
fetchCatalog();
|
||||
fetchConfig();
|
||||
};
|
||||
|
||||
const fetchScheduler = async () => {
|
||||
try {
|
||||
const res = await fetch('/api/auto-trade');
|
||||
@@ -338,6 +553,7 @@ export default function Home() {
|
||||
.catch(() => {});
|
||||
|
||||
fetchConfig();
|
||||
fetchCatalog();
|
||||
fetchScheduler();
|
||||
|
||||
const fetchState = async () => {
|
||||
@@ -390,56 +606,17 @@ export default function Home() {
|
||||
|
||||
// Count dead accounts across all firms for the toggle button label
|
||||
const deadCount = firms.reduce((total, firmState) => {
|
||||
const firmCfg = config.find((c) => c.firm === firmState.firm);
|
||||
const firmCfg = config.find((c) => c.id === firmState.firmId);
|
||||
if (!firmCfg) return total;
|
||||
return total + firmState.accounts.filter((acc) => isAccountDead(acc)).length;
|
||||
}, 0);
|
||||
|
||||
const handleConfirmDelete = async () => {
|
||||
await Promise.all(
|
||||
[...selected].map((id) =>
|
||||
fetch(`/api/firms/${id}`, { method: 'DELETE' }).catch(() => {})
|
||||
)
|
||||
);
|
||||
setSelected(new Set());
|
||||
setDeleteMode(false);
|
||||
fetchConfig();
|
||||
};
|
||||
|
||||
const toggleSelected = (id: number) => {
|
||||
setSelected((prev) => {
|
||||
const next = new Set(prev);
|
||||
if (next.has(id)) next.delete(id);
|
||||
else next.add(id);
|
||||
return next;
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-slate-50 p-8">
|
||||
<div className="max-w-7xl mx-auto">
|
||||
<div className="flex items-center justify-between mb-6">
|
||||
<h1 className="text-2xl font-bold text-slate-900">AutoTrader</h1>
|
||||
<div className="flex items-center gap-2">
|
||||
{deleteMode ? (
|
||||
<>
|
||||
{selected.size > 0 && (
|
||||
<button
|
||||
onClick={handleConfirmDelete}
|
||||
className="px-4 py-2 bg-red-100 hover:bg-red-200 text-red-700 text-sm font-semibold rounded-lg transition-colors"
|
||||
>
|
||||
Confirm Delete ({selected.size})
|
||||
</button>
|
||||
)}
|
||||
<button
|
||||
onClick={() => { setDeleteMode(false); setSelected(new Set()); }}
|
||||
className="px-4 py-2 text-sm text-slate-600 hover:text-slate-800 border border-slate-200 bg-white rounded-lg transition-colors"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
{deadCount > 0 && (
|
||||
<button
|
||||
onClick={() => setHideDead((h) => !h)}
|
||||
@@ -452,18 +629,6 @@ export default function Home() {
|
||||
{hideDead ? `Show Dead (${deadCount})` : `Hide Dead (${deadCount})`}
|
||||
</button>
|
||||
)}
|
||||
<button
|
||||
onClick={() => router.push('/add')}
|
||||
className="px-4 py-2 bg-green-100 hover:bg-green-200 text-green-700 text-sm font-semibold rounded-lg transition-colors"
|
||||
>
|
||||
+ Add New
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setDeleteMode(true)}
|
||||
className="px-4 py-2 bg-red-100 hover:bg-red-200 text-red-700 text-sm font-semibold rounded-lg transition-colors"
|
||||
>
|
||||
Delete
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setPrivacy((p) => !p)}
|
||||
className={`px-3 py-2 rounded-lg transition-colors inline-flex items-center ${privacy ? 'text-blue-600 bg-blue-50 hover:bg-blue-100' : 'text-slate-400 hover:text-slate-600 hover:bg-slate-100'}`}
|
||||
@@ -478,8 +643,6 @@ export default function Home() {
|
||||
>
|
||||
<SettingsIcon />
|
||||
</Link>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
{/* ── Trade Controls ── */}
|
||||
@@ -607,6 +770,7 @@ export default function Home() {
|
||||
<SortHeader label="Account" col="name" sortKey={sortKey} sortDir={sortDir} onSort={handleSort} />
|
||||
<SortHeader label="Balance" col="balance" sortKey={sortKey} sortDir={sortDir} onSort={handleSort} />
|
||||
<SortHeader label="Day P&L" col="dayPnL" sortKey={sortKey} sortDir={sortDir} onSort={handleSort} />
|
||||
<th className="px-4 py-3 text-left text-xs font-semibold uppercase tracking-wider text-slate-400">Account Type</th>
|
||||
<SortHeader label="Days Traded" col="daysTraded" sortKey={sortKey} sortDir={sortDir} onSort={handleSort} />
|
||||
<SortHeader label="Target" col="target" sortKey={sortKey} sortDir={sortDir} onSort={handleSort} />
|
||||
<SortHeader label="Status" col="status" sortKey={sortKey} sortDir={sortDir} onSort={handleSort} />
|
||||
@@ -615,26 +779,39 @@ export default function Home() {
|
||||
<tbody>
|
||||
{config.length === 0 ? (
|
||||
<tr>
|
||||
<td colSpan={6} className="px-4 py-8 text-center text-sm text-slate-400 italic">
|
||||
No firms yet — click + Add New to get started
|
||||
<td colSpan={7} className="px-4 py-8 text-center text-sm text-slate-400 italic">
|
||||
{catalog && catalog.lastSyncAt === null ? (
|
||||
<>
|
||||
Catalog never synced — cannot reach {catalog.masterUrl ?? 'the master dashboard'}
|
||||
{catalog.lastError && <><br />{catalog.lastError}</>}
|
||||
<br />
|
||||
<button
|
||||
onClick={syncCatalogNow}
|
||||
className="mt-2 px-3 py-1 bg-slate-100 hover:bg-slate-200 text-slate-600 text-xs font-semibold rounded-md not-italic transition-colors"
|
||||
>
|
||||
Retry
|
||||
</button>
|
||||
</>
|
||||
) : (
|
||||
<>No firms yet — add them on the master dashboard</>
|
||||
)}
|
||||
</td>
|
||||
</tr>
|
||||
) : (
|
||||
config.map((cfg) => {
|
||||
const state = firms.find((f) => f.firm === cfg.firm) ?? { firm: cfg.firm, connected: false, accounts: [] };
|
||||
const state = firms.find((f) => f.firmId === cfg.id)
|
||||
?? { firmId: cfg.id, firm: cfg.firm, connected: false, accounts: [] };
|
||||
return (
|
||||
<FirmRows
|
||||
key={cfg.id}
|
||||
state={state}
|
||||
firm={cfg}
|
||||
deleteMode={deleteMode}
|
||||
selected={selected.has(cfg.id)}
|
||||
onToggle={() => toggleSelected(cfg.id)}
|
||||
hideDead={hideDead}
|
||||
privacy={privacy}
|
||||
sortKey={sortKey}
|
||||
sortDir={sortDir}
|
||||
tradeSymbol={tradeSymbol}
|
||||
onChanged={fetchConfig}
|
||||
/>
|
||||
);
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user