move all defi functionality to page and separate controller

actix_mvc_app/Cargo.lock

@@ -263,6 +263,7 @@ dependencies = [
  "serde",
  "serde_json",
  "tera",
+ "urlencoding",
  "uuid",
 ]
 
@@ -2655,6 +2656,12 @@ dependencies = [
  "percent-encoding",
 ]
 
+[[package]]
+name = "urlencoding"
+version = "2.1.3"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "daf8dba3b7eb870caf1ddeed7bc9d2a049f3cfdfae7cb521b087cc33ae4c49da"
+
 [[package]]
 name = "utf16_iter"
 version = "1.0.5"

actix_mvc_app/Cargo.toml

@@ -23,3 +23,4 @@ uuid = { version = "1.6.1", features = ["v4", "serde"] }
 lazy_static = "1.4.0"
 redis = { version = "0.23.0", features = ["tokio-comp"] }
 jsonwebtoken = "8.3.0"
+urlencoding = "2.1.3"

actix_mvc_app/src/controllers/defi.rs

@@ -0,0 +1,369 @@
+use actix_web::{web, HttpResponse, Result};
+use actix_web::HttpRequest;
+use tera::{Context, Tera};
+use chrono::{Utc, Duration};
+use serde::Deserialize;
+use uuid::Uuid;
+
+use crate::models::asset::{Asset, AssetType, AssetStatus};
+use crate::models::defi::{DefiPosition, DefiPositionType, DefiPositionStatus, LendingPosition, BorrowingPosition, DEFI_DB};
+use crate::utils::render_template;
+
+// Form structs for DeFi operations
+#[derive(Debug, Deserialize)]
+pub struct LendingForm {
+    pub asset_id: String,
+    pub amount: f64,
+    pub duration: i32,
+}
+
+#[derive(Debug, Deserialize)]
+pub struct BorrowingForm {
+    pub collateral_asset_id: String,
+    pub collateral_amount: f64,
+    pub amount: f64,
+    pub duration: i32,
+}
+
+#[derive(Debug, Deserialize)]
+pub struct LiquidityForm {
+    pub first_token: String,
+    pub first_amount: f64,
+    pub second_token: String,
+    pub second_amount: f64,
+    pub pool_fee: f64,
+}
+
+#[derive(Debug, Deserialize)]
+pub struct StakingForm {
+    pub asset_id: String,
+    pub amount: f64,
+    pub staking_period: i32,
+}
+
+#[derive(Debug, Deserialize)]
+pub struct SwapForm {
+    pub from_token: String,
+    pub from_amount: f64,
+    pub to_token: String,
+}
+
+#[derive(Debug, Deserialize)]
+pub struct CollateralForm {
+    pub asset_id: String,
+    pub amount: f64,
+    pub purpose: String,
+    pub loan_amount: Option<f64>,
+    pub loan_term: Option<i32>,
+}
+
+pub struct DefiController;
+
+impl DefiController {
+    // Display the DeFi dashboard
+    pub async fn index(tmpl: web::Data<Tera>, req: HttpRequest) -> Result<HttpResponse> {
+        let mut context = Context::new();
+        
+        println!("DEBUG: Starting DeFi dashboard rendering");
+        
+        // Get mock assets for the dropdown selectors
+        let assets = Self::get_mock_assets();
+        println!("DEBUG: Generated {} mock assets", assets.len());
+        
+        // Add active_page for navigation highlighting
+        context.insert("active_page", &"defi");
+        
+        // Add DeFi stats
+        let defi_stats = Self::get_defi_stats();
+        context.insert("defi_stats", &serde_json::to_value(defi_stats).unwrap());
+        
+        // Add recent assets for selection in forms
+        let recent_assets: Vec<serde_json::Map<String, serde_json::Value>> = assets
+            .iter()
+            .take(5)
+            .map(|a| Self::asset_to_json(a))
+            .collect();
+        
+        context.insert("recent_assets", &recent_assets);
+        
+        // Get user's lending positions
+        let db = DEFI_DB.lock().unwrap();
+        let lending_positions = db.get_user_lending_positions("user123");
+        let lending_positions_json: Vec<serde_json::Value> = lending_positions
+            .iter()
+            .map(|p| serde_json::to_value(p).unwrap())
+            .collect();
+        context.insert("lending_positions", &lending_positions_json);
+        
+        // Get user's borrowing positions
+        let borrowing_positions = db.get_user_borrowing_positions("user123");
+        let borrowing_positions_json: Vec<serde_json::Value> = borrowing_positions
+            .iter()
+            .map(|p| serde_json::to_value(p).unwrap())
+            .collect();
+        context.insert("borrowing_positions", &borrowing_positions_json);
+        
+        // Add success message if present in query params
+        if let Some(success) = req.query_string().strip_prefix("success=") {
+            let decoded = urlencoding::decode(success).unwrap_or_else(|_| success.into());
+            context.insert("success_message", &decoded);
+        }
+        
+        println!("DEBUG: Rendering DeFi dashboard template");
+        let response = render_template(&tmpl, "defi/index.html", &context);
+        println!("DEBUG: Finished rendering DeFi dashboard template");
+        response
+    }
+    
+    // Process lending request
+    pub async fn create_lending(_tmpl: web::Data<Tera>, form: web::Form<LendingForm>) -> Result<HttpResponse> {
+        println!("DEBUG: Processing lending request: {:?}", form);
+        
+        // Get the asset details (in a real app, this would come from a database)
+        let assets = Self::get_mock_assets();
+        let asset = assets.iter().find(|a| a.id == form.asset_id);
+        
+        if let Some(asset) = asset {
+            // Calculate interest and return amount
+            let apy = match form.duration {
+                7 => 2.5,
+                30 => 4.2,
+                90 => 6.8,
+                180 => 8.5,
+                365 => 12.0,
+                _ => 4.2, // Default to 30 days rate
+            };
+            
+            let interest = form.amount * (apy / 100.0) * (form.duration as f64 / 365.0);
+            let return_amount = form.amount + interest;
+            
+            // Create a new lending position
+            let lending_position = LendingPosition {
+                base: DefiPosition {
+                    id: Uuid::new_v4().to_string(),
+                    position_type: DefiPositionType::Lending,
+                    status: DefiPositionStatus::Active,
+                    asset_id: asset.id.clone(),
+                    asset_name: asset.name.clone(),
+                    asset_symbol: asset.asset_type.as_str().to_string(), // Using asset_type as symbol for now
+                    amount: form.amount,
+                    value_usd: form.amount * asset.latest_valuation().map_or(0.5, |v| v.value), // Assuming 0.5 USD per token if no valuation
+                    apy,
+                    created_at: Utc::now(),
+                    expires_at: Some(Utc::now() + Duration::days(form.duration as i64)),
+                    user_id: "user123".to_string(), // Hardcoded user ID for now
+                },
+                duration_days: form.duration,
+                interest_earned: interest,
+                return_amount,
+            };
+            
+            // Add the position to the database
+            {
+                let mut db = DEFI_DB.lock().unwrap();
+                db.add_lending_position(lending_position);
+            }
+            
+            // Redirect with success message
+            let success_message = format!("Successfully lent {} {} at {}% APY", form.amount, asset.name, apy);
+            Ok(HttpResponse::SeeOther()
+                .append_header(("Location", format!("/defi?success={}", urlencoding::encode(&success_message))))
+                .finish())
+        } else {
+            // Asset not found, redirect with error
+            Ok(HttpResponse::SeeOther()
+                .append_header(("Location", "/defi?error=Asset not found"))
+                .finish())
+        }
+    }
+    
+    // Process borrowing request
+    pub async fn create_borrowing(_tmpl: web::Data<Tera>, form: web::Form<BorrowingForm>) -> Result<HttpResponse> {
+        println!("DEBUG: Processing borrowing request: {:?}", form);
+        
+        // Get the asset details (in a real app, this would come from a database)
+        let assets = Self::get_mock_assets();
+        let collateral_asset = assets.iter().find(|a| a.id == form.collateral_asset_id);
+        
+        if let Some(collateral_asset) = collateral_asset {
+            // Calculate interest rate based on duration
+            let interest_rate = match form.duration {
+                7 => 3.5,
+                30 => 5.0,
+                90 => 6.5,
+                180 => 8.0,
+                365 => 10.0,
+                _ => 5.0, // Default to 30 days rate
+            };
+            
+            // Calculate interest and total to repay
+            let interest = form.amount * (interest_rate / 100.0) * (form.duration as f64 / 365.0);
+            let total_to_repay = form.amount + interest;
+            
+            // Calculate collateral value and ratio
+            let collateral_value = form.collateral_amount * collateral_asset.latest_valuation().map_or(0.5, |v| v.value);
+            let collateral_ratio = (collateral_value / form.amount) * 100.0;
+            
+            // Create a new borrowing position
+            let borrowing_position = BorrowingPosition {
+                base: DefiPosition {
+                    id: Uuid::new_v4().to_string(),
+                    position_type: DefiPositionType::Borrowing,
+                    status: DefiPositionStatus::Active,
+                    asset_id: "ZAZ".to_string(), // Hardcoded for now, in a real app this would be a parameter
+                    asset_name: "Zanzibar Token".to_string(),
+                    asset_symbol: "ZAZ".to_string(),
+                    amount: form.amount,
+                    value_usd: form.amount * 0.5, // Assuming 0.5 USD per ZAZ
+                    apy: interest_rate,
+                    created_at: Utc::now(),
+                    expires_at: Some(Utc::now() + Duration::days(form.duration as i64)),
+                    user_id: "user123".to_string(), // Hardcoded user ID for now
+                },
+                collateral_asset_id: collateral_asset.id.clone(),
+                collateral_asset_name: collateral_asset.name.clone(),
+                collateral_asset_symbol: collateral_asset.asset_type.as_str().to_string(),
+                collateral_amount: form.collateral_amount,
+                collateral_value_usd: collateral_value,
+                duration_days: form.duration,
+                interest_rate,
+                interest_owed: interest,
+                total_to_repay,
+                collateral_ratio,
+            };
+            
+            // Add the position to the database
+            {
+                let mut db = DEFI_DB.lock().unwrap();
+                db.add_borrowing_position(borrowing_position);
+            }
+            
+            // Redirect with success message
+            let success_message = format!("Successfully borrowed {} ZAZ using {} {} as collateral", 
+                form.amount, form.collateral_amount, collateral_asset.name);
+            Ok(HttpResponse::SeeOther()
+                .append_header(("Location", format!("/defi?success={}", urlencoding::encode(&success_message))))
+                .finish())
+        } else {
+            // Asset not found, redirect with error
+            Ok(HttpResponse::SeeOther()
+                .append_header(("Location", "/defi?error=Collateral asset not found"))
+                .finish())
+        }
+    }
+    
+    // Process liquidity provision
+    pub async fn add_liquidity(_tmpl: web::Data<Tera>, form: web::Form<LiquidityForm>) -> Result<HttpResponse> {
+        println!("DEBUG: Processing liquidity provision: {:?}", form);
+        
+        // In a real application, this would add liquidity to a pool in the database
+        // For now, we'll just redirect back to the DeFi dashboard with a success message
+        
+        let success_message = format!("Successfully added liquidity: {} {} and {} {}", 
+            form.first_amount, form.first_token, form.second_amount, form.second_token);
+        
+        Ok(HttpResponse::SeeOther()
+            .append_header(("Location", format!("/defi?success={}", urlencoding::encode(&success_message))))
+            .finish())
+    }
+    
+    // Process staking request
+    pub async fn create_staking(_tmpl: web::Data<Tera>, form: web::Form<StakingForm>) -> Result<HttpResponse> {
+        println!("DEBUG: Processing staking request: {:?}", form);
+        
+        // In a real application, this would create a staking position in the database
+        // For now, we'll just redirect back to the DeFi dashboard with a success message
+        
+        let success_message = format!("Successfully staked {} {}", form.amount, form.asset_id);
+        
+        Ok(HttpResponse::SeeOther()
+            .append_header(("Location", format!("/defi?success={}", urlencoding::encode(&success_message))))
+            .finish())
+    }
+    
+    // Process token swap
+    pub async fn swap_tokens(_tmpl: web::Data<Tera>, form: web::Form<SwapForm>) -> Result<HttpResponse> {
+        println!("DEBUG: Processing token swap: {:?}", form);
+        
+        // In a real application, this would perform a token swap in the database
+        // For now, we'll just redirect back to the DeFi dashboard with a success message
+        
+        let success_message = format!("Successfully swapped {} {} to {}", 
+            form.from_amount, form.from_token, form.to_token);
+        
+        Ok(HttpResponse::SeeOther()
+            .append_header(("Location", format!("/defi?success={}", urlencoding::encode(&success_message))))
+            .finish())
+    }
+    
+    // Process collateral position creation
+    pub async fn create_collateral(_tmpl: web::Data<Tera>, form: web::Form<CollateralForm>) -> Result<HttpResponse> {
+        println!("DEBUG: Processing collateral creation: {:?}", form);
+        
+        // In a real application, this would create a collateral position in the database
+        // For now, we'll just redirect back to the DeFi dashboard with a success message
+        
+        let purpose_str = match form.purpose.as_str() {
+            "loan" => "secure a loan",
+            "synthetic" => "generate synthetic assets",
+            "leverage" => "leverage trading",
+            _ => "collateralization",
+        };
+        
+        let success_message = format!("Successfully collateralized {} {} for {}", 
+            form.amount, form.asset_id, purpose_str);
+        
+        Ok(HttpResponse::SeeOther()
+            .append_header(("Location", format!("/defi?success={}", urlencoding::encode(&success_message))))
+            .finish())
+    }
+    
+    // Helper method to get DeFi statistics
+    fn get_defi_stats() -> serde_json::Map<String, serde_json::Value> {
+        let mut stats = serde_json::Map::new();
+        
+        // Handle Option<Number> by unwrapping with expect
+        stats.insert("total_value_locked".to_string(), serde_json::Value::Number(serde_json::Number::from_f64(1250000.0).expect("Valid float")));
+        stats.insert("lending_volume".to_string(), serde_json::Value::Number(serde_json::Number::from_f64(450000.0).expect("Valid float")));
+        stats.insert("borrowing_volume".to_string(), serde_json::Value::Number(serde_json::Number::from_f64(320000.0).expect("Valid float")));
+        stats.insert("liquidity_pools_count".to_string(), serde_json::Value::Number(serde_json::Number::from(12)));
+        stats.insert("active_stakers".to_string(), serde_json::Value::Number(serde_json::Number::from(156)));
+        stats.insert("total_swap_volume".to_string(), serde_json::Value::Number(serde_json::Number::from_f64(780000.0).expect("Valid float")));
+        
+        stats
+    }
+    
+    // Helper method to convert Asset to a JSON object for templates
+    fn asset_to_json(asset: &Asset) -> serde_json::Map<String, serde_json::Value> {
+        let mut map = serde_json::Map::new();
+        
+        map.insert("id".to_string(), serde_json::Value::String(asset.id.clone()));
+        map.insert("name".to_string(), serde_json::Value::String(asset.name.clone()));
+        map.insert("description".to_string(), serde_json::Value::String(asset.description.clone()));
+        map.insert("asset_type".to_string(), serde_json::Value::String(asset.asset_type.as_str().to_string()));
+        map.insert("status".to_string(), serde_json::Value::String(asset.status.as_str().to_string()));
+        
+        // Add current valuation
+        if let Some(latest) = asset.latest_valuation() {
+            if let Some(num) = serde_json::Number::from_f64(latest.value) {
+                map.insert("current_valuation".to_string(), serde_json::Value::Number(num));
+            } else {
+                map.insert("current_valuation".to_string(), serde_json::Value::Number(serde_json::Number::from(0)));
+            }
+            map.insert("valuation_currency".to_string(), serde_json::Value::String(latest.currency.clone()));
+            map.insert("valuation_date".to_string(), serde_json::Value::String(latest.date.format("%Y-%m-%d").to_string()));
+        } else {
+            map.insert("current_valuation".to_string(), serde_json::Value::Number(serde_json::Number::from(0)));
+            map.insert("valuation_currency".to_string(), serde_json::Value::String("USD".to_string()));
+            map.insert("valuation_date".to_string(), serde_json::Value::String("N/A".to_string()));
+        }
+        
+        map
+    }
+    
+    // Generate mock assets for testing
+    fn get_mock_assets() -> Vec<Asset> {
+        // Reuse the asset controller's mock data function
+        crate::controllers::asset::AssetController::get_mock_assets()
+    }
+}

actix_mvc_app/src/controllers/mod.rs

@@ -7,6 +7,7 @@ pub mod governance;
 pub mod flow;
 pub mod contract;
 pub mod asset;
+pub mod defi;
 pub mod marketplace;
 
 // Re-export controllers for easier imports

actix_mvc_app/src/main.rs

@@ -16,6 +16,7 @@ mod utils;
 // Import middleware components
 use middleware::{RequestTimer, SecurityHeaders, JwtAuth};
 use utils::redis_service;
+use models::initialize_mock_data;
 
 // Initialize lazy_static for in-memory storage
 extern crate lazy_static;
@@ -72,6 +73,10 @@ async fn main() -> io::Result<()> {
         log::info!("Redis client initialized successfully");
     }
     
+    // Initialize mock data for DeFi operations
+    initialize_mock_data();
+    log::info!("DeFi mock data initialized successfully");
+    
     log::info!("Starting server at http://{}", bind_address);
     
     // Create and configure the HTTP server

actix_mvc_app/src/models/defi.rs

@@ -0,0 +1,206 @@
+use chrono::{DateTime, Utc};
+use serde::{Serialize, Deserialize};
+use std::sync::{Arc, Mutex};
+use std::collections::HashMap;
+use lazy_static::lazy_static;
+use uuid::Uuid;
+
+// DeFi position status
+#[derive(Debug, Clone, Serialize, Deserialize, PartialEq)]
+pub enum DefiPositionStatus {
+    Active,
+    Completed,
+    Liquidated,
+    Cancelled
+}
+
+impl DefiPositionStatus {
+    pub fn as_str(&self) -> &str {
+        match self {
+            DefiPositionStatus::Active => "Active",
+            DefiPositionStatus::Completed => "Completed",
+            DefiPositionStatus::Liquidated => "Liquidated",
+            DefiPositionStatus::Cancelled => "Cancelled",
+        }
+    }
+}
+
+// DeFi position type
+#[derive(Debug, Clone, Serialize, Deserialize, PartialEq)]
+pub enum DefiPositionType {
+    Lending,
+    Borrowing,
+    Liquidity,
+    Staking,
+    Collateral,
+}
+
+impl DefiPositionType {
+    pub fn as_str(&self) -> &str {
+        match self {
+            DefiPositionType::Lending => "Lending",
+            DefiPositionType::Borrowing => "Borrowing",
+            DefiPositionType::Liquidity => "Liquidity",
+            DefiPositionType::Staking => "Staking",
+            DefiPositionType::Collateral => "Collateral",
+        }
+    }
+}
+
+// Base DeFi position
+#[derive(Debug, Clone, Serialize, Deserialize)]
+pub struct DefiPosition {
+    pub id: String,
+    pub position_type: DefiPositionType,
+    pub status: DefiPositionStatus,
+    pub asset_id: String,
+    pub asset_name: String,
+    pub asset_symbol: String,
+    pub amount: f64,
+    pub value_usd: f64,
+    pub apy: f64,
+    pub created_at: DateTime<Utc>,
+    pub expires_at: Option<DateTime<Utc>>,
+    pub user_id: String,
+}
+
+// Lending position
+#[derive(Debug, Clone, Serialize, Deserialize)]
+pub struct LendingPosition {
+    pub base: DefiPosition,
+    pub duration_days: i32,
+    pub interest_earned: f64,
+    pub return_amount: f64,
+}
+
+// Borrowing position
+#[derive(Debug, Clone, Serialize, Deserialize)]
+pub struct BorrowingPosition {
+    pub base: DefiPosition,
+    pub collateral_asset_id: String,
+    pub collateral_asset_name: String,
+    pub collateral_asset_symbol: String,
+    pub collateral_amount: f64,
+    pub collateral_value_usd: f64,
+    pub duration_days: i32,
+    pub interest_rate: f64,
+    pub interest_owed: f64,
+    pub total_to_repay: f64,
+    pub collateral_ratio: f64,
+}
+
+// In-memory database for DeFi positions
+pub struct DefiDatabase {
+    lending_positions: HashMap<String, LendingPosition>,
+    borrowing_positions: HashMap<String, BorrowingPosition>,
+}
+
+impl DefiDatabase {
+    pub fn new() -> Self {
+        Self {
+            lending_positions: HashMap::new(),
+            borrowing_positions: HashMap::new(),
+        }
+    }
+
+    // Lending operations
+    pub fn add_lending_position(&mut self, position: LendingPosition) {
+        self.lending_positions.insert(position.base.id.clone(), position);
+    }
+
+    pub fn get_lending_position(&self, id: &str) -> Option<&LendingPosition> {
+        self.lending_positions.get(id)
+    }
+
+    pub fn get_all_lending_positions(&self) -> Vec<&LendingPosition> {
+        self.lending_positions.values().collect()
+    }
+
+    pub fn get_user_lending_positions(&self, user_id: &str) -> Vec<&LendingPosition> {
+        self.lending_positions
+            .values()
+            .filter(|p| p.base.user_id == user_id)
+            .collect()
+    }
+
+    // Borrowing operations
+    pub fn add_borrowing_position(&mut self, position: BorrowingPosition) {
+        self.borrowing_positions.insert(position.base.id.clone(), position);
+    }
+
+    pub fn get_borrowing_position(&self, id: &str) -> Option<&BorrowingPosition> {
+        self.borrowing_positions.get(id)
+    }
+
+    pub fn get_all_borrowing_positions(&self) -> Vec<&BorrowingPosition> {
+        self.borrowing_positions.values().collect()
+    }
+
+    pub fn get_user_borrowing_positions(&self, user_id: &str) -> Vec<&BorrowingPosition> {
+        self.borrowing_positions
+            .values()
+            .filter(|p| p.base.user_id == user_id)
+            .collect()
+    }
+}
+
+// Global instance of the DeFi database
+lazy_static! {
+    pub static ref DEFI_DB: Arc<Mutex<DefiDatabase>> = Arc::new(Mutex::new(DefiDatabase::new()));
+}
+
+// Initialize the database with mock data
+pub fn initialize_mock_data() {
+    let mut db = DEFI_DB.lock().unwrap();
+    
+    // Add mock lending positions
+    let lending_position = LendingPosition {
+        base: DefiPosition {
+            id: Uuid::new_v4().to_string(),
+            position_type: DefiPositionType::Lending,
+            status: DefiPositionStatus::Active,
+            asset_id: "TFT".to_string(),
+            asset_name: "ThreeFold Token".to_string(),
+            asset_symbol: "TFT".to_string(),
+            amount: 1000.0,
+            value_usd: 500.0,
+            apy: 4.2,
+            created_at: Utc::now(),
+            expires_at: Some(Utc::now() + chrono::Duration::days(30)),
+            user_id: "user123".to_string(),
+        },
+        duration_days: 30,
+        interest_earned: 3.5,
+        return_amount: 1003.5,
+    };
+    db.add_lending_position(lending_position);
+    
+    // Add mock borrowing positions
+    let borrowing_position = BorrowingPosition {
+        base: DefiPosition {
+            id: Uuid::new_v4().to_string(),
+            position_type: DefiPositionType::Borrowing,
+            status: DefiPositionStatus::Active,
+            asset_id: "ZAZ".to_string(),
+            asset_name: "Zanzibar Token".to_string(),
+            asset_symbol: "ZAZ".to_string(),
+            amount: 500.0,
+            value_usd: 250.0,
+            apy: 5.8,
+            created_at: Utc::now(),
+            expires_at: Some(Utc::now() + chrono::Duration::days(90)),
+            user_id: "user123".to_string(),
+        },
+        collateral_asset_id: "TFT".to_string(),
+        collateral_asset_name: "ThreeFold Token".to_string(),
+        collateral_asset_symbol: "TFT".to_string(),
+        collateral_amount: 1500.0,
+        collateral_value_usd: 750.0,
+        duration_days: 90,
+        interest_rate: 5.8,
+        interest_owed: 3.625,
+        total_to_repay: 503.625,
+        collateral_ratio: 300.0,
+    };
+    db.add_borrowing_position(borrowing_position);
+}

actix_mvc_app/src/models/mod.rs

@@ -7,9 +7,11 @@ pub mod flow;
 pub mod contract;
 pub mod asset;
 pub mod marketplace;
+pub mod defi;
 
 // Re-export models for easier imports
 pub use user::User;
 pub use ticket::{Ticket, TicketComment, TicketStatus, TicketPriority};
 pub use calendar::{CalendarEvent, CalendarViewMode};
 pub use marketplace::{Listing, ListingStatus, ListingType, Bid, BidStatus, MarketplaceStatistics};
+pub use defi::{DefiPosition, DefiPositionType, DefiPositionStatus, LendingPosition, BorrowingPosition, DEFI_DB, initialize_mock_data};

actix_mvc_app/src/routes/mod.rs

@@ -9,6 +9,7 @@ use crate::controllers::flow::FlowController;
 use crate::controllers::contract::ContractController;
 use crate::controllers::asset::AssetController;
 use crate::controllers::marketplace::MarketplaceController;
+use crate::controllers::defi::DefiController;
 use crate::middleware::JwtAuth;
 use crate::SESSION_KEY;
 
@@ -120,6 +121,18 @@ pub fn configure_routes(cfg: &mut web::ServiceConfig) {
                     .route("/{id}/purchase", web::post().to(MarketplaceController::purchase_listing))
                     .route("/{id}/cancel", web::post().to(MarketplaceController::cancel_listing))
             )
+            
+            // DeFi routes
+            .service(
+                web::scope("/defi")
+                    .route("", web::get().to(DefiController::index))
+                    .route("/lending", web::post().to(DefiController::create_lending))
+                    .route("/borrowing", web::post().to(DefiController::create_borrowing))
+                    .route("/liquidity", web::post().to(DefiController::add_liquidity))
+                    .route("/staking", web::post().to(DefiController::create_staking))
+                    .route("/swap", web::post().to(DefiController::swap_tokens))
+                    .route("/collateral", web::post().to(DefiController::create_collateral))
+            )
     );
     
     // Keep the /protected scope for any future routes that should be under that path

actix_mvc_app/src/views/base.html

@@ -150,6 +150,11 @@
                         <i class="bi bi-coin me-2"></i> Digital Assets
                     </a>
                 </li>
+                <li class="nav-item">
+                    <a class="nav-link d-flex align-items-center ps-3 py-2 {% if active_page == 'defi' %}active fw-bold border-start border-4 border-primary bg-light{% endif %}" href="/defi">
+                        <i class="bi bi-bank me-2"></i> DeFi Platform
+                    </a>
+                </li>
                 <li class="nav-item">
                     <a class="nav-link d-flex align-items-center ps-3 py-2 {% if active_page == 'marketplace' %}active fw-bold border-start border-4 border-primary bg-light{% endif %}" href="/marketplace">
                         <i class="bi bi-shop me-2"></i> Marketplace

actix_mvc_app/src/views/defi/index.html

@@ -0,0 +1,138 @@
+{% extends "base.html" %}
+
+{% block head %}
+    {{ super() }}
+    <style>
+        .toast {
+            position: fixed;
+            top: 20px;
+            right: 20px;
+            z-index: 9999;
+        }
+        .token-icon {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            width: 24px;
+            height: 24px;
+            border-radius: 50%;
+            background-color: #6c757d;
+            color: white;
+            font-weight: bold;
+            font-size: 12px;
+        }
+    </style>
+{% endblock %}
+
+{% block title %}DeFi Platform{% endblock %}
+
+{% block content %}
+<!-- Toast notification for success messages -->
+{% if success_message %}
+<div class="position-fixed bottom-0 end-0 p-3" style="z-index: 11">
+    <div class="toast show" role="alert" aria-live="assertive" aria-atomic="true" data-bs-autohide="true" data-bs-delay="5000">
+        <div class="toast-header bg-success text-white">
+            <i class="bi bi-check-circle me-2"></i>
+            <strong class="me-auto">Success</strong>
+            <button type="button" class="btn-close btn-close-white" data-bs-dismiss="toast" aria-label="Close"></button>
+        </div>
+        <div class="toast-body">
+            {{ success_message }}
+        </div>
+    </div>
+</div>
+{% endif %}
+
+<!-- DeFi Platform Tabs -->
+    <div class="mb-4">
+        <div class="card-body">
+            <ul class="nav nav-tabs" id="defiTabs" role="tablist">
+                <li class="nav-item" role="presentation">
+                    <button class="nav-link active" id="overview-tab" data-bs-toggle="tab" data-bs-target="#overview" type="button" role="tab" aria-controls="overview" aria-selected="true">
+                        <i class="bi bi-grid me-1"></i> Overview
+                    </button>
+                </li>
+                <li class="nav-item" role="presentation">
+                    <button class="nav-link" id="lending-tab" data-bs-toggle="tab" data-bs-target="#lending" type="button" role="tab" aria-controls="lending" aria-selected="false">
+                        <i class="bi bi-cash-coin me-1"></i> Lending & Borrowing
+                    </button>
+                </li>
+                <li class="nav-item" role="presentation">
+                    <button class="nav-link" id="liquidity-tab" data-bs-toggle="tab" data-bs-target="#liquidity" type="button" role="tab" aria-controls="liquidity" aria-selected="false">
+                        <i class="bi bi-droplet me-1"></i> Liquidity Pools
+                    </button>
+                </li>
+                <li class="nav-item" role="presentation">
+                    <button class="nav-link" id="staking-tab" data-bs-toggle="tab" data-bs-target="#staking" type="button" role="tab" aria-controls="staking" aria-selected="false">
+                        <i class="bi bi-lock me-1"></i> Staking
+                    </button>
+                </li>
+                <li class="nav-item" role="presentation">
+                    <button class="nav-link" id="swap-tab" data-bs-toggle="tab" data-bs-target="#swap" type="button" role="tab" aria-controls="swap" aria-selected="false">
+                        <i class="bi bi-arrow-left-right me-1"></i> Swap
+                    </button>
+                </li>
+                <li class="nav-item" role="presentation">
+                    <button class="nav-link" id="collateral-tab" data-bs-toggle="tab" data-bs-target="#collateral" type="button" role="tab" aria-controls="collateral" aria-selected="false">
+                        <i class="bi bi-shield-lock me-1"></i> Collateral
+                    </button>
+                </li>
+            </ul>
+            
+            <div class="tab-content mt-3" id="defiTabsContent">
+                {% include "defi/tabs/overview.html" %}
+                {% include "defi/tabs/lending_borrowing.html" %}
+                {% include "defi/tabs/liquidity.html" %}
+                {% include "defi/tabs/staking.html" %}
+                {% include "defi/tabs/swap.html" %}
+                {% include "defi/tabs/collateral.html" %}
+            </div>
+        </div>
+    </div>
+{% endblock %}
+
+{% block scripts %}
+    {{ super() }}
+    <script src="/static/js/defi.js"></script>
+    <script>
+        document.addEventListener('DOMContentLoaded', function() {
+            // Show toast if success message exists
+            const urlParams = new URLSearchParams(window.location.search);
+            const successMessage = urlParams.get('success');
+            if (successMessage) {
+                const toastEl = document.getElementById('successToast');
+                const toastBody = document.querySelector('.toast-body');
+                toastBody.textContent = decodeURIComponent(successMessage);
+                const toast = new bootstrap.Toast(toastEl);
+                toast.show();
+                
+                // Auto-hide after 5 seconds
+                setTimeout(function() {
+                    toast.hide();
+                }, 5000);
+            }
+            
+            // Handle tab tracking in URL
+            const tabParam = urlParams.get('tab');
+            if (tabParam) {
+                // Find the tab button that targets this tab
+                const tabButton = document.querySelector(`button[data-bs-target="#${tabParam}"]`);
+                if (tabButton) {
+                    const tab = new bootstrap.Tab(tabButton);
+                    tab.show();
+                }
+            }
+            
+            // Update URL when tab changes
+            const tabButtons = document.querySelectorAll('button[data-bs-toggle="tab"]');
+            tabButtons.forEach(function(button) {
+                button.addEventListener('shown.bs.tab', function(event) {
+                    const targetId = event.target.getAttribute('data-bs-target').substring(1);
+                    const url = new URL(window.location);
+                    url.searchParams.set('tab', targetId);
+                    window.history.replaceState({}, '', url);
+                });
+            });
+        });
+    </script>
+{% endblock %}

actix_mvc_app/src/views/defi/tabs/collateral.html

@@ -0,0 +1,306 @@
+<div class="tab-pane fade" id="collateral" role="tabpanel" aria-labelledby="collateral-tab">
+    <div class="row mb-4">
+        <div class="col-12">
+            <div class="alert alert-info">
+                <h5><i class="bi bi-info-circle"></i> About Collateralization</h5>
+                <p>Use your digital assets as collateral to secure loans or generate synthetic assets. Maintain a healthy collateral ratio to avoid liquidation.</p>
+            </div>
+        </div>
+    </div>
+    
+    <div class="row">
+        <div class="col-lg-6 mb-4">
+            <!-- Collateralize Assets -->
+            <div class="card">
+                <div class="card-header">
+                    <i class="bi bi-shield-lock me-1"></i> Collateralize Assets
+                </div>
+                <div class="card-body">
+                    <form id="collateralForm" action="/defi/collateral" method="post">
+                        <!-- Asset Selection -->
+                        <div class="mb-3">
+                            <label for="collateralAsset" class="form-label">Select Asset to Collateralize</label>
+                            <select class="form-select" id="collateralAsset" name="asset_id" required>
+                                <option value="" selected disabled>Choose an asset</option>
+                                <!-- Tokens -->
+                                <optgroup label="Tokens">
+                                    <option value="TFT" data-type="token" data-value="5000" data-amount="10000" data-unit="TFT" data-img="/static/img/tokens/tft.png">
+                                        ThreeFold Token (TFT) - 10,000 TFT ($5,000)
+                                    </option>
+                                    <option value="ZAZ" data-type="token" data-value="2500" data-amount="5000" data-unit="ZAZ" data-img="/static/img/tokens/zaz.png">
+                                        Zanzibar Token (ZAZ) - 5,000 ZAZ ($2,500)
+                                    </option>
+                                </optgroup>
+                                <!-- Digital Assets -->
+                                <optgroup label="Digital Assets">
+                                    {% for asset in recent_assets %}
+                                        {% if asset.status == 'Active' and asset.current_valuation > 0 %}
+                                            <option value="{{ asset.id }}" data-type="{{ asset.asset_type }}" data-value="{{ asset.current_valuation }}" data-amount="1" data-unit="{{ asset.asset_type }}">
+                                                {{ asset.name }} ({{ asset.asset_type }}) - ${{ asset.current_valuation }}
+                                            </option>
+                                        {% endif %}
+                                    {% endfor %}
+                                </optgroup>
+                            </select>
+                        </div>
+                        
+                        <!-- Collateral Amount -->
+                        <div class="mb-3">
+                            <label for="collateralAmount" class="form-label">Amount to Collateralize</label>
+                            <div class="input-group">
+                                <input type="number" class="form-control" id="collateralAmount" name="amount" min="1" step="1" placeholder="Enter amount" required>
+                                <span class="input-group-text" id="collateralUnit">TFT</span>
+                            </div>
+                            <div class="form-text">
+                                Available: <span id="collateralAvailable">10,000 TFT</span> (<span id="collateralAvailableUSD">$5,000</span>)
+                            </div>
+                        </div>
+                        
+                        <!-- Collateral Value -->
+                        <div class="mb-3">
+                            <label class="form-label">Collateral Value</label>
+                            <div class="input-group">
+                                <span class="input-group-text">$</span>
+                                <input type="text" class="form-control" id="collateralValue" name="collateral_value" readonly value="0.00">
+                            </div>
+                        </div>
+                        
+                        <!-- Loan Purpose -->
+                        <div class="mb-3">
+                            <label for="collateralPurpose" class="form-label">Purpose</label>
+                            <select class="form-select" id="collateralPurpose" name="purpose" required>
+                                <option value="loan">Secure a Loan</option>
+                                <option value="synthetic">Generate Synthetic Assets</option>
+                                <option value="leverage">Leverage Trading</option>
+                            </select>
+                        </div>
+                        
+                        <!-- Loan Term (only shown for loans) -->
+                        <div class="mb-3" id="loanTermGroup">
+                            <label for="loanTerm" class="form-label">Loan Term</label>
+                            <select class="form-select" id="loanTerm" name="loan_term">
+                                <option value="30">30 days (3.5% APR)</option>
+                                <option value="90">90 days (5.0% APR)</option>
+                                <option value="180">180 days (6.5% APR)</option>
+                                <option value="365">365 days (8.0% APR)</option>
+                            </select>
+                        </div>
+                        
+                        <!-- Loan Amount (only shown for loans) -->
+                        <div class="mb-3" id="loanAmountGroup">
+                            <label for="loanAmount" class="form-label">Loan Amount (Max 75% of Collateral Value)</label>
+                            <div class="input-group">
+                                <span class="input-group-text">$</span>
+                                <input type="number" class="form-control" id="loanAmount" name="loan_amount" min="100" step="100" placeholder="Enter loan amount">
+                                <button class="btn btn-outline-secondary" type="button" id="maxLoanButton">MAX</button>
+                            </div>
+                            <div class="form-text">
+                                Maximum Loan: $<span id="maxLoanAmount">0.00</span>
+                            </div>
+                        </div>
+                        
+                        <!-- Synthetic Asset (only shown for synthetic assets) -->
+                        <div class="mb-3" id="syntheticAssetGroup" style="display: none;">
+                            <label for="syntheticAsset" class="form-label">Synthetic Asset to Generate</label>
+                            <select class="form-select" id="syntheticAsset" name="synthetic_asset">
+                                <option value="sUSD">Synthetic USD (sUSD)</option>
+                                <option value="sBTC">Synthetic Bitcoin (sBTC)</option>
+                                <option value="sETH">Synthetic Ethereum (sETH)</option>
+                                <option value="sGOLD">Synthetic Gold (sGOLD)</option>
+                            </select>
+                        </div>
+                        
+                        <!-- Synthetic Amount (only shown for synthetic assets) -->
+                        <div class="mb-3" id="syntheticAmountGroup" style="display: none;">
+                            <label for="syntheticAmount" class="form-label">Amount to Generate (Max 50% of Collateral Value)</label>
+                            <div class="input-group">
+                                <input type="number" class="form-control" id="syntheticAmount" name="synthetic_amount" min="10" step="10" placeholder="Enter amount">
+                                <span class="input-group-text" id="syntheticUnit">sUSD</span>
+                                <button class="btn btn-outline-secondary" type="button" id="maxSyntheticButton">MAX</button>
+                            </div>
+                            <div class="form-text">
+                                Maximum Amount: <span id="maxSyntheticAmount">0.00</span> <span id="maxSyntheticUnit">sUSD</span>
+                            </div>
+                        </div>
+                        
+                        <!-- Collateral Ratio -->
+                        <div class="mb-3">
+                            <label class="form-label">Collateral Ratio</label>
+                            <div class="input-group">
+                                <input type="text" class="form-control" id="collateralRatio" name="collateral_ratio" readonly value="0%">
+                                <span class="input-group-text">
+                                    <i class="bi bi-info-circle" data-bs-toggle="tooltip" title="Minimum required ratio: 150% for loans, 200% for synthetic assets"></i>
+                                </span>
+                            </div>
+                        </div>
+                        
+                        <!-- Liquidation Price -->
+                        <div class="mb-3">
+                            <label class="form-label">Liquidation Price</label>
+                            <div class="input-group">
+                                <span class="input-group-text">$</span>
+                                <input type="text" class="form-control" id="liquidationPrice" name="liquidation_price" readonly value="0.00">
+                                <span class="input-group-text">per <span id="liquidationUnit">TFT</span></span>
+                            </div>
+                            <div class="form-text text-danger">
+                                Your collateral will be liquidated if the price falls below this level.
+                            </div>
+                        </div>
+                        
+                        <!-- Submit Button -->
+                        <div class="d-grid gap-2">
+                            <button type="submit" class="btn btn-primary" id="collateralizeButton">Collateralize Asset</button>
+                        </div>
+                    </form>
+                </div>
+            </div>
+        </div>
+        
+        <div class="col-lg-6">
+            <!-- Active Collateral Positions -->
+            <div class="card mb-4">
+                <div class="card-header">
+                    <i class="bi bi-list-check me-1"></i> Your Active Collateral Positions
+                </div>
+                <div class="card-body">
+                    <div class="table-responsive">
+                        <table class="table table-striped table-hover">
+                            <thead>
+                                <tr>
+                                    <th>Asset</th>
+                                    <th>Collateral Value</th>
+                                    <th>Borrowed/Generated</th>
+                                    <th>Collateral Ratio</th>
+                                    <th>Liquidation Price</th>
+                                    <th>Status</th>
+                                    <th>Actions</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            <img src="/static/img/tokens/tft.png" alt="TFT" width="20" height="20" class="rounded-circle me-1">
+                                            2,000 TFT
+                                        </div>
+                                    </td>
+                                    <td>$1,000</td>
+                                    <td>$700 (Loan)</td>
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            <div class="progress flex-grow-1 me-2" style="height: 8px;">
+                                                <div class="progress-bar bg-success" role="progressbar" style="width: 70%"></div>
+                                            </div>
+                                            <span>143%</span>
+                                        </div>
+                                    </td>
+                                    <td>$0.35</td>
+                                    <td><span class="badge bg-success">Healthy</span></td>
+                                    <td>
+                                        <div class="btn-group">
+                                            <button class="btn btn-sm btn-outline-primary">Add</button>
+                                            <button class="btn btn-sm btn-outline-warning">Repay</button>
+                                        </div>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            <i class="bi bi-image me-2 text-primary"></i>
+                                            Beach Property NFT
+                                        </div>
+                                    </td>
+                                    <td>$25,000</td>
+                                    <td>10,000 sUSD</td>
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            <div class="progress flex-grow-1 me-2" style="height: 8px;">
+                                                <div class="progress-bar bg-warning" role="progressbar" style="width: 40%"></div>
+                                            </div>
+                                            <span>250%</span>
+                                        </div>
+                                    </td>
+                                    <td>$10,000</td>
+                                    <td><span class="badge bg-warning">Warning</span></td>
+                                    <td>
+                                        <div class="btn-group">
+                                            <button class="btn btn-sm btn-outline-primary">Add</button>
+                                            <button class="btn btn-sm btn-outline-warning">Repay</button>
+                                        </div>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            <img src="/static/img/tokens/zaz.png" alt="ZAZ" width="20" height="20" class="rounded-circle me-1">
+                                            1,000 ZAZ
+                                        </div>
+                                    </td>
+                                    <td>$500</td>
+                                    <td>0.1 sBTC</td>
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            <div class="progress flex-grow-1 me-2" style="height: 8px;">
+                                                <div class="progress-bar bg-success" role="progressbar" style="width: 80%"></div>
+                                            </div>
+                                            <span>333%</span>
+                                        </div>
+                                    </td>
+                                    <td>$0.15</td>
+                                    <td><span class="badge bg-success">Healthy</span></td>
+                                    <td>
+                                        <div class="btn-group">
+                                            <button class="btn btn-sm btn-outline-primary">Add</button>
+                                            <button class="btn btn-sm btn-outline-warning">Repay</button>
+                                        </div>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+            
+            <!-- Collateral Health -->
+            <div class="card">
+                <div class="card-header">
+                    <i class="bi bi-heart-pulse me-1"></i> Collateral Health
+                </div>
+                <div class="card-body">
+                    <div class="mb-4">
+                        <h6>Overall Collateral Health</h6>
+                        <div class="progress mb-2" style="height: 20px;">
+                            <div class="progress-bar bg-success" role="progressbar" style="width: 60%;" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100">60%</div>
+                        </div>
+                        <div class="small text-muted">
+                            <i class="bi bi-info-circle"></i> Health score represents the overall safety of your collateral positions. Higher is better.
+                        </div>
+                    </div>
+                    
+                    <div class="row">
+                        <div class="col-md-6 mb-3">
+                            <div class="card bg-light">
+                                <div class="card-body p-3">
+                                    <h6 class="card-title">Total Collateral Value</h6>
+                                    <h3 class="mb-0">$26,500</h3>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-md-6 mb-3">
+                            <div class="card bg-light">
+                                <div class="card-body p-3">
+                                    <h6 class="card-title">Total Borrowed/Generated</h6>
+                                    <h3 class="mb-0">$11,150</h3>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    
+                    <div class="alert alert-warning mb-0">
+                        <i class="bi bi-exclamation-triangle"></i> Your Beach Property NFT collateral is close to the liquidation threshold. Consider adding more collateral or repaying part of your synthetic assets.
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

actix_mvc_app/src/views/defi/tabs/lending_borrowing.html

@@ -0,0 +1,281 @@
+<div class="tab-pane fade" id="lending" role="tabpanel" aria-labelledby="lending-tab">
+    <div class="row">
+        <div class="col-md-6">
+            <div class="card mb-4">
+                <div class="card-header bg-primary text-white">
+                    <i class="bi bi-box-arrow-right me-1"></i> Lend Your Assets
+                </div>
+                <div class="card-body">
+                    <p class="card-text">Earn interest by lending your digital assets to the ZAZ DeFi platform.</p>
+                    
+                    <form action="/defi/lending" method="post">
+                        <div class="mb-3">
+                            <label for="asset" class="form-label">Select Asset</label>
+                            <select class="form-select" id="asset" name="asset_id" required>
+                                <option value="" selected disabled>Choose an asset to lend</option>
+                                {% for asset in recent_assets %}
+                                    {% if asset.status == 'Active' %}
+                                        <option value="{{ asset.id }}" data-type="{{ asset.asset_type }}" data-value="{{ asset.current_valuation }}">
+                                            {{ asset.name }} ({{ asset.asset_type }}) - ${{ asset.current_valuation }}
+                                        </option>
+                                    {% endif %}
+                                {% endfor %}
+                            </select>
+                        </div>
+                        
+                        <div class="mb-3">
+                            <label for="amount" class="form-label">Amount</label>
+                            <div class="input-group">
+                                <input type="number" class="form-control" id="amount" name="amount" min="0.01" step="0.01" required>
+                                <span class="input-group-text" id="assetSymbol">TFT</span>
+                            </div>
+                        </div>
+                        
+                        <div class="mb-3">
+                            <label for="duration" class="form-label">Duration</label>
+                            <select class="form-select" id="duration" name="duration" required>
+                                <option value="7">7 days (2.5% APY)</option>
+                                <option value="30" selected>30 days (4.2% APY)</option>
+                                <option value="90">90 days (6.8% APY)</option>
+                                <option value="180">180 days (8.5% APY)</option>
+                                <option value="365">365 days (12.0% APY)</option>
+                            </select>
+                        </div>
+                        
+                        <div class="alert alert-success">
+                            <div class="d-flex justify-content-between">
+                                <span>Estimated Interest:</span>
+                                <strong id="interestEstimate">0.00 TFT</strong>
+                            </div>
+                            <div class="d-flex justify-content-between">
+                                <span>Return Amount:</span>
+                                <strong id="returnAmount">0.00 TFT</strong>
+                            </div>
+                        </div>
+                        
+                        <div class="d-grid">
+                            <button type="submit" class="btn btn-primary">Lend Asset</button>
+                        </div>
+                    </form>
+                </div>
+            </div>
+        </div>
+        
+        <div class="col-md-6">
+            <div class="card mb-4">
+                <div class="card-header bg-success text-white">
+                    <i class="bi bi-box-arrow-in-left me-1"></i> Borrow Against Assets
+                </div>
+                <div class="card-body">
+                    <p class="card-text">Borrow digital assets using your existing assets as collateral.</p>
+                    
+                    <form action="/defi/borrowing" method="post">
+                        <div class="mb-3">
+                            <label for="collateralAsset" class="form-label">Collateral Asset</label>
+                            <select class="form-select" id="collateralAsset" name="collateral_asset_id" required>
+                                <option value="" selected disabled>Choose an asset as collateral</option>
+                                {% for asset in recent_assets %}
+                                    {% if asset.status == 'Active' %}
+                                        <option value="{{ asset.id }}" data-type="{{ asset.asset_type }}" data-value="{{ asset.current_valuation }}">
+                                            {{ asset.name }} ({{ asset.asset_type }}) - ${{ asset.current_valuation }}
+                                        </option>
+                                    {% endif %}
+                                {% endfor %}
+                            </select>
+                        </div>
+                        
+                        <div class="mb-3">
+                            <label for="borrowingAsset" class="form-label">Asset to Borrow</label>
+                            <select class="form-select" id="borrowingAsset" name="asset_id" required>
+                                <option value="TFT" selected>ThreeFold Token (TFT)</option>
+                                <option value="BTC">Bitcoin (BTC)</option>
+                                <option value="ETH">Ethereum (ETH)</option>
+                                <option value="USDT">Tether (USDT)</option>
+                                <option value="ZAZ">Zanzibar Token (ZAZ)</option>
+                            </select>
+                        </div>
+                        
+                        <div class="mb-3">
+                            <label for="borrowingAmount" class="form-label">Borrow Amount</label>
+                            <div class="input-group">
+                                <input type="number" class="form-control" id="borrowingAmount" name="amount" min="0.01" step="0.01" required>
+                                <span class="input-group-text" id="borrowingAssetSymbol">TFT</span>
+                            </div>
+                            <div class="form-text">You can borrow up to 70% of your collateral value.</div>
+                        </div>
+                        
+                        <div class="mb-3">
+                            <label for="borrowingTerm" class="form-label">Duration</label>
+                            <select class="form-select" id="borrowingTerm" name="duration" required>
+                                <option value="7">7 days (3.5% APR)</option>
+                                <option value="30" selected>30 days (5.2% APR)</option>
+                                <option value="90">90 days (7.8% APR)</option>
+                                <option value="180">180 days (9.5% APR)</option>
+                            </select>
+                        </div>
+                        
+                        <div class="alert alert-warning">
+                            <div class="d-flex justify-content-between">
+                                <span>Collateral Ratio:</span>
+                                <strong id="borrowCollateralRatio">0%</strong>
+                            </div>
+                            <div class="d-flex justify-content-between">
+                                <span>Interest Due:</span>
+                                <strong id="interestDue">0.00 TFT</strong>
+                            </div>
+                            <div class="d-flex justify-content-between">
+                                <span>Total Repayment:</span>
+                                <strong id="borrowTotalRepayment">0.00 TFT</strong>
+                            </div>
+                            <div class="progress mt-2">
+                                <div id="borrowCollateralRatioBar" class="progress-bar bg-success" role="progressbar" style="width: 0%"></div>
+                            </div>
+                        </div>
+                        
+                        <div class="d-grid">
+                            <button type="submit" class="btn btn-success">Borrow Asset</button>
+                        </div>
+                    </form>
+                </div>
+            </div>
+        </div>
+    </div>
+    
+    <!-- Active Lending & Borrowing Positions -->
+    <div class="card mb-4">
+        <div class="card-header">
+            <i class="bi bi-list-check me-1"></i> Your Active Positions
+        </div>
+        <div class="card-body">
+            <ul class="nav nav-pills mb-3" id="lendingPositionsTabs" role="tablist">
+                <li class="nav-item" role="presentation">
+                    <button class="nav-link active" id="lending-positions-tab" data-bs-toggle="pill" data-bs-target="#lending-positions" type="button" role="tab" aria-controls="lending-positions" aria-selected="true">Lending</button>
+                </li>
+                <li class="nav-item" role="presentation">
+                    <button class="nav-link" id="borrowing-positions-tab" data-bs-toggle="pill" data-bs-target="#borrowing-positions" type="button" role="tab" aria-controls="borrowing-positions" aria-selected="false">Borrowing</button>
+                </li>
+            </ul>
+            
+            <div class="tab-content" id="lendingPositionsTabsContent">
+                <div class="tab-pane fade show active" id="lending-positions" role="tabpanel" aria-labelledby="lending-positions-tab">
+                    <div class="table-responsive">
+                        <table class="table table-striped table-hover">
+                            <thead>
+                                <tr>
+                                    <th>Asset</th>
+                                    <th>Amount</th>
+                                    <th>Value</th>
+                                    <th>APY</th>
+                                    <th>Start Date</th>
+                                    <th>End Date</th>
+                                    <th>Interest Earned</th>
+                                    <th>Status</th>
+                                    <th>Actions</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                {% if lending_positions and lending_positions|length > 0 %}
+                                    {% for position in lending_positions %}
+                                        <tr>
+                                            <td>
+                                                <div class="d-flex align-items-center">
+                                                    <div class="token-icon me-2"></div>
+                                                    {{ position.base.asset_name }}
+                                                </div>
+                                            </td>
+                                            <td>{{ position.base.amount }} {{ position.base.asset_symbol }}</td>
+                                            <td>${{ position.base.value_usd | round(precision = 2) }}</td>
+                                            <td>{{ position.base.apy }}%</td>
+                                            <td>{{ position.base.created_at | date }}</td>
+                                            <td>{{ position.base.expires_at | date }}</td>
+                                            <td>{{ position.interest_earned | round(precision = 2) }} {{ position.base.asset_symbol }}</td>
+                                            <td>
+                                                <span class="badge bg-{% if position.base.status == 'Active' %}success{% elif position.base.status == 'Completed' %}info{% elif position.base.status == 'Liquidated' %}danger{% else %}warning{% endif %}">
+                                                    {{ position.base.status }}
+                                                </span>
+                                            </td>
+                                            <td>
+                                                <div class="btn-group">
+                                                    <button class="btn btn-sm btn-outline-primary">Withdraw</button>
+                                                </div>
+                                            </td>
+                                        </tr>
+                                    {% endfor %}
+                                {% else %}
+                                    <tr>
+                                        <td colspan="9" class="text-center">No active lending positions found</td>
+                                    </tr>
+                                {% endif %}
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+                <div class="tab-pane fade" id="borrowing-positions" role="tabpanel" aria-labelledby="borrowing-positions-tab">
+                    <div class="table-responsive">
+                        <table class="table table-striped table-hover">
+                            <thead>
+                                <tr>
+                                    <th>Borrowed Asset</th>
+                                    <th>Amount</th>
+                                    <th>Collateral</th>
+                                    <th>Collateral Ratio</th>
+                                    <th>Interest Rate</th>
+                                    <th>Start Date</th>
+                                    <th>Due Date</th>
+                                    <th>Status</th>
+                                    <th>Actions</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                {% if borrowing_positions and borrowing_positions|length > 0 %}
+                                    {% for position in borrowing_positions %}
+                                        <tr>
+                                            <td>
+                                                <div class="d-flex align-items-center">
+                                                    <div class="token-icon me-2"></div>
+                                                    {{ position.base.asset_name }}
+                                                </div>
+                                            </td>
+                                            <td>{{ position.base.amount }} {{ position.base.asset_symbol }}</td>
+                                            <td>
+                                                <div class="d-flex align-items-center">
+                                                    <div class="token-icon me-2"></div>
+                                                    {{ position.collateral_amount }} {{ position.collateral_asset_symbol }}
+                                                </div>
+                                            </td>
+                                            <td>
+                                                <div class="d-flex align-items-center">
+                                                    <div class="progress flex-grow-1 me-2" style="height: 8px;">
+                                                        <div class="progress-bar {% if position.collateral_ratio >= 200 %}bg-success{% elif position.collateral_ratio >= 150 %}bg-warning{% else %}bg-danger{% endif %}" role="progressbar" style="width: {% if (position.collateral_ratio / 3) > 100 %}100{% else %}{{ position.collateral_ratio / 3 }}{% endif %}%"></div>
+                                                    </div>
+                                                    <span>{{ position.collateral_ratio | round(precision=0) }}%</span>
+                                                </div>
+                                            </td>
+                                            <td>{{ position.base.apy }}%</td>
+                                            <td>{{ position.base.created_at|date }}</td>
+                                            <td>{{ position.base.expires_at|date }}</td>
+                                            <td>
+                                                <span class="badge bg-{% if position.base.status == 'Active' %}success{% elif position.base.status == 'Completed' %}info{% elif position.base.status == 'Liquidated' %}danger{% else %}warning{% endif %}">
+                                                    {{ position.base.status }}
+                                                </span>
+                                            </td>
+                                            <td>
+                                                <div class="btn-group">
+                                                    <button class="btn btn-sm btn-outline-primary">Repay</button>
+                                                </div>
+                                            </td>
+                                        </tr>
+                                    {% endfor %}
+                                {% else %}
+                                    <tr>
+                                        <td colspan="9" class="text-center">No active borrowing positions found</td>
+                                    </tr>
+                                {% endif %}
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

actix_mvc_app/src/views/defi/tabs/liquidity.html

@@ -0,0 +1,292 @@
+<div class="tab-pane fade" id="liquidity" role="tabpanel" aria-labelledby="liquidity-tab">
+    <div class="row mb-4">
+        <div class="col-12">
+            <div class="alert alert-info">
+                <h5><i class="bi bi-info-circle"></i> About Liquidity Pools</h5>
+                <p>Liquidity pools are collections of tokens locked in smart contracts that provide liquidity for decentralized trading. By adding your assets to a liquidity pool, you earn a share of the trading fees generated by the pool.</p>
+            </div>
+        </div>
+    </div>
+    
+    <!-- Available Liquidity Pools -->
+    <div class="row mb-4">
+        <div class="col-12">
+            <div class="card">
+                <div class="card-header">
+                    <i class="bi bi-droplet-fill me-1"></i> Available Liquidity Pools
+                </div>
+                <div class="card-body">
+                    <div class="table-responsive">
+                        <table class="table table-striped table-hover">
+                            <thead>
+                                <tr>
+                                    <th>Pool</th>
+                                    <th>Total Liquidity</th>
+                                    <th>24h Volume</th>
+                                    <th>APY</th>
+                                    <th>Your Liquidity</th>
+                                    <th>Your Share</th>
+                                    <th>Actions</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            <div class="position-relative me-2">
+                                                <img src="/static/img/tokens/tft.png" alt="TFT" width="24" height="24" class="rounded-circle">
+                                                <img src="/static/img/tokens/zaz.png" alt="ZAZ" width="24" height="24" class="rounded-circle position-absolute" style="left: 15px; top: 0;">
+                                            </div>
+                                            TFT-ZAZ
+                                        </div>
+                                    </td>
+                                    <td>$1,250,000</td>
+                                    <td>$45,000</td>
+                                    <td>12.5%</td>
+                                    <td>$2,500</td>
+                                    <td>0.2%</td>
+                                    <td>
+                                        <div class="btn-group">
+                                            <button class="btn btn-sm btn-primary" data-bs-toggle="modal" data-bs-target="#addLiquidityModal" data-pool="TFT-ZAZ">Add</button>
+                                            <button class="btn btn-sm btn-outline-primary" data-bs-toggle="modal" data-bs-target="#removeLiquidityModal" data-pool="TFT-ZAZ">Remove</button>
+                                        </div>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            <div class="position-relative me-2">
+                                                <img src="/static/img/tokens/tft.png" alt="TFT" width="24" height="24" class="rounded-circle">
+                                                <img src="/static/img/tokens/usdt.png" alt="USDT" width="24" height="24" class="rounded-circle position-absolute" style="left: 15px; top: 0;">
+                                            </div>
+                                            TFT-USDT
+                                        </div>
+                                    </td>
+                                    <td>$3,750,000</td>
+                                    <td>$125,000</td>
+                                    <td>8.2%</td>
+                                    <td>$0</td>
+                                    <td>0%</td>
+                                    <td>
+                                        <div class="btn-group">
+                                            <button class="btn btn-sm btn-primary" data-bs-toggle="modal" data-bs-target="#addLiquidityModal" data-pool="TFT-USDT">Add</button>
+                                            <button class="btn btn-sm btn-outline-primary" disabled>Remove</button>
+                                        </div>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            <div class="position-relative me-2">
+                                                <img src="/static/img/tokens/zaz.png" alt="ZAZ" width="24" height="24" class="rounded-circle">
+                                                <img src="/static/img/tokens/usdt.png" alt="USDT" width="24" height="24" class="rounded-circle position-absolute" style="left: 15px; top: 0;">
+                                            </div>
+                                            ZAZ-USDT
+                                        </div>
+                                    </td>
+                                    <td>$850,000</td>
+                                    <td>$32,000</td>
+                                    <td>15.8%</td>
+                                    <td>$5,000</td>
+                                    <td>0.59%</td>
+                                    <td>
+                                        <div class="btn-group">
+                                            <button class="btn btn-sm btn-primary" data-bs-toggle="modal" data-bs-target="#addLiquidityModal" data-pool="ZAZ-USDT">Add</button>
+                                            <button class="btn btn-sm btn-outline-primary" data-bs-toggle="modal" data-bs-target="#removeLiquidityModal" data-pool="ZAZ-USDT">Remove</button>
+                                        </div>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    
+    <!-- Your Liquidity Positions -->
+    <div class="row mb-4">
+        <div class="col-12">
+            <div class="card">
+                <div class="card-header">
+                    <i class="bi bi-wallet2 me-1"></i> Your Liquidity Positions
+                </div>
+                <div class="card-body">
+                    <div class="row">
+                        <!-- TFT-ZAZ Position -->
+                        <div class="col-md-6 col-lg-4 mb-4">
+                            <div class="card h-100">
+                                <div class="card-header bg-light">
+                                    <div class="d-flex align-items-center">
+                                        <div class="position-relative me-2">
+                                            <img src="/static/img/tokens/tft.png" alt="TFT" width="24" height="24" class="rounded-circle">
+                                            <img src="/static/img/tokens/zaz.png" alt="ZAZ" width="24" height="24" class="rounded-circle position-absolute" style="left: 15px; top: 0;">
+                                        </div>
+                                        TFT-ZAZ
+                                    </div>
+                                </div>
+                                <div class="card-body">
+                                    <div class="d-flex justify-content-between mb-2">
+                                        <span>Your Liquidity:</span>
+                                        <strong>$2,500</strong>
+                                    </div>
+                                    <div class="d-flex justify-content-between mb-2">
+                                        <span>Pool Share:</span>
+                                        <strong>0.2%</strong>
+                                    </div>
+                                    <div class="d-flex justify-content-between mb-2">
+                                        <span>TFT:</span>
+                                        <strong>500 TFT</strong>
+                                    </div>
+                                    <div class="d-flex justify-content-between mb-2">
+                                        <span>ZAZ:</span>
+                                        <strong>1,250 ZAZ</strong>
+                                    </div>
+                                    <div class="d-flex justify-content-between mb-2">
+                                        <span>Earned Fees:</span>
+                                        <strong>$45.20</strong>
+                                    </div>
+                                    <div class="d-flex justify-content-between mb-3">
+                                        <span>APY:</span>
+                                        <strong class="text-success">12.5%</strong>
+                                    </div>
+                                    <div class="d-grid gap-2">
+                                        <button class="btn btn-sm btn-primary" data-bs-toggle="modal" data-bs-target="#addLiquidityModal" data-pool="TFT-ZAZ">Add Liquidity</button>
+                                        <button class="btn btn-sm btn-outline-primary" data-bs-toggle="modal" data-bs-target="#removeLiquidityModal" data-pool="TFT-ZAZ">Remove Liquidity</button>
+                                        <button class="btn btn-sm btn-outline-success">Claim Rewards</button>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        
+                        <!-- ZAZ-USDT Position -->
+                        <div class="col-md-6 col-lg-4 mb-4">
+                            <div class="card h-100">
+                                <div class="card-header bg-light">
+                                    <div class="d-flex align-items-center">
+                                        <div class="position-relative me-2">
+                                            <img src="/static/img/tokens/zaz.png" alt="ZAZ" width="24" height="24" class="rounded-circle">
+                                            <img src="/static/img/tokens/usdt.png" alt="USDT" width="24" height="24" class="rounded-circle position-absolute" style="left: 15px; top: 0;">
+                                        </div>
+                                        ZAZ-USDT
+                                    </div>
+                                </div>
+                                <div class="card-body">
+                                    <div class="d-flex justify-content-between mb-2">
+                                        <span>Your Liquidity:</span>
+                                        <strong>$5,000</strong>
+                                    </div>
+                                    <div class="d-flex justify-content-between mb-2">
+                                        <span>Pool Share:</span>
+                                        <strong>0.59%</strong>
+                                    </div>
+                                    <div class="d-flex justify-content-between mb-2">
+                                        <span>ZAZ:</span>
+                                        <strong>2,500 ZAZ</strong>
+                                    </div>
+                                    <div class="d-flex justify-content-between mb-2">
+                                        <span>USDT:</span>
+                                        <strong>2,500 USDT</strong>
+                                    </div>
+                                    <div class="d-flex justify-content-between mb-2">
+                                        <span>Earned Fees:</span>
+                                        <strong>$128.75</strong>
+                                    </div>
+                                    <div class="d-flex justify-content-between mb-3">
+                                        <span>APY:</span>
+                                        <strong class="text-success">15.8%</strong>
+                                    </div>
+                                    <div class="d-grid gap-2">
+                                        <button class="btn btn-sm btn-primary" data-bs-toggle="modal" data-bs-target="#addLiquidityModal" data-pool="ZAZ-USDT">Add Liquidity</button>
+                                        <button class="btn btn-sm btn-outline-primary" data-bs-toggle="modal" data-bs-target="#removeLiquidityModal" data-pool="ZAZ-USDT">Remove Liquidity</button>
+                                        <button class="btn btn-sm btn-outline-success">Claim Rewards</button>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    
+    <!-- Create New Liquidity Pool -->
+    <div class="row">
+        <div class="col-12">
+            <div class="card">
+                <div class="card-header">
+                    <i class="bi bi-plus-circle me-1"></i> Create New Liquidity Pool
+                </div>
+                <div class="card-body">
+                    <form action="/defi/liquidity" method="post">
+                        <div class="row">
+                            <div class="col-md-6">
+                                <div class="mb-3">
+                                    <label for="firstToken" class="form-label">First Token</label>
+                                    <select class="form-select" id="firstToken" name="first_token" required>
+                                        <option value="" selected disabled>Select first token</option>
+                                        <option value="TFT">ThreeFold Token (TFT)</option>
+                                        <option value="ZAZ">Zanzibar Token (ZAZ)</option>
+                                        <option value="BTC">Bitcoin (BTC)</option>
+                                        <option value="ETH">Ethereum (ETH)</option>
+                                        <option value="USDT">Tether (USDT)</option>
+                                    </select>
+                                </div>
+                                <div class="mb-3">
+                                    <label for="firstTokenAmount" class="form-label">Amount</label>
+                                    <div class="input-group">
+                                        <input type="number" class="form-control" id="firstTokenAmount" name="first_token_amount" min="0.000001" step="0.000001" required>
+                                        <span class="input-group-text" id="firstTokenSymbol">TFT</span>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-md-6">
+                                <div class="mb-3">
+                                    <label for="secondToken" class="form-label">Second Token</label>
+                                    <select class="form-select" id="secondToken" name="second_token" required>
+                                        <option value="" selected disabled>Select second token</option>
+                                        <option value="TFT">ThreeFold Token (TFT)</option>
+                                        <option value="ZAZ">Zanzibar Token (ZAZ)</option>
+                                        <option value="BTC">Bitcoin (BTC)</option>
+                                        <option value="ETH">Ethereum (ETH)</option>
+                                        <option value="USDT">Tether (USDT)</option>
+                                    </select>
+                                </div>
+                                <div class="mb-3">
+                                    <label for="secondTokenAmount" class="form-label">Amount</label>
+                                    <div class="input-group">
+                                        <input type="number" class="form-control" id="secondTokenAmount" name="second_token_amount" min="0.000001" step="0.000001" required>
+                                        <span class="input-group-text" id="secondTokenSymbol">ZAZ</span>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="mb-3">
+                            <label for="initialPrice" class="form-label">Initial Price Ratio</label>
+                            <div class="input-group">
+                                <span class="input-group-text">1</span>
+                                <span class="input-group-text" id="firstTokenSymbolRatio">TFT</span>
+                                <span class="input-group-text">=</span>
+                                <input type="number" class="form-control" id="initialPrice" name="initial_price" min="0.000001" step="0.000001" required>
+                                <span class="input-group-text" id="secondTokenSymbolRatio">ZAZ</span>
+                            </div>
+                        </div>
+                        <div class="mb-3">
+                            <label for="poolFee" class="form-label">Pool Fee</label>
+                            <select class="form-select" id="poolFee" name="pool_fee" required>
+                                <option value="0.1">0.1%</option>
+                                <option value="0.3" selected>0.3%</option>
+                                <option value="0.5">0.5%</option>
+                                <option value="1.0">1.0%</option>
+                            </select>
+                            <div class="form-text">This fee is charged on each trade and distributed to liquidity providers.</div>
+                        </div>
+                        <div class="d-grid">
+                            <button type="submit" class="btn btn-primary">Create Liquidity Pool</button>
+                        </div>
+                    </form>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

actix_mvc_app/src/views/defi/tabs/overview.html

@@ -0,0 +1,8 @@
+<div class="tab-pane fade show active" id="overview" role="tabpanel" aria-labelledby="overview-tab">
+    <div class="alert alert-info">
+        <h4 class="alert-heading"><i class="bi bi-info-circle"></i> Welcome to the ZAZ DeFi Platform!</h4>
+        <p>Our decentralized finance platform allows you to maximize the value of your digital assets through various financial services.</p>
+        <hr>
+        <p class="mb-0">Use the tabs above to explore lending, borrowing, liquidity pools, staking, swapping, and collateralization features.</p>
+    </div>
+</div>

actix_mvc_app/src/views/defi/tabs/staking.html

@@ -0,0 +1,282 @@
+<div class="tab-pane fade" id="staking" role="tabpanel" aria-labelledby="staking-tab">
+    <div class="row mb-4">
+        <div class="col-12">
+            <div class="alert alert-info">
+                <h5><i class="bi bi-info-circle"></i> About Staking</h5>
+                <p>Staking allows you to lock your digital assets for a period of time to support network operations and earn rewards. The longer you stake, the higher rewards you can earn.</p>
+            </div>
+        </div>
+    </div>
+    
+    <!-- Available Staking Options -->
+    <div class="row mb-4">
+        <div class="col-12">
+            <div class="card">
+                <div class="card-header">
+                    <i class="bi bi-lock-fill me-1"></i> Available Staking Options
+                </div>
+                <div class="card-body">
+                    <div class="row">
+                        <!-- TFT Staking -->
+                        <div class="col-md-6 col-lg-4 mb-4">
+                            <div class="card h-100">
+                                <div class="card-header bg-primary text-white">
+                                    <div class="d-flex align-items-center">
+                                        <img src="/static/img/tokens/tft.png" alt="TFT" width="24" height="24" class="rounded-circle me-2">
+                                        <h6 class="mb-0">ThreeFold Token (TFT)</h6>
+                                    </div>
+                                </div>
+                                <div class="card-body">
+                                    <div class="d-flex justify-content-between mb-2">
+                                        <span>Total Staked:</span>
+                                        <strong>5,250,000 TFT</strong>
+                                    </div>
+                                    <div class="d-flex justify-content-between mb-2">
+                                        <span>Your Stake:</span>
+                                        <strong>1,000 TFT</strong>
+                                    </div>
+                                    <div class="d-flex justify-content-between mb-3">
+                                        <span>APY:</span>
+                                        <strong class="text-success">8.5%</strong>
+                                    </div>
+                                    
+                                    <form action="/defi/staking" method="post">
+                                        <input type="hidden" name="asset_id" value="TFT">
+                                        <div class="mb-3">
+                                            <label for="tftStakingPeriod" class="form-label">Staking Period</label>
+                                            <select class="form-select" id="tftStakingPeriod" name="staking_period">
+                                                <option value="30">30 days (8.5% APY)</option>
+                                                <option value="90">90 days (10.2% APY)</option>
+                                                <option value="180">180 days (12.5% APY)</option>
+                                                <option value="365">365 days (15.0% APY)</option>
+                                            </select>
+                                        </div>
+                                        
+                                        <div class="mb-3">
+                                            <label for="tftStakeAmount" class="form-label">Amount to Stake</label>
+                                            <div class="input-group">
+                                                <input type="number" class="form-control" id="tftStakeAmount" name="amount" min="100" step="1" placeholder="Min 100 TFT">
+                                                <span class="input-group-text">TFT</span>
+                                            </div>
+                                        </div>
+                                        
+                                        <div class="alert alert-success mb-3">
+                                            <div class="d-flex justify-content-between">
+                                                <span>Estimated Rewards:</span>
+                                                <strong id="tftEstimatedRewards">0 TFT</strong>
+                                            </div>
+                                        </div>
+                                        
+                                        <div class="d-grid gap-2">
+                                            <button class="btn btn-primary" id="tftStakeButton">Stake TFT</button>
+                                        </div>
+                                    </form>
+                                </div>
+                            </div>
+                        </div>
+                        
+                        <!-- ZAZ Staking -->
+                        <div class="col-md-6 col-lg-4 mb-4">
+                            <div class="card h-100">
+                                <div class="card-header bg-success text-white">
+                                    <div class="d-flex align-items-center">
+                                        <img src="/static/img/tokens/zaz.png" alt="ZAZ" width="24" height="24" class="rounded-circle me-2">
+                                        <h6 class="mb-0">Zanzibar Token (ZAZ)</h6>
+                                    </div>
+                                </div>
+                                <div class="card-body">
+                                    <div class="d-flex justify-content-between mb-2">
+                                        <span>Total Staked:</span>
+                                        <strong>2,750,000 ZAZ</strong>
+                                    </div>
+                                    <div class="d-flex justify-content-between mb-2">
+                                        <span>Your Stake:</span>
+                                        <strong>500 ZAZ</strong>
+                                    </div>
+                                    <div class="d-flex justify-content-between mb-3">
+                                        <span>APY:</span>
+                                        <strong class="text-success">12.0%</strong>
+                                    </div>
+                                    
+                                    <form action="/defi/staking" method="post">
+                                        <input type="hidden" name="asset_id" value="ZAZ">
+                                        <div class="mb-3">
+                                            <label for="zazStakingPeriod" class="form-label">Staking Period</label>
+                                            <select class="form-select" id="zazStakingPeriod" name="staking_period">
+                                                <option value="30">30 days (12.0% APY)</option>
+                                                <option value="90">90 days (14.5% APY)</option>
+                                                <option value="180">180 days (16.8% APY)</option>
+                                                <option value="365">365 days (20.0% APY)</option>
+                                            </select>
+                                        </div>
+                                        
+                                        <div class="mb-3">
+                                            <label for="zazStakeAmount" class="form-label">Amount to Stake</label>
+                                            <div class="input-group">
+                                                <input type="number" class="form-control" id="zazStakeAmount" name="amount" min="50" step="1" placeholder="Min 50 ZAZ">
+                                                <span class="input-group-text">ZAZ</span>
+                                            </div>
+                                        </div>
+                                        
+                                        <div class="alert alert-success mb-3">
+                                            <div class="d-flex justify-content-between">
+                                                <span>Estimated Rewards:</span>
+                                                <strong id="zazEstimatedRewards">0 ZAZ</strong>
+                                            </div>
+                                        </div>
+                                        
+                                        <div class="d-grid gap-2">
+                                            <button class="btn btn-success" id="zazStakeButton">Stake ZAZ</button>
+                                        </div>
+                                    </form>
+                                </div>
+                            </div>
+                        </div>
+                        
+                        <!-- Asset Staking -->
+                        <div class="col-md-6 col-lg-4 mb-4">
+                            <div class="card h-100">
+                                <div class="card-header bg-info text-white">
+                                    <div class="d-flex align-items-center">
+                                        <i class="bi bi-collection me-2"></i>
+                                        <h6 class="mb-0">Digital Asset Staking</h6>
+                                    </div>
+                                </div>
+                                <div class="card-body">
+                                    <p class="card-text">Stake your NFTs and other digital assets to earn passive income.</p>
+                                    
+                                    <form action="/defi/staking" method="post">
+                                        <div class="mb-3">
+                                            <label for="assetStaking" class="form-label">Select Asset</label>
+                                            <select class="form-select" id="assetStaking" name="asset_id">
+                                                <option value="" selected disabled>Choose an asset to stake</option>
+                                                {% for asset in recent_assets %}
+                                                    {% if asset.status == 'Active' and asset.current_valuation > 0 %}
+                                                        <option value="{{ asset.id }}" data-type="{{ asset.asset_type }}" data-value="{{ asset.current_valuation }}" data-amount="1" data-unit="{{ asset.asset_type }}">
+                                                            {{ asset.name }} ({{ asset.asset_type }}) - ${{ asset.current_valuation }}
+                                                        </option>
+                                                    {% endif %}
+                                                {% endfor %}
+                                            </select>
+                                        </div>
+                                        
+                                        <div class="mb-3">
+                                            <label for="assetStakingPeriod" class="form-label">Staking Period</label>
+                                            <select class="form-select" id="assetStakingPeriod" name="staking_period">
+                                                <option value="30">30 days (3.5% APY)</option>
+                                                <option value="90">90 days (5.2% APY)</option>
+                                                <option value="180">180 days (7.5% APY)</option>
+                                                <option value="365">365 days (10.0% APY)</option>
+                                            </select>
+                                        </div>
+                                        
+                                        <div class="alert alert-success mb-3">
+                                            <div class="d-flex justify-content-between">
+                                                <span>Estimated Rewards:</span>
+                                                <strong id="assetEstimatedRewards">$0.00</strong>
+                                            </div>
+                                            <div class="d-flex justify-content-between">
+                                                <span>Reward Token:</span>
+                                                <strong>ZAZ</strong>
+                                            </div>
+                                        </div>
+                                        
+                                        <div class="d-grid gap-2">
+                                            <button class="btn btn-info" id="assetStakeButton">Stake Asset</button>
+                                        </div>
+                                    </form>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    
+    <!-- Your Active Stakes -->
+    <div class="row">
+        <div class="col-12">
+            <div class="card">
+                <div class="card-header">
+                    <i class="bi bi-list-check me-1"></i> Your Active Stakes
+                </div>
+                <div class="card-body">
+                    <div class="table-responsive">
+                        <table class="table table-striped table-hover">
+                            <thead>
+                                <tr>
+                                    <th>Asset</th>
+                                    <th>Amount</th>
+                                    <th>Value</th>
+                                    <th>Start Date</th>
+                                    <th>End Date</th>
+                                    <th>APY</th>
+                                    <th>Earned Rewards</th>
+                                    <th>Status</th>
+                                    <th>Actions</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            <img src="/static/img/tokens/tft.png" alt="TFT" width="24" height="24" class="rounded-circle me-2">
+                                            ThreeFold Token (TFT)
+                                        </div>
+                                    </td>
+                                    <td>1,000 TFT</td>
+                                    <td>$500</td>
+                                    <td>2025-03-15</td>
+                                    <td>2025-06-15</td>
+                                    <td>10.2%</td>
+                                    <td>22.5 TFT</td>
+                                    <td><span class="badge bg-success">Active</span></td>
+                                    <td>
+                                        <button class="btn btn-sm btn-outline-success">Claim Rewards</button>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            <img src="/static/img/tokens/zaz.png" alt="ZAZ" width="24" height="24" class="rounded-circle me-2">
+                                            Zanzibar Token (ZAZ)
+                                        </div>
+                                    </td>
+                                    <td>500 ZAZ</td>
+                                    <td>$250</td>
+                                    <td>2025-04-01</td>
+                                    <td>2025-05-01</td>
+                                    <td>12.0%</td>
+                                    <td>5.0 ZAZ</td>
+                                    <td><span class="badge bg-success">Active</span></td>
+                                    <td>
+                                        <button class="btn btn-sm btn-outline-success">Claim Rewards</button>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            <i class="bi bi-image me-2 text-primary"></i>
+                                            Beach Property NFT
+                                        </div>
+                                    </td>
+                                    <td>1 NFT</td>
+                                    <td>$25,000</td>
+                                    <td>2025-02-10</td>
+                                    <td>2026-02-10</td>
+                                    <td>10.0%</td>
+                                    <td>450 ZAZ</td>
+                                    <td><span class="badge bg-success">Active</span></td>
+                                    <td>
+                                        <button class="btn btn-sm btn-outline-success">Claim Rewards</button>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

actix_mvc_app/src/views/defi/tabs/swap.html

@@ -0,0 +1,282 @@
+<div class="tab-pane fade" id="swap" role="tabpanel" aria-labelledby="swap-tab">
+    <div class="row mb-4">
+        <div class="col-12">
+            <div class="alert alert-info">
+                <h5><i class="bi bi-info-circle"></i> About Swapping</h5>
+                <p>Swap allows you to exchange one token for another at the current market rate. Swaps are executed through liquidity pools with a small fee that goes to liquidity providers.</p>
+            </div>
+        </div>
+    </div>
+    
+    <div class="row">
+        <div class="col-lg-6 mb-4">
+            <!-- Swap Card -->
+            <div class="card">
+                <div class="card-header">
+                    <i class="bi bi-arrow-left-right me-1"></i> Swap Tokens
+                </div>
+                <div class="card-body">
+                    <form action="/defi/swap" method="post">
+                        <!-- From Token -->
+                        <div class="mb-4">
+                            <label class="form-label">From</label>
+                            <div class="card">
+                                <div class="card-body p-3">
+                                    <div class="d-flex justify-content-between align-items-center mb-2">
+                                        <div class="input-group">
+                                            <input type="number" class="form-control form-control-lg border-0" id="swapFromAmount" name="from_amount" placeholder="0.0" min="0" step="0.01">
+                                            <button class="btn btn-outline-secondary" type="button" id="maxFromButton">MAX</button>
+                                        </div>
+                                        <div class="dropdown">
+                                            <button class="btn btn-outline-primary dropdown-toggle d-flex align-items-center" type="button" id="fromTokenDropdown" data-bs-toggle="dropdown" aria-expanded="false">
+                                                <img src="/static/img/tokens/tft.png" alt="TFT" width="24" height="24" class="rounded-circle me-2" id="fromTokenImg">
+                                                <span id="fromTokenSymbol">TFT</span>
+                                            </button>
+                                            <input type="hidden" name="from_token" id="fromTokenInput" value="TFT">
+                                            <ul class="dropdown-menu" aria-labelledby="fromTokenDropdown">
+                                                <li><a class="dropdown-item d-flex align-items-center" href="#" data-token="TFT" data-img="/static/img/tokens/tft.png" data-balance="10000">
+                                                    <img src="/static/img/tokens/tft.png" alt="TFT" width="24" height="24" class="rounded-circle me-2">
+                                                    <div>
+                                                        <div>ThreeFold Token</div>
+                                                        <small class="text-muted">Balance: 10,000 TFT</small>
+                                                    </div>
+                                                </a></li>
+                                                <li><a class="dropdown-item d-flex align-items-center" href="#" data-token="ZAZ" data-img="/static/img/tokens/zaz.png" data-balance="5000">
+                                                    <img src="/static/img/tokens/zaz.png" alt="ZAZ" width="24" height="24" class="rounded-circle me-2">
+                                                    <div>
+                                                        <div>Zanzibar Token</div>
+                                                        <small class="text-muted">Balance: 5,000 ZAZ</small>
+                                                    </div>
+                                                </a></li>
+                                                <li><a class="dropdown-item d-flex align-items-center" href="#" data-token="USDT" data-img="/static/img/tokens/usdt.png" data-balance="2500">
+                                                    <img src="/static/img/tokens/usdt.png" alt="USDT" width="24" height="24" class="rounded-circle me-2">
+                                                    <div>
+                                                        <div>Tether USD</div>
+                                                        <small class="text-muted">Balance: 2,500 USDT</small>
+                                                    </div>
+                                                </a></li>
+                                            </ul>
+                                        </div>
+                                    </div>
+                                    <div class="d-flex justify-content-between align-items-center text-muted small">
+                                        <span>Balance: <span id="fromTokenBalance">10,000 TFT</span></span>
+                                        <span>≈ $<span id="fromTokenUsdValue">5,000.00</span></span>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        
+                        <!-- Swap Direction Button -->
+                        <div class="d-flex justify-content-center mb-4">
+                            <button type="button" class="btn btn-light rounded-circle p-2" id="swapDirectionButton">
+                                <i class="bi bi-arrow-down-up fs-4"></i>
+                            </button>
+                        </div>
+                        
+                        <!-- To Token -->
+                        <div class="mb-4">
+                            <label class="form-label">To (Estimated)</label>
+                            <div class="card">
+                                <div class="card-body p-3">
+                                    <div class="d-flex justify-content-between align-items-center mb-2">
+                                        <input type="number" class="form-control form-control-lg border-0" id="swapToAmount" name="to_amount" placeholder="0.0" readonly>
+                                        <div class="dropdown">
+                                            <button class="btn btn-outline-primary dropdown-toggle d-flex align-items-center" type="button" id="toTokenDropdown" data-bs-toggle="dropdown" aria-expanded="false">
+                                                <img src="/static/img/tokens/zaz.png" alt="ZAZ" width="24" height="24" class="rounded-circle me-2" id="toTokenImg">
+                                                <span id="toTokenSymbol">ZAZ</span>
+                                            </button>
+                                            <input type="hidden" name="to_token" id="toTokenInput" value="ZAZ">
+                                            <ul class="dropdown-menu" aria-labelledby="toTokenDropdown">
+                                                <li><a class="dropdown-item d-flex align-items-center" href="#" data-token="TFT" data-img="/static/img/tokens/tft.png">
+                                                    <img src="/static/img/tokens/tft.png" alt="TFT" width="24" height="24" class="rounded-circle me-2">
+                                                    <div>ThreeFold Token</div>
+                                                </a></li>
+                                                <li><a class="dropdown-item d-flex align-items-center" href="#" data-token="ZAZ" data-img="/static/img/tokens/zaz.png">
+                                                    <img src="/static/img/tokens/zaz.png" alt="ZAZ" width="24" height="24" class="rounded-circle me-2">
+                                                    <div>Zanzibar Token</div>
+                                                </a></li>
+                                                <li><a class="dropdown-item d-flex align-items-center" href="#" data-token="USDT" data-img="/static/img/tokens/usdt.png">
+                                                    <img src="/static/img/tokens/usdt.png" alt="USDT" width="24" height="24" class="rounded-circle me-2">
+                                                    <div>Tether USD</div>
+                                                </a></li>
+                                            </ul>
+                                        </div>
+                                    </div>
+                                    <div class="d-flex justify-content-between align-items-center text-muted small">
+                                        <span>Balance: <span id="toTokenBalance">5,000 ZAZ</span></span>
+                                        <span>≈ $<span id="toTokenUsdValue">2,500.00</span></span>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        
+                        <!-- Exchange Rate Info -->
+                        <div class="card mb-4">
+                            <div class="card-body p-3">
+                                <div class="d-flex justify-content-between align-items-center small">
+                                    <span>Exchange Rate:</span>
+                                    <span id="exchangeRate">1 TFT = 0.5 ZAZ</span>
+                                </div>
+                                <div class="d-flex justify-content-between align-items-center small">
+                                    <span>Minimum Received:</span>
+                                    <span id="minimumReceived">0 ZAZ</span>
+                                </div>
+                                <div class="d-flex justify-content-between align-items-center small">
+                                    <span>Price Impact:</span>
+                                    <span id="priceImpact" class="text-success">< 0.1%</span>
+                                </div>
+                                <div class="d-flex justify-content-between align-items-center small">
+                                    <span>Liquidity Provider Fee:</span>
+                                    <span id="lpFee">0.3%</span>
+                                </div>
+                            </div>
+                        </div>
+                        
+                        <!-- Swap Button -->
+                        <div class="d-grid gap-2">
+                            <button type="submit" class="btn btn-primary" id="swapButton">Swap</button>
+                        </div>
+                    </form>
+                </div>
+            </div>
+        </div>
+        
+        <div class="col-lg-6">
+            <!-- Recent Swaps -->
+            <div class="card mb-4">
+                <div class="card-header">
+                    <i class="bi bi-clock-history me-1"></i> Recent Swaps
+                </div>
+                <div class="card-body">
+                    <div class="table-responsive">
+                        <table class="table table-striped table-hover">
+                            <thead>
+                                <tr>
+                                    <th>Time</th>
+                                    <th>From</th>
+                                    <th>To</th>
+                                    <th>Value</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>2025-04-15 14:32</td>
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            <img src="/static/img/tokens/tft.png" alt="TFT" width="20" height="20" class="rounded-circle me-1">
+                                            500 TFT
+                                        </div>
+                                    </td>
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            <img src="/static/img/tokens/zaz.png" alt="ZAZ" width="20" height="20" class="rounded-circle me-1">
+                                            250 ZAZ
+                                        </div>
+                                    </td>
+                                    <td>$250.00</td>
+                                </tr>
+                                <tr>
+                                    <td>2025-04-14 09:17</td>
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            <img src="/static/img/tokens/usdt.png" alt="USDT" width="20" height="20" class="rounded-circle me-1">
+                                            1,000 USDT
+                                        </div>
+                                    </td>
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            <img src="/static/img/tokens/tft.png" alt="TFT" width="20" height="20" class="rounded-circle me-1">
+                                            2,000 TFT
+                                        </div>
+                                    </td>
+                                    <td>$1,000.00</td>
+                                </tr>
+                                <tr>
+                                    <td>2025-04-12 16:45</td>
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            <img src="/static/img/tokens/zaz.png" alt="ZAZ" width="20" height="20" class="rounded-circle me-1">
+                                            100 ZAZ
+                                        </div>
+                                    </td>
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            <img src="/static/img/tokens/usdt.png" alt="USDT" width="20" height="20" class="rounded-circle me-1">
+                                            50 USDT
+                                        </div>
+                                    </td>
+                                    <td>$50.00</td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+            
+            <!-- Market Rates -->
+            <div class="card">
+                <div class="card-header">
+                    <i class="bi bi-graph-up me-1"></i> Market Rates
+                </div>
+                <div class="card-body">
+                    <div class="table-responsive">
+                        <table class="table table-striped table-hover">
+                            <thead>
+                                <tr>
+                                    <th>Pair</th>
+                                    <th>Rate</th>
+                                    <th>24h Change</th>
+                                    <th>Volume (24h)</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            <div class="position-relative me-2">
+                                                <img src="/static/img/tokens/tft.png" alt="TFT" width="20" height="20" class="rounded-circle">
+                                                <img src="/static/img/tokens/zaz.png" alt="ZAZ" width="20" height="20" class="rounded-circle position-absolute" style="left: 10px; top: 0;">
+                                            </div>
+                                            TFT/ZAZ
+                                        </div>
+                                    </td>
+                                    <td>0.5</td>
+                                    <td class="text-success">+2.3%</td>
+                                    <td>$125,000</td>
+                                </tr>
+                                <tr>
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            <div class="position-relative me-2">
+                                                <img src="/static/img/tokens/tft.png" alt="TFT" width="20" height="20" class="rounded-circle">
+                                                <img src="/static/img/tokens/usdt.png" alt="USDT" width="20" height="20" class="rounded-circle position-absolute" style="left: 10px; top: 0;">
+                                            </div>
+                                            TFT/USDT
+                                        </div>
+                                    </td>
+                                    <td>0.5</td>
+                                    <td class="text-danger">-1.2%</td>
+                                    <td>$250,000</td>
+                                </tr>
+                                <tr>
+                                    <td>
+                                        <div class="d-flex align-items-center">
+                                            <div class="position-relative me-2">
+                                                <img src="/static/img/tokens/zaz.png" alt="ZAZ" width="20" height="20" class="rounded-circle">
+                                                <img src="/static/img/tokens/usdt.png" alt="USDT" width="20" height="20" class="rounded-circle position-absolute" style="left: 10px; top: 0;">
+                                            </div>
+                                            ZAZ/USDT
+                                        </div>
+                                    </td>
+                                    <td>0.5</td>
+                                    <td class="text-success">+3.7%</td>
+                                    <td>$175,000</td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>