Merge b1c60c3 into d4f7e3e

apps/web/src/components/editor/index.tsx

@@ -59,7 +59,7 @@ import { debounce, getFormattedDate } from "@notesnook/common";
 const PDFPreview = React.lazy(() => import("../pdf-preview"));
 
 type PreviewSession = {
-  content: { data: string; type: string };
+  content: { data: string; type: string; title: string };
   dateCreated: number;
   dateEdited: number;
 };
@@ -108,6 +108,7 @@ export default function EditorManager({
   const arePropertiesVisible = useStore((store) => store.arePropertiesVisible);
   const toggleProperties = useStore((store) => store.toggleProperties);
   const isReadonly = useStore((store) => store.session.readonly);
+  const setPreviewTitle = useStore((store) => store.setPreviewTitle);
   const isFocusMode = useAppStore((store) => store.isFocusMode);
   const isPreviewSession = !!previewSession.current;
 
@@ -157,6 +158,7 @@ export default function EditorManager({
   const openSession = useCallback(async (noteId: string | number) => {
     await editorstore.get().openSession(noteId);
     previewSession.current = undefined;
+    setPreviewTitle(undefined);
 
     lastSavedTime.current = Date.now();
     setTimestamp(Date.now());
@@ -228,6 +230,7 @@ export default function EditorManager({
                 onOpenPreviewSession={async (session: PreviewSession) => {
                   previewSession.current = session;
                   setTimestamp(Date.now());
+                  setPreviewTitle(previewSession.current.content.title);
                 }}
               />
             )}

apps/web/src/components/editor/title-box.tsx

@@ -37,6 +37,7 @@ function TitleBox(props: TitleBoxProps) {
   const { readonly } = props;
   const inputRef = useRef<HTMLInputElement>(null);
   const id = useStore((store) => store.session.id);
+  const previewTitle = useStore((store) => store.previewTitle);
   const isMobile = useMobile();
   const isTablet = useTablet();
   const { editorConfig } = useEditorConfig();
@@ -63,9 +64,9 @@ function TitleBox(props: TitleBoxProps) {
   useEffect(() => {
     if (!inputRef.current) return;
     const { title } = useStore.getState().session;
-    inputRef.current.value = title;
+    inputRef.current.value = previewTitle || title;
     updateFontSize(title.length);
-  }, [id, updateFontSize]);
+  }, [id, updateFontSize, previewTitle]);
 
   useEffect(() => {
     if (!inputRef.current) return;

apps/web/src/components/properties/index.jsx

@@ -352,7 +352,7 @@ function Properties(props) {
                   title="Click to preview"
                   onClick={async () => {
                     toggleProperties(false);
-                    const content = await db.noteHistory.content(session.id);
+                    const content = await db.noteHistory.content(session.id);  
 
                     if (session.locked) {
                       await Vault.askPassword(async (password) => {

apps/web/src/stores/editor-store.js

@@ -84,6 +84,7 @@ class EditorStore extends BaseStore {
   session = getDefaultSession();
   arePropertiesVisible = false;
   editorMargins = Config.get("editor:margins", true);
+  previewTitle = undefined;
 
   init = () => {
     EV.subscribe(EVENTS.userLoggedOut, () => {
@@ -318,7 +319,12 @@ class EditorStore extends BaseStore {
    */
   saveSessionContent = (noteId, sessionId, ignoreEdit, content) => {
     const dateEdited = ignoreEdit ? this.get().session.dateEdited : undefined;
-    return this.saveSession(noteId, { sessionId, content, dateEdited });
+    return this.saveSession(noteId, {
+      sessionId,
+      content,
+      dateEdited,
+      title: content.title
+    });
   };
 
   setTag = (tag) => {
@@ -331,6 +337,12 @@ class EditorStore extends BaseStore {
     });
   };
 
+  setPreviewTitle = (previewTitle) => {
+    this.set((state) => {
+      state.previewTitle = previewTitle;
+    });
+  };
+
   toggleProperties = (toggleState) => {
     this.set(
       (state) =>

packages/core/src/collections/content.js

@@ -70,7 +70,8 @@ export default class Content extends Collection {
     if (content.sessionId) {
       await this._db.noteHistory.add(contentItem.noteId, content.sessionId, {
         data: contentItem.data,
-        type: contentItem.type
+        type: contentItem.type,
+        title: content.title
       });
     }
     return id;

packages/core/src/collections/note-history.js

@@ -32,6 +32,7 @@ import SessionContent from "./session-content";
 
 /**
  * @typedef Content
+ * @property {string} title
  * @property {string} data
  * @property {string} type
  */
@@ -91,6 +92,7 @@ export default class NoteHistory extends Collection {
       id: sessionId,
       sessionContentId: makeSessionContentId(sessionId),
       noteId,
+      title: content.title,
       dateCreated: oldSession ? oldSession.dateCreated : Date.now(),
       localOnly: true
     };

packages/core/src/collections/notes.js

@@ -88,6 +88,7 @@ export default class Notes extends Collection {
 
       note.contentId = await this._db.content.add({
         noteId: id,
+        title: note.title,
         sessionId: note.sessionId,
         id: note.contentId,
         type,

packages/core/src/collections/session-content.js

@@ -44,14 +44,15 @@ export default class SessionContent extends Collection {
       contentType: content.type,
       compressed: !locked,
       localOnly: true,
-      locked
+      locked,
+      title: content.title
     });
   }
 
   /**
    *
    * @param {string} sessionId
-   * @returns {Promise<{content:string;data:string}>}
+   * @returns {Promise<{content:string;data:string;title:string}>}
    */
   async get(sessionContentId) {
     if (!sessionContentId) return;
@@ -69,7 +70,8 @@ export default class SessionContent extends Collection {
       data: session.compressed
         ? await this._db.compressor.decompress(session.data)
         : session.data,
-      type: session.contentType
+      type: session.contentType,
+      title: session.title
     };
   }