assistant-note/src/pages/Note/Hlexical/plugins/SaveFilePlugin.js

import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
import {Fragment, useEffect, useState} from "react";
import {importFile, overWriteFile, saveFileWithName} from "../../../../utils/File";
import {isEmpty} from "../../../../utils/ObjectUtils";
import {CLEAR_HISTORY_COMMAND} from "lexical";
import {TRANSFORMERS, $convertFromMarkdownString, $convertToMarkdownString,} from "@lexical/markdown";
import {getFileExtByPath, getFileFullNameByPath, getFileNameByPath} from "../../../../utils/PathOperate";
import {updatedSavedFile} from "../../../../redux/tableBarItem_reducer";
import {useDispatch, useSelector} from "react-redux";
import md5 from "md5"
import {message} from "antd";
const {ipcRenderer} = window.require('electron')
import "./ToobarPlugin.less"
import {newFileAdd, updateFileMd5} from "../../../../redux/dirMessage_reducer";
const SaveFilePlugin=(props)=> {
  let activeKey = useSelector(state => state.tableBarItem.activeKey);
  const dispatch = useDispatch();
  // const [messageApi,contextHolder] = message.useMessage();
  const [editor] = useLexicalComposerContext();
  const [editorState,setEditorState]=useState();

  function onChange(editorState) {

    if (!isEmpty(props.filePath)&&props.filePath.endsWith(".md")){
      let read = editorState.read(() => $convertToMarkdownString(TRANSFORMERS));
      setEditorState(read)
    }else {
      // Call toJSON on the EditorState object, which produces a serialization safe string
      const editorStateJSON = editorState.toJSON();
      console.log('onChange-editorStateJSON')
      // However, we still have a JavaScript object, so we need to convert it to an actual string with JSON.stringify
      setEditorState(JSON.stringify(editorStateJSON));
    }
  }

  const saveFile = (event, args) => {
    console.log("event,args:", event, args)
    if (args !== "CTRL+S") {
      return
    }
    let filePath = props.filePath;
    if (!isEmpty(filePath)&&filePath !== activeKey) {
      console.log("文件不同", filePath, activeKey)
      return;
    }
    console.log("触发保存filePath:", filePath)
    if (isEmpty(editorState)) {
      return
    }
    let resultSave;


    // 如果文件地址为空需要用户选择目录并设置文件。
    if (!filePath) {
      let saveDialogReturnValuePromise = saveFileWithName();
      console.log("saveDialogReturnValuePromise", saveDialogReturnValuePromise)
      saveDialogReturnValuePromise.then(result => {
        if (!result.canceled) {
          let filePath =result.filePath
          let fileExt = getFileExtByPath(result.filePath)
          if (isEmpty(fileExt)){
            filePath = filePath+".lexical"
          }
          if (filePath.endsWith(".md")){
            resultSave=editorState
          }else {
            const editorStateSave = {"editorState": JSON.parse(editorState)};
            resultSave = JSON.stringify(editorStateSave);
          }
          overWriteFile(filePath, resultSave)
          // 修改当前文件名
          dispatch(updatedSavedFile({filePath: filePath}))
          // 文件目录更新
          dispatch(newFileAdd({fileName:getFileFullNameByPath(filePath),dirFlag:false,children:[],filePath: filePath,
          fileId:filePath,fileMd5:md5(resultSave)}))
        }
      })
      return
    }
    if (props.filePath.endsWith(".md")){
      resultSave=editorState
    }else {
      const editorStateSave = {"editorState": JSON.parse(editorState)};
      resultSave = JSON.stringify(editorStateSave);
    }

    // 后期不再读取文件，直接读取文件MD5
    importFile(filePath).then(value => {
      let save =true;
      let oldFileMd5
      let newFileMd5 =md5(resultSave)
      if (!isEmpty(value)){
        if (props.filePath.endsWith(".md")){
          // editorState
          oldFileMd5 = md5(value.toString());
          save = (isEmpty(value)) || newFileMd5 !== oldFileMd5;
        }else {
          oldFileMd5 = md5(JSON.stringify(JSON.parse(value.toString())));
          save = (isEmpty(value)) || newFileMd5 !== oldFileMd5;
        }
      }
      if (save) {
        overWriteFile(filePath, resultSave).then(()=>{
          console.log("保存成功"+ filePath)
          // 修改文件Md5
          dispatch(updateFileMd5({filePath,"fileMd5":newFileMd5}))
          // messageApi.open({type:"success",content:"保存成功：" + filePath,duration:1})
          message.success("保存成功：" + filePath)
        })
      }
    }).catch(error =>
        console.error(error)
    )
  }

  useEffect(() => {
        ipcRenderer.on("pushHotkeys", saveFile);
        let updateListener = editor.registerUpdateListener(({editorState}) => {
          console.log("SaveFilePlugin:editorState",editorState)
          onChange(editorState);
        })
        return () => {
          console.log("销毁取消监听");
          updateListener()
          ipcRenderer.removeListener("pushHotkeys", saveFile)
        };
      },[editor,onChange]
  )
}
export default SaveFilePlugin