mirror of
https://github.com/truewhile/MeBox.git
synced 2026-09-28 03:06:38 +08:00
Hide scrape and library admin controls from non-admin users.
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -37,6 +37,7 @@ export function GlobalEvents() {
|
||||
}
|
||||
}
|
||||
if (topic === 'scrape' && p.finished) {
|
||||
if (role !== 'admin') return
|
||||
const processed = Number(p.processed ?? 0)
|
||||
const matched = Number(p.matched ?? 0)
|
||||
const failed = Number(p.failed ?? 0)
|
||||
@@ -51,6 +52,7 @@ export function GlobalEvents() {
|
||||
}
|
||||
}
|
||||
if (topic === 'subscription') {
|
||||
if (role !== 'admin') return
|
||||
const queued = (p.queued as number | undefined) ?? 0
|
||||
if (queued > 0) toast.success(`订阅「${p.name}」已加入 ${queued} 项下载`)
|
||||
}
|
||||
|
||||
@@ -5,7 +5,6 @@ import type { User } from '../types'
|
||||
|
||||
export function useLayoutPermissions(user: User | null | undefined) {
|
||||
const permissions = usePermissionStore((state) => state.permissions)
|
||||
const isSuper = usePermissionStore((state) => state.isSuper)
|
||||
const isPermissionLoading = usePermissionStore((state) => state.isLoading)
|
||||
const fetchPermissions = usePermissionStore((state) => state.fetchPermissions)
|
||||
|
||||
@@ -17,8 +16,8 @@ export function useLayoutPermissions(user: User | null | undefined) {
|
||||
|
||||
const isAdmin = user?.role === 'admin'
|
||||
const can = useCallback(
|
||||
(key: string) => isAdmin || isSuper || (permissions ?? {})[key] === true,
|
||||
[isAdmin, isSuper, permissions],
|
||||
(key: string) => isAdmin || (permissions ?? {})[key] === true,
|
||||
[isAdmin, permissions],
|
||||
)
|
||||
|
||||
return { can, isAdmin }
|
||||
|
||||
@@ -5,17 +5,17 @@ import { useAuthStore } from '../stores/auth'
|
||||
|
||||
/**
|
||||
* usePermission hook - 检查用户是否拥有特定权限
|
||||
*
|
||||
*
|
||||
* @param key - 权限键名
|
||||
* @param options - 配置选项
|
||||
* @param options.autoFetch - 是否在权限未加载时自动获取(默认 true)
|
||||
* @returns boolean - 用户是否拥有该权限
|
||||
*
|
||||
*
|
||||
* @example
|
||||
* ```tsx
|
||||
* function MyComponent() {
|
||||
* const canEdit = usePermission('can_edit_media')
|
||||
*
|
||||
*
|
||||
* if (canEdit) {
|
||||
* return <EditButton />
|
||||
* }
|
||||
@@ -30,26 +30,24 @@ export function usePermission(
|
||||
const { autoFetch = true } = options
|
||||
// selector 订阅:store 任何无关字段变化不会触发本组件重渲染
|
||||
const hasPermission = usePermissionStore((s) => s.hasPermission)
|
||||
const isSuper = usePermissionStore((s) => s.isSuper)
|
||||
const fetchPermissions = usePermissionStore((s) => s.fetchPermissions)
|
||||
const tier = useAuthStore((state) => state.tier)
|
||||
const role = useAuthStore((state) => state.user?.role)
|
||||
const isAuthenticated = useAuthStore((state) => state.token !== null)
|
||||
const hasSuperAccess = isSuper || tier === 'plus' || role === 'admin'
|
||||
const isAdmin = role === 'admin'
|
||||
|
||||
// 权限未加载时自动获取;用 getState() 读最新快照而不是渲染闭包,
|
||||
// 同一次 commit 内挂载的多个消费方也只会有一个发出请求(store 内还有 inflight 去重兜底)。
|
||||
useEffect(() => {
|
||||
if (!hasSuperAccess && isAuthenticated && autoFetch) {
|
||||
if (!isAdmin && isAuthenticated && autoFetch) {
|
||||
const { permissions, isLoading } = usePermissionStore.getState()
|
||||
if (Object.keys(permissions).length === 0 && !isLoading) {
|
||||
fetchPermissions()
|
||||
}
|
||||
}
|
||||
}, [autoFetch, fetchPermissions, hasSuperAccess, isAuthenticated])
|
||||
}, [autoFetch, fetchPermissions, isAdmin, isAuthenticated])
|
||||
|
||||
// 超级用户有所有权限
|
||||
if (hasSuperAccess) {
|
||||
// 管理员拥有全部能力;plus / is_super 不能用来展示刮削、整理、删除等管理入口
|
||||
if (isAdmin) {
|
||||
return true
|
||||
}
|
||||
|
||||
@@ -63,18 +61,18 @@ export function usePermission(
|
||||
|
||||
/**
|
||||
* usePermissions hook - 获取所有权限
|
||||
*
|
||||
*
|
||||
* @returns 权限状态和检查函数
|
||||
*
|
||||
*
|
||||
* @example
|
||||
* ```tsx
|
||||
* function MyComponent() {
|
||||
* const { permissions, isSuper, check } = usePermissions()
|
||||
*
|
||||
*
|
||||
* if (isSuper) {
|
||||
* return <AdminPanel />
|
||||
* }
|
||||
*
|
||||
*
|
||||
* return (
|
||||
* <div>
|
||||
* {check('can_view_dashboard') && <Dashboard />}
|
||||
@@ -87,15 +85,14 @@ export function usePermission(
|
||||
export function usePermissions() {
|
||||
// selector 订阅:只关注 permissions/isSuper/isLoading 变化
|
||||
const permissions = usePermissionStore((s) => s.permissions)
|
||||
const isSuper = usePermissionStore((s) => s.isSuper)
|
||||
const isLoading = usePermissionStore((s) => s.isLoading)
|
||||
const fetchPermissions = usePermissionStore((s) => s.fetchPermissions)
|
||||
const tier = useAuthStore((state) => state.tier)
|
||||
const role = useAuthStore((state) => state.user?.role)
|
||||
const isAuthenticated = useAuthStore((state) => state.token !== null)
|
||||
const isAdmin = role === 'admin'
|
||||
|
||||
const check = (key: string): boolean => {
|
||||
if (isSuper || tier === 'plus' || role === 'admin') {
|
||||
if (isAdmin) {
|
||||
return true
|
||||
}
|
||||
return permissions[key] === true
|
||||
@@ -103,7 +100,8 @@ export function usePermissions() {
|
||||
|
||||
return {
|
||||
permissions,
|
||||
isSuper: isSuper || tier === 'plus' || role === 'admin',
|
||||
// Keep the field name for callers, but only admins are treated as full-access.
|
||||
isSuper: isAdmin,
|
||||
isLoading,
|
||||
check,
|
||||
refetch: fetchPermissions,
|
||||
@@ -113,10 +111,10 @@ export function usePermissions() {
|
||||
|
||||
/**
|
||||
* usePermissionMany hook - 批量检查多个权限
|
||||
*
|
||||
*
|
||||
* @param keys - 权限键数组
|
||||
* @returns 每个权限的布尔值映射
|
||||
*
|
||||
*
|
||||
* @example
|
||||
* ```tsx
|
||||
* function MyComponent() {
|
||||
@@ -125,7 +123,7 @@ export function usePermissions() {
|
||||
* 'can_manage_users',
|
||||
* 'can_access_settings',
|
||||
* ])
|
||||
*
|
||||
*
|
||||
* return (
|
||||
* <div>
|
||||
* {perms['can_edit_media'] && <EditButton />}
|
||||
@@ -137,7 +135,7 @@ export function usePermissions() {
|
||||
*/
|
||||
export function usePermissionMany(keys: string[]): Record<string, boolean> {
|
||||
const { check } = usePermissions()
|
||||
|
||||
|
||||
return keys.reduce((acc, key) => {
|
||||
acc[key] = check(key)
|
||||
return acc
|
||||
|
||||
@@ -5,6 +5,7 @@ import { toolsAPI } from '../api/tools'
|
||||
import { openManageLibrariesDialog } from '../components/manageLibrariesDialog'
|
||||
import { useEpisodeArtworkPreference } from '../hooks/useEpisodeArtworkPreference'
|
||||
import { usePinnedLibraries } from '../hooks/usePinnedLibraries'
|
||||
import { useAuthStore } from '../stores/auth'
|
||||
import {
|
||||
LibrariesContent,
|
||||
LibrariesEmptyState,
|
||||
@@ -18,6 +19,7 @@ import { sortLibraryPreviews } from '../utils/pinnedLibraries'
|
||||
import { partitionPreviewIDs } from '../utils/remoteEmby'
|
||||
|
||||
export function LibrariesPage() {
|
||||
const isAdmin = useAuthStore((state) => state.user?.role === 'admin')
|
||||
const [libraries, setLibraries] = useState<Library[]>([])
|
||||
const [libraryData, setLibraryData] = useState<Record<string, { cards: SeriesCard[]; total: number }>>({})
|
||||
const { pinnedIds, loading: pinnedLoading, togglePin } = usePinnedLibraries()
|
||||
@@ -103,7 +105,7 @@ export function LibrariesPage() {
|
||||
}, [])
|
||||
|
||||
async function handleRepairRescrape() {
|
||||
if (repairing) return
|
||||
if (!isAdmin || repairing) return
|
||||
setRepairing(true)
|
||||
setRepairMsg('')
|
||||
try {
|
||||
@@ -117,6 +119,7 @@ export function LibrariesPage() {
|
||||
}
|
||||
|
||||
const handleManageLibraries = async () => {
|
||||
if (!isAdmin) return
|
||||
await openManageLibrariesDialog()
|
||||
await loadLibraries({ force: true })
|
||||
}
|
||||
@@ -154,6 +157,7 @@ export function LibrariesPage() {
|
||||
<LibrariesHeader
|
||||
previewCount={previews.length}
|
||||
total={total}
|
||||
isAdmin={isAdmin}
|
||||
repairMsg={repairMsg}
|
||||
repairEpisodeArtwork={repairEpisodeArtwork}
|
||||
repairing={repairing}
|
||||
@@ -163,7 +167,7 @@ export function LibrariesPage() {
|
||||
/>
|
||||
|
||||
{previews.length === 0 ? (
|
||||
<LibrariesEmptyState />
|
||||
<LibrariesEmptyState isAdmin={isAdmin} />
|
||||
) : (
|
||||
<LibrariesContent
|
||||
previews={sortedPreviews}
|
||||
|
||||
@@ -9,6 +9,7 @@ import type { LibraryPreview } from './librariesPageModel'
|
||||
export function LibrariesHeader({
|
||||
previewCount,
|
||||
total,
|
||||
isAdmin,
|
||||
repairMsg,
|
||||
repairEpisodeArtwork,
|
||||
repairing,
|
||||
@@ -18,6 +19,7 @@ export function LibrariesHeader({
|
||||
}: {
|
||||
previewCount: number
|
||||
total: number
|
||||
isAdmin: boolean
|
||||
repairMsg: string
|
||||
repairEpisodeArtwork: boolean
|
||||
repairing: boolean
|
||||
@@ -33,49 +35,53 @@ export function LibrariesHeader({
|
||||
共 {previewCount} 个目录 · {total.toLocaleString()} 个条目。每个目录直接展示最新入库内容。
|
||||
</p>
|
||||
</div>
|
||||
<div className="flex flex-wrap items-center gap-2 sm:gap-3">
|
||||
{repairMsg && <span className="w-full text-xs text-ink-50">{repairMsg}</span>}
|
||||
<EpisodeArtworkToggle
|
||||
checked={repairEpisodeArtwork}
|
||||
onChange={onRepairEpisodeArtworkChange}
|
||||
title="关闭后仍会获取主海报和每集文字元数据,只跳过每集图片"
|
||||
className="h-9 sm:h-10 text-xs sm:text-sm"
|
||||
/>
|
||||
<button
|
||||
type="button"
|
||||
onClick={onRepairRescrape}
|
||||
disabled={repairing}
|
||||
className="btn-outline !px-3 !py-1.5 text-xs sm:!px-4 sm:!py-2.5 sm:text-sm disabled:cursor-not-allowed disabled:opacity-60"
|
||||
title="从媒体路径回填缺失/错误的外部 ID,再批量重刮整库"
|
||||
>
|
||||
<RefreshCw size={14} className={repairing ? 'animate-spin' : ''} />
|
||||
{repairing ? '正在启动…' : '全库修复+重刮'}
|
||||
</button>
|
||||
<Link
|
||||
to="/scraper/queue"
|
||||
className="btn-outline inline-flex items-center gap-1.5 !px-3 !py-1.5 text-xs sm:!px-4 sm:!py-2.5 sm:text-sm"
|
||||
title="查看正在进行的刮削任务与进度"
|
||||
>
|
||||
<Sparkles size={14} className="text-brand-500" />
|
||||
<span>刮削队列</span>
|
||||
</Link>
|
||||
<button
|
||||
type="button"
|
||||
onClick={onManageLibraries}
|
||||
className="btn-outline !px-3 !py-1.5 text-xs sm:!px-4 sm:!py-2.5 sm:text-sm"
|
||||
>
|
||||
管理媒体库
|
||||
</button>
|
||||
</div>
|
||||
{isAdmin && (
|
||||
<div className="flex flex-wrap items-center gap-2 sm:gap-3">
|
||||
{repairMsg && <span className="w-full text-xs text-ink-50">{repairMsg}</span>}
|
||||
<EpisodeArtworkToggle
|
||||
checked={repairEpisodeArtwork}
|
||||
onChange={onRepairEpisodeArtworkChange}
|
||||
title="关闭后仍会获取主海报和每集文字元数据,只跳过每集图片"
|
||||
className="h-9 sm:h-10 text-xs sm:text-sm"
|
||||
/>
|
||||
<button
|
||||
type="button"
|
||||
onClick={onRepairRescrape}
|
||||
disabled={repairing}
|
||||
className="btn-outline !px-3 !py-1.5 text-xs sm:!px-4 sm:!py-2.5 sm:text-sm disabled:cursor-not-allowed disabled:opacity-60"
|
||||
title="从媒体路径回填缺失/错误的外部 ID,再批量重刮整库"
|
||||
>
|
||||
<RefreshCw size={14} className={repairing ? 'animate-spin' : ''} />
|
||||
{repairing ? '正在启动…' : '全库修复+重刮'}
|
||||
</button>
|
||||
<Link
|
||||
to="/scraper/queue"
|
||||
className="btn-outline inline-flex items-center gap-1.5 !px-3 !py-1.5 text-xs sm:!px-4 sm:!py-2.5 sm:text-sm"
|
||||
title="查看正在进行的刮削任务与进度"
|
||||
>
|
||||
<Sparkles size={14} className="text-brand-500" />
|
||||
<span>刮削队列</span>
|
||||
</Link>
|
||||
<button
|
||||
type="button"
|
||||
onClick={onManageLibraries}
|
||||
className="btn-outline !px-3 !py-1.5 text-xs sm:!px-4 sm:!py-2.5 sm:text-sm"
|
||||
>
|
||||
管理媒体库
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export function LibrariesEmptyState() {
|
||||
export function LibrariesEmptyState({ isAdmin = false }: { isAdmin?: boolean }) {
|
||||
return (
|
||||
<div className="flex flex-col items-center justify-center rounded-3xl border border-dashed border-[var(--app-border)] bg-[var(--app-panel)] py-24 text-center">
|
||||
<LibraryIcon className="mb-4 h-12 w-12 text-[var(--app-muted)]" />
|
||||
<p className="text-sm text-[var(--app-muted)]">暂无媒体库,请到管理后台添加目录。</p>
|
||||
<p className="text-sm text-[var(--app-muted)]">
|
||||
{isAdmin ? '暂无媒体库,请到管理后台添加目录。' : '暂无可用媒体库。'}
|
||||
</p>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -53,8 +53,9 @@ export const usePermissionStore = create<PermissionState>((set, get) => ({
|
||||
|
||||
hasPermission: (key: string) => {
|
||||
const state = get()
|
||||
// Super user (admin or plus) has all permissions
|
||||
if (state.isSuper) {
|
||||
// Only admins implicitly have every capability in the UI.
|
||||
// Plus / is_super must not reveal scrape/organize/delete controls.
|
||||
if (state.role === 'admin') {
|
||||
return true
|
||||
}
|
||||
return (state.permissions ?? {})[key] === true
|
||||
|
||||
Reference in New Issue
Block a user