From f6f14a92e71dc9a562da403733e20239ea1b97e7 Mon Sep 17 00:00:00 2001
From: tedoaba <tedoaba@gmail.com>
Date: Tue, 22 Oct 2024 16:23:57 +0300
Subject: [PATCH] Dashboard

---
 dashboard/app.py           | 43 ++++++++++++++++++++++
 dashboard/dash_app.py      | 73 ++++++++++++++++++++++++++++++++++++++
 dashboard/requirements.txt |  4 +++
 3 files changed, 120 insertions(+)
 create mode 100644 dashboard/app.py
 create mode 100644 dashboard/dash_app.py
 create mode 100644 dashboard/requirements.txt

diff --git a/dashboard/app.py b/dashboard/app.py
new file mode 100644
index 0000000..85c2d5f
--- /dev/null
+++ b/dashboard/app.py
@@ -0,0 +1,43 @@
+from flask import Flask, jsonify
+import pandas as pd
+
+app = Flask(__name__)
+
+# Load data
+data_file = '../data/merged_data_raw.csv'
+df = pd.read_csv(data_file)
+
+@app.route('/')
+def home():
+    welcome = "Welcome"
+    return welcome
+
+@app.route('/api/summary', methods=['GET'])
+def summary():
+    total_transactions = len(df)
+    total_fraud_cases = df[df['class'] == 1].shape[0]
+    fraud_percentage = (total_fraud_cases / total_transactions) * 100 if total_transactions > 0 else 0
+    return jsonify({
+        'total_transactions': total_transactions,
+        'total_fraud_cases': total_fraud_cases,
+        'fraud_percentage': fraud_percentage
+    })
+
+@app.route('/api/fraud_trends', methods=['GET'])
+def fraud_trends():
+    # Group by date and count fraud cases
+    trends = df[df['class'] == 1].groupby('purchase_time').size().reset_index(name='fraud_cases')
+    return trends.to_json(orient='records')
+
+@app.route('/api/geographical_analysis', methods=['GET'])
+def geographical_analysis():
+    geo_data = df.groupby('country')['ip_address'].sum().reset_index()
+    return geo_data.to_json(orient='records')
+
+@app.route('/api/device_browser_analysis', methods=['GET'])
+def device_browser_analysis():
+    device_browser_data = df.groupby(['device_id', 'browser'])['class'].sum().reset_index()
+    return device_browser_data.to_json(orient='records')
+
+if __name__ == '__main__':
+    app.run(debug=True)
diff --git a/dashboard/dash_app.py b/dashboard/dash_app.py
new file mode 100644
index 0000000..8ce224b
--- /dev/null
+++ b/dashboard/dash_app.py
@@ -0,0 +1,73 @@
+from dash import Dash, dcc, html, Input, Output
+import requests
+import pandas as pd
+import plotly.express as px
+
+app = Dash(__name__, suppress_callback_exceptions=True)
+
+# Layout of the dashboard
+app.layout = html.Div([
+    dcc.Location(id='url', refresh=False),
+
+    html.H1("Fraud Insights Dashboard"),
+    
+    # Summary Boxes
+    html.Div(id='summary-boxes'),
+    
+    # Line chart for fraud trends
+    dcc.Graph(id='fraud-trends-chart'),
+    
+    # Geographical analysis
+    dcc.Graph(id='geographical-chart'),
+    
+    # Device and browser analysis
+    dcc.Graph(id='device-browser-chart'),
+])
+
+# Callback to update summary boxes
+@app.callback(Output('summary-boxes', 'children'),
+              Input('url', 'pathname'))
+def update_summary_boxes(pathname):
+    response = requests.get('http://127.0.0.1:5000/api/summary')
+    data = response.json()
+    
+    return html.Div([
+        html.Div(f"Total Transactions: {data['total_transactions']}", style={'padding': 10}),
+        html.Div(f"Total Fraud Cases: {data['total_fraud_cases']}", style={'padding': 10}),
+        html.Div(f"Fraud Percentage: {data['fraud_percentage']:.2f}%", style={'padding': 10}),
+    ])
+
+# Callback to update fraud trends chart
+@app.callback(Output('fraud-trends-chart', 'figure'),
+              Input('url', 'pathname'))
+def update_fraud_trends_chart(pathname):
+    response = requests.get('http://127.0.0.1:5000/api/fraud_trends')
+    data = pd.read_json(response.text)
+    
+    fig = px.line(data, x='purchase_time', y='fraud_cases', title='Fraud Cases Over Time')
+    return fig
+
+# Callback to update geographical analysis chart
+@app.callback(Output('geographical-chart', 'figure'),
+              Input('url', 'pathname'))
+def update_geographical_chart(pathname):
+    response = requests.get('http://127.0.0.1:5000/api/geographical_analysis')
+    data = pd.read_json(response.text)
+    
+    fig = px.choropleth(data, locations='ip_address', locationmode='country',
+                        color='country', title='Fraud Cases by Location')
+    return fig
+
+# Callback to update device and browser analysis chart
+@app.callback(Output('device-browser-chart', 'figure'),
+              Input('url', 'pathname'))
+def update_device_browser_chart(pathname):
+    response = requests.get('http://127.0.0.1:5000/api/device_browser_analysis')
+    data = pd.read_json(response.text)
+    
+    fig = px.bar(data, x='device_id', y='class', color='browser',
+                 title='Fraud Cases by Device and Browser')
+    return fig
+
+if __name__ == '__main__':
+    app.run_server(debug=True)
diff --git a/dashboard/requirements.txt b/dashboard/requirements.txt
new file mode 100644
index 0000000..f25f0b1
--- /dev/null
+++ b/dashboard/requirements.txt
@@ -0,0 +1,4 @@
+Flask
+Dash
+pandas
+plotly
\ No newline at end of file