Customize - Stock map list, watch list, home page

This commit is contained in:
2026-08-05 23:51:18 +05:30
parent 076c4ff68f
commit 53ad1abb78
34 changed files with 1423 additions and 587 deletions

View File

@@ -1,5 +1,6 @@
import React, { useEffect, useState } from "react";
import axios from "axios";
import AboutScanner from "./AboutScanner";
function Scanner({ onSelectStock, onSignal }) {
const [data, setData] = useState(null);
@@ -7,7 +8,7 @@ function Scanner({ onSelectStock, onSignal }) {
const loadData = async () => {
try {
const res = await axios.get("http://127.0.0.1:8000/api/scanner/scan");
const res = await axios.get("/api/scanner/scan");
const newData = res.data;
const best = newData.best_5 && newData.best_5.length > 0 ? newData.best_5[0] : null;
@@ -33,10 +34,37 @@ function Scanner({ onSelectStock, onSignal }) {
window.open(`https://www.tradingview.com/chart/?symbol=NSE:${symbol}`, "_blank");
};
if (!data) return <div className="glass-card" style={{ textAlign: "center" }}>Loading Scanner Data...</div>;
const removeStockFromSector = async (symbol, sector) => {
try {
await axios.delete("/api/scanner/sectors", {
data: { sector, symbol }
});
setData(prev => {
const newData = JSON.parse(JSON.stringify(prev));
if (newData.sectors && newData.sectors[sector]) {
newData.sectors[sector].stocks = newData.sectors[sector].stocks.filter(s => s.symbol !== symbol);
}
if (newData.best_5) {
newData.best_5 = newData.best_5.filter(s => s.symbol !== symbol);
}
return newData;
});
} catch (err) {
console.error("Error removing stock", err);
}
};
if (!data) return (
<>
<AboutScanner isLoaded={false} />
<div className="glass-card" style={{ textAlign: "center" }}>Loading Scanner Data (this may take up to 60 seconds for large watchlists)...</div>
</>
);
return (
<div>
<AboutScanner isLoaded={true} />
{/* Top 5 Trades */}
{(data.best_5 || []).length > 0 && (
<div className="glass-card animate-fade-in" style={{ marginBottom: "30px", borderLeft: "4px solid var(--accent-green)" }}>
@@ -72,9 +100,23 @@ function Scanner({ onSelectStock, onSignal }) {
<td>{s.grade}</td>
<td>{s.institutional ? <span className="text-orange">🔥 Yes</span> : <span className="text-muted">No</span>}</td>
<td>
<button className="action-btn" onClick={() => { openChart(s?.symbol); onSelectStock(s?.symbol); }}>
View Chart
</button>
<div style={{ display: 'flex', gap: '8px', alignItems: 'center' }}>
<button className="action-btn" onClick={() => { openChart(s?.symbol); onSelectStock(s?.symbol); }}>
View Chart
</button>
{s?.sector && (
<button
onClick={() => removeStockFromSector(s?.symbol, s.sector)}
title={`Remove from ${s.sector}`}
style={{ background: 'none', border: 'none', color: 'var(--accent-red)', cursor: 'pointer', padding: '0', display: 'flex', alignItems: 'center' }}
>
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
<path d="M3 6h18"></path>
<path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
</svg>
</button>
)}
</div>
</td>
</tr>
))}
@@ -125,9 +167,21 @@ function Scanner({ onSelectStock, onSignal }) {
<td className="text-green">{s?.target}</td>
<td>{s?.ai_score}</td>
<td>
<button className="action-btn" onClick={() => { openChart(s?.symbol); onSelectStock(s?.symbol); }}>
Chart
</button>
<div style={{ display: 'flex', gap: '8px', alignItems: 'center' }}>
<button className="action-btn" onClick={() => { openChart(s?.symbol); onSelectStock(s?.symbol); }}>
Chart
</button>
<button
onClick={() => removeStockFromSector(s?.symbol, sector)}
title={`Remove from ${sector}`}
style={{ background: 'none', border: 'none', color: 'var(--accent-red)', cursor: 'pointer', padding: '0', display: 'flex', alignItems: 'center' }}
>
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
<path d="M3 6h18"></path>
<path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
</svg>
</button>
</div>
</td>
</tr>
))}