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.

components/series/SeriesSettingSidebar.tsx

@@ -1,34 +1,17 @@
 'use client'
-import Link from "next/link";
-import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
-import {
-    faBook,
-    faGlobe,
-    faHatWizard,
-    faMapMarkedAlt,
-    faPencilAlt,
-    faTrash,
-    faUser
-} from "@fortawesome/free-solid-svg-icons";
 import React, {Dispatch, SetStateAction, useContext, useState} from "react";
-import {IconDefinition} from "@fortawesome/fontawesome-svg-core";
-import {useTranslations} from "next-intl";
-import AlertBox from "@/components/AlertBox";
-import {SessionContext} from "@/context/SessionContext";
+import {Book, Globe, LucideIcon, Map, Pencil, Trash2, User, Wand2} from 'lucide-react';
+import {useTranslations} from '@/lib/i18n';
+import AlertBox from "@/components/ui/AlertBox";
+import {SessionContext, SessionContextProps} from "@/context/SessionContext";
 import {LangContext, LangContextProps} from "@/context/LangContext";
-import {AlertContext} from "@/context/AlertContext";
-import System from "@/lib/models/System";
-import {SeriesContext, SeriesContextProps} from "@/context/SeriesContext";
-import OfflineContext, {OfflineContextType} from "@/context/OfflineContext";
-import {SeriesSyncContext, SeriesSyncContextProps} from "@/context/SeriesSyncContext";
-import {LocalSyncQueueContext, LocalSyncQueueContextProps} from "@/context/SyncQueueContext";
-import {SyncedSeries} from "@/lib/models/SyncedSeries";
-import * as tauri from '@/lib/tauri';
+import {AlertContext, AlertContextProps} from "@/context/AlertContext";
+import {apiDelete} from '@/lib/api/client';
 
 interface SeriesSettingOption {
     id: string;
     name: string;
-    icon: IconDefinition;
+    icon: LucideIcon;
 }
 
 interface SeriesSettingSidebarProps {
@@ -46,37 +29,21 @@ export default function SeriesSettingSidebar(
         onClose
     }: SeriesSettingSidebarProps) {
     const t = useTranslations();
-    const {session} = useContext(SessionContext);
-    const {lang} = useContext<LangContextProps>(LangContext);
-    const {errorMessage, successMessage} = useContext(AlertContext);
+    const {session}: SessionContextProps = useContext<SessionContextProps>(SessionContext);
+    const {lang}: LangContextProps = useContext<LangContextProps>(LangContext);
+    const {errorMessage, successMessage}: AlertContextProps = useContext<AlertContextProps>(AlertContext);
     const userToken: string = session?.accessToken ? session?.accessToken : '';
-    const {localSeries} = useContext<SeriesContextProps>(SeriesContext);
-    const {isCurrentlyOffline} = useContext<OfflineContextType>(OfflineContext);
-    const {localSyncedSeries} = useContext<SeriesSyncContextProps>(SeriesSyncContext);
-    const {addToQueue} = useContext<LocalSyncQueueContextProps>(LocalSyncQueueContext);
 
     const [showDeleteConfirm, setShowDeleteConfirm] = useState<boolean>(false);
 
     async function handleDeleteSeries(): Promise<void> {
         try {
-            const deleteData = {seriesId: seriesId, deletedAt: System.timeStampInSeconds()};
-            let success: boolean;
-
-            if (isCurrentlyOffline() || localSeries) {
-                success = await tauri.deleteSeries(deleteData.seriesId, deleteData.deletedAt);
-            } else {
-                success = await System.authDeleteToServer<boolean>(
-                    'series/delete',
-                    deleteData,
-                    userToken,
-                    lang
-                );
-
-                if (localSyncedSeries.find((s: SyncedSeries): boolean => s.id === seriesId)) {
-                    addToQueue('delete_series', {data: deleteData});
-                }
-            }
-
+            const success: boolean = await apiDelete<boolean>(
+                'series/delete',
+                {seriesId: seriesId},
+                userToken,
+                lang
+            );
             if (success) {
                 successMessage(t('seriesSetting.deleteSuccess'));
                 onClose();
@@ -97,71 +64,50 @@ export default function SeriesSettingSidebar(
     }
 
     const settings: SeriesSettingOption[] = [
-        {
-            id: 'basic-information',
-            name: 'seriesSetting.basicInformation',
-            icon: faPencilAlt
-        },
-        {
-            id: 'books',
-            name: 'seriesSetting.books',
-            icon: faBook
-        },
-        {
-            id: 'characters',
-            name: 'seriesSetting.characters',
-            icon: faUser
-        },
-        {
-            id: 'worlds',
-            name: 'seriesSetting.worlds',
-            icon: faGlobe
-        },
-        {
-            id: 'locations',
-            name: 'seriesSetting.locations',
-            icon: faMapMarkedAlt
-        },
-        {
-            id: 'spells',
-            name: 'seriesSetting.spells',
-            icon: faHatWizard
-        }
+        {id: 'basic-information', name: 'seriesSetting.basicInformation', icon: Pencil},
+        {id: 'books', name: 'seriesSetting.books', icon: Book},
+        {id: 'characters', name: 'seriesSetting.characters', icon: User},
+        {id: 'worlds', name: 'seriesSetting.worlds', icon: Globe},
+        {id: 'locations', name: 'seriesSetting.locations', icon: Map},
+        {id: 'spells', name: 'seriesSetting.spells', icon: Wand2},
     ];
 
     return (
-        <div className="py-6 px-3 flex flex-col h-full">
-            <nav className="space-y-1 flex-1">
-                {
-                    settings.map((setting: SeriesSettingOption) => (
-                        <Link
+        <div className="py-4 px-2 flex flex-col h-full">
+            <nav className="space-y-0.5 flex-1">
+                {settings.map((setting: SeriesSettingOption) => {
+                    const Icon: LucideIcon = setting.icon;
+                    const isActive: boolean = selectedSetting === setting.id;
+                    return (
+                        <button
                             key={setting.id}
-                            href={''}
                             onClick={(): void => setSelectedSetting(setting.id)}
-                            className={`flex items-center text-base rounded-xl transition-all duration-200 ${
-                                selectedSetting === setting.id
-                                    ? 'bg-primary/20 text-text-primary border-l-4 border-primary font-semibold shadow-md scale-105'
-                                    : 'text-text-secondary hover:bg-secondary/50 hover:text-text-primary hover:scale-102'
-                            } p-3 mb-1`}>
-                            <FontAwesomeIcon
-                                icon={setting.icon}
-                                className={`mr-3 ${selectedSetting === setting.id ? 'text-primary w-5 h-5' : 'text-text-secondary w-5 h-5'}`}/>
+                            className={`flex items-center w-full text-sm rounded-lg transition-colors duration-150 px-3 py-2 ${
+                                isActive
+                                    ? 'bg-secondary text-text-primary font-medium'
+                                    : 'text-text-secondary hover:bg-secondary/50 hover:text-text-primary'
+                            }`}
+                        >
+                            <Icon
+                                className={`mr-2.5 w-4 h-4 flex-shrink-0 ${isActive ? 'text-primary' : 'text-muted'}`}
+                                strokeWidth={1.75}
+                            />
                             {t(setting.name)}
-                        </Link>
-                    ))
-                }
+                        </button>
+                    );
+                })}
             </nav>
-
-            <div className="mt-6 pt-4 border-t border-secondary/50">
+            
+            <div className="mt-4 pt-3 border-t border-secondary">
                 <button
                     onClick={(): void => setShowDeleteConfirm(true)}
-                    className="w-full flex items-center justify-center gap-2 p-3 text-red-400 hover:bg-red-500/20 rounded-xl transition-all duration-200"
+                    className="w-full flex items-center justify-center gap-2 px-3 py-2 text-sm text-accent-red hover:bg-accent-red/20 rounded-lg transition-colors duration-150"
                 >
-                    <FontAwesomeIcon icon={faTrash} className="w-4 h-4"/>
+                    <Trash2 className="w-4 h-4" strokeWidth={1.75}/>
                     {t('seriesSetting.deleteSeries')}
                 </button>
             </div>
-
+            
             {showDeleteConfirm && (
                 <AlertBox
                     title={t('seriesSetting.deleteSeries')}