From 97ee31fb63134659dff06f14da177055b88dbb0d Mon Sep 17 00:00:00 2001
From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>
Date: Fri, 16 Aug 2024 15:41:39 +0000
Subject: [PATCH] feat(nc-gui): enable sqlite integration in oss

---
 .../workspace/integrations/EditOrAdd.vue      |  2 ++
 .../integrations/IntegrationsTab.vue          |  3 ++-
 .../integrations/forms/EditOrAddDatabase.vue  | 22 ++++++++++++++-----
 .../composables/useIntegrationsStore.ts       | 15 ++++++++++++-
 packages/nc-gui/utils/syncDataUtils.ts        | 18 +++++++++++++++
 5 files changed, 52 insertions(+), 8 deletions(-)

diff --git a/packages/nc-gui/components/workspace/integrations/EditOrAdd.vue b/packages/nc-gui/components/workspace/integrations/EditOrAdd.vue
index 68c1e43695..6aca0bc059 100644
--- a/packages/nc-gui/components/workspace/integrations/EditOrAdd.vue
+++ b/packages/nc-gui/components/workspace/integrations/EditOrAdd.vue
@@ -26,6 +26,8 @@ const connectionType = computed(() => {
       return ClientType.PG
     case integrationType.MySQL:
       return ClientType.MYSQL
+    case integrationType.SQLITE:
+      return ClientType.SQLITE
     default: {
       return undefined
     }
diff --git a/packages/nc-gui/components/workspace/integrations/IntegrationsTab.vue b/packages/nc-gui/components/workspace/integrations/IntegrationsTab.vue
index c070dfe13e..52d624ae23 100644
--- a/packages/nc-gui/components/workspace/integrations/IntegrationsTab.vue
+++ b/packages/nc-gui/components/workspace/integrations/IntegrationsTab.vue
@@ -59,8 +59,9 @@ const upvotesData = computed(() => {
 
 const getIntegrationsByCategory = (category: IntegrationCategoryType, query: string) => {
   return allIntegrations.filter((i) => {
+    const isOssOnly = isEeUI ? !i?.isOssOnly : true
     return (
-      filterIntegration(i) && i.categories.includes(category) && t(i.title).toLowerCase().includes(query.trim().toLowerCase())
+      isOssOnly && filterIntegration(i) && i.categories.includes(category) && t(i.title).toLowerCase().includes(query.trim().toLowerCase())
     )
   })
 }
diff --git a/packages/nc-gui/components/workspace/integrations/forms/EditOrAddDatabase.vue b/packages/nc-gui/components/workspace/integrations/forms/EditOrAddDatabase.vue
index e40702a0a6..bc5cd6cf43 100644
--- a/packages/nc-gui/components/workspace/integrations/forms/EditOrAddDatabase.vue
+++ b/packages/nc-gui/components/workspace/integrations/forms/EditOrAddDatabase.vue
@@ -428,6 +428,14 @@ function handleAutoScroll(scroll: boolean, className: string) {
   }
 }
 
+const activeIntegrationIcon = computed(() => {
+  const activeIntegrationType = isEditMode.value
+    ? activeIntegration.value?.sub_type || activeIntegration.value?.config?.client
+    : activeIntegration.value?.type
+
+  return allIntegrationsMapByValue[activeIntegrationType]?.icon
+})
+
 // reset test status on config change
 watch(
   formState,
@@ -504,12 +512,14 @@ watch(
         >
           <GeneralIcon icon="arrowLeft" />
         </NcButton>
-        <WorkspaceIntegrationsIcon
-          :integration-type="
-            isEditMode ? activeIntegration?.sub_type || activeIntegration?.config?.client : activeIntegration?.type
-          "
-          size="xs"
-        />
+
+        <div
+          v-if="activeIntegrationIcon"
+          class="h-8 w-8 flex items-center justify-center children:flex-none bg-gray-200 rounded-lg"
+        >
+          <component :is="activeIntegrationIcon" class="!stroke-transparent w-4 h-4" />
+        </div>
+
         <div class="flex-1 text-base font-weight-700">{{ activeIntegration?.title }}</div>
       </div>
       <div class="flex items-center gap-3">
diff --git a/packages/nc-gui/composables/useIntegrationsStore.ts b/packages/nc-gui/composables/useIntegrationsStore.ts
index 1731362070..814e91fc6f 100644
--- a/packages/nc-gui/composables/useIntegrationsStore.ts
+++ b/packages/nc-gui/composables/useIntegrationsStore.ts
@@ -10,9 +10,10 @@ enum IntegrationsPageMode {
   EDIT,
 }
 
-const integrationType: Record<'PostgreSQL' | 'MySQL', ClientType> = {
+const integrationType: Record<'PostgreSQL' | 'MySQL' | 'SQLITE', ClientType> = {
   PostgreSQL: ClientType.PG,
   MySQL: ClientType.MYSQL,
+  SQLITE: ClientType.SQLITE,
 }
 
 type IntegrationsSubType = (typeof integrationType)[keyof typeof integrationType]
@@ -43,6 +44,16 @@ function defaultValues(type: IntegrationsSubType) {
           'class': 'logo',
         }),
       }
+    case integrationType.SQLITE:
+      return {
+        ...genericValues,
+        type: integrationType.SQLITE,
+        title: 'SQLite',
+        logo: h(GeneralBaseLogo, {
+          'source-type': 'sqlite3',
+          'class': 'logo',
+        }),
+      }
   }
 }
 
@@ -144,7 +155,9 @@ const [useProvideIntegrationViewStore, _useIntegrationStore] = useInjectionState
     }
   }
   const addIntegration = (type: IntegrationsSubType) => {
+    console.log('add integration', type)
     activeIntegration.value = defaultValues(type)
+    console.log('integration', activeIntegration.value)
     pageMode.value = IntegrationsPageMode.ADD
     $e('c:integration:add')
   }
diff --git a/packages/nc-gui/utils/syncDataUtils.ts b/packages/nc-gui/utils/syncDataUtils.ts
index af3fe78324..0c4367d72d 100644
--- a/packages/nc-gui/utils/syncDataUtils.ts
+++ b/packages/nc-gui/utils/syncDataUtils.ts
@@ -8,6 +8,7 @@ export interface IntegrationItemType {
   categories: IntegrationCategoryType[]
   isAvailable?: boolean
   iconStyle?: CSSProperties
+  isOssOnly?: boolean
 }
 
 export interface IntegrationCategoryItemType {
@@ -108,6 +109,14 @@ export const allIntegrations: IntegrationItemType[] = [
     categories: [IntegrationCategoryType.DATABASE],
     isAvailable: true,
   },
+  {
+    title: 'objects.syncData.sqlServer',
+    value: ClientType.SQLITE,
+    icon: iconMap.sqlServer,
+    categories: [IntegrationCategoryType.DATABASE],
+    isAvailable: true,
+    isOssOnly: true
+  },
   {
     title: 'objects.syncData.snowflake',
     value: ClientType.SNOWFLAKE,
@@ -426,3 +435,12 @@ export const allIntegrations: IntegrationItemType[] = [
   //   categories: [IntegrationCategoryType.OTHERS],
   // },
 ]
+
+
+export const allIntegrationsMapByValue = allIntegrations.reduce(
+  (acc, curr) => {
+    acc[curr.value] = curr;
+    return acc;
+  },
+  {} as Record<string, IntegrationItemType>
+);