Francy51/Neon-Desk
2
0
Fork 0
Code Issues 22 Pull Requests Actions Packages Projects Releases Wiki Activity

Focus financial views on quarter/FY ends and add period filters

Browse Source
This commit is contained in:
francy51
2026-03-01 18:43:48 -05:00
parent 2a5b548d89
commit 75408f8559
2 changed files with 158 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

95
app/analysis/page.tsx
View File

@@ -26,14 +26,45 @@ import { getCompanyAnalysis } from '@/lib/api';
import { asNumber, formatCompactCurrency, formatCurrency, formatPercent } from '@/lib/format';
import type { CompanyAnalysis } from '@/lib/types';
type FinancialPeriodFilter = 'quarterlyAndFiscalYearEnd' | 'quarterlyOnly' | 'fiscalYearEndOnly';
type FinancialSeriesPoint = {
label: string;
filingType: '10-K' | '10-Q';
periodLabel: 'Quarter End' | 'Fiscal Year End';
revenue: number | null;
netIncome: number | null;
assets: number | null;
};
const FINANCIAL_PERIOD_FILTER_OPTIONS: Array<{ value: FinancialPeriodFilter; label: string }> = [
{ value: 'quarterlyAndFiscalYearEnd', label: 'Quarterly + Fiscal Year End' },
{ value: 'quarterlyOnly', label: 'Quarterly only' },
{ value: 'fiscalYearEndOnly', label: 'Fiscal Year End only' }
];
function formatShortDate(value: string) {
return format(new Date(value), 'MMM yyyy');
}
function hasFinancialSnapshot(filingType: CompanyAnalysis['filings'][number]['filing_type']) {
function isFinancialSnapshotForm(
filingType: CompanyAnalysis['filings'][number]['filing_type']
): filingType is '10-K' | '10-Q' {
return filingType === '10-K' || filingType === '10-Q';
}
function includesFinancialPeriod(filingType: '10-K' | '10-Q', filter: FinancialPeriodFilter) {
if (filter === 'quarterlyOnly') {
return filingType === '10-Q';
}
if (filter === 'fiscalYearEndOnly') {
return filingType === '10-K';
}
return true;
}
export default function AnalysisPage() {
return (
<Suspense fallback={<div className="flex min-h-screen items-center justify-center text-sm text-[color:var(--terminal-muted)]">Loading analysis desk...</div>}>
@@ -51,6 +82,7 @@ function AnalysisPageContent() {
const [analysis, setAnalysis] = useState<CompanyAnalysis | null>(null);
const [loading, setLoading] = useState(true);
const [error, setError] = useState<string | null>(null);
const [financialPeriodFilter, setFinancialPeriodFilter] = useState<FinancialPeriodFilter>('quarterlyAndFiscalYearEnd');
useEffect(() => {
const fromQuery = searchParams.get('ticker');
@@ -95,18 +127,31 @@ function AnalysisPageContent() {
}));
}, [analysis?.priceHistory]);
const financialSeries = useMemo(() => {
const financialSeries = useMemo<FinancialSeriesPoint[]>(() => {
return (analysis?.financials ?? [])
.filter((item): item is CompanyAnalysis['financials'][number] & { filingType: '10-K' | '10-Q' } => {
return isFinancialSnapshotForm(item.filingType);
})
.slice()
.reverse()
.sort((a, b) => Date.parse(a.filingDate) - Date.parse(b.filingDate))
.map((item) => ({
label: formatShortDate(item.filingDate),
filingType: item.filingType,
periodLabel: item.filingType === '10-Q' ? 'Quarter End' : 'Fiscal Year End',
revenue: item.revenue,
netIncome: item.netIncome,
assets: item.totalAssets
}));
}, [analysis?.financials]);
const filteredFinancialSeries = useMemo(() => {
return financialSeries.filter((point) => includesFinancialPeriod(point.filingType, financialPeriodFilter));
}, [financialSeries, financialPeriodFilter]);
const periodEndFilings = useMemo(() => {
return (analysis?.filings ?? []).filter((filing) => isFinancialSnapshotForm(filing.filing_type));
}, [analysis?.filings]);
if (isPending || !isAuthenticated) {
return <div className="flex min-h-screen items-center justify-center text-sm text-[color:var(--terminal-muted)]">Loading analysis desk...</div>;
}
@@ -204,15 +249,33 @@ function AnalysisPageContent() {
)}
</Panel>
<Panel title="Financial Trend" subtitle="Filing snapshots for revenue, net income, and assets.">
<Panel
title="Financial Trend"
subtitle="Quarter-end (10-Q) and fiscal-year-end (10-K) snapshots for revenue, net income, and assets."
actions={(
<div className="flex flex-wrap justify-end gap-2">
{FINANCIAL_PERIOD_FILTER_OPTIONS.map((option) => (
<Button
key={option.value}
type="button"
variant={option.value === financialPeriodFilter ? 'primary' : 'ghost'}
className="px-2 py-1 text-xs"
onClick={() => setFinancialPeriodFilter(option.value)}
>
{option.label}
</Button>
))}
</div>
)}
>
{loading ? (
<p className="text-sm text-[color:var(--terminal-muted)]">Loading financials...</p>
) : financialSeries.length === 0 ? (
<p className="text-sm text-[color:var(--terminal-muted)]">No parsed filing metrics yet.</p>
) : filteredFinancialSeries.length === 0 ? (
<p className="text-sm text-[color:var(--terminal-muted)]">No filing metrics match the selected period filter.</p>
) : (
<div className="h-[320px]">
<ResponsiveContainer width="100%" height="100%">
<BarChart data={financialSeries}>
<BarChart data={filteredFinancialSeries}>
<CartesianGrid strokeDasharray="2 2" stroke="rgba(126, 217, 255, 0.2)" />
<XAxis dataKey="label" minTickGap={20} stroke="#8cb6c5" fontSize={12} />
<YAxis stroke="#8cb6c5" fontSize={12} tickFormatter={(value: number) => `$${Math.round(value / 1_000_000_000)}B`} />
@@ -228,17 +291,18 @@ function AnalysisPageContent() {
</Panel>
</div>
<Panel title="Filings" subtitle={`${analysis?.filings.length ?? 0} recent SEC records loaded.`}>
<Panel title="Filings" subtitle={`${periodEndFilings.length} quarter-end and fiscal-year-end SEC records loaded.`}>
{loading ? (
<p className="text-sm text-[color:var(--terminal-muted)]">Loading filings...</p>
) : !analysis || analysis.filings.length === 0 ? (
<p className="text-sm text-[color:var(--terminal-muted)]">No filings available for this ticker.</p>
) : periodEndFilings.length === 0 ? (
<p className="text-sm text-[color:var(--terminal-muted)]">No 10-K or 10-Q filings available for this ticker.</p>
) : (
<div className="overflow-x-auto">
<table className="data-table min-w-[860px]">
<thead>
<tr>
<th>Filed</th>
<th>Period</th>
<th>Type</th>
<th>Revenue</th>
<th>Net Income</th>
@@ -247,13 +311,14 @@ function AnalysisPageContent() {
</tr>
</thead>
<tbody>
{analysis.filings.map((filing) => (
{periodEndFilings.map((filing) => (
<tr key={filing.accession_number}>
<td>{format(new Date(filing.filing_date), 'MMM dd, yyyy')}</td>
<td>{filing.filing_type}{hasFinancialSnapshot(filing.filing_type) ? '' : ' (Qualitative)'}</td>
<td>{hasFinancialSnapshot(filing.filing_type) ? (filing.metrics?.revenue ? formatCompactCurrency(filing.metrics.revenue) : 'n/a') : 'qualitative only'}</td>
<td>{hasFinancialSnapshot(filing.filing_type) ? (filing.metrics?.netIncome ? formatCompactCurrency(filing.metrics.netIncome) : 'n/a') : 'qualitative only'}</td>
<td>{hasFinancialSnapshot(filing.filing_type) ? (filing.metrics?.totalAssets ? formatCompactCurrency(filing.metrics.totalAssets) : 'n/a') : 'qualitative only'}</td>
<td>{filing.filing_type === '10-Q' ? 'Quarter End' : 'Fiscal Year End'}</td>
<td>{filing.filing_type}</td>
<td>{filing.metrics?.revenue !== null && filing.metrics?.revenue !== undefined ? formatCompactCurrency(filing.metrics.revenue) : 'n/a'}</td>
<td>{filing.metrics?.netIncome !== null && filing.metrics?.netIncome !== undefined ? formatCompactCurrency(filing.metrics.netIncome) : 'n/a'}</td>
<td>{filing.metrics?.totalAssets !== null && filing.metrics?.totalAssets !== undefined ? formatCompactCurrency(filing.metrics.totalAssets) : 'n/a'}</td>
<td>
{filing.filing_url ? (
<a href={filing.filing_url} target="_blank" rel="noreferrer" className="text-xs text-[color:var(--accent)] hover:text-[color:var(--accent-strong)]">