feat: AI未配置时禁用所有AI功能UI入口 - 新增useAIStatus全局hook(模块级缓存+监听者模式) - 首页/漫画详情/阅读器/小说/推荐页AI按钮条件渲染 - AI设置保存后刷新全局状态缓存

Author: cropflre

frontend/src/app/novel/[id]/page.tsx

@@ -21,13 +21,15 @@ import { useTranslation, useLocale } from "@/lib/i18n";
 import { useTheme } from "@/lib/theme-context";
 import type { ReaderTheme } from "@/components/reader/ReaderToolbar";
 import AIChatPanel from "@/components/reader/AIChatPanel";
+import { useAIStatus } from "@/hooks/useAIStatus";
 
 export default function NovelReaderPage() {
   const params = useParams();
   const router = useRouter();
   const comicId = params.id as string;
   const t = useTranslation();
   const { locale } = useLocale();
+  const { aiConfigured } = useAIStatus();
 
   // Fetch chapters from API
   const {
@@ -351,13 +353,15 @@ export default function NovelReaderPage() {
       />
 
       {/* AI Chat Panel */}
-      <AIChatPanel
-        comicId={comicId}
-        locale={locale}
-        contextText={currentChapterText}
-        contextLabel={`${apiChapters[currentPage]?.title || `Chapter ${currentPage + 1}`} (${currentPage + 1}/${totalChapters})`}
-        readerTheme={readerTheme}
-      />
+      {aiConfigured && (
+        <AIChatPanel
+          comicId={comicId}
+          locale={locale}
+          contextText={currentChapterText}
+          contextLabel={`${apiChapters[currentPage]?.title || `Chapter ${currentPage + 1}`} (${currentPage + 1}/${totalChapters})`}
+          readerTheme={readerTheme}
+        />
+      )}
 
       {/* Info Panel (slide-in from right) */}
       {showInfoPanel && (

frontend/src/app/reader/[id]/page.tsx

@@ -37,6 +37,7 @@ export default function ReaderPage() {
   const { aiConfigured } = useAIStatus();
 
   // Try API first
+  const {
     pages: apiPages,
     title: apiTitle,
     isNovel,

frontend/src/app/recommendations/page.tsx

@@ -5,6 +5,7 @@ import Link from "next/link";
 import Image from "next/image";
 import { ArrowLeft, Sparkles, RefreshCw, Brain, Loader2 } from "lucide-react";
 import { useTranslation, useLocale } from "@/lib/i18n";
+import { useAIStatus } from "@/hooks/useAIStatus";
 
 interface RecommendedComic {
   id: string;
@@ -21,6 +22,7 @@ interface RecommendedComic {
 export default function RecommendationsPage() {
   const t = useTranslation();
   const locale = useLocale();
+  const { aiConfigured } = useAIStatus();
   const [recommendations, setRecommendations] = useState<RecommendedComic[]>([]);
   const [loading, setLoading] = useState(true);
   const [aiReasonsLoading, setAiReasonsLoading] = useState(false);
@@ -99,14 +101,16 @@ export default function RecommendationsPage() {
             </h1>
           </div>
           <div className="flex-1" />
-          <button
-            onClick={fetchAiReasons}
-            disabled={aiReasonsLoading || recommendations.length === 0}
-            className="flex items-center gap-1.5 rounded-lg bg-purple-500/10 px-3 py-1.5 text-sm text-purple-400 transition-colors hover:bg-purple-500/20 disabled:opacity-50"
-          >
-            {aiReasonsLoading ? <Loader2 className="h-4 w-4 animate-spin" /> : <Brain className="h-4 w-4" />}
-            {t.recommend?.aiReasonGenerate || "AI Reasons"}
-          </button>
+          {aiConfigured && (
+            <button
+              onClick={fetchAiReasons}
+              disabled={aiReasonsLoading || recommendations.length === 0}
+              className="flex items-center gap-1.5 rounded-lg bg-purple-500/10 px-3 py-1.5 text-sm text-purple-400 transition-colors hover:bg-purple-500/20 disabled:opacity-50"
+            >
+              {aiReasonsLoading ? <Loader2 className="h-4 w-4 animate-spin" /> : <Brain className="h-4 w-4" />}
+              {t.recommend?.aiReasonGenerate || "AI Reasons"}
+            </button>
+          )}
           <button
             onClick={fetchRecommendations}
             disabled={loading}

frontend/src/components/AISettingsPanel.tsx

@@ -17,6 +17,7 @@ import {
   XCircle,
 } from "lucide-react";
 import { useTranslation } from "@/lib/i18n";
+import { useAIStatus } from "@/hooks/useAIStatus";
 
 type CloudProvider =
   | "openai"
@@ -111,6 +112,7 @@ interface AIUsageStats {
 
 export function AISettingsPanel() {
   const t = useTranslation();
+  const { refreshAIStatus } = useAIStatus();
   const [config, setConfig] = useState<AIConfig | null>(null);
   const [status, setStatus] = useState<AIStatus | null>(null);
   const [saving, setSaving] = useState(false);
@@ -154,6 +156,8 @@ export function AISettingsPanel() {
       // Refresh status
       const st = await fetch("/api/ai/status").then((r) => r.json());
       setStatus(st);
+      // 刷新全局AI状态缓存
+      refreshAIStatus();
     } finally {
       setSaving(false);
     }

frontend/src/components/reader/TextReaderView.tsx

@@ -4,6 +4,7 @@ import { useState, useEffect, useRef, useCallback } from "react";
 import { ChevronLeft, ChevronRight, List, Minus, Plus, Type, Brain, Loader2 } from "lucide-react";
 import type { ReaderTheme } from "@/components/reader/ReaderToolbar";
 import { useLocale } from "@/lib/i18n";
+import { useAIStatus } from "@/hooks/useAIStatus";
 
 interface ChapterInfo {
   index: number;
@@ -38,6 +39,7 @@ export default function TextReaderView({
   comicId,
 }: TextReaderViewProps) {
   const { locale } = useLocale();
+  const { aiConfigured } = useAIStatus();
   const [content, setContent] = useState("");
   const [chapterTitle, setChapterTitle] = useState("");
   const [isHTML, setIsHTML] = useState(false);
@@ -551,7 +553,7 @@ export default function TextReaderView({
                 目录 ({chapters.length} 章)
               </h3>
               <div className="flex items-center gap-2">
-                {comicId && (
+                {comicId && aiConfigured && (
                   <button
                     onClick={() => setShowSummaries((v) => !v)}
                     className={`flex items-center gap-1 rounded-lg px-2 py-1 text-[10px] transition-colors ${
@@ -620,7 +622,7 @@ export default function TextReaderView({
                     )}
                   </span>
                   {/* AI 摘要按钮 */}
-                  {showSummaries && comicId && !chapterSummaries[i] && summaryLoadingIdx !== i && (
+                  {showSummaries && comicId && aiConfigured && !chapterSummaries[i] && summaryLoadingIdx !== i && (
                     <button
                       onClick={(e) => {
                         e.stopPropagation();