editor: Implement drag and drop where it makes sense

data/res/style.css

@@ -118,4 +118,18 @@
 .selector-list>row {
   padding: 6px;
   border-radius: 6px;
+}
+
+.drag-handle {
+  color: color-mix(in srgb, var(--window-fg-color) 40%, transparent);
+}
+
+.drag-handle:backdrop {
+  color: color-mix(in srgb, var(--window-fg-color) 40%, transparent);
+}
+
+dragwidget {
+  background-color: var(--card-bg-color);
+  color: var(--card-fg-color);
+  border: 1px solid rgba(0, 0, 6, 0.07);
 }

data/ui/editor/album/recording_row.blp

@@ -0,0 +1,23 @@
+using Gtk 4.0;
+using Adw 1;
+
+template $MusicusAlbumEditorRecordingRow: Adw.ActionRow {
+  [prefix]
+  Gtk.Image {
+    icon-name: "list-drag-handle-symbolic";
+
+    styles [
+      "drag-handle",
+    ]
+  }
+
+  Gtk.Button {
+    icon-name: "user-trash-symbolic";
+    valign: center;
+    clicked => $remove() swapped;
+
+    styles [
+      "flat",
+    ]
+  }
+}

data/ui/editor/recording/ensemble_row.blp

@@ -2,6 +2,15 @@ using Gtk 4.0;
 using Adw 1;
 
 template $MusicusRecordingEditorEnsembleRow: Adw.ActionRow {
+  [prefix]
+  Gtk.Image {
+    icon-name: "list-drag-handle-symbolic";
+
+    styles [
+      "drag-handle",
+    ]
+  }
+  
   Gtk.Button {
     icon-name: "user-trash-symbolic";
     valign: center;

data/ui/editor/recording/performer_row.blp

@@ -2,6 +2,15 @@ using Gtk 4.0;
 using Adw 1;
 
 template $MusicusRecordingEditorPerformerRow: Adw.ActionRow {
+  [prefix]
+  Gtk.Image {
+    icon-name: "list-drag-handle-symbolic";
+
+    styles [
+      "drag-handle",
+    ]
+  }
+  
   Gtk.Button {
     icon-name: "user-trash-symbolic";
     valign: center;

data/ui/editor/tracks/track_row.blp

@@ -9,10 +9,18 @@ template $MusicusTracksEditorTrackRow: Adw.ActionRow {
   [prefix]
   Gtk.Box select_parts_box {
     Gtk.Image {
-      icon-name: "document-edit-symbolic";
+      icon-name: "list-drag-handle-symbolic";
+
+      styles [
+        "drag-handle",
+      ]
     }
   }
 
+  Gtk.Image edit_image {
+    icon-name: "document-edit-symbolic";
+  }
+
   Gtk.Button reset_button {
     icon-name: "edit-clear-symbolic";
     tooltip-text: _("Clear selected work parts");
@@ -21,7 +29,7 @@ template $MusicusTracksEditorTrackRow: Adw.ActionRow {
     clicked => $reset() swapped;
 
     styles [
-      "flat"
+      "flat",
     ]
   }
 
@@ -32,7 +40,7 @@ template $MusicusTracksEditorTrackRow: Adw.ActionRow {
     clicked => $remove() swapped;
 
     styles [
-      "flat"
+      "flat",
     ]
   }
 }

data/ui/editor/work/composer_row.blp

@@ -2,13 +2,22 @@ using Gtk 4.0;
 using Adw 1;
 
 template $MusicusWorkEditorComposerRow: Adw.ActionRow {
+  [prefix]
+  Gtk.Image {
+    icon-name: "list-drag-handle-symbolic";
+
+    styles [
+      "drag-handle",
+    ]
+  }
+
   Gtk.Button {
     icon-name: "user-trash-symbolic";
     valign: center;
     clicked => $remove() swapped;
 
     styles [
-      "flat"
+      "flat",
     ]
   }
 
@@ -17,7 +26,7 @@ template $MusicusWorkEditorComposerRow: Adw.ActionRow {
     clicked => $open_role_popover() swapped;
 
     styles [
-      "flat"
+      "flat",
     ]
 
     Gtk.Box role_box {

data/ui/editor/work/instrument_row.blp

@@ -0,0 +1,23 @@
+using Gtk 4.0;
+using Adw 1;
+
+template $MusicusWorkEditorInstrumentRow: Adw.ActionRow {
+  [prefix]
+  Gtk.Image {
+    icon-name: "list-drag-handle-symbolic";
+
+    styles [
+      "drag-handle",
+    ]
+  }
+
+  Gtk.Button {
+    icon-name: "user-trash-symbolic";
+    valign: center;
+    clicked => $remove() swapped;
+
+    styles [
+      "flat",
+    ]
+  }
+}

data/ui/editor/work/part_row.blp

@@ -5,6 +5,15 @@ template $MusicusWorkEditorPartRow: Adw.ActionRow {
   activatable: true;
   activated => $edit() swapped;
 
+  [prefix]
+  Gtk.Image {
+    icon-name: "list-drag-handle-symbolic";
+
+    styles [
+      "drag-handle",
+    ]
+  }
+
   Gtk.Image {
     icon-name: "document-edit-symbolic";
   }
@@ -15,7 +24,7 @@ template $MusicusWorkEditorPartRow: Adw.ActionRow {
     clicked => $remove() swapped;
 
     styles [
-      "flat"
+      "flat",
     ]
   }
 }