Add BooksSyncContext, refine database schema, and enhance synchronization support

- Introduce `BooksSyncContext` for managing book synchronization states (server-only, local-only, to-sync, etc.). - Remove `UserContext` and related dependencies. - Refine localization strings (`en.json`) with sync-related updates (e.g., "toSyncFromServer", "toSyncToServer"). - Extend database schema with additional tables and fields for syncing books, chapters, and related entities. - Add `last_update` fields and update corresponding repository methods to support synchronization logic. - Enhance IPC handlers with stricter typing, data validation, and sync-aware operations.
2025-12-07 14:36:03 -05:00
parent db2c88a42d
commit bb331b5c22
22 changed files with 2594 additions and 370 deletions
--- a/components/SyncBook.tsx
+++ b/components/SyncBook.tsx
@@ -0,0 +1,138 @@
+import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
+import {faCloud, faCloudArrowDown, faCloudArrowUp, faSpinner} from "@fortawesome/free-solid-svg-icons";
+import {useTranslations} from "next-intl";
+import {useState, useContext} from "react";
+import OfflineContext, {OfflineContextType} from "@/context/OfflineContext";
+import System from "@/lib/models/System";
+import {SessionContext, SessionContextProps} from "@/context/SessionContext";
+import {LangContext} from "@/context/LangContext";
+import {CompleteBook} from "@/lib/models/Book";
+import {SyncType} from "@/context/BooksSyncContext";
+import {AlertContext, AlertContextProps} from "@/context/AlertContext";
+
+interface SyncBookProps {
+    bookId: string;
+    status: SyncType;
+}
+
+export default function SyncBook({bookId, status}: SyncBookProps) {
+    const t = useTranslations();
+    const {session} = useContext<SessionContextProps>(SessionContext);
+    const {lang} = useContext(LangContext);
+    const {errorMessage} = useContext<AlertContextProps>(AlertContext);
+    const {isCurrentlyOffline} = useContext<OfflineContextType>(OfflineContext);
+    const [isLoading, setIsLoading] = useState<boolean>(false);
+    const [currentStatus, setCurrentStatus] = useState<SyncType>(status);
+
+    const isOffline: boolean = isCurrentlyOffline();
+
+    async function upload(): Promise<void> {
+        // TODO: Implement upload local-only book to server
+    }
+
+    async function download(): Promise<void> {
+        try {
+            const response: CompleteBook = await System.authGetQueryToServer('book/sync/download', session.accessToken, lang, {bookId});
+            if (!response) {
+                errorMessage(t("bookCard.downloadError"));
+                return;
+            }
+            const syncStatus:boolean = await window.electron.invoke<boolean>('db:book:syncSave', response);
+            if (!syncStatus) {
+                errorMessage(t("bookCard.downloadError"));
+                return;
+            }
+            setCurrentStatus('synced');
+        } catch (e:unknown) {
+            if (e instanceof Error) {
+                errorMessage(e.message);
+            } else {
+                errorMessage(t("bookCard.downloadError"));
+            }
+        }
+    }
+
+    async function syncFromServer(): Promise<void> {
+        // TODO: Implement sync from server (server has newer version)
+    }
+
+    async function syncToServer(): Promise<void> {
+        // TODO: Implement sync to server (local has newer version)
+    }
+
+    if (isLoading) {
+        return (
+            <div className="flex items-center gap-2">
+                <span className="text-primary">
+                    <FontAwesomeIcon icon={faSpinner} className="w-4 h-4 animate-spin"/>
+                </span>
+            </div>
+        );
+    }
+
+    return (
+        <div className="flex items-center gap-2">
+            {/* Fully synced - no action needed */}
+            {currentStatus === 'synced' && (
+                <span
+                    className="text-gray-light"
+                    title={t("bookCard.synced")}
+                >
+                    <FontAwesomeIcon icon={faCloud} className="w-4 h-4"/>
+                </span>
+            )}
+
+            {/* Local only - can upload to server */}
+            {currentStatus === 'local-only' && (
+                <button
+                    onClick={upload}
+                    className={`transition-colors ${isOffline ? 'text-gray-dark cursor-not-allowed' : 'text-gray hover:text-primary cursor-pointer'}`}
+                    title={t("bookCard.localOnly")}
+                    type="button"
+                    disabled={isOffline}
+                >
+                    <FontAwesomeIcon icon={faCloudArrowUp} className="w-4 h-4"/>
+                </button>
+            )}
+
+            {/* Server only - can download to local */}
+            {currentStatus === 'server-only' && (
+                <button
+                    onClick={download}
+                    className={`transition-colors ${isOffline ? 'text-gray-dark cursor-not-allowed' : 'text-gray hover:text-primary cursor-pointer'}`}
+                    title={t("bookCard.serverOnly")}
+                    type="button"
+                    disabled={isOffline}
+                >
+                    <FontAwesomeIcon icon={faCloudArrowDown} className="w-4 h-4"/>
+                </button>
+            )}
+
+            {/* Needs to sync from server (server has newer version) */}
+            {currentStatus === 'to-sync-from-server' && (
+                <button
+                    onClick={syncFromServer}
+                    className={`transition-colors ${isOffline ? 'text-gray-dark cursor-not-allowed' : 'text-warning hover:text-primary cursor-pointer'}`}
+                    title={t("bookCard.toSyncFromServer")}
+                    type="button"
+                    disabled={isOffline}
+                >
+                    <FontAwesomeIcon icon={faCloudArrowDown} className="w-4 h-4"/>
+                </button>
+            )}
+
+            {/* Needs to sync to server (local has newer version) */}
+            {currentStatus === 'to-sync-to-server' && (
+                <button
+                    onClick={syncToServer}
+                    className={`transition-colors ${isOffline ? 'text-gray-dark cursor-not-allowed' : 'text-warning hover:text-primary cursor-pointer'}`}
+                    title={t("bookCard.toSyncToServer")}
+                    type="button"
+                    disabled={isOffline}
+                >
+                    <FontAwesomeIcon icon={faCloudArrowUp} className="w-4 h-4"/>
+                </button>
+            )}
+        </div>
+    );
+}