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,36 +1,29 @@
|
||||
'use client'
|
||||
import React, {ChangeEvent, forwardRef, useContext, useEffect, useImperativeHandle, useState} from 'react';
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
|
||||
import {faPlus, faShare, faToggleOn, IconDefinition} from "@fortawesome/free-solid-svg-icons";
|
||||
import {LucideIcon, Plus, Share2, ToggleRight} from 'lucide-react';
|
||||
import {WorldContext} from '@/context/WorldContext';
|
||||
import {BookContext} from "@/context/BookContext";
|
||||
import {AlertContext} from "@/context/AlertContext";
|
||||
import {SelectBoxProps} from "@/shared/interface";
|
||||
import System from "@/lib/models/System";
|
||||
import {elementSections, WorldListResponse, WorldProps} from "@/lib/models/World";
|
||||
import {SessionContext} from "@/context/SessionContext";
|
||||
import {BookContext, BookContextProps} from "@/context/BookContext";
|
||||
import {AlertContext, AlertContextProps} from "@/context/AlertContext";
|
||||
import SelectBox, {SelectBoxProps} from "@/components/form/SelectBox";
|
||||
import {apiGet, apiPatch, apiPost} from "@/lib/api/client";
|
||||
import {isDesktop} from '@/lib/configs';
|
||||
import * as tauri from '@/lib/tauri';
|
||||
import OfflineContext, {OfflineContextType} from '@/context/OfflineContext';
|
||||
import {ElementSection, WorldListResponse, WorldProps, WorldTextField} from "@/lib/types/world";
|
||||
import {SettingRef} from "@/lib/types/settings";
|
||||
import {elementSections} from "@/lib/constants/world";
|
||||
import {SessionContext, SessionContextProps} from "@/context/SessionContext";
|
||||
import InputField from "@/components/form/InputField";
|
||||
import TextInput from '@/components/form/TextInput';
|
||||
import TexteAreaInput from "@/components/form/TexteAreaInput";
|
||||
import TextAreaInput from "@/components/form/TextAreaInput";
|
||||
import WorldElementComponent from './WorldElement';
|
||||
import SelectBox from "@/components/form/SelectBox";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {useTranslations} from '@/lib/i18n';
|
||||
import {LangContext, LangContextProps} from "@/context/LangContext";
|
||||
import OfflineContext, {OfflineContextType} from "@/context/OfflineContext";
|
||||
import {LocalSyncQueueContext, LocalSyncQueueContextProps} from "@/context/SyncQueueContext";
|
||||
import {BooksSyncContext, BooksSyncContextProps} from "@/context/BooksSyncContext";
|
||||
import {SyncedBook} from "@/lib/models/SyncedBook";
|
||||
import ToggleSwitch from "@/components/form/ToggleSwitch";
|
||||
import {SeriesWorldProps, SeriesWorldListItem} from "@/lib/models/Series";
|
||||
import {SeriesWorldListItem, SeriesWorldProps} from "@/lib/types/series";
|
||||
import SeriesImportSelector from "@/components/form/SeriesImportSelector";
|
||||
import SyncFieldWrapper from "@/components/form/SyncFieldWrapper";
|
||||
import * as tauri from '@/lib/tauri';
|
||||
|
||||
export interface ElementSection {
|
||||
title: string;
|
||||
section: keyof WorldProps;
|
||||
icon: IconDefinition;
|
||||
}
|
||||
import Button from "@/components/ui/Button";
|
||||
|
||||
interface WorldSettingProps {
|
||||
showToggle?: boolean;
|
||||
@@ -38,16 +31,14 @@ interface WorldSettingProps {
|
||||
entityId?: string;
|
||||
}
|
||||
|
||||
export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSave: () => Promise<void> }>) {
|
||||
export function WorldSetting(props: WorldSettingProps, ref: React.ForwardedRef<SettingRef>): React.JSX.Element {
|
||||
const {showToggle = true, entityType = 'book', entityId} = props;
|
||||
const t = useTranslations();
|
||||
const {lang} = useContext<LangContextProps>(LangContext);
|
||||
const {isCurrentlyOffline} = useContext<OfflineContextType>(OfflineContext);
|
||||
const {addToQueue} = useContext<LocalSyncQueueContextProps>(LocalSyncQueueContext);
|
||||
const {localSyncedBooks} = useContext<BooksSyncContextProps>(BooksSyncContext);
|
||||
const {errorMessage, successMessage} = useContext(AlertContext);
|
||||
const {session} = useContext(SessionContext);
|
||||
const {book, setBook} = useContext(BookContext);
|
||||
const {lang}: LangContextProps = useContext<LangContextProps>(LangContext);
|
||||
const {errorMessage, successMessage}: AlertContextProps = useContext<AlertContextProps>(AlertContext);
|
||||
const {session}: SessionContextProps = useContext<SessionContextProps>(SessionContext);
|
||||
const {book, setBook}: BookContextProps = useContext<BookContextProps>(BookContext);
|
||||
const {isCurrentlyOffline}: OfflineContextType = useContext<OfflineContextType>(OfflineContext);
|
||||
|
||||
const currentEntityId: string = entityId || book?.bookId || '';
|
||||
const isSeriesMode: boolean = entityType === 'series';
|
||||
@@ -60,29 +51,27 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
const [showAddNewWorld, setShowAddNewWorld] = useState<boolean>(false);
|
||||
const [toolEnabled, setToolEnabled] = useState<boolean>(isSeriesMode ? true : (book?.tools?.worlds ?? false));
|
||||
const bookSeriesId: string | null = book?.seriesId || null;
|
||||
|
||||
useImperativeHandle(ref, function () {
|
||||
return {
|
||||
handleSave: handleUpdateWorld,
|
||||
};
|
||||
});
|
||||
|
||||
useImperativeHandle(ref, (): SettingRef => ({
|
||||
handleSave: handleUpdateWorld,
|
||||
}));
|
||||
|
||||
useEffect((): void => {
|
||||
if (currentEntityId) {
|
||||
getWorlds().then();
|
||||
}
|
||||
}, [currentEntityId]);
|
||||
|
||||
|
||||
useEffect((): void => {
|
||||
if (bookSeriesId && !isSeriesMode && !isCurrentlyOffline()) {
|
||||
if (bookSeriesId && !isSeriesMode) {
|
||||
getSeriesWorlds().then();
|
||||
}
|
||||
}, [bookSeriesId]);
|
||||
|
||||
|
||||
async function getSeriesWorlds(): Promise<void> {
|
||||
if (!bookSeriesId || isCurrentlyOffline()) return;
|
||||
if (!bookSeriesId) return;
|
||||
try {
|
||||
const response: SeriesWorldProps[] = await System.authGetQueryToServer<SeriesWorldProps[]>('series/world/list', session.accessToken, lang, {
|
||||
const response: SeriesWorldProps[] = await apiGet<SeriesWorldProps[]>('series/world/list', session.accessToken, lang, {
|
||||
seriesid: bookSeriesId
|
||||
});
|
||||
if (response) {
|
||||
@@ -90,7 +79,7 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
}
|
||||
} catch (e: unknown) {
|
||||
if (e instanceof Error) {
|
||||
console.error('Error loading series worlds:', e.message);
|
||||
errorMessage(e.message);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -99,21 +88,14 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
if (isSeriesMode) return;
|
||||
try {
|
||||
let response: boolean;
|
||||
if (isCurrentlyOffline() || book?.localBook) {
|
||||
if (isDesktop && (isCurrentlyOffline() || book?.localBook)) {
|
||||
response = await tauri.updateBookToolSetting(currentEntityId, 'worlds', enabled);
|
||||
} else {
|
||||
response = await System.authPatchToServer<boolean>('book/tool-setting', {
|
||||
response = await apiPatch<boolean>('book/tool-setting', {
|
||||
bookId: currentEntityId,
|
||||
toolName: 'worlds',
|
||||
enabled: enabled
|
||||
}, session.accessToken, lang);
|
||||
if (localSyncedBooks.find((syncedBook: SyncedBook): boolean => syncedBook.id === currentEntityId)) {
|
||||
addToQueue('update_book_tool_setting', {data: {
|
||||
bookId: currentEntityId,
|
||||
toolName: 'worlds',
|
||||
enabled: enabled
|
||||
}});
|
||||
}
|
||||
}
|
||||
if (response && setBook && book) {
|
||||
setToolEnabled(enabled);
|
||||
@@ -132,12 +114,11 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
async function getWorlds(): Promise<void> {
|
||||
try {
|
||||
if (isSeriesMode) {
|
||||
// Series mode: server only (series are not local)
|
||||
const response: SeriesWorldProps[] = await System.authGetQueryToServer<SeriesWorldProps[]>('series/world/list', session.accessToken, lang, {
|
||||
const response: SeriesWorldProps[] = await apiGet<SeriesWorldProps[]>('series/world/list', session.accessToken, lang, {
|
||||
seriesid: currentEntityId
|
||||
});
|
||||
if (response) {
|
||||
@@ -169,16 +150,31 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
}));
|
||||
setWorldsSelector(formattedWorlds);
|
||||
}
|
||||
} else {
|
||||
// Book mode: dual offline/online logic
|
||||
let response: WorldListResponse;
|
||||
if (isCurrentlyOffline() || book?.localBook) {
|
||||
response = await tauri.getWorlds(currentEntityId, true);
|
||||
} else {
|
||||
response = await System.authGetQueryToServer<WorldListResponse>('book/worlds', session.accessToken, lang, {
|
||||
bookid: currentEntityId,
|
||||
});
|
||||
} else if (isDesktop && (isCurrentlyOffline() || book?.localBook)) {
|
||||
const response: WorldListResponse = await tauri.getWorlds(currentEntityId, toolEnabled) as WorldListResponse;
|
||||
if (response) {
|
||||
setWorlds(response.worlds);
|
||||
setToolEnabled(response.enabled);
|
||||
if (setBook && book) {
|
||||
setBook({
|
||||
...book, tools: {
|
||||
characters: book.tools?.characters ?? false,
|
||||
worlds: response.enabled,
|
||||
locations: book.tools?.locations ?? false,
|
||||
spells: book.tools?.spells ?? false
|
||||
}
|
||||
});
|
||||
}
|
||||
const formattedWorlds: SelectBoxProps[] = response.worlds.map(
|
||||
(world: WorldProps): SelectBoxProps => ({
|
||||
label: world.name,
|
||||
value: world.id.toString(),
|
||||
}),
|
||||
);
|
||||
setWorldsSelector(formattedWorlds);
|
||||
}
|
||||
} else {
|
||||
const response: WorldListResponse = await apiGet<WorldListResponse>('book/worlds', session.accessToken, lang, {bookid: currentEntityId});
|
||||
if (response) {
|
||||
setWorlds(response.worlds);
|
||||
setToolEnabled(response.enabled);
|
||||
@@ -209,7 +205,7 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
async function handleAddNewWorld(): Promise<void> {
|
||||
if (newWorldName.trim() === '') {
|
||||
errorMessage(t("worldSetting.newWorldNameError"));
|
||||
@@ -218,8 +214,7 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
try {
|
||||
let newWorldId: string;
|
||||
if (isSeriesMode) {
|
||||
// Series mode: server only
|
||||
newWorldId = await System.authPostToServer<string>(
|
||||
newWorldId = await apiPost<string>(
|
||||
'series/world/add',
|
||||
{
|
||||
seriesId: currentEntityId,
|
||||
@@ -232,30 +227,22 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
errorMessage(t("worldSetting.addWorldError"));
|
||||
return;
|
||||
}
|
||||
} else if (isCurrentlyOffline() || book?.localBook) {
|
||||
// Book mode: offline/local
|
||||
} else if (isDesktop && (isCurrentlyOffline() || book?.localBook)) {
|
||||
newWorldId = await tauri.addWorld(currentEntityId, newWorldName);
|
||||
if (!newWorldId) {
|
||||
errorMessage(t("worldSetting.addWorldError"));
|
||||
return;
|
||||
}
|
||||
} else {
|
||||
// Book mode: online
|
||||
newWorldId = await System.authPostToServer<string>('book/world/add', {
|
||||
const worldId: string = await apiPost<string>('book/world/add', {
|
||||
worldName: newWorldName,
|
||||
bookId: currentEntityId,
|
||||
}, session.accessToken, lang);
|
||||
if (!newWorldId) {
|
||||
if (!worldId) {
|
||||
errorMessage(t("worldSetting.addWorldError"));
|
||||
return;
|
||||
}
|
||||
if (localSyncedBooks.find((syncedBook: SyncedBook): boolean => syncedBook.id === currentEntityId)) {
|
||||
addToQueue('add_world', {data: {
|
||||
worldName: newWorldName,
|
||||
worldId: newWorldId,
|
||||
bookId: currentEntityId,
|
||||
}});
|
||||
}
|
||||
newWorldId = worldId;
|
||||
}
|
||||
const newWorld: WorldProps = {
|
||||
id: newWorldId,
|
||||
@@ -298,11 +285,8 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
if (worlds.length === 0) return;
|
||||
try {
|
||||
const currentWorld: WorldProps = worlds[selectedWorldIndex];
|
||||
let response: boolean;
|
||||
|
||||
if (isSeriesMode) {
|
||||
// Series mode: server only
|
||||
response = await System.authPatchToServer<boolean>('series/world/update', {
|
||||
const response: boolean = await apiPatch<boolean>('series/world/update', {
|
||||
worldId: currentWorld.id,
|
||||
name: currentWorld.name,
|
||||
history: currentWorld.history,
|
||||
@@ -311,27 +295,26 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
religion: currentWorld.religion,
|
||||
languages: currentWorld.languages,
|
||||
}, session.accessToken, lang);
|
||||
} else if (isCurrentlyOffline() || book?.localBook) {
|
||||
// Book mode: offline/local
|
||||
response = await tauri.updateWorld(currentWorld);
|
||||
if (!response) {
|
||||
errorMessage(t("worldSetting.updateWorldError"));
|
||||
return;
|
||||
}
|
||||
} else if (isDesktop && (isCurrentlyOffline() || book?.localBook)) {
|
||||
const response: boolean = await tauri.updateWorld(currentWorld);
|
||||
if (!response) {
|
||||
errorMessage(t("worldSetting.updateWorldError"));
|
||||
return;
|
||||
}
|
||||
} else {
|
||||
// Book mode: online
|
||||
response = await System.authPatchToServer<boolean>('book/world/update', {
|
||||
const response: boolean = await apiPatch<boolean>('book/world/update', {
|
||||
world: currentWorld,
|
||||
bookId: currentEntityId,
|
||||
}, session.accessToken, lang);
|
||||
if (localSyncedBooks.find((syncedBook: SyncedBook): boolean => syncedBook.id === currentEntityId)) {
|
||||
addToQueue('update_world', {data: {
|
||||
world: currentWorld,
|
||||
bookId: currentEntityId,
|
||||
}});
|
||||
if (!response) {
|
||||
errorMessage(t("worldSetting.updateWorldError"));
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
if (!response) {
|
||||
errorMessage(t("worldSetting.updateWorldError"));
|
||||
return;
|
||||
}
|
||||
successMessage(t("worldSetting.updateWorldSuccess"));
|
||||
} catch (e: unknown) {
|
||||
if (e instanceof Error) {
|
||||
@@ -341,27 +324,26 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function handleWorldSelect(worldId: string): void {
|
||||
const index: number = worlds.findIndex((world: WorldProps): boolean => world.id === worldId);
|
||||
if (index !== -1) {
|
||||
setSelectedWorldIndex(index);
|
||||
}
|
||||
}
|
||||
|
||||
function handleInputChange(value: string, field: keyof WorldProps) {
|
||||
const updatedWorlds = [...worlds] as WorldProps[];
|
||||
(updatedWorlds[selectedWorldIndex][field] as string) = value;
|
||||
|
||||
function handleInputChange(value: string, field: WorldTextField): void {
|
||||
const updatedWorlds: WorldProps[] = [...worlds];
|
||||
updatedWorlds[selectedWorldIndex][field] = value;
|
||||
setWorlds(updatedWorlds);
|
||||
}
|
||||
|
||||
|
||||
async function handleExportToSeries(): Promise<void> {
|
||||
if (isCurrentlyOffline()) return;
|
||||
const selectedWorld: WorldProps | undefined = worlds[selectedWorldIndex];
|
||||
if (!selectedWorld || !bookSeriesId) return;
|
||||
|
||||
|
||||
try {
|
||||
const seriesWorldId: string = await System.authPostToServer<string>('series/world/add', {
|
||||
const seriesWorldId: string = await apiPost<string>('series/world/add', {
|
||||
seriesId: bookSeriesId,
|
||||
world: {
|
||||
name: selectedWorld.name,
|
||||
@@ -372,15 +354,15 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
languages: selectedWorld.languages || null,
|
||||
}
|
||||
}, session.accessToken, lang);
|
||||
|
||||
|
||||
if (seriesWorldId) {
|
||||
const updateResponse: boolean = await System.authPostToServer<boolean>('book/world/update', {
|
||||
const updateResponse: boolean = await apiPost<boolean>('book/world/update', {
|
||||
world: {
|
||||
...selectedWorld,
|
||||
seriesWorldId: seriesWorldId
|
||||
},
|
||||
}, session.accessToken, lang);
|
||||
|
||||
|
||||
if (updateResponse) {
|
||||
const updatedWorlds: WorldProps[] = [...worlds];
|
||||
updatedWorlds[selectedWorldIndex] = {...selectedWorld, seriesWorldId: seriesWorldId};
|
||||
@@ -395,33 +377,23 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
async function handleImportFromSeries(seriesWorldId: string): Promise<void> {
|
||||
if (isCurrentlyOffline()) return;
|
||||
const seriesWorld: SeriesWorldListItem | undefined = seriesWorlds.find((w) => w.id === seriesWorldId);
|
||||
const seriesWorld: SeriesWorldListItem | undefined = seriesWorlds.find((w: SeriesWorldListItem): boolean => w.id === seriesWorldId);
|
||||
if (!seriesWorld) return;
|
||||
|
||||
|
||||
try {
|
||||
const worldId: string = await System.authPostToServer<string>('book/world/add', {
|
||||
const worldId: string = await apiPost<string>('book/world/add', {
|
||||
worldName: seriesWorld.name,
|
||||
bookId: currentEntityId,
|
||||
seriesWorldId: seriesWorldId,
|
||||
}, session.accessToken, lang);
|
||||
|
||||
|
||||
if (!worldId) {
|
||||
errorMessage(t("worldSetting.importError"));
|
||||
return;
|
||||
}
|
||||
|
||||
// Sync to local if book is synced
|
||||
if (localSyncedBooks.find((syncedBook: SyncedBook): boolean => syncedBook.id === currentEntityId)) {
|
||||
addToQueue('add_world', {data: {
|
||||
worldName: seriesWorld.name,
|
||||
worldId: worldId,
|
||||
bookId: currentEntityId,
|
||||
}});
|
||||
}
|
||||
|
||||
|
||||
const newWorld: WorldProps = {
|
||||
id: worldId,
|
||||
name: seriesWorld.name,
|
||||
@@ -455,19 +427,19 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function getSeriesWorldForCurrentWorld(): SeriesWorldProps | null {
|
||||
const currentWorld: WorldProps = worlds[selectedWorldIndex];
|
||||
if (!currentWorld?.seriesWorldId) return null;
|
||||
return seriesWorlds.find((world: SeriesWorldListItem): boolean => world.id === currentWorld.seriesWorldId) || null;
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
{showToggle && !isSeriesMode && (
|
||||
<div className="bg-secondary/20 rounded-xl p-5 shadow-inner border border-secondary/30">
|
||||
<div className="bg-secondary rounded-xl p-4">
|
||||
<InputField
|
||||
icon={faToggleOn}
|
||||
icon={ToggleRight}
|
||||
fieldName={t('worldSetting.enableTool')}
|
||||
input={
|
||||
<ToggleSwitch
|
||||
@@ -483,25 +455,26 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
)}
|
||||
{(toolEnabled || isSeriesMode) && (
|
||||
<>
|
||||
{!isSeriesMode && bookSeriesId && !isCurrentlyOffline() &&
|
||||
{!isSeriesMode && bookSeriesId &&
|
||||
seriesWorlds.filter((seriesWorld: SeriesWorldProps): boolean => !worlds.some((world: WorldProps): boolean => world.seriesWorldId === seriesWorld.id)).length > 0 && (
|
||||
<SeriesImportSelector
|
||||
availableItems={seriesWorlds
|
||||
.filter((seriesWorld: SeriesWorldProps): boolean => !worlds.some((world: WorldProps): boolean => world.seriesWorldId === seriesWorld.id))
|
||||
.map((seriesWorld: SeriesWorldProps) => ({id: seriesWorld.id, name: seriesWorld.name}))}
|
||||
.map((seriesWorld: SeriesWorldProps): { id: string; name: string } => ({
|
||||
id: seriesWorld.id,
|
||||
name: seriesWorld.name
|
||||
}))}
|
||||
onImport={handleImportFromSeries}
|
||||
placeholder={t("seriesImport.selectElement")}
|
||||
label={t("seriesImport.importFromSeries")}
|
||||
/>
|
||||
)}
|
||||
<div
|
||||
className="bg-tertiary/90 backdrop-blur-sm rounded-xl p-5 border border-secondary/50 shadow-lg">
|
||||
<div className="grid grid-cols-1 gap-4 mb-4">
|
||||
<InputField
|
||||
fieldName={t("worldSetting.selectWorld")}
|
||||
input={
|
||||
<SelectBox
|
||||
onChangeCallBack={(e) => handleWorldSelect(e.target.value)}
|
||||
onChangeCallBack={(e: ChangeEvent<HTMLSelectElement>): void => handleWorldSelect(e.target.value)}
|
||||
data={worldsSelector.length > 0 ? worldsSelector : [{
|
||||
label: t("worldSetting.noWorldAvailable"),
|
||||
value: '0'
|
||||
@@ -510,9 +483,9 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
placeholder={t("worldSetting.selectWorldPlaceholder")}
|
||||
/>
|
||||
}
|
||||
actionIcon={faPlus}
|
||||
actionIcon={Plus}
|
||||
actionLabel={t("worldSetting.addWorldLabel")}
|
||||
action={async () => setShowAddNewWorld(!showAddNewWorld)}
|
||||
action={async (): Promise<void> => setShowAddNewWorld(!showAddNewWorld)}
|
||||
/>
|
||||
|
||||
{showAddNewWorld && (
|
||||
@@ -520,31 +493,25 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
input={
|
||||
<TextInput
|
||||
value={newWorldName}
|
||||
setValue={(e: ChangeEvent<HTMLInputElement>) => setNewWorldName(e.target.value)}
|
||||
setValue={(e: ChangeEvent<HTMLInputElement>): void => setNewWorldName(e.target.value)}
|
||||
placeholder={t("worldSetting.newWorldPlaceholder")}
|
||||
/>
|
||||
}
|
||||
actionIcon={faPlus}
|
||||
actionIcon={Plus}
|
||||
actionLabel={t("worldSetting.createWorldLabel")}
|
||||
addButtonCallBack={handleAddNewWorld}
|
||||
/>
|
||||
)}
|
||||
{!isSeriesMode && bookSeriesId && !isCurrentlyOffline() && worlds[selectedWorldIndex] && !worlds[selectedWorldIndex].seriesWorldId && (
|
||||
<button
|
||||
onClick={handleExportToSeries}
|
||||
className="flex items-center gap-2 px-4 py-2 bg-blue-500/90 hover:bg-blue-500 rounded-xl border border-blue-600 shadow-md hover:shadow-lg transition-all duration-200"
|
||||
>
|
||||
<FontAwesomeIcon icon={faShare} className="w-4 h-4 text-text-primary"/>
|
||||
<span className="text-text-primary font-medium">{t("worldSetting.exportToSeries")}</span>
|
||||
</button>
|
||||
{!isSeriesMode && bookSeriesId && worlds[selectedWorldIndex] && !worlds[selectedWorldIndex].seriesWorldId && (
|
||||
<Button variant="secondary" size="sm" icon={Share2} onClick={handleExportToSeries}>
|
||||
{t("worldSetting.exportToSeries")}
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{worlds.length > 0 && worlds[selectedWorldIndex] ? (
|
||||
<WorldContext.Provider value={{worlds, setWorlds, selectedWorldIndex, isSeriesMode}}>
|
||||
<div
|
||||
className="bg-tertiary/90 backdrop-blur-sm rounded-xl p-5 border border-secondary/50 shadow-lg">
|
||||
<div className="space-y-6">
|
||||
<div className="mb-4">
|
||||
<InputField
|
||||
fieldName={t("worldSetting.worldName")}
|
||||
@@ -556,8 +523,8 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
bookElementId={worlds[selectedWorldIndex].id}
|
||||
field="name"
|
||||
elementType="world"
|
||||
onDownload={() => {
|
||||
const seriesWorld = getSeriesWorldForCurrentWorld();
|
||||
onDownload={(): void => {
|
||||
const seriesWorld: SeriesWorldProps | null = getSeriesWorldForCurrentWorld();
|
||||
if (seriesWorld) {
|
||||
const updatedWorlds: WorldProps[] = [...worlds];
|
||||
updatedWorlds[selectedWorldIndex].name = seriesWorld.name;
|
||||
@@ -568,7 +535,7 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
>
|
||||
<TextInput
|
||||
value={worlds[selectedWorldIndex].name}
|
||||
setValue={(e: ChangeEvent<HTMLInputElement>) => {
|
||||
setValue={(e: ChangeEvent<HTMLInputElement>): void => {
|
||||
const updatedWorlds: WorldProps[] = [...worlds];
|
||||
updatedWorlds[selectedWorldIndex].name = e.target.value
|
||||
setWorlds(updatedWorlds);
|
||||
@@ -589,24 +556,21 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
bookElementId={worlds[selectedWorldIndex].id}
|
||||
field="history"
|
||||
elementType="world"
|
||||
onDownload={() => {
|
||||
const seriesWorld = getSeriesWorldForCurrentWorld();
|
||||
onDownload={(): void => {
|
||||
const seriesWorld: SeriesWorldProps | null = getSeriesWorldForCurrentWorld();
|
||||
if (seriesWorld) handleInputChange(seriesWorld.history || '', 'history');
|
||||
}}
|
||||
onSyncComplete={getSeriesWorlds}
|
||||
>
|
||||
<TexteAreaInput
|
||||
<TextAreaInput
|
||||
value={worlds[selectedWorldIndex].history || ''}
|
||||
setValue={(e) => handleInputChange(e.target.value, 'history')}
|
||||
setValue={(e: ChangeEvent<HTMLTextAreaElement>): void => handleInputChange(e.target.value, 'history')}
|
||||
placeholder={t("worldSetting.worldHistoryPlaceholder")}
|
||||
/>
|
||||
</SyncFieldWrapper>
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div
|
||||
className="bg-tertiary/90 backdrop-blur-sm rounded-xl shadow-lg p-4 border border-secondary/50">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
|
||||
<InputField
|
||||
fieldName={t("worldSetting.politics")}
|
||||
@@ -618,15 +582,15 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
bookElementId={worlds[selectedWorldIndex].id}
|
||||
field="politics"
|
||||
elementType="world"
|
||||
onDownload={() => {
|
||||
const seriesWorld = getSeriesWorldForCurrentWorld();
|
||||
onDownload={(): void => {
|
||||
const seriesWorld: SeriesWorldProps | null = getSeriesWorldForCurrentWorld();
|
||||
if (seriesWorld) handleInputChange(seriesWorld.politics || '', 'politics');
|
||||
}}
|
||||
onSyncComplete={getSeriesWorlds}
|
||||
>
|
||||
<TexteAreaInput
|
||||
<TextAreaInput
|
||||
value={worlds[selectedWorldIndex].politics || ''}
|
||||
setValue={(e) => handleInputChange(e.target.value, 'politics')}
|
||||
setValue={(e: ChangeEvent<HTMLTextAreaElement>): void => handleInputChange(e.target.value, 'politics')}
|
||||
placeholder={t("worldSetting.politicsPlaceholder")}
|
||||
/>
|
||||
</SyncFieldWrapper>
|
||||
@@ -642,25 +606,22 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
bookElementId={worlds[selectedWorldIndex].id}
|
||||
field="economy"
|
||||
elementType="world"
|
||||
onDownload={() => {
|
||||
const seriesWorld = getSeriesWorldForCurrentWorld();
|
||||
onDownload={(): void => {
|
||||
const seriesWorld: SeriesWorldProps | null = getSeriesWorldForCurrentWorld();
|
||||
if (seriesWorld) handleInputChange(seriesWorld.economy || '', 'economy');
|
||||
}}
|
||||
onSyncComplete={getSeriesWorlds}
|
||||
>
|
||||
<TexteAreaInput
|
||||
<TextAreaInput
|
||||
value={worlds[selectedWorldIndex].economy || ''}
|
||||
setValue={(e) => handleInputChange(e.target.value, 'economy')}
|
||||
setValue={(e: ChangeEvent<HTMLTextAreaElement>): void => handleInputChange(e.target.value, 'economy')}
|
||||
placeholder={t("worldSetting.economyPlaceholder")}
|
||||
/>
|
||||
</SyncFieldWrapper>
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
className="bg-tertiary/90 backdrop-blur-sm rounded-xl shadow-lg p-4 border border-secondary/50">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
|
||||
<InputField
|
||||
fieldName={t("worldSetting.religion")}
|
||||
@@ -672,15 +633,15 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
bookElementId={worlds[selectedWorldIndex].id}
|
||||
field="religion"
|
||||
elementType="world"
|
||||
onDownload={() => {
|
||||
const seriesWorld = getSeriesWorldForCurrentWorld();
|
||||
onDownload={(): void => {
|
||||
const seriesWorld: SeriesWorldProps | null = getSeriesWorldForCurrentWorld();
|
||||
if (seriesWorld) handleInputChange(seriesWorld.religion || '', 'religion');
|
||||
}}
|
||||
onSyncComplete={getSeriesWorlds}
|
||||
>
|
||||
<TexteAreaInput
|
||||
<TextAreaInput
|
||||
value={worlds[selectedWorldIndex].religion || ''}
|
||||
setValue={(e) => handleInputChange(e.target.value, 'religion')}
|
||||
setValue={(e: ChangeEvent<HTMLTextAreaElement>): void => handleInputChange(e.target.value, 'religion')}
|
||||
placeholder={t("worldSetting.religionPlaceholder")}
|
||||
/>
|
||||
</SyncFieldWrapper>
|
||||
@@ -696,31 +657,31 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
bookElementId={worlds[selectedWorldIndex].id}
|
||||
field="languages"
|
||||
elementType="world"
|
||||
onDownload={() => {
|
||||
const seriesWorld = getSeriesWorldForCurrentWorld();
|
||||
onDownload={(): void => {
|
||||
const seriesWorld: SeriesWorldProps | null = getSeriesWorldForCurrentWorld();
|
||||
if (seriesWorld) handleInputChange(seriesWorld.languages || '', 'languages');
|
||||
}}
|
||||
onSyncComplete={getSeriesWorlds}
|
||||
>
|
||||
<TexteAreaInput
|
||||
<TextAreaInput
|
||||
value={worlds[selectedWorldIndex].languages || ''}
|
||||
setValue={(e) => handleInputChange(e.target.value, 'languages')}
|
||||
setValue={(e: ChangeEvent<HTMLTextAreaElement>): void => handleInputChange(e.target.value, 'languages')}
|
||||
placeholder={t("worldSetting.languagesPlaceholder")}
|
||||
/>
|
||||
</SyncFieldWrapper>
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{elementSections.map((section, index) => (
|
||||
<div key={index}
|
||||
className="bg-tertiary/90 backdrop-blur-sm rounded-xl shadow-lg p-4 border border-secondary/50">
|
||||
|
||||
{elementSections.map((section: ElementSection, index: number): React.JSX.Element => {
|
||||
const SectionIcon: LucideIcon = section.icon;
|
||||
return (
|
||||
<div key={index}>
|
||||
<h3 className="text-lg font-semibold text-text-primary mb-4 flex items-center">
|
||||
<FontAwesomeIcon icon={section.icon} className="mr-2 w-5 h-5"/>
|
||||
<SectionIcon className="mr-2 w-5 h-5" strokeWidth={1.75}/>
|
||||
{section.title}
|
||||
<span
|
||||
className="ml-2 text-sm bg-dark-background text-text-secondary py-0.5 px-2 rounded-full">
|
||||
className="ml-2 text-sm bg-secondary text-text-secondary py-0.5 px-2 rounded-full">
|
||||
{worlds[selectedWorldIndex][section.section]?.length || 0}
|
||||
</span>
|
||||
</h3>
|
||||
@@ -728,13 +689,14 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
sectionLabel={section.title}
|
||||
sectionType={section.section}
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</WorldContext.Provider>
|
||||
) : (
|
||||
<div
|
||||
className="bg-tertiary/90 backdrop-blur-sm rounded-xl shadow-lg p-8 border border-secondary/50 text-center">
|
||||
<p className="text-text-secondary mb-4">{t("worldSetting.noWorldAvailable")}</p>
|
||||
<div className="text-center py-8">
|
||||
<p className="text-text-secondary">{t("worldSetting.noWorldAvailable")}</p>
|
||||
</div>
|
||||
)}
|
||||
</>
|
||||
@@ -743,4 +705,4 @@ export function WorldSetting(props: WorldSettingProps, ref: React.Ref<{ handleSa
|
||||
);
|
||||
}
|
||||
|
||||
export default forwardRef(WorldSetting);
|
||||
export default forwardRef<SettingRef, WorldSettingProps>(WorldSetting);
|
||||
Reference in New Issue
Block a user