feat: save to instapaper

src/renderer/src/atoms/settings/integration.ts

@@ -6,6 +6,9 @@ export const createDefaultSettings = (): IntegrationSettings => ({
   enableEagle: true,
   enableReadwise: true,
   readwiseToken: "",
+  enableInstapaper: true,
+  instapaperUsername: "",
+  instapaperPassword: "",
 })
 
 export const {

src/renderer/src/components/ui/platform-icon/collections/instapaper.tsx

@@ -0,0 +1,15 @@
+import type { SVGProps } from "react"
+
+export function SimpleIconsInstapaper(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width="1em"
+      height="1em"
+      viewBox="0 0 90 90"
+      {...props}
+    >
+      <path d="M60.942 77.897c-4.244-.308-6.996-.946-8.251-1.923-1.255-.971-1.883-3.496-1.883-7.562V21.446c0-3.884.628-6.384 1.883-7.501 1.255-1.118 4.007-1.78 8.251-1.987V10H30.077v1.958c4.244.207 6.994.87 8.252 1.987 1.257 1.117 1.884 3.617 1.884 7.5v46.968c0 4.066-.627 6.59-1.884 7.562-1.258.976-4.008 1.614-8.252 1.922v1.96h30.865v-1.96Z" fill="currentColor" />
+    </svg>
+  )
+}

src/renderer/src/components/ui/platform-icon/icons.ts

@@ -1,3 +1,4 @@
 export * from "./collections/eagle"
+export * from "./collections/instapaper"
 export * from "./collections/readwise"
 export * from "./collections/rss3"

src/renderer/src/hooks/biz/useEntryActions.tsx

@@ -6,7 +6,7 @@ import {
 } from "@renderer/atoms/readability"
 import { useIntegrationSettingKey } from "@renderer/atoms/settings/integration"
 import { whoami } from "@renderer/atoms/user"
-import { SimpleIconsEagle, SimpleIconsReadwise } from "@renderer/components/ui/platform-icon/icons"
+import { SimpleIconsEagle, SimpleIconsInstapaper, SimpleIconsReadwise } from "@renderer/components/ui/platform-icon/icons"
 import { COPY_MAP } from "@renderer/constants"
 import { shortcuts } from "@renderer/constants/shortcuts"
 import { tipcClient } from "@renderer/lib/client"
@@ -140,6 +140,9 @@ export const useEntryActions = ({
   const enableEagle = useIntegrationSettingKey("enableEagle")
   const enableReadwise = useIntegrationSettingKey("enableReadwise")
   const readwiseToken = useIntegrationSettingKey("readwiseToken")
+  const enableInstapaper = useIntegrationSettingKey("enableInstapaper")
+  const instapaperUsername = useIntegrationSettingKey("instapaperUsername")
+  const instapaperPassword = useIntegrationSettingKey("instapaperPassword")
 
   const items = useMemo(() => {
     if (!populatedEntry || view === undefined) return []
@@ -216,6 +219,34 @@ export const useEntryActions = ({
           }
         },
       },
+      {
+        name: "Save to Instapaper",
+        icon: <SimpleIconsInstapaper />,
+        key: "saveToInstapaper",
+        hide: !enableInstapaper || !instapaperPassword || !instapaperUsername || !populatedEntry.entries.url,
+        onClick: async () => {
+          try {
+            const data = await ofetch("https://www.instapaper.com/api/add", {
+              query: {
+                url: populatedEntry.entries.url,
+                title: populatedEntry.entries.title,
+              },
+              method: "POST",
+              headers: {
+                Authorization: `Basic ${btoa(`${instapaperUsername}:${instapaperPassword}`)}`,
+              },
+              parseResponse: JSON.parse,
+            })
+            toast.success(<>Saved to Instapaper, <a target="_blank" className="underline" href={`https://www.instapaper.com/read/${data.bookmark_id}`}>view</a></>, {
+              duration: 3000,
+            })
+          } catch {
+            toast.error("Failed to save to Instapaper.", {
+              duration: 3000,
+            })
+          }
+        },
+      },
       {
         key: "tip",
         shortcut: shortcuts.entry.tip.key,

src/renderer/src/initialize/hydrate.ts

@@ -1,4 +1,5 @@
 import { initializeDefaultGeneralSettings } from "@renderer/atoms/settings/general"
+import { initializeDefaultIntegrationSettings } from "@renderer/atoms/settings/integration"
 import { initializeDefaultUISettings } from "@renderer/atoms/settings/ui"
 import { appLog } from "@renderer/lib/log"
 import { sleep } from "@renderer/lib/utils"
@@ -108,4 +109,5 @@ const logHydrateError = (message: string) => {
 export const hydrateSettings = () => {
   initializeDefaultUISettings()
   initializeDefaultGeneralSettings()
+  initializeDefaultIntegrationSettings()
 }

src/renderer/src/modules/settings/tabs/integration.tsx

@@ -8,7 +8,7 @@ import {
   setUISetting,
   useUISettingSelector,
 } from "@renderer/atoms/settings/ui"
-import { SimpleIconsEagle, SimpleIconsReadwise } from "@renderer/components/ui/platform-icon/icons"
+import { SimpleIconsEagle, SimpleIconsInstapaper, SimpleIconsReadwise } from "@renderer/components/ui/platform-icon/icons"
 import {
   Select,
   SelectContent,
@@ -51,6 +51,20 @@ export const SettingIntegration = () => (
             label: "Readwise Access Token",
             description: <>You can get it here: <a target="_blank" className="underline" rel="noreferrer noopener" href="https://readwise.io/access_token">readwise.io/access_token</a>.</>,
           }),
+          {
+            type: "title",
+            value: <span className="flex items-center gap-2"><SimpleIconsInstapaper />Instapaper</span>,
+          },
+          defineSettingItem("enableInstapaper", {
+            label: "Enable",
+            description: <>Display <i>Save to Instapaper</i> button when available.</>,
+          }),
+          defineSettingItem("instapaperUsername", {
+            label: "Instapaper Username",
+          }),
+          defineSettingItem("instapaperPassword", {
+            label: "Instapaper Password",
+          }),
         ]}
       />
     </div>

src/shared/src/interface/settings.ts

@@ -38,4 +38,7 @@ export interface IntegrationSettings {
   enableEagle: boolean
   enableReadwise: boolean
   readwiseToken: string
+  enableInstapaper: boolean
+  instapaperUsername: string
+  instapaperPassword: string
 }