AboutTab: caching circular images

Modules/Panels/Settings/Tabs/AboutTab.qml

@@ -15,6 +15,8 @@ ColumnLayout {
   property string currentVersion: UpdateService.currentVersion
   property var contributors: GitHubService.contributors
 
+  readonly property int topContributorsCount: 20
+
   spacing: Style.marginL
 
   NHeader {
@@ -157,7 +159,7 @@ ColumnLayout {
     spacing: Style.marginM
 
     Repeater {
-      model: Math.min(root.contributors.length, 20)
+      model: Math.min(root.contributors.length, root.topContributorsCount)
 
       delegate: Rectangle {
         width: Math.round(Style.baseWidgetSize * 6.8)
@@ -312,21 +314,21 @@ ColumnLayout {
   // Remaining contributors (simple text links)
   Flow {
     id: remainingContributorsFlow
-    visible: root.contributors.length > 20
+    visible: root.contributors.length > root.topContributorsCount
     Layout.alignment: Qt.AlignHCenter
     Layout.preferredWidth: Math.round(Style.baseWidgetSize * 14)
     Layout.topMargin: Style.marginL
     spacing: Style.marginS
 
     Repeater {
-      model: Math.max(0, root.contributors.length - 20)
+      model: Math.max(0, root.contributors.length - root.topContributorsCount)
 
       delegate: Rectangle {
         width: nameText.implicitWidth + Style.marginM * 2
         height: nameText.implicitHeight + Style.marginS * 2
         radius: Style.radiusS
-        color: nameArea.containsMouse ? Qt.alpha(Color.mPrimary, 0.1) : Color.transparent
-        border.width: 1
+        color: nameArea.containsMouse ? Color.mHover : Color.transparent
+        border.width: Style.borderS
         border.color: nameArea.containsMouse ? Color.mPrimary : Color.mOutline
 
         Behavior on color {
@@ -344,9 +346,9 @@ ColumnLayout {
         NText {
           id: nameText
           anchors.centerIn: parent
-          text: root.contributors[index + 20].login || "Unknown"
+          text: root.contributors[index + root.topContributorsCount].login || "Unknown"
           pointSize: Style.fontSizeXS
-          color: nameArea.containsMouse ? Color.mPrimary : Color.mOnSurface
+          color: nameArea.containsMouse ? Color.mOnHover : Color.mOnSurface
           font.weight: Style.fontWeightMedium
 
           Behavior on color {
@@ -362,8 +364,8 @@ ColumnLayout {
           hoverEnabled: true
           cursorShape: Qt.PointingHandCursor
           onClicked: {
-            if (root.contributors[index + 20].html_url)
-              Quickshell.execDetached(["xdg-open", root.contributors[index + 20].html_url]);
+            if (root.contributors[index + root.topContributorsCount].html_url)
+              Quickshell.execDetached(["xdg-open", root.contributors[index + root.topContributorsCount].html_url]);
           }
         }
       }

Modules/Renderer/CircularAvatarRenderer.qml

@@ -1,96 +0,0 @@
-import QtQuick
-import Quickshell
-import Quickshell.Wayland
-import Quickshell.Widgets
-import qs.Commons
-
-/**
-* CircularAvatarRenderer - Hidden window for rendering circular avatars
-*
-* This component safely uses ClippingRectangle in a separate hidden window to
-* pre-render circular avatar images. The rendered images are saved as PNGs
-* with transparent backgrounds, which can then be used in the UI without
-* any shader effects (avoiding Qt 6.8 crashes).
-*
-* Usage:
-*   var renderer = component.createObject(null, {
-*     imagePath: "file:///path/to/avatar.png",
-*     outputPath: "/path/to/output_circular.png",
-*     username: "ItsLemmy"
-*   });
-*   renderer.renderComplete.connect(function(success) {
-*     if (success) console.log("Rendered!");
-*     renderer.destroy();
-*   });
-*/
-PanelWindow {
-  id: root
-
-  // Input properties
-  property string imagePath: ""
-  property string outputPath: ""
-  property string username: ""
-
-  // Hidden window configuration
-  implicitWidth: 256
-  implicitHeight: 256
-  visible: true // Must be visible for grabToImage to work
-  color: "transparent"
-
-  // Wayland configuration - hide it from user view
-  WlrLayershell.layer: WlrLayer.Bottom // Render below everything
-  WlrLayershell.exclusionMode: ExclusionMode.Ignore
-  WlrLayershell.keyboardFocus: WlrKeyboardFocus.None
-
-  // Position it off-screen or behind everything
-  anchors {
-    left: true
-    top: true
-  }
-  margins {
-    left: -512// Off-screen to the left
-    top: -512  // Off-screen to the top
-  }
-
-  signal renderComplete(bool success)
-
-  // Use ClippingRectangle safely (not in GridView, not visible)
-  ClippingRectangle {
-    id: clipper
-    anchors.fill: parent
-    radius: width * 0.5 // Make it circular
-    color: "transparent"
-
-    Image {
-      id: sourceImage
-      anchors.fill: parent
-      source: root.imagePath
-      fillMode: Image.PreserveAspectCrop
-      smooth: true
-      mipmap: true
-      asynchronous: true
-
-      onStatusChanged: {
-        if (status === Image.Ready) {
-          // Image loaded successfully, capture it on next frame
-          Qt.callLater(captureCircular);
-        } else if (status === Image.Error) {
-          Logger.e("CircularAvatarRenderer", "Failed to load image for", root.username);
-          root.renderComplete(false);
-        }
-      }
-    }
-  }
-
-  function captureCircular() {
-    clipper.grabToImage(function (result) {
-      if (result.saveToFile(root.outputPath)) {
-        Logger.d("CircularAvatarRenderer", "Saved circular avatar for", root.username, "to", root.outputPath);
-        root.renderComplete(true);
-      } else {
-        Logger.e("CircularAvatarRenderer", "Failed to save circular avatar for", root.username);
-        root.renderComplete(false);
-      }
-    }, Qt.size(root.width, root.height));
-  }
-}