Upload 16 files

.gitignore

@@ -0,0 +1,40 @@
+node_modules/
+
+# Python
+__pycache__/
+*.py[cod]
+*$py.class
+*.so
+.Python
+venv/
+env/
+ENV/
+*.egg-info/
+.eggs/
+
+# Node
+node_modules/
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnp
+.pnp.js
+
+# React Build
+build/
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+# IDEs
+.vscode/
+.idea/
+*.swp
+*.swo
+*~
+
+# MT5
+*.ex5
+*.log

LICENSE

@@ -0,0 +1,201 @@
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "[]"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+   Copyright [yyyy] [name of copyright owner]
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.

STRUCTURE.md

@@ -0,0 +1,25 @@
+## Project Structure
+
+```text
+backtest-terminal/
+├── backend/
+│   ├── backtest_bridge.py
+│   ├── mt5_server.py
+│   └── requirements.txt
+├── trading-terminal-ui/
+│   ├── public/
+│   │   └── index.html
+│   ├── src/
+│   │   ├── App.js
+│   │   ├── App.jsx
+│   │   ├── index.css
+│   │   └── index.js
+│   ├── .gitignore
+│   ├── package-lock.json
+│   └── package.json
+├── .gitignore
+├── backtest_report.json
+├── install.bat
+├── LICENSE
+└── TECHSTACK.md
+```

TECHSTACK.md

@@ -0,0 +1,16 @@
+## Techstack
+
+Audit of **backtest-terminal** project files (excluding environment and cache):
+
+| File Type | Count | Size (KB) |
+| :--- | :--- | :--- |
+| (no extension) | 3 | 12.0 |
+| JSON (.json) | 3 | 671.3 |
+| JavaScript (.js) | 2 | 12.2 |
+| Python (.py) | 2 | 15.5 |
+| Batch File (.bat) | 1 | 0 |
+| CSS (.css) | 1 | 0.5 |
+| HTML (.html) | 1 | 0.5 |
+| JSX (React) (.jsx) | 1 | 12.2 |
+| Plain Text (.txt) | 1 | 0.1 |
+| **Total** | **15** | **724.4** |

backend/backtest_bridge.py

@@ -0,0 +1,182 @@
+import MetaTrader5 as mt5
+import json
+import os
+from datetime import datetime
+import pandas as pd
+
+class BacktestBridge:
+    """Bridge to run MQL5 Expert Advisors and extract backtest results"""
+    
+    def __init__(self):
+        self.mt5_path = None
+        
+    def init_mt5(self):
+        """Initialize MT5 connection"""
+        if not mt5.initialize():
+            print(f"MT5 initialization failed: {mt5.last_error()}")
+            return False
+        
+        # Get MT5 terminal path
+        terminal_info = mt5.terminal_info()
+        self.mt5_path = terminal_info.path
+        print(f"MT5 Path: {self.mt5_path}")
+        return True
+    
+    def compile_ea(self, mq5_file_path):
+        """
+        Compile MQL5 Expert Advisor
+        Note: This requires MetaEditor CLI or manual compilation
+        """
+        # Check if file exists
+        if not os.path.exists(mq5_file_path):
+            return {'success': False, 'error': 'MQ5 file not found'}
+        
+        # For now, assume EA is already compiled
+        # You need to manually compile in MetaEditor or use MetaEditor CLI
+        ex5_path = mq5_file_path.replace('.mq5', '.ex5')
+        
+        if not os.path.exists(ex5_path):
+            return {
+                'success': False, 
+                'error': 'EX5 file not found. Please compile in MetaEditor first.'
+            }
+        
+        return {'success': True, 'ex5_path': ex5_path}
+    
+    def get_history_deals(self, from_date, to_date):
+        """Get historical deals from MT5"""
+        deals = mt5.history_deals_get(from_date, to_date)
+        
+        if deals is None:
+            return []
+        
+        deals_list = []
+        for deal in deals:
+            deals_list.append({
+                'ticket': deal.ticket,
+                'order': deal.order,
+                'time': deal.time,
+                'type': 'BUY' if deal.type == 0 else 'SELL',
+                'entry': 'IN' if deal.entry == 0 else 'OUT',
+                'symbol': deal.symbol,
+                'volume': deal.volume,
+                'price': deal.price,
+                'profit': deal.profit,
+                'commission': deal.commission,
+                'swap': deal.swap,
+                'comment': deal.comment
+            })
+        
+        return deals_list
+    
+    def get_history_orders(self, from_date, to_date):
+        """Get historical orders from MT5"""
+        orders = mt5.history_orders_get(from_date, to_date)
+        
+        if orders is None:
+            return []
+        
+        orders_list = []
+        for order in orders:
+            orders_list.append({
+                'ticket': order.ticket,
+                'time_setup': order.time_setup,
+                'time_done': order.time_done,
+                'type': order.type,
+                'state': order.state,
+                'symbol': order.symbol,
+                'volume_initial': order.volume_initial,
+                'volume_current': order.volume_current,
+                'price_open': order.price_open,
+                'price_current': order.price_current,
+                'sl': order.sl,
+                'tp': order.tp,
+                'comment': order.comment
+            })
+        
+        return orders_list
+    
+    def analyze_backtest_results(self, from_date, to_date):
+        """Analyze backtest results and calculate statistics"""
+        deals = self.get_history_deals(from_date, to_date)
+        
+        if not deals:
+            return {'error': 'No deals found in the specified period'}
+        
+        # Convert to DataFrame for easier analysis
+        df = pd.DataFrame(deals)
+        
+        # Calculate statistics
+        total_trades = len(df[df['entry'] == 'OUT'])
+        winning_trades = len(df[(df['entry'] == 'OUT') & (df['profit'] > 0)])
+        losing_trades = len(df[(df['entry'] == 'OUT') & (df['profit'] < 0)])
+        
+        total_profit = df[df['entry'] == 'OUT']['profit'].sum()
+        total_commission = df[df['entry'] == 'OUT']['commission'].sum()
+        total_swap = df[df['entry'] == 'OUT']['swap'].sum()
+        
+        net_profit = total_profit + total_commission + total_swap
+        
+        win_rate = (winning_trades / total_trades * 100) if total_trades > 0 else 0
+        
+        # Calculate max drawdown
+        df_out = df[df['entry'] == 'OUT'].copy()
+        df_out['cumulative_profit'] = df_out['profit'].cumsum()
+        df_out['peak'] = df_out['cumulative_profit'].cummax()
+        df_out['drawdown'] = df_out['peak'] - df_out['cumulative_profit']
+        max_drawdown = df_out['drawdown'].max()
+        
+        # Profit factor
+        gross_profit = df[(df['entry'] == 'OUT') & (df['profit'] > 0)]['profit'].sum()
+        gross_loss = abs(df[(df['entry'] == 'OUT') & (df['profit'] < 0)]['profit'].sum())
+        profit_factor = (gross_profit / gross_loss) if gross_loss > 0 else 0
+        
+        return {
+            'total_trades': total_trades,
+            'winning_trades': winning_trades,
+            'losing_trades': losing_trades,
+            'win_rate': round(win_rate, 2),
+            'total_profit': round(total_profit, 2),
+            'total_commission': round(total_commission, 2),
+            'total_swap': round(total_swap, 2),
+            'net_profit': round(net_profit, 2),
+            'max_drawdown': round(max_drawdown, 2),
+            'profit_factor': round(profit_factor, 2),
+            'gross_profit': round(gross_profit, 2),
+            'gross_loss': round(gross_loss, 2),
+            'deals': deals
+        }
+    
+    def export_backtest_report(self, from_date, to_date, output_file='backtest_report.json'):
+        """Export backtest results to JSON file"""
+        results = self.analyze_backtest_results(from_date, to_date)
+        
+        with open(output_file, 'w') as f:
+            json.dump(results, f, indent=2, default=str)
+        
+        print(f"Backtest report exported to {output_file}")
+        return results
+
+# Example usage
+if __name__ == "__main__":
+    bridge = BacktestBridge()
+    
+    if bridge.init_mt5():
+        # Define backtest period
+        from_date = datetime(2024, 1, 1)
+        to_date = datetime.now()
+        
+        # Analyze results
+        results = bridge.analyze_backtest_results(from_date, to_date)
+        
+        print("\n=== BACKTEST RESULTS ===")
+        print(f"Total Trades: {results.get('total_trades', 0)}")
+        print(f"Win Rate: {results.get('win_rate', 0)}%")
+        print(f"Net Profit: ${results.get('net_profit', 0)}")
+        print(f"Max Drawdown: ${results.get('max_drawdown', 0)}")
+        print(f"Profit Factor: {results.get('profit_factor', 0)}")
+        
+        # Export to JSON
+        bridge.export_backtest_report(from_date, to_date)
+        
+        mt5.shutdown()

backend/mt5_server.py

@@ -0,0 +1,248 @@
+import asyncio
+import json
+import MetaTrader5 as mt5
+from datetime import datetime
+import websockets
+import numpy as np
+
+class MT5Server:
+    def __init__(self):
+        self.clients = set()
+        self.running = False
+        
+    async def init_mt5(self):
+        """Initialize MT5 connection"""
+        if not mt5.initialize():
+            print(f"MT5 initialization failed: {mt5.last_error()}")
+            return False
+        print(f"MT5 initialized. Version: {mt5.version()}")
+        return True
+    
+    def get_rates(self, symbol, timeframe, count=500):
+        """Fetch historical rates from MT5"""
+        rates = mt5.copy_rates_from_pos(symbol, timeframe, 0, count)
+        if rates is None:
+            return None
+        
+        return [{
+            'time': int(rate[0]) * 1000,  # Convert to milliseconds
+            'open': float(rate[1]),
+            'high': float(rate[2]),
+            'low': float(rate[3]),
+            'close': float(rate[4]),
+            'volume': int(rate[5])
+        } for rate in rates]
+    
+    def get_tick(self, symbol):
+        """Get latest tick data"""
+        tick = mt5.symbol_info_tick(symbol)
+        if tick is None:
+            return None
+        
+        return {
+            'time': tick.time * 1000,
+            'bid': tick.bid,
+            'ask': tick.ask,
+            'last': tick.last,
+            'volume': tick.volume
+        }
+    
+    def get_positions(self):
+        """Get open positions"""
+        positions = mt5.positions_get()
+        if positions is None:
+            return []
+        
+        return [{
+            'ticket': pos.ticket,
+            'symbol': pos.symbol,
+            'type': 'BUY' if pos.type == 0 else 'SELL',
+            'volume': pos.volume,
+            'price_open': pos.price_open,
+            'price_current': pos.price_current,
+            'profit': pos.profit,
+            'sl': pos.sl,
+            'tp': pos.tp
+        } for pos in positions]
+    
+    def place_order(self, symbol, order_type, volume, price=None, sl=None, tp=None):
+        """Place market or pending order"""
+        symbol_info = mt5.symbol_info(symbol)
+        if symbol_info is None:
+            return {'success': False, 'error': 'Symbol not found'}
+        
+        if not symbol_info.visible:
+            if not mt5.symbol_select(symbol, True):
+                return {'success': False, 'error': 'Failed to select symbol'}
+        
+        point = symbol_info.point
+        
+        request = {
+            "action": mt5.TRADE_ACTION_DEAL,
+            "symbol": symbol,
+            "volume": volume,
+            "type": mt5.ORDER_TYPE_BUY if order_type == 'BUY' else mt5.ORDER_TYPE_SELL,
+            "deviation": 20,
+            "magic": 234000,
+            "comment": "Trading Terminal",
+            "type_time": mt5.ORDER_TIME_GTC,
+            "type_filling": mt5.ORDER_FILLING_IOC,
+        }
+        
+        if price:
+            request["price"] = price
+        
+        if sl:
+            request["sl"] = sl
+        
+        if tp:
+            request["tp"] = tp
+        
+        result = mt5.order_send(request)
+        
+        if result.retcode != mt5.TRADE_RETCODE_DONE:
+            return {'success': False, 'error': f'Order failed: {result.comment}'}
+        
+        return {
+            'success': True,
+            'ticket': result.order,
+            'volume': result.volume,
+            'price': result.price
+        }
+    
+    def close_position(self, ticket):
+        """Close position by ticket"""
+        positions = mt5.positions_get(ticket=ticket)
+        if not positions:
+            return {'success': False, 'error': 'Position not found'}
+        
+        position = positions[0]
+        
+        request = {
+            "action": mt5.TRADE_ACTION_DEAL,
+            "symbol": position.symbol,
+            "volume": position.volume,
+            "type": mt5.ORDER_TYPE_SELL if position.type == 0 else mt5.ORDER_TYPE_BUY,
+            "position": ticket,
+            "deviation": 20,
+            "magic": 234000,
+            "comment": "Close position",
+            "type_time": mt5.ORDER_TIME_GTC,
+            "type_filling": mt5.ORDER_FILLING_IOC,
+        }
+        
+        result = mt5.order_send(request)
+        
+        if result.retcode != mt5.TRADE_RETCODE_DONE:
+            return {'success': False, 'error': f'Close failed: {result.comment}'}
+        
+        return {'success': True, 'ticket': ticket}
+    
+    async def handle_client(self, websocket, path):
+        """Handle WebSocket client connections"""
+        self.clients.add(websocket)
+        print(f"Client connected. Total clients: {len(self.clients)}")
+        
+        try:
+            async for message in websocket:
+                data = json.loads(message)
+                action = data.get('action')
+                
+                if action == 'get_rates':
+                    symbol = data.get('symbol', 'XAUUSDc')
+                    timeframe_map = {
+                        'M1': mt5.TIMEFRAME_M1,
+                        'M5': mt5.TIMEFRAME_M5,
+                        'M15': mt5.TIMEFRAME_M15,
+                        'M30': mt5.TIMEFRAME_M30,
+                        'H1': mt5.TIMEFRAME_H1,
+                        'H4': mt5.TIMEFRAME_H4,
+                        'D1': mt5.TIMEFRAME_D1
+                    }
+                    timeframe = timeframe_map.get(data.get('timeframe', 'M15'), mt5.TIMEFRAME_M15)
+                    count = data.get('count', 500)
+                    
+                    rates = self.get_rates(symbol, timeframe, count)
+                    await websocket.send(json.dumps({
+                        'type': 'rates',
+                        'data': rates
+                    }))
+                
+                elif action == 'get_tick':
+                    symbol = data.get('symbol', 'XAUUSDc')
+                    tick = self.get_tick(symbol)
+                    await websocket.send(json.dumps({
+                        'type': 'tick',
+                        'data': tick
+                    }))
+                
+                elif action == 'get_positions':
+                    positions = self.get_positions()
+                    await websocket.send(json.dumps({
+                        'type': 'positions',
+                        'data': positions
+                    }))
+                
+                elif action == 'place_order':
+                    result = self.place_order(
+                        data.get('symbol'),
+                        data.get('order_type'),
+                        data.get('volume'),
+                        data.get('price'),
+                        data.get('sl'),
+                        data.get('tp')
+                    )
+                    await websocket.send(json.dumps({
+                        'type': 'order_result',
+                        'data': result
+                    }))
+                
+                elif action == 'close_position':
+                    result = self.close_position(data.get('ticket'))
+                    await websocket.send(json.dumps({
+                        'type': 'close_result',
+                        'data': result
+                    }))
+                
+        except websockets.exceptions.ConnectionClosed:
+            pass
+        finally:
+            self.clients.remove(websocket)
+            print(f"Client disconnected. Total clients: {len(self.clients)}")
+    
+    async def broadcast_ticks(self):
+        """Broadcast real-time ticks to all connected clients"""
+        symbols = ['XAUUSDc']  # Add more symbols as needed
+        
+        while self.running:
+            for symbol in symbols:
+                tick = self.get_tick(symbol)
+                if tick and self.clients:
+                    message = json.dumps({
+                        'type': 'tick_update',
+                        'symbol': symbol,
+                        'data': tick
+                    })
+                    await asyncio.gather(
+                        *[client.send(message) for client in self.clients],
+                        return_exceptions=True
+                    )
+            await asyncio.sleep(0.1)  # Update every 100ms
+    
+    async def start(self):
+        """Start the WebSocket server"""
+        if not await self.init_mt5():
+            return
+        
+        self.running = True
+        
+        # Start WebSocket server
+        server = await websockets.serve(self.handle_client, "localhost", 8765)
+        print("WebSocket server started on ws://localhost:8765")
+        
+        # Start broadcasting ticks
+        await self.broadcast_ticks()
+
+if __name__ == "__main__":
+    server = MT5Server()
+    asyncio.run(server.start())

backend/requirements.txt

@@ -0,0 +1,4 @@
+MetaTrader5==5.0.45
+websockets==12.0
+pandas==2.1.4
+numpy==1.26.2

backtest_report.json

@@ -0,0 +1,394 @@
+{
+  "total_trades": 13,
+  "winning_trades": 5,
+  "losing_trades": 8,
+  "win_rate": 38.46,
+  "total_profit": 113.7,
+  "total_commission": 0.0,
+  "total_swap": 0.0,
+  "net_profit": 113.7,
+  "max_drawdown": 15.6,
+  "profit_factor": 4.96,
+  "gross_profit": 142.4,
+  "gross_loss": 28.7,
+  "deals": [
+    {
+      "ticket": 578723459,
+      "order": 0,
+      "time": 1766968573,
+      "type": "SELL",
+      "entry": "IN",
+      "symbol": "",
+      "volume": 0.0,
+      "price": 0.0,
+      "profit": 100.0,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": "D-ALLINT-USC-INT-352783368197"
+    },
+    {
+      "ticket": 580337778,
+      "order": 620573573,
+      "time": 1766979732,
+      "type": "BUY",
+      "entry": "IN",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4514.934,
+      "profit": 0.0,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": "VP_Algo"
+    },
+    {
+      "ticket": 580342883,
+      "order": 620578905,
+      "time": 1766979808,
+      "type": "SELL",
+      "entry": "OUT",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4515.392,
+      "profit": 0.5,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": ""
+    },
+    {
+      "ticket": 588526608,
+      "order": 629060201,
+      "time": 1767053978,
+      "type": "BUY",
+      "entry": "IN",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4347.824,
+      "profit": 0.0,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": ""
+    },
+    {
+      "ticket": 588530081,
+      "order": 629064107,
+      "time": 1767054032,
+      "type": "SELL",
+      "entry": "OUT",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4346.818,
+      "profit": -1.0,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": "[sl 4346.818]"
+    },
+    {
+      "ticket": 588535145,
+      "order": 629069232,
+      "time": 1767054071,
+      "type": "BUY",
+      "entry": "IN",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4346.317,
+      "profit": 0.0,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": ""
+    },
+    {
+      "ticket": 588595427,
+      "order": 0,
+      "time": 1767055151,
+      "type": "SELL",
+      "entry": "OUT",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4343.795,
+      "profit": -2.5,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": "[sl 4343.79500]"
+    },
+    {
+      "ticket": 601258658,
+      "order": 642405265,
+      "time": 1767315535,
+      "type": "BUY",
+      "entry": "IN",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4354.362,
+      "profit": 0.0,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": ""
+    },
+    {
+      "ticket": 601276711,
+      "order": 0,
+      "time": 1767315824,
+      "type": "SELL",
+      "entry": "OUT",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4351.078,
+      "profit": -3.3,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": "[sl 4351.07800]"
+    },
+    {
+      "ticket": 607246461,
+      "order": 648712225,
+      "time": 1767571920,
+      "type": "BUY",
+      "entry": "IN",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4378.567,
+      "profit": 0.0,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": "Range Breakout Buy"
+    },
+    {
+      "ticket": 607281279,
+      "order": 648748642,
+      "time": 1767572371,
+      "type": "BUY",
+      "entry": "IN",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4381.582,
+      "profit": 0.0,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": ""
+    },
+    {
+      "ticket": 607376045,
+      "order": 0,
+      "time": 1767573440,
+      "type": "SELL",
+      "entry": "OUT",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4394.923,
+      "profit": 13.3,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": "[tp 4394.92300]"
+    },
+    {
+      "ticket": 610689356,
+      "order": 652309428,
+      "time": 1767610937,
+      "type": "SELL",
+      "entry": "OUT",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4433.214,
+      "profit": 54.6,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": "Range Breakout Buy"
+    },
+    {
+      "ticket": 620907374,
+      "order": 662951034,
+      "time": 1767744180,
+      "type": "SELL",
+      "entry": "IN",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4491.423,
+      "profit": 0.0,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": "Range Breakout Sell"
+    },
+    {
+      "ticket": 620933920,
+      "order": 0,
+      "time": 1767744663,
+      "type": "BUY",
+      "entry": "OUT",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4494.081,
+      "profit": -2.7,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": "[sl 4494.08100]"
+    },
+    {
+      "ticket": 628261457,
+      "order": 670596444,
+      "time": 1767830580,
+      "type": "BUY",
+      "entry": "IN",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4465.5019999999995,
+      "profit": 0.0,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": "Range Breakout Buy"
+    },
+    {
+      "ticket": 628277670,
+      "order": 670613032,
+      "time": 1767830754,
+      "type": "SELL",
+      "entry": "OUT",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4462.901,
+      "profit": -2.6,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": "[sl 4462.901]"
+    },
+    {
+      "ticket": 636550803,
+      "order": 679232561,
+      "time": 1767917700,
+      "type": "SELL",
+      "entry": "IN",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4471.601,
+      "profit": 0.0,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": "Range Breakout Sell"
+    },
+    {
+      "ticket": 636551187,
+      "order": 679232900,
+      "time": 1767917701,
+      "type": "SELL",
+      "entry": "IN",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4471.5740000000005,
+      "profit": 0.0,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": ""
+    },
+    {
+      "ticket": 638748995,
+      "order": 0,
+      "time": 1767941180,
+      "type": "BUY",
+      "entry": "OUT",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4476.754,
+      "profit": -5.2,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": "[sl 4476.75400]"
+    },
+    {
+      "ticket": 638749010,
+      "order": 0,
+      "time": 1767941180,
+      "type": "BUY",
+      "entry": "OUT",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4476.735,
+      "profit": -5.1,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": "[sl 4476.73500]"
+    },
+    {
+      "ticket": 664419807,
+      "order": 699190077,
+      "time": 1768336462,
+      "type": "BUY",
+      "entry": "IN",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4571.919,
+      "profit": 0.0,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": ""
+    },
+    {
+      "ticket": 664845365,
+      "order": 709205437,
+      "time": 1768348981,
+      "type": "BUY",
+      "entry": "IN",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4600.441,
+      "profit": 0.0,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": "Range Breakout Buy"
+    },
+    {
+      "ticket": 665166396,
+      "order": 0,
+      "time": 1768352542,
+      "type": "SELL",
+      "entry": "OUT",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4614.71,
+      "profit": 42.8,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": "[tp 4614.71000]"
+    },
+    {
+      "ticket": 666704758,
+      "order": 0,
+      "time": 1768366884,
+      "type": "SELL",
+      "entry": "OUT",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4631.589,
+      "profit": 31.2,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": "[tp 4631.58900]"
+    },
+    {
+      "ticket": 684828173,
+      "order": 730182325,
+      "time": 1768522098,
+      "type": "SELL",
+      "entry": "IN",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4604.909,
+      "profit": 0.0,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": ""
+    },
+    {
+      "ticket": 684898688,
+      "order": 0,
+      "time": 1768522974,
+      "type": "BUY",
+      "entry": "OUT",
+      "symbol": "XAUUSDc",
+      "volume": 0.01,
+      "price": 4611.201,
+      "profit": -6.3,
+      "commission": 0.0,
+      "swap": 0.0,
+      "comment": "[sl 4611.20100]"
+    }
+  ]
+}

trading-terminal-ui/.gitignore

@@ -0,0 +1,40 @@
+node_modules/
+
+# Python
+__pycache__/
+*.py[cod]
+*$py.class
+*.so
+.Python
+venv/
+env/
+ENV/
+*.egg-info/
+.eggs/
+
+# Node
+node_modules/
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnp
+.pnp.js
+
+# React Build
+build/
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+# IDEs
+.vscode/
+.idea/
+*.swp
+*.swo
+*~
+
+# MT5
+*.ex5
+*.log

trading-terminal-ui/package.json

@@ -0,0 +1,35 @@
+{
+  "name": "trading-terminal-ui",
+  "version": "0.1.0",
+  "private": true,
+  "dependencies": {
+    "lucide-react": "^0.263.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-scripts": "5.0.1",
+    "recharts": "^2.15.4"
+  },
+  "scripts": {
+    "start": "react-scripts start",
+    "build": "react-scripts build",
+    "test": "react-scripts test",
+    "eject": "react-scripts eject"
+  },
+  "eslintConfig": {
+    "extends": [
+      "react-app"
+    ]
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
+}

trading-terminal-ui/public/index.html

@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <meta name="description" content="Professional MT5 Trading Terminal" />
+    <title>Trading Terminal</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+  </head>
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+  </body>
+</html>

trading-terminal-ui/src/App.js

@@ -0,0 +1,314 @@
+import React, { useState, useEffect } from 'react';
+import { LineChart, Line, XAxis, YAxis, Tooltip, ResponsiveContainer } from 'recharts';
+import { TrendingUp, TrendingDown, X } from 'lucide-react';
+
+const TradingTerminal = () => {
+  const [ws, setWs] = useState(null);
+  const [connected, setConnected] = useState(false);
+  const [symbol, setSymbol] = useState('XAUUSDc');
+  const [timeframe, setTimeframe] = useState('M15');
+  const [chartData, setChartData] = useState([]);
+  const [tick, setTick] = useState(null);
+  const [positions, setPositions] = useState([]);
+  const [volume, setVolume] = useState(0.01);
+  const [sl, setSl] = useState('');
+  const [tp, setTp] = useState('');
+  
+  useEffect(() => {
+    const socket = new WebSocket('ws://localhost:8765');
+    
+    socket.onopen = () => {
+      setConnected(true);
+      console.log('Connected to MT5 server');
+      
+      socket.send(JSON.stringify({
+        action: 'get_rates',
+        symbol: symbol,
+        timeframe: timeframe,
+        count: 500
+      }));
+      
+      socket.send(JSON.stringify({ action: 'get_positions' }));
+    };
+    
+    socket.onmessage = (event) => {
+      const message = JSON.parse(event.data);
+      
+      if (message.type === 'rates') {
+        setChartData(message.data || []);
+      } else if (message.type === 'tick_update' || message.type === 'tick') {
+        setTick(message.data);
+      } else if (message.type === 'positions') {
+        setPositions(message.data || []);
+      } else if (message.type === 'order_result') {
+        if (message.data.success) {
+          alert('Order placed successfully!');
+          socket.send(JSON.stringify({ action: 'get_positions' }));
+        } else {
+          alert('Order failed: ' + message.data.error);
+        }
+      } else if (message.type === 'close_result') {
+        if (message.data.success) {
+          alert('Position closed!');
+          socket.send(JSON.stringify({ action: 'get_positions' }));
+        } else {
+          alert('Close failed: ' + message.data.error);
+        }
+      }
+    };
+    
+    socket.onerror = (error) => {
+      console.error('WebSocket error:', error);
+      setConnected(false);
+    };
+    
+    socket.onclose = () => {
+      setConnected(false);
+      console.log('Disconnected from MT5 server');
+    };
+    
+    setWs(socket);
+    
+    return () => {
+      socket.close();
+    };
+  }, []);
+  
+  const placeOrder = (type) => {
+    if (!ws || !connected) return;
+    
+    ws.send(JSON.stringify({
+      action: 'place_order',
+      symbol: symbol,
+      order_type: type,
+      volume: parseFloat(volume),
+      sl: sl ? parseFloat(sl) : null,
+      tp: tp ? parseFloat(tp) : null
+    }));
+  };
+  
+  const closePosition = (ticket) => {
+    if (!ws || !connected) return;
+    
+    ws.send(JSON.stringify({
+      action: 'close_position',
+      ticket: ticket
+    }));
+  };
+  
+  const changeTimeframe = (tf) => {
+    setTimeframe(tf);
+    if (ws && connected) {
+      ws.send(JSON.stringify({
+        action: 'get_rates',
+        symbol: symbol,
+        timeframe: tf,
+        count: 500
+      }));
+    }
+  };
+  
+  const formatPrice = (price) => {
+    return price ? price.toFixed(2) : '-';
+  };
+  
+  const totalPnL = positions.reduce((sum, pos) => sum + pos.profit, 0);
+
+  return (
+    <div className="w-full h-screen bg-neutral-950 text-neutral-200 flex flex-col">
+      <div className="h-12 bg-neutral-900 border-b border-yellow-600/20 flex items-center justify-between px-4">
+        <div className="flex items-center gap-4">
+          <div className="flex items-center gap-2">
+            <div className={`w-2 h-2 rounded-full ${connected ? 'bg-yellow-500' : 'bg-neutral-600'}`}></div>
+            <span className="text-sm font-medium text-yellow-500">{symbol}</span>
+          </div>
+          
+          {tick && (
+            <div className="flex items-center gap-4 text-sm">
+              <span className="text-neutral-400">BID: <span className="text-yellow-500 font-mono">{formatPrice(tick.bid)}</span></span>
+              <span className="text-neutral-400">ASK: <span className="text-yellow-500 font-mono">{formatPrice(tick.ask)}</span></span>
+            </div>
+          )}
+        </div>
+        
+        <div className="flex items-center gap-2">
+          <span className={`text-sm font-mono ${totalPnL >= 0 ? 'text-green-500' : 'text-red-500'}`}>
+            P&L: ${totalPnL.toFixed(2)}
+          </span>
+        </div>
+      </div>
+      
+      <div className="flex-1 flex overflow-hidden">
+        <div className="flex-1 flex flex-col">
+          <div className="h-10 bg-neutral-900 border-b border-yellow-600/20 flex items-center px-4 gap-2">
+            {['M1', 'M5', 'M15', 'M30', 'H1', 'H4', 'D1'].map(tf => (
+              <button
+                key={tf}
+                onClick={() => changeTimeframe(tf)}
+                className={`px-3 py-1 text-xs font-medium transition-colors ${
+                  timeframe === tf 
+                    ? 'bg-yellow-600 text-neutral-950' 
+                    : 'text-neutral-400 hover:text-yellow-500'
+                }`}
+              >
+                {tf}
+              </button>
+            ))}
+          </div>
+          
+          <div className="flex-1 bg-neutral-950 p-4">
+            {chartData.length > 0 ? (
+              <ResponsiveContainer width="100%" height="100%">
+                <LineChart data={chartData}>
+                  <XAxis 
+                    dataKey="time" 
+                    tickFormatter={(time) => new Date(time).toLocaleTimeString()}
+                    stroke="#525252"
+                    style={{ fontSize: 10 }}
+                  />
+                  <YAxis 
+                    domain={['auto', 'auto']}
+                    stroke="#525252"
+                    style={{ fontSize: 10 }}
+                  />
+                  <Tooltip 
+                    contentStyle={{ 
+                      backgroundColor: '#171717', 
+                      border: '1px solid #ca8a04',
+                      borderRadius: 0,
+                      fontSize: 12
+                    }}
+                    labelFormatter={(time) => new Date(time).toLocaleString()}
+                  />
+                  <Line 
+                    type="monotone" 
+                    dataKey="close" 
+                    stroke="#ca8a04" 
+                    dot={false}
+                    strokeWidth={1}
+                  />
+                </LineChart>
+              </ResponsiveContainer>
+            ) : (
+              <div className="flex items-center justify-center h-full text-neutral-600">
+                Loading chart data...
+              </div>
+            )}
+          </div>
+        </div>
+        
+        <div className="w-80 bg-neutral-900 border-l border-yellow-600/20 flex flex-col">
+          <div className="p-4 border-b border-yellow-600/20">
+            <div className="text-xs font-medium text-yellow-500 mb-3">NEW ORDER</div>
+            
+            <div className="space-y-2">
+              <div>
+                <label className="text-xs text-neutral-400">Volume</label>
+                <input
+                  type="number"
+                  step="0.01"
+                  value={volume}
+                  onChange={(e) => setVolume(e.target.value)}
+                  className="w-full bg-neutral-950 border border-yellow-600/20 px-2 py-1 text-sm text-neutral-200 focus:outline-none focus:border-yellow-600"
+                />
+              </div>
+              
+              <div>
+                <label className="text-xs text-neutral-400">Stop Loss</label>
+                <input
+                  type="number"
+                  step="0.01"
+                  value={sl}
+                  onChange={(e) => setSl(e.target.value)}
+                  placeholder="Optional"
+                  className="w-full bg-neutral-950 border border-yellow-600/20 px-2 py-1 text-sm text-neutral-200 focus:outline-none focus:border-yellow-600 placeholder:text-neutral-700"
+                />
+              </div>
+              
+              <div>
+                <label className="text-xs text-neutral-400">Take Profit</label>
+                <input
+                  type="number"
+                  step="0.01"
+                  value={tp}
+                  onChange={(e) => setTp(e.target.value)}
+                  placeholder="Optional"
+                  className="w-full bg-neutral-950 border border-yellow-600/20 px-2 py-1 text-sm text-neutral-200 focus:outline-none focus:border-yellow-600 placeholder:text-neutral-700"
+                />
+              </div>
+              
+              <div className="flex gap-2 pt-2">
+                <button
+                  onClick={() => placeOrder('BUY')}
+                  className="flex-1 bg-green-700 hover:bg-green-600 text-white py-2 text-sm font-medium transition-colors flex items-center justify-center gap-1"
+                  disabled={!connected}
+                >
+                  <TrendingUp size={14} />
+                  BUY
+                </button>
+                <button
+                  onClick={() => placeOrder('SELL')}
+                  className="flex-1 bg-red-700 hover:bg-red-600 text-white py-2 text-sm font-medium transition-colors flex items-center justify-center gap-1"
+                  disabled={!connected}
+                >
+                  <TrendingDown size={14} />
+                  SELL
+                </button>
+              </div>
+            </div>
+          </div>
+          
+          <div className="flex-1 overflow-auto">
+            <div className="p-4">
+              <div className="text-xs font-medium text-yellow-500 mb-3">POSITIONS ({positions.length})</div>
+              
+              {positions.length === 0 ? (
+                <div className="text-xs text-neutral-600 text-center py-8">No open positions</div>
+              ) : (
+                <div className="space-y-2">
+                  {positions.map((pos) => (
+                    <div key={pos.ticket} className="bg-neutral-950 border border-yellow-600/20 p-3">
+                      <div className="flex items-start justify-between mb-2">
+                        <div>
+                          <div className="text-xs font-medium text-neutral-200">{pos.symbol}</div>
+                          <div className={`text-xs ${pos.type === 'BUY' ? 'text-green-500' : 'text-red-500'}`}>
+                            {pos.type} {pos.volume}
+                          </div>
+                        </div>
+                        <button
+                          onClick={() => closePosition(pos.ticket)}
+                          className="text-neutral-400 hover:text-red-500 transition-colors"
+                        >
+                          <X size={14} />
+                        </button>
+                      </div>
+                      
+                      <div className="space-y-1 text-xs">
+                        <div className="flex justify-between text-neutral-400">
+                          <span>Entry:</span>
+                          <span className="font-mono">{formatPrice(pos.price_open)}</span>
+                        </div>
+                        <div className="flex justify-between text-neutral-400">
+                          <span>Current:</span>
+                          <span className="font-mono">{formatPrice(pos.price_current)}</span>
+                        </div>
+                        <div className="flex justify-between">
+                          <span className="text-neutral-400">P&L:</span>
+                          <span className={`font-mono font-medium ${pos.profit >= 0 ? 'text-green-500' : 'text-red-500'}`}>
+                            ${pos.profit.toFixed(2)}
+                          </span>
+                        </div>
+                      </div>
+                    </div>
+                  ))}
+                </div>
+              )}
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default TradingTerminal;

trading-terminal-ui/src/App.jsx

@@ -0,0 +1,322 @@
+import React, { useState, useEffect, useRef } from 'react';
+import { LineChart, Line, XAxis, YAxis, Tooltip, ResponsiveContainer } from 'recharts';
+import { TrendingUp, TrendingDown, X, Activity } from 'lucide-react';
+
+const TradingTerminal = () => {
+  const [ws, setWs] = useState(null);
+  const [connected, setConnected] = useState(false);
+  const [symbol, setSymbol] = useState('XAUUSDc');
+  const [timeframe, setTimeframe] = useState('M15');
+  const [chartData, setChartData] = useState([]);
+  const [tick, setTick] = useState(null);
+  const [positions, setPositions] = useState([]);
+  const [volume, setVolume] = useState(0.01);
+  const [sl, setSl] = useState('');
+  const [tp, setTp] = useState('');
+  
+  useEffect(() => {
+    const socket = new WebSocket('ws://localhost:8765');
+    
+    socket.onopen = () => {
+      setConnected(true);
+      console.log('Connected to MT5 server');
+      
+      socket.send(JSON.stringify({
+        action: 'get_rates',
+        symbol: symbol,
+        timeframe: timeframe,
+        count: 500
+      }));
+      
+      socket.send(JSON.stringify({ action: 'get_positions' }));
+    };
+    
+    socket.onmessage = (event) => {
+      const message = JSON.parse(event.data);
+      
+      if (message.type === 'rates') {
+        setChartData(message.data || []);
+      } else if (message.type === 'tick_update' || message.type === 'tick') {
+        setTick(message.data);
+      } else if (message.type === 'positions') {
+        setPositions(message.data || []);
+      } else if (message.type === 'order_result') {
+        if (message.data.success) {
+          alert('Order placed successfully!');
+          socket.send(JSON.stringify({ action: 'get_positions' }));
+        } else {
+          alert('Order failed: ' + message.data.error);
+        }
+      } else if (message.type === 'close_result') {
+        if (message.data.success) {
+          alert('Position closed!');
+          socket.send(JSON.stringify({ action: 'get_positions' }));
+        } else {
+          alert('Close failed: ' + message.data.error);
+        }
+      }
+    };
+    
+    socket.onerror = (error) => {
+      console.error('WebSocket error:', error);
+      setConnected(false);
+    };
+    
+    socket.onclose = () => {
+      setConnected(false);
+      console.log('Disconnected from MT5 server');
+    };
+    
+    setWs(socket);
+    
+    return () => {
+      socket.close();
+    };
+  }, []);
+  
+  const placeOrder = (type) => {
+    if (!ws || !connected) return;
+    
+    ws.send(JSON.stringify({
+      action: 'place_order',
+      symbol: symbol,
+      order_type: type,
+      volume: parseFloat(volume),
+      sl: sl ? parseFloat(sl) : null,
+      tp: tp ? parseFloat(tp) : null
+    }));
+  };
+  
+  const closePosition = (ticket) => {
+    if (!ws || !connected) return;
+    
+    ws.send(JSON.stringify({
+      action: 'close_position',
+      ticket: ticket
+    }));
+  };
+  
+  const changeTimeframe = (tf) => {
+    setTimeframe(tf);
+    if (ws && connected) {
+      ws.send(JSON.stringify({
+        action: 'get_rates',
+        symbol: symbol,
+        timeframe: tf,
+        count: 500
+      }));
+    }
+  };
+  
+  const formatPrice = (price) => {
+    return price ? price.toFixed(2) : '-';
+  };
+  
+  const totalPnL = positions.reduce((sum, pos) => sum + pos.profit, 0);
+
+  return (
+    <div className="w-full h-screen bg-neutral-950 text-neutral-200 flex flex-col">
+      {/* Header */}
+      <div className="h-12 bg-neutral-900 border-b border-yellow-600/20 flex items-center justify-between px-4">
+        <div className="flex items-center gap-4">
+          <div className="flex items-center gap-2">
+            <div className={`w-2 h-2 rounded-full ${connected ? 'bg-yellow-500' : 'bg-neutral-600'}`}></div>
+            <span className="text-sm font-medium text-yellow-500">{symbol}</span>
+          </div>
+          
+          {tick && (
+            <div className="flex items-center gap-4 text-sm">
+              <span className="text-neutral-400">BID: <span className="text-yellow-500 font-mono">{formatPrice(tick.bid)}</span></span>
+              <span className="text-neutral-400">ASK: <span className="text-yellow-500 font-mono">{formatPrice(tick.ask)}</span></span>
+            </div>
+          )}
+        </div>
+        
+        <div className="flex items-center gap-2">
+          <span className={`text-sm font-mono ${totalPnL >= 0 ? 'text-green-500' : 'text-red-500'}`}>
+            P&L: ${totalPnL.toFixed(2)}
+          </span>
+        </div>
+      </div>
+      
+      {/* Main Content */}
+      <div className="flex-1 flex overflow-hidden">
+        {/* Chart Area */}
+        <div className="flex-1 flex flex-col">
+          {/* Timeframe Selector */}
+          <div className="h-10 bg-neutral-900 border-b border-yellow-600/20 flex items-center px-4 gap-2">
+            {['M1', 'M5', 'M15', 'M30', 'H1', 'H4', 'D1'].map(tf => (
+              <button
+                key={tf}
+                onClick={() => changeTimeframe(tf)}
+                className={`px-3 py-1 text-xs font-medium transition-colors ${
+                  timeframe === tf 
+                    ? 'bg-yellow-600 text-neutral-950' 
+                    : 'text-neutral-400 hover:text-yellow-500'
+                }`}
+              >
+                {tf}
+              </button>
+            ))}
+          </div>
+          
+          {/* Chart */}
+          <div className="flex-1 bg-neutral-950 p-4">
+            {chartData.length > 0 ? (
+              <ResponsiveContainer width="100%" height="100%">
+                <LineChart data={chartData}>
+                  <XAxis 
+                    dataKey="time" 
+                    tickFormatter={(time) => new Date(time).toLocaleTimeString()}
+                    stroke="#525252"
+                    style={{ fontSize: 10 }}
+                  />
+                  <YAxis 
+                    domain={['auto', 'auto']}
+                    stroke="#525252"
+                    style={{ fontSize: 10 }}
+                  />
+                  <Tooltip 
+                    contentStyle={{ 
+                      backgroundColor: '#171717', 
+                      border: '1px solid #ca8a04',
+                      borderRadius: 0,
+                      fontSize: 12
+                    }}
+                    labelFormatter={(time) => new Date(time).toLocaleString()}
+                  />
+                  <Line 
+                    type="monotone" 
+                    dataKey="close" 
+                    stroke="#ca8a04" 
+                    dot={false}
+                    strokeWidth={1}
+                  />
+                </LineChart>
+              </ResponsiveContainer>
+            ) : (
+              <div className="flex items-center justify-center h-full text-neutral-600">
+                Loading chart data...
+              </div>
+            )}
+          </div>
+        </div>
+        
+        {/* Right Panel */}
+        <div className="w-80 bg-neutral-900 border-l border-yellow-600/20 flex flex-col">
+          {/* Trade Panel */}
+          <div className="p-4 border-b border-yellow-600/20">
+            <div className="text-xs font-medium text-yellow-500 mb-3">NEW ORDER</div>
+            
+            <div className="space-y-2">
+              <div>
+                <label className="text-xs text-neutral-400">Volume</label>
+                <input
+                  type="number"
+                  step="0.01"
+                  value={volume}
+                  onChange={(e) => setVolume(e.target.value)}
+                  className="w-full bg-neutral-950 border border-yellow-600/20 px-2 py-1 text-sm text-neutral-200 focus:outline-none focus:border-yellow-600"
+                />
+              </div>
+              
+              <div>
+                <label className="text-xs text-neutral-400">Stop Loss</label>
+                <input
+                  type="number"
+                  step="0.01"
+                  value={sl}
+                  onChange={(e) => setSl(e.target.value)}
+                  placeholder="Optional"
+                  className="w-full bg-neutral-950 border border-yellow-600/20 px-2 py-1 text-sm text-neutral-200 focus:outline-none focus:border-yellow-600 placeholder:text-neutral-700"
+                />
+              </div>
+              
+              <div>
+                <label className="text-xs text-neutral-400">Take Profit</label>
+                <input
+                  type="number"
+                  step="0.01"
+                  value={tp}
+                  onChange={(e) => setTp(e.target.value)}
+                  placeholder="Optional"
+                  className="w-full bg-neutral-950 border border-yellow-600/20 px-2 py-1 text-sm text-neutral-200 focus:outline-none focus:border-yellow-600 placeholder:text-neutral-700"
+                />
+              </div>
+              
+              <div className="flex gap-2 pt-2">
+                <button
+                  onClick={() => placeOrder('BUY')}
+                  className="flex-1 bg-green-700 hover:bg-green-600 text-white py-2 text-sm font-medium transition-colors flex items-center justify-center gap-1"
+                  disabled={!connected}
+                >
+                  <TrendingUp size={14} />
+                  BUY
+                </button>
+                <button
+                  onClick={() => placeOrder('SELL')}
+                  className="flex-1 bg-red-700 hover:bg-red-600 text-white py-2 text-sm font-medium transition-colors flex items-center justify-center gap-1"
+                  disabled={!connected}
+                >
+                  <TrendingDown size={14} />
+                  SELL
+                </button>
+              </div>
+            </div>
+          </div>
+          
+          {/* Positions Panel */}
+          <div className="flex-1 overflow-auto">
+            <div className="p-4">
+              <div className="text-xs font-medium text-yellow-500 mb-3">POSITIONS ({positions.length})</div>
+              
+              {positions.length === 0 ? (
+                <div className="text-xs text-neutral-600 text-center py-8">No open positions</div>
+              ) : (
+                <div className="space-y-2">
+                  {positions.map((pos) => (
+                    <div key={pos.ticket} className="bg-neutral-950 border border-yellow-600/20 p-3">
+                      <div className="flex items-start justify-between mb-2">
+                        <div>
+                          <div className="text-xs font-medium text-neutral-200">{pos.symbol}</div>
+                          <div className={`text-xs ${pos.type === 'BUY' ? 'text-green-500' : 'text-red-500'}`}>
+                            {pos.type} {pos.volume}
+                          </div>
+                        </div>
+                        <button
+                          onClick={() => closePosition(pos.ticket)}
+                          className="text-neutral-400 hover:text-red-500 transition-colors"
+                        >
+                          <X size={14} />
+                        </button>
+                      </div>
+                      
+                      <div className="space-y-1 text-xs">
+                        <div className="flex justify-between text-neutral-400">
+                          <span>Entry:</span>
+                          <span className="font-mono">{formatPrice(pos.price_open)}</span>
+                        </div>
+                        <div className="flex justify-between text-neutral-400">
+                          <span>Current:</span>
+                          <span className="font-mono">{formatPrice(pos.price_current)}</span>
+                        </div>
+                        <div className="flex justify-between">
+                          <span className="text-neutral-400">P&L:</span>
+                          <span className={`font-mono font-medium ${pos.profit >= 0 ? 'text-green-500' : 'text-red-500'}`}>
+                            ${pos.profit.toFixed(2)}
+                          </span>
+                        </div>
+                      </div>
+                    </div>
+                  ))}
+                </div>
+              )}
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default TradingTerminal;

trading-terminal-ui/src/index.css

@@ -0,0 +1,25 @@
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+body {
+  margin: 0;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
+    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+    sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  overflow: hidden;
+}
+
+code {
+  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
+    monospace;
+}
+
+#root {
+  height: 100vh;
+  width: 100vw;
+}

trading-terminal-ui/src/index.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import ReactDOM from 'react-dom/client';
+import './index.css';
+import App from './App';
+
+const root = ReactDOM.createRoot(document.getElementById('root'));
+root.render(
+  <React.StrictMode>
+    <App />
+  </React.StrictMode>
+);