feat: update timeframe presets and improve sorting

- Add 30m and 2h timeframes to available options
- Update Scalping preset: 5m, 15m, 30m (was 5m, 15m, 1h)
- Update Day Trading preset: 1h, 2h, 4h (was 1h, 4h, 1d)
- Enhance sorting logic for screenshots and analysis results
- Ensure consistent timeframe order: 5m → 15m → 30m → 1h → 2h → 4h → 1d
- Improve multi-timeframe analysis display with proper sorting
- Update filename parsing to handle new timeframes

Changes improve trading workflow with more logical timeframe progressions
for scalping and day trading strategies.
This commit is contained in:
mindesbunister
2025-07-17 11:25:11 +02:00
parent ff4e9737fb
commit 4f328fab48
2 changed files with 116 additions and 34 deletions

View File

@@ -8,7 +8,9 @@ const timeframes = [
{ label: '1m', value: '1' },
{ label: '5m', value: '5' },
{ label: '15m', value: '15' },
{ label: '30m', value: '30' },
{ label: '1h', value: '60' },
{ label: '2h', value: '120' },
{ label: '4h', value: '240' },
{ label: '1d', value: 'D' },
{ label: '1w', value: 'W' },
@@ -38,7 +40,6 @@ interface ProgressStep {
}
interface AnalysisProgress {
sessionId: string
currentStep: number
totalSteps: number
steps: ProgressStep[]
@@ -545,16 +546,16 @@ export default function AIAnalysisPanel({ onAnalysisComplete }: AIAnalysisPanelP
<label className="block text-xs font-medium text-gray-400 mb-2">Quick Timeframe Presets</label>
<div className="grid grid-cols-2 md:grid-cols-4 gap-2">
<button
onClick={() => setSelectedTimeframes(['5', '15', '60'])}
onClick={() => setSelectedTimeframes(['5', '15', '30'])}
className="py-2 px-3 rounded-lg text-xs font-medium bg-purple-600/20 text-purple-300 hover:bg-purple-600/30 transition-all"
>
🕒 Scalping (5m, 15m, 1h)
🕒 Scalping (5m, 15m, 30m)
</button>
<button
onClick={() => setSelectedTimeframes(['60', '240', 'D'])}
onClick={() => setSelectedTimeframes(['60', '120', '240'])}
className="py-2 px-3 rounded-lg text-xs font-medium bg-blue-600/20 text-blue-300 hover:bg-blue-600/30 transition-all"
>
📊 Day Trading (1h, 4h, 1d)
📊 Day Trading (1h, 2h, 4h)
</button>
<button
onClick={() => setSelectedTimeframes(['240', 'D', 'W'])}
@@ -944,7 +945,23 @@ export default function AIAnalysisPanel({ onAnalysisComplete }: AIAnalysisPanelP
</div>
<div className="grid gap-4">
{result.results.map((timeframeResult: any, index: number) => (
{result.results
.sort((a: any, b: any) => {
// Sort by timeframe order: 5m, 15m, 30m, 1h, 2h, 4h, 1D
const timeframeOrder: {[key: string]: number} = {
'5': 1, '5m': 1,
'15': 2, '15m': 2,
'30': 3, '30m': 3,
'60': 4, '1h': 4,
'120': 5, '2h': 5,
'240': 6, '4h': 6,
'D': 7, '1D': 7
}
const orderA = timeframeOrder[a.timeframe] || timeframeOrder[a.timeframeLabel] || 999
const orderB = timeframeOrder[b.timeframe] || timeframeOrder[b.timeframeLabel] || 999
return orderA - orderB
})
.map((timeframeResult: any, index: number) => (
<div key={index} className={`p-4 rounded-lg border ${
timeframeResult.success
? 'bg-green-500/5 border-green-500/30'
@@ -1425,9 +1442,43 @@ export default function AIAnalysisPanel({ onAnalysisComplete }: AIAnalysisPanelP
{/* Multi-timeframe Screenshot Gallery */}
{result && result.type === 'multi_timeframe' && result.results && (
<ScreenshotGallery
screenshots={result.results.filter((r: any) => r.success && r.result.screenshots).flatMap((r: any) => r.result.screenshots)}
screenshots={result.results
.filter((r: any) => r.success && r.result.screenshots)
.sort((a: any, b: any) => {
// Sort by timeframe order: 5m, 15m, 30m, 1h, 2h, 4h, 1D
const timeframeOrder: {[key: string]: number} = {
'5': 1, '5m': 1,
'15': 2, '15m': 2,
'30': 3, '30m': 3,
'60': 4, '1h': 4,
'120': 5, '2h': 5,
'240': 6, '4h': 6,
'D': 7, '1D': 7
}
const orderA = timeframeOrder[a.timeframe] || timeframeOrder[a.timeframeLabel] || 999
const orderB = timeframeOrder[b.timeframe] || timeframeOrder[b.timeframeLabel] || 999
return orderA - orderB
})
.flatMap((r: any) => r.result.screenshots)}
symbol={symbol}
timeframes={result.results.filter((r: any) => r.success).map((r: any) => r.timeframeLabel)}
timeframes={result.results
.filter((r: any) => r.success)
.sort((a: any, b: any) => {
// Sort by timeframe order: 5m, 15m, 30m, 1h, 2h, 4h, 1D
const timeframeOrder: {[key: string]: number} = {
'5': 1, '5m': 1,
'15': 2, '15m': 2,
'30': 3, '30m': 3,
'60': 4, '1h': 4,
'120': 5, '2h': 5,
'240': 6, '4h': 6,
'D': 7, '1D': 7
}
const orderA = timeframeOrder[a.timeframe] || timeframeOrder[a.timeframeLabel] || 999
const orderB = timeframeOrder[b.timeframe] || timeframeOrder[b.timeframeLabel] || 999
return orderA - orderB
})
.map((r: any) => r.timeframeLabel)}
enlargedImage={enlargedScreenshot}
onImageClick={handleScreenshotClick}
onClose={() => setEnlargedScreenshot(null)}