feat: Add global password display from environment variables and improve cursor styles for interactive elements.

app/settings/hooks/useSettingsPage.ts

@@ -1,6 +1,7 @@
 import { useState, useEffect } from 'react';
 import { settingsStore, getDefaultSources, type SortOption } from '@/lib/store/settings-store';
 import type { VideoSource } from '@/lib/types';
+import { isEnvPasswordRequired } from '@/lib/actions/auth';
 
 export function useSettingsPage() {
     const [sources, setSources] = useState<VideoSource[]>([]);
@@ -14,6 +15,7 @@ export function useSettingsPage() {
 
     const [passwordAccess, setPasswordAccess] = useState(false);
     const [accessPasswords, setAccessPasswords] = useState<string[]>([]);
+    const [envPasswordSet, setEnvPasswordSet] = useState(false);
 
     useEffect(() => {
         const settings = settingsStore.getSettings();
@@ -21,6 +23,8 @@ export function useSettingsPage() {
         setSortBy(settings.sortBy);
         setPasswordAccess(settings.passwordAccess);
         setAccessPasswords(settings.accessPasswords);
+
+        isEnvPasswordRequired().then(setEnvPasswordSet);
     }, []);
 
     const handleSourcesChange = (newSources: VideoSource[]) => {
@@ -162,5 +166,6 @@ export function useSettingsPage() {
         handleResetAll,
         editingSource,
         handleEditSource,
+        envPasswordSet,
     };
 }

app/settings/page.tsx

@@ -41,6 +41,7 @@ export default function SettingsPage() {
     editingSource,
     handleEditSource,
     setEditingSource,
+    envPasswordSet,
   } = useSettingsPage();
 
   return (
@@ -56,6 +57,7 @@ export default function SettingsPage() {
           onToggle={handlePasswordToggle}
           onAdd={handleAddPassword}
           onRemove={handleRemovePassword}
+          envPasswordSet={envPasswordSet}
         />
 
         {/* Source Management */}

app/styles/base.css

@@ -11,6 +11,22 @@ html {
     scroll-behavior: auto;
 }
 
+/* Accessibility & UX */
+button,
+label,
+a,
+select,
+summary,
+[role="button"],
+.clickable {
+    cursor: pointer;
+}
+
+button:disabled,
+[role="button"]:disabled {
+    cursor: not-allowed;
+}
+
 /* Focus Styles */
 *:focus-visible {
     outline: 2px solid var(--accent-color);

components/settings/PasswordSettings.tsx

@@ -10,6 +10,7 @@ interface PasswordSettingsProps {
     onToggle: (enabled: boolean) => void;
     onAdd: (password: string) => void;
     onRemove: (password: string) => void;
+    envPasswordSet?: boolean;
 }
 
 export function PasswordSettings({
@@ -18,6 +19,7 @@ export function PasswordSettings({
     onToggle,
     onAdd,
     onRemove,
+    envPasswordSet,
 }: PasswordSettingsProps) {
     const [newPassword, setNewPassword] = useState('');
     const [error, setError] = useState('');
@@ -67,6 +69,17 @@ export function PasswordSettings({
                             )}
 
                             <div className="flex flex-wrap gap-2">
+                                {envPasswordSet && (
+                                    <div
+                                        className="flex items-center gap-2 px-3 py-1.5 bg-[var(--accent-color)]/10 border border-[var(--accent-color)]/30 rounded-[var(--radius-full)] text-sm shadow-[0_2px_4px_rgba(0,0,0,0.05)]"
+                                        title="这是通过环境变量设置的全局密码，不可在此删除。"
+                                    >
+                                        <span className="w-2 h-2 rounded-full bg-[var(--accent-color)] animate-pulse"></span>
+                                        <span className="font-semibold text-[var(--accent-color)]">全局密码</span>
+                                        <span className="font-mono">{showPassword ? 'ACCESS_PASSWORD' : '••••••'}</span>
+                                        <span className="text-[var(--text-color-secondary)] text-xs opacity-60">不可在此删除</span>
+                                    </div>
+                                )}
                                 {passwords.map((pwd, index) => (
                                     <div
                                         key={index}
@@ -76,7 +89,7 @@ export function PasswordSettings({
                                         <button
                                             onClick={() => onRemove(pwd)}
                                             className="text-[var(--text-color-secondary)] hover:text-red-500 transition-colors"
-                                            title="删除密码"
+                                            title="删除本地密码"
                                         >
                                             <Trash2 size={14} />
                                         </button>

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "kvideo",
-  "version": "2.1.0",
+  "version": "2.5.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "kvideo",
-      "version": "2.1.0",
+      "version": "2.5.0",
       "dependencies": {
         "@dnd-kit/core": "^6.3.1",
         "@dnd-kit/sortable": "^10.0.0",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "kvideo",
-  "version": "2.1.0",
+  "version": "2.5.0",
   "private": true,
   "scripts": {
     "dev": "next dev",