web: fix tags not showing in locked note (#7061)

Signed-off-by: 01zulfi <85733202+01zulfi@users.noreply.github.com>

apps/web/__e2e__/notes.test.ts

@@ -231,6 +231,23 @@ test("add tags to note", async ({ page }) => {
   expect(noteTags.every((t, i) => t === tags[i])).toBe(true);
 });
 
+test("add tags to locked note", async ({ page }) => {
+  const tags = ["incognito", "secret-stuff"];
+  const app = new AppModel(page);
+  await app.goto();
+  const notes = await app.goToNotes();
+  const note = await notes.createNote(NOTE);
+  await note?.contextMenu.lock(PASSWORD);
+  await note?.openLockedNote(PASSWORD);
+
+  await notes.editor.setTags(tags);
+  await page.waitForTimeout(200);
+
+  const noteTags = await notes.editor.getTags();
+  expect(noteTags).toHaveLength(tags.length);
+  expect(noteTags.every((t, i) => t === tags[i])).toBe(true);
+});
+
 for (const format of ["html", "txt", "md"] as const) {
   test(`export note as ${format}`, async ({ page }) => {
     const app = new AppModel(page);

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

@@ -834,6 +834,7 @@ function UnlockNoteView(props: UnlockNoteViewProps) {
           if (!note || !note.content)
             throw new Error("note with this id does not exist.");
 
+          const tags = await db.notes.tags(note.id);
           useEditorStore.getState().addSession({
             type: session.note.readonly ? "readonly" : "default",
             locked: true,
@@ -841,6 +842,7 @@ function UnlockNoteView(props: UnlockNoteViewProps) {
             note: session.note,
             saveState: SaveState.Saved,
             sessionId: `${Date.now()}`,
+            tags,
             pinned: session.pinned,
             preview: session.preview,
             content: note.content

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

@@ -421,7 +421,7 @@ class EditorStore extends BaseStore<EditorStore> {
                 continue;
 
               updateSession(session.id, undefined, {
-                tags: await getTags(session.note.id)
+                tags: await db.notes.tags(session.note.id)
               });
             }
           } else if (
@@ -432,7 +432,7 @@ class EditorStore extends BaseStore<EditorStore> {
             event.item.toType === "note"
           ) {
             updateSession(event.item.toId, undefined, {
-              tags: await getTags(event.item.toId)
+              tags: await db.notes.tags(event.item.toId)
             });
           }
         } else if (event.collection === "tags") {
@@ -445,7 +445,7 @@ class EditorStore extends BaseStore<EditorStore> {
                 continue;
               console.log("UDPATE");
               updateSession(session.id, undefined, {
-                tags: await getTags(session.note.id)
+                tags: await db.notes.tags(session.note.id)
               });
             }
           }
@@ -671,7 +671,7 @@ class EditorStore extends BaseStore<EditorStore> {
         const attachmentsLength = await db.attachments
           .ofNote(note.id, "all")
           .count();
-        const tags = await getTags(note.id);
+        const tags = await db.notes.tags(note.id);
         const colors = await db.relations.to(note, "color").get();
         if (note.readonly) {
           this.addSession(
@@ -1020,12 +1020,3 @@ async function waitForSync() {
     db.eventManager.subscribe(EVENTS.syncCompleted, resolve, true);
   });
 }
-
-async function getTags(noteId: string) {
-  return await db.relations
-    .to({ id: noteId, type: "note" }, "tag")
-    .selector.items(undefined, {
-      sortBy: "dateCreated",
-      sortDirection: "asc"
-    });
-}

packages/core/__tests__/notes.test.ts

@@ -197,6 +197,15 @@ test("update note", () =>
     expect(note?.favorite).toBe(true);
   }));
 
+test("get note tags", () =>
+  noteTest({
+    ...TEST_NOTE
+  }).then(async ({ db, id }) => {
+    const tag = await db.tags.add({ title: "hello" });
+    await db.relations.add({ type: "tag", id: tag }, { type: "note", id });
+    expect(await db.notes.tags(id)).toEqual([await db.tags.tag(tag)]);
+  }));
+
 test("get favorite notes", () =>
   noteTest({
     ...TEST_NOTE,

packages/core/src/collections/notes.ts

@@ -176,6 +176,15 @@ export class Notes implements ICollection {
     return note;
   }
 
+  async tags(id: string) {
+    return this.db.relations
+      .to({ id, type: "note" }, "tag")
+      .selector.items(undefined, {
+        sortBy: "dateCreated",
+        sortDirection: "asc"
+      });
+  }
+
   // note(idOrNote: string | Note) {
   //   if (!idOrNote) return;
   //   const note =