Merge pull request #2200 from omnivore-app/fix/pocket-import

Pass pocket auth token in query string

packages/api/src/routers/integration_router.ts

@@ -1,10 +1,10 @@
+import axios from 'axios'
 import cors from 'cors'
 import express from 'express'
-import { corsConfig } from '../utils/corsConfig'
 import { env } from '../env'
-import axios from 'axios'
-import { buildLogger } from '../utils/logger'
 import { getClaimsByToken } from '../utils/auth'
+import { corsConfig } from '../utils/corsConfig'
+import { buildLogger } from '../utils/logger'
 
 const logger = buildLogger('app.dispatch')
 
@@ -24,7 +24,7 @@ export function integrationRouter() {
       }
 
       const consumerKey = env.pocket.consumerKey
-      const redirectUri = `${env.client.url}/settings/integrations?state=pocketAuthorizationFinished`
+      const redirectUri = `${env.client.url}/settings/integrations`
       try {
         // make a POST request to Pocket to get a request token
         const response = await axios.post<{ code: string }>(
@@ -41,13 +41,9 @@ export function integrationRouter() {
           }
         )
         const { code } = response.data
-        // store the request token in a cookie
-        res.cookie('pocketRequestToken', code, {
-          maxAge: 1000 * 60 * 60,
-        })
         // redirect the user to Pocket to authorize the request token
         res.redirect(
-          `https://getpocket.com/auth/authorize?request_token=${code}&redirect_uri=${redirectUri}`
+          `https://getpocket.com/auth/authorize?request_token=${code}&redirect_uri=${redirectUri}?pocketToken=${code}`
         )
       } catch (e) {
         logger.info('pocket/request-token exception:', e)

packages/web/lib/networking/queries/useGetIntegrationsQuery.tsx

@@ -71,7 +71,8 @@ export function useGetIntegrationsQuery(): IntegrationsQueryResponse {
   return {
     isValidating: false,
     integrations: [],
-    // eslint-disable-next-line @typescript-eslint/no-empty-function
-    revalidate: () => {},
+    revalidate: () => {
+      mutate()
+    },
   }
 }

packages/web/pages/settings/integrations.tsx

@@ -13,7 +13,6 @@ import {
 } from '../../components/elements/LayoutPrimitives'
 import { SettingsLayout } from '../../components/templates/SettingsLayout'
 import { fetchEndpoint } from '../../lib/appConfig'
-import { cookieValue } from '../../lib/cookieHelpers'
 import { deleteIntegrationMutation } from '../../lib/networking/mutations/deleteIntegrationMutation'
 import { importFromIntegrationMutation } from '../../lib/networking/mutations/importFromIntegrationMutation'
 import { setIntegrationMutation } from '../../lib/networking/mutations/setIntegrationMutation'
@@ -104,12 +103,8 @@ export default function Integrations(): JSX.Element {
   useEffect(() => {
     const connectToPocket = async () => {
       try {
-        // get the token from cookies
-        const token = cookieValue('pocketRequestToken', document.cookie)
-        if (!token) {
-          showErrorToast('There was an error connecting to Pocket.')
-          return
-        }
+        // get the token from query string
+        const token = router.query.pocketToken as string
         const result = await setIntegrationMutation({
           token,
           name: 'POCKET',
@@ -124,13 +119,12 @@ export default function Integrations(): JSX.Element {
         }
       } catch (err) {
         showErrorToast('Error: ' + err)
+      } finally {
+        router.replace('/settings/integrations')
       }
     }
     if (!router.isReady) return
-    if (
-      router.query.state == 'pocketAuthorizationFinished' &&
-      !pocketConnected
-    ) {
+    if (router.query.pocketToken && !pocketConnected) {
       connectToPocket()
     }
   }, [router])