using Gtk 4.0;
using Adw 1;

template $FlashcardsAppWindow : Adw.ApplicationWindow {
  title: _("Flashcards");

  Adw.Breakpoint {
    condition ( "max-width: 600sp" )
    setters {
      split_view.collapsed: true;
    }
  }

  Adw.NavigationSplitView split_view {
    [sidebar]
    Adw.NavigationPage sidebar {
      title: _("Categories");

      Adw.ToolbarView {
        width-request: 360;

        [top]
        Adw.HeaderBar {
          [start]
          Gtk.Button {
            icon-name: "list-add-symbolic";
            clicked => $on_add_category();
          }
          [end]
          Gtk.MenuButton {
            icon-name: "open-menu-symbolic";
            menu-model: primary_menu;
          }
        }

        content: ScrolledWindow {
            ListBox topics {
              valign: start;
              selection-mode: single;
              margin-top: 12;
              margin-bottom: 12;
              margin-start: 12;
              margin-end: 12;
              row-selected => $on_category_selected();

              styles [
                "boxed-list",
              ]
            }
        };
      }
    }

    [content]
    Adw.NavigationPage content {
      title: _("Flashcards");

      Adw.ToolbarView {
        [top]
        Adw.HeaderBar {
          [start]
          Gtk.Button {
            icon-name: "user-trash-symbolic";
            clicked => $on_delete_category();
          }
          [title]
          Adw.WindowTitle title {
            title: _("Flashcards");
            subtitle: _("Test");
          }
        }

        content: Adw.Clamp {          
          Adw.Bin {
            margin-top: 12;
            margin-bottom: 12;
            margin-start: 12;
            margin-end: 12;

            styles [
              "card",
            ]
            child: Label {
              margin-top: 24;
              margin-bottom: 24;
              margin-start: 24;
              margin-end: 24;
              wrap: true;
              label: "Wie viel Grad hat ein Kreis?";
            };
          }
        };
      }
    }
  }
}

menu primary_menu {
  section {
    item {
    	label: _("About Flashcards");
      action: "app.about";
    }
  }
}