fix: show notice for gpt-5 api key requirement

This commit is contained in:
Suraj Jha 2025-08-09 17:41:57 +05:45
parent 68bb4bae3a
commit 3b49264b24
No known key found for this signature in database
GPG key ID: 5AC6C16355CE2C14
3 changed files with 8 additions and 45 deletions

View file

@ -1,20 +0,0 @@
import React from "react";
import Header from "@/components/Header";
export const AnthropicKeyWarning: React.FC = () => {
return (
<div className="min-h-screen font-roboto bg-gradient-to-br from-slate-50 to-slate-100">
<Header />
<div className="flex items-center justify-center aspect-video mx-auto px-6">
<div className="text-center space-y-2 my-6 bg-white p-10 rounded-lg shadow-lg">
<h1 className="text-xl font-bold text-gray-900">
Please put Anthropic Key To Process The Layout
</h1>
<p className="text-lg text-gray-600 max-w-2xl mx-auto">
It Only works on Anthropic(Claude-4).
</p>
</div>
</div>
</div>
);
};

View file

@ -1,17 +0,0 @@
import { useState, useEffect } from "react";
export const useAnthropicKeyCheck = () => {
const [hasAnthropicKey, setHasAnthropicKey] = useState(false);
const [isAnthropicKeyLoading, setIsAnthropicKeyLoading] = useState(true);
useEffect(() => {
fetch("/api/has-anthropic-key")
.then((res) => res.json())
.then((data) => {
setHasAnthropicKey(data.hasKey);
setIsAnthropicKeyLoading(false);
});
}, []);
return { hasAnthropicKey, isAnthropicKeyLoading };
};

View file

@ -9,9 +9,9 @@ import { useFontManagement } from "./hooks/useFontManagement";
import { useFileUpload } from "./hooks/useFileUpload";
import { useSlideProcessing } from "./hooks/useSlideProcessing";
import { useLayoutSaving } from "./hooks/useLayoutSaving";
import { useAnthropicKeyCheck } from "./hooks/useAnthropicKeyCheck";
import { useOpenAIKeyCheck } from "./hooks/useOpenAIKeyCheck";
import { LoadingSpinner } from "./components/LoadingSpinner";
import { AnthropicKeyWarning } from "./components/AnthropicKeyWarning";
import { OpenAIKeyWarning } from "./components/OpenAIKeyWarning";
import { FileUploadSection } from "./components/FileUploadSection";
import { SaveLayoutButton } from "./components/SaveLayoutButton";
import { SaveLayoutModal } from "./components/SaveLayoutModal";
@ -22,7 +22,7 @@ const CustomLayoutPage = () => {
const { refetch } = useLayout();
// Custom hooks for different concerns
const { hasAnthropicKey, isAnthropicKeyLoading } = useAnthropicKeyCheck();
const { hasOpenAIKey, isOpenAIKeyLoading } = useOpenAIKeyCheck();
const { selectedFile, handleFileSelect, removeFile } = useFileUpload();
const { slides, setSlides, completedSlides } = useCustomLayout();
const { fontsData, UploadedFonts, uploadFont, removeFont, getAllUnsupportedFonts, setFontsData } = useFontManagement();
@ -58,13 +58,13 @@ const CustomLayoutPage = () => {
};
// Loading state
if (isAnthropicKeyLoading) {
return <LoadingSpinner message="Checking Anthropic Key..." />;
if (isOpenAIKeyLoading) {
return <LoadingSpinner message="Checking OpenAI API Key..." />;
}
// Anthropic key warning
if (!hasAnthropicKey) {
return <AnthropicKeyWarning />;
// OpenAI key warning
if (!hasOpenAIKey) {
return <OpenAIKeyWarning />;
}
return (