[Frontend] Implement visual RSI Overbought/Oversold indicators on TradingView Charts

[Edge-Explorer]

Description

On the frontend React dashboard, we render real-time asset charts. When a user enables the RSI indicator overlay, we want to draw clear horizontal reference lines directly on the chart at the standard levels: 70 (Overbought) and 30 (Oversold).

This will help users instantly see when an asset is trading in extreme volatility territories.

Requirements

1. Locate Chart Rendering:
   • The chart utilizes the lightweight-charts npm library in our react client workspace.
2. Implement Price Lines:
   • Use the createPriceLine API of Lightweight Charts to draw horizontal lines.
   • Config:
     • Line 1 (Overbought): price 70, color: dashed Red (#ef4444), line title: "Overbought".
     • Line 2 (Oversold): price 30, color: dashed Green (#22c55e), line title: "Oversold".

Code Pointers

• Chart UI controls: check frontend/src/components/ or corresponding chart component files.

How to run locally

Refer to CONTRIBUTING.md for local frontend client launch instructions.

[HaimiyaWasn]

@Edge-Explorer Would it be okay if I worked on this issue?

[Edge-Explorer]

Hi @HaimiyaWasn! Yes, absolutely!

I've assigned this issue to you. If you need any guidance setting up the frontend locally or locating the Lightweight Charts components, feel free to refer to our newly updated CONTRIBUTING.md guide or ask here.

Looking forward to your PR!