chore: save description_html as well

packages/editor/core/src/hooks/use-editor.tsx

@@ -178,6 +178,10 @@ export const useEditor = ({
         const markdownOutput = editorRef.current?.storage.markdown.getMarkdown();
         return markdownOutput;
       },
+      getHTML: (): string => {
+        const htmlOutput = editorRef.current?.getHTML() ?? "<p></p>";
+        return htmlOutput;
+      },
       scrollSummary: (marking: IMarking): void => {
         if (!editorRef.current) return;
         scrollSummary(editorRef.current, marking);

packages/editor/core/src/hooks/use-read-only-editor.tsx

@@ -68,6 +68,10 @@ export const useReadOnlyEditor = ({
       const markdownOutput = editorRef.current?.storage.markdown.getMarkdown();
       return markdownOutput;
     },
+    getHTML: (): string => {
+      const htmlOutput = editorRef.current?.getHTML() ?? "<p></p>";
+      return htmlOutput;
+    },
     scrollSummary: (marking: IMarking): void => {
       if (!editorRef.current) return;
       scrollSummary(editorRef.current, marking);

packages/editor/core/src/types/editor-ref-api.ts

@@ -3,6 +3,7 @@ import { EditorMenuItemNames } from "src/ui/menus/menu-items";
 
 export type EditorReadOnlyRefApi = {
   getMarkDown: () => string;
+  getHTML: () => string;
   clearEditor: () => void;
   setEditorValue: (content: string) => void;
   scrollSummary: (marking: IMarking) => void;

packages/editor/document-editor/src/hooks/use-document-editor.ts

@@ -14,7 +14,7 @@ type DocumentEditorProps = {
   fileHandler: TFileHandler;
   value: Uint8Array;
   editorClassName: string;
-  onChange: (binaryString: string, html: string) => void;
+  onChange: (binaryString: string) => void;
   extensions?: any;
   editorProps?: EditorProps;
   forwardedRef?: React.MutableRefObject<EditorRefApi | null>;
@@ -53,7 +53,7 @@ export const useDocumentEditor = ({
   );
 
   const yDoc = useMemo(() => {
-    if (value.byteLength !== 0) Y.applyUpdate(provider.document, value);
+    if (value.byteLength > 0) Y.applyUpdate(provider.document, value);
     return provider.document;
   }, [value, provider.document]);
   console.log("yDoc", yDoc);

packages/editor/document-editor/src/providers/collaboration-provider.ts

@@ -12,7 +12,7 @@ export interface CompleteCollaboratorProviderConfiguration {
   /**
    * onChange callback
    */
-  onChange: (binaryString: string, html: string) => void;
+  onChange: (binaryString: string) => void;
 }
 
 export type CollaborationProviderConfiguration = Required<Pick<CompleteCollaboratorProviderConfiguration, "name">> &
@@ -60,7 +60,7 @@ export class CollaborationProvider {
       const base64Doc = Buffer.from(docAsUint8Array).toString("base64");
       // const base64Doc = Buffer.from(update).toString("base64");
 
-      this.configuration.onChange?.(base64Doc, "<p></p>");
+      this.configuration.onChange?.(base64Doc);
       this.timeoutId = null;
     }, 2000);
   }

packages/editor/document-editor/src/ui/index.tsx

@@ -19,7 +19,7 @@ interface IDocumentEditor {
   handleEditorReady?: (value: boolean) => void;
   containerClassName?: string;
   editorClassName?: string;
-  onChange: (binaryString: string, html: string) => void;
+  onChange: (binaryString: string) => void;
   forwardedRef?: React.MutableRefObject<EditorRefApi | null>;
   mentionHandler: {
     highlights: () => Promise<IMentionHighlight[]>;
@@ -46,7 +46,6 @@ const DocumentEditor = (props: IDocumentEditor) => {
   } = props;
   // states
   const [hideDragHandleOnMouseLeave, setHideDragHandleOnMouseLeave] = useState<() => void>(() => {});
-
   // this essentially sets the hideDragHandle function from the DragAndDrop extension as the Plugin
   // loads such that we can invoke it from react when the cursor leaves the container
   const setHideDragHandleFunction = (hideDragHandlerFromDragDrop: () => void) => {

web/components/pages/editor/editor-body.tsx

@@ -32,7 +32,7 @@ const fileService = new FileService();
 type Props = {
   editorRef: React.RefObject<EditorRefApi>;
   readOnlyEditorRef: React.RefObject<EditorReadOnlyRefApi>;
-  handleDescriptionUpdate: (binaryString: string, descriptionHTML: string) => Promise<void>;
+  handleDescriptionUpdate: (binaryString: string) => Promise<void>;
   markings: IMarking[];
   pageStore: IPageStore;
   sidePeekVisible: boolean;
@@ -98,7 +98,7 @@ export const PageEditorBody: React.FC<Props> = observer((props) => {
     updateMarkings(description_html ?? "<p></p>");
   }, [description_html, updateMarkings]);
 
-  if (pageDescription === undefined || pageId === undefined || !pageDescriptionYJS) return <PageContentLoader />;
+  if (pageId === undefined || !descriptionYJS || !pageDescriptionYJS) return <PageContentLoader />;
 
   return (
     <div className="flex items-center h-full w-full overflow-y-auto">

web/pages/[workspaceSlug]/projects/[projectId]/pages/[pageId].tsx

@@ -52,8 +52,9 @@ const PageDetailsPage: NextPageWithLayout = observer(() => {
   );
 
   const handleDescriptionChange = useCallback(
-    async (binaryString: string, descriptionHTML: string) => {
+    async (binaryString: string) => {
       setIsSubmitting("submitting");
+      const descriptionHTML = editorRef.current?.getHTML() ?? "<p></p>";
       await updateDescription(binaryString, descriptionHTML).finally(() => setIsSubmitting("saved"));
     },
     [setIsSubmitting, updateDescription]