feat: dynamic site name

src/components/MobileHeader.tsx

@@ -2,9 +2,11 @@
 
 import Link from 'next/link';
 
+import { useSite } from './SiteProvider';
 import { ThemeToggle } from './ThemeToggle';
 
 const MobileHeader = () => {
+  const { siteName } = useSite();
   return (
     <header className='md:hidden relative w-full bg-white/70 backdrop-blur-xl border-b border-gray-200/50 shadow-sm dark:bg-gray-900/70 dark:border-gray-700/50'>
       <div className='h-12 flex items-center justify-center'>
@@ -12,7 +14,7 @@ const MobileHeader = () => {
           href='/'
           className='text-2xl font-bold text-green-600 tracking-tight hover:opacity-80 transition-opacity'
         >
-          MoonTV
+          {siteName}
         </Link>
       </div>
       <div className='absolute top-1/2 right-4 -translate-y-1/2'>

src/components/Sidebar.tsx

@@ -1,3 +1,5 @@
+'use client';
+
 import {
   Clover,
   Film,
@@ -22,6 +24,8 @@ import {
   useState,
 } from 'react';
 
+import { useSite } from './SiteProvider';
+
 interface SidebarContextType {
   isCollapsed: boolean;
 }
@@ -33,16 +37,19 @@ const SidebarContext = createContext<SidebarContextType>({
 export const useSidebar = () => useContext(SidebarContext);
 
 // 可替换为你自己的 logo 图片
-const Logo = () => (
-  <Link
-    href='/'
-    className='flex items-center justify-center h-16 select-none hover:opacity-80 transition-opacity duration-200'
-  >
-    <span className='text-2xl font-bold text-green-600 tracking-tight'>
-      MoonTV
-    </span>
-  </Link>
-);
+const Logo = () => {
+  const { siteName } = useSite();
+  return (
+    <Link
+      href='/'
+      className='flex items-center justify-center h-16 select-none hover:opacity-80 transition-opacity duration-200'
+    >
+      <span className='text-2xl font-bold text-green-600 tracking-tight'>
+        {siteName}
+      </span>
+    </Link>
+  );
+};
 
 interface SidebarProps {
   onToggle?: (collapsed: boolean) => void;

src/components/SiteProvider.tsx

@@ -0,0 +1,21 @@
+'use client';
+
+import { createContext, ReactNode, useContext } from 'react';
+
+const SiteContext = createContext<{ siteName: string }>({
+  siteName: 'MoonTV', // Default value
+});
+
+export const useSite = () => useContext(SiteContext);
+
+export function SiteProvider({
+  children,
+  siteName,
+}: {
+  children: ReactNode;
+  siteName: string;
+}) {
+  return (
+    <SiteContext.Provider value={{ siteName }}>{children}</SiteContext.Provider>
+  );
+}