add delete notion button

packages/web/next.config.js

@@ -3,7 +3,7 @@ const ContentSecurityPolicy = `
   base-uri 'self';
   connect-src 'self' ${process.env.NEXT_PUBLIC_SERVER_BASE_URL} https://proxy-prod.omnivore-image-cache.app https://accounts.google.com https://proxy-demo.omnivore-image-cache.app https://storage.googleapis.com https://api.segment.io https://cdn.segment.com https://widget.intercom.io https://api-iam.intercom.io https://static.intercomassets.com https://downloads.intercomcdn.com https://platform.twitter.com wss://nexus-websocket-a.intercom.io wss://nexus-websocket-b.intercom.io wss://nexus-europe-websocket.intercom.io wss://nexus-australia-websocket.intercom.io https://uploads.intercomcdn.com https://tools.applemediaservices.com;
   font-src 'self' data: https://cdn.jsdelivr.net https://js.intercomcdn.com https://fonts.intercomcdn.com;
-  form-action 'self' ${process.env.NEXT_PUBLIC_SERVER_BASE_URL} https://getpocket.com/auth/authorize https://intercom.help https://api-iam.intercom.io https://api-iam.eu.intercom.io https://api-iam.au.intercom.io;
+  form-action 'self' ${process.env.NEXT_PUBLIC_SERVER_BASE_URL} https://getpocket.com/auth/authorize https://intercom.help https://api-iam.intercom.io https://api-iam.eu.intercom.io https://api-iam.au.intercom.io https://www.notion.so https://api.notion.com;
   frame-ancestors 'none';
   frame-src 'self' https://accounts.google.com https://platform.twitter.com https://www.youtube.com https://www.youtube-nocookie.com;
   manifest-src 'self';

packages/web/pages/settings/integrations.tsx

@@ -128,6 +128,7 @@ export default function Integrations(): JSX.Element {
       input.value = importItemState
       form.appendChild(input)
     }
+    document.body.appendChild(form)
 
     form.submit()
   }
@@ -163,7 +164,7 @@ export default function Integrations(): JSX.Element {
           { duration: 5000 }
         )
       } finally {
-        router.replace('/settings/integrations')
+        router.push('/settings/integrations')
       }
     }
 
@@ -189,7 +190,7 @@ export default function Integrations(): JSX.Element {
           { duration: 5000 }
         )
       } finally {
-        router.replace('/settings/integrations/notion')
+        router.push('/settings/integrations/notion')
       }
     }
 
@@ -276,7 +277,7 @@ export default function Integrations(): JSX.Element {
         button: {
           text: isConnected('NOTION') ? 'Settings' : 'Connect',
           icon: <Link size={16} weight={'bold'} />,
-          style: 'ctaWhite',
+          style: isConnected('NOTION') ? 'ctaWhite' : 'ctaDarkYellow',
           action: () => {
             isConnected('NOTION')
               ? router.push('/settings/integrations/notion')

packages/web/pages/settings/integrations/notion.tsx

@@ -12,6 +12,7 @@ import {
 import 'antd/dist/antd.compact.css'
 import { CheckboxValueType } from 'antd/lib/checkbox/Group'
 import Image from 'next/image'
+import { useRouter } from 'next/router'
 import { useMemo } from 'react'
 import {
   Box,
@@ -21,8 +22,11 @@ import {
 import { PageMetaData } from '../../../components/patterns/PageMetaData'
 import { Beta } from '../../../components/templates/Beta'
 import { SettingsLayout } from '../../../components/templates/SettingsLayout'
+import { deleteIntegrationMutation } from '../../../lib/networking/mutations/deleteIntegrationMutation'
 import { setIntegrationMutation } from '../../../lib/networking/mutations/setIntegrationMutation'
 import { useGetIntegrationsQuery } from '../../../lib/networking/queries/useGetIntegrationsQuery'
+import { applyStoredTheme } from '../../../lib/themeUpdater'
+import { showSuccessToast } from '../../../lib/toastHelpers'
 
 interface FieldData {
   name: string | number | (string | number)[]
@@ -47,6 +51,9 @@ const Header = styled(Box, {
 })
 
 export default function Notion(): JSX.Element {
+  applyStoredTheme()
+
+  const router = useRouter()
   const { integrations, revalidate } = useGetIntegrationsQuery()
   const notion = useMemo(
     () => integrations.find((i) => i.name == 'NOTION' && i.type == 'EXPORT'),
@@ -77,6 +84,17 @@ export default function Notion(): JSX.Element {
   const [form] = Form.useForm<FieldType>()
   const [messageApi, contextHolder] = message.useMessage()
 
+  const deleteNotion = async () => {
+    if (!notion) {
+      throw new Error('Notion integration not found')
+    }
+
+    await deleteIntegrationMutation(notion.id)
+    showSuccessToast('Notion integration disconnected successfully.')
+
+    router.push('/settings/integrations')
+  }
+
   const updateNotion = async (values: FieldType) => {
     if (!notion) {
       throw new Error('Notion integration not found')
@@ -194,7 +212,7 @@ export default function Notion(): JSX.Element {
 
           <Space>
             <Button type="primary">Export Recent Items</Button>
-            <Button type="primary" danger>
+            <Button type="primary" danger onClick={deleteNotion}>
               Disconnect
             </Button>
           </Space>