// SPDX-FileCopyrightText: 2024 vivi developers <vivi-ui@tuta.io>
// SPDX-License-Identifier: GPL-3.0-only

import { Border } from "../../foundation.slint";
import { MagicListViewItem, MagicListView } from "../magic_list_view.slint";
import { MagicBorderSettings, MagicLayoutSettings, MagicAnimationSettings } from "../styling.slint";

export component NavigationDrawer inherits PopupWindow {
    in property <[MagicListViewItem]> model;
    in property <int> current_index: -1;

    callback navigate_to(/* index */ int);

    Rectangle {
        width: 100%;
        height: 100%;

        Border {
            x: -self.width;
            width: 280px;
            height: 100%;
            style: MagicBorderSettings.alternate_border_style;

            VerticalLayout {
                padding_top: MagicLayoutSettings.control_padding;

                MagicListView {
                    model: root.model;
                    current_index: root.current_index;

                    selected(index) => {
                        root.navigate_to(index);
                    }
                }
            }

            init => {
                self.x = 0;
            }

            animate x {
                duration: MagicAnimationSettings.move_in_duration;
                easing: MagicAnimationSettings.move_in_easing;
            }
        }

        init => {
             self.background = #000000.with_alpha(0.6);
        }

        animate background { duration: MagicAnimationSettings.color_duration; }
    }
}