diff --git a/apps/web/src/stores/monograph-store.js b/apps/web/src/stores/monograph-store.ts
similarity index 60%
rename from apps/web/src/stores/monograph-store.js
rename to apps/web/src/stores/monograph-store.ts
index 2852fb343..3e90ced7a 100644
--- a/apps/web/src/stores/monograph-store.js
+++ b/apps/web/src/stores/monograph-store.ts
@@ -20,29 +20,31 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 import createStore from "../common/store";
 import { db } from "../common/db";
 import BaseStore from "./index";
-import { store as notestore } from "./note-store";
+import { store as noteStore } from "./note-store";
+import { Note, VirtualizedGrouping } from "@notesnook/core";
+import { PublishOptions } from "@notesnook/core/dist/api/monographs";
 
-/**
- * @extends {BaseStore<MonographStore>}
- */
-class MonographStore extends BaseStore {
-  monographs = [];
+class MonographStore extends BaseStore<MonographStore> {
+  monographs: VirtualizedGrouping<Note> | undefined = undefined;
 
-  refresh = () => {
-    this.set((state) => (state.monographs = db.monographs.all));
+  refresh = async () => {
+    const grouping = await db.monographs.all.grouped(
+      db.settings.getGroupOptions("notes")
+    );
+    this.set({ monographs: grouping });
   };
 
-  publish = async (noteId, opts) => {
+  publish = async (noteId: string, opts: PublishOptions) => {
     const publishId = await db.monographs.publish(noteId, opts);
-    this.get().refresh();
-    notestore.refreshContext();
+    await this.get().refresh();
+    await noteStore.refreshContext();
     return publishId;
   };
 
-  unpublish = async (noteId) => {
+  unpublish = async (noteId: string) => {
     await db.monographs.unpublish(noteId);
-    this.get().refresh();
-    notestore.refreshContext();
+    await this.get().refresh();
+    noteStore.refreshContext();
   };
 }
 
diff --git a/packages/core/src/api/monographs.ts b/packages/core/src/api/monographs.ts
index 883a807da..13b18636f 100644
--- a/packages/core/src/api/monographs.ts
+++ b/packages/core/src/api/monographs.ts
@@ -39,6 +39,7 @@ type EncryptedMonograph = BaseMonograph & {
 };
 type Monograph = UnencryptedMonograph | EncryptedMonograph;
 
+export type PublishOptions = { password?: string; selfDestruct?: boolean };
 export class Monographs {
   monographs: string[] = [];
   constructor(private readonly db: Database) {}
@@ -82,10 +83,7 @@ export class Monographs {
   /**
    * Publish a note as a monograph
    */
-  async publish(
-    noteId: string,
-    opts: { password?: string; selfDestruct?: boolean } = {}
-  ) {
+  async publish(noteId: string, opts: PublishOptions = {}) {
     if (!this.monographs.length) await this.refresh();
 
     const update = !!this.isPublished(noteId);