Implement adjudicated DO items across backend, frontend, deploy
From the ROADMAP adjudication (12 of 13 DO items; D2 is a commit action). Backend: - B3: pytest suite (auth, entity CRUD, rollup) + dev deps + pytest config - B4: cap document uploads at TEN31_MAX_UPLOAD_SIZE (default 50MB), stream- checked with partial-file cleanup, 413 on overflow - B7: type AuditLog.detail as dict|list|str|None to match the JSON column - B10: index foreign-key columns (migration a7b8c9d0e1f2 + index=True) - B11: cli delete-user logs file-removal errors instead of swallowing them Frontend: - F2: distinguish "server unreachable" from "logged out"; retry prompt - F4: confirm before destructive holdings-replace on import; step progress - F6: expandable audit-log detail with full JSON - F7: empty-state on the Investments page - F8: shared role helpers (WRITER_ROLES/canEditRound/isApprover), used by EntitiesList, AuditLog, Import, ValuationWorkflow Deploy: - D5: run tsc --noEmit before packaging (build script) - D6: TEN31_LOG_LEVEL env var (defaults to info) Verified: 8/8 backend tests pass; alembic upgrades to head with 13 FK indexes; upload limit rejects oversized + cleans up; frontend tsc + vite build clean; dev server serves and proxies to the API.
This commit is contained in:
Jonathan Kirkwood
@@ -1,5 +1,5 @@
|
||||
import { useEffect, useState } from "react";
|
||||
import { api, type AuditEntry } from "../api";
|
||||
import { Fragment, useEffect, useState } from "react";
|
||||
import { api, isAdmin, type AuditEntry } from "../api";
|
||||
import { useAuth } from "../context/AuthContext";
|
||||
import { formatDate } from "../format";
|
||||
|
||||
@@ -9,8 +9,9 @@ export default function AuditLog() {
|
||||
const [page, setPage] = useState(1);
|
||||
const [filterType, setFilterType] = useState("");
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [expandedId, setExpandedId] = useState<number | null>(null);
|
||||
|
||||
const canView = user && ["approver", "cfo"].includes(user.role);
|
||||
const canView = user && isAdmin(user.role);
|
||||
|
||||
useEffect(() => {
|
||||
if (!canView) return;
|
||||
@@ -32,7 +33,7 @@ export default function AuditLog() {
|
||||
if (!canView) {
|
||||
return (
|
||||
<div className="text-gray-500 text-sm">
|
||||
Audit log requires approver or CFO role.
|
||||
Audit log requires Managing Partner, Operations, or CFO role.
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -73,7 +74,7 @@ export default function AuditLog() {
|
||||
<div className="text-gray-500 text-sm">Loading...</div>
|
||||
) : (
|
||||
<>
|
||||
<div className="bg-white border border-gray-200 rounded-lg overflow-hidden">
|
||||
<div className="bg-white border border-gray-200 rounded-lg overflow-x-auto">
|
||||
<table className="w-full text-sm">
|
||||
<thead>
|
||||
<tr className="bg-gray-50 border-b border-gray-200">
|
||||
@@ -86,24 +87,50 @@ export default function AuditLog() {
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{entries.map((e) => (
|
||||
<tr key={e.id} className="border-b border-gray-100">
|
||||
<td className="px-4 py-2 text-gray-600 whitespace-nowrap">
|
||||
{formatDate(e.created_at)}
|
||||
</td>
|
||||
<td className="px-4 py-2">
|
||||
<span className={`inline-block px-2 py-0.5 text-xs rounded ${ACTION_COLORS[e.action] || "bg-gray-100 text-gray-600"}`}>
|
||||
{e.action}
|
||||
</span>
|
||||
</td>
|
||||
<td className="px-4 py-2 text-gray-700">{e.object_type}</td>
|
||||
<td className="px-4 py-2 text-gray-500">{e.object_id ?? "—"}</td>
|
||||
<td className="px-4 py-2 text-gray-600">#{e.actor_user_id ?? "system"}</td>
|
||||
<td className="px-4 py-2 text-gray-500 text-xs max-w-xs truncate">
|
||||
{e.detail ? JSON.stringify(e.detail) : "—"}
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
{entries.map((e) => {
|
||||
const hasDetail = e.detail != null;
|
||||
const detailText = hasDetail ? JSON.stringify(e.detail) : "—";
|
||||
const expanded = expandedId === e.id;
|
||||
return (
|
||||
<Fragment key={e.id}>
|
||||
<tr className="border-b border-gray-100">
|
||||
<td className="px-4 py-2 text-gray-600 whitespace-nowrap">
|
||||
{formatDate(e.created_at)}
|
||||
</td>
|
||||
<td className="px-4 py-2">
|
||||
<span className={`inline-block px-2 py-0.5 text-xs rounded ${ACTION_COLORS[e.action] || "bg-gray-100 text-gray-600"}`}>
|
||||
{e.action}
|
||||
</span>
|
||||
</td>
|
||||
<td className="px-4 py-2 text-gray-700">{e.object_type}</td>
|
||||
<td className="px-4 py-2 text-gray-500">{e.object_id ?? "—"}</td>
|
||||
<td className="px-4 py-2 text-gray-600">#{e.actor_user_id ?? "system"}</td>
|
||||
<td className="px-4 py-2 text-gray-500 text-xs">
|
||||
{hasDetail ? (
|
||||
<button
|
||||
onClick={() => setExpandedId(expanded ? null : e.id)}
|
||||
title={detailText}
|
||||
className="block max-w-xs truncate text-left hover:text-gray-700 underline decoration-dotted"
|
||||
>
|
||||
{detailText}
|
||||
</button>
|
||||
) : (
|
||||
"—"
|
||||
)}
|
||||
</td>
|
||||
</tr>
|
||||
{expanded && hasDetail && (
|
||||
<tr className="border-b border-gray-100 bg-gray-50">
|
||||
<td colSpan={6} className="px-4 py-2">
|
||||
<pre className="text-xs text-gray-700 whitespace-pre-wrap break-all">
|
||||
{JSON.stringify(e.detail, null, 2)}
|
||||
</pre>
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
</Fragment>
|
||||
);
|
||||
})}
|
||||
{entries.length === 0 && (
|
||||
<tr>
|
||||
<td className="px-4 py-6 text-center text-gray-400" colSpan={6}>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { useEffect, useState } from "react";
|
||||
import { useEffect, useMemo, useState } from "react";
|
||||
import { Link } from "react-router-dom";
|
||||
import { api, type EntityType } from "../api";
|
||||
import { api, WRITER_ROLES, type EntityType } from "../api";
|
||||
import { useAuth } from "../context/AuthContext";
|
||||
import { formatMoney, formatGainLoss } from "../format";
|
||||
|
||||
@@ -11,6 +11,7 @@ interface EntityRow {
|
||||
vintage_year: number | null;
|
||||
fund_size_cents: number | null;
|
||||
status: string;
|
||||
committedCents: number;
|
||||
investedCents: number;
|
||||
lastValueCents: number;
|
||||
}
|
||||
@@ -22,8 +23,6 @@ const TYPE_LABELS: Record<string, string> = {
|
||||
mgmt_co: "Mgmt Co",
|
||||
};
|
||||
|
||||
const WRITER_ROLES = ["fund_admin", "cfo", "approver"];
|
||||
|
||||
export default function EntitiesList() {
|
||||
const { user } = useAuth();
|
||||
const [entities, setEntities] = useState<EntityRow[]>([]);
|
||||
@@ -48,6 +47,7 @@ export default function EntitiesList() {
|
||||
vintage_year: r.vintage_year,
|
||||
fund_size_cents: r.fund_size_cents,
|
||||
status: r.status,
|
||||
committedCents: r.committed_cents,
|
||||
investedCents: r.invested_cents,
|
||||
lastValueCents: r.last_signed_value_cents,
|
||||
})),
|
||||
@@ -219,28 +219,126 @@ function AddEntityForm({
|
||||
);
|
||||
}
|
||||
|
||||
type SortKey = "name" | "type" | "vintage" | "committed" | "invested" | "value" | "gain";
|
||||
|
||||
function EntityTable({ title, rows }: { title: string; rows: EntityRow[] }) {
|
||||
const [sortKey, setSortKey] = useState<SortKey>("name");
|
||||
const [dir, setDir] = useState<1 | -1>(1);
|
||||
|
||||
const totalCommitted = rows.reduce((s, r) => s + r.committedCents, 0);
|
||||
const totalInvested = rows.reduce((s, r) => s + r.investedCents, 0);
|
||||
const totalValue = rows.reduce((s, r) => s + r.lastValueCents, 0);
|
||||
const totalGain = totalValue - totalInvested;
|
||||
|
||||
const sorted = useMemo(() => {
|
||||
const val = (r: EntityRow): string | number => {
|
||||
switch (sortKey) {
|
||||
case "name": return r.name.toLowerCase();
|
||||
case "type": return r.type;
|
||||
case "vintage": return r.vintage_year ?? -Infinity;
|
||||
case "committed": return r.committedCents;
|
||||
case "invested": return r.investedCents;
|
||||
case "value": return r.lastValueCents;
|
||||
case "gain": return r.lastValueCents - r.investedCents;
|
||||
}
|
||||
};
|
||||
return [...rows].sort((a, b) => {
|
||||
const av = val(a), bv = val(b);
|
||||
if (av < bv) return -1 * dir;
|
||||
if (av > bv) return 1 * dir;
|
||||
return 0;
|
||||
});
|
||||
}, [rows, sortKey, dir]);
|
||||
|
||||
const sortBy = (key: SortKey) => {
|
||||
if (key === sortKey) setDir((d) => (d === 1 ? -1 : 1));
|
||||
else { setSortKey(key); setDir(1); }
|
||||
};
|
||||
|
||||
const arrow = (key: SortKey) => (sortKey === key ? (dir === 1 ? " ↑" : " ↓") : "");
|
||||
const Th = ({ k, label, align = "left" }: { k: SortKey; label: string; align?: "left" | "right" }) => {
|
||||
const a = align === "right" ? "text-right" : "text-left";
|
||||
return (
|
||||
<th className={`px-4 py-3 font-medium text-gray-600 select-none ${a}`}>
|
||||
<button onClick={() => sortBy(k)} className={`w-full hover:text-gray-900 ${a}`}>
|
||||
{label}<span className="text-orange-500">{arrow(k)}</span>
|
||||
</button>
|
||||
</th>
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<div>
|
||||
<h2 className="text-lg font-semibold text-gray-900 mb-3">{title}</h2>
|
||||
<div className="bg-white border border-gray-200 rounded-lg overflow-hidden">
|
||||
<table className="w-full text-sm">
|
||||
|
||||
{/* Mobile: stacked cards (a wide financial table doesn't fit a phone) */}
|
||||
<div className="md:hidden space-y-3">
|
||||
{sorted.map((row) => {
|
||||
const gl = formatGainLoss(row.lastValueCents, row.investedCents);
|
||||
return (
|
||||
<Link
|
||||
key={row.id}
|
||||
to={`/entities/${row.id}`}
|
||||
className="block bg-white border border-gray-200 rounded-lg p-4 active:bg-gray-50"
|
||||
>
|
||||
<div className="flex items-start justify-between gap-2">
|
||||
<span className="font-medium text-gray-900">{row.name}</span>
|
||||
<span className="shrink-0 inline-block px-2 py-0.5 bg-gray-100 text-gray-600 text-xs rounded">
|
||||
{TYPE_LABELS[row.type] || row.type}
|
||||
</span>
|
||||
</div>
|
||||
{row.vintage_year && (
|
||||
<div className="mt-0.5 text-xs text-gray-400">Vintage {row.vintage_year}</div>
|
||||
)}
|
||||
<div className="grid grid-cols-2 gap-x-4 gap-y-2 mt-3">
|
||||
<CardMetric label="Committed" value={formatMoney(row.committedCents)} />
|
||||
<CardMetric label="Invested" value={formatMoney(row.investedCents)} />
|
||||
<CardMetric label="Last value" value={formatMoney(row.lastValueCents)} />
|
||||
<CardMetric
|
||||
label="Gain/Loss"
|
||||
value={`${gl.positive ? "+" : "-"}${gl.text}`}
|
||||
valueClass={gl.positive ? "text-green-600" : "text-red-600"}
|
||||
/>
|
||||
</div>
|
||||
</Link>
|
||||
);
|
||||
})}
|
||||
{rows.length > 0 && (
|
||||
<div className="bg-gray-50 border border-gray-200 rounded-lg p-4">
|
||||
<div className="text-xs font-medium text-gray-500 uppercase mb-2">Total</div>
|
||||
<div className="grid grid-cols-2 gap-x-4 gap-y-2">
|
||||
<CardMetric label="Committed" value={formatMoney(totalCommitted)} />
|
||||
<CardMetric label="Invested" value={formatMoney(totalInvested)} />
|
||||
<CardMetric label="Last value" value={formatMoney(totalValue)} />
|
||||
<CardMetric
|
||||
label="Gain/Loss"
|
||||
value={`${totalGain >= 0 ? "+" : "-"}${formatMoney(Math.abs(totalGain))}`}
|
||||
valueClass={totalGain >= 0 ? "text-green-600" : "text-red-600"}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
{rows.length === 0 && (
|
||||
<p className="text-sm text-gray-400 px-1">No entities yet.</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Desktop: full sortable table */}
|
||||
<div className="hidden md:block bg-white border border-gray-200 rounded-lg overflow-x-auto">
|
||||
<table className="w-full min-w-[46rem] text-sm">
|
||||
<thead>
|
||||
<tr className="bg-gray-50 border-b border-gray-200">
|
||||
<th className="text-left px-4 py-3 font-medium text-gray-600">Name</th>
|
||||
<th className="text-left px-4 py-3 font-medium text-gray-600">Type</th>
|
||||
<th className="text-left px-4 py-3 font-medium text-gray-600">Vintage</th>
|
||||
<th className="text-right px-4 py-3 font-medium text-gray-600">Invested</th>
|
||||
<th className="text-right px-4 py-3 font-medium text-gray-600">Last Signed Value</th>
|
||||
<th className="text-right px-4 py-3 font-medium text-gray-600">Gain/Loss</th>
|
||||
<Th k="name" label="Name" />
|
||||
<Th k="type" label="Type" />
|
||||
<Th k="vintage" label="Vintage" />
|
||||
<Th k="committed" label="Committed" align="right" />
|
||||
<Th k="invested" label="Invested" align="right" />
|
||||
<Th k="value" label="Last Signed Value" align="right" />
|
||||
<Th k="gain" label="Gain/Loss" align="right" />
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{rows.map((row) => {
|
||||
{sorted.map((row) => {
|
||||
const gl = formatGainLoss(row.lastValueCents, row.investedCents);
|
||||
return (
|
||||
<tr key={row.id} className="border-b border-gray-100 hover:bg-gray-50">
|
||||
@@ -258,6 +356,7 @@ function EntityTable({ title, rows }: { title: string; rows: EntityRow[] }) {
|
||||
</span>
|
||||
</td>
|
||||
<td className="px-4 py-3 text-gray-600">{row.vintage_year || "—"}</td>
|
||||
<td className="px-4 py-3 text-right text-gray-900">{formatMoney(row.committedCents)}</td>
|
||||
<td className="px-4 py-3 text-right text-gray-900">{formatMoney(row.investedCents)}</td>
|
||||
<td className="px-4 py-3 text-right text-gray-900">{formatMoney(row.lastValueCents)}</td>
|
||||
<td className={`px-4 py-3 text-right font-medium ${gl.positive ? "text-green-600" : "text-red-600"}`}>
|
||||
@@ -271,6 +370,7 @@ function EntityTable({ title, rows }: { title: string; rows: EntityRow[] }) {
|
||||
<td className="px-4 py-3 text-gray-900" colSpan={3}>
|
||||
Total
|
||||
</td>
|
||||
<td className="px-4 py-3 text-right text-gray-900">{formatMoney(totalCommitted)}</td>
|
||||
<td className="px-4 py-3 text-right text-gray-900">{formatMoney(totalInvested)}</td>
|
||||
<td className="px-4 py-3 text-right text-gray-900">{formatMoney(totalValue)}</td>
|
||||
<td className={`px-4 py-3 text-right ${totalGain >= 0 ? "text-green-600" : "text-red-600"}`}>
|
||||
@@ -280,7 +380,7 @@ function EntityTable({ title, rows }: { title: string; rows: EntityRow[] }) {
|
||||
)}
|
||||
{rows.length === 0 && (
|
||||
<tr>
|
||||
<td className="px-4 py-6 text-center text-gray-400" colSpan={6}>
|
||||
<td className="px-4 py-6 text-center text-gray-400" colSpan={7}>
|
||||
No entities yet.
|
||||
</td>
|
||||
</tr>
|
||||
@@ -291,3 +391,20 @@ function EntityTable({ title, rows }: { title: string; rows: EntityRow[] }) {
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function CardMetric({
|
||||
label,
|
||||
value,
|
||||
valueClass = "text-gray-900",
|
||||
}: {
|
||||
label: string;
|
||||
value: string;
|
||||
valueClass?: string;
|
||||
}) {
|
||||
return (
|
||||
<div>
|
||||
<div className="text-xs text-gray-400 uppercase">{label}</div>
|
||||
<div className={`text-sm font-medium ${valueClass}`}>{value}</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
+361
-337
@@ -1,382 +1,406 @@
|
||||
import { useEffect, useRef, useState } from "react";
|
||||
import { api, type Entity, type EntityType } from "../api";
|
||||
import { useEffect, useState } from "react";
|
||||
import { api, isAdmin, type Entity, type EntityType, type CapitalImportPreview } from "../api";
|
||||
import { useAuth } from "../context/AuthContext";
|
||||
import { formatMoneyExact } from "../format";
|
||||
|
||||
type EntityMode = "existing" | "from_file";
|
||||
|
||||
type Decision = {
|
||||
action: "match" | "create" | "skip";
|
||||
source_name: string;
|
||||
external_id: string | null;
|
||||
matched_username: string | null;
|
||||
user_id: number | null;
|
||||
value_dollars: number;
|
||||
commitment_dollars: number;
|
||||
contributions_dollars: number;
|
||||
distributions_dollars: number;
|
||||
// create fields
|
||||
name: string;
|
||||
username: string;
|
||||
email: string;
|
||||
};
|
||||
|
||||
export default function Import() {
|
||||
const { user } = useAuth();
|
||||
const [entities, setEntities] = useState<Entity[]>([]);
|
||||
const [entityMode, setEntityMode] = useState<EntityMode>("from_file");
|
||||
const [entityMode, setEntityMode] = useState<EntityMode>("existing");
|
||||
const [entityId, setEntityId] = useState("");
|
||||
const [createType, setCreateType] = useState<EntityType>("fund");
|
||||
const [vintageYear, setVintageYear] = useState("");
|
||||
const [asOf, setAsOf] = useState("");
|
||||
const [mode, setMode] = useState<"entities" | "schedule">("schedule");
|
||||
const [commit, setCommit] = useState(false);
|
||||
const [password, setPassword] = useState("");
|
||||
const [file, setFile] = useState<File | null>(null);
|
||||
const [replaceExisting, setReplaceExisting] = useState(false);
|
||||
|
||||
const [holdings, setHoldings] = useState<{ count: number; nav: number; sourceName: string | null } | null>(null);
|
||||
const [memberPv, setMemberPv] = useState<CapitalImportPreview | null>(null);
|
||||
const [decisions, setDecisions] = useState<Decision[]>([]);
|
||||
const [asOf, setAsOf] = useState("");
|
||||
|
||||
const [result, setResult] = useState<any>(null);
|
||||
const [error, setError] = useState("");
|
||||
const [loading, setLoading] = useState(false);
|
||||
const fileRef = useRef<HTMLInputElement>(null);
|
||||
const [busy, setBusy] = useState(false);
|
||||
const [step, setStep] = useState("");
|
||||
const [confirmReplace, setConfirmReplace] = useState(false);
|
||||
|
||||
const canImport = user && ["approver", "cfo"].includes(user.role);
|
||||
const canImport = user && isAdmin(user.role);
|
||||
const inputCls = "w-full px-3 py-2 border border-gray-300 rounded text-sm";
|
||||
|
||||
useEffect(() => {
|
||||
api.listEntities().then(setEntities);
|
||||
}, []);
|
||||
|
||||
async function handleImport() {
|
||||
if (!file) return;
|
||||
setError("");
|
||||
function reset() {
|
||||
setHoldings(null);
|
||||
setMemberPv(null);
|
||||
setDecisions([]);
|
||||
setResult(null);
|
||||
setLoading(true);
|
||||
setReplaceExisting(false);
|
||||
}
|
||||
|
||||
async function readEnav() {
|
||||
if (!file) return;
|
||||
if (entityMode === "existing" && !entityId) {
|
||||
setError("Select the fund, or choose 'Create from file'.");
|
||||
return;
|
||||
}
|
||||
setError("");
|
||||
setBusy(true);
|
||||
setResult(null);
|
||||
try {
|
||||
const form = new FormData();
|
||||
form.append("file", file);
|
||||
const eid = entityMode === "existing" ? Number(entityId) : undefined;
|
||||
// Holdings (dry run) + members preview from the same file.
|
||||
const [sched, members] = await Promise.all([
|
||||
api.scheduleImport(file, {
|
||||
commit: false,
|
||||
entityId: eid,
|
||||
password: password || undefined,
|
||||
createType,
|
||||
vintageYear,
|
||||
}),
|
||||
api.capitalImportPreview(file, eid as number, undefined, password || undefined),
|
||||
]);
|
||||
|
||||
const params = new URLSearchParams();
|
||||
params.set("commit", String(commit));
|
||||
|
||||
let url: string;
|
||||
if (mode === "entities") {
|
||||
url = `/api/import/entities?${params}`;
|
||||
} else {
|
||||
if (!asOf) {
|
||||
setError("Quarter-end date is required.");
|
||||
setLoading(false);
|
||||
return;
|
||||
}
|
||||
params.set("as_of", asOf);
|
||||
|
||||
if (entityMode === "existing") {
|
||||
if (!entityId) {
|
||||
setError("Select an entity.");
|
||||
setLoading(false);
|
||||
return;
|
||||
}
|
||||
params.set("entity_id", entityId);
|
||||
} else {
|
||||
// from_file mode: let backend resolve from row 1
|
||||
params.set("create_entity_type", createType);
|
||||
if (vintageYear) params.set("create_vintage_year", vintageYear);
|
||||
}
|
||||
url = `/api/import/schedule?${params}`;
|
||||
}
|
||||
|
||||
const res = await fetch(url, { method: "POST", body: form });
|
||||
let data: any;
|
||||
try {
|
||||
data = await res.json();
|
||||
} catch {
|
||||
setError(`Server error (${res.status}). Check file format and try again.`);
|
||||
setLoading(false);
|
||||
return;
|
||||
}
|
||||
if (!res.ok) {
|
||||
setError(data.detail || "Import failed");
|
||||
} else {
|
||||
setResult(data);
|
||||
// Refresh entity list after commit
|
||||
if (data.committed) {
|
||||
api.listEntities().then(setEntities);
|
||||
}
|
||||
}
|
||||
} catch (err: any) {
|
||||
setError(err.message);
|
||||
const nav = (sched.positions || []).reduce((s: number, p: any) => s + (p.value_cents || 0), 0);
|
||||
setHoldings({
|
||||
count: sched.positions?.length ?? 0,
|
||||
nav,
|
||||
sourceName: sched.source_entity_name ?? null,
|
||||
});
|
||||
setAsOf(members.as_of_date ?? sched.seed_round?.quarter_end ?? "");
|
||||
setMemberPv(members);
|
||||
setDecisions(
|
||||
members.investors.map((i) => ({
|
||||
action: i.matched_user_id ? "match" : "create",
|
||||
source_name: i.source_name,
|
||||
external_id: i.external_id,
|
||||
matched_username: i.matched_username,
|
||||
user_id: i.matched_user_id,
|
||||
value_dollars: i.value_dollars,
|
||||
commitment_dollars: i.commitment_dollars,
|
||||
contributions_dollars: i.contributions_dollars,
|
||||
distributions_dollars: i.distributions_dollars,
|
||||
name: i.source_name,
|
||||
username: i.suggested_username ?? "",
|
||||
email: "",
|
||||
})),
|
||||
);
|
||||
} catch (e: any) {
|
||||
setError(e.message || "Could not read the workbook");
|
||||
reset();
|
||||
} finally {
|
||||
setLoading(false);
|
||||
setBusy(false);
|
||||
}
|
||||
}
|
||||
|
||||
const update = (idx: number, patch: Partial<Decision>) =>
|
||||
setDecisions((d) => d.map((row, i) => (i === idx ? { ...row, ...patch } : row)));
|
||||
|
||||
// The "Confirm import" button routes through here so a destructive holdings-replace gets a
|
||||
// final confirmation before anything is cleared.
|
||||
function handleConfirmClick() {
|
||||
if (entityMode === "existing" && replaceExisting) {
|
||||
setConfirmReplace(true);
|
||||
return;
|
||||
}
|
||||
confirmImport();
|
||||
}
|
||||
|
||||
async function confirmImport() {
|
||||
if (!file || !asOf) return;
|
||||
setConfirmReplace(false);
|
||||
setError("");
|
||||
setBusy(true);
|
||||
try {
|
||||
const memberPayload = {
|
||||
as_of_date: asOf,
|
||||
investors: decisions.map((d) => ({
|
||||
action: d.action,
|
||||
value_dollars: d.value_dollars,
|
||||
commitment_dollars: d.commitment_dollars,
|
||||
contributions_dollars: d.contributions_dollars,
|
||||
distributions_dollars: d.distributions_dollars,
|
||||
user_id: d.action === "match" ? d.user_id : undefined,
|
||||
name: d.action === "create" ? d.name : undefined,
|
||||
username: d.action === "create" ? d.username : undefined,
|
||||
email: d.action === "create" ? d.email || undefined : undefined,
|
||||
external_id: d.external_id || undefined,
|
||||
})),
|
||||
};
|
||||
|
||||
let resolvedEntityId: number;
|
||||
let holdingsNote = "";
|
||||
|
||||
if (entityMode === "existing") {
|
||||
resolvedEntityId = Number(entityId);
|
||||
// Members first (idempotent), then holdings.
|
||||
setStep("Saving members…");
|
||||
await api.capitalImportCommit({ entity_id: resolvedEntityId, ...memberPayload });
|
||||
setStep(replaceExisting ? "Replacing holdings…" : "Loading holdings…");
|
||||
try {
|
||||
await api.scheduleImport(file, {
|
||||
commit: true,
|
||||
entityId: resolvedEntityId,
|
||||
password: password || undefined,
|
||||
asOf,
|
||||
replaceExisting,
|
||||
});
|
||||
} catch (e: any) {
|
||||
if (String(e.message).toLowerCase().includes("already exists")) {
|
||||
holdingsNote = "A signed valuation round exists for this quarter — holdings left unchanged.";
|
||||
} else {
|
||||
throw e;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
// Create-from-file: holdings commit creates the fund, then members.
|
||||
setStep("Creating fund and loading holdings…");
|
||||
const sres = await api.scheduleImport(file, {
|
||||
commit: true,
|
||||
password: password || undefined,
|
||||
asOf,
|
||||
createType,
|
||||
vintageYear,
|
||||
});
|
||||
resolvedEntityId = sres.entity.entity_id;
|
||||
setStep("Saving members…");
|
||||
await api.capitalImportCommit({ entity_id: resolvedEntityId, ...memberPayload });
|
||||
}
|
||||
|
||||
setResult({
|
||||
holdings: holdings?.count ?? 0,
|
||||
nav: holdings?.nav ?? 0,
|
||||
members: decisions.filter((d) => d.action !== "skip").length,
|
||||
created: decisions.filter((d) => d.action === "create").length,
|
||||
note: holdingsNote,
|
||||
});
|
||||
reset();
|
||||
api.listEntities().then(setEntities);
|
||||
} catch (e: any) {
|
||||
setError(e.message || "Import failed");
|
||||
} finally {
|
||||
setBusy(false);
|
||||
setStep("");
|
||||
}
|
||||
}
|
||||
|
||||
if (!canImport) {
|
||||
return (
|
||||
<div className="text-gray-500 text-sm">
|
||||
Import requires approver or CFO role.
|
||||
</div>
|
||||
);
|
||||
return <div className="text-gray-500 text-sm">Import requires Managing Partner, Operations, or CFO role.</div>;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="max-w-2xl">
|
||||
<h1 className="text-2xl font-semibold text-gray-900 mb-6">Import</h1>
|
||||
<div className="max-w-4xl">
|
||||
<h1 className="text-2xl font-semibold text-gray-900 mb-1">Import eNAV</h1>
|
||||
<p className="text-sm text-gray-500 mb-6">
|
||||
Upload the fund administrator's eNAV workbook once. Portal loads the fund's holdings and NAV
|
||||
(HLD tab) and the members with their capital — commitment, paid-in, distributions, and
|
||||
current value (ALLOC SI tab). You confirm new members before anything is saved.
|
||||
</p>
|
||||
|
||||
{/* Mode selector */}
|
||||
<div className="flex gap-4 mb-6">
|
||||
<button
|
||||
onClick={() => setMode("schedule")}
|
||||
className={`px-4 py-2 text-sm rounded ${
|
||||
mode === "schedule"
|
||||
? "bg-gray-900 text-white"
|
||||
: "bg-gray-100 text-gray-700 hover:bg-gray-200"
|
||||
}`}
|
||||
>
|
||||
Schedule of Investments
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setMode("entities")}
|
||||
className={`px-4 py-2 text-sm rounded ${
|
||||
mode === "entities"
|
||||
? "bg-gray-900 text-white"
|
||||
: "bg-gray-100 text-gray-700 hover:bg-gray-200"
|
||||
}`}
|
||||
>
|
||||
Entities
|
||||
</button>
|
||||
</div>
|
||||
{error && <div className="p-3 bg-red-50 border border-red-200 rounded text-sm text-red-700 mb-4">{error}</div>}
|
||||
|
||||
<div className="bg-white border border-gray-200 rounded-lg p-6 space-y-4">
|
||||
{mode === "schedule" && (
|
||||
<>
|
||||
{/* Entity resolution mode */}
|
||||
<div>
|
||||
<label className="block text-sm text-gray-700 mb-2">Entity</label>
|
||||
<div className="flex gap-4 mb-3">
|
||||
<label className="flex items-center gap-2 text-sm text-gray-700 cursor-pointer">
|
||||
<input
|
||||
type="radio"
|
||||
name="entityMode"
|
||||
checked={entityMode === "from_file"}
|
||||
onChange={() => setEntityMode("from_file")}
|
||||
className="text-orange-500"
|
||||
/>
|
||||
Create from file
|
||||
</label>
|
||||
<label className="flex items-center gap-2 text-sm text-gray-700 cursor-pointer">
|
||||
<input
|
||||
type="radio"
|
||||
name="entityMode"
|
||||
checked={entityMode === "existing"}
|
||||
onChange={() => setEntityMode("existing")}
|
||||
className="text-orange-500"
|
||||
/>
|
||||
Use existing entity
|
||||
</label>
|
||||
</div>
|
||||
|
||||
{entityMode === "existing" ? (
|
||||
<select
|
||||
value={entityId}
|
||||
onChange={(e) => setEntityId(e.target.value)}
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded text-sm"
|
||||
>
|
||||
<option value="">Select entity...</option>
|
||||
{entities.map((e) => (
|
||||
<option key={e.id} value={e.id}>
|
||||
{e.name}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
) : (
|
||||
<div className="flex gap-3">
|
||||
<div className="flex-1">
|
||||
<label className="block text-xs text-gray-500 mb-1">Type</label>
|
||||
<select
|
||||
value={createType}
|
||||
onChange={(e) => setCreateType(e.target.value as EntityType)}
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded text-sm"
|
||||
>
|
||||
<option value="fund">Fund</option>
|
||||
<option value="spv">SPV</option>
|
||||
<option value="gp">GP</option>
|
||||
<option value="mgmt_co">Mgmt Co</option>
|
||||
</select>
|
||||
</div>
|
||||
<div className="w-32">
|
||||
<label className="block text-xs text-gray-500 mb-1">Vintage Year</label>
|
||||
<input
|
||||
type="text"
|
||||
value={vintageYear}
|
||||
onChange={(e) => setVintageYear(e.target.value)}
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded text-sm"
|
||||
placeholder="2021"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm text-gray-700 mb-1">
|
||||
Quarter-end date (seed round)
|
||||
{result ? (
|
||||
<div className="bg-green-50 border border-green-200 rounded-lg p-4 text-sm">
|
||||
<p className="font-medium text-green-800">Import complete.</p>
|
||||
<ul className="mt-2 text-green-700 list-disc list-inside">
|
||||
<li>{result.holdings} holdings loaded · NAV {formatMoneyExact(result.nav)}</li>
|
||||
<li>{result.members} members ({result.created} newly created)</li>
|
||||
{result.note && <li className="text-amber-700">{result.note}</li>}
|
||||
</ul>
|
||||
<button onClick={() => setResult(null)} className="mt-3 px-3 py-1.5 bg-gray-900 text-white rounded hover:bg-gray-800">
|
||||
Import another
|
||||
</button>
|
||||
</div>
|
||||
) : (
|
||||
<div className="bg-white border border-gray-200 rounded-lg p-4 space-y-3">
|
||||
<div>
|
||||
<label className="block text-sm text-gray-700 mb-2">Fund</label>
|
||||
<div className="flex gap-4 mb-2">
|
||||
<label className="flex items-center gap-2 text-sm text-gray-700 cursor-pointer">
|
||||
<input type="radio" checked={entityMode === "existing"} onChange={() => { setEntityMode("existing"); reset(); }} className="text-orange-500" />
|
||||
Use existing fund
|
||||
</label>
|
||||
<label className="flex items-center gap-2 text-sm text-gray-700 cursor-pointer">
|
||||
<input type="radio" checked={entityMode === "from_file"} onChange={() => { setEntityMode("from_file"); reset(); }} className="text-orange-500" />
|
||||
Create from file
|
||||
</label>
|
||||
<input
|
||||
type="date"
|
||||
value={asOf}
|
||||
onChange={(e) => setAsOf(e.target.value)}
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded text-sm"
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
|
||||
<div>
|
||||
<label className="block text-sm text-gray-700 mb-1">
|
||||
{mode === "schedule" ? "Carta XLSX or CSV file" : "Entities CSV file"}
|
||||
</label>
|
||||
<input
|
||||
ref={fileRef}
|
||||
type="file"
|
||||
accept={mode === "schedule" ? ".xlsx,.xls,.csv" : ".csv"}
|
||||
onChange={(e) => setFile(e.target.files?.[0] || null)}
|
||||
className="w-full text-sm text-gray-600"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-2">
|
||||
<input
|
||||
type="checkbox"
|
||||
id="commit"
|
||||
checked={commit}
|
||||
onChange={(e) => setCommit(e.target.checked)}
|
||||
className="rounded border-gray-300"
|
||||
/>
|
||||
<label htmlFor="commit" className="text-sm text-gray-700">
|
||||
Commit (uncheck for dry-run preview)
|
||||
</label>
|
||||
</div>
|
||||
|
||||
{error && (
|
||||
<div className="p-3 bg-red-50 border border-red-200 rounded text-sm text-red-700">
|
||||
{error}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<button
|
||||
onClick={handleImport}
|
||||
disabled={loading || !file}
|
||||
className="px-4 py-2 bg-gray-900 text-white text-sm rounded hover:bg-gray-800 disabled:opacity-50"
|
||||
>
|
||||
{loading ? "Importing..." : commit ? "Import" : "Preview (dry run)"}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Results */}
|
||||
{result && (
|
||||
<div className="mt-6 bg-white border border-gray-200 rounded-lg p-6">
|
||||
<h3 className="text-sm font-medium text-gray-900 mb-3">
|
||||
{result.committed ? "Import Complete" : "Dry Run Preview"}
|
||||
</h3>
|
||||
|
||||
{/* Entity resolution info */}
|
||||
{result.entity && (
|
||||
<div className="mb-3 p-3 bg-gray-50 border border-gray-200 rounded text-sm">
|
||||
{result.entity.resolution === "will_create" ? (
|
||||
<span className="text-purple-700">
|
||||
Will create entity: <strong>{result.entity.entity_name}</strong> ({result.entity.entity_type})
|
||||
{result.entity.vintage_year && `, vintage ${result.entity.vintage_year}`}
|
||||
</span>
|
||||
) : result.entity.resolution === "matched" ? (
|
||||
<span className="text-blue-700">
|
||||
Matched existing entity: <strong>{result.entity.entity_name}</strong> (#{result.entity.entity_id})
|
||||
</span>
|
||||
) : (
|
||||
<span className="text-gray-700">
|
||||
Entity: <strong>{result.entity.entity_name}</strong> (#{result.entity.entity_id})
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{result.source_entity_name && !result.entity && (
|
||||
<p className="text-sm text-gray-600 mb-2">
|
||||
Source: {result.source_entity_name}
|
||||
</p>
|
||||
)}
|
||||
|
||||
{result.summary && (
|
||||
<div className="text-sm text-gray-700 mb-3">
|
||||
Created: {result.summary.created} | Updated: {result.summary.updated} | Errors: {result.summary.error_rows}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{result.holdings_count != null && (
|
||||
<div className="text-sm text-gray-700 mb-3">
|
||||
Holdings: {result.holdings_count} | Positions: {result.positions_count}
|
||||
{result.seed_round_id && ` | Seed round #${result.seed_round_id}`}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{result.holdings && result.holdings.length > 0 && (
|
||||
<div className="mb-3">
|
||||
<h4 className="text-xs font-medium text-gray-500 uppercase mb-1">Holdings</h4>
|
||||
<ul className="text-sm text-gray-700 space-y-0.5">
|
||||
{result.holdings.map((h: any, i: number) => (
|
||||
<li key={i}>{h.company_name}</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{result.positions && result.positions.length > 0 && (
|
||||
<div className="mb-3">
|
||||
<h4 className="text-xs font-medium text-gray-500 uppercase mb-1">
|
||||
Positions ({result.positions.length})
|
||||
</h4>
|
||||
<div className="overflow-x-auto">
|
||||
<table className="text-xs w-full">
|
||||
<thead>
|
||||
<tr className="text-left text-gray-500">
|
||||
<th className="pr-3 py-1">Company</th>
|
||||
<th className="pr-3 py-1">Security</th>
|
||||
<th className="pr-3 py-1">Date</th>
|
||||
<th className="pr-3 py-1 text-right">Cost</th>
|
||||
<th className="pr-3 py-1 text-right">Value</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{result.positions.map((p: any, i: number) => (
|
||||
<tr key={i} className="text-gray-700">
|
||||
<td className="pr-3 py-0.5">{p.company_name}</td>
|
||||
<td className="pr-3 py-0.5">{p.security_name}</td>
|
||||
<td className="pr-3 py-0.5">{p.investment_date || "—"}</td>
|
||||
<td className="pr-3 py-0.5 text-right">
|
||||
{p.cost_cents != null ? `$${(p.cost_cents / 100).toLocaleString()}` : "—"}
|
||||
</td>
|
||||
<td className="pr-3 py-0.5 text-right">
|
||||
{p.value_cents != null ? `$${(p.value_cents / 100).toLocaleString()}` : "—"}
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
{entityMode === "existing" ? (
|
||||
<select value={entityId} onChange={(e) => { setEntityId(e.target.value); reset(); }} className={inputCls}>
|
||||
<option value="">Select fund…</option>
|
||||
{entities.map((e) => <option key={e.id} value={e.id}>{e.name}</option>)}
|
||||
</select>
|
||||
) : (
|
||||
<div className="flex gap-3">
|
||||
<select value={createType} onChange={(e) => setCreateType(e.target.value as EntityType)} className={inputCls}>
|
||||
<option value="fund">Fund</option>
|
||||
<option value="spv">SPV</option>
|
||||
<option value="gp">GP</option>
|
||||
<option value="mgmt_co">Mgmt Co</option>
|
||||
</select>
|
||||
<input className={inputCls} placeholder="Vintage year" value={vintageYear} onChange={(e) => setVintageYear(e.target.value)} />
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-2 gap-3">
|
||||
<div>
|
||||
<label className="block text-xs text-gray-500 mb-1">eNAV workbook (.xlsx)</label>
|
||||
<input type="file" accept=".xlsx" onChange={(e) => { setFile(e.target.files?.[0] ?? null); reset(); }} className="text-sm" />
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-xs text-gray-500 mb-1">Spreadsheet password</label>
|
||||
<input type="text" className={inputCls} value={password} placeholder="If the file is protected" autoComplete="off" onChange={(e) => { setPassword(e.target.value); reset(); }} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex justify-end">
|
||||
<button onClick={readEnav} disabled={busy || !file} className="px-3 py-1.5 bg-gray-900 text-white text-sm rounded hover:bg-gray-800 disabled:opacity-50">
|
||||
{busy ? "Reading…" : "Read eNAV"}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{memberPv && !result && (
|
||||
<div className="mt-6 space-y-4">
|
||||
{/* Holdings summary */}
|
||||
<div className="bg-white border border-gray-200 rounded-lg p-4 text-sm flex items-center gap-6">
|
||||
<div>
|
||||
<span className="text-gray-500">Holdings: </span>
|
||||
<span className="text-gray-900 font-medium">{holdings?.count ?? 0}</span>
|
||||
</div>
|
||||
<div>
|
||||
<span className="text-gray-500">Fund NAV: </span>
|
||||
<span className="text-gray-900 font-medium">{formatMoneyExact(holdings?.nav ?? 0)}</span>
|
||||
</div>
|
||||
<div className="ml-auto">
|
||||
<label className="text-xs text-gray-500 mr-2">As-of</label>
|
||||
<input type="date" className="px-2 py-1 border border-gray-300 rounded text-sm" value={asOf} onChange={(e) => setAsOf(e.target.value)} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{entityMode === "existing" && (
|
||||
<label className="flex items-start gap-2 text-sm text-gray-700 bg-amber-50 border border-amber-200 rounded-lg p-3">
|
||||
<input
|
||||
type="checkbox"
|
||||
className="mt-0.5"
|
||||
checked={replaceExisting}
|
||||
onChange={(e) => setReplaceExisting(e.target.checked)}
|
||||
/>
|
||||
<span>
|
||||
<span className="font-medium">Replace existing holdings</span> — clear this fund's
|
||||
current holdings, positions, and valuation history first, then rebuild from this file.
|
||||
Use after switching source workbooks (e.g. Carta → eNAV) renamed the positions.
|
||||
Investor capital accounts are not affected.
|
||||
</span>
|
||||
</label>
|
||||
)}
|
||||
|
||||
{result.errors && result.errors.length > 0 && (
|
||||
<div>
|
||||
<h4 className="text-xs font-medium text-red-500 uppercase mb-1">
|
||||
Errors ({result.errors.length})
|
||||
</h4>
|
||||
<ul className="text-xs text-red-600 space-y-1">
|
||||
{result.errors.map((e: any, i: number) => (
|
||||
<li key={i}>
|
||||
Row {e.row}: {e.errors?.join(", ")}
|
||||
</li>
|
||||
{/* Members review */}
|
||||
<div className="bg-white border border-gray-200 rounded-lg overflow-hidden">
|
||||
<table className="w-full text-sm">
|
||||
<thead className="bg-gray-50 text-gray-500 text-left">
|
||||
<tr>
|
||||
<th className="px-3 py-2 font-medium">Member</th>
|
||||
<th className="px-3 py-2 font-medium text-right">Commitment</th>
|
||||
<th className="px-3 py-2 font-medium text-right">Paid-in</th>
|
||||
<th className="px-3 py-2 font-medium text-right">Distrib.</th>
|
||||
<th className="px-3 py-2 font-medium text-right">Value</th>
|
||||
<th className="px-3 py-2 font-medium">Action</th>
|
||||
<th className="px-3 py-2 font-medium">New account</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{decisions.map((d, i) => (
|
||||
<tr key={i} className="border-t border-gray-100 align-top">
|
||||
<td className="px-3 py-2 text-gray-900">{d.source_name}</td>
|
||||
<td className="px-3 py-2 text-right text-gray-600">{formatMoneyExact(Math.round(d.commitment_dollars * 100))}</td>
|
||||
<td className="px-3 py-2 text-right text-gray-600">{formatMoneyExact(Math.round(d.contributions_dollars * 100))}</td>
|
||||
<td className="px-3 py-2 text-right text-gray-600">{formatMoneyExact(Math.round(d.distributions_dollars * 100))}</td>
|
||||
<td className="px-3 py-2 text-right text-gray-900">{formatMoneyExact(Math.round(d.value_dollars * 100))}</td>
|
||||
<td className="px-3 py-2">
|
||||
<select className="px-2 py-1 border border-gray-300 rounded text-sm" value={d.action} onChange={(e) => update(i, { action: e.target.value as Decision["action"] })}>
|
||||
{d.user_id != null && <option value="match">Match {d.matched_username}</option>}
|
||||
<option value="create">Create new</option>
|
||||
<option value="skip">Skip</option>
|
||||
</select>
|
||||
</td>
|
||||
<td className="px-3 py-2">
|
||||
{d.action === "create" ? (
|
||||
<div className="flex gap-2">
|
||||
<input className="px-2 py-1 border border-gray-300 rounded text-sm w-28" placeholder="Username" value={d.username} onChange={(e) => update(i, { username: e.target.value })} />
|
||||
<span className="text-xs text-gray-400 self-center">no login until set</span>
|
||||
</div>
|
||||
) : d.action === "match" ? (
|
||||
<span className="text-xs text-gray-500">updates {d.matched_username}</span>
|
||||
) : (
|
||||
<span className="text-xs text-gray-400">ignored</span>
|
||||
)}
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
)}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
{result.preview && result.preview.length > 0 && (
|
||||
<div>
|
||||
<h4 className="text-xs font-medium text-gray-500 uppercase mb-1">
|
||||
Entities ({result.preview.length})
|
||||
</h4>
|
||||
<ul className="text-sm text-gray-700 space-y-0.5">
|
||||
{result.preview.map((p: any, i: number) => (
|
||||
<li key={i}>
|
||||
<span className={`text-xs px-1 rounded ${p.action === "create" ? "bg-green-100 text-green-700" : "bg-yellow-100 text-yellow-700"}`}>
|
||||
{p.action}
|
||||
</span>{" "}
|
||||
{p.name}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
<div className="flex items-center justify-end gap-3">
|
||||
<span className="text-xs text-gray-400">
|
||||
{decisions.filter((d) => d.action === "create").length} new ·{" "}
|
||||
{decisions.filter((d) => d.action === "match").length} matched ·{" "}
|
||||
{decisions.filter((d) => d.action === "skip").length} skipped
|
||||
</span>
|
||||
<button onClick={handleConfirmClick} disabled={busy || !asOf} className="px-4 py-1.5 bg-gray-900 text-white text-sm rounded hover:bg-gray-800 disabled:opacity-50">
|
||||
{busy ? (step || "Importing…") : "Confirm import"}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{confirmReplace && (
|
||||
<div className="fixed inset-0 bg-black/40 flex items-center justify-center p-4 z-50">
|
||||
<div className="bg-white rounded-lg p-6 max-w-md w-full">
|
||||
<h3 className="text-sm font-semibold text-gray-900 mb-2">Replace existing holdings?</h3>
|
||||
<p className="text-sm text-gray-600">
|
||||
This will permanently clear this fund's current holdings, positions, and valuation
|
||||
history, then rebuild them from this file. Investor capital accounts are not
|
||||
affected. This can't be undone.
|
||||
</p>
|
||||
<div className="flex justify-end gap-2 mt-5">
|
||||
<button
|
||||
onClick={() => setConfirmReplace(false)}
|
||||
className="px-4 py-1.5 border border-gray-300 text-sm rounded hover:bg-gray-50"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
onClick={confirmImport}
|
||||
className="px-4 py-1.5 bg-red-600 text-white text-sm rounded hover:bg-red-700"
|
||||
>
|
||||
Replace and import
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
@@ -1,14 +1,8 @@
|
||||
import { useEffect, useState } from "react";
|
||||
import { Link, useParams } from "react-router-dom";
|
||||
import { api, type Entity, type Holding, type Position, type ValuationRound, type Valuation } from "../api";
|
||||
import { formatMoney, formatMoneyExact, formatDate, formatQuarter, formatPerShare } from "../format";
|
||||
|
||||
const TYPE_LABELS: Record<string, string> = {
|
||||
fund: "Fund",
|
||||
spv: "SPV",
|
||||
gp: "GP",
|
||||
mgmt_co: "Mgmt Co",
|
||||
};
|
||||
import { useParams } from "react-router-dom";
|
||||
import { api, type Entity, type Holding, type Position } from "../api";
|
||||
import { formatMoney, formatDate, formatQuarter, formatPerShare } from "../format";
|
||||
import EntityHeader from "../components/EntityHeader";
|
||||
|
||||
interface PositionWithValuation extends Position {
|
||||
lastValueCents: number | null;
|
||||
@@ -95,28 +89,7 @@ export default function Investments() {
|
||||
|
||||
return (
|
||||
<div>
|
||||
{/* Header */}
|
||||
<div className="mb-6">
|
||||
<div className="flex items-center gap-3 mb-1">
|
||||
<h1 className="text-2xl font-semibold text-gray-900">{entity.name}</h1>
|
||||
<span className="inline-block px-2 py-0.5 bg-gray-100 text-gray-600 text-xs rounded">
|
||||
{TYPE_LABELS[entity.type] || entity.type}
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex gap-6 mt-4 border-b border-gray-200">
|
||||
<Link
|
||||
to={`/entities/${entity.id}`}
|
||||
className="pb-2 text-sm text-gray-500 hover:text-gray-800"
|
||||
>
|
||||
Overview
|
||||
</Link>
|
||||
<span className="pb-2 border-b-2 border-orange-500 text-sm font-medium text-orange-600">
|
||||
Investments
|
||||
</span>
|
||||
<span className="pb-2 text-sm text-gray-400 cursor-not-allowed">Partners</span>
|
||||
<span className="pb-2 text-sm text-gray-400 cursor-not-allowed">Documents</span>
|
||||
</div>
|
||||
</div>
|
||||
<EntityHeader entity={entity} active="investments" />
|
||||
|
||||
{/* Header band */}
|
||||
<div className="flex gap-6 mb-6 text-sm">
|
||||
@@ -141,7 +114,15 @@ export default function Investments() {
|
||||
</div>
|
||||
|
||||
{/* Grouped table */}
|
||||
<div className="bg-white border border-gray-200 rounded-lg overflow-hidden">
|
||||
{groups.length === 0 ? (
|
||||
<div className="bg-white border border-gray-200 rounded-lg p-8 text-center">
|
||||
<p className="text-sm text-gray-500">No investments recorded for this entity yet.</p>
|
||||
<p className="text-xs text-gray-400 mt-1">
|
||||
Holdings and positions are added by importing the fund's eNAV workbook.
|
||||
</p>
|
||||
</div>
|
||||
) : (
|
||||
<div className="bg-white border border-gray-200 rounded-lg overflow-x-auto">
|
||||
<table className="w-full text-sm">
|
||||
<thead>
|
||||
<tr className="bg-gray-50 border-b border-gray-200">
|
||||
@@ -166,6 +147,7 @@ export default function Investments() {
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -2,14 +2,14 @@ import { useEffect, useState } from "react";
|
||||
import { useParams, Link } from "react-router-dom";
|
||||
import {
|
||||
api,
|
||||
canEditRound,
|
||||
isApprover as roleIsApprover,
|
||||
type Entity,
|
||||
type Holding,
|
||||
type Position,
|
||||
type ValuationRound,
|
||||
type Valuation,
|
||||
} from "../api";
|
||||
import { useAuth } from "../context/AuthContext";
|
||||
import { formatMoney, formatMoneyExact, formatQuarter, formatDate } from "../format";
|
||||
import { formatMoney, formatQuarter, formatDate } from "../format";
|
||||
|
||||
const STATUS_COLORS: Record<string, string> = {
|
||||
draft: "bg-gray-100 text-gray-600",
|
||||
@@ -39,13 +39,12 @@ export default function ValuationWorkflow() {
|
||||
const [error, setError] = useState("");
|
||||
|
||||
const entityId = id ? parseInt(id) : 0;
|
||||
const isApprover = user?.role === "approver";
|
||||
const isApprover = !!user && roleIsApprover(user.role);
|
||||
const canEdit =
|
||||
selectedRound &&
|
||||
(selectedRound.status === "draft" || selectedRound.status === "returned") &&
|
||||
user &&
|
||||
["fund_admin", "cfo", "approver"].includes(user.role);
|
||||
const canSubmit = canEdit;
|
||||
!!user &&
|
||||
canEditRound(user.role);
|
||||
const canApprove =
|
||||
selectedRound?.status === "submitted" && isApprover;
|
||||
const canReturn =
|
||||
@@ -302,7 +301,7 @@ export default function ValuationWorkflow() {
|
||||
)}
|
||||
|
||||
{/* Valuations table */}
|
||||
<div className="bg-white border border-gray-200 rounded-lg overflow-hidden">
|
||||
<div className="bg-white border border-gray-200 rounded-lg overflow-x-auto">
|
||||
<table className="w-full text-sm">
|
||||
<thead>
|
||||
<tr className="bg-gray-50 border-b border-gray-200">
|
||||
|
||||
Reference in New Issue
Block a user