Merge branch 'dev' into main

Author: gustavotoyota

apps/client/package.json

@@ -58,7 +58,7 @@
     "electron-updater": "4.3.1",
     "express": "4.18.2",
     "highlight.js": "11.6.0",
-    "html2canvas": "^1.4.1",
+    "html2canvas": "npm:@deepnotes/html2canvas@^1.4.2",
     "ioredis": "npm:@deepnotes/ioredis@5.3.1",
     "js-base64": "3.7.3",
     "katex": "^0.16.4",

apps/client/src/code/pages/composables/use-page-navigation-interception.ts

@@ -11,9 +11,12 @@ export function usePageNavigationInterception() {
 
       // Ignore if it's not a link
 
-      const anchor = target.closest('a[href]');
+      const closestAnchor = target.closest('a');
 
-      if (anchor == null) {
+      const href = closestAnchor?.getAttribute('href') ?? '';
+
+      if (!href) {
+        event.preventDefault();
         return;
       }
 
@@ -35,8 +38,6 @@ export function usePageNavigationInterception() {
 
       // Allow default action if it's not a page link
 
-      const href = anchor.getAttribute('href') ?? '';
-
       if (
         !(
           href.startsWith('/pages/') ||

apps/client/src/layouts/PagesLayout/MainContent/DisplayPage/DisplayScreens/DisplayWorld/DisplayNote/NoteContent.vue

@@ -6,6 +6,7 @@
     :style="{ cursor: note.react.cursor }"
     tabindex="-1"
     target="_blank"
+    draggable="false"
   >
     <div
       class="note-content"
@@ -53,7 +54,7 @@ function onLeftPointerDown(event: PointerEvent) {
   }
 
   if (
-    (note.react.collab.link || (event.target as Element).closest('a[href]')) &&
+    note.react.collab.link &&
     !event.altKey &&
     !event.shiftKey &&
     !internals.mobileAltKey &&

apps/client/src/layouts/PagesLayout/MainContent/DisplayPage/DisplayScreens/DisplayWorld/DisplayNote/NoteSection/NoteContainerSection/NoteListContainer.vue

@@ -286,5 +286,7 @@ useResizeObserver(
   display: flex;
 
   margin: 3px;
+
+  cursor: default;
 }
 </style>

apps/client/src/layouts/PagesLayout/MainContent/DisplayPage/DisplayScreens/DisplayWorld/DisplayNote/NoteSection/NoteContainerSection/NoteSpatialContainer.vue

@@ -8,7 +8,7 @@
   >
     <div
       class="note-spatial-background"
-      @click.left="onLeftClick"
+      @click.left.stop.prevent="onLeftClick"
     >
       <!-- Placeholder -->
 
@@ -147,6 +147,8 @@ async function onLeftClick(event: MouseEvent) {
   border-radius: 5px;
 
   background-color: rgba(0, 0, 0, 0.4);
+
+  cursor: default;
 }
 
 .note-spatial-background {

apps/client/src/layouts/PagesLayout/MainToolbar/TakeScreenshotDialog.vue

@@ -18,6 +18,17 @@
           v-model="margin"
           style="width: 160px"
         />
+
+        <Gap style="height: 16px" />
+
+        <q-input
+          label="Scale (%):"
+          type="number"
+          filled
+          dense
+          v-model="scale"
+          style="width: 160px"
+        />
       </q-card-section>
     </template>
 
@@ -43,6 +54,8 @@
 
 <script lang="ts">
 const margin = ref(100);
+
+const scale = ref(100);
 </script>
 
 <script setup lang="ts">
@@ -87,7 +100,7 @@ async function takeScreenshot() {
       `.display-world[data-page-id="${page.value.id}"]`,
     ) as HTMLElement,
     {
-      scale: 1 / page.value.camera.react.zoom,
+      scale: (1 / page.value.camera.react.zoom) * (scale.value / 100),
 
       x: -finalMargin * page.value.camera.react.zoom + displayRect.topLeft.x,
       y: -finalMargin * page.value.camera.react.zoom + displayRect.topLeft.y,
@@ -110,7 +123,7 @@ async function takeScreenshot() {
 
   const dataUrl = canvas.toDataURL('image/png');
 
-  download(dataUrl, 'screenshot.png', 'image/png');
+  download(dataUrl, 'DeepNotes-screenshot.png', 'image/png');
 
   dialogRef.value.onDialogOK();
 }