Add import from pocket to web

packages/api/src/services/integrations/pocket.ts

@@ -77,6 +77,9 @@ export class PocketIntegration extends IntegrationService {
       : 0
     const pocketData = await this.retrievePocketData(integration.token, syncAt)
     const pocketItems = Object.values(pocketData.list)
+    if (pocketItems.length === 0) {
+      return 0
+    }
     // write the list of urls to a csv file and upload it to gcs
     // path style: imports/<uid>/<date>/<type>-<uuid>.csv
     const dateStr = DateTime.now().toISODate()

packages/web/lib/networking/mutations/importFromIntegrationMutation.ts

@@ -0,0 +1,35 @@
+import { gqlFetcher } from '../networkHelpers'
+
+interface ImportFromIntegrationDataResponseData {
+  importFromIntegration?: ImportFromIntegrationData
+}
+
+interface ImportFromIntegrationData {
+  count: number
+  errorCodes?: unknown[]
+}
+
+export async function importFromIntegrationMutation(
+  integrationId: string
+): Promise<void> {
+  const mutation = `
+    mutation ImportFromIntegration($integrationId: ID!) {
+      importFromIntegration(integrationId:$integrationId) {
+        ... on ImportFromIntegrationError {
+          errorCodes
+        }
+        ... on ImportFromIntegrationSuccess {
+          count
+        }
+      }
+    }`
+
+  const data = await gqlFetcher(mutation, { integrationId })
+  console.log('integrationId: ', data)
+  const output = data as ImportFromIntegrationDataResponseData | undefined
+  const error = output?.importFromIntegration?.errorCodes?.find(() => true)
+  console.log('error: ', error)
+  if (error) {
+    throw error
+  }
+}

packages/web/pages/settings/integrations.tsx

@@ -21,6 +21,7 @@ import { showErrorToast, showSuccessToast } from '../../lib/toastHelpers'
 import { fetchEndpoint } from '../../lib/appConfig'
 import { setIntegrationMutation } from '../../lib/networking/mutations/setIntegrationMutation'
 import { cookieValue } from '../../lib/cookieHelpers'
+import { importFromIntegrationMutation } from '../../lib/networking/mutations/importFromIntegrationMutation'
 
 // Styles
 const Header = styled(Box, {
@@ -84,6 +85,15 @@ export default function Integrations(): JSX.Element {
     }
   }
 
+  const importFromIntegration = async (id: string) => {
+    try {
+      await importFromIntegrationMutation(id)
+      showSuccessToast('Import started')
+    } catch (err) {
+      showErrorToast('Error: ' + err)
+    }
+  }
+
   const redirectToPocket = () => {
     // create a form and submit it to the backend
     const form = document.createElement('form')
@@ -172,12 +182,12 @@ export default function Integrations(): JSX.Element {
         title: 'Pocket',
         subText: 'Pocket is a place to save articles, videos, and more.',
         button: {
-          text: pocketConnected ? 'Remove' : 'Connect to Pocket',
+          text: pocketConnected ? 'Import' : 'Connect to Pocket',
           icon: <Link size={16} weight={'bold'} />,
-          style: pocketConnected ? 'ctaWhite' : 'ctaDarkYellow',
+          style: 'ctaDarkYellow',
           action: () => {
             pocketConnected
-              ? deleteIntegration(pocketConnected.id)
+              ? importFromIntegration(pocketConnected.id)
               : redirectToPocket()
           },
         },