refactor(stock): 거래 데스크에서 AI 투자 탭 제거

TAB_AI 탭과 관련 컴포넌트(AiTradeTab)·훅(useAiBalance) 삭제. 헤더 카드는
aib 모의투자 요약 분기를 제거하고 항상 포트폴리오 요약을 표시.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-05-22 08:30:44 +09:00
parent ee5700dc95
commit e42b643731
4 changed files with 29 additions and 356 deletions

View File

@@ -6,7 +6,7 @@ import SwipeableView from '../../components/SwipeableView';
import {
formatNumber, formatPercent,
toNumeric, profitColorClass,
TAB_PORTFOLIO, TAB_AI, TAB_REPORT, TAB_ADVISOR,
TAB_PORTFOLIO, TAB_REPORT, TAB_ADVISOR,
} from './stockUtils';
/* ── hooks ──────────────────────────────────────────────────────── */
@@ -15,13 +15,11 @@ import useSellHistory from './hooks/useSellHistory';
import useAiCoach from './hooks/useAiCoach';
import useAssetHistory from './hooks/useAssetHistory';
import useMarketContext from './hooks/useMarketContext';
import useAiBalance from './hooks/useAiBalance';
import useReportData from './hooks/useReportData';
import useAdvisor from './hooks/useAdvisor';
/* ── tab components ─────────────────────────────────────────────── */
import PortfolioTab from './components/PortfolioTab';
import AiTradeTab from './components/AiTradeTab';
import ReportTab from './components/ReportTab';
import AdvisorTab from './components/AdvisorTab';
import SellHistoryDrawer from './components/SellHistoryDrawer';
@@ -32,8 +30,8 @@ const StockTrade = () => {
const [activeTab, setActiveTab] = React.useState(TAB_REPORT);
const isMobile = useIsMobile();
const TAB_ORDER = [TAB_PORTFOLIO, TAB_AI, TAB_REPORT, TAB_ADVISOR];
const tabLabels = ['포트폴리오', 'AI 트레이드', '리포트', '어드바이저'];
const TAB_ORDER = [TAB_PORTFOLIO, TAB_REPORT, TAB_ADVISOR];
const tabLabels = ['포트폴리오', '리포트', '어드바이저'];
const tabIndex = TAB_ORDER.indexOf(activeTab);
const handleTabChange = useCallback((idx) => setActiveTab(TAB_ORDER[idx]), []); // eslint-disable-line react-hooks/exhaustive-deps
@@ -49,7 +47,6 @@ const StockTrade = () => {
totalAssets: pf.totalAssets,
marketCtx,
});
const aib = useAiBalance();
const report = useReportData({
portfolioHoldings: pf.portfolioHoldings,
portfolioSummary: pf.portfolioSummary,
@@ -97,12 +94,10 @@ const StockTrade = () => {
if (activeTab === TAB_PORTFOLIO && !pf.portfolioLoaded) {
pf.loadPortfolio();
sell.loadSellHistory();
} else if (activeTab === TAB_AI && !aib.balanceLoaded) {
aib.loadBalance();
} else if ((activeTab === TAB_REPORT || activeTab === TAB_ADVISOR) && !pf.portfolioLoaded) {
pf.loadPortfolio();
}
}, [activeTab, pf.portfolioLoaded, aib.balanceLoaded]); // eslint-disable-line react-hooks/exhaustive-deps
}, [activeTab, pf.portfolioLoaded]); // eslint-disable-line react-hooks/exhaustive-deps
useEffect(() => {
if (activeTab === TAB_PORTFOLIO) asset.loadAssetHistory(asset.assetHistoryDays);
@@ -135,42 +130,29 @@ const StockTrade = () => {
</div>
</div>
<div className="stock-card">
<p className="stock-card__title">
{activeTab === TAB_AI ? 'AI 투자 요약' : '쟁승토리 계좌 요약'}
</p>
{activeTab === TAB_PORTFOLIO || activeTab === TAB_REPORT ? (
<div className="stock-status">
<div><span> 매입</span><strong>{formatNumber(pf.portfolioSummary.total_buy)}</strong></div>
<div><span> 평가</span><strong>{formatNumber(pf.portfolioSummary.total_eval)}</strong></div>
<div>
<span> 손익</span>
<strong className={`stock-profit ${profitColorClass(toNumeric(pf.portfolioSummary.total_profit))}`}>
{formatNumber(pf.portfolioSummary.total_profit)}
{pf.portfolioSummary.total_profit_rate != null && (
<small style={{ marginLeft: 4, fontSize: 11 }}>
({formatPercent(pf.portfolioSummary.total_profit_rate)})
</small>
)}
</strong>
</div>
<div><span>보유 종목</span><strong>{pf.portfolioHoldings.length}</strong></div>
{pf.totalCash != null && (
<div><span>예수금 합계</span><strong style={{ color: '#93c5fd' }}>{formatNumber(pf.totalCash)}</strong></div>
)}
{pf.totalAssets != null && (
<div><span> 자산</span><strong style={{ fontWeight: 700 }}>{formatNumber(pf.totalAssets)}</strong></div>
)}
<p className="stock-card__title">쟁승토리 계좌 요약</p>
<div className="stock-status">
<div><span> 매입</span><strong>{formatNumber(pf.portfolioSummary.total_buy)}</strong></div>
<div><span> 평가</span><strong>{formatNumber(pf.portfolioSummary.total_eval)}</strong></div>
<div>
<span> 손익</span>
<strong className={`stock-profit ${profitColorClass(toNumeric(pf.portfolioSummary.total_profit))}`}>
{formatNumber(pf.portfolioSummary.total_profit)}
{pf.portfolioSummary.total_profit_rate != null && (
<small style={{ marginLeft: 4, fontSize: 11 }}>
({formatPercent(pf.portfolioSummary.total_profit_rate)})
</small>
)}
</strong>
</div>
) : (
<div className="stock-status">
<div><span> 평가금액</span><strong>{formatNumber(aib.totalEval)}</strong></div>
<div><span>예수금</span><strong>{formatNumber(aib.deposit)}</strong></div>
<div><span>보유 종목</span><strong>{aib.holdings.length}</strong></div>
</div>
)}
{activeTab === TAB_AI && aib.summary.note ? (
<p className="stock-status__note">{aib.summary.note}</p>
) : null}
<div><span>보유 종목</span><strong>{pf.portfolioHoldings.length}</strong></div>
{pf.totalCash != null && (
<div><span>예수금 합계</span><strong style={{ color: '#93c5fd' }}>{formatNumber(pf.totalCash)}</strong></div>
)}
{pf.totalAssets != null && (
<div><span> 자산</span><strong style={{ fontWeight: 700 }}>{formatNumber(pf.totalAssets)}</strong></div>
)}
</div>
</div>
</header>
@@ -182,11 +164,9 @@ const StockTrade = () => {
label: tabLabels[i],
content: tabId === TAB_PORTFOLIO
? <PortfolioTab pf={pf} asset={asset} handleSell={handleSell} handleSaveSnapshot={handleSaveSnapshot} />
: tabId === TAB_AI
? <AiTradeTab aib={aib} />
: tabId === TAB_REPORT
? <ReportTab pf={pf} report={report} ai={ai} marketCtx={marketCtx} />
: <AdvisorTab pf={pf} advisor={advisor} />,
: tabId === TAB_REPORT
? <ReportTab pf={pf} report={report} ai={ai} marketCtx={marketCtx} />
: <AdvisorTab pf={pf} advisor={advisor} />,
}))}
activeIndex={tabIndex}
onTabChange={handleTabChange}
@@ -196,7 +176,6 @@ const StockTrade = () => {
<div className="stock-main-tabs">
{[
{ id: TAB_PORTFOLIO, icon: '💼', label: '쟁승토리 계좌', badge: pf.portfolioHoldings.length || null },
{ id: TAB_AI, icon: '🤖', label: 'AI 투자', sub: '모의투자' },
{ id: TAB_REPORT, icon: '📊', label: '리포트', sub: '분석·AI코치' },
{ id: TAB_ADVISOR, icon: '🧠', label: 'AI 어드바이저', sub: 'Gemini Pro', className: 'stock-main-tab--advisor' },
].map(({ id, icon, label, sub, badge, className: cls }) => (
@@ -217,7 +196,6 @@ const StockTrade = () => {
{activeTab === TAB_PORTFOLIO && (
<PortfolioTab pf={pf} asset={asset} handleSell={handleSell} handleSaveSnapshot={handleSaveSnapshot} />
)}
{activeTab === TAB_AI && <AiTradeTab aib={aib} />}
{activeTab === TAB_REPORT && <ReportTab pf={pf} report={report} ai={ai} marketCtx={marketCtx} />}
{activeTab === TAB_ADVISOR && <AdvisorTab pf={pf} advisor={advisor} />}
</>