peach-workspace/peach-web/src/routes/settings/network/data_usage_limits.rs

// TODO:
//
// This template and associated feature set requires vnstat_parse.
// - https://crates.io/crates/vnstat_parse
//
// Use the PeachCloud config system to store warning and cutoff flags,
// as well as the associated totals (thresholds):
//
// - DATA_WARNING_ENABLED
// - DATA_WARNING_LIMIT
// - DATA_CUTOFF_ENABLED
// - DATA_CUTOFF_LIMIT

use maud::{html, Markup, PreEscaped};
use peach_network::network;
use rouille::Request;
use vnstat_parse::Vnstat;

use crate::{
    templates,
    utils::{flash::FlashRequest, theme},
    WLAN_IFACE,
};

// ROUTE: /settings/network/wifi/usage

fn render_data_usage_total_capsule() -> Markup {
    html! {
        div class="stack capsule" style="margin-left: 2rem; margin-right: 2rem;" {
            div class="flex-grid" {
                label id="dataTotal" class="label-large" title="Data download total in MB" {
                    data_total.total / 1024 / 1024 | round
                }
                label class="label-small font-near-black" { "MB" }
            }
            label class="center-text label-small font-gray" { "USAGE TOTAL" }
        }
    }
}

fn render_warning_threshold_icon() -> Markup {
    // threshold.warn_flag
    let warning_enabled = true;

    let icon_class = match warning_enabled {
        true => "icon",
        false => "icon icon-inactive",
    };

    html! {
        div class="card-container container" {
            div {
                img id="warnIcon" class=(icon_class) alt="Warning" title="Warning threshold" src="/icons/alert.svg";
            }
        }
    }
}

fn render_warning_threshold_input() -> Markup {
    // TODO: source threshold.warn value and replace below

    html! {
        div {
            (PreEscaped("<!-- input for warning threshold -->"))
            label id="warn" class="label-small font-near-black" {
                input id="warnInput" class="alert-input" name="warn" placeholder="0" type="text" title="Warning threshold value" value="{{ threshold.warn }}" { "MB" }
            }
            label class="label-small font-gray" for="warn" style="padding-top: 0.25rem;" { "WARNING THRESHOLD" }
        }
    }
}

fn render_warning_threshold_checkbox() -> Markup {
    let warning_enabled = true;

    html! {
        div {
            (PreEscaped("<!-- checkbox for warning threshold flag -->"))
            input id="warnCheck" name="warn_flag" title="Activate warning" type="checkbox" checked[warning_enabled];
        }
    }
}

fn render_critical_threshold_icon() -> Markup {
    // threshold.cut_flag
    let cutoff_enabled = true;

    let icon_class = match cutoff_enabled {
        true => "icon",
        false => "icon icon-inactive",
    };

    html! {
        div {
            img id="cutIcon"
                class=(icon_class)
                alt="Cutoff"
                title="Cutoff threshold"
                src="/icons/scissor.svg";
        }
    }
}

fn render_critical_threshold_input() -> Markup {
    // TODO: source threshold.cut value and replace below

    html! {
        div {
            (PreEscaped("<!-- input for cutoff threshold -->"))
            label id="cut" class="label-small font-near-black"><input id="cutInput" class="alert-input" name="cut" placeholder="0" type="text" title="Critical threshold value" value="{{ threshold.cut }}" { "MB" }
            label class="label-small font-gray" for="cut" style="padding-top: 0.25rem;" { "CUTOFF THRESHOLD" }
        }
    }
}

fn render_critical_threshold_checkbox() -> Markup {
    // threshold.cut_flag
    let cutoff_enabled = true;

    html! {
        div {
            (PreEscaped("<!-- checkbox for cutoff threshold flag -->"))
            input id="cutCheck" name="cut_flag" title="Activate cutoff" type="checkbox" checked[cutoff_enabled];
        }
    }
}

fn render_buttons() -> Markup {
    html! {
        div id="buttonDiv" class="button-div" {
            input id="updateAlerts" class="button button-primary center" title="Update" type="submit" value="Update";
            a id="resetTotal" class="button button-warning center" href="/settings/network/wifi/usage/reset" title="Reset stored usage total to zero" { "Reset" }
            a class="button button-secondary center" href="/settings/network" title="Cancel" { "Cancel" }
        }
    }
}

/// WiFi data usage form template builder.
pub fn build_template(request: &Request) -> PreEscaped<String> {
    let (flash_name, flash_msg) = request.retrieve_flash();

    let wlan_data = Vnstat::get(WLAN_IFACE);

    // wlan_data.all_time_total
    // wlan_data.all_time_total_unit

    let form_template = html! {
        (PreEscaped("<!-- NETWORK DATA ALERTS FORM -->"))
        form id="wifiAlerts" action="/network/wifi/usage" class="card center" method="post" {
            (render_data_usage_total_capsule())
            (render_warning_threshold_icon())
            (render_warning_threshold_input())
            (render_warning_threshold_checkbox())
            (render_critical_threshold_icon())
            (render_critical_threshold_input())
            (render_critical_threshold_checkbox())
            (render_buttons())
        }
        @if let (Some(name), Some(msg)) = (flash_name, flash_msg) {
            (PreEscaped("<!-- FLASH MESSAGE -->"))
            (templates::flash::build_template(name, msg))
        }
    };
}