Remove unused components and models for improved maintainability
- Deleted redundant components (`AddActionButton`, `AlertBox`, `AlertStack`, `BackButton`, `CancelButton`, and `CollapsableArea`) and related files. - Removed unused models (`Book`, `BookSerie`, `BookTables`, `Character`, and `Chapter`) to reduce codebase clutter. - Updated project structure and references to reflect these removals.
This commit is contained in:
natreex
@@ -1,34 +1,37 @@
|
||||
import {ChangeEvent, useContext, useEffect, useState} from "react";
|
||||
import {SessionContext} from "@/context/SessionContext";
|
||||
import {BookContext} from "@/context/BookContext";
|
||||
import {ChapterContext} from "@/context/ChapterContext";
|
||||
import {AlertContext} from "@/context/AlertContext";
|
||||
import {AIInspire, InspirationAIIdea} from "@/lib/models/QuillSense";
|
||||
import System from "@/lib/models/System";
|
||||
import React, {ChangeEvent, useContext, useEffect, useState} from "react";
|
||||
import {SessionContext, SessionContextProps} from "@/context/SessionContext";
|
||||
import {BookContext, BookContextProps} from "@/context/BookContext";
|
||||
import {ChapterContext, ChapterContextProps} from "@/context/ChapterContext";
|
||||
import {AlertContext, AlertContextProps} from "@/context/AlertContext";
|
||||
import {AIInspire, InspirationAIIdea} from "@/lib/types/quillsense";
|
||||
import {apiPost} from '@/lib/api/client';
|
||||
import {htmlToText} from '@/lib/utils/html';
|
||||
import InputField from "@/components/form/InputField";
|
||||
import TextInput from "@/components/form/TextInput";
|
||||
import {faArrowRight, faLightbulb, faLink, faLock} from "@fortawesome/free-solid-svg-icons";
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {ArrowRight, Lightbulb, Link} from "lucide-react";
|
||||
import {useTranslations} from '@/lib/i18n';
|
||||
import {LangContext, LangContextProps} from "@/context/LangContext";
|
||||
import {EditorContext} from "@/context/EditorContext";
|
||||
import {EditorContext, EditorContextProps} from "@/context/EditorContext";
|
||||
import {AIUsageContext, AIUsageContextProps} from "@/context/AIUsageContext";
|
||||
import EmptyState from "@/components/ui/EmptyState";
|
||||
import PulseLoader from "@/components/ui/PulseLoader";
|
||||
import LockCard from "@/components/ui/LockCard";
|
||||
|
||||
export default function InspireMe({hasKey}: { hasKey: boolean }) {
|
||||
export default function InspireMe({hasKey}: { hasKey: boolean }): React.JSX.Element {
|
||||
const t = useTranslations();
|
||||
const {session} = useContext(SessionContext);
|
||||
const {editor} = useContext(EditorContext);
|
||||
const {book} = useContext(BookContext);
|
||||
const {chapter} = useContext(ChapterContext);
|
||||
const {errorMessage} = useContext(AlertContext);
|
||||
const {lang} = useContext<LangContextProps>(LangContext);
|
||||
const {setTotalCredits, setTotalPrice} = useContext<AIUsageContextProps>(AIUsageContext);
|
||||
const {session}: SessionContextProps = useContext<SessionContextProps>(SessionContext);
|
||||
const {editor}: EditorContextProps = useContext<EditorContextProps>(EditorContext);
|
||||
const {book}: BookContextProps = useContext<BookContextProps>(BookContext);
|
||||
const {chapter}: ChapterContextProps = useContext<ChapterContextProps>(ChapterContext);
|
||||
const {errorMessage}: AlertContextProps = useContext<AlertContextProps>(AlertContext);
|
||||
const {lang}: LangContextProps = useContext<LangContextProps>(LangContext);
|
||||
const {setTotalCredits, setTotalPrice}: AIUsageContextProps = useContext<AIUsageContextProps>(AIUsageContext);
|
||||
const [prompt, setPrompt] = useState<string>('');
|
||||
|
||||
|
||||
const [hideHelp, setHideHelp] = useState<boolean>(true);
|
||||
const [loading, setLoading] = useState<boolean>(false);
|
||||
const [inspirations, setInspirations] = useState<InspirationAIIdea[]>([]);
|
||||
|
||||
|
||||
useEffect((): void => {
|
||||
if (prompt.trim().length > 0) {
|
||||
setHideHelp(true);
|
||||
@@ -36,7 +39,7 @@ export default function InspireMe({hasKey}: { hasKey: boolean }) {
|
||||
setHideHelp(false);
|
||||
}
|
||||
}, [prompt]);
|
||||
|
||||
|
||||
async function handleInspireMe(): Promise<void> {
|
||||
if (prompt.trim() === '') {
|
||||
errorMessage(t("inspireMe.emptyPromptError"));
|
||||
@@ -44,36 +47,34 @@ export default function InspireMe({hasKey}: { hasKey: boolean }) {
|
||||
}
|
||||
setLoading(true);
|
||||
setInspirations([]);
|
||||
|
||||
|
||||
try {
|
||||
let content: string = '';
|
||||
if (editor) {
|
||||
try {
|
||||
content = editor.getHTML();
|
||||
content = System.htmlToText(content);
|
||||
content = htmlToText(content);
|
||||
} catch (e: unknown) {
|
||||
if (e instanceof Error) {
|
||||
errorMessage('Erreur lors de la récupération du contenu.');
|
||||
console.error('Erreur lors de la récupération du contenu.');
|
||||
errorMessage(t('inspireMe.error.contentRetrieval'));
|
||||
} else {
|
||||
errorMessage('Erreur inconnue lors de la récupération du contenu.')
|
||||
console.error('Erreur inconnue lors de la récupération du contenu.');
|
||||
errorMessage(t('inspireMe.error.contentRetrievalUnknown'));
|
||||
}
|
||||
setLoading(false);
|
||||
return;
|
||||
}
|
||||
}
|
||||
if (!book?.bookId) {
|
||||
errorMessage('Aucun livre sélectionné.');
|
||||
errorMessage(t('inspireMe.error.noBook'));
|
||||
setLoading(false);
|
||||
return;
|
||||
}
|
||||
if (chapter?.chapterOrder === undefined) {
|
||||
errorMessage('Aucun chapitre sélectionné.');
|
||||
errorMessage(t('inspireMe.error.noChapter'));
|
||||
setLoading(false);
|
||||
return;
|
||||
}
|
||||
const inspire: AIInspire = await System.authPostToServer<AIInspire>(
|
||||
const inspire: AIInspire = await apiPost<AIInspire>(
|
||||
`quillsense/inspire`,
|
||||
{
|
||||
prompt: prompt,
|
||||
@@ -94,106 +95,72 @@ export default function InspireMe({hasKey}: { hasKey: boolean }) {
|
||||
if (e instanceof Error) {
|
||||
errorMessage(e.message);
|
||||
} else {
|
||||
errorMessage(`Une erreur inconnue est survenue lors de la génération.`);
|
||||
errorMessage(t('inspireMe.error.unknown'));
|
||||
}
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
if (!hasKey) {
|
||||
return (
|
||||
<div className="flex flex-col h-full bg-secondary/20 backdrop-blur-sm">
|
||||
<div className="flex-1 p-6 overflow-y-auto flex items-center justify-center">
|
||||
<div className="max-w-md mx-auto">
|
||||
<div
|
||||
className="bg-tertiary/90 backdrop-blur-sm border border-secondary/50 rounded-2xl p-8 text-center shadow-2xl">
|
||||
<div
|
||||
className="w-20 h-20 mx-auto mb-6 bg-primary rounded-2xl flex items-center justify-center shadow-lg">
|
||||
<FontAwesomeIcon icon={faLock} className="w-10 h-10 text-text-primary"/>
|
||||
</div>
|
||||
|
||||
<h3 className="text-xl font-['ADLaM_Display'] text-text-primary mb-4">
|
||||
Accès requis
|
||||
</h3>
|
||||
|
||||
<p className="text-muted leading-relaxed text-lg">
|
||||
Un abonnement de niveau de base de QuillSense ou une clé API OpenAI est requis pour
|
||||
activer le mode "Inspire-moi".
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
return <LockCard title={t('inspireMe.locked.title')}
|
||||
description={t('inspireMe.locked.description')}/>;
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<div className="flex flex-col h-full bg-secondary/20 backdrop-blur-sm overflow-hidden">
|
||||
<div className="p-5 border-b border-secondary/50 bg-secondary/30 shadow-sm">
|
||||
<div className="flex flex-col h-full overflow-hidden">
|
||||
<div className="p-5 bg-darkest-background">
|
||||
<InputField
|
||||
input={
|
||||
<TextInput
|
||||
value={prompt}
|
||||
setValue={(e: ChangeEvent<HTMLInputElement>) => setPrompt(e.target.value)}
|
||||
setValue={(e: ChangeEvent<HTMLInputElement>): void => setPrompt(e.target.value)}
|
||||
placeholder={t("inspireMe.inputPlaceholder")}
|
||||
/>
|
||||
}
|
||||
icon={faLightbulb}
|
||||
icon={Lightbulb}
|
||||
fieldName={t("inspireMe.fieldName")}
|
||||
actionLabel={t("inspireMe.actionLabel")}
|
||||
actionIcon={faLightbulb}
|
||||
action={async () => handleInspireMe()}
|
||||
actionIcon={Lightbulb}
|
||||
action={async (): Promise<void> => handleInspireMe()}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="flex-1 overflow-y-auto p-4">
|
||||
{loading && (
|
||||
<div className="flex items-center justify-center h-32">
|
||||
<div className="animate-pulse flex flex-col items-center">
|
||||
<div
|
||||
className="w-12 h-12 border-4 border-primary border-t-transparent rounded-full animate-spin mb-3"></div>
|
||||
<p className="text-text-secondary">{t("inspireMe.loading")}</p>
|
||||
</div>
|
||||
</div>
|
||||
<PulseLoader text={t("inspireMe.loading")}/>
|
||||
)}
|
||||
|
||||
{!loading && inspirations.length > 0 && (
|
||||
<div
|
||||
className="rounded-xl bg-tertiary/90 backdrop-blur-sm shadow-lg overflow-hidden border border-secondary/50">
|
||||
<div className="bg-primary/10 p-4 border-b border-secondary/30">
|
||||
<h3 className="text-xl font-['ADLaM_Display'] text-text-primary flex items-center gap-2">
|
||||
<FontAwesomeIcon icon={faLightbulb} className="text-primary w-6 h-6"/>
|
||||
<span>{t("inspireMe.resultHeading")}</span>
|
||||
</h3>
|
||||
</div>
|
||||
<div className="space-y-4">
|
||||
<h3 className="text-lg font-['ADLaM_Display'] text-text-primary flex items-center gap-2">
|
||||
<Lightbulb className="text-primary w-5 h-5" strokeWidth={1.75}/>
|
||||
<span>{t("inspireMe.resultHeading")}</span>
|
||||
</h3>
|
||||
|
||||
<div className="p-5 space-y-6">
|
||||
{inspirations.map((idea, index) => (
|
||||
<div className="space-y-4">
|
||||
{inspirations.map((idea: InspirationAIIdea, index: number): React.JSX.Element => (
|
||||
<div key={index}
|
||||
className="bg-secondary/20 rounded-xl shadow-md border border-secondary/30 hover:border-primary/50 hover:shadow-lg hover:scale-102 transition-all duration-200 overflow-hidden">
|
||||
<div className="p-4 bg-primary/10 border-b border-secondary/30">
|
||||
<h4 className="text-lg font-semibold text-primary">{idea.idea}</h4>
|
||||
</div>
|
||||
|
||||
className="bg-tertiary rounded-xl hover:bg-secondary transition-colors duration-150 overflow-hidden">
|
||||
<div className="p-4">
|
||||
<div className="mb-4">
|
||||
<div className="flex items-center mb-1.5 text-sm text-text-secondary">
|
||||
<FontAwesomeIcon icon={faArrowRight}
|
||||
className="mr-1.5 text-primary w-5 h-5"/>
|
||||
<h4 className="text-sm font-semibold text-primary mb-3">{idea.idea}</h4>
|
||||
|
||||
<div className="mb-3">
|
||||
<div className="flex items-center mb-1.5 text-xs text-text-secondary">
|
||||
<ArrowRight className="mr-1.5 text-primary w-4 h-4" strokeWidth={1.75}/>
|
||||
<span>{t("inspireMe.justificationHeading")}</span>
|
||||
</div>
|
||||
<p className="text-text-primary pl-5">{idea.reason}</p>
|
||||
<p className="text-text-primary text-sm pl-5">{idea.reason}</p>
|
||||
</div>
|
||||
|
||||
|
||||
<div>
|
||||
<div className="flex items-center mb-1.5 text-sm text-text-secondary">
|
||||
<FontAwesomeIcon icon={faLink} className="mr-1.5 text-primary w-5 h-5"/>
|
||||
<div className="flex items-center mb-1.5 text-xs text-text-secondary">
|
||||
<Link className="mr-1.5 text-primary w-4 h-4" strokeWidth={1.75}/>
|
||||
<span>{t("inspireMe.linkHeading")}</span>
|
||||
</div>
|
||||
<div className="pl-5">
|
||||
<span
|
||||
className="text-xs bg-secondary/50 text-text-secondary px-2.5 py-1 rounded-lg inline-block border border-secondary/50">
|
||||
className="text-xs bg-secondary text-text-secondary px-2.5 py-1 rounded-lg inline-block">
|
||||
{idea.relatedTo}
|
||||
</span>
|
||||
</div>
|
||||
@@ -204,20 +171,12 @@ export default function InspireMe({hasKey}: { hasKey: boolean }) {
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
|
||||
{!loading && inspirations.length === 0 && (
|
||||
<div className="h-full flex flex-col items-center justify-center text-center p-8">
|
||||
<div
|
||||
className="w-20 h-20 rounded-2xl bg-primary/10 flex items-center justify-center mb-6 shadow-md">
|
||||
<FontAwesomeIcon icon={faLightbulb} className="text-primary w-10 h-10"/>
|
||||
</div>
|
||||
<h3 className="text-xl font-['ADLaM_Display'] text-text-primary mb-3">{t("inspireMe.emptyHeading")}</h3>
|
||||
<p className="text-muted max-w-md text-lg leading-relaxed">
|
||||
{t("inspireMe.emptyDescription")}
|
||||
</p>
|
||||
</div>
|
||||
<EmptyState icon={Lightbulb} title={t("inspireMe.emptyHeading")}
|
||||
description={t("inspireMe.emptyDescription")}/>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user