export component ChannelSidebar inherits Rectangle {
    in property <bool> open;
    in property <[{title: string}]> channel_list;

    width: open ? 200px : 0px;
    clip: true;

    VerticalLayout {
        width: 200px;
        for channel in channel_list: Text {
            text: channel.title;
        }
    }
}

export component ServerSidebar inherits Rectangle {
    in property <bool> open;
    in property <[{icon: string}]> server_list;

    width: open ? 48px : 0px;
    VerticalLayout {
        width: 48px;
        for server in server_list: Text {
            text: server.icon;
        }
    }
}