refactor(portfolio): 보유행/브로커섹션 추출 → PortfolioTab shell 축소

src/pages/stock/components/portfolio/BrokerSection.jsx

@@ -0,0 +1,48 @@
+import React from 'react';
+import { formatNumber, formatPercent, profitColorClass } from '../../stockUtils';
+import HoldingRow from './HoldingRow';
+
+const BrokerSection = ({ broker, items, pf, handleSell }) => {
+    const bSummary = pf.getBrokerSummary(items);
+    const color = pf.brokerColors[broker];
+    return (
+        <section
+            key={broker}
+            className="stock-panel stock-panel--wide pf-broker-section"
+            style={{ borderColor: color?.border, background: color?.bg }}
+        >
+            <div className="stock-panel__head">
+                <div>
+                    <p className="stock-panel__eyebrow" style={{ color: color?.border }}>
+                        {broker}
+                    </p>
+                    <h3>{broker} 보유 현황</h3>
+                    <p className="stock-panel__sub">
+                        {items.length}종목 · 총 매입{' '}
+                        {formatNumber(bSummary.totalBuy)} · 평가{' '}
+                        {formatNumber(bSummary.totalEval)} · 손익{' '}
+                        <span className={`stock-profit ${profitColorClass(bSummary.totalProfit)}`}>
+                            {formatNumber(bSummary.totalProfit)} (
+                            {formatPercent(bSummary.totalProfitRate)})
+                        </span>
+                        {(() => {
+                            const bc = pf.cashList.find((c) => c.broker === broker);
+                            return bc ? (
+                                <span className="pf-cash-badge">
+                                    예수금 {formatNumber(bc.cash)}원
+                                </span>
+                            ) : null;
+                        })()}
+                    </p>
+                </div>
+            </div>
+            <div className="stock-holdings">
+                {items.map((item) => (
+                    <HoldingRow key={item.id} item={item} pf={pf} handleSell={handleSell} />
+                ))}
+            </div>
+        </section>
+    );
+};
+
+export default BrokerSection;