feat: Super notes can now be exported as PDF (#2776)

standardnotes · Jan 24, 2024 · 418d1a7 · 418d1a7
1 parent 813304c
commit 418d1a7
Show file tree

Hide file tree

Showing 55 changed files with 1,062 additions and 70 deletions.
diff --git a/.yarn/cache/@babel-runtime-npm-7.23.8-c8503a23a8-0bd5543c26.zip b/.yarn/cache/@babel-runtime-npm-7.23.8-c8503a23a8-0bd5543c26.zip
diff --git a/.yarn/cache/@react-pdf-fns-npm-2.1.0-db092b9495-b7360daa76.zip b/.yarn/cache/@react-pdf-fns-npm-2.1.0-db092b9495-b7360daa76.zip
diff --git a/.yarn/cache/@react-pdf-font-npm-2.4.2-9c8c70d337-910f7422f2.zip b/.yarn/cache/@react-pdf-font-npm-2.4.2-9c8c70d337-910f7422f2.zip
diff --git a/.yarn/cache/@react-pdf-image-npm-2.3.1-735ded206b-7e8bb017a5.zip b/.yarn/cache/@react-pdf-image-npm-2.3.1-735ded206b-7e8bb017a5.zip
diff --git a/.yarn/cache/@react-pdf-layout-npm-3.10.2-c6ddce489c-356e3e611d.zip b/.yarn/cache/@react-pdf-layout-npm-3.10.2-c6ddce489c-356e3e611d.zip
diff --git a/.yarn/cache/@react-pdf-pdfkit-npm-3.1.1-7bb571f24f-34e10401c5.zip b/.yarn/cache/@react-pdf-pdfkit-npm-3.1.1-7bb571f24f-34e10401c5.zip
diff --git a/.yarn/cache/@react-pdf-png-js-npm-2.3.0-c6f026023c-34f03fa5b9.zip b/.yarn/cache/@react-pdf-png-js-npm-2.3.0-c6f026023c-34f03fa5b9.zip
diff --git a/.yarn/cache/@react-pdf-primitives-npm-3.1.1-3033dff230-a52c0cfff7.zip b/.yarn/cache/@react-pdf-primitives-npm-3.1.1-3033dff230-a52c0cfff7.zip
diff --git a/.yarn/cache/@react-pdf-render-npm-3.4.0-fce1007007-48f19f6be4.zip b/.yarn/cache/@react-pdf-render-npm-3.4.0-fce1007007-48f19f6be4.zip
diff --git a/.yarn/cache/@react-pdf-renderer-npm-3.3.2-66392dfa46-4bc9286a73.zip b/.yarn/cache/@react-pdf-renderer-npm-3.3.2-66392dfa46-4bc9286a73.zip
diff --git a/.yarn/cache/@react-pdf-stylesheet-npm-4.2.2-42729d940a-f6ce9ecc0c.zip b/.yarn/cache/@react-pdf-stylesheet-npm-4.2.2-42729d940a-f6ce9ecc0c.zip
diff --git a/.yarn/cache/@react-pdf-textkit-npm-4.3.0-2d66fabba8-d4ce3e4051.zip b/.yarn/cache/@react-pdf-textkit-npm-4.3.0-2d66fabba8-d4ce3e4051.zip
diff --git a/.yarn/cache/@react-pdf-types-npm-2.4.0-6032fd1c00-a9b826753c.zip b/.yarn/cache/@react-pdf-types-npm-2.4.0-6032fd1c00-a9b826753c.zip
diff --git a/.yarn/cache/@swc-helpers-npm-0.4.14-f806c3fb16-273fd3f3fc.zip b/.yarn/cache/@swc-helpers-npm-0.4.14-f806c3fb16-273fd3f3fc.zip
diff --git a/.yarn/cache/@swc-helpers-npm-0.4.36-507abd5d2a-20b9f021a9.zip b/.yarn/cache/@swc-helpers-npm-0.4.36-507abd5d2a-20b9f021a9.zip
diff --git a/.yarn/cache/abs-svg-path-npm-0.1.1-e563d22137-af1a167c09.zip b/.yarn/cache/abs-svg-path-npm-0.1.1-e563d22137-af1a167c09.zip
diff --git a/.yarn/cache/brotli-npm-1.3.3-f0b047ff51-2c97329f4c.zip b/.yarn/cache/brotli-npm-1.3.3-f0b047ff51-2c97329f4c.zip
diff --git a/.yarn/cache/browserify-zlib-npm-0.2.0-eab4087284-5cd9d6a665.zip b/.yarn/cache/browserify-zlib-npm-0.2.0-eab4087284-5cd9d6a665.zip
diff --git a/.yarn/cache/clone-npm-2.1.2-1d491c6629-aaf106e9bc.zip b/.yarn/cache/clone-npm-2.1.2-1d491c6629-aaf106e9bc.zip
diff --git a/.yarn/cache/comlink-npm-4.4.1-b05bb2527d-16d58a8f59.zip b/.yarn/cache/comlink-npm-4.4.1-b05bb2527d-16d58a8f59.zip
diff --git a/.yarn/cache/cross-fetch-npm-3.1.8-71c3c05709-78f993fa09.zip b/.yarn/cache/cross-fetch-npm-3.1.8-71c3c05709-78f993fa09.zip
diff --git a/.yarn/cache/crypto-js-npm-4.2.0-d6f7744e63-f051666dbc.zip b/.yarn/cache/crypto-js-npm-4.2.0-d6f7744e63-f051666dbc.zip
diff --git a/.yarn/cache/dfa-npm-1.2.0-2b05ce5c5e-83b954b856.zip b/.yarn/cache/dfa-npm-1.2.0-2b05ce5c5e-83b954b856.zip
diff --git a/.yarn/cache/emoji-regex-npm-10.3.0-0c9fc2ef7f-5da48edfeb.zip b/.yarn/cache/emoji-regex-npm-10.3.0-0c9fc2ef7f-5da48edfeb.zip
diff --git a/.yarn/cache/fontkit-npm-2.0.2-d65b0dc942-ef5841a46c.zip b/.yarn/cache/fontkit-npm-2.0.2-d65b0dc942-ef5841a46c.zip
diff --git a/.yarn/cache/hsl-to-hex-npm-1.0.0-9742a194a7-e748cea0d9.zip b/.yarn/cache/hsl-to-hex-npm-1.0.0-9742a194a7-e748cea0d9.zip
diff --git a/.yarn/cache/hsl-to-rgb-for-reals-npm-1.1.1-f1bc4775d6-b31452617e.zip b/.yarn/cache/hsl-to-rgb-for-reals-npm-1.1.1-f1bc4775d6-b31452617e.zip
diff --git a/.yarn/cache/hyphen-npm-1.10.4-51dec4187e-94446608a0.zip b/.yarn/cache/hyphen-npm-1.10.4-51dec4187e-94446608a0.zip
diff --git a/.yarn/cache/is-url-npm-1.2.4-0a28aeb560-100e74b3b1.zip b/.yarn/cache/is-url-npm-1.2.4-0a28aeb560-100e74b3b1.zip
diff --git a/.yarn/cache/jpeg-exif-npm-1.1.4-b22cfb6a0d-a8693a7eeb.zip b/.yarn/cache/jpeg-exif-npm-1.1.4-b22cfb6a0d-a8693a7eeb.zip
diff --git a/.yarn/cache/media-engine-npm-1.0.3-95c823ed38-3c2834077e.zip b/.yarn/cache/media-engine-npm-1.0.3-95c823ed38-3c2834077e.zip
diff --git a/.yarn/cache/normalize-svg-path-npm-1.1.0-6094833661-106e108b2f.zip b/.yarn/cache/normalize-svg-path-npm-1.1.0-6094833661-106e108b2f.zip
diff --git a/.yarn/cache/pako-npm-0.2.9-c88ac0d326-055f9487cd.zip b/.yarn/cache/pako-npm-0.2.9-c88ac0d326-055f9487cd.zip
diff --git a/.yarn/cache/parse-svg-path-npm-0.1.2-8bd0732a8f-bba7d4b420.zip b/.yarn/cache/parse-svg-path-npm-0.1.2-8bd0732a8f-bba7d4b420.zip
diff --git a/.yarn/cache/restructure-npm-3.0.0-97953cd564-4525b5414e.zip b/.yarn/cache/restructure-npm-3.0.0-97953cd564-4525b5414e.zip
diff --git a/.yarn/cache/scheduler-npm-0.17.0-5c42088cec-18d1e66cad.zip b/.yarn/cache/scheduler-npm-0.17.0-5c42088cec-18d1e66cad.zip
diff --git a/.yarn/cache/svg-arc-to-cubic-bezier-npm-3.2.0-06dd5e62ac-55bf17756d.zip b/.yarn/cache/svg-arc-to-cubic-bezier-npm-3.2.0-06dd5e62ac-55bf17756d.zip
diff --git a/.yarn/cache/tiny-inflate-npm-1.0.3-a7419a5c65-4086a1f893.zip b/.yarn/cache/tiny-inflate-npm-1.0.3-a7419a5c65-4086a1f893.zip
diff --git a/.yarn/cache/unicode-properties-npm-1.4.1-122054452f-337fba8a3c.zip b/.yarn/cache/unicode-properties-npm-1.4.1-122054452f-337fba8a3c.zip
diff --git a/.yarn/cache/unicode-trie-npm-2.0.0-54e0a4dd52-19e637ce20.zip b/.yarn/cache/unicode-trie-npm-2.0.0-54e0a4dd52-19e637ce20.zip
diff --git a/.yarn/cache/vite-compatible-readable-stream-npm-3.6.1-f1bba4fc53-7fd5073861.zip b/.yarn/cache/vite-compatible-readable-stream-npm-3.6.1-f1bba4fc53-7fd5073861.zip
diff --git a/.yarn/cache/yoga-layout-npm-2.0.1-d25883a49a-65a83b1bf0.zip b/.yarn/cache/yoga-layout-npm-2.0.1-d25883a49a-65a83b1bf0.zip
diff --git a/packages/desktop/app/index.html b/packages/desktop/app/index.html
@@ -11,7 +11,7 @@
       content="
         default-src 'self' blob:;
         script-src 'self' 'unsafe-eval';
-        worker-src blob:;
+        worker-src 'self' blob:;
         connect-src * data: blob:;
         style-src 'unsafe-inline' 'self' http://localhost:* http://127.0.0.1:45653;
         frame-src * blob:;

diff --git a/packages/files/src/Domain/Service/SuperConverterServiceInterface.ts b/packages/files/src/Domain/Service/SuperConverterServiceInterface.ts
@@ -1,6 +1,9 @@
 export interface SuperConverterServiceInterface {
   isValidSuperString(superString: string): boolean
-  convertSuperStringToOtherFormat: (superString: string, toFormat: 'txt' | 'md' | 'html' | 'json') => Promise<string>
+  convertSuperStringToOtherFormat: (
+    superString: string,
+    toFormat: 'txt' | 'md' | 'html' | 'json' | 'pdf',
+  ) => Promise<string>
   convertOtherFormatToSuperString: (
     otherFormatString: string,
     fromFormat: 'txt' | 'md' | 'html' | 'json',

diff --git a/packages/models/src/Domain/Syncable/UserPrefs/PrefKey.ts b/packages/models/src/Domain/Syncable/UserPrefs/PrefKey.ts
@@ -87,7 +87,7 @@ export type PrefValue = {
   [PrefKey.MomentsDefaultTagUuid]: string | undefined
   [PrefKey.ClipperDefaultTagUuid]: string | undefined
   [PrefKey.SystemViewPreferences]: Partial<Record<SystemViewId, TagPreferences>>
-  [PrefKey.SuperNoteExportFormat]: 'json' | 'md' | 'html'
+  [PrefKey.SuperNoteExportFormat]: 'json' | 'md' | 'html' | 'pdf'
   [PrefKey.SuperNoteExportEmbedBehavior]: 'reference' | 'inline' | 'separate'
   [PrefKey.SuperNoteExportUseMDFrontmatter]: boolean
   [PrefKey.AuthenticatorNames]: string

diff --git a/packages/toast/src/Toast.tsx b/packages/toast/src/Toast.tsx
@@ -90,8 +90,8 @@ export const Toast = forwardRef(({ toast, index }: Props, ref: ForwardedRef<HTML
       }}
       ref={ref}
     >
-      <div className="grid gap-x-2.5 gap-y-1 overflow-hidden grid-cols-[1fr,auto] pl-3 pr-3.5 py-2.5">
-        {icon ? <div className="sn-icon flex flex-shrink-0 items-center justify-center">{icon}</div> : null}
+      <div className="grid gap-x-2.5 gap-y-1 overflow-hidden grid-cols-[min-content,auto] pl-3 pr-3.5 py-2.5">
+        {icon ? <div className="sn-icon flex items-center justify-center">{icon}</div> : null}
         {toast.title && <div className="text-text text-sm font-semibold col-start-2">{toast.title}</div>}
         <div className="text-text text-sm [word-wrap:anywhere] col-start-2">{toast.message}</div>
         {hasActions && (

diff --git a/packages/web/package.json b/packages/web/package.json
@@ -111,6 +111,8 @@
     "@ariakit/react": "^0.3.9",
     "@lexical/headless": "0.12.6",
     "@radix-ui/react-slot": "^1.0.1",
+    "@react-pdf/renderer": "^3.3.2",
+    "comlink": "^4.4.1",
     "fast-diff": "^1.3.0"
   }
 }
diff --git a/packages/web/src/javascripts/Components/NotesOptions/NotesOptions.tsx b/packages/web/src/javascripts/Components/NotesOptions/NotesOptions.tsx
@@ -142,6 +142,22 @@ const NotesOptions = ({ notes, closeMenu }: NotesOptionsProps) => {
     downloadSelectedItems().catch(console.error)
   }, [downloadSelectedItems, notes])
 
+  const shareSelectedItems = useCallback(() => {
+    createNoteExport(application, notes)
+      .then((result) => {
+        if (!result) {
+          return
+        }
+
+        const { blob, fileName } = result
+
+        shareBlobOnMobile(application.mobileDevice, application.isNativeMobileWeb(), blob, fileName).catch(
+          console.error,
+        )
+      })
+      .catch(console.error)
+  }, [application, notes])
+
   const closeMenuAndToggleNotesList = useCallback(() => {
     const isMobileScreen = matchMedia(MutuallyExclusiveMediaQueryBreakpoints.sm).matches
     if (isMobileScreen) {
@@ -347,34 +363,14 @@ const NotesOptions = ({ notes, closeMenu }: NotesOptionsProps) => {
             {pinShortcut && <KeyboardShortcutIndicator className="ml-auto" shortcut={pinShortcut} />}
           </MenuItem>
         )}
-        <MenuItem
-          onClick={() => {
-            if (application.isNativeMobileWeb()) {
-              createNoteExport(application, notes)
-                .then((result) => {
-                  if (!result) {
-                    return
-                  }
-
-                  const { blob, fileName } = result
-
-                  shareBlobOnMobile(application.mobileDevice, application.isNativeMobileWeb(), blob, fileName).catch(
-                    console.error,
-                  )
-                })
-                .catch(console.error)
-            } else {
-              exportSelectedItems()
-            }
-          }}
-        >
-          <Icon type={application.platform === Platform.Android ? 'share' : 'download'} className={iconClass} />
-          {application.platform === Platform.Android ? 'Share' : 'Export'}
+        <MenuItem onClick={exportSelectedItems}>
+          <Icon type="download" className={iconClass} />
+          Export
         </MenuItem>
         {application.platform === Platform.Android && (
-          <MenuItem onClick={exportSelectedItems}>
-            <Icon type="download" className={iconClass} />
-            Export
+          <MenuItem onClick={shareSelectedItems}>
+            <Icon type="share" className={iconClass} />
+            Share
           </MenuItem>
         )}
         <MenuItem onClick={duplicateSelectedItems} disabled={areSomeNotesInReadonlySharedVault}>

diff --git a/packages/web/src/javascripts/Components/NotesOptions/SuperExportModal.tsx b/packages/web/src/javascripts/Components/NotesOptions/SuperExportModal.tsx
@@ -15,6 +15,7 @@ type Props = {
 
 const SuperExportModal = ({ notes, exportNotes, close }: Props) => {
   const application = useApplication()
+
   const superNoteExportFormat = usePreference(PrefKey.SuperNoteExportFormat)
   const superNoteExportEmbedBehavior = usePreference(PrefKey.SuperNoteExportEmbedBehavior)
   const superNoteExportUseMDFrontmatter = usePreference(PrefKey.SuperNoteExportUseMDFrontmatter)
@@ -26,10 +27,15 @@ const SuperExportModal = ({ notes, exportNotes, close }: Props) => {
     if (superNoteExportFormat === 'md' && superNoteExportEmbedBehavior === 'reference') {
       void application.setPreference(PrefKey.SuperNoteExportEmbedBehavior, 'separate')
     }
+    if (superNoteExportFormat === 'pdf' && superNoteExportEmbedBehavior !== 'inline') {
+      void application.setPreference(PrefKey.SuperNoteExportEmbedBehavior, 'inline')
+    }
   }, [application, superNoteExportEmbedBehavior, superNoteExportFormat])
 
   const someNotesHaveEmbeddedFiles = notes.some(noteHasEmbeddedFiles)
 
+  const canShowEmbeddedFileOptions = !['json', 'pdf'].includes(superNoteExportFormat)
+
   return (
     <Modal
       title="Export notes"
@@ -61,6 +67,7 @@ const SuperExportModal = ({ notes, exportNotes, close }: Props) => {
             { label: 'Super (.json)', value: 'json' },
             { label: 'Markdown (.md)', value: 'md' },
             { label: 'HTML', value: 'html' },
+            { label: 'PDF', value: 'pdf' },
           ]}
           value={superNoteExportFormat}
           onChange={(value) => {
@@ -93,7 +100,7 @@ const SuperExportModal = ({ notes, exportNotes, close }: Props) => {
           </Switch>
         </div>
       )}
-      {superNoteExportFormat !== 'json' && someNotesHaveEmbeddedFiles && (
+      {canShowEmbeddedFileOptions && someNotesHaveEmbeddedFiles && (
         <div className="mb-2 mt-4">
           <div className="mb-1">How do you want embedded files to be handled?</div>
           <RadioButtonGroup