use crate::blocks::dummy_assets;
use fandhe_frontend_core::{div, text, Node};
use fandhe_frontend_pre_styled_ui::avatar::{self, AvatarProps, ImageStatus};
use fandhe_frontend_pre_styled_ui::button::{self, ButtonProps, ButtonVariant};
use fandhe_frontend_pre_styled_ui::card::{self, CardProps};
use fandhe_frontend_pre_styled_ui::heading::{heading, HeadingLevel, HeadingProps, HeadingSize};
use fandhe_frontend_pre_styled_ui::separator::{self, SeparatorProps};
use fandhe_frontend_pre_styled_ui::stat;
use fandhe_frontend_pre_styled_ui::text::{self as styled_text, TextProps, TextVariant};
use fandhe_frontend_pre_styled_ui::Size;

/// 1 件分の統計（ラベル・値）を `stat` パーツへ組み立てる。
fn stat_item(label: &'static str, value: &'static str) -> Node {
    stat::root(
        Size::Md,
        vec![("data-blocks-page-heading-welcome-stats-stat", "")],
        vec![
            stat::label(vec![], vec![text(label)]),
            stat::value_text(vec![], vec![text(value)]),
        ],
    )
}

/// `page-heading-welcome-stats` の Demo 本体（呼び出しごとに同一の
/// `Node` を返す純関数）。
pub fn demo() -> Node {
    let name = dummy_assets::PERSON_NAMES[0];
    let title = dummy_assets::JOB_TITLES[0];

    let identity = div(
        vec![("data-blocks-page-heading-welcome-stats-identity", "")],
        vec![
            avatar::root(
                &AvatarProps {
                    size: Size::Lg,
                    ..AvatarProps::default()
                },
                vec![],
                vec![avatar::image(
                    ImageStatus::Loaded,
                    dummy_assets::AVATAR_SRC,
                    "",
                    vec![],
                )],
            ),
            div(
                vec![("data-blocks-page-heading-welcome-stats-greeting", "")],
                vec![
                    styled_text::text(
                        &TextProps {
                            variant: TextVariant::Muted,
                            ..TextProps::default()
                        },
                        vec![],
                        vec![text("おはようございます")],
                    ),
                    heading(
                        HeadingLevel::H1,
                        &HeadingProps {
                            size: HeadingSize::Lg,
                            ..HeadingProps::default()
                        },
                        vec![],
                        vec![text(name)],
                    ),
                    styled_text::text(
                        &TextProps {
                            variant: TextVariant::Muted,
                            ..TextProps::default()
                        },
                        vec![],
                        vec![text(title)],
                    ),
                ],
            ),
        ],
    );

    let header = card::header(
        vec![("data-blocks-page-heading-welcome-stats-header", "")],
        vec![
            identity,
            button::button(
                &ButtonProps {
                    variant: ButtonVariant::Outline,
                    disabled: true,
                    ..ButtonProps::default()
                },
                vec![],
                vec![text("プロフィールを見る")],
            ),
        ],
    );

    let stats = card::body(
        vec![("data-blocks-page-heading-welcome-stats-stats", "")],
        vec![
            stat_item("今週の完了タスク", "12"),
            stat_item("未読の通知", "3"),
            stat_item("進行中のプロジェクト", "5"),
        ],
    );

    let card_node = card::root(
        CardProps::default(),
        vec![],
        vec![
            header,
            separator::separator(&SeparatorProps::default(), vec![]),
            stats,
        ],
    );

    div(
        vec![("class", "blocks-page-heading-welcome-stats-layout")],
        vec![card_node],
    )
}