Stabilize homepage focus card
This commit is contained in:
@@ -679,31 +679,50 @@
|
||||
|
||||
.root :global(.home-risk-badge) {
|
||||
flex-shrink: 0;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
min-height: 28px;
|
||||
border-radius: 999px;
|
||||
padding: 7px 10px;
|
||||
border: 1px solid rgba(148, 163, 184, 0.18);
|
||||
background: rgba(15, 23, 42, 0.58);
|
||||
color: var(--text-secondary);
|
||||
font-size: 11px;
|
||||
padding: 5px 10px 5px 8px;
|
||||
border: 1px solid rgba(148, 163, 184, 0.14);
|
||||
background: rgba(8, 15, 30, 0.52);
|
||||
box-shadow:
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.05),
|
||||
0 8px 18px rgba(2, 6, 23, 0.14);
|
||||
color: rgba(226, 232, 240, 0.9);
|
||||
font-size: 10px;
|
||||
font-weight: 800;
|
||||
letter-spacing: 0.04em;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.root :global(.home-risk-badge::before) {
|
||||
content: "";
|
||||
width: 7px;
|
||||
height: 7px;
|
||||
border-radius: 999px;
|
||||
background: currentColor;
|
||||
opacity: 0.92;
|
||||
box-shadow: 0 0 12px color-mix(in srgb, currentColor 28%, transparent);
|
||||
}
|
||||
|
||||
.root :global(.home-risk-badge.high) {
|
||||
border-color: rgba(248, 113, 113, 0.32);
|
||||
color: #fecaca;
|
||||
background: rgba(127, 29, 29, 0.22);
|
||||
border-color: rgba(248, 113, 113, 0.22);
|
||||
color: #fca5a5;
|
||||
background: rgba(69, 10, 10, 0.34);
|
||||
}
|
||||
|
||||
.root :global(.home-risk-badge.medium) {
|
||||
border-color: rgba(251, 191, 36, 0.32);
|
||||
color: #fde68a;
|
||||
background: rgba(120, 53, 15, 0.22);
|
||||
border-color: rgba(251, 191, 36, 0.2);
|
||||
color: #fbbf24;
|
||||
background: rgba(67, 36, 6, 0.34);
|
||||
}
|
||||
|
||||
.root :global(.home-risk-badge.low) {
|
||||
border-color: rgba(52, 211, 153, 0.3);
|
||||
color: #bbf7d0;
|
||||
background: rgba(20, 83, 45, 0.18);
|
||||
border-color: rgba(52, 211, 153, 0.22);
|
||||
color: #34d399;
|
||||
background: rgba(7, 47, 35, 0.34);
|
||||
}
|
||||
|
||||
.root :global(.home-panel-subtitle) {
|
||||
|
||||
@@ -852,7 +852,6 @@ function DashboardScreen() {
|
||||
const store = useDashboardStore();
|
||||
const { t } = useI18n();
|
||||
const didAutoFocusRef = useRef(false);
|
||||
const autoFocusedCityRef = useRef<string | null>(null);
|
||||
const preloadedOpportunityRef = useRef<Set<string>>(new Set());
|
||||
const activeSummary = store.selectedCity
|
||||
? store.citySummariesByName[store.selectedCity] || null
|
||||
@@ -923,28 +922,9 @@ function DashboardScreen() {
|
||||
if (!topOpportunity) return;
|
||||
|
||||
didAutoFocusRef.current = true;
|
||||
autoFocusedCityRef.current = topOpportunity;
|
||||
void store.focusCity(topOpportunity);
|
||||
}, [homepageSnapshots, showHomepageChrome, store]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!showHomepageChrome) return;
|
||||
if (!store.selectedCity) return;
|
||||
if (store.selectedCity !== autoFocusedCityRef.current) return;
|
||||
|
||||
const topOpportunity = homepageSnapshots[0];
|
||||
if (!topOpportunity || topOpportunity.city.name === store.selectedCity) return;
|
||||
|
||||
const selectedSnapshot = homepageSnapshots.find(
|
||||
(snapshot) => snapshot.city.name === store.selectedCity,
|
||||
);
|
||||
if (!selectedSnapshot?.detail?.market_scan) return;
|
||||
if (selectedSnapshot.tradableOpportunity) return;
|
||||
|
||||
autoFocusedCityRef.current = topOpportunity.city.name;
|
||||
void store.focusCity(topOpportunity.city.name);
|
||||
}, [homepageSnapshots, showHomepageChrome, store]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!showHomepageChrome) return;
|
||||
const targets = homepageSnapshots.slice(0, 4).map((snapshot) => snapshot.city.name);
|
||||
|
||||
Reference in New Issue
Block a user