Files
Neon-Desk/components/analysis/bull-bear-panel.tsx

57 lines
2.3 KiB
TypeScript

import Link from 'next/link';
import { Panel } from '@/components/ui/panel';
import type { CompanyBullBear } from '@/lib/types';
type BullBearPanelProps = {
bullBear: CompanyBullBear;
researchHref: string;
onLinkPrefetch?: () => void;
};
export function BullBearPanel(props: BullBearPanelProps) {
const hasContent = props.bullBear.bull.length > 0 || props.bullBear.bear.length > 0;
return (
<Panel
title="Bull vs Bear"
subtitle="The highest-level reasons investors may lean in or lean out right now."
className="pt-2"
>
{!hasContent ? (
<div className="border-t border-dashed border-[color:var(--line-weak)] py-5 text-sm text-[color:var(--terminal-muted)]">
No synthesis inputs are available yet. Add memo sections or filing context in Research to populate this debate surface.
<div className="mt-4">
<Link href={props.researchHref} onMouseEnter={props.onLinkPrefetch} onFocus={props.onLinkPrefetch} className="text-xs uppercase tracking-[0.14em] text-[color:var(--accent)] hover:text-[color:var(--accent-strong)]">
Open research workspace
</Link>
</div>
</div>
) : (
<div className="grid gap-4 lg:grid-cols-2">
<section className="border-t border-[rgba(150,245,191,0.24)] pt-5">
<h3 className="text-lg font-semibold text-[color:var(--terminal-bright)]">Bull case</h3>
<ul className="mt-4 space-y-3">
{props.bullBear.bull.map((item) => (
<li key={item} className="border-t border-[rgba(150,245,191,0.16)] pt-3 text-sm leading-6 text-[color:var(--terminal-bright)]">
{item}
</li>
))}
</ul>
</section>
<section className="border-t border-[rgba(255,159,159,0.24)] pt-5">
<h3 className="text-lg font-semibold text-[color:var(--terminal-bright)]">Bear case</h3>
<ul className="mt-4 space-y-3">
{props.bullBear.bear.map((item) => (
<li key={item} className="border-t border-[rgba(255,159,159,0.16)] pt-3 text-sm leading-6 text-[color:var(--terminal-bright)]">
{item}
</li>
))}
</ul>
</section>
</div>
)}
</Panel>
);
}