from __future__ import annotations


from dataclasses import KW_ONLY, field
from typing import *  # type: ignore

import rio

from .. import components as comps


def build_page(main_component: rio.Component, window_width: float) -> rio.Component:
    # FixMe: Temporary fix for low screen widths. Fixable once Rio offers better mobile-targeted layouting
    if window_width < 55.625:
        return rio.Column(
            rio.Row(
                comps.Header()
            ),
            rio.Column(
                rio.Column(
                    comps.Navigation(),
                    width="natural",
                    align_y=0
                ),
                rio.Column(
                    main_component,
                    width="grow",
                    align_y=0,
                    margin_left=1
                ),
                width="grow",
                height="grow"
            ),
            spacing=2,
            margin=0,
            width="grow",
            height="grow"
        )

    return rio.Column(
        rio.Row(
            comps.Header()
        ),
        rio.Row(
            rio.Column(
                comps.Navigation(),
                width="natural",
                align_y=0,
                margin_right=1
            ),
            rio.Column(
                main_component,
                width="grow",
                align_y=0
            ),
            width="grow",
            height="grow"
        ),
        spacing=2,
        margin=0,
        width="grow",
        height="grow"
    )