feat: add notion page

2025-06-18 19:25:56 +05:30
parent af5edcf4db
commit bc67705982
3 changed files with 75 additions and 0 deletions
@@ -328,6 +328,14 @@
        "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
        "BUTTON_TEXT": "Connect Linear workspace"
      }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Cancel"
+      }
    }
  },
  "CAPTAIN": {
@@ -0,0 +1,57 @@
+<script setup>
+import { ref, computed, onMounted } from 'vue';
+import {
+  useFunctionGetter,
+  useMapGetter,
+  useStore,
+} from 'dashboard/composables/store';
+
+import Integration from './Integration.vue';
+import Spinner from 'shared/components/Spinner.vue';
+
+const store = useStore();
+
+const integrationLoaded = ref(false);
+
+const integration = useFunctionGetter('integrations/getIntegration', 'notion');
+
+const uiFlags = useMapGetter('integrations/getUIFlags');
+
+const integrationAction = computed(() => {
+  if (integration.value.enabled) {
+    return 'disconnect';
+  }
+  return integration.value.action;
+});
+
+const initializeNotionIntegration = async () => {
+  await store.dispatch('integrations/get', 'notion');
+  integrationLoaded.value = true;
+};
+
+onMounted(() => {
+  initializeNotionIntegration();
+});
+</script>
+
+<template>
+  <div class="flex-grow flex-shrink p-4 overflow-auto mx-auto">
+    <div v-if="integrationLoaded && !uiFlags.isCreatingNotion">
+      <Integration
+        :integration-id="integration.id"
+        :integration-logo="integration.logo"
+        :integration-name="integration.name"
+        :integration-description="integration.description"
+        :integration-enabled="integration.enabled"
+        :integration-action="integrationAction"
+        :delete-confirmation-text="{
+          title: $t('INTEGRATION_SETTINGS.NOTION.DELETE.TITLE'),
+          message: $t('INTEGRATION_SETTINGS.NOTION.DELETE.MESSAGE'),
+        }"
+      />
+    </div>
+    <div v-else class="flex items-center justify-center flex-1">
+      <Spinner size="" color-scheme="primary" />
+    </div>
+  </div>
+</template>
@@ -8,6 +8,7 @@ import DashboardApps from './DashboardApps/Index.vue';
 import Slack from './Slack.vue';
 import SettingsContent from '../Wrapper.vue';
 import Linear from './Linear.vue';
+import Notion from './Notion.vue';
 import Shopify from './Shopify.vue';

 export default {
@@ -90,6 +91,15 @@ export default {
          },
          props: route => ({ code: route.query.code }),
        },
+        {
+          path: 'notion',
+          name: 'settings_integrations_notion',
+          component: Notion,
+          meta: {
+            permissions: ['administrator'],
+          },
+          props: route => ({ code: route.query.code }),
+        },
        {
          path: 'shopify',
          name: 'settings_integrations_shopify',