fix(glossary): handle save errors and improve playlist controls

src/qml/PlaylistItem.qml

@@ -22,6 +22,25 @@ Item {
 
     readonly property bool hovered: hoverHandler.hovered
     readonly property real fontSize: Kirigami.Theme.defaultFont.pointSize
+    activeFocusOnTab: true
+
+    function activate() {
+        root.playlist.play(root.index)
+    }
+
+    function showContextMenu() {
+        contextMenu.popup()
+    }
+
+    Keys.onReturnPressed: root.activate()
+    Keys.onEnterPressed: root.activate()
+    Keys.onMenuPressed: root.showContextMenu()
+    Keys.onPressed: event => {
+        if (event.key === Qt.Key_F10 && (event.modifiers & Qt.ShiftModifier)) {
+            root.showContextMenu()
+            event.accepted = true
+        }
+    }
 
     function labelColor(): color {
         if (root.isPlaying && !root.hovered) {
@@ -39,6 +58,7 @@ Item {
 
     TapHandler {
         acceptedButtons: Qt.LeftButton
+        onTapped: root.forceActiveFocus(Qt.MouseFocusReason)
         onDoubleTapped: root.playlist.play(root.index)
     }
 
@@ -60,6 +80,9 @@ Item {
             return Qt.alpha(Kirigami.Theme.backgroundColor, root.alpha)
         }
 
+        border.width: root.activeFocus ? 2 : 0
+        border.color: Kirigami.Theme.focusColor
+
         RowLayout {
             anchors.fill: parent
             spacing: Kirigami.Units.largeSpacing
@@ -95,8 +118,8 @@ Item {
                 color: root.labelColor()
                 visible: root.isPlaying
                 Layout.leftMargin: QtPotatoSettings.playlistShowRowNumber ? 0 : Kirigami.Units.largeSpacing
-                Layout.preferredWidth: Kirigami.Units.iconSizes.small
-                Layout.preferredHeight: Kirigami.Units.iconSizes.small
+                Layout.preferredHeight: Kirigami.Units.iconSizes.smallMedium
+                Layout.preferredWidth: Kirigami.Units.iconSizes.smallMedium
             }
 
             LabelWithTooltip {
@@ -105,11 +128,26 @@ Item {
                 color: root.labelColor()
                 elide: Text.ElideRight
                 font.pointSize: root.fontSize
+                font.bold: root.isPlaying
                 verticalAlignment: Qt.AlignVCenter
                 Layout.fillWidth: true
                 Layout.leftMargin: !QtPotatoSettings.playlistShowRowNumber && !root.isPlaying ? Kirigami.Units.largeSpacing : 0
                 Layout.rightMargin: Kirigami.Units.largeSpacing
             }
+
+            Button {
+                text: KI18n.i18nc("@action:button remove playlist item", "Remove")
+                icon.name: "list-remove"
+                display: AbstractButton.IconOnly
+                flat: true
+                Accessible.name: text
+                ToolTip.text: text
+                ToolTip.visible: hovered
+                ToolTip.delay: Kirigami.Units.toolTipDelay
+                Layout.preferredWidth: Kirigami.Units.iconSizes.smallMedium + Kirigami.Units.smallSpacing * 2
+                Layout.rightMargin: Kirigami.Units.smallSpacing
+                onClicked: root.playlist.remove(root.index)
+            }
         }
     }