using Gtk 4.0;
using Adw 1;

template $BzAppsPage: Adw.NavigationPage {

  Adw.ToolbarView {
    [top]
    Adw.HeaderBar {

      [title]
      Revealer {
        reveal-child: bind $is_scrolled_down(main_scroll.vadjustment as <Adjustment>.value, carousel.visible) as <bool>;
        transition-type: slide_up;
        transition-duration: 500;
        overflow: visible;
        child: Label {
          label: bind template.page-title;
          styles ["title"]
        };
      }
    }

    content: Adw.BreakpointBin {
      width-request: 360;
      height-request: 100;

      child: Gtk.ScrolledWindow main_scroll {
        hscrollbar-policy: never;

        Adw.Clamp {
          maximum-size: 1500;
          tightening-threshold: 1400;

          Box content_box {
            orientation: vertical;
            spacing: 10;
            margin-start: 30;
            margin-end: 30;
            margin-top: 8;
            margin-bottom: 50;

            $BzFeaturedCarousel carousel {
              margin-start: 3;
              margin-end: 3;
              margin-bottom: 12;
              hexpand: true;
              visible: bind $is_not_null(template.carousel-applications) as <bool>;
              model: SliceListModel {
                offset: 0;
                size: 7;
                model: bind template.carousel-applications;
              };
            }

            Box {
              margin-start: 3;
              orientation: vertical;
              Label title {
                styles [
                  "title-1",
                ]
                label: bind template.page-title;
                xalign: 0.0;
                wrap: true;
                wrap-mode: word_char;
              }

              Label subtitle {
                visible: bind $is_not_empty_string(template.page-subtitle) as <bool>;
                label: bind template.page-subtitle;
                margin-top: 4;
                xalign: 0.0;
              }

              $BzSubcategoryList {
                margin-top: 12;
                margin-bottom: 8;
                category: bind template.category;
                flathub-state: bind template.flathub-state;
              }
            }

            $BzDynamicListView list_view {
              styles [
                "flathub-page-section",
              ]
              hexpand: true;
              scroll: false;
              valign: start;
              noscroll-kind: flow-box;
              child-type: "BzAppTile";
              child-prop: "group";
              model: bind template.applications;
            }

            Button {
              label: _("Show All");
              visible: bind $is_not_empty_list(template.all-applications) as <bool>;
              halign: center;
              margin-top: 8;

              clicked => $show_all_cb(template);
              styles ["pill"]
            }
          }
        }
      };

      Adw.Breakpoint {
        condition ("max-width: 700px")
        setters {
          content_box.margin-start: 10;
          content_box.margin-end: 10;
          list_view.column-spacing: 9;
          list_view.row-spacing: 9;

          title.halign: center;
          title.justify: center;
          subtitle.halign: center;
        }
      }
    };
  }
}