gcal-window: Use AdwAdaptiveState for adaptivitywip/cdavis/adaptive-state-porting

AdwLeaflet is a widget meant to be used for applications that
need a sidebar and different set of main content with transitions
between them at narrow sizes. We only need the sidebar at mobile
sizes. AdwAdaptiveState is a new utility that can be used for proper
adaptive widgetry. It uses conditions to show and hide
widgets appropriately at breakpoints. This gives us more control
over how we handle our widgets. For Calendar, we are no longer
constrained by the main content's minimum size, meaning that the
main window can finally reach 360px.

2 files changed, 54 insertions, 13 deletions

diff --git a/build-aux/flatpak/org.gnome.Calendar.json b/build-aux/flatpak/org.gnome.Calendar.json
index 1e82710f..597a96e9 100644
--- a/build-aux/flatpak/org.gnome.Calendar.json
+++ b/build-aux/flatpak/org.gnome.Calendar.json
@@ -164,6 +164,39 @@
             ]
         },
         {
+            "name" : "libsass",
+            "buildsystem" : "meson",
+            "sources" : [
+                {
+                  "type" : "git",
+                  "url" : "https://github.com/lazka/libsass.git",
+                  "branch" : "meson"
+                }
+            ]
+        },
+        {
+            "name" : "sassc",
+            "buildsystem" : "meson",
+            "sources" : [
+                {
+                  "type" : "git",
+                  "url" : "https://github.com/lazka/sassc.git",
+                  "branch" : "meson"
+                }
+            ]
+        },
+        {
+            "name" : "libadwaita",
+            "buildsystem" : "meson",
+            "sources" : [
+                {
+                    "type" : "git",
+                    "url" : "https://gitlab.gnome.org/GNOME/libadwaita.git",
+                    "branch" : "wip/exalm/adaptive-states"
+                }
+            ]
+        },
+        {
             "name" : "gnome-calendar",
             "buildsystem" : "meson",
             "sources" : [
diff --git a/src/gui/gcal-window.ui b/src/gui/gcal-window.ui
index 91bc7c17..d7caae2a 100644
--- a/src/gui/gcal-window.ui
+++ b/src/gui/gcal-window.ui
@@ -4,6 +4,7 @@
     <property name="title" translatable="yes">Calendar</property>
     <property name="default_width">800</property>
     <property name="default_height">600</property>
+    <property name="width_request">360</property>
     <property name="height_request">600</property>
 
     <!-- Shortcuts -->
@@ -98,15 +99,15 @@
     <child>
       <object class="AdwToastOverlay" id="overlay">
         <child>
-          <object class="AdwLeaflet" id="leaflet">
-            <property name="homogeneous">False</property>
+          <object class="GtkBox">
+            <property name="orientation">horizontal</property>
             <child>
-              <object class="GtkBox">
+              <object class="GtkBox" id="sidebar">
                 <property name="hexpand">False</property>
                 <property name="orientation">vertical</property>
                 <child>
-                  <object class="AdwHeaderBar">
-                    <property name="show-end-title-buttons" bind-source="leaflet" bind-property="folded" bind-flags="sync-create"/>
+                  <object class="AdwHeaderBar" id="sidebar_header">
+                    <property name="show-end-title-buttons">False</property>
                     <property name="title-widget">
                       <object class="GcalCalendarButton" id="calendars_button" />
                     </property>
@@ -147,7 +148,7 @@
                 </child>
                 <child>
                   <object class="GtkActionBar" id="action_bar">
-                    <property name="revealed" bind-source="leaflet" bind-property="folded" bind-flags="sync-create"/>
+                    <property name="revealed">False</property>
                     <child type="start">
                       <object class="GtkButton">
                         <property name="action-name">win.today</property>
@@ -168,15 +169,10 @@
               </object>
             </child>
             <child>
-              <object class="AdwLeafletPage">
-                <property name="navigatable">True</property>
-                <property name="child">
-                  <object class="GtkSeparator"/>
-                </property>
-              </object>
+              <object class="GtkSeparator" id="separator"/>
             </child>
             <child>
-              <object class="GtkBox">
+              <object class="GtkBox" id="content">
                 <property name="orientation">vertical</property>
                 <child>
                   <object class="AdwHeaderBar" id="header_bar">
@@ -258,6 +254,18 @@
         </child>
       </object>
     </child>
+    <child>
+      <object class="AdwAdaptiveState" id="narrow_state">
+        <conditions>
+          <condition type="max-width">770</condition>
+        </conditions>
+        <setter object="action_bar" property="revealed">True</setter>
+        <setter object="sidebar_header" property="show-end-title-buttons">True</setter>
+        <setter object="sidebar" property="hexpand">True</setter>
+        <setter object="content" property="visible">False</setter>
+        <setter object="separator" property="visible">False</setter>
+      </object>
+    </child>
   </template>
   <object class="GcalQuickAddPopover" id="quick_add_popover">
     <signal name="edit-event" handler="edit_event" object="GcalWindow" swapped="no"/>