Pin actively downloading packages to top of list

Packages with items in downloading/validating/extracting/integrity_check
state are always shown at the top regardless of sort order (A-Z or Z-A).

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "real-debrid-downloader",
-  "version": "1.4.83",
+  "version": "1.4.84",
   "description": "Real-Debrid Downloader Desktop (Electron + React + TypeScript)",
   "main": "build/main/main/main.js",
   "author": "Sucukdeluxe",

src/renderer/App.tsx

@@ -667,7 +667,29 @@ export function App(): ReactElement {
   const hiddenPackageCount = shouldLimitPackageRendering
     ? Math.max(0, totalPackageCount - packages.length)
     : 0;
-  const visiblePackages = packages;
+  const visiblePackages = useMemo(() => {
+    if (!snapshot.session.running || packages.length <= 1) {
+      return packages;
+    }
+    const activeStatuses = new Set(["downloading", "validating", "integrity_check", "extracting"]);
+    const active: PackageEntry[] = [];
+    const rest: PackageEntry[] = [];
+    for (const pkg of packages) {
+      const hasActive = pkg.itemIds.some((id) => {
+        const item = snapshot.session.items[id];
+        return item && activeStatuses.has(item.status);
+      });
+      if (hasActive) {
+        active.push(pkg);
+      } else {
+        rest.push(pkg);
+      }
+    }
+    if (active.length === 0 || active.length === packages.length) {
+      return packages;
+    }
+    return [...active, ...rest];
+  }, [packages, snapshot.session.running, snapshot.session.items]);
 
   useEffect(() => {
     if (!snapshot.session.running) {