use bounce::helmet::Helmet;
use yew::prelude::*;
use yew_router::prelude::*;

use crate::routes;

#[derive(Properties, PartialEq)]
pub struct Props {
    pub message: AttrValue,
    #[prop_or(true)]
    pub ellipsis: bool,
}

pub struct NotFound;

impl Component for NotFound {
    type Message = ();
    type Properties = Props;

    fn create(_ctx: &Context<Self>) -> Self {
        Self
    }

    fn view(&self, ctx: &Context<Self>) -> Html {
        html! {
            <>
                <Helmet>
                    <title>{ &ctx.props().message }</title>
                </Helmet>

                <div class={classes!("has-text-centered")}>
                    <h1 class={classes!("title", "my-auto")}>
                        <i>
                            { &ctx.props().message }
                            if ctx.props().ellipsis {
                                { "..." }
                            }
                        </i>
                    </h1>
                    <p>
                        <Link<routes::Route> to={routes::Route::Index}>
                            { "Back to home" }
                        </Link<routes::Route>>
                    </p>
                </div>
            </>
        }
    }
}