chore: bump version to 0.0.89 [skip ci]

Store pinned library IDs on the user record and expose GET/PUT
/me/pinned-libraries endpoints. The web client now loads and saves pins
through the API, migrates legacy localStorage data once, and applies
pinned ordering on both the libraries and home pages.

Co-authored-by: Cursor Agent <cursoragent@cursor.com>
Co-authored-by: truewhile <truewhile@users.noreply.github.com>

.github/workflows/Auto-docker-publish.yml

@@ -264,3 +264,42 @@ jobs:
           if [ -f "$TAR" ]; then
             for i in 1 2 3; do gh release upload "$RELEASE_TAG" "$TAR" --clobber && break || sleep 5; done
           fi
+
+  deploy:
+    name: Deploy to Server
+    needs: [version-and-publish]
+    runs-on: ubuntu-latest
+    steps:
+      - name: Deploy via SSH
+        uses: appleboy/ssh-action@v1.0.3
+        with:
+          host: ${{ secrets.SERVER_HOST }}
+          username: ${{ secrets.SERVER_USER }}
+          password: ${{ secrets.SERVER_PASSWORD }}
+          port: ${{ secrets.SERVER_PORT }}
+          script: |
+            set -e
+            echo "==== 开始部署 MeBox ===="
+            cd /root/dockerData/mebox
+
+            # 判断 compose 命令版本兼容性（docker compose 或 docker-compose）
+            if docker compose version >/dev/null 2>&1; then
+              COMPOSE_CMD="docker compose"
+            elif command -v docker-compose >/dev/null 2>&1; then
+              COMPOSE_CMD="docker-compose"
+            else
+              echo "错误: 未找到 docker compose 或 docker-compose"
+              exit 1
+            fi
+
+            echo "正在拉取最新镜像..."
+            $COMPOSE_CMD pull
+
+            echo "正在重启服务..."
+            $COMPOSE_CMD up -d
+
+            echo "清理旧的无用镜像..."
+            docker image prune -f
+
+            echo "==== 部署完成并已启动 ===="
+

.github/workflows/docker-publish.yml

@@ -61,3 +61,41 @@ jobs:
             VERSION=${{ env.RELEASE_VERSION }}
           cache-from: type=gha
           cache-to: type=gha,mode=max
+
+  deploy:
+    name: Deploy to Server
+    needs: [docker]
+    runs-on: ubuntu-latest
+    steps:
+      - name: Deploy via SSH
+        uses: appleboy/ssh-action@v1.0.3
+        with:
+          host: ${{ secrets.SERVER_HOST }}
+          username: ${{ secrets.SERVER_USER }}
+          password: ${{ secrets.SERVER_PASSWORD }}
+          port: ${{ secrets.SERVER_PORT }}
+          script: |
+            set -e
+            echo "==== 开始部署 MeBox ===="
+            cd /root/dockerData/mebox
+
+            if docker compose version >/dev/null 2>&1; then
+              COMPOSE_CMD="docker compose"
+            elif command -v docker-compose >/dev/null 2>&1; then
+              COMPOSE_CMD="docker-compose"
+            else
+              echo "错误: 未找到 docker compose 或 docker-compose"
+              exit 1
+            fi
+
+            echo "正在拉取最新镜像..."
+            $COMPOSE_CMD pull
+
+            echo "正在重启服务..."
+            $COMPOSE_CMD up -d
+
+            echo "清理旧的无用镜像..."
+            docker image prune -f
+
+            echo "==== 部署完成并已启动 ===="
+

VERSION

@@ -1 +1 @@
-0.0.82
+0.0.89

internal/handler/pinned_libraries.go

@@ -0,0 +1,49 @@
+package handler
+
+import (
+	"net/http"
+
+	"github.com/gin-gonic/gin"
+
+	"github.com/truewhile/MeBox/internal/middleware"
+	"github.com/truewhile/MeBox/internal/service"
+)
+
+type pinnedLibrariesReq struct {
+	LibraryIDs []string `json:"library_ids"`
+}
+
+func getPinnedLibrariesHandler(svc *service.Container) gin.HandlerFunc {
+	return func(c *gin.Context) {
+		uid, _ := c.Get(middleware.CtxUserID)
+		ids, err := svc.Profile.GetPinnedLibraryIDs(c.Request.Context(), uid.(string))
+		if err != nil {
+			c.JSON(http.StatusBadRequest, gin.H{"error": err.Error()})
+			return
+		}
+		if ids == nil {
+			ids = []string{}
+		}
+		c.JSON(http.StatusOK, gin.H{"library_ids": ids})
+	}
+}
+
+func setPinnedLibrariesHandler(svc *service.Container) gin.HandlerFunc {
+	return func(c *gin.Context) {
+		var req pinnedLibrariesReq
+		if err := c.ShouldBindJSON(&req); err != nil {
+			c.JSON(http.StatusBadRequest, gin.H{"error": err.Error()})
+			return
+		}
+		uid, _ := c.Get(middleware.CtxUserID)
+		ids, err := svc.Profile.SetPinnedLibraryIDs(c.Request.Context(), uid.(string), req.LibraryIDs)
+		if err != nil {
+			c.JSON(http.StatusBadRequest, gin.H{"error": err.Error()})
+			return
+		}
+		if ids == nil {
+			ids = []string{}
+		}
+		c.JSON(http.StatusOK, gin.H{"library_ids": ids})
+	}
+}

internal/handler/routes_admin.go

@@ -37,6 +37,7 @@ func registerAdminScraperRoutes(admin *gin.RouterGroup, svc *service.Container)
 	admin.POST("/scraper/queue/clear-done", clearDoneScrapeTasksHandler(svc))
 	admin.POST("/scraper/queue/clear-finished", clearFinishedScrapeTasksHandler(svc))
 	admin.POST("/scraper/queue/clear-canceled", clearCanceledScrapeTasksHandler(svc))
+	admin.POST("/scraper/queue/clear-failed", clearFailedScrapeTasksHandler(svc))
 	admin.POST("/scraper/queue/retry-failed", retryAllFailedScrapeTasksHandler(svc))
 	admin.POST("/scraper/queue/cancel-pending", cancelPendingScrapeTasksHandler(svc))
 	admin.POST("/scraper/queue/enqueue-library/:id", enqueueLibraryScrapeHandler(svc))
@@ -87,6 +88,7 @@ func registerAdminStrmRoutes(admin *gin.RouterGroup, svc *service.Container) {
 	admin.POST("/strm/downloads/clear-done", clearDoneDownloadsHandler(svc))
 	admin.POST("/strm/downloads/clear-finished", clearFinishedDownloadsHandler(svc))
 	admin.POST("/strm/downloads/clear-canceled", clearCanceledDownloadsHandler(svc))
+	admin.POST("/strm/downloads/clear-failed", clearFailedDownloadsHandler(svc))
 	admin.POST("/strm/downloads/retry-failed", retryAllFailedDownloadsHandler(svc))
 	admin.POST("/strm/downloads/cancel-pending", cancelPendingDownloadsHandler(svc))
 	admin.GET("/strm/uploads", uploadQueueHandler(svc))
@@ -97,6 +99,7 @@ func registerAdminStrmRoutes(admin *gin.RouterGroup, svc *service.Container) {
 	admin.POST("/strm/uploads/clear-done", clearDoneUploadsHandler(svc))
 	admin.POST("/strm/uploads/clear-finished", clearFinishedUploadsHandler(svc))
 	admin.POST("/strm/uploads/clear-canceled", clearCanceledUploadsHandler(svc))
+	admin.POST("/strm/uploads/clear-failed", clearFailedUploadsHandler(svc))
 	admin.POST("/strm/uploads/retry-failed", retryAllFailedUploadsHandler(svc))
 	admin.POST("/strm/uploads/cancel-pending", cancelPendingUploadsHandler(svc))
 }

internal/handler/routes_authenticated_core.go

@@ -10,6 +10,8 @@ import (
 func registerAuthedUserAndLicenseRoutes(authed *gin.RouterGroup, svc *service.Container) {
 	authed.GET("/me", meHandler(svc))
 	authed.PATCH("/me", updateProfileHandler(svc))
+	authed.GET("/me/pinned-libraries", getPinnedLibrariesHandler(svc))
+	authed.PUT("/me/pinned-libraries", setPinnedLibrariesHandler(svc))
 	authed.POST("/me/password", changePasswordHandler(svc))
 	authed.POST("/me/logout", logoutHandler(svc))
 

internal/handler/routes_authenticated_test.go

@@ -25,6 +25,8 @@ func TestAuthenticatedRouteSurfacesAreRegistered(t *testing.T) {
 
 	for _, want := range []string{
 		"GET /api/me",
+		"GET /api/me/pinned-libraries",
+		"PUT /api/me/pinned-libraries",
 		"GET /api/auth/permissions",
 		"GET /api/libraries",
 		"GET /api/media",

internal/handler/scraper_queue.go

@@ -101,6 +101,17 @@ func clearCanceledScrapeTasksHandler(svc *service.Container) gin.HandlerFunc {
 	}
 }
 
+func clearFailedScrapeTasksHandler(svc *service.Container) gin.HandlerFunc {
+	return func(c *gin.Context) {
+		n, err := svc.Scraper.ClearFailedScrapeTasks(c.Request.Context())
+		if err != nil {
+			c.JSON(http.StatusInternalServerError, gin.H{"error": err.Error()})
+			return
+		}
+		c.JSON(http.StatusOK, gin.H{"deleted": n})
+	}
+}
+
 func retryAllFailedScrapeTasksHandler(svc *service.Container) gin.HandlerFunc {
 	return func(c *gin.Context) {
 		n, err := svc.Scraper.RetryAllFailedScrapeTasks(c.Request.Context())

internal/handler/strm.go

@@ -526,6 +526,17 @@ func clearCanceledDownloadsHandler(svc *service.Container) gin.HandlerFunc {
 	}
 }
 
+func clearFailedDownloadsHandler(svc *service.Container) gin.HandlerFunc {
+	return func(c *gin.Context) {
+		n, err := svc.Strm.ClearFailedDownloadTasks(c.Request.Context())
+		if err != nil {
+			c.JSON(http.StatusInternalServerError, gin.H{"error": err.Error()})
+			return
+		}
+		c.JSON(http.StatusOK, gin.H{"deleted": n})
+	}
+}
+
 func clearCanceledUploadsHandler(svc *service.Container) gin.HandlerFunc {
 	return func(c *gin.Context) {
 		n, err := svc.Strm.ClearCanceledUploadTasks(c.Request.Context())
@@ -537,6 +548,17 @@ func clearCanceledUploadsHandler(svc *service.Container) gin.HandlerFunc {
 	}
 }
 
+func clearFailedUploadsHandler(svc *service.Container) gin.HandlerFunc {
+	return func(c *gin.Context) {
+		n, err := svc.Strm.ClearFailedUploadTasks(c.Request.Context())
+		if err != nil {
+			c.JSON(http.StatusInternalServerError, gin.H{"error": err.Error()})
+			return
+		}
+		c.JSON(http.StatusOK, gin.H{"deleted": n})
+	}
+}
+
 func clearDoneUploadsHandler(svc *service.Container) gin.HandlerFunc {
 	return func(c *gin.Context) {
 		n, err := svc.Strm.ClearDoneUploadTasks(c.Request.Context())

internal/handler/system_meta.go

@@ -8,6 +8,7 @@ package handler
 import (
 	"net/http"
 	"runtime"
+	"strings"
 	"time"
 
 	"github.com/gin-gonic/gin"
@@ -22,26 +23,30 @@ import (
 // without threading state through the container.
 var startedAt = time.Now()
 
-func systemInfoHandler(svc *service.Container) gin.HandlerFunc {
-	return func(c *gin.Context) {
-		directOnly := false
-		if svc.Repo != nil && svc.Repo.Setting != nil {
-			if v, err := svc.Repo.Setting.Get(c.Request.Context(), service.PlaybackDirectOnlySettingKey); err == nil {
-				directOnly = service.ParseBoolSetting(v, false)
+	func systemInfoHandler(svc *service.Container) gin.HandlerFunc {
+		return func(c *gin.Context) {
+			directOnly := false
+			if svc.Repo != nil && svc.Repo.Setting != nil {
+				if v, err := svc.Repo.Setting.Get(c.Request.Context(), service.PlaybackDirectOnlySettingKey); err == nil {
+					directOnly = service.ParseBoolSetting(v, false)
+				}
 			}
+			version := svc.Version
+			if strings.TrimSpace(version) == "" {
+				version = "dev"
+			}
+			c.JSON(http.StatusOK, gin.H{
+				"name":             "MeBox",
+				"version":          version,
+				"go":               runtime.Version(),
+				"os":               runtime.GOOS,
+				"arch":             runtime.GOARCH,
+				"data_dir":         svc.Cfg.App.DataDir,
+				"cache_dir":        svc.Cfg.Cache.CacheDir,
+				"direct_play_only": directOnly,
+			})
 		}
-		c.JSON(http.StatusOK, gin.H{
-			"name":             "MeBox",
-			"version":          "0.1.0",
-			"go":               runtime.Version(),
-			"os":               runtime.GOOS,
-			"arch":             runtime.GOARCH,
-			"data_dir":         svc.Cfg.App.DataDir,
-			"cache_dir":        svc.Cfg.Cache.CacheDir,
-			"direct_play_only": directOnly,
-		})
 	}
-}
 
 func systemStatusHandler(svc *service.Container) gin.HandlerFunc {
 	return func(c *gin.Context) {

internal/model/user.go

@@ -25,6 +25,9 @@ type User struct {
 	// 为空时代表不限制（全库可访问）。
 	AllowedLibraryIDs  string   `gorm:"type:text" json:"-"`
 	AllowedLibraryList []string `gorm:"-" json:"allowed_library_ids,omitempty"`
+	// PinnedLibraryIDs 存储用户置顶的媒体库 ID 列表（JSON 字符串），顺序即置顶优先级。
+	PinnedLibraryIDs  string   `gorm:"type:text" json:"-"`
+	PinnedLibraryList []string `gorm:"-" json:"pinned_library_ids,omitempty"`
 	// ExpiredAt is the account expiry time. Nil means the account never
 	// expires. When set and in the past, the account is treated as expired
 	// (login blocked) until an admin or a redemption code renews it.
@@ -59,10 +62,30 @@ func (u *User) DecodeAllowedLibraryIDs() []string {
 	return out
 }
 
+// DecodePinnedLibraryIDs 解析 PinnedLibraryIDs 字段。
+func (u *User) DecodePinnedLibraryIDs() []string {
+	if u == nil || strings.TrimSpace(u.PinnedLibraryIDs) == "" {
+		return nil
+	}
+	var ids []string
+	if err := json.Unmarshal([]byte(u.PinnedLibraryIDs), &ids); err != nil {
+		return nil
+	}
+	var out []string
+	for _, id := range ids {
+		trimmed := strings.TrimSpace(id)
+		if trimmed != "" {
+			out = append(out, trimmed)
+		}
+	}
+	return out
+}
+
 // PopulateComputedFields 填充非 DB 虚拟计算字段（如 AllowedLibraryList）。
 func (u *User) PopulateComputedFields() {
 	if u == nil {
 		return
 	}
 	u.AllowedLibraryList = u.DecodeAllowedLibraryIDs()
+	u.PinnedLibraryList = u.DecodePinnedLibraryIDs()
 }

internal/repository/scrape_task_repository.go

@@ -236,6 +236,16 @@ func (r *ScrapeTaskRepository) ClearCanceled(ctx context.Context) (int64, error)
 	return count, err
 }
 
+func (r *ScrapeTaskRepository) ClearFailed(ctx context.Context) (int64, error) {
+	var count int64
+	err := withSQLiteBusyRetry(ctx, func() error {
+		res := r.db.WithContext(ctx).Unscoped().Where("status = ?", model.ScrapeTaskFailed).Delete(&model.ScrapeTask{})
+		count = res.RowsAffected
+		return res.Error
+	})
+	return count, err
+}
+
 func (r *ScrapeTaskRepository) RetryAllFailed(ctx context.Context) (int64, error) {
 	var count int64
 	err := withSQLiteBusyRetry(ctx, func() error {

internal/repository/strm_repository.go

@@ -402,6 +402,17 @@ func (r *StrmDownloadTaskRepository) ClearCanceled(ctx context.Context) (int64,
 	return count, err
 }
 
+// ClearFailed 清空全部已失败下载任务。
+func (r *StrmDownloadTaskRepository) ClearFailed(ctx context.Context) (int64, error) {
+	var count int64
+	err := withSQLiteBusyRetry(ctx, func() error {
+		res := r.db.WithContext(ctx).Unscoped().Where("status = ?", model.StrmTaskFailed).Delete(&model.StrmDownloadTask{})
+		count = res.RowsAffected
+		return res.Error
+	})
+	return count, err
+}
+
 // RetryAllFailed 把所有失败任务重置回待处理，清空错误与重试计数。
 func (r *StrmDownloadTaskRepository) RetryAllFailed(ctx context.Context) (int64, error) {
 	var count int64
@@ -709,6 +720,17 @@ func (r *StrmUploadTaskRepository) ClearCanceled(ctx context.Context) (int64, er
 	return count, err
 }
 
+// ClearFailed 清空全部已失败上传任务。
+func (r *StrmUploadTaskRepository) ClearFailed(ctx context.Context) (int64, error) {
+	var count int64
+	err := withSQLiteBusyRetry(ctx, func() error {
+		res := r.db.WithContext(ctx).Unscoped().Where("status = ?", model.StrmTaskFailed).Delete(&model.StrmUploadTask{})
+		count = res.RowsAffected
+		return res.Error
+	})
+	return count, err
+}
+
 // RetryAllFailed 把所有失败任务重置回待处理，清空错误与重试计数。
 func (r *StrmUploadTaskRepository) RetryAllFailed(ctx context.Context) (int64, error) {
 	var count int64

internal/service/emby_remote_web.go

@@ -301,11 +301,22 @@ func (r *EmbyRemoteService) MapRemoteItemToMedia(ctx context.Context, mount *mod
 		media.SeasonNum = 0
 		media.EpisodeNum = 0
 	}
-	if mount != nil && strings.TrimSpace(mount.RemoteViewID) != "" {
-		libID := EncodeEmbyRemoteID(mount.ID, mount.RemoteViewID)
-		media.DisplayLibraryID = libID
-		media.LibraryID = libID
-	}
+		if mount != nil && strings.TrimSpace(mount.RemoteViewID) != "" {
+			libID := EncodeEmbyRemoteID(mount.ID, mount.RemoteViewID)
+			media.DisplayLibraryID = libID
+			media.LibraryID = libID
+			libName := strings.TrimSpace(mount.Name)
+			if libName == "" {
+				libName = strings.TrimSpace(mount.RemoteViewName)
+			}
+			if libName == "" && acct != nil {
+				libName = acct.Name
+			} else if acct != nil && acct.Name != "" && !strings.Contains(libName, acct.Name) {
+				libName = acct.Name + " · " + libName
+			}
+			media.LibraryName = libName
+			media.DisplayLibraryName = libName
+		}
 	return media
 }
 

internal/service/media_versions.go

@@ -120,6 +120,11 @@ func GroupMediaVersions(items []model.Media) []MediaItem {
 }
 
 func mediaVersionGroupKey(m model.Media) string {
+	// 远程 Emby 挂载条目保持独立，不与其它远程条目或本地条目折叠合并。
+	if IsEmbyRemoteID(m.ID) {
+		return fmt.Sprintf("embyremote:%s", m.ID)
+	}
+
 	if m.SeasonNum > 0 || m.EpisodeNum > 0 {
 		switch {
 		case m.TMDbID > 0:
@@ -146,14 +151,32 @@ func mediaVersionGroupKey(m model.Media) string {
 			fmt.Sprintf("%d:%d", m.SeasonNum, m.EpisodeNum),
 		}, "|")
 	}
+
+	libKey := strings.ToLower(strings.TrimSpace(m.LibraryID))
+	if libKey == "" {
+		libKey = strings.ToLower(strings.TrimSpace(m.DisplayLibraryID))
+	}
+
 	switch {
 	case m.TMDbID > 0:
+		if libKey != "" {
+			return fmt.Sprintf("movie:%s:tmdb:%d", libKey, m.TMDbID)
+		}
 		return fmt.Sprintf("tmdb:%d", m.TMDbID)
 	case m.BangumiID > 0:
+		if libKey != "" {
+			return fmt.Sprintf("movie:%s:bangumi:%d", libKey, m.BangumiID)
+		}
 		return fmt.Sprintf("bangumi:%d", m.BangumiID)
 	case strings.TrimSpace(m.DoubanID) != "":
+		if libKey != "" {
+			return fmt.Sprintf("movie:%s:douban:%s", libKey, strings.ToLower(strings.TrimSpace(m.DoubanID)))
+		}
 		return "douban:" + strings.ToLower(strings.TrimSpace(m.DoubanID))
 	case strings.TrimSpace(m.TheTVDBID) != "":
+		if libKey != "" {
+			return fmt.Sprintf("movie:%s:thetvdb:%s", libKey, strings.ToLower(strings.TrimSpace(m.TheTVDBID)))
+		}
 		return "thetvdb:" + strings.ToLower(strings.TrimSpace(m.TheTVDBID))
 	}
 	title := firstNonEmpty(m.OriginalName, m.Title)
@@ -173,6 +196,9 @@ func mediaVersionGroupKey(m model.Media) string {
 	if year <= 0 {
 		_, year = CleanQuery(m.Path)
 	}
+	if libKey != "" {
+		return fmt.Sprintf("movie:%s:%s:%d", libKey, title, year)
+	}
 	return fmt.Sprintf("movie:%s:%d", title, year)
 }
 

internal/service/media_versions_test.go

@@ -218,3 +218,49 @@ func TestSearchMediaVisiblePageGroupedPaginatesAfterVersionGrouping(t *testing.T
 		t.Fatalf("primary version = %q, want %q", page[0].Media.Path, rows[0].Path)
 	}
 }
+
+func TestGroupMediaVersionsDoesNotMergeDifferentRemoteSeries(t *testing.T) {
+	// 模拟来自两个不同挂载库（如 00 新番连载 与 2018 动漫）的同名剧集《碧蓝之海》
+	season1 := model.Media{
+		Base:        model.Base{ID: EncodeEmbyRemoteID("mount-1", "156019")},
+		LibraryID:   EncodeEmbyRemoteID("mount-1", "view-1"),
+		Title:       "碧蓝之海",
+		Year:        2018,
+		LibraryName: "2018 动漫",
+	}
+	season2 := model.Media{
+		Base:        model.Base{ID: EncodeEmbyRemoteID("mount-2", "156030")},
+		LibraryID:   EncodeEmbyRemoteID("mount-2", "view-2"),
+		Title:       "碧蓝之海",
+		Year:        2024,
+		LibraryName: "00 新番连载",
+	}
+
+	grouped := groupMediaVersions([]model.Media{season1, season2})
+	if len(grouped) != 2 {
+		t.Fatalf("expected 2 separate groups for different remote series/libraries, got %d: %#v", len(grouped), grouped)
+	}
+	if grouped[0].Title != "碧蓝之海" || grouped[1].Title != "碧蓝之海" {
+		t.Fatalf("expected both titles to be '碧蓝之海'")
+	}
+}
+
+func TestGroupMediaVersionsDoesNotMergeAcrossDifferentLibrariesForMovies(t *testing.T) {
+	movieLib1 := model.Media{
+		Base:      model.Base{ID: "m-1"},
+		LibraryID: "lib-1",
+		Title:     "碧蓝之海",
+		Year:      2018,
+	}
+	movieLib2 := model.Media{
+		Base:      model.Base{ID: "m-2"},
+		LibraryID: "lib-2",
+		Title:     "碧蓝之海",
+		Year:      2018,
+	}
+
+	grouped := groupMediaVersions([]model.Media{movieLib1, movieLib2})
+	if len(grouped) != 2 {
+		t.Fatalf("expected 2 separate groups for movies in different libraries, got %d", len(grouped))
+	}
+}

internal/service/profile.go

@@ -3,6 +3,7 @@ package service
 
 import (
 	"context"
+	"encoding/json"
 	"errors"
 	"strings"
 
@@ -81,6 +82,106 @@ func (p *ProfileService) UpdateProfile(ctx context.Context, userID string, patch
 	return p.repo.User.FindByID(ctx, userID)
 }
 
+// GetPinnedLibraryIDs returns the user's pinned library IDs, filtered to libraries
+// they can still access.
+func (p *ProfileService) GetPinnedLibraryIDs(ctx context.Context, userID string) ([]string, error) {
+	user, err := p.repo.User.FindByID(ctx, userID)
+	if err != nil {
+		return nil, err
+	}
+	if user == nil {
+		return nil, errors.New("user not found")
+	}
+	visibility := UserDefaultMediaVisibility(ctx, p.repo, userID)
+	accessible, err := p.accessibleLibraryIDSet(ctx, visibility)
+	if err != nil {
+		return nil, err
+	}
+	return filterPinnedLibraryIDs(user.DecodePinnedLibraryIDs(), accessible), nil
+}
+
+// SetPinnedLibraryIDs persists the user's pinned library order after filtering to
+// accessible, enabled libraries.
+func (p *ProfileService) SetPinnedLibraryIDs(ctx context.Context, userID string, ids []string) ([]string, error) {
+	if userID == "" {
+		return nil, errors.New("missing user id")
+	}
+	user, err := p.repo.User.FindByID(ctx, userID)
+	if err != nil {
+		return nil, err
+	}
+	if user == nil {
+		return nil, errors.New("user not found")
+	}
+	visibility := UserDefaultMediaVisibility(ctx, p.repo, userID)
+	accessible, err := p.accessibleLibraryIDSet(ctx, visibility)
+	if err != nil {
+		return nil, err
+	}
+	normalized := filterPinnedLibraryIDs(normalizePinnedLibraryIDs(ids), accessible)
+	raw, err := json.Marshal(normalized)
+	if err != nil {
+		return nil, err
+	}
+	if err := p.repo.User.UpdateFields(ctx, userID, map[string]any{
+		"pinned_library_ids": string(raw),
+	}); err != nil {
+		return nil, err
+	}
+	return normalized, nil
+}
+
+func (p *ProfileService) accessibleLibraryIDSet(ctx context.Context, visibility MediaVisibility) (map[string]struct{}, error) {
+	libs, err := p.repo.Library.List(ctx)
+	if err != nil {
+		return nil, err
+	}
+	out := make(map[string]struct{})
+	for _, lib := range libs {
+		if !lib.Enabled {
+			continue
+		}
+		if !LibraryVisibleForUser(ctx, p.repo, lib, visibility) {
+			continue
+		}
+		out[lib.ID] = struct{}{}
+	}
+	return out, nil
+}
+
+func normalizePinnedLibraryIDs(ids []string) []string {
+	if len(ids) == 0 {
+		return nil
+	}
+	seen := make(map[string]struct{}, len(ids))
+	out := make([]string, 0, len(ids))
+	for _, id := range ids {
+		trimmed := strings.TrimSpace(id)
+		if trimmed == "" {
+			continue
+		}
+		if _, ok := seen[trimmed]; ok {
+			continue
+		}
+		seen[trimmed] = struct{}{}
+		out = append(out, trimmed)
+	}
+	return out
+}
+
+func filterPinnedLibraryIDs(ids []string, accessible map[string]struct{}) []string {
+	if len(ids) == 0 {
+		return nil
+	}
+	out := make([]string, 0, len(ids))
+	for _, id := range ids {
+		if _, ok := accessible[id]; ok {
+			out = append(out, id)
+		}
+	}
+	return out
+}
+
 // AdminUpdateRole lets administrators promote / demote another user. The
 // caller is expected to gate the route with AdminRequired.
 func (p *ProfileService) AdminUpdateRole(ctx context.Context, userID, role string) (*model.User, error) {

internal/service/profile_pinned_test.go

@@ -0,0 +1,61 @@
+package service
+
+import (
+	"testing"
+
+	"github.com/glebarez/sqlite"
+	"gorm.io/gorm"
+
+	"github.com/truewhile/MeBox/internal/model"
+	"github.com/truewhile/MeBox/internal/repository"
+	"go.uber.org/zap"
+)
+
+func TestProfilePinnedLibrariesFiltersInaccessibleAndPreservesOrder(t *testing.T) {
+	db, err := gorm.Open(sqlite.Open(":memory:"), &gorm.Config{})
+	if err != nil {
+		t.Fatal(err)
+	}
+	if err := db.AutoMigrate(&model.User{}, &model.Library{}); err != nil {
+		t.Fatal(err)
+	}
+	repos := repository.New(db)
+	svc := NewProfileService(zap.NewNop(), repos)
+
+	user := &model.User{Username: "viewer", PasswordHash: "hash", Role: "user"}
+	if err := repos.User.Create(t.Context(), user); err != nil {
+		t.Fatal(err)
+	}
+	libA := &model.Library{Name: "Movies", Path: "/media/movies", Type: "movie", Enabled: true}
+	libB := &model.Library{Name: "TV", Path: "/media/tv", Type: "tv", Enabled: true}
+	libHidden := &model.Library{Name: "Adult", Path: "/media/adult", Type: "movie", Enabled: true}
+	for _, lib := range []*model.Library{libA, libB, libHidden} {
+		if err := repos.Library.Create(t.Context(), lib); err != nil {
+			t.Fatal(err)
+		}
+	}
+	if err := repos.User.UpdateFields(t.Context(), user.ID, map[string]any{
+		"allowed_library_ids": `["` + libA.ID + `","` + libB.ID + `"]`,
+	}); err != nil {
+		t.Fatal(err)
+	}
+
+	got, err := svc.SetPinnedLibraryIDs(t.Context(), user.ID, []string{
+		libB.ID, libHidden.ID, libA.ID, libB.ID, "missing",
+	})
+	if err != nil {
+		t.Fatalf("SetPinnedLibraryIDs: %v", err)
+	}
+	want := []string{libB.ID, libA.ID}
+	if len(got) != len(want) || got[0] != want[0] || got[1] != want[1] {
+		t.Fatalf("SetPinnedLibraryIDs = %v, want %v", got, want)
+	}
+
+	loaded, err := svc.GetPinnedLibraryIDs(t.Context(), user.ID)
+	if err != nil {
+		t.Fatalf("GetPinnedLibraryIDs: %v", err)
+	}
+	if len(loaded) != len(want) || loaded[0] != want[0] || loaded[1] != want[1] {
+		t.Fatalf("GetPinnedLibraryIDs = %v, want %v", loaded, want)
+	}
+}

internal/service/scraper_queue.go

@@ -345,6 +345,10 @@ func (s *ScraperService) ClearCanceledScrapeTasks(ctx context.Context) (int64, e
 	return s.repo.ScrapeTask.ClearCanceled(ctx)
 }
 
+func (s *ScraperService) ClearFailedScrapeTasks(ctx context.Context) (int64, error) {
+	return s.repo.ScrapeTask.ClearFailed(ctx)
+}
+
 func (s *ScraperService) RetryAllFailedScrapeTasks(ctx context.Context) (int64, error) {
 	return s.repo.ScrapeTask.RetryAllFailed(ctx)
 }

internal/service/service.go

@@ -15,6 +15,7 @@ import (
 
 // Container 持有在启动时初始化的每个服务。Handler 接收指向它的指针并选择相关字段。
 type Container struct {
+	Version          string
 	Cfg              *config.Config
 	Log              *zap.Logger
 	Repo             *repository.Container

internal/service/service_builder.go

@@ -27,12 +27,13 @@ func newServiceContainer(cfg *config.Config, log *zap.Logger, repos *repository.
 		cfg:     cfg,
 		log:     log,
 		repos:   repos,
-		version: normalizeSystemUpdateVersion(version),
-		c: &Container{
-			Cfg:  cfg,
-			Log:  log,
-			Repo: repos,
-		},
+			version: normalizeSystemUpdateVersion(version),
+			c: &Container{
+				Version: normalizeSystemUpdateVersion(version),
+				Cfg:     cfg,
+				Log:     log,
+				Repo:    repos,
+			},
 	}
 	builder.startRealtimeServices()
 	builder.initProviderServices()

internal/service/strm_queue.go

@@ -610,11 +610,21 @@ func (s *StrmService) ClearCanceledDownloadTasks(ctx context.Context) (int64, er
 	return s.repo.StrmDownload.ClearCanceled(ctx)
 }
 
+// ClearFailedDownloadTasks 清空全部已失败的下载记录，返回删除数量。
+func (s *StrmService) ClearFailedDownloadTasks(ctx context.Context) (int64, error) {
+	return s.repo.StrmDownload.ClearFailed(ctx)
+}
+
 // ClearCanceledUploadTasks 清空全部已取消的上传记录，返回删除数量。
 func (s *StrmService) ClearCanceledUploadTasks(ctx context.Context) (int64, error) {
 	return s.repo.StrmUpload.ClearCanceled(ctx)
 }
 
+// ClearFailedUploadTasks 清空全部已失败的上传记录，返回删除数量。
+func (s *StrmService) ClearFailedUploadTasks(ctx context.Context) (int64, error) {
+	return s.repo.StrmUpload.ClearFailed(ctx)
+}
+
 // ClearDoneUploadTasks 清空全部已完成上传记录，返回删除数量。
 func (s *StrmService) ClearDoneUploadTasks(ctx context.Context) (int64, error) {
 	return s.repo.StrmUpload.ClearDone(ctx)

web/src/api/admin.ts

@@ -1,4 +1,4 @@
-import { api } from './client'
+import { api, MIGRATION_REQUEST_TIMEOUT } from './client'
 import type { AccessLog, Setting, User } from '../types'
 
 export interface DatabaseStatus {
@@ -137,8 +137,12 @@ export const adminAPI = {
 	  testDatabaseConnection: (payload: DatabaseConnectionPayload) =>
 	    api.post<PostgresTestResult>('/admin/database/test', payload).then((r) => r.data),
 
-	  migrateDatabase: (payload: DatabaseConnectionPayload) =>
-	    api.post<DatabaseMigrationResult>('/admin/database/migrate', payload).then((r) => r.data),
+  migrateDatabase: (payload: DatabaseConnectionPayload) =>
+    api
+      .post<DatabaseMigrationResult>('/admin/database/migrate', payload, {
+        timeout: MIGRATION_REQUEST_TIMEOUT,
+      })
+      .then((r) => r.data),
 
 	  saveDatabaseConfig: (payload: DatabaseConnectionPayload) =>
 	    api.post<{ message: string; type: string }>('/admin/database/save-config', payload).then((r) => r.data),

web/src/api/client.ts

@@ -12,6 +12,7 @@ export const api = axios.create({
 
 export const LONG_REQUEST_TIMEOUT = 120_000
 export const BATCH_REQUEST_TIMEOUT = 300_000
+export const MIGRATION_REQUEST_TIMEOUT = 600_000
 
 // Flag to prevent multiple simultaneous refresh attempts
 let isRefreshing = false

web/src/api/profile.ts

@@ -12,6 +12,12 @@ export const profileAPI = {
   }) =>
     api.patch<User>('/me', patch).then((r) => r.data),
 
+  getPinnedLibraries: () =>
+    api.get<{ library_ids: string[] }>('/me/pinned-libraries').then((r) => r.data.library_ids ?? []),
+
+  setPinnedLibraries: (libraryIds: string[]) =>
+    api.put<{ library_ids: string[] }>('/me/pinned-libraries', { library_ids: libraryIds }).then((r) => r.data.library_ids ?? []),
+
   adminUpdateRole: (id: string, role: 'admin' | 'user') =>
     api.patch<User>(`/admin/users/${id}/role`, { role }).then((r) => r.data),
 }

web/src/api/scraper.ts

@@ -39,6 +39,9 @@ export const scraperAPI = {
   clearCanceled: () =>
     api.post<{ deleted: number }>('/admin/scraper/queue/clear-canceled').then((r) => r.data),
 
+  clearFailed: () =>
+    api.post<{ deleted: number }>('/admin/scraper/queue/clear-failed').then((r) => r.data),
+
   retryFailed: () =>
     api.post<{ retried: number }>('/admin/scraper/queue/retry-failed').then((r) => r.data),
 

web/src/api/strm.ts

@@ -159,6 +159,9 @@ export const strmAPI = {
   clearCanceledDownloads: () =>
     api.post<{ deleted: number }>('/admin/strm/downloads/clear-canceled').then((r) => r.data),
 
+  clearFailedDownloads: () =>
+    api.post<{ deleted: number }>('/admin/strm/downloads/clear-failed').then((r) => r.data),
+
   retryFailedDownloads: () =>
     api.post<{ retried: number }>('/admin/strm/downloads/retry-failed').then((r) => r.data),
 
@@ -196,6 +199,9 @@ export const strmAPI = {
   clearCanceledUploads: () =>
     api.post<{ deleted: number }>('/admin/strm/uploads/clear-canceled').then((r) => r.data),
 
+  clearFailedUploads: () =>
+    api.post<{ deleted: number }>('/admin/strm/uploads/clear-failed').then((r) => r.data),
+
   retryFailedUploads: () =>
     api.post<{ retried: number }>('/admin/strm/uploads/retry-failed').then((r) => r.data),
 }

web/src/components/GlobalEvents.tsx

@@ -26,7 +26,7 @@ export function GlobalEvents() {
         return
       }
       if (p.queued) {
-        toast.loading(String(p.message ?? '云盘扫描已加入后台队列，会自动入库'), { id })
+        toast.loading(String(p.message ?? '媒体库扫描已加入后台队列，会自动入库'), { id })
         return
       }
       if (p.cloud && p.stage) {

web/src/components/LayoutHeaderSections.tsx

@@ -239,9 +239,16 @@ function LayoutHeaderSearch() {
                     </div>
 
                     <div className="min-w-0 flex-1">
-                      <p className="truncate text-xs font-bold text-[var(--app-text)] group-hover:text-brand-500">
-                        {item.title}
-                      </p>
+                      <div className="flex items-center gap-1.5">
+                        <p className="truncate text-xs font-bold text-[var(--app-text)] group-hover:text-brand-500">
+                          {item.title}
+                        </p>
+                        {(item.display_library_name || item.library_name) && (
+                          <span className="shrink-0 text-[9px] px-1.5 py-0.5 rounded bg-[var(--app-panel-elevated)] border border-[var(--app-border)] text-[var(--app-muted)] max-w-[130px] truncate">
+                            {item.display_library_name || item.library_name}
+                          </span>
+                        )}
+                      </div>
                       <div className="flex items-center gap-2 text-[10px] text-[var(--app-muted)] mt-0.5">
                         {item.year > 0 && <span>{item.year}</span>}
                         {item.rating > 0 && (

web/src/components/layoutNavigation.ts

@@ -43,9 +43,9 @@ export const LAYOUT_NAV_ITEMS: LayoutNavItem[] = [
   { to: '/queue', label: '任务队列', icon: ListChecks, adminOnly: true },
   { to: '/admin', label: '用户管理', icon: Users, adminOnly: true },
   { to: '/files', label: '文件管理', icon: FolderOpen, adminOnly: true },
-  { to: '/settings', label: '系统设置', icon: Settings, adminOnly: true },
   { to: '/emby-mount', label: 'Emby 挂载', icon: Tv, adminOnly: true },
   { to: '/strm', label: 'STRM 管理', icon: FileOutput, adminOnly: true },
+  { to: '/settings', label: '系统设置', icon: Settings, adminOnly: true },
 ]
 
 /** Media browsing links for the mobile drawer when browsing libraries. */

web/src/hooks/usePinnedLibraries.ts

@@ -0,0 +1,52 @@
+import { useCallback, useEffect, useState } from 'react'
+
+import {
+  loadPinnedLibraryIds,
+  savePinnedLibraryIds,
+  togglePinnedLibraryId,
+} from '../utils/pinnedLibraries'
+
+export function usePinnedLibraries() {
+  const [pinnedIds, setPinnedIds] = useState<string[]>([])
+  const [loading, setLoading] = useState(true)
+  const [syncing, setSyncing] = useState(false)
+
+  useEffect(() => {
+    let cancelled = false
+    setLoading(true)
+    loadPinnedLibraryIds()
+      .then((ids) => {
+        if (!cancelled) setPinnedIds(ids)
+      })
+      .catch(() => {
+        if (!cancelled) setPinnedIds([])
+      })
+      .finally(() => {
+        if (!cancelled) setLoading(false)
+      })
+    return () => {
+      cancelled = true
+    }
+  }, [])
+
+  const togglePin = useCallback(async (libraryId: string) => {
+    let previous: string[] = []
+    let optimistic: string[] = []
+    setPinnedIds((current) => {
+      previous = current
+      optimistic = togglePinnedLibraryId(current, libraryId)
+      return optimistic
+    })
+    setSyncing(true)
+    try {
+      const saved = await savePinnedLibraryIds(optimistic)
+      setPinnedIds(saved)
+    } catch {
+      setPinnedIds(previous)
+    } finally {
+      setSyncing(false)
+    }
+  }, [])
+
+  return { pinnedIds, loading, syncing, togglePin }
+}

web/src/pages/AboutSettingsPanel.tsx

@@ -0,0 +1,330 @@
+import { useEffect, useState } from 'react'
+import {
+  BookOpen,
+  Check,
+  Copy,
+  Cpu,
+  Database,
+  ExternalLink,
+  Film,
+  FolderOpen,
+  Github,
+  HardDrive,
+  Info,
+  Layers,
+  ListChecks,
+  MessageSquare,
+  Play,
+  Server,
+  Sparkles,
+  Tag,
+  Tv,
+  Users,
+} from 'lucide-react'
+import toast from 'react-hot-toast'
+
+import { systemAPI } from '../api/system'
+
+type SystemInfo = {
+  name: string
+  version: string
+  go: string
+  os: string
+  arch: string
+  data_dir: string
+  cache_dir: string
+}
+
+const GITHUB_REPO_URL = 'https://github.com/truewhile/MeBox'
+
+const MODULE_GUIDES = [
+  {
+    icon: Film,
+    title: '媒体库管理',
+    badge: '核心存储',
+    description:
+      '支持创建电影、电视剧、动漫、纪录片等多种类型媒体库。支持本地目录与网络挂载路径，集成文件监控（Inotify / 定时轮询），新增与修改文件自动入库。剧集支持智能按季、集归类与多版本合并。',
+  },
+  {
+    icon: Sparkles,
+    title: '智能刮削与元数据',
+    badge: '海报与信息',
+    description:
+      '内置 TMDb、Bangumi、TheTVDB、豆瓣等元数据源。入库时自动识别文件名匹配海报、背景图、演职员及中文简介。支持手动精确搜刮、重命名整理规则、识别词过滤（过滤广告词与压制组标签）及 NFO 本地文件导出。',
+  },
+  {
+    icon: Play,
+    title: '流媒体播放与转码',
+    badge: '播放引擎',
+    description:
+      '现代化 Web 播放器支持原画直连（Direct Play）与 HLS 实时兼容转码。支持 Intel QSV、NVIDIA NVENC、VAAPI 等硬件加速。支持内嵌与外挂字幕（ASS/SRT/VTT）渲染、多音轨切换，并支持一键调用 PotPlayer、VLC、IINA、Infuse 等本地播放器。',
+  },
+  {
+    icon: MessageSquare,
+    title: '实时弹幕系统',
+    badge: '弹幕互动',
+    description:
+      '播放时自动/手动匹配对应剧集的弹幕源。支持设置弹幕字号、滚动速度、透明度、屏幕占比限制（1/4屏、半屏、全屏）及防遮挡字幕开关，打造沉浸式的观影交流体验。',
+  },
+  {
+    icon: Tv,
+    title: 'Emby 挂载与远程同步',
+    badge: '扩展聚合',
+    description:
+      '支持以客户端形式直接挂载远程 Emby 媒体服务器，无需本地下载即可无缝串流播放远程资源，同时保留本地的刮削、播放历史、收藏与弹幕能力，实现多端影视资源大聚合。',
+  },
+  {
+    icon: Layers,
+    title: 'STRM 管理与云盘转存',
+    badge: '海量存储',
+    description:
+      '针对 115、阿里云盘、OpenList 等网盘挂载场景，提供批量的 STRM 索引文件生成与下载队列管理。本地仅占用微量磁盘空间，即可享受数百 TB 云端影视的高速直链秒播。',
+  },
+  {
+    icon: FolderOpen,
+    title: '内置文件管理器',
+    badge: '资源维护',
+    description:
+      '内置可视化文件浏览器，支持对本地媒体目录及云盘目录进行直接浏览、批量移动、重命名及删除操作，方便快速定位未刮削或命名不规范的文件并进行整理。',
+  },
+  {
+    icon: ListChecks,
+    title: '后台任务队列',
+    badge: '异步作业',
+    description:
+      '全生命周期监控媒体扫描、元数据批量刮削、STRM 生成及音视频探测等后台异步任务。实时展示队列进度百分比、执行状态及错误日志，支持手动重试与任务取消。',
+  },
+  {
+    icon: Users,
+    title: '多用户与权限体系',
+    badge: '安全访问',
+    description:
+      '支持管理员与普通用户角色。管理员可精细化控制各账号的访问边界，包括特定媒体库可见性（如敏感/Adult媒体库）、是否允许调用外部播放器、是否允许下载原始文件等。',
+  },
+  {
+    icon: Database,
+    title: '数据库与系统设置',
+    badge: '底层基建',
+    description:
+      '支持轻量级单文件 SQLite 与高并发 PostgreSQL 数据库，并提供一键平滑数据热迁移工具；支持自定义 HTTPS 证书绑定、转码缓存自动清理及实时系统资源监控。',
+  },
+]
+
+export function AboutSettingsPanel() {
+  const [info, setInfo] = useState<SystemInfo | null>(null)
+  const [loading, setLoading] = useState(true)
+  const [copied, setCopied] = useState(false)
+
+  useEffect(() => {
+    systemAPI
+      .info()
+      .then((res) => {
+        setInfo({
+          name: res.name || 'MeBox',
+          version: res.version || '0.1.0',
+          go: res.go || '',
+          os: res.os || '',
+          arch: res.arch || '',
+          data_dir: res.data_dir || '',
+          cache_dir: res.cache_dir || '',
+        })
+      })
+      .catch(() => {
+        setInfo({
+          name: 'MeBox',
+          version: '0.1.0',
+          go: '',
+          os: '',
+          arch: '',
+          data_dir: '',
+          cache_dir: '',
+        })
+      })
+      .finally(() => setLoading(false))
+  }, [])
+
+  const handleCopyGitURL = async () => {
+    try {
+      await navigator.clipboard.writeText(GITHUB_REPO_URL)
+      setCopied(true)
+      toast.success('GitHub 地址已复制到剪贴板')
+      setTimeout(() => setCopied(false), 2000)
+    } catch {
+      toast.error('复制失败，请手动复制')
+    }
+  }
+
+  return (
+    <div className="space-y-6">
+      {/* 顶部概览与项目卡片 */}
+      <div className="glass-panel overflow-hidden p-6 sm:p-8">
+        <div className="flex flex-col gap-6 lg:flex-row lg:items-center lg:justify-between">
+          <div className="space-y-3">
+            <div className="flex flex-wrap items-center gap-3">
+              <h2 className="font-display text-2xl sm:text-3xl font-bold text-ink-600">
+                MeBox 影音管理系统
+              </h2>
+              <span className="inline-flex items-center gap-1.5 rounded-full bg-brand-500/10 px-3 py-1 text-xs font-semibold text-brand-600 border border-brand-500/20">
+                <Tag size={13} />
+                {loading ? '加载中...' : `v${info?.version || '0.1.0'}`}
+              </span>
+            </div>
+            <p className="max-w-2xl text-sm leading-relaxed text-sand-600">
+              MeBox 是一款专为个人与家庭设计的现代化开源媒体库管理与流媒体点播系统。
+              集媒体资源归纳、智能多源刮削、弹幕交互、海量云盘 STRM 转存与多端播放于一体，让观影体验更轻快自由。
+            </p>
+          </div>
+
+          {/* 仓库链接操作区 */}
+          <div className="flex flex-wrap items-center gap-3">
+            <a
+              href={GITHUB_REPO_URL}
+              target="_blank"
+              rel="noreferrer"
+              className="inline-flex items-center gap-2 rounded-xl bg-ink-600 px-4 py-2.5 text-sm font-medium text-white shadow-sm transition hover:bg-ink-700 hover:shadow"
+            >
+              <Github size={16} />
+              <span>访问 GitHub 仓库</span>
+              <ExternalLink size={14} className="opacity-70" />
+            </a>
+            <button
+              type="button"
+              onClick={handleCopyGitURL}
+              className="inline-flex items-center gap-2 rounded-xl border border-gray-200 bg-white/80 px-4 py-2.5 text-sm font-medium text-ink-600 shadow-sm transition hover:bg-white hover:text-brand-600"
+            >
+              {copied ? <Check size={16} className="text-emerald-500" /> : <Copy size={16} />}
+              <span>{copied ? '已复制' : '复制地址'}</span>
+            </button>
+          </div>
+        </div>
+
+        {/* 运行环境规格栏 */}
+        <div className="mt-6 grid grid-cols-2 gap-3 sm:grid-cols-4 border-t border-gray-200/60 pt-6">
+          <div className="rounded-xl bg-sand-100/50 p-3.5">
+            <div className="flex items-center gap-1.5 text-xs text-sand-500">
+              <Tag size={13} />
+              <span>系统版本</span>
+            </div>
+            <p className="mt-1 font-mono text-sm font-semibold text-ink-600">
+              {loading ? '...' : info?.version || '0.1.0'}
+            </p>
+          </div>
+          <div className="rounded-xl bg-sand-100/50 p-3.5">
+            <div className="flex items-center gap-1.5 text-xs text-sand-500">
+              <Server size={13} />
+              <span>运行环境</span>
+            </div>
+            <p className="mt-1 font-mono text-sm font-semibold text-ink-600">
+              {loading ? '...' : `${info?.os || 'linux'} / ${info?.arch || 'amd64'}`}
+            </p>
+          </div>
+          <div className="rounded-xl bg-sand-100/50 p-3.5">
+            <div className="flex items-center gap-1.5 text-xs text-sand-500">
+              <Cpu size={13} />
+              <span>Go 运行时</span>
+            </div>
+            <p className="mt-1 font-mono text-sm font-semibold text-ink-600">
+              {loading ? '...' : info?.go || 'go1.x'}
+            </p>
+          </div>
+          <div className="rounded-xl bg-sand-100/50 p-3.5">
+            <div className="flex items-center gap-1.5 text-xs text-sand-500">
+              <HardDrive size={13} />
+              <span>数据目录</span>
+            </div>
+            <p className="mt-1 truncate font-mono text-xs font-semibold text-ink-600" title={info?.data_dir}>
+              {loading ? '...' : info?.data_dir || './data'}
+            </p>
+          </div>
+        </div>
+      </div>
+
+      {/* 快速入门与使用流程 */}
+      <div className="glass-panel p-6 sm:p-8 space-y-4">
+        <div className="flex items-center gap-2">
+          <BookOpen className="text-brand-500" size={20} />
+          <h3 className="font-display text-lg font-bold text-ink-600">使用说明与快速上手</h3>
+        </div>
+        <div className="grid gap-4 sm:grid-cols-3">
+          <div className="flex flex-col gap-2 rounded-2xl border border-gray-200/80 bg-white/60 p-4 shadow-sm">
+            <div className="flex items-center gap-2">
+              <span className="flex h-6 w-6 items-center justify-center rounded-full bg-brand-500 text-xs font-bold text-white">
+                1
+              </span>
+              <span className="font-semibold text-ink-600 text-sm">创建与关联媒体库</span>
+            </div>
+            <p className="text-xs leading-relaxed text-sand-500">
+              在侧边栏进入「媒体库」，点击添加媒体库。选择媒体类型（电影/电视剧），指定服务器上的实际媒体路径或挂载目录，保存后系统将自动创建索引并监控变动。
+            </p>
+          </div>
+
+          <div className="flex flex-col gap-2 rounded-2xl border border-gray-200/80 bg-white/60 p-4 shadow-sm">
+            <div className="flex items-center gap-2">
+              <span className="flex h-6 w-6 items-center justify-center rounded-full bg-brand-500 text-xs font-bold text-white">
+                2
+              </span>
+              <span className="font-semibold text-ink-600 text-sm">智能识别与刮削</span>
+            </div>
+            <p className="text-xs leading-relaxed text-sand-500">
+              扫描入库后，后台服务会自动提取文件名并通过 TMDb / 豆瓣 / Bangumi 等抓取高清海报、演职员与分集信息；如遇特殊命名，可在详情页中一键进行「手动搜刮」。
+            </p>
+          </div>
+
+          <div className="flex flex-col gap-2 rounded-2xl border border-gray-200/80 bg-white/60 p-4 shadow-sm">
+            <div className="flex items-center gap-2">
+              <span className="flex h-6 w-6 items-center justify-center rounded-full bg-brand-500 text-xs font-bold text-white">
+                3
+              </span>
+              <span className="font-semibold text-ink-600 text-sm">多端随心畅享观影</span>
+            </div>
+            <p className="text-xs leading-relaxed text-sand-500">
+              直接在浏览器中享受原画秒开与实时弹幕互动；对于高码率或特殊封装格式，支持开启 HLS 转码播放或直接一键唤醒本地 PotPlayer、Infuse 等外部播放器。
+            </p>
+          </div>
+        </div>
+      </div>
+
+      {/* 各功能模块详细使用说明 */}
+      <div className="space-y-4">
+        <div className="flex items-center justify-between px-1">
+          <div className="flex items-center gap-2">
+            <Info className="text-brand-500" size={20} />
+            <h3 className="font-display text-lg font-bold text-ink-600">各功能模块详细说明</h3>
+          </div>
+          <span className="text-xs text-sand-500">涵盖系统十大核心子系统</span>
+        </div>
+
+        <div className="grid gap-4 sm:grid-cols-2">
+          {MODULE_GUIDES.map((mod) => {
+            const Icon = mod.icon
+            return (
+              <div
+                key={mod.title}
+                className="group flex flex-col justify-between rounded-2xl border border-gray-200/90 bg-white/70 p-5 shadow-sm transition hover:border-brand-500/40 hover:bg-white hover:shadow-md"
+              >
+                <div className="space-y-2.5">
+                  <div className="flex items-center justify-between">
+                    <div className="flex items-center gap-2.5">
+                      <div className="flex h-9 w-9 items-center justify-center rounded-xl bg-brand-500/10 text-brand-500 transition group-hover:bg-brand-500 group-hover:text-white">
+                        <Icon size={18} />
+                      </div>
+                      <h4 className="font-semibold text-ink-600 text-sm sm:text-base">
+                        {mod.title}
+                      </h4>
+                    </div>
+                    <span className="rounded-md bg-sand-100 px-2 py-0.5 text-[11px] font-medium text-sand-600">
+                      {mod.badge}
+                    </span>
+                  </div>
+                  <p className="text-xs leading-relaxed text-sand-600 sm:text-[13px]">
+                    {mod.description}
+                  </p>
+                </div>
+              </div>
+            )
+          })}
+        </div>
+      </div>
+    </div>
+  )
+}

web/src/pages/HomePage.tsx

@@ -5,6 +5,8 @@ import { historyAPI } from '../api/history'
 import type { HistoryItem } from '../api/playback'
 import type { Library, Media } from '../types'
 import type { SeriesCard } from '../utils/groupSeries'
+import { usePinnedLibraries } from '../hooks/usePinnedLibraries'
+import { sortByPinnedIds } from '../utils/pinnedLibraries'
 import {
   ContinueWatchingSection,
   HomeCarouselSection,
@@ -22,6 +24,7 @@ export function HomePage() {
   const [libraryData, setLibraryData] = useState<Record<string, { cards: SeriesCard[]; items: Media[]; total: number }>>({})
   const [history, setHistory] = useState<HistoryItem[]>([])
   const [loading, setLoading] = useState(true)
+  const { pinnedIds } = usePinnedLibraries()
 
   useEffect(() => {
     let cancelled = false
@@ -126,6 +129,8 @@ export function HomePage() {
     return candidateMedia.slice(0, 10)
   }, [libraries, libraryData])
 
+  const sortedLibraries = useMemo(() => sortByPinnedIds(libraries, pinnedIds), [libraries, pinnedIds])
+
   const empty =
     !loading &&
     libraries.length === 0 &&
@@ -150,9 +155,9 @@ export function HomePage() {
       {history.length > 0 && <ContinueWatchingSection history={history} />}
 
       {/* 3. 媒体库卡片区 */}
-      {libraries.length > 0 && (
+      {sortedLibraries.length > 0 && (
         <HomeLibrariesSection
-          libraries={libraries}
+          libraries={sortedLibraries}
           libraryData={libraryData}
           libraryCounts={libraryCounts}
         />
@@ -160,7 +165,7 @@ export function HomePage() {
 
       {/* 4. 各媒体库内容展示行 */}
       <div className="space-y-10">
-        {libraries.map((lib) => {
+        {sortedLibraries.map((lib) => {
           const cards = libraryData[lib.id]?.cards || []
           if (cards.length === 0) return null
           return (

web/src/pages/LibrariesPage.tsx

@@ -3,17 +3,18 @@ import { useCallback, useEffect, useMemo, useState } from 'react'
 import { libraryAPI } from '../api/library'
 import { toolsAPI } from '../api/tools'
 import { openManageLibrariesDialog } from '../components/manageLibrariesDialog'
+import { usePinnedLibraries } from '../hooks/usePinnedLibraries'
 import {
   LibrariesContent,
   LibrariesEmptyState,
   LibrariesHeader,
 } from './LibrariesPageSections'
 import type { LibraryPreview } from './librariesPageModel'
-import { readPinnedLibraryIds, sortLibraryPreviews, togglePinnedLibraryId } from '../utils/pinnedLibraries'
+import { sortLibraryPreviews } from '../utils/pinnedLibraries'
 
 export function LibrariesPage() {
   const [previews, setPreviews] = useState<LibraryPreview[]>([])
-  const [pinnedIds, setPinnedIds] = useState<string[]>(() => readPinnedLibraryIds())
+  const { pinnedIds, loading: pinnedLoading, togglePin } = usePinnedLibraries()
   const [loading, setLoading] = useState(true)
   const [repairing, setRepairing] = useState(false)
   const [repairEpisodeArtwork, setRepairEpisodeArtwork] = useState(false)
@@ -62,12 +63,12 @@ export function LibrariesPage() {
   const sortedPreviews = useMemo(() => sortLibraryPreviews(previews, pinnedIds), [previews, pinnedIds])
 
   const handleTogglePin = useCallback((libraryId: string) => {
-    setPinnedIds(togglePinnedLibraryId(libraryId))
-  }, [])
+    void togglePin(libraryId)
+  }, [togglePin])
 
   const total = useMemo(() => previews.reduce((sum, preview) => sum + preview.total, 0), [previews])
 
-  if (loading) {
+  if (loading || pinnedLoading) {
     return <p className="px-2 py-8 text-sm text-sand-500">媒体库加载中…</p>
   }
 

web/src/pages/MediaDetailPage.tsx

@@ -9,6 +9,7 @@ import {
   MediaDetailMainContent,
   MediaDetailMissing,
 } from './MediaDetailPageSections'
+import { LibrarySeriesEpisodes } from './LibrarySeriesEpisodes'
 import { useMediaDetailPageState } from './useMediaDetailPageState'
 
 export function MediaDetailPage() {
@@ -31,6 +32,7 @@ export function MediaDetailPage() {
         media={media}
         isAdmin={role === 'admin'}
         favourite={detail.favourite}
+        playTargetId={detail.firstPlayableEpisode?.id}
         scrapeEpisodeArtwork={detail.scrapeEpisodeArtwork}
         onToggleFavourite={detail.toggleFavourite}
         onScrapeEpisodeArtworkChange={detail.setScrapeEpisodeArtwork}
@@ -42,6 +44,21 @@ export function MediaDetailPage() {
         onExportNFO={detail.exportNFO}
         onSoftDelete={detail.softDelete}
       />
+
+      {detail.hasEpisodes && (
+        <div className="relative z-10 px-6 pb-8 sm:px-10 space-y-6">
+          <div className="divider border-gray-200/60" />
+          <LibrarySeriesEpisodes
+            loading={detail.loadingEpisodes}
+            selectedEpisodes={detail.seasonGroups}
+            selectedSeason={detail.selectedSeason}
+            visibleEpisodes={detail.visibleEpisodes}
+            playbackFrom={`/media/${media.id}`}
+            onSeasonChange={detail.setSelectedSeason}
+          />
+        </div>
+      )}
+
       <MediaDetailDialogs
         media={media}
         manualScrapeOpen={detail.manualScrapeOpen}

web/src/pages/MediaDetailPageModel.ts

@@ -1,13 +1,11 @@
 import type { Media } from '../types'
-import { mediaLibraryTarget } from '../utils/mediaNavigation'
 
 export function mediaLibraryBackTarget(media: Media): string {
-  const seriesTarget = mediaLibraryTarget(media)
-  if (seriesTarget) return seriesTarget
-
   const libraryID = media.display_library_id || media.library_id
-  if (!libraryID) return ''
-  return `/library/${encodeURIComponent(libraryID)}`
+  if (libraryID) {
+    return `/library/${encodeURIComponent(libraryID)}`
+  }
+  return '/libraries'
 }
 
 export function mediaDetailScrapeMediaType(media: Media): string | undefined {

web/src/pages/MediaDetailPageSections.tsx

@@ -18,6 +18,7 @@ interface MediaDetailPlaybackActionsProps {
   media: Media
   favourite: boolean
   onToggleFavourite: () => void
+  playTargetId?: string
 }
 
 interface MediaDetailMainContentProps extends MediaDetailPlaybackActionsProps {
@@ -93,17 +94,19 @@ export function MediaDetailPlaybackActions({
   media,
   favourite,
   onToggleFavourite,
+  playTargetId,
 }: MediaDetailPlaybackActionsProps) {
+  const targetId = playTargetId || media.id
   return (
     <div className="flex flex-wrap gap-3">
-      <Link to={`/play/${media.id}`} state={{ from: `/media/${media.id}` }} className="btn-primary px-6 py-3.5 shadow-sm">
+      <Link to={`/play/${targetId}`} state={{ from: `/media/${media.id}` }} className="btn-primary px-6 py-3.5 shadow-sm">
         <Play size={16} fill="currentColor" />
         <span>立即播放</span>
       </Link>
 
       {!isDirectStreamMedia(media) && (
         <Link
-        to={`/play/${media.id}?mode=hls`}
+        to={`/play/${targetId}?mode=hls`}
         state={{ from: `/media/${media.id}` }}
         className="btn-outline border-brand-500/30 hover:border-brand-500 text-[#c9954a] hover:bg-brand-50 px-5"
       >
@@ -112,7 +115,7 @@ export function MediaDetailPlaybackActions({
         </Link>
       )}
 
-      <ExternalPlayerButton mediaId={media.id} />
+      <ExternalPlayerButton mediaId={targetId} />
 
       <button
         onClick={onToggleFavourite}
@@ -134,6 +137,7 @@ export function MediaDetailMainContent({
   media,
   isAdmin,
   favourite,
+  playTargetId,
   scrapeEpisodeArtwork,
   onToggleFavourite,
   onScrapeEpisodeArtworkChange,
@@ -153,7 +157,12 @@ export function MediaDetailMainContent({
         <MediaDetailMetadata media={media} />
         <div className="divider border-gray-200/60" />
         <div className="flex flex-col gap-5">
-          <MediaDetailPlaybackActions media={media} favourite={favourite} onToggleFavourite={onToggleFavourite} />
+          <MediaDetailPlaybackActions
+            media={media}
+            favourite={favourite}
+            onToggleFavourite={onToggleFavourite}
+            playTargetId={playTargetId}
+          />
           {isAdmin && (
             <MediaDetailAdminPanel
               media={media}

web/src/pages/ScraperQueuePage.tsx

@@ -227,8 +227,13 @@ export function ScraperQueuePage({ embedded = false }: { embedded?: boolean }) {
   }, [tasks, filter, search])
 
   const counts = snapshot?.counts
-  const activeTaskCount = (counts?.pending ?? 0) + (counts?.running ?? 0)
+  const pendingCount = counts?.pending ?? 0
+  const runningCount = counts?.running ?? 0
+  const activeTaskCount = pendingCount + runningCount
+  const doneCount = counts?.done ?? 0
   const failedCount = counts?.failed ?? 0
+  const canceledCount = counts?.canceled ?? 0
+  const finishedCount = doneCount + failedCount + canceledCount
   const allCurrentChecked =
     filteredTasks.length > 0 && filteredTasks.every((t) => selectedIds.has(t.id))
 
@@ -450,7 +455,7 @@ export function ScraperQueuePage({ embedded = false }: { embedded?: boolean }) {
           )}
         </div>
 
-        {selectedIds.size > 0 && (
+        {selectedIds.size > 0 ? (
           <div className="flex flex-wrap items-center gap-2 rounded-xl border border-brand-500/30 bg-primary-400/10 px-3 py-2 text-xs animate-in fade-in zoom-in-95">
             <span className="font-bold text-brand-500">已选中 {selectedIds.size} 项</span>
             <div className="h-3.5 w-px bg-brand-300/40 mx-1" />
@@ -490,6 +495,193 @@ export function ScraperQueuePage({ embedded = false }: { embedded?: boolean }) {
               <X size={13} />
             </button>
           </div>
+        ) : (
+          <div className="flex flex-wrap items-center gap-2">
+            {/* 当前状态专属快捷批量按钮 */}
+            {filter === 'all' && (
+              <>
+                {failedCount > 0 && (
+                  <button
+                    type="button"
+                    disabled={batchBusy}
+                    onClick={() => runGlobalBatch(() => scraperAPI.retryFailed(), '确定重新入队所有失败任务？')}
+                    className="inline-flex items-center gap-1 rounded-xl border border-brand-500/40 bg-white px-3 py-1.5 text-xs font-semibold text-brand-500 hover:bg-brand-50 disabled:opacity-50"
+                  >
+                    <RefreshCw size={12} />
+                    全部重试 ({failedCount})
+                  </button>
+                )}
+                {activeTaskCount > 0 && (
+                  <button
+                    type="button"
+                    disabled={batchBusy}
+                    onClick={() => runGlobalBatch(() => scraperAPI.cancelPending(), '确定取消所有排队及进行中的刮削任务？')}
+                    className="inline-flex items-center gap-1 rounded-xl border border-amber-300 bg-white px-3 py-1.5 text-xs font-semibold text-amber-600 hover:bg-amber-50 disabled:opacity-50"
+                  >
+                    <Ban size={12} />
+                    全部取消 ({activeTaskCount})
+                  </button>
+                )}
+                {finishedCount > 0 && (
+                  <button
+                    type="button"
+                    disabled={batchBusy}
+                    onClick={() => runGlobalBatch(() => scraperAPI.clearFinished(), '确定清空所有已完成、失败及取消的历史记录？')}
+                    className="inline-flex items-center gap-1 rounded-xl border border-rose-300 bg-white px-3 py-1.5 text-xs font-semibold text-rose-600 hover:bg-rose-50 disabled:opacity-50"
+                  >
+                    <Trash2 size={12} />
+                    全部删除 ({finishedCount})
+                  </button>
+                )}
+              </>
+            )}
+
+            {(filter === 'pending' || filter === 'running') && (
+              <button
+                type="button"
+                disabled={batchBusy || activeTaskCount === 0}
+                onClick={() => runGlobalBatch(() => scraperAPI.cancelPending(), '确定取消所有排队及进行中的刮削任务？')}
+                className="inline-flex items-center gap-1 rounded-xl border border-amber-300 bg-white px-3 py-1.5 text-xs font-semibold text-amber-600 hover:bg-amber-50 disabled:opacity-50"
+              >
+                <Ban size={12} />
+                全部取消{activeTaskCount > 0 ? ` (${activeTaskCount})` : ''}
+              </button>
+            )}
+
+            {filter === 'done' && (
+              <button
+                type="button"
+                disabled={batchBusy || doneCount === 0}
+                onClick={() => runGlobalBatch(() => scraperAPI.clearDone(), '确定清空所有已匹配完成的记录？')}
+                className="inline-flex items-center gap-1 rounded-xl border border-rose-300 bg-white px-3 py-1.5 text-xs font-semibold text-rose-600 hover:bg-rose-50 disabled:opacity-50"
+              >
+                <Trash2 size={12} />
+                全部删除{doneCount > 0 ? ` (${doneCount})` : ''}
+              </button>
+            )}
+
+            {filter === 'failed' && (
+              <>
+                <button
+                  type="button"
+                  disabled={batchBusy || failedCount === 0}
+                  onClick={() => runGlobalBatch(() => scraperAPI.retryFailed(), '确定重新入队所有失败任务？')}
+                  className="inline-flex items-center gap-1 rounded-xl border border-brand-500/40 bg-white px-3 py-1.5 text-xs font-semibold text-brand-500 hover:bg-brand-50 disabled:opacity-50"
+                >
+                  <RefreshCw size={12} />
+                  全部重试{failedCount > 0 ? ` (${failedCount})` : ''}
+                </button>
+                <button
+                  type="button"
+                  disabled={batchBusy || failedCount === 0}
+                  onClick={() => runGlobalBatch(() => scraperAPI.clearFailed(), '确定清空所有失败记录？')}
+                  className="inline-flex items-center gap-1 rounded-xl border border-rose-300 bg-white px-3 py-1.5 text-xs font-semibold text-rose-600 hover:bg-rose-50 disabled:opacity-50"
+                >
+                  <Trash2 size={12} />
+                  全部删除{failedCount > 0 ? ` (${failedCount})` : ''}
+                </button>
+              </>
+            )}
+
+            {filter === 'canceled' && (
+              <button
+                type="button"
+                disabled={batchBusy || canceledCount === 0}
+                onClick={() => runGlobalBatch(() => scraperAPI.clearCanceled(), '确定清空所有已取消的任务记录？')}
+                className="inline-flex items-center gap-1 rounded-xl border border-rose-300 bg-white px-3 py-1.5 text-xs font-semibold text-rose-600 hover:bg-rose-50 disabled:opacity-50"
+              >
+                <Trash2 size={12} />
+                全部删除{canceledCount > 0 ? ` (${canceledCount})` : ''}
+              </button>
+            )}
+
+            {/* 下拉批量操作菜单：随时可做任意全局操作 */}
+            <details className="relative inline-block">
+              <summary className="inline-flex cursor-pointer list-none items-center gap-1.5 rounded-xl border border-gray-200 bg-white px-3 py-1.5 text-xs font-semibold text-ink-100 shadow-sm transition hover:border-gray-300 hover:bg-gray-50 [&::-webkit-details-marker]:hidden">
+                <Trash2 size={12} className="text-sand-500" />
+                <span>批量清理</span>
+              </summary>
+              <div className="absolute right-0 top-9 z-30 min-w-44 rounded-xl border border-gray-200 bg-white p-1.5 shadow-xl backdrop-blur">
+                {failedCount > 0 && (
+                  <button
+                    type="button"
+                    disabled={batchBusy}
+                    onClick={(e) => {
+                      e.currentTarget.closest('details')?.removeAttribute('open')
+                      runGlobalBatch(() => scraperAPI.retryFailed(), '确定重新入队所有失败任务？')
+                    }}
+                    className="flex w-full items-center gap-2 rounded-lg px-2.5 py-2 text-left text-xs font-medium text-brand-500 hover:bg-brand-50"
+                  >
+                    <RefreshCw size={13} />
+                    <span>重试所有失败 ({failedCount})</span>
+                  </button>
+                )}
+                {activeTaskCount > 0 && (
+                  <button
+                    type="button"
+                    disabled={batchBusy}
+                    onClick={(e) => {
+                      e.currentTarget.closest('details')?.removeAttribute('open')
+                      runGlobalBatch(() => scraperAPI.cancelPending(), '确定取消所有排队及进行中的刮削任务？')
+                    }}
+                    className="flex w-full items-center gap-2 rounded-lg px-2.5 py-2 text-left text-xs font-medium text-amber-600 hover:bg-amber-50"
+                  >
+                    <Ban size={13} />
+                    <span>取消所有进行中 ({activeTaskCount})</span>
+                  </button>
+                )}
+                <div className="my-1 border-t border-gray-100" />
+                <button
+                  type="button"
+                  disabled={batchBusy}
+                  onClick={(e) => {
+                    e.currentTarget.closest('details')?.removeAttribute('open')
+                    runGlobalBatch(() => scraperAPI.clearDone(), '确定清空所有已匹配完成的记录？')
+                  }}
+                  className="flex w-full items-center gap-2 rounded-lg px-2.5 py-2 text-left text-xs font-medium text-ink-100 hover:bg-gray-50"
+                >
+                  <CheckCircle2 size={13} className="text-emerald-500" />
+                  <span>清空已完成记录 ({doneCount})</span>
+                </button>
+                <button
+                  type="button"
+                  disabled={batchBusy}
+                  onClick={(e) => {
+                    e.currentTarget.closest('details')?.removeAttribute('open')
+                    runGlobalBatch(() => scraperAPI.clearFailed(), '确定清空所有失败的记录？')
+                  }}
+                  className="flex w-full items-center gap-2 rounded-lg px-2.5 py-2 text-left text-xs font-medium text-rose-500 hover:bg-rose-50"
+                >
+                  <AlertCircle size={13} />
+                  <span>清空失败记录 ({failedCount})</span>
+                </button>
+                <button
+                  type="button"
+                  disabled={batchBusy}
+                  onClick={(e) => {
+                    e.currentTarget.closest('details')?.removeAttribute('open')
+                    runGlobalBatch(() => scraperAPI.clearCanceled(), '确定清空所有已取消的任务记录？')
+                  }}
+                  className="flex w-full items-center gap-2 rounded-lg px-2.5 py-2 text-left text-xs font-medium text-ink-100 hover:bg-gray-50"
+                >
+                  <Ban size={13} className="text-amber-500" />
+                  <span>清空已取消记录 ({canceledCount})</span>
+                </button>
+                <button
+                  type="button"
+                  disabled={batchBusy}
+                  onClick={(e) => {
+                    e.currentTarget.closest('details')?.removeAttribute('open')
+                    runGlobalBatch(() => scraperAPI.clearFinished(), '确定清空所有已完成、失败及取消的历史记录？')
+                  }}
+                  className="flex w-full items-center gap-2 rounded-lg px-2.5 py-2 text-left text-xs font-medium text-rose-500 hover:bg-rose-50"
+                >
+                  <Trash2 size={13} />
+                  <span>清空全部历史记录 ({finishedCount})</span>
+                </button>
+              </div>
+            </details>
+          </div>
         )}
       </div>
 

web/src/pages/SettingsPage.tsx

@@ -8,6 +8,7 @@ import { libraryAPI } from '../api/library'
 import type { Library, Setting } from '../types'
 import { APIConfigsPanel } from '../components/APIConfigsPanel'
 import { FFToolsPanel } from '../components/FFToolsPanel'
+import { AboutSettingsPanel } from './AboutSettingsPanel'
 import { AdultSettingsPanel } from './AdultSettingsPanel'
 import { DatabaseSettingsPanel } from './DatabaseSettingsPanel'
 import { RecognitionWordsPanel } from './RecognitionWordsPanel'
@@ -174,6 +175,7 @@ export function SettingsPage() {
           {group.key === 'recognition-words' && <RecognitionWordsPanel />}
           {group.key === 'adult' && <AdultSettingsPanel />}
           {group.key === 'general' && <FFToolsPanel onInstalled={() => refresh().catch(() => undefined)} />}
+          {group.key === 'about' && <AboutSettingsPanel />}
           {group.key !== 'adult' && group.key !== 'library' && group.items.length > 0 && (
             <form onSubmit={onSave} className="glass-panel space-y-4">
               {group.description && <p className="text-xs text-sand-500">{group.description}</p>}

web/src/pages/StrmQueuePage.tsx

@@ -224,8 +224,13 @@ export function StrmQueuePanel({
   }, [tasks, filter, search])
 
   const counts = snapshot?.counts
-  const activeTaskCount = (counts?.pending ?? 0) + (counts?.running ?? 0)
+  const pendingCount = counts?.pending ?? 0
+  const runningCount = counts?.running ?? 0
+  const activeTaskCount = pendingCount + runningCount
+  const doneCount = counts?.done ?? 0
   const failedCount = counts?.failed ?? 0
+  const canceledCount = counts?.canceled ?? 0
+  const finishedCount = doneCount + failedCount + canceledCount
   const allCurrentChecked =
     filteredTasks.length > 0 && filteredTasks.every((t) => selectedIds.has(t.id))
 
@@ -475,8 +480,8 @@ export function StrmQueuePanel({
           )}
         </div>
 
-        {/* Selected Batch Toolbar */}
-        {selectedIds.size > 0 && (
+        {/* Batch Actions Toolbar */}
+        {selectedIds.size > 0 ? (
           <div className="flex flex-wrap items-center gap-2 rounded-xl border border-brand-500/30 bg-primary-400/10 px-3 py-2 text-xs animate-in fade-in zoom-in-95">
             <span className="font-bold text-brand-500">已选中 {selectedIds.size} 项</span>
             <div className="h-3.5 w-px bg-brand-300/40 mx-1" />
@@ -516,6 +521,251 @@ export function StrmQueuePanel({
               <X size={13} />
             </button>
           </div>
+        ) : (
+          <div className="flex flex-wrap items-center gap-2">
+            {/* 当前状态专属快捷批量按钮 */}
+            {filter === 'all' && (
+              <>
+                {failedCount > 0 && (
+                  <button
+                    type="button"
+                    disabled={batchBusy}
+                    onClick={() =>
+                      runGlobalBatch(
+                        () => (isDownload ? strmAPI.retryFailedDownloads() : strmAPI.retryFailedUploads()),
+                        '确定重新入队所有失败任务？',
+                      )
+                    }
+                    className="inline-flex items-center gap-1 rounded-xl border border-brand-500/40 bg-white px-3 py-1.5 text-xs font-semibold text-brand-500 hover:bg-brand-50 disabled:opacity-50"
+                  >
+                    <RefreshCw size={12} />
+                    全部重试 ({failedCount})
+                  </button>
+                )}
+                {activeTaskCount > 0 && (
+                  <button
+                    type="button"
+                    disabled={batchBusy}
+                    onClick={() =>
+                      runGlobalBatch(
+                        () => (isDownload ? strmAPI.cancelPendingDownloads() : strmAPI.cancelPendingUploads()),
+                        '确定取消所有排队及进行中的任务？',
+                      )
+                    }
+                    className="inline-flex items-center gap-1 rounded-xl border border-amber-300 bg-white px-3 py-1.5 text-xs font-semibold text-amber-600 hover:bg-amber-50 disabled:opacity-50"
+                  >
+                    <Ban size={12} />
+                    全部取消 ({activeTaskCount})
+                  </button>
+                )}
+                {finishedCount > 0 && (
+                  <button
+                    type="button"
+                    disabled={batchBusy}
+                    onClick={() =>
+                      runGlobalBatch(
+                        () => (isDownload ? strmAPI.clearFinishedDownloads() : strmAPI.clearFinishedUploads()),
+                        '确定清空所有已完成、失败及取消的历史记录？',
+                      )
+                    }
+                    className="inline-flex items-center gap-1 rounded-xl border border-rose-300 bg-white px-3 py-1.5 text-xs font-semibold text-rose-600 hover:bg-rose-50 disabled:opacity-50"
+                  >
+                    <Trash2 size={12} />
+                    全部删除 ({finishedCount})
+                  </button>
+                )}
+              </>
+            )}
+
+            {(filter === 'pending' || filter === 'running') && (
+              <button
+                type="button"
+                disabled={batchBusy || activeTaskCount === 0}
+                onClick={() =>
+                  runGlobalBatch(
+                    () => (isDownload ? strmAPI.cancelPendingDownloads() : strmAPI.cancelPendingUploads()),
+                    '确定取消所有排队及进行中的任务？',
+                  )
+                }
+                className="inline-flex items-center gap-1 rounded-xl border border-amber-300 bg-white px-3 py-1.5 text-xs font-semibold text-amber-600 hover:bg-amber-50 disabled:opacity-50"
+              >
+                <Ban size={12} />
+                全部取消{activeTaskCount > 0 ? ` (${activeTaskCount})` : ''}
+              </button>
+            )}
+
+            {filter === 'done' && (
+              <button
+                type="button"
+                disabled={batchBusy || doneCount === 0}
+                onClick={() =>
+                  runGlobalBatch(
+                    () => (isDownload ? strmAPI.clearDoneDownloads() : strmAPI.clearDoneUploads()),
+                    '确定清空所有已完成记录？',
+                  )
+                }
+                className="inline-flex items-center gap-1 rounded-xl border border-rose-300 bg-white px-3 py-1.5 text-xs font-semibold text-rose-600 hover:bg-rose-50 disabled:opacity-50"
+              >
+                <Trash2 size={12} />
+                全部删除{doneCount > 0 ? ` (${doneCount})` : ''}
+              </button>
+            )}
+
+            {filter === 'failed' && (
+              <>
+                <button
+                  type="button"
+                  disabled={batchBusy || failedCount === 0}
+                  onClick={() =>
+                    runGlobalBatch(
+                      () => (isDownload ? strmAPI.retryFailedDownloads() : strmAPI.retryFailedUploads()),
+                      '确定重新入队所有失败任务？',
+                    )
+                  }
+                  className="inline-flex items-center gap-1 rounded-xl border border-brand-500/40 bg-white px-3 py-1.5 text-xs font-semibold text-brand-500 hover:bg-brand-50 disabled:opacity-50"
+                >
+                  <RefreshCw size={12} />
+                  全部重试{failedCount > 0 ? ` (${failedCount})` : ''}
+                </button>
+                <button
+                  type="button"
+                  disabled={batchBusy || failedCount === 0}
+                  onClick={() =>
+                    runGlobalBatch(
+                      () => (isDownload ? strmAPI.clearFailedDownloads() : strmAPI.clearFailedUploads()),
+                      '确定清空所有失败记录？',
+                    )
+                  }
+                  className="inline-flex items-center gap-1 rounded-xl border border-rose-300 bg-white px-3 py-1.5 text-xs font-semibold text-rose-600 hover:bg-rose-50 disabled:opacity-50"
+                >
+                  <Trash2 size={12} />
+                  全部删除{failedCount > 0 ? ` (${failedCount})` : ''}
+                </button>
+              </>
+            )}
+
+            {filter === 'canceled' && (
+              <button
+                type="button"
+                disabled={batchBusy || canceledCount === 0}
+                onClick={() =>
+                  runGlobalBatch(
+                    () => (isDownload ? strmAPI.clearCanceledDownloads() : strmAPI.clearCanceledUploads()),
+                    '确定清空所有已取消的任务记录？',
+                  )
+                }
+                className="inline-flex items-center gap-1 rounded-xl border border-rose-300 bg-white px-3 py-1.5 text-xs font-semibold text-rose-600 hover:bg-rose-50 disabled:opacity-50"
+              >
+                <Trash2 size={12} />
+                全部删除{canceledCount > 0 ? ` (${canceledCount})` : ''}
+              </button>
+            )}
+
+            {/* 下拉批量操作菜单：随时可做任意全局操作 */}
+            <details className="relative inline-block">
+              <summary className="inline-flex cursor-pointer list-none items-center gap-1.5 rounded-xl border border-gray-200 bg-white px-3 py-1.5 text-xs font-semibold text-ink-100 shadow-sm transition hover:border-gray-300 hover:bg-gray-50 [&::-webkit-details-marker]:hidden">
+                <Trash2 size={12} className="text-sand-500" />
+                <span>批量清理</span>
+              </summary>
+              <div className="absolute right-0 top-9 z-30 min-w-44 rounded-xl border border-gray-200 bg-white p-1.5 shadow-xl backdrop-blur">
+                {failedCount > 0 && (
+                  <button
+                    type="button"
+                    disabled={batchBusy}
+                    onClick={(e) => {
+                      e.currentTarget.closest('details')?.removeAttribute('open')
+                      runGlobalBatch(
+                        () => (isDownload ? strmAPI.retryFailedDownloads() : strmAPI.retryFailedUploads()),
+                        '确定重新入队所有失败任务？',
+                      )
+                    }}
+                    className="flex w-full items-center gap-2 rounded-lg px-2.5 py-2 text-left text-xs font-medium text-brand-500 hover:bg-brand-50"
+                  >
+                    <RefreshCw size={13} />
+                    <span>重试所有失败 ({failedCount})</span>
+                  </button>
+                )}
+                {activeTaskCount > 0 && (
+                  <button
+                    type="button"
+                    disabled={batchBusy}
+                    onClick={(e) => {
+                      e.currentTarget.closest('details')?.removeAttribute('open')
+                      runGlobalBatch(
+                        () => (isDownload ? strmAPI.cancelPendingDownloads() : strmAPI.cancelPendingUploads()),
+                        '确定取消所有排队及进行中的任务？',
+                      )
+                    }}
+                    className="flex w-full items-center gap-2 rounded-lg px-2.5 py-2 text-left text-xs font-medium text-amber-600 hover:bg-amber-50"
+                  >
+                    <Ban size={13} />
+                    <span>取消所有进行中 ({activeTaskCount})</span>
+                  </button>
+                )}
+                <div className="my-1 border-t border-gray-100" />
+                <button
+                  type="button"
+                  disabled={batchBusy}
+                  onClick={(e) => {
+                    e.currentTarget.closest('details')?.removeAttribute('open')
+                    runGlobalBatch(
+                      () => (isDownload ? strmAPI.clearDoneDownloads() : strmAPI.clearDoneUploads()),
+                      '确定清空所有已完成记录？',
+                    )
+                  }}
+                  className="flex w-full items-center gap-2 rounded-lg px-2.5 py-2 text-left text-xs font-medium text-ink-100 hover:bg-gray-50"
+                >
+                  <CheckCircle2 size={13} className="text-emerald-500" />
+                  <span>清空已完成记录 ({doneCount})</span>
+                </button>
+                <button
+                  type="button"
+                  disabled={batchBusy}
+                  onClick={(e) => {
+                    e.currentTarget.closest('details')?.removeAttribute('open')
+                    runGlobalBatch(
+                      () => (isDownload ? strmAPI.clearFailedDownloads() : strmAPI.clearFailedUploads()),
+                      '确定清空所有失败记录？',
+                    )
+                  }}
+                  className="flex w-full items-center gap-2 rounded-lg px-2.5 py-2 text-left text-xs font-medium text-rose-500 hover:bg-rose-50"
+                >
+                  <AlertCircle size={13} />
+                  <span>清空失败记录 ({failedCount})</span>
+                </button>
+                <button
+                  type="button"
+                  disabled={batchBusy}
+                  onClick={(e) => {
+                    e.currentTarget.closest('details')?.removeAttribute('open')
+                    runGlobalBatch(
+                      () => (isDownload ? strmAPI.clearCanceledDownloads() : strmAPI.clearCanceledUploads()),
+                      '确定清空所有已取消的任务记录？',
+                    )
+                  }}
+                  className="flex w-full items-center gap-2 rounded-lg px-2.5 py-2 text-left text-xs font-medium text-ink-100 hover:bg-gray-50"
+                >
+                  <Ban size={13} className="text-amber-500" />
+                  <span>清空已取消记录 ({canceledCount})</span>
+                </button>
+                <button
+                  type="button"
+                  disabled={batchBusy}
+                  onClick={(e) => {
+                    e.currentTarget.closest('details')?.removeAttribute('open')
+                    runGlobalBatch(
+                      () => (isDownload ? strmAPI.clearFinishedDownloads() : strmAPI.clearFinishedUploads()),
+                      '确定清空所有已完成、失败及取消的历史记录？',
+                    )
+                  }}
+                  className="flex w-full items-center gap-2 rounded-lg px-2.5 py-2 text-left text-xs font-medium text-rose-500 hover:bg-rose-50"
+                >
+                  <Trash2 size={13} />
+                  <span>清空全部历史记录 ({finishedCount})</span>
+                </button>
+              </div>
+            </details>
+          </div>
         )}
       </div>
 

web/src/pages/settingsGroups.ts

@@ -14,6 +14,13 @@ export const databaseSettingsGroup: SettingGroup = {
   items: [],
 }
 
+export const aboutSettingsGroup: SettingGroup = {
+  key: 'about',
+  label: '关于',
+  description: '项目信息、版本信息与使用指南',
+  items: [],
+}
+
 export const GROUPS: SettingGroup[] = [
   generalSettingsGroup,
   databaseSettingsGroup,
@@ -21,6 +28,7 @@ export const GROUPS: SettingGroup[] = [
   recognitionWordsSettingsGroup,
   danmakuSettingsGroup,
   adultSettingsGroup,
+  aboutSettingsGroup,
 ]
 
 export const ALL_KEYS = new Set(GROUPS.flatMap((group) => group.items.map((item) => item.key)))

web/src/pages/useAdminLibraryPanel.ts

@@ -163,8 +163,8 @@ function useEditableLibraryRootActions(refresh: () => Promise<void>, drafts: Edi
 function useLibraryActions(refresh: () => Promise<void>) {
   const scanLibrary = async (library: Library) => {
     const result = await libraryAPI.scan(library.id)
-    if (result.queued) toast.success('云盘扫描已加入后台队列，会自动入库')
-    else toast.success(`扫描完成，新增 ${result.added}，更新 ${result.updated ?? 0}`)
+    if (result.queued) toast.success(result.message || '媒体库扫描已加入后台队列，会自动入库')
+    else toast.success(`扫描完成，新增 ${result.added ?? 0}，更新 ${result.updated ?? 0}`)
   }
 
   const toggleCarouselLibrary = async (library: Library) => {

web/src/pages/useLibraryScanStatus.ts

@@ -40,6 +40,13 @@ export function useLibraryScanStatus({
       setScanProgress(String(event.message ?? '扫描已排队，后台会自动入库'))
       return
     }
+    if (typeof event.visited === 'number' && !event.finished) {
+      setScanning(true)
+      const added = Number(event.added ?? 0)
+      const updated = Number(event.updated ?? 0)
+      setScanProgress(`正在扫描：已扫描 ${event.visited} 项 · 新增 ${added} · 更新 ${updated}`)
+      return
+    }
   }, [isAdmin, libraryID, onLibraryChanged])
 
   useWebSocket(onRealtimeEvent)
@@ -49,13 +56,19 @@ export function useLibraryScanStatus({
     setScanProgress('正在提交扫描任务…')
     try {
       const result = await libraryAPI.scan(libraryID)
-      toast.success(`扫描完成:新增 ${result.added} 项，更新 ${result.updated ?? 0} 项`)
-      setScanProgress(`扫描完成：新增 ${result.added} · 更新 ${result.updated ?? 0}`)
+      if (result.queued) {
+        const msg = result.message || '扫描任务已在后台启动，正在扫描…'
+        toast.success(msg)
+        setScanProgress(msg)
+        return
+      }
+      toast.success(`扫描完成：新增 ${result.added ?? 0} 项，更新 ${result.updated ?? 0} 项`)
+      setScanProgress(`扫描完成：新增 ${result.added ?? 0} · 更新 ${result.updated ?? 0}`)
+      setScanning(false)
       onLibraryChanged()
     } catch {
       toast.error('扫描失败')
       setScanProgress('扫描失败，请查看日志或稍后重试')
-    } finally {
       setScanning(false)
     }
   }, [libraryID, onLibraryChanged])

web/src/pages/useMediaDetailPageState.ts

@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useState, type Dispatch, type SetStateAction } from 'react'
+import { useCallback, useEffect, useMemo, useState, type Dispatch, type SetStateAction } from 'react'
 import type { NavigateFunction } from 'react-router-dom'
 import toast from 'react-hot-toast'
 
@@ -20,6 +20,8 @@ interface MediaDetailRefreshParams {
   setMedia: Dispatch<SetStateAction<Media | null>>
   setFavourite: Dispatch<SetStateAction<boolean>>
   setLoading: Dispatch<SetStateAction<boolean>>
+  setEpisodes: Dispatch<SetStateAction<Media[]>>
+  setLoadingEpisodes: Dispatch<SetStateAction<boolean>>
 }
 
 interface MediaDetailActionsParams {
@@ -34,12 +36,23 @@ export function useMediaDetailPageState({ id, navigate }: MediaDetailPageStatePa
   const [media, setMedia] = useState<Media | null>(null)
   const [favourite, setFavourite] = useState(false)
   const [loading, setLoading] = useState(true)
+  const [episodes, setEpisodes] = useState<Media[]>([])
+  const [loadingEpisodes, setLoadingEpisodes] = useState(false)
+  const [selectedSeason, setSelectedSeason] = useState<number | null>(null)
+
   const [manualScrapeOpen, setManualScrapeOpen] = useState(false)
   const [metadataEditOpen, setMetadataEditOpen] = useState(false)
   const [organizeOpen, setOrganizeOpen] = useState(false)
   const [scrapeEpisodeArtwork, setScrapeEpisodeArtwork] = useState(false)
 
-  const refresh = useMediaDetailRefresh({ id, setMedia, setFavourite, setLoading })
+  const refresh = useMediaDetailRefresh({
+    id,
+    setMedia,
+    setFavourite,
+    setLoading,
+    setEpisodes,
+    setLoadingEpisodes,
+  })
   const actions = useMediaDetailActions({
     media,
     scrapeEpisodeArtwork,
@@ -52,6 +65,41 @@ export function useMediaDetailPageState({ id, navigate }: MediaDetailPageStatePa
     refresh().catch(() => undefined)
   }, [refresh])
 
+  const seasonGroups = useMemo(() => {
+    if (episodes.length === 0) return []
+    const seasons = new Map<number, Media[]>()
+    for (const ep of episodes) {
+      const s = ep.episode_num > 0 ? (ep.season_num ?? 0) : (ep.season_num || 1)
+      if (!seasons.has(s)) seasons.set(s, [])
+      seasons.get(s)!.push(ep)
+    }
+    for (const [, list] of seasons) {
+      list.sort((a, b) => (a.episode_num || 0) - (b.episode_num || 0))
+    }
+    return Array.from(seasons.entries())
+      .sort(([a], [b]) => a - b)
+      .map(([season, list]) => ({ season, episodes: list }))
+  }, [episodes])
+
+  const visibleEpisodes = useMemo(() => {
+    if (selectedSeason == null) return seasonGroups[0]?.episodes ?? []
+    return seasonGroups.find((s) => s.season === selectedSeason)?.episodes ?? []
+  }, [seasonGroups, selectedSeason])
+
+  const hasEpisodes = useMemo(() => {
+    if (episodes.length > 1) return true
+    if (episodes.length === 1 && media) {
+      // 只有单条时，如果明确是集（有 episode_num > 0）或 ID 与自身不同，则按剧集渲染
+      return episodes[0].episode_num > 0 || episodes[0].id !== media.id
+    }
+    return false
+  }, [episodes, media])
+
+  const firstPlayableEpisode = useMemo(() => {
+    if (episodes.length === 0) return null
+    return (visibleEpisodes.length > 0 ? visibleEpisodes[0] : episodes[0]) || null
+  }, [episodes, visibleEpisodes])
+
   const handleMetadataSaved = useCallback(async (next: Media) => {
     setMedia(next)
     await refresh()
@@ -61,6 +109,14 @@ export function useMediaDetailPageState({ id, navigate }: MediaDetailPageStatePa
     media,
     favourite,
     loading,
+    episodes,
+    loadingEpisodes,
+    seasonGroups,
+    selectedSeason,
+    visibleEpisodes,
+    hasEpisodes,
+    firstPlayableEpisode,
+    setSelectedSeason,
     manualScrapeOpen,
     metadataEditOpen,
     organizeOpen,
@@ -80,19 +136,31 @@ function useMediaDetailRefresh({
   setMedia,
   setFavourite,
   setLoading,
+  setEpisodes,
+  setLoadingEpisodes,
 }: MediaDetailRefreshParams): () => Promise<void> {
   return useCallback(async () => {
     if (!id) return
     setLoading(true)
+    setLoadingEpisodes(true)
     try {
       const nextMedia = await mediaAPI.get(id)
       setMedia(nextMedia)
       const favourites = await playbackAPI.listFavourites().catch(() => [])
       setFavourite(favourites.some((item) => item.id === nextMedia.id))
+      // 异步加载分集列表
+      try {
+        const epRes = await mediaAPI.getEpisodes(id)
+        setEpisodes(epRes.items ?? [])
+      } catch {
+        setEpisodes([])
+      } finally {
+        setLoadingEpisodes(false)
+      }
     } finally {
       setLoading(false)
     }
-  }, [id, setFavourite, setLoading, setMedia])
+  }, [id, setFavourite, setLoading, setMedia, setEpisodes, setLoadingEpisodes])
 }
 
 function useMediaDetailActions({
@@ -121,10 +189,12 @@ function useMediaDetailActions({
 }
 
 function goBackFromMediaDetail(media: Media | null, navigate: NavigateFunction, replace = false): void {
-  if (!media) return
+  if (!media) {
+    navigate('/libraries')
+    return
+  }
   const backTarget = mediaLibraryBackTarget(media)
-  if (backTarget) navigate(backTarget, replace ? { replace: true } : undefined)
-  else navigate(-1)
+  navigate(backTarget || '/libraries', replace ? { replace: true } : undefined)
 }
 
 async function toggleMediaFavourite(

web/src/types/auth.ts

@@ -10,6 +10,7 @@ export interface User {
   force_password_reset: boolean
   is_active: boolean
   allowed_library_ids?: string[]
+  pinned_library_ids?: string[]
   is_default_admin?: boolean
   is_protected?: boolean
   realtime_online?: boolean

web/src/utils/pinnedLibraries.ts

@@ -1,4 +1,7 @@
+import { profileAPI } from '../api/profile'
+
 const STORAGE_KEY = 'mebox_pinned_libraries'
+const MIGRATION_KEY = 'mebox_pinned_libraries_migrated'
 
 function parsePinnedIds(raw: string | null): string[] {
   if (!raw) return []
@@ -11,28 +14,74 @@ function parsePinnedIds(raw: string | null): string[] {
   }
 }
 
-export function readPinnedLibraryIds(): string[] {
+export function readLegacyPinnedLibraryIds(): string[] {
   if (typeof window === 'undefined') return []
   return parsePinnedIds(window.localStorage.getItem(STORAGE_KEY))
 }
 
-export function writePinnedLibraryIds(ids: string[]): void {
+function writeLegacyPinnedLibraryIds(ids: string[]): void {
   if (typeof window === 'undefined') return
+  if (ids.length === 0) {
+    window.localStorage.removeItem(STORAGE_KEY)
+    return
+  }
   window.localStorage.setItem(STORAGE_KEY, JSON.stringify(ids))
 }
 
-export function togglePinnedLibraryId(id: string): string[] {
-  const current = readPinnedLibraryIds()
+function markPinnedLibrariesMigrated(): void {
+  if (typeof window === 'undefined') return
+  window.localStorage.setItem(MIGRATION_KEY, '1')
+  window.localStorage.removeItem(STORAGE_KEY)
+}
+
+function hasPinnedLibrariesMigrated(): boolean {
+  if (typeof window === 'undefined') return true
+  return window.localStorage.getItem(MIGRATION_KEY) === '1'
+}
+
+export async function loadPinnedLibraryIds(): Promise<string[]> {
+  const remote = await profileAPI.getPinnedLibraries()
+  if (!hasPinnedLibrariesMigrated()) {
+    const legacy = readLegacyPinnedLibraryIds()
+    if (legacy.length > 0 && remote.length === 0) {
+      const migrated = await profileAPI.setPinnedLibraries(legacy)
+      markPinnedLibrariesMigrated()
+      return migrated
+    }
+    markPinnedLibrariesMigrated()
+  }
+  return remote
+}
+
+export async function savePinnedLibraryIds(ids: string[]): Promise<string[]> {
+  const saved = await profileAPI.setPinnedLibraries(ids)
+  writeLegacyPinnedLibraryIds(saved)
+  return saved
+}
+
+export function togglePinnedLibraryId(current: string[], id: string): string[] {
   const index = current.indexOf(id)
-  const next = index >= 0 ? current.filter((item) => item !== id) : [...current, id]
-  writePinnedLibraryIds(next)
-  return next
+  return index >= 0 ? current.filter((item) => item !== id) : [...current, id]
 }
 
 export function isLibraryPinned(id: string, pinnedIds: string[]): boolean {
   return pinnedIds.includes(id)
 }
 
+export function sortByPinnedIds<T extends { id: string }>(items: T[], pinnedIds: string[]): T[] {
+  if (pinnedIds.length === 0) return items
+  const rank = new Map(pinnedIds.map((pinnedId, index) => [pinnedId, index]))
+  return [...items].sort((a, b) => {
+    const aRank = rank.get(a.id)
+    const bRank = rank.get(b.id)
+    const aPinned = aRank !== undefined
+    const bPinned = bRank !== undefined
+    if (aPinned !== bPinned) return aPinned ? -1 : 1
+    if (aPinned && bPinned) return aRank - bRank
+    return 0
+  })
+}
+
 export function sortLibraryPreviews<T extends { library: { id: string } }>(items: T[], pinnedIds: string[]): T[] {
   if (pinnedIds.length === 0) return items
   const rank = new Map(pinnedIds.map((id, index) => [id, index]))