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,48 +1,34 @@
|
||||
'use client'
|
||||
import {ChangeEvent, Dispatch, RefObject, SetStateAction, useCallback, useContext, useEffect, useRef, useState} from "react";
|
||||
import {AlertContext} from "@/context/AlertContext";
|
||||
import System from "@/lib/models/System";
|
||||
import {SessionContext} from "@/context/SessionContext";
|
||||
import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
|
||||
import {
|
||||
faBook,
|
||||
faBookOpen,
|
||||
faBookmark,
|
||||
faFileImport,
|
||||
faFileWord,
|
||||
faLayerGroup,
|
||||
faSpinner,
|
||||
faSquare,
|
||||
faSquareCheck,
|
||||
faX
|
||||
} from "@fortawesome/free-solid-svg-icons";
|
||||
import {SelectBoxProps} from "@/shared/interface";
|
||||
import {bookTypes} from "@/lib/models/Book";
|
||||
import {chapterVersions} from "@/lib/models/Chapter";
|
||||
import {ParsedDocxResponse, ImportChapterSelection} from "@/lib/models/Import";
|
||||
import {SyncedBook} from "@/lib/models/SyncedBook";
|
||||
import React, {ChangeEvent, Dispatch, SetStateAction, useContext, useRef, useState} from "react";
|
||||
import {AlertContext, AlertContextProps} from "@/context/AlertContext";
|
||||
import {apiPost, apiUpload} from "@/lib/api/client";
|
||||
import {SessionContext, SessionContextProps} from "@/context/SessionContext";
|
||||
import {Book, BookOpen, FileInput, FileText, Layers, Pencil, Square, SquareCheck} from 'lucide-react';
|
||||
import SelectBox, {SelectBoxProps} from "@/components/form/SelectBox";
|
||||
import {bookTypes} from "@/lib/constants/book";
|
||||
import {chapterVersions} from "@/lib/constants/chapter";
|
||||
import {ImportChapterSelection, ImportConfirmBody, ParsedChapterPreview, ParsedDocxResponse} from "@/lib/types/import";
|
||||
import InputField from "@/components/form/InputField";
|
||||
import TextInput from "@/components/form/TextInput";
|
||||
import TexteAreaInput from "@/components/form/TexteAreaInput";
|
||||
import SelectBox from "@/components/form/SelectBox";
|
||||
import CancelButton from "@/components/form/CancelButton";
|
||||
import SubmitButtonWLoading from "@/components/form/SubmitButtonWLoading";
|
||||
import {useTranslations} from "next-intl";
|
||||
import TextAreaInput from "@/components/form/TextAreaInput";
|
||||
import Button from "@/components/ui/Button";
|
||||
import Badge from "@/components/ui/Badge";
|
||||
import Modal from "@/components/ui/Modal";
|
||||
import {useTranslations} from '@/lib/i18n';
|
||||
import {LangContext, LangContextProps} from "@/context/LangContext";
|
||||
import {BooksSyncContext, BooksSyncContextProps} from "@/context/BooksSyncContext";
|
||||
import {SyncedBook} from "@/lib/types/synced-book";
|
||||
|
||||
const DOCX_ACCEPT: string = '.docx,application/vnd.openxmlformats-officedocument.wordprocessingml.document';
|
||||
const docxAccept: string = '.docx,application/vnd.openxmlformats-officedocument.wordprocessingml.document';
|
||||
|
||||
export default function ImportBookForm({setCloseForm}: { setCloseForm: Dispatch<SetStateAction<boolean>> }) {
|
||||
const t = useTranslations();
|
||||
const {lang} = useContext<LangContextProps>(LangContext);
|
||||
const {session} = useContext(SessionContext);
|
||||
const {errorMessage, successMessage} = useContext(AlertContext);
|
||||
const {setServerOnlyBooks} = useContext<BooksSyncContextProps>(BooksSyncContext);
|
||||
const modalRef: RefObject<HTMLDivElement | null> = useRef<HTMLDivElement>(null);
|
||||
|
||||
const token: string = session?.accessToken ?? '';
|
||||
|
||||
const {lang}: LangContextProps = useContext<LangContextProps>(LangContext);
|
||||
const {session}: SessionContextProps = useContext<SessionContextProps>(SessionContext);
|
||||
const {errorMessage, successMessage}: AlertContextProps = useContext<AlertContextProps>(AlertContext);
|
||||
const {setServerSyncedBooks}: BooksSyncContextProps = useContext<BooksSyncContextProps>(BooksSyncContext);
|
||||
const fileInputRef: React.RefObject<HTMLInputElement | null> = useRef<HTMLInputElement>(null);
|
||||
|
||||
const [isParsing, setIsParsing] = useState<boolean>(false);
|
||||
const [isImporting, setIsImporting] = useState<boolean>(false);
|
||||
const [importId, setImportId] = useState<string>('');
|
||||
@@ -52,47 +38,40 @@ export default function ImportBookForm({setCloseForm}: { setCloseForm: Dispatch<
|
||||
const [summary, setSummary] = useState<string>('');
|
||||
const [selectedBookType, setSelectedBookType] = useState<string>('short');
|
||||
const [selectedVersion, setSelectedVersion] = useState<string>('2');
|
||||
|
||||
|
||||
const token: string = session?.accessToken ?? '';
|
||||
const hasParsedFile: boolean = importId.length > 0 && chapters.length > 0;
|
||||
const selectedCount: number = chapters.filter((chapter: ImportChapterSelection): boolean => chapter.selected).length;
|
||||
const canImport: boolean = !isImporting && hasParsedFile && selectedCount > 0 && title.trim().length > 0;
|
||||
|
||||
useEffect((): () => void => {
|
||||
document.body.style.overflow = 'hidden';
|
||||
return (): void => {
|
||||
document.body.style.overflow = 'auto';
|
||||
};
|
||||
}, []);
|
||||
|
||||
const handleFileChange = useCallback(async (e: ChangeEvent<HTMLInputElement>): Promise<void> => {
|
||||
const file: File | undefined = e.target.files?.[0];
|
||||
|
||||
async function handleFileChange(event: ChangeEvent<HTMLInputElement>): Promise<void> {
|
||||
const file: File | undefined = event.target.files?.[0];
|
||||
if (!file) return;
|
||||
|
||||
|
||||
if (!file.name.endsWith('.docx')) {
|
||||
errorMessage(t('importBook.error.invalidFormat'));
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
setIsParsing(true);
|
||||
setImportId('');
|
||||
setChapters([]);
|
||||
|
||||
|
||||
try {
|
||||
const response: ParsedDocxResponse = await System.authUploadFileToServer<ParsedDocxResponse>(
|
||||
const response: ParsedDocxResponse = await apiUpload<ParsedDocxResponse>(
|
||||
'book/import/parse',
|
||||
file,
|
||||
token,
|
||||
lang,
|
||||
lang
|
||||
);
|
||||
|
||||
|
||||
setImportId(response.importId);
|
||||
setChapters(
|
||||
response.chapters.map((chapter: { index: number; title: string; wordCount: number }): ImportChapterSelection => ({
|
||||
response.chapters.map((chapter: ParsedChapterPreview): ImportChapterSelection => ({
|
||||
index: chapter.index,
|
||||
title: chapter.title,
|
||||
wordCount: chapter.wordCount,
|
||||
selected: true,
|
||||
})),
|
||||
}))
|
||||
);
|
||||
} catch (parseError: unknown) {
|
||||
if (parseError instanceof Error) {
|
||||
@@ -103,26 +82,26 @@ export default function ImportBookForm({setCloseForm}: { setCloseForm: Dispatch<
|
||||
} finally {
|
||||
setIsParsing(false);
|
||||
}
|
||||
}, [token, lang, errorMessage, t]);
|
||||
|
||||
const toggleChapter = useCallback((chapterIndex: number): void => {
|
||||
}
|
||||
|
||||
function toggleChapter(chapterIndex: number): void {
|
||||
setChapters((previousChapters: ImportChapterSelection[]): ImportChapterSelection[] =>
|
||||
previousChapters.map((chapter: ImportChapterSelection): ImportChapterSelection =>
|
||||
chapter.index === chapterIndex ? {...chapter, selected: !chapter.selected} : chapter,
|
||||
),
|
||||
chapter.index === chapterIndex ? {...chapter, selected: !chapter.selected} : chapter
|
||||
)
|
||||
);
|
||||
}, []);
|
||||
|
||||
const toggleAllChapters = useCallback((selectAll: boolean): void => {
|
||||
}
|
||||
|
||||
function toggleAllChapters(selectAll: boolean): void {
|
||||
setChapters((previousChapters: ImportChapterSelection[]): ImportChapterSelection[] =>
|
||||
previousChapters.map((chapter: ImportChapterSelection): ImportChapterSelection => ({
|
||||
...chapter,
|
||||
selected: selectAll,
|
||||
})),
|
||||
}))
|
||||
);
|
||||
}, []);
|
||||
|
||||
const handleImport = useCallback(async (): Promise<void> => {
|
||||
}
|
||||
|
||||
async function handleImport(): Promise<void> {
|
||||
if (!title.trim()) {
|
||||
errorMessage(t('importBook.error.titleRequired'));
|
||||
return;
|
||||
@@ -135,33 +114,36 @@ export default function ImportBookForm({setCloseForm}: { setCloseForm: Dispatch<
|
||||
errorMessage(t('importBook.error.noChaptersSelected'));
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
setIsImporting(true);
|
||||
try {
|
||||
const selectedChapterIndexes: number[] = chapters
|
||||
.filter((chapter: ImportChapterSelection): boolean => chapter.selected)
|
||||
.map((chapter: ImportChapterSelection): number => chapter.index);
|
||||
|
||||
await System.authPostToServer<{ bookId: string }>(
|
||||
'book/import',
|
||||
{
|
||||
importId,
|
||||
title: title.trim(),
|
||||
subTitle: subTitle.trim(),
|
||||
summary: summary.trim(),
|
||||
type: selectedBookType,
|
||||
version: parseInt(selectedVersion, 10),
|
||||
selectedChapterIndexes,
|
||||
},
|
||||
token,
|
||||
lang,
|
||||
);
|
||||
|
||||
setServerOnlyBooks((prevBooks: SyncedBook[]): SyncedBook[] => [...prevBooks, {
|
||||
id: importId,
|
||||
type: selectedBookType,
|
||||
|
||||
const importBody: ImportConfirmBody = {
|
||||
importId,
|
||||
title: title.trim(),
|
||||
subTitle: subTitle.trim(),
|
||||
summary: summary.trim(),
|
||||
type: selectedBookType,
|
||||
version: parseInt(selectedVersion, 10),
|
||||
selectedChapterIndexes,
|
||||
};
|
||||
|
||||
const importResponse: { bookId: string } = await apiPost<{ bookId: string }>(
|
||||
'book/import',
|
||||
importBody,
|
||||
token,
|
||||
lang
|
||||
);
|
||||
|
||||
const newBook: SyncedBook = {
|
||||
id: importResponse.bookId,
|
||||
type: selectedBookType,
|
||||
title: title.trim(),
|
||||
subTitle: subTitle.trim() || null,
|
||||
seriesId: null,
|
||||
lastUpdate: new Date().getTime() / 1000,
|
||||
chapters: [],
|
||||
characters: [],
|
||||
@@ -173,12 +155,9 @@ export default function ImportBookForm({setCloseForm}: { setCloseForm: Dispatch<
|
||||
actSummaries: [],
|
||||
guideLine: null,
|
||||
aiGuideLine: null,
|
||||
bookTools: null,
|
||||
seriesId: null,
|
||||
spells: [],
|
||||
spellTags: []
|
||||
}]);
|
||||
|
||||
};
|
||||
setServerSyncedBooks((prev: SyncedBook[]): SyncedBook[] => [...prev, newBook]);
|
||||
|
||||
successMessage(t('importBook.success'));
|
||||
setCloseForm(false);
|
||||
} catch (importError: unknown) {
|
||||
@@ -190,160 +169,143 @@ export default function ImportBookForm({setCloseForm}: { setCloseForm: Dispatch<
|
||||
} finally {
|
||||
setIsImporting(false);
|
||||
}
|
||||
}, [title, subTitle, summary, selectedBookType, selectedVersion, importId, chapters, selectedCount, token, lang, errorMessage, successMessage, t, setCloseForm, setServerOnlyBooks]);
|
||||
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="fixed inset-0 flex items-center justify-center bg-black/60 z-50 backdrop-blur-md animate-fadeIn">
|
||||
<div ref={modalRef}
|
||||
className="bg-tertiary/95 backdrop-blur-sm text-text-primary rounded-2xl border border-secondary/50 shadow-2xl md:w-3/4 xl:w-1/4 lg:w-2/4 sm:w-11/12 max-h-[85vh] flex flex-col">
|
||||
<div className="flex justify-between items-center bg-primary px-6 py-4 rounded-t-2xl shadow-lg">
|
||||
<h2 className="flex items-center gap-3 font-['ADLaM_Display'] text-2xl text-text-primary">
|
||||
<FontAwesomeIcon icon={faFileImport} className="w-6 h-6"/>
|
||||
{t("importBook.header.title")}
|
||||
</h2>
|
||||
<button
|
||||
className="text-background hover:text-background w-10 h-10 rounded-xl hover:bg-white/20 transition-all duration-200 flex items-center justify-center hover:scale-110"
|
||||
onClick={(): void => setCloseForm(false)}
|
||||
>
|
||||
<FontAwesomeIcon icon={faX} className={'w-5 h-5'}/>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className="p-5 overflow-y-auto flex-grow custom-scrollbar">
|
||||
<div className="space-y-6">
|
||||
<label
|
||||
className={`flex items-center justify-center gap-3 py-4 border-2 border-dashed border-primary rounded-xl cursor-pointer
|
||||
bg-secondary/20 hover:bg-secondary/40 transition-all duration-200
|
||||
${isParsing ? 'opacity-70 pointer-events-none' : ''}`}
|
||||
>
|
||||
{isParsing ? (
|
||||
<FontAwesomeIcon icon={faSpinner} className="w-5 h-5 text-primary animate-spin"/>
|
||||
) : (
|
||||
<FontAwesomeIcon icon={faFileWord} className="w-5 h-5 text-primary"/>
|
||||
)}
|
||||
<span className="font-['ADLaM_Display'] text-primary">
|
||||
{isParsing ? t('importBook.parsing') : t('importBook.pickFile')}
|
||||
</span>
|
||||
<input
|
||||
type="file"
|
||||
accept={DOCX_ACCEPT}
|
||||
onChange={handleFileChange}
|
||||
className="hidden"
|
||||
disabled={isParsing}
|
||||
/>
|
||||
</label>
|
||||
|
||||
{hasParsedFile && (
|
||||
<>
|
||||
<InputField icon={faBookOpen} fieldName={t("importBook.fields.type.label")} input={
|
||||
<SelectBox
|
||||
onChangeCallBack={(e: ChangeEvent<HTMLSelectElement>): void => setSelectedBookType(e.target.value)}
|
||||
data={bookTypes.map((types: SelectBoxProps): SelectBoxProps => ({
|
||||
value: types.value,
|
||||
label: t(types.label)
|
||||
}))}
|
||||
defaultValue={selectedBookType}
|
||||
/>
|
||||
}/>
|
||||
|
||||
<InputField icon={faBook} fieldName={t("importBook.fields.title.label")} input={
|
||||
<TextInput
|
||||
value={title}
|
||||
setValue={(e: ChangeEvent<HTMLInputElement>): void => setTitle(e.target.value)}
|
||||
placeholder={t("importBook.fields.title.placeholder")}
|
||||
/>
|
||||
}/>
|
||||
|
||||
<InputField icon={faBookmark} fieldName={t("importBook.fields.subTitle.label")} input={
|
||||
<TextInput
|
||||
value={subTitle}
|
||||
setValue={(e: ChangeEvent<HTMLInputElement>): void => setSubTitle(e.target.value)}
|
||||
placeholder={t("importBook.fields.subTitle.placeholder")}
|
||||
/>
|
||||
}/>
|
||||
|
||||
<InputField icon={faBook} fieldName={t("importBook.fields.summary.label")} input={
|
||||
<TexteAreaInput
|
||||
value={summary}
|
||||
setValue={(e: ChangeEvent<HTMLTextAreaElement>): void => setSummary(e.target.value)}
|
||||
placeholder={t("importBook.fields.summary.placeholder")}
|
||||
/>
|
||||
}/>
|
||||
|
||||
<InputField icon={faLayerGroup} fieldName={t("importBook.fields.version.label")} input={
|
||||
<SelectBox
|
||||
onChangeCallBack={(e: ChangeEvent<HTMLSelectElement>): void => setSelectedVersion(e.target.value)}
|
||||
data={chapterVersions.map((version: SelectBoxProps): SelectBoxProps => ({
|
||||
value: version.value,
|
||||
label: t(version.label)
|
||||
}))}
|
||||
defaultValue={selectedVersion}
|
||||
/>
|
||||
}/>
|
||||
|
||||
<div className="mt-4">
|
||||
<div className="flex justify-between items-center mb-3">
|
||||
<h3 className="font-['ADLaM_Display'] text-lg text-text-primary">
|
||||
{t('importBook.chapters.title')}
|
||||
</h3>
|
||||
<span className="text-sm text-muted">
|
||||
{t('importBook.chaptersDetected', {count: chapters.length})}
|
||||
<Modal
|
||||
icon={FileInput}
|
||||
title={t("importBook.header")}
|
||||
onClose={(): void => setCloseForm(false)}
|
||||
size="sm"
|
||||
footer={hasParsedFile ? (
|
||||
<>
|
||||
<Button variant="secondary" onClick={() => setCloseForm(false)}>{t("common.cancel")}</Button>
|
||||
<Button
|
||||
variant="primary"
|
||||
onClick={handleImport}
|
||||
isLoading={isImporting}
|
||||
loadingText={t("importBook.importing")}
|
||||
icon={FileInput}
|
||||
>{t("importBook.submit")}</Button>
|
||||
</>
|
||||
) : undefined}
|
||||
>
|
||||
<input
|
||||
ref={fileInputRef}
|
||||
type="file"
|
||||
accept={docxAccept}
|
||||
onChange={handleFileChange}
|
||||
className="hidden"
|
||||
/>
|
||||
<Button
|
||||
variant="dashed"
|
||||
size="lg"
|
||||
icon={isParsing ? undefined : FileText}
|
||||
isLoading={isParsing}
|
||||
loadingText={t('importBook.parsing')}
|
||||
onClick={(): void => fileInputRef.current?.click()}
|
||||
disabled={isParsing}
|
||||
fullWidth
|
||||
>
|
||||
{t('importBook.pickFile')}
|
||||
</Button>
|
||||
|
||||
{hasParsedFile && (
|
||||
<>
|
||||
<InputField icon={BookOpen} fieldName={t("importBook.fields.type")} input={
|
||||
<SelectBox
|
||||
onChangeCallBack={(e: ChangeEvent<HTMLSelectElement>): void => setSelectedBookType(e.target.value)}
|
||||
data={bookTypes.map((types: SelectBoxProps): SelectBoxProps => ({
|
||||
value: types.value,
|
||||
label: t(types.label)
|
||||
}))}
|
||||
defaultValue={selectedBookType}
|
||||
placeholder={t("addNewBookForm.typePlaceholder")}
|
||||
/>
|
||||
}/>
|
||||
|
||||
<InputField icon={Pencil} fieldName={t("importBook.fields.title")} input={
|
||||
<TextInput
|
||||
value={title}
|
||||
setValue={(e: ChangeEvent<HTMLInputElement>): void => setTitle(e.target.value)}
|
||||
placeholder={t("addNewBookForm.bookTitlePlaceholder")}
|
||||
/>
|
||||
}/>
|
||||
|
||||
<InputField icon={Pencil} fieldName={t("importBook.fields.subTitle")} input={
|
||||
<TextInput
|
||||
value={subTitle}
|
||||
setValue={(e: ChangeEvent<HTMLInputElement>): void => setSubTitle(e.target.value)}
|
||||
placeholder={t("addNewBookForm.subtitlePlaceholder")}
|
||||
/>
|
||||
}/>
|
||||
|
||||
<InputField icon={Book} fieldName={t("importBook.fields.summary")} input={
|
||||
<TextAreaInput
|
||||
value={summary}
|
||||
setValue={(e: ChangeEvent<HTMLTextAreaElement>): void => setSummary(e.target.value)}
|
||||
placeholder={t("addNewBookForm.summaryPlaceholder")}
|
||||
/>
|
||||
}/>
|
||||
|
||||
<InputField icon={Layers} fieldName={t("importBook.fields.version")} input={
|
||||
<SelectBox
|
||||
onChangeCallBack={(e: ChangeEvent<HTMLSelectElement>): void => setSelectedVersion(e.target.value)}
|
||||
data={chapterVersions.map((version: SelectBoxProps): SelectBoxProps => ({
|
||||
value: version.value,
|
||||
label: t(version.label)
|
||||
}))}
|
||||
defaultValue={selectedVersion}
|
||||
placeholder={""}
|
||||
/>
|
||||
}/>
|
||||
|
||||
<div className="mt-2">
|
||||
<div className="flex justify-between items-center mb-3">
|
||||
<h3 className="text-text-primary text-xl font-['ADLaM_Display'] font-medium flex items-center gap-2">
|
||||
<BookOpen className="text-primary w-5 h-5" strokeWidth={1.75}/>
|
||||
{t('importBook.chapters.title')}
|
||||
</h3>
|
||||
<Badge variant="muted" size="sm">
|
||||
{t('importBook.chapters.detected', {count: chapters.length})}
|
||||
</Badge>
|
||||
</div>
|
||||
|
||||
<div className="mb-3 hover:underline w-fit">
|
||||
<Button variant="ghost" size="sm"
|
||||
onClick={(): void => toggleAllChapters(selectedCount < chapters.length)}>
|
||||
{selectedCount === chapters.length
|
||||
? t('importBook.chapters.deselectAll')
|
||||
: t('importBook.chapters.selectAll')}
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
<div className="space-y-1">
|
||||
{chapters.map((chapter: ImportChapterSelection) => (
|
||||
<button
|
||||
key={chapter.index}
|
||||
onClick={(): void => toggleChapter(chapter.index)}
|
||||
className="w-full flex items-center gap-3 px-3 py-2.5 rounded-lg hover:bg-secondary transition-all duration-150"
|
||||
>
|
||||
{chapter.selected
|
||||
? <SquareCheck className="w-4 h-4 text-primary" strokeWidth={1.75}/>
|
||||
: <Square className="w-4 h-4 text-muted" strokeWidth={1.75}/>
|
||||
}
|
||||
<div className="flex-1 text-left">
|
||||
<span
|
||||
className={`text-sm font-medium block truncate ${chapter.selected ? 'text-text-primary' : 'text-muted'}`}>
|
||||
{chapter.title}
|
||||
</span>
|
||||
<span className="text-xs text-muted">
|
||||
{chapter.wordCount.toLocaleString('fr-FR')} {t('importBook.chapters.words')}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<button
|
||||
onClick={(): void => toggleAllChapters(selectedCount < chapters.length)}
|
||||
className="text-sm text-primary hover:text-primary/80 mb-3 transition-colors"
|
||||
>
|
||||
{selectedCount === chapters.length
|
||||
? t('importBook.chapters.deselectAll')
|
||||
: t('importBook.chapters.selectAll')}
|
||||
</button>
|
||||
|
||||
<div className="space-y-1">
|
||||
{chapters.map((chapter: ImportChapterSelection) => (
|
||||
<button
|
||||
key={chapter.index}
|
||||
onClick={(): void => toggleChapter(chapter.index)}
|
||||
className="flex items-center gap-3 w-full py-2 px-3 rounded-lg hover:bg-secondary/30 transition-colors text-left"
|
||||
>
|
||||
<FontAwesomeIcon
|
||||
icon={chapter.selected ? faSquareCheck : faSquare}
|
||||
className={`w-4 h-4 ${chapter.selected ? 'text-primary' : 'text-muted'}`}
|
||||
/>
|
||||
<div className="flex-1 min-w-0">
|
||||
<p className={`text-sm truncate ${chapter.selected ? 'text-text-primary' : 'text-muted'}`}>
|
||||
{chapter.title}
|
||||
</p>
|
||||
<p className="text-xs text-muted">
|
||||
{t('importBook.chapters.words', {count: chapter.wordCount})}
|
||||
</p>
|
||||
</div>
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{hasParsedFile && (
|
||||
<div className="flex justify-between items-center p-5 border-t border-secondary/50 bg-secondary/20 rounded-b-2xl">
|
||||
<div></div>
|
||||
<div className="flex gap-3">
|
||||
<CancelButton callBackFunction={() => setCloseForm(false)}/>
|
||||
<SubmitButtonWLoading
|
||||
callBackAction={handleImport}
|
||||
isLoading={isImporting}
|
||||
text={t("importBook.submit")}
|
||||
loadingText={t("importBook.importing")}
|
||||
icon={faFileImport}
|
||||
/>
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</Modal>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user