feat: Implement settings password protection with a dedicated gate, management UI, and API integration.

app/api/config/route.ts

@@ -8,12 +8,14 @@ import { NextRequest, NextResponse } from 'next/server';
 export const runtime = 'edge';
 
 const ACCESS_PASSWORD = process.env.ACCESS_PASSWORD || '';
+const SETTINGS_PASSWORD = process.env.SETTINGS_PASSWORD || '';
 const PERSIST_PASSWORD = process.env.PERSIST_PASSWORD !== 'false';
 const SUBSCRIPTION_SOURCES = process.env.SUBSCRIPTION_SOURCES || process.env.NEXT_PUBLIC_SUBSCRIPTION_SOURCES || '';
 
 export async function GET() {
     return NextResponse.json({
         hasEnvPassword: ACCESS_PASSWORD.length > 0,
+        hasEnvSettingsPassword: SETTINGS_PASSWORD.length > 0,
         persistPassword: PERSIST_PASSWORD,
         subscriptionSources: SUBSCRIPTION_SOURCES,
     });
@@ -21,7 +23,15 @@ export async function GET() {
 
 export async function POST(request: NextRequest) {
     try {
-        const { password } = await request.json();
+        const { password, type } = await request.json();
+
+        if (type === 'settings') {
+            if (!SETTINGS_PASSWORD) {
+                return NextResponse.json({ valid: false, message: 'No env settings password set' });
+            }
+            const valid = password === SETTINGS_PASSWORD;
+            return NextResponse.json({ valid });
+        }
 
         if (!ACCESS_PASSWORD) {
             return NextResponse.json({ valid: false, message: 'No env password set' });

app/premium/settings/page.tsx

@@ -4,6 +4,7 @@ import { AddSourceModal } from '@/components/settings/AddSourceModal';
 import { ConfirmDialog } from '@/components/ui/ConfirmDialog';
 import { PremiumSourceSettings } from '@/components/settings/PremiumSourceSettings';
 import { SettingsHeader } from '@/components/settings/SettingsHeader';
+import { SettingsPasswordGate } from '@/components/SettingsPasswordGate';
 import { usePremiumSettingsPage } from './hooks/usePremiumSettingsPage';
 import Link from 'next/link';
 
@@ -23,6 +24,7 @@ export default function PremiumSettingsPage() {
     } = usePremiumSettingsPage();
 
     return (
+        <SettingsPasswordGate>
         <div className="min-h-screen bg-black">
             <div className="container mx-auto px-4 py-8 max-w-4xl space-y-8">
                 {/* Custom Header for Secret Settings */}
@@ -81,5 +83,6 @@ export default function PremiumSettingsPage() {
                 onCancel={() => setIsRestoreDefaultsDialogOpen(false)}
             />
         </div>
+        </SettingsPasswordGate>
     );
 }

app/settings/hooks/useSettingsPage.ts

@@ -23,6 +23,10 @@ export function useSettingsPage() {
     const [accessPasswords, setAccessPasswords] = useState<string[]>([]);
     const [envPasswordSet, setEnvPasswordSet] = useState(false);
 
+    const [settingsPasswordEnabled, setSettingsPasswordEnabled] = useState(false);
+    const [settingsPasswords, setSettingsPasswords] = useState<string[]>([]);
+    const [envSettingsPasswordSet, setEnvSettingsPasswordSet] = useState(false);
+
     // Display settings
     const [realtimeLatency, setRealtimeLatency] = useState(false);
     const [searchDisplayMode, setSearchDisplayMode] = useState<SearchDisplayMode>('normal');
@@ -37,6 +41,8 @@ export function useSettingsPage() {
         setSortBy(settings.sortBy);
         setPasswordAccess(settings.passwordAccess);
         setAccessPasswords(settings.accessPasswords);
+        setSettingsPasswordEnabled(settings.settingsPasswordEnabled);
+        setSettingsPasswords(settings.settingsPasswords);
         setRealtimeLatency(settings.realtimeLatency);
         setSearchDisplayMode(settings.searchDisplayMode);
         setFullscreenType(settings.fullscreenType);
@@ -46,8 +52,14 @@ export function useSettingsPage() {
         // Fetch env password status
         fetch('/api/config')
             .then(res => res.json())
-            .then(data => setEnvPasswordSet(data.hasEnvPassword))
-            .catch(() => setEnvPasswordSet(false));
+            .then(data => {
+                setEnvPasswordSet(data.hasEnvPassword);
+                setEnvSettingsPasswordSet(data.hasEnvSettingsPassword);
+            })
+            .catch(() => {
+                setEnvPasswordSet(false);
+                setEnvSettingsPasswordSet(false);
+            });
     }, []);
 
     const handleSourcesChange = (newSources: VideoSource[]) => {
@@ -137,6 +149,37 @@ export function useSettingsPage() {
         });
     };
 
+    const handleSettingsPasswordToggle = (enabled: boolean) => {
+        setSettingsPasswordEnabled(enabled);
+        const currentSettings = settingsStore.getSettings();
+        settingsStore.saveSettings({
+            ...currentSettings,
+            settingsPasswordEnabled: enabled,
+        });
+    };
+
+    const handleAddSettingsPassword = (password: string) => {
+        const updated = [...settingsPasswords, password];
+        setSettingsPasswords(updated);
+        const currentSettings = settingsStore.getSettings();
+        settingsStore.saveSettings({
+            ...currentSettings,
+            settingsPasswordEnabled,
+            settingsPasswords: updated,
+        });
+    };
+
+    const handleRemoveSettingsPassword = (password: string) => {
+        const updated = settingsPasswords.filter(p => p !== password);
+        setSettingsPasswords(updated);
+        const currentSettings = settingsStore.getSettings();
+        settingsStore.saveSettings({
+            ...currentSettings,
+            settingsPasswordEnabled,
+            settingsPasswords: updated,
+        });
+    };
+
     const handleExport = (includeSearchHistory: boolean, includeWatchHistory: boolean) => {
         const data = settingsStore.exportSettings(includeSearchHistory || includeWatchHistory);
         const blob = new Blob([data], { type: 'application/json' });
@@ -331,6 +374,9 @@ export function useSettingsPage() {
         passwordAccess,
         accessPasswords,
         envPasswordSet,
+        settingsPasswordEnabled,
+        settingsPasswords,
+        envSettingsPasswordSet,
         realtimeLatency,
         searchDisplayMode,
         isAddModalOpen,
@@ -350,6 +396,9 @@ export function useSettingsPage() {
         handlePasswordToggle,
         handleAddPassword,
         handleRemovePassword,
+        handleSettingsPasswordToggle,
+        handleAddSettingsPassword,
+        handleRemoveSettingsPassword,
         handleExport,
         handleImportFile, // Renamed from handleImport
         handleImportLink, // New

app/settings/page.tsx

@@ -9,9 +9,11 @@ import { SourceSettings } from '@/components/settings/SourceSettings';
 import { SortSettings } from '@/components/settings/SortSettings';
 import { DataSettings } from '@/components/settings/DataSettings';
 import { PasswordSettings } from '@/components/settings/PasswordSettings';
+import { SettingsPasswordSettings } from '@/components/settings/SettingsPasswordSettings';
 import { DisplaySettings } from '@/components/settings/DisplaySettings';
 import { PlayerSettings } from '@/components/settings/PlayerSettings';
 import { SettingsHeader } from '@/components/settings/SettingsHeader';
+import { SettingsPasswordGate } from '@/components/SettingsPasswordGate';
 import { useSettingsPage } from './hooks/useSettingsPage';
 
 export default function SettingsPage() {
@@ -21,6 +23,9 @@ export default function SettingsPage() {
     passwordAccess,
     accessPasswords,
     envPasswordSet,
+    settingsPasswordEnabled,
+    settingsPasswords,
+    envSettingsPasswordSet,
     realtimeLatency,
     searchDisplayMode,
     fullscreenType,
@@ -40,6 +45,9 @@ export default function SettingsPage() {
     handlePasswordToggle,
     handleAddPassword,
     handleRemovePassword,
+    handleSettingsPasswordToggle,
+    handleAddSettingsPassword,
+    handleRemoveSettingsPassword,
     handleExport,
     handleImportFile,
     handleImportLink,
@@ -62,6 +70,7 @@ export default function SettingsPage() {
   } = useSettingsPage();
 
   return (
+    <SettingsPasswordGate>
     <div className="min-h-screen bg-[var(--bg-color)] bg-[image:var(--bg-image)] bg-fixed">
       <div className="container mx-auto px-4 py-8 max-w-4xl space-y-8">
         {/* Header */}
@@ -85,6 +94,16 @@ export default function SettingsPage() {
           onRemove={handleRemovePassword}
         />
 
+        {/* Settings Password Protection */}
+        <SettingsPasswordSettings
+          enabled={settingsPasswordEnabled}
+          passwords={settingsPasswords}
+          envSettingsPasswordSet={envSettingsPasswordSet}
+          onToggle={handleSettingsPasswordToggle}
+          onAdd={handleAddSettingsPassword}
+          onRemove={handleRemoveSettingsPassword}
+        />
+
         {/* Display Settings */}
         <DisplaySettings
           realtimeLatency={realtimeLatency}
@@ -171,6 +190,7 @@ export default function SettingsPage() {
         dangerous
       />
     </div>
+    </SettingsPasswordGate>
   );
 }
 

components/SettingsPasswordGate.tsx

@@ -0,0 +1,182 @@
+'use client';
+
+import { useState, useEffect } from 'react';
+import { settingsStore } from '@/lib/store/settings-store';
+import { Lock } from 'lucide-react';
+
+const SESSION_KEY = 'kvideo-settings-unlocked';
+
+export function SettingsPasswordGate({ children }: { children: React.ReactNode }) {
+    const [isLocked, setIsLocked] = useState(true);
+    const [password, setPassword] = useState('');
+    const [error, setError] = useState(false);
+    const [isClient, setIsClient] = useState(false);
+    const [hasEnvSettingsPassword, setHasEnvSettingsPassword] = useState(false);
+    const [isValidating, setIsValidating] = useState(false);
+
+    useEffect(() => {
+        let mounted = true;
+
+        const init = async () => {
+            const settings = settingsStore.getSettings();
+            const sessionUnlocked = sessionStorage.getItem(SESSION_KEY) === 'true';
+
+            const isProtected = (settings.settingsPasswordEnabled && settings.settingsPasswords.length > 0);
+            const localLocked = isProtected && !sessionUnlocked;
+
+            if (mounted) {
+                setIsLocked(localLocked);
+                setIsClient(true);
+            }
+
+            // Fetch remote config for env settings password
+            try {
+                const res = await fetch('/api/config');
+                if (!res.ok) throw new Error('Failed to fetch config');
+                const data = await res.json();
+
+                if (mounted) {
+                    setHasEnvSettingsPassword(data.hasEnvSettingsPassword);
+
+                    const isProtectedNow = (settings.settingsPasswordEnabled && settings.settingsPasswords.length > 0) || data.hasEnvSettingsPassword;
+                    setIsLocked(isProtectedNow && !sessionUnlocked);
+                }
+            } catch (e) {
+                console.error('SettingsPasswordGate init failed:', e);
+            }
+        };
+
+        init();
+
+        return () => { mounted = false; };
+    }, []);
+
+    // Subscribe to settings changes (auto-unlock if all passwords removed)
+    useEffect(() => {
+        const handleSettingsUpdate = () => {
+            const settings = settingsStore.getSettings();
+            const sessionUnlocked = sessionStorage.getItem(SESSION_KEY) === 'true';
+            const isProtected = (settings.settingsPasswordEnabled && settings.settingsPasswords.length > 0) || hasEnvSettingsPassword;
+
+            if (!isProtected) {
+                setIsLocked(false);
+            } else if (!sessionUnlocked) {
+                setIsLocked(true);
+            }
+        };
+
+        const unsubscribe = settingsStore.subscribe(handleSettingsUpdate);
+        return () => unsubscribe();
+    }, [hasEnvSettingsPassword]);
+
+    const handleUnlock = async (e: React.FormEvent) => {
+        e.preventDefault();
+        setIsValidating(true);
+
+        const settings = settingsStore.getSettings();
+
+        const setUnlocked = () => {
+            sessionStorage.setItem(SESSION_KEY, 'true');
+            setIsLocked(false);
+            setError(false);
+            setIsValidating(false);
+        };
+
+        // Check local settings passwords first
+        if (settings.settingsPasswords.includes(password)) {
+            setUnlocked();
+            return;
+        }
+
+        // Then check env password via API
+        if (hasEnvSettingsPassword) {
+            try {
+                const res = await fetch('/api/config', {
+                    method: 'POST',
+                    headers: { 'Content-Type': 'application/json' },
+                    body: JSON.stringify({ password, type: 'settings' }),
+                });
+                const data = await res.json();
+                if (data.valid) {
+                    setUnlocked();
+                    return;
+                }
+            } catch {
+                // API error
+            }
+        }
+
+        // Password didn't match
+        setError(true);
+        setIsValidating(false);
+        const form = document.getElementById('settings-password-form');
+        form?.classList.add('animate-shake');
+        setTimeout(() => form?.classList.remove('animate-shake'), 500);
+    };
+
+    if (!isClient) return null;
+
+    if (!isLocked) {
+        return <>{children}</>;
+    }
+
+    return (
+        <div className="min-h-screen flex items-center justify-center bg-[var(--bg-color)] bg-[image:var(--bg-image)] text-[var(--text-color)]">
+            <div className="w-full max-w-md p-4">
+                <form
+                    id="settings-password-form"
+                    onSubmit={handleUnlock}
+                    className="bg-[var(--glass-bg)] backdrop-blur-[25px] saturate-[180%] border border-[var(--glass-border)] rounded-[var(--radius-2xl)] p-8 shadow-[var(--shadow-md)] flex flex-col items-center gap-6 transition-all duration-[0.4s] cubic-bezier(0.2,0.8,0.2,1)"
+                >
+                    <div className="w-16 h-16 rounded-[var(--radius-full)] bg-[var(--accent-color)]/10 flex items-center justify-center text-[var(--accent-color)] mb-2 shadow-[var(--shadow-sm)] border border-[var(--glass-border)]">
+                        <Lock size={32} />
+                    </div>
+
+                    <div className="text-center space-y-2">
+                        <h2 className="text-2xl font-bold">设置已锁定</h2>
+                        <p className="text-[var(--text-color-secondary)]">请输入设置密码以继续</p>
+                    </div>
+
+                    <div className="w-full space-y-4">
+                        <div className="space-y-2">
+                            <input
+                                type="password"
+                                value={password}
+                                onChange={(e) => {
+                                    setPassword(e.target.value);
+                                    setError(false);
+                                }}
+                                placeholder="输入密码..."
+                                className={`w-full px-4 py-3 rounded-[var(--radius-2xl)] bg-[var(--glass-bg)] border ${error ? 'border-red-500' : 'border-[var(--glass-border)]'
+                                    } focus:outline-none focus:border-[var(--accent-color)] focus:shadow-[0_0_0_3px_color-mix(in_srgb,var(--accent-color)_30%,transparent)] transition-all duration-[0.4s] cubic-bezier(0.2,0.8,0.2,1) text-[var(--text-color)] placeholder-[var(--text-color-secondary)]`}
+                                autoFocus
+                            />
+                            {error && (
+                                <p className="text-sm text-red-500 text-center animate-pulse">
+                                    密码错误
+                                </p>
+                            )}
+                        </div>
+
+                        <button
+                            type="submit"
+                            className="w-full py-3 px-4 bg-[var(--accent-color)] text-white font-bold rounded-[var(--radius-2xl)] hover:translate-y-[-2px] hover:brightness-110 shadow-[var(--shadow-sm)] hover:shadow-[0_4px_8px_var(--shadow-color)] active:translate-y-0 active:scale-[0.98] transition-all duration-200"
+                        >
+                            解锁设置
+                        </button>
+                    </div>
+                </form>
+            </div>
+            <style jsx global>{`
+                @keyframes shake {
+                    0%, 100% { transform: translateX(0); }
+                    25% { transform: translateX(-5px); }
+                    75% { transform: translateX(5px); }
+                }
+                .animate-shake {
+                    animation: shake 0.3s cubic-bezier(.36,.07,.19,.97) both;
+                }
+            `}</style>
+        </div>
+    );
+}

components/settings/SettingsPasswordSettings.tsx

@@ -0,0 +1,156 @@
+'use client';
+
+import { useState } from 'react';
+import { SettingsSection } from './SettingsSection';
+import { Trash2, Plus, Eye, EyeOff, Shield, ShieldCheck } from 'lucide-react';
+import { Switch } from '@/components/ui/Switch';
+
+interface SettingsPasswordSettingsProps {
+    enabled: boolean;
+    passwords: string[];
+    envSettingsPasswordSet: boolean;
+    onToggle: (enabled: boolean) => void;
+    onAdd: (password: string) => void;
+    onRemove: (password: string) => void;
+}
+
+export function SettingsPasswordSettings({
+    enabled,
+    passwords,
+    envSettingsPasswordSet,
+    onToggle,
+    onAdd,
+    onRemove,
+}: SettingsPasswordSettingsProps) {
+    const [newPassword, setNewPassword] = useState('');
+    const [error, setError] = useState('');
+    const [showPassword, setShowPassword] = useState(false);
+
+    const handleAdd = (e: React.FormEvent) => {
+        e.preventDefault();
+        if (!newPassword) return;
+
+        if (passwords.includes(newPassword)) {
+            setError('密码已存在');
+            return;
+        }
+
+        onAdd(newPassword);
+        setNewPassword('');
+        setError('');
+    };
+
+    const isActive = enabled || envSettingsPasswordSet;
+
+    return (
+        <SettingsSection title="设置页密码保护" description="为设置页面单独设置密码保护，防止他人修改应用配置。">
+            <div className="space-y-6">
+                {/* Toggle - only shown if no env password */}
+                {!envSettingsPasswordSet && (
+                    <div className="flex items-center justify-between">
+                        <label className="text-sm font-medium text-[var(--text-color)]">
+                            启用设置页密码
+                        </label>
+                        <Switch
+                            checked={enabled}
+                            onChange={onToggle}
+                            ariaLabel="启用设置页密码开关"
+                        />
+                    </div>
+                )}
+
+                {/* Env Password Notice */}
+                {envSettingsPasswordSet && (
+                    <div className="flex items-center gap-3 p-4 bg-[color-mix(in_srgb,var(--accent-color)_10%,transparent)] border border-[var(--accent-color)]/30 rounded-[var(--radius-2xl)]">
+                        <ShieldCheck className="text-[var(--accent-color)] shrink-0" size={24} />
+                        <div>
+                            <p className="text-sm font-medium text-[var(--text-color)]">
+                                环境变量密码已启用
+                            </p>
+                            <p className="text-xs text-[var(--text-color-secondary)]">
+                                通过 <code className="px-1 py-0.5 bg-[var(--glass-bg)] rounded">SETTINGS_PASSWORD</code> 环境变量设置，无法在此删除
+                            </p>
+                        </div>
+                    </div>
+                )}
+
+                {isActive && (
+                    <div className="space-y-4 pt-4 border-t border-[var(--glass-border)] animate-in fade-in slide-in-from-top-2">
+                        {/* Local Passwords Section */}
+                        <div className="space-y-2">
+                            <div className="flex items-center gap-2">
+                                <Shield size={16} className="text-[var(--text-color-secondary)]" />
+                                <h4 className="text-sm font-medium text-[var(--text-color)]">本地保存密码</h4>
+                            </div>
+                            <p className="text-xs text-[var(--text-color-secondary)]">
+                                仅在当前浏览器/设备有效，可随时添加或删除
+                            </p>
+
+                            {passwords.length === 0 && !envSettingsPasswordSet && (
+                                <p className="text-sm text-[var(--text-color-secondary)] italic">
+                                    未设置本地密码。在至少添加一个密码之前，任何人都可以访问设置。
+                                </p>
+                            )}
+
+                            {passwords.length === 0 && envSettingsPasswordSet && (
+                                <p className="text-sm text-[var(--text-color-secondary)] italic">
+                                    暂无本地密码。可以添加额外的本地密码作为备用。
+                                </p>
+                            )}
+
+                            <div className="flex flex-wrap gap-2">
+                                {passwords.map((pwd, index) => (
+                                    <div
+                                        key={index}
+                                        className="flex items-center gap-2 px-3 py-1.5 bg-[var(--glass-bg)] border border-[var(--glass-border)] rounded-[var(--radius-full)] text-sm transition-all duration-300 hover:scale-105"
+                                    >
+                                        <span className="font-mono">{showPassword ? pwd : '••••••'}</span>
+                                        <button
+                                            onClick={() => onRemove(pwd)}
+                                            className="text-[var(--text-color-secondary)] hover:text-red-500 transition-colors cursor-pointer"
+                                            title="删除密码"
+                                        >
+                                            <Trash2 size={14} />
+                                        </button>
+                                    </div>
+                                ))}
+                            </div>
+                        </div>
+
+                        <form onSubmit={handleAdd} className="flex gap-2 items-start">
+                            <div className="flex-1 space-y-1">
+                                <div className="relative">
+                                    <input
+                                        type={showPassword ? "text" : "password"}
+                                        value={newPassword}
+                                        onChange={(e) => {
+                                            setNewPassword(e.target.value);
+                                            setError('');
+                                        }}
+                                        placeholder="添加新的设置密码..."
+                                        className="w-full px-4 py-2 pr-10 rounded-[var(--radius-2xl)] bg-[var(--glass-bg)] border border-[var(--glass-border)] focus:outline-none focus:border-[var(--accent-color)] focus:shadow-[0_0_0_3px_color-mix(in_srgb,var(--accent-color)_30%,transparent)] transition-all duration-[0.4s] cubic-bezier(0.2,0.8,0.2,1) text-sm"
+                                    />
+                                    <button
+                                        type="button"
+                                        onClick={() => setShowPassword(!showPassword)}
+                                        className="absolute right-3 top-1/2 -translate-y-1/2 text-[var(--text-color-secondary)] hover:text-[var(--text-color)] transition-colors cursor-pointer"
+                                    >
+                                        {showPassword ? <EyeOff size={16} /> : <Eye size={16} />}
+                                    </button>
+                                </div>
+                                {error && <p className="text-xs text-red-500 pl-2">{error}</p>}
+                            </div>
+                            <button
+                                type="submit"
+                                disabled={!newPassword}
+                                className="p-2 bg-[var(--accent-color)] text-white rounded-[var(--radius-2xl)] hover:translate-y-[-2px] hover:brightness-110 shadow-[var(--shadow-sm)] hover:shadow-[0_4px_8px_var(--shadow-color)] disabled:opacity-50 disabled:cursor-not-allowed disabled:transform-none disabled:shadow-none transition-all duration-200 cursor-pointer"
+                            >
+                                <Plus size={20} />
+                            </button>
+                        </form>
+                    </div>
+                )}
+            </div>
+        </SettingsSection>
+    );
+}

lib/store/settings-store.ts

@@ -30,6 +30,8 @@ export interface AppSettings {
   watchHistory: boolean;
   passwordAccess: boolean;
   accessPasswords: string[];
+  settingsPasswordEnabled: boolean;
+  settingsPasswords: string[];
   // Player settings
   autoNextEpisode: boolean;
   autoSkipIntro: boolean;
@@ -106,6 +108,8 @@ function getDefaultAppSettings(): AppSettings {
     watchHistory: true,
     passwordAccess: false,
     accessPasswords: [],
+    settingsPasswordEnabled: false,
+    settingsPasswords: [],
     autoNextEpisode: true,
     autoSkipIntro: false,
     skipIntroSeconds: 0,
@@ -184,6 +188,8 @@ export const settingsStore = {
         watchHistory: parsed.watchHistory !== undefined ? parsed.watchHistory : true,
         passwordAccess: parsed.passwordAccess !== undefined ? parsed.passwordAccess : false,
         accessPasswords: Array.isArray(parsed.accessPasswords) ? parsed.accessPasswords : [],
+        settingsPasswordEnabled: parsed.settingsPasswordEnabled !== undefined ? parsed.settingsPasswordEnabled : false,
+        settingsPasswords: Array.isArray(parsed.settingsPasswords) ? parsed.settingsPasswords : [],
         autoNextEpisode: parsed.autoNextEpisode !== undefined ? parsed.autoNextEpisode : true,
         autoSkipIntro: parsed.autoSkipIntro !== undefined ? parsed.autoSkipIntro : false,
         skipIntroSeconds: typeof parsed.skipIntroSeconds === 'number' ? parsed.skipIntroSeconds : 0,

package-lock.json

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

package.json

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