Merge pull request #85 from eric861129/dev

refactor: split useMarkdownEditor into specialized hooks and bump ver…

Author: Crs-Chiyu

CHANGELOG.md

@@ -5,6 +5,16 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [1.2.8] - 2026-01-09
+
+### Refactored
+- **Hook Architecture**:
+    - Decomposed the monolithic `useMarkdownEditor` into specialized hooks for better maintainability and separation of concerns.
+    - Added `hooks/useEditorState.ts`: Manages core content and parsing state.
+    - Added `hooks/useDocxExport.ts`: Handles document generation and file IO.
+    - Added `hooks/useSyncScroll.ts`: Encapsulates scroll synchronization logic.
+    - Added `hooks/useWordCount.ts`: Optimized word counting with `useMemo`.
+
 ## [1.2.7] - 2026-01-09
 
 ### Added

README.md

@@ -1,7 +1,7 @@
-# BookPublisher MD2Docx | v1.2.7
+# BookPublisher MD2Docx | v1.2.8
 
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
-[![Version](https://img.shields.io/badge/version-1.2.7-blue.svg)](https://github.com/eric861129/BookPublisher_MD2Doc)
+[![Version](https://img.shields.io/badge/version-1.2.8-blue.svg)](https://github.com/eric861129/BookPublisher_MD2Doc)
 
 [🇹🇼 中文](README.md) | [🇺🇸 English](README_EN.md)
 

README_EN.md

@@ -1,7 +1,7 @@
-# BookPublisher MD2Docx | v1.2.7
+# BookPublisher MD2Docx | v1.2.8
 
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
-[![Version](https://img.shields.io/badge/version-1.2.7-blue.svg)](https://github.com/eric861129/BookPublisher_MD2Doc)
+[![Version](https://img.shields.io/badge/version-1.2.8-blue.svg)](https://github.com/eric861129/BookPublisher_MD2Doc)
 
 [🇹🇼 中文](README.md) | [🇺🇸 English](README_EN.md)
 

constants/defaultContent.ts

@@ -88,7 +88,7 @@ ${BT}${BT}${BT}
 ${BT}${BT}${BT}json:no-ln
 {
   "name": "book-publisher",
-  "version": "1.2.7",
+  "version": "1.2.8",
   "private": true
 }
 ${BT}${BT}${BT}
@@ -231,7 +231,7 @@ ${BT}${BT}${BT}
 Use ${BT}json:no-ln${BT} or ${BT}:plain${BT} syntax. Ideal for short config files or examples where line numbers aren't needed:
 
   "name": "book-publisher",
-  "version": "1.2.7",
+  "version": "1.2.8",
   "private": true
 }
 ${BT}${BT}${BT}

constants/meta.ts

@@ -7,3 +7,10 @@
  */
 
 export const APP_VERSION = __APP_VERSION__;
+
+export const PAGE_SIZES = [
+  { name: "tech", width: 17, height: 23 },
+  { name: "a4", width: 21, height: 29.7 },
+  { name: "a5", width: 14.8, height: 21 },
+  { name: "b5", width: 17.6, height: 25 },
+];

hooks/useDocxExport.ts

@@ -0,0 +1,68 @@
+import { useState } from 'react';
+import saveAs from 'file-saver';
+import { generateDocx } from '../services/docxGenerator';
+import { ParsedBlock, DocumentMeta } from '../services/types';
+import { PAGE_SIZES } from '../constants/meta';
+
+interface UseDocxExportProps {
+  content: string;
+  parsedBlocks: ParsedBlock[];
+  documentMeta: DocumentMeta;
+}
+
+export const useDocxExport = ({ content, parsedBlocks, documentMeta }: UseDocxExportProps) => {
+  const [isGenerating, setIsGenerating] = useState(false);
+  const [selectedSizeIndex, setSelectedSizeIndex] = useState(0);
+
+  // DOCX Download
+  const handleDownload = async () => {
+    if (parsedBlocks.length === 0) return;
+    setIsGenerating(true);
+    try {
+      const sizeConfig = PAGE_SIZES[selectedSizeIndex];
+      const blob = await generateDocx(parsedBlocks, { 
+        widthCm: sizeConfig.width, 
+        heightCm: sizeConfig.height,
+        showLineNumbers: true, // Default to true for technical books
+        meta: documentMeta
+      });
+      
+      const safeTitle = documentMeta.title 
+        ? documentMeta.title.replace(/[\\/:*?"<>|]/g, '_') 
+        : "Professional_Manuscript";
+        
+      saveAs(blob, `${safeTitle}.docx`);
+    } catch (error) {
+      console.error("Word Generation Failed:", error);
+      alert("轉檔失敗，請確認內容格式是否正確。");
+    } finally {
+      setIsGenerating(false);
+    }
+  };
+
+  // Markdown Export
+  const handleExportMarkdown = () => {
+    if (!content) return;
+    try {
+      const blob = new Blob([content], { type: "text/markdown;charset=utf-8" });
+      
+      const safeTitle = documentMeta.title 
+        ? documentMeta.title.replace(/[\\/:*?"<>|]/g, '_') 
+        : "manuscript";
+        
+      saveAs(blob, `${safeTitle}.md`);
+    } catch (error) {
+      console.error("Markdown Export Failed:", error);
+      alert("匯出失敗");
+    }
+  };
+
+  return {
+    isGenerating,
+    selectedSizeIndex,
+    setSelectedSizeIndex,
+    handleDownload,
+    handleExportMarkdown,
+    pageSizes: PAGE_SIZES
+  };
+};

hooks/useEditorState.ts

@@ -0,0 +1,65 @@
+import { useState, useEffect } from 'react';
+import { useTranslation } from 'react-i18next';
+import { parseMarkdown } from '../services/markdownParser';
+import { ParsedBlock, DocumentMeta } from '../services/types';
+import { INITIAL_CONTENT_ZH, INITIAL_CONTENT_EN } from '../constants/defaultContent';
+
+export const useEditorState = () => {
+  const { t, i18n } = useTranslation();
+  const language = i18n.language.split('-')[0];
+
+  const getInitialContent = (lang: string) => lang.startsWith('zh') ? INITIAL_CONTENT_ZH : INITIAL_CONTENT_EN;
+
+  const [content, setContent] = useState(() => {
+    return localStorage.getItem('draft_content') || getInitialContent(i18n.language);
+  });
+  
+  const [parsedBlocks, setParsedBlocks] = useState<ParsedBlock[]>([]);
+  const [documentMeta, setDocumentMeta] = useState<DocumentMeta>({});
+
+  // Parsing & Auto-save (Debounced)
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      try {
+        const { blocks, meta } = parseMarkdown(content);
+        setParsedBlocks(blocks);
+        setDocumentMeta(meta);
+        localStorage.setItem('draft_content', content);
+      } catch (e) {
+        console.error("Markdown parsing error:", e);
+      }
+    }, 300);
+
+    return () => clearTimeout(timer);
+  }, [content]);
+
+  // Language Toggle Logic
+  const toggleLanguage = () => {
+    const nextLang = i18n.language.startsWith('zh') ? 'en' : 'zh';
+    
+    if (confirm(t('switchLangConfirm'))) {
+      i18n.changeLanguage(nextLang);
+      setContent(getInitialContent(nextLang));
+      localStorage.removeItem('draft_content');
+    }
+  };
+
+  // Reset Logic
+  const resetToDefault = () => {
+    if (confirm(t('resetConfirm'))) {
+      setContent(getInitialContent(i18n.language));
+      localStorage.removeItem('draft_content');
+    }
+  };
+
+  return {
+    content,
+    setContent,
+    parsedBlocks,
+    documentMeta,
+    language,
+    toggleLanguage,
+    resetToDefault,
+    t // Export translation helper if needed
+  };
+};