You are an expert in writing code in many different languages. Your goal is to perform code completion for the following code, keeping in mind the rest of the code and the file meta data.
    Metadata details:
    filename: login.rs
    path of file: ./repos/TheReader/crates/frontend/src/pages/auth
    
    the code of the file until where you have to start completion: use std::rc::Rc;

use common::api::ApiErrorResponse;
use web_sys::HtmlInputElement;
use yew::prelude::*;
use yew_hooks::use_async;
use yew_router::prelude::RouterScopeExt;

use crate::{request, AppState, BaseRoute};

pub enum Msg {
    LoginGuestResponse(std::result::Result<String, ApiErrorResponse>),
    LoginPasswordResponse(std::result::Result<String, ApiErrorResponse>),
    LoginPasswordlessResponse(std::result::Result<String, ApiErrorResponse>),
}

pub struct LoginPage;

impl Component for LoginPage {
    type Message = Msg;
    type Properties = ();

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

    fn update(&mut self, ctx: &Context<Self>, msg: Self::Message) -> bool {
        match msg {
            Msg::LoginGuestResponse(resp) => {
                if resp.is_ok() {
                    crate::request_member_self();

                    let history = ctx.link().navigator().unwrap();
                    history.push(&BaseRoute::Dashboard);
                }
            }

            Msg::LoginPasswordResponse(resp) => {
                if resp.is_ok() {
                    crate::request_member_self();

                    let history = ctx.link().navigator().unwrap();
                    history.push(&BaseRoute::Dashboard);
                }
            }

            Msg::LoginPasswordlessResponse(resp) => {
                if resp.is_ok() {
                    crate::request_member_self();

                    let history = ctx.link().navigator().unwrap();
                    history.push(&BaseRoute::Dashboard);
                }
            }
        }

        false
    }

    fn view(&self, ctx: &Context<Self>) -> Html {
        html! {
            <div class="login-container">
                <div class="center-normal">
                    <div class="center-container">
                        // TODO: Impl. display for selecting with login to use. Don't display both at the
    
pub fn _passwordless(props: &InnerProps) -> Html {
    let state = use_context::<Rc<AppState>>().unwrap();

    if !props.always_show && !state.settings.is_auth_passwordless_enabled {
        return html! {};
    }

    let response_error = use_state_eq(|| Option::<String>::None);

    let passless_email = use_state(String::new);

    let on_change_passless_email = {
        let value = passless_email.setter();
        Callback::from(move |e: Event| {
            value.set(e.target_unchecked_into::<HtmlInputElement>().value())
        })
    };

    let submit_passless = use_async(async move {
        let email = passless_email.clone();
        request::login_without_password(email.to_string())
            .await
            .ok()
    });

    let async_resp = submit_passless.clone();
    let callback = props.cb.clone();
    let data_resp_error = response_error.setter();
    use_effect_with_deps(
        move |loading| {
            if !*loading && (async_resp.data.is_some() || async_resp.error.is_some()) {
                data_resp_error.set(async_resp.error.as_ref().map(|v| v.description.clone()));

                callback.emit(
                    async_resp
                        .data
                        .clone()
                        .ok_or_else(|| async_resp.error.clone().unwrap()),
                );
            }

            || {}
        },
        submit_passless.loading,
    );

    html! {
        <>
            <h2>{ "Passwordless Login" }</h2>

            <form onsubmit={ Callback::from(move |e: SubmitEvent| {
                e.prevent_default();
                submit_passless.run();
            }) }>
                <div class="mb-3">
                    <label class="form-label" for="emailpassless">{ "Email Address" }</label>
                    <input class="form-control" type="email" name="email" id="emailpassless" onchange={ on_change_passless_email } />
                </div>

                <input type="submit" value="Login" class="btn btn-primary" />

                {
                    if let Some(error) = response_error.as_ref() {
                        html! {
                            <div class="label red">{ error.clone() }</div>
                        }
                    } else {
                        html! {}
                    }
                }
            </form>
        </>
    }
}