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,24 +1,15 @@
|
||||
'use client'
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
|
||||
import {
|
||||
faFeather,
|
||||
faGlobe,
|
||||
faHatWizard,
|
||||
faInfoCircle,
|
||||
faMapMarkerAlt,
|
||||
faUsers
|
||||
} from "@fortawesome/free-solid-svg-icons";
|
||||
import {ExternalLink, Feather, Globe, Info, MapPin, MessageCircle, Users, Wand2, X} from 'lucide-react';
|
||||
import React, {lazy, Suspense, useContext, useEffect, useState} from "react";
|
||||
import {BookContext} from "@/context/BookContext";
|
||||
import {PanelComponent} from "@/lib/models/Editor";
|
||||
import PanelHeader from "@/components/PanelHeader";
|
||||
import {BookContext, BookContextProps} from "@/context/BookContext";
|
||||
import {PanelComponent} from "@/lib/types/editor";
|
||||
import SectionHeader from "@/components/ui/SectionHeader";
|
||||
import AboutEditors from "@/components/rightbar/AboutERitors";
|
||||
import {faDiscord, faFacebook} from "@fortawesome/free-brands-svg-icons";
|
||||
import QuillSense from "@/components/quillsense/QuillSenseComponent";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {faSpinner} from "@fortawesome/free-solid-svg-icons";
|
||||
import OfflineContext, {OfflineContextType} from "@/context/OfflineContext";
|
||||
import * as tauri from '@/lib/tauri';
|
||||
import {useTranslations} from '@/lib/i18n';
|
||||
import PulseLoader from '@/components/ui/PulseLoader';
|
||||
import InsetPanel from "@/components/ui/InsetPanel";
|
||||
import IconButton from "@/components/ui/IconButton";
|
||||
|
||||
// Lazy loaded Editor components
|
||||
const WorldEditor = lazy(function () {
|
||||
@@ -34,21 +25,13 @@ const SpellEditor = lazy(function () {
|
||||
return import('@/components/book/settings/spells/editor/SpellEditor');
|
||||
});
|
||||
|
||||
function LoadingSpinner(): React.JSX.Element {
|
||||
return (
|
||||
<div className="flex items-center justify-center py-12">
|
||||
<FontAwesomeIcon icon={faSpinner} className="w-8 h-8 text-primary animate-spin"/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
interface PanelContentProps {
|
||||
currentPanelId: number | undefined;
|
||||
}
|
||||
|
||||
function PanelContent({currentPanelId}: PanelContentProps): React.JSX.Element {
|
||||
return (
|
||||
<Suspense fallback={<LoadingSpinner/>}>
|
||||
<Suspense fallback={<PulseLoader/>}>
|
||||
{currentPanelId === 1 && <QuillSense/>}
|
||||
{currentPanelId === 2 && <WorldEditor/>}
|
||||
{currentPanelId === 3 && <LocationEditor/>}
|
||||
@@ -58,27 +41,11 @@ function PanelContent({currentPanelId}: PanelContentProps): React.JSX.Element {
|
||||
);
|
||||
}
|
||||
|
||||
interface PanelHeaderProps {
|
||||
currentPanel: PanelComponent | undefined;
|
||||
onClose: () => Promise<void>;
|
||||
}
|
||||
|
||||
function EditorPanelHeader({currentPanel, onClose}: PanelHeaderProps): React.JSX.Element {
|
||||
return (
|
||||
<PanelHeader
|
||||
title={currentPanel?.title ?? ''}
|
||||
description={currentPanel?.description ?? ''}
|
||||
badge={currentPanel?.badge ?? ''}
|
||||
icon={currentPanel?.icon}
|
||||
callBackAction={onClose}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
export default function ComposerRightBar(): React.JSX.Element {
|
||||
const {book} = useContext(BookContext);
|
||||
const {book}: BookContextProps = useContext<BookContextProps>(BookContext);
|
||||
const t = useTranslations();
|
||||
const {isCurrentlyOffline} = useContext<OfflineContextType>(OfflineContext);
|
||||
|
||||
const [panelHidden, setPanelHidden] = useState<boolean>(false);
|
||||
const [currentPanel, setCurrentPanel] = useState<PanelComponent | undefined>();
|
||||
@@ -101,35 +68,35 @@ export default function ComposerRightBar(): React.JSX.Element {
|
||||
title: t("composerRightBar.editorComponents.quillSense.title"),
|
||||
description: t("composerRightBar.editorComponents.quillSense.description"),
|
||||
badge: t("composerRightBar.editorComponents.quillSense.badge"),
|
||||
icon: faFeather
|
||||
icon: Feather
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: t("composerRightBar.editorComponents.worlds.title"),
|
||||
description: t("composerRightBar.editorComponents.worlds.description"),
|
||||
badge: t("composerRightBar.editorComponents.worlds.badge"),
|
||||
icon: faGlobe
|
||||
icon: Globe
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: t("composerRightBar.editorComponents.locations.title"),
|
||||
description: t("composerRightBar.editorComponents.locations.description"),
|
||||
badge: t("composerRightBar.editorComponents.locations.badge"),
|
||||
icon: faMapMarkerAlt
|
||||
icon: MapPin
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
title: t("composerRightBar.editorComponents.characters.title"),
|
||||
description: t("composerRightBar.editorComponents.characters.description"),
|
||||
badge: t("composerRightBar.editorComponents.characters.badge"),
|
||||
icon: faUsers
|
||||
icon: Users
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: t("composerRightBar.editorComponents.spells.title"),
|
||||
description: t("composerRightBar.editorComponents.spells.description"),
|
||||
badge: t("composerRightBar.editorComponents.spells.badge"),
|
||||
icon: faHatWizard
|
||||
icon: Wand2
|
||||
},
|
||||
];
|
||||
|
||||
@@ -139,7 +106,7 @@ export default function ComposerRightBar(): React.JSX.Element {
|
||||
title: t("composerRightBar.homeComponents.about.title"),
|
||||
description: t("composerRightBar.homeComponents.about.description"),
|
||||
badge: t("composerRightBar.homeComponents.about.badge"),
|
||||
icon: faInfoCircle,
|
||||
icon: Info,
|
||||
action: function (): void {
|
||||
setShowAbout(true);
|
||||
}
|
||||
@@ -149,9 +116,9 @@ export default function ComposerRightBar(): React.JSX.Element {
|
||||
title: t("composerRightBar.homeComponents.facebook.title"),
|
||||
description: t("composerRightBar.homeComponents.facebook.description"),
|
||||
badge: t("composerRightBar.homeComponents.facebook.badge"),
|
||||
icon: faFacebook,
|
||||
action: function (): Promise<void> {
|
||||
return tauri.openExternal('https://www.facebook.com/profile.php?id=61562628720878');
|
||||
icon: ExternalLink,
|
||||
action: function (): void {
|
||||
window.open('https://www.facebook.com/profile.php?id=61562628720878', '_blank');
|
||||
}
|
||||
},
|
||||
{
|
||||
@@ -159,9 +126,9 @@ export default function ComposerRightBar(): React.JSX.Element {
|
||||
title: t("composerRightBar.homeComponents.discord.title"),
|
||||
description: t("composerRightBar.homeComponents.discord.description"),
|
||||
badge: t("composerRightBar.homeComponents.discord.badge"),
|
||||
icon: faDiscord,
|
||||
action: function (): Promise<void> {
|
||||
return tauri.openExternal('https://discord.gg/CHXRPvmaXm');
|
||||
icon: MessageCircle,
|
||||
action: function (): void {
|
||||
window.open('https://discord.gg/CHXRPvmaXm', '_blank');
|
||||
}
|
||||
}
|
||||
];
|
||||
@@ -180,89 +147,72 @@ export default function ComposerRightBar(): React.JSX.Element {
|
||||
async function handleClosePanel(): Promise<void> {
|
||||
setPanelHidden(!panelHidden);
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<div id="right-panel-container" className="flex transition-all duration-300">
|
||||
{panelHidden && (
|
||||
<div id="right-panel"
|
||||
className="bg-tertiary/95 backdrop-blur-sm border-l border-secondary/50 min-w-[450px] max-w-[450px] h-full transition-all duration-300 overflow-hidden shadow-2xl">
|
||||
<div className="flex flex-col h-full">
|
||||
<EditorPanelHeader
|
||||
currentPanel={currentPanel}
|
||||
onClose={handleClosePanel}
|
||||
/>
|
||||
<div className="flex-grow overflow-auto">
|
||||
className="bg-tertiary min-w-[450px] max-w-[450px] h-full transition-all duration-300 flex flex-col">
|
||||
<InsetPanel>
|
||||
<div className="p-4">
|
||||
<SectionHeader title={currentPanel?.title ?? ''}
|
||||
icon={currentPanel?.icon}
|
||||
actions={<IconButton icon={X} variant="ghost"
|
||||
onClick={handleClosePanel}/>}/>
|
||||
</div>
|
||||
<div className="flex-1 overflow-auto">
|
||||
<PanelContent currentPanelId={currentPanel?.id}/>
|
||||
</div>
|
||||
</div>
|
||||
</InsetPanel>
|
||||
</div>
|
||||
)}
|
||||
<div className="bg-tertiary border-l border-secondary/50 p-3 flex flex-col space-y-3 shadow-xl">
|
||||
<div className="bg-tertiary p-1 flex flex-col space-y-2">
|
||||
{book ? editorComponents.filter(function (component: PanelComponent): boolean {
|
||||
// Masquer QuillSense (id=1) si offline, livre local ou desactive pour ce livre
|
||||
if (component.id === 1) {
|
||||
if (isCurrentlyOffline() || book?.localBook) {
|
||||
return false;
|
||||
}
|
||||
if (book.quillsenseEnabled === false) {
|
||||
return false;
|
||||
}
|
||||
if (component.id === 1 && book.quillsenseEnabled === false) {
|
||||
return false;
|
||||
}
|
||||
// Masquer Worlds (id=2) si desactive pour ce livre
|
||||
if (component.id === 2 && !book?.tools?.worlds) {
|
||||
return false;
|
||||
}
|
||||
// Masquer Locations (id=3) si desactive pour ce livre
|
||||
if (component.id === 3 && !book?.tools?.locations) {
|
||||
return false;
|
||||
}
|
||||
// Masquer Characters (id=4) si desactive pour ce livre
|
||||
if (component.id === 4 && !book?.tools?.characters) {
|
||||
return false;
|
||||
}
|
||||
// Masquer Spells (id=5) si desactive pour ce livre
|
||||
if (component.id === 5 && !book?.tools?.spells) {
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
}).map(function (component: PanelComponent) {
|
||||
return (
|
||||
<button
|
||||
<IconButton
|
||||
key={component.id}
|
||||
icon={component.icon}
|
||||
variant="ghost"
|
||||
shape="square"
|
||||
tooltip={component.title}
|
||||
disabled={disabled(component.id)}
|
||||
selected={panelHidden && currentPanel?.id === component.id}
|
||||
onClick={function (): void {
|
||||
togglePanel(component);
|
||||
setCurrentPanel(component);
|
||||
}}
|
||||
className={`group relative p-3 rounded-xl transition-all duration-200 ${
|
||||
disabled(component.id)
|
||||
? 'bg-secondary/10 text-muted cursor-not-allowed opacity-40'
|
||||
: panelHidden && currentPanel?.id === component.id
|
||||
? 'bg-primary text-text-primary shadow-lg shadow-primary/30 scale-105'
|
||||
: 'bg-secondary/30 text-muted hover:text-text-primary hover:bg-secondary hover:shadow-md hover:scale-105'
|
||||
}`}
|
||||
title={component.title}
|
||||
>
|
||||
<FontAwesomeIcon icon={component.icon}
|
||||
className="w-4 h-4 transition-transform duration-200 group-hover:scale-110"/>
|
||||
{panelHidden && currentPanel?.id === component.id && (
|
||||
<div className="absolute -left-1 top-1/2 -translate-y-1/2 w-1 h-8 bg-primary rounded-r-full"></div>
|
||||
)}
|
||||
</button>
|
||||
/>
|
||||
);
|
||||
}) : homeComponents.map(function (component: PanelComponent) {
|
||||
return (
|
||||
<button
|
||||
<IconButton
|
||||
key={component.id}
|
||||
onClick={component.action ?? function (): void {}}
|
||||
className={`group relative p-3 rounded-xl transition-all duration-200 ${panelHidden && currentPanel?.id === component.id
|
||||
? 'bg-primary text-text-primary shadow-lg shadow-primary/30 scale-105'
|
||||
: 'bg-secondary/30 text-muted hover:text-text-primary hover:bg-secondary hover:shadow-md hover:scale-105'}`}
|
||||
title={component.title}
|
||||
>
|
||||
<FontAwesomeIcon icon={component.icon}
|
||||
className="w-4 h-4 transition-transform duration-200 group-hover:scale-110"/>
|
||||
</button>
|
||||
icon={component.icon}
|
||||
variant="ghost"
|
||||
shape="square"
|
||||
tooltip={component.title}
|
||||
selected={panelHidden && currentPanel?.id === component.id}
|
||||
onClick={component.action ?? function (): void {
|
||||
}}
|
||||
/>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user