from __future__ import annotations

from typing import Optional

from rio import Component, Column, Row, Spacer, page, GuardEvent

from elm.types import UserSession
from elm.components import AvatarEditBox, AccountInfoBox, PersonalInfoBox

def my_profile_page_guard(event: GuardEvent) -> Optional[str]:
    try:
        _ = event.session[UserSession].user_name
        return None
    except KeyError:
        return "/"

@page(name="My Profile", url_segment="my-profile", guard=my_profile_page_guard)
class MyProfilePage(Component):
    def build(self) -> Component:
        if self.session.is_mobile():
            return Column(
                Column(
                    AvatarEditBox(),
                    Spacer(),
                    spacing=1
                ),
                Column(
                    AccountInfoBox(),
                    PersonalInfoBox(),
                    Spacer(),
                    spacing=1,
                    grow_x=True
                ),
                spacing=1,
                margin=0.5
            )
        else:
            return Row(
                Column(
                    AvatarEditBox(),
                    Spacer(),
                    spacing=1
                ),
                Column(
                    AccountInfoBox(),
                    PersonalInfoBox(),
                    Spacer(),
                    spacing=1,
                    grow_x=True
                ),
                spacing=1,
                margin=1,
                margin_right=2
            )