[gnome-sound-recorder/wip/cdavis/gtk4] recordings list: stop subclassing GtkListBox

[Bilal Elmoussaoui <bilelmoussaoui src gnome org>]

commit 68031905f5a5e07a3ce576e8d11d22175d256cf0
Author: Bilal Elmoussaoui <bil elmoussaoui gmail com>
Date:   Thu Nov 18 21:01:10 2021 +0100

    recordings list: stop subclassing GtkListBox
    
    Ports to use a AdwBin & set the ListBox as it's child

 src/org.gnome.SoundRecorder.src.gresource.xml.in   |  2 +-
 ...recordingsListBox.js => recordingListWidget.js} | 43 +++++++++++-----------
 src/window.js                                      | 12 +++---
 3 files changed, 28 insertions(+), 29 deletions(-)
---
diff --git a/src/org.gnome.SoundRecorder.src.gresource.xml.in 
b/src/org.gnome.SoundRecorder.src.gresource.xml.in
index a8c9d73..7780e8c 100644
--- a/src/org.gnome.SoundRecorder.src.gresource.xml.in
+++ b/src/org.gnome.SoundRecorder.src.gresource.xml.in
@@ -7,7 +7,7 @@
     <file>recorderWidget.js</file>
     <file>recording.js</file>
     <file>recordingList.js</file>
-    <file>recordingsListBox.js</file>
+    <file>recordingListWidget.js</file>
     <file>row.js</file>
     <file>utils.js</file>
     <file>waveform.js</file>
diff --git a/src/recordingsListBox.js b/src/recordingListWidget.js
similarity index 83%
rename from src/recordingsListBox.js
rename to src/recordingListWidget.js
index df20af3..74f5562 100644
--- a/src/recordingsListBox.js
+++ b/src/recordingListWidget.js
@@ -1,25 +1,26 @@
-/* exported RecordingsListBox */
-const { GObject, GstPlayer, Gtk, Gst } = imports.gi;
+/* exported RecordingsListWidget */
+const { Adw, GObject, GstPlayer, Gtk, Gst } = imports.gi;
 const { Row, RowState } = imports.row;
 
-var RecordingsListBox = new GObject.registerClass({
+var RecordingsListWidget = new GObject.registerClass({
     Signals: {
         'row-deleted': { param_types: [GObject.TYPE_OBJECT, GObject.TYPE_INT] },
     },
-}, class RecordingsListBox extends Gtk.ListBox {
+}, class RecordingsListWidget extends Adw.Bin {
     _init(model, player) {
-        this._player = player;
-        super._init({
-            valign: Gtk.Align.FILL,
-            margin_start: 8,
-            margin_end: 8,
-            margin_top: 12,
-            margin_bottom: 12,
-            activate_on_single_click: true,
-        });
-
-        this.get_style_context().add_class('content');
+        super._init();
+        this.list = Gtk.ListBox.new();
+        this.list.valign = Gtk.Align.START;
+        this.list.margin_start = 8;
+        this.list.margin_end = 8;
+        this.list.margin_top = 12;
+        this.list.margin_bottom = 12;
+        this.list.activate_on_single_click = true;
+        this.list.add_css_class('boxed-list');
+
+        this.set_child(this.list);
 
+        this._player = player;
         this._player.connect('state-changed', (_player, state) => {
             if (state === GstPlayer.PlayerState.STOPPED && this.activePlayingRow) {
                 this.activePlayingRow.state = RowState.PAUSED;
@@ -34,7 +35,7 @@ var RecordingsListBox = new GObject.registerClass({
             this.activePlayingRow.waveform.position = pos / duration;
         });
 
-        this.bind_model(model, recording => {
+        this.list.bind_model(model, recording => {
             let row = new Row(recording);
 
             row.waveform.connect('gesture-pressed', _ => {
@@ -99,9 +100,7 @@ var RecordingsListBox = new GObject.registerClass({
             return row;
         });
 
-        this.connect('row-activated', this.rowActivated.bind(this));
-
-        this.show();
+        this.list.connect('row-activated', this.rowActivated.bind(this));
     }
 
     rowActivated(list, row) {
@@ -119,9 +118,9 @@ var RecordingsListBox = new GObject.registerClass({
     }
 
     isolateAt(index, expanded) {
-        const before = this.get_row_at_index(index - 1);
-        const current = this.get_row_at_index(index);
-        const after = this.get_row_at_index(index + 1);
+        const before = this.list.get_row_at_index(index - 1);
+        const current = this.list.get_row_at_index(index);
+        const after = this.list.get_row_at_index(index + 1);
 
         if (expanded) {
             if (current)
diff --git a/src/window.js b/src/window.js
index cde7edd..1112bbd 100644
--- a/src/window.js
+++ b/src/window.js
@@ -22,7 +22,7 @@ const { Gio, GLib, GObject, Gst, GstPlayer, Gtk, Adw } = imports.gi;
 
 const { Recorder } = imports.recorder;
 const { RecordingList } = imports.recordingList;
-const { RecordingsListBox } = imports.recordingsListBox;
+const { RecordingsListWidget } = imports.recordingListWidget;
 const { RecorderWidget } = imports.recorderWidget;
 
 var WindowState = {
@@ -64,9 +64,9 @@ var Window = GObject.registerClass({
             }
         });
 
-        this._recordingListBox = new RecordingsListBox(this._recordingList, this.player);
+        this._recordingListWidget = new RecordingsListWidget(this._recordingList, this.player);
 
-        this._recordingListBox.connect('row-deleted', (_listBox, recording, index) => {
+        this._recordingListWidget.connect('row-deleted', (_listBox, recording, index) => {
             this._recordingList.remove(index);
             this.notify(_('"%s" deleted').format(recording.name),
                 _ => recording.delete(),
@@ -93,7 +93,7 @@ var Window = GObject.registerClass({
             }
             this._notificationUndoBtn.disconnect(this.cancelSignalId);
         });
-        this._column.set_child(this._recordingListBox);
+        this._column.set_child(this._recordingListWidget);
 
         this.recorderWidget.connect('started', this.onRecorderStarted.bind(this));
         this.recorderWidget.connect('canceled', this.onRecorderCanceled.bind(this));
@@ -121,7 +121,7 @@ var Window = GObject.registerClass({
     onRecorderStarted() {
         this.player.stop();
 
-        const activeRow = this._recordingListBox.activeRow;
+        const activeRow = this._recordingListWidget.activeRow;
         if (activeRow && activeRow.editMode)
             activeRow.editMode = false;
 
@@ -138,7 +138,7 @@ var Window = GObject.registerClass({
     onRecorderStopped(widget, recording) {
 
         this._recordingList.insert(0, recording);
-        this._recordingListBox.get_row_at_index(0).editMode = true;
+        this._recordingListWidget.list.get_row_at_index(0).editMode = true;
         this.state = WindowState.LIST;
     }