From b17841ced18e61c4591a84538a07cee064befa90 Mon Sep 17 00:00:00 2001
From: hallidayo <22655069+Hallidayo@users.noreply.github.com>
Date: Mon, 13 May 2024 12:32:00 +0100
Subject: [PATCH] feat: mobile connect tab (#22830)

* mobile connect tab

* prettier changes
---
 .../interfaces/Home/Connect/Connect.constants.ts    |  4 ++++
 .../components/interfaces/Home/Connect/Connect.tsx  | 13 +++++++++++--
 2 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/apps/studio/components/interfaces/Home/Connect/Connect.constants.ts b/apps/studio/components/interfaces/Home/Connect/Connect.constants.ts
index 00f6e5aebd0..355050b9a7c 100644
--- a/apps/studio/components/interfaces/Home/Connect/Connect.constants.ts
+++ b/apps/studio/components/interfaces/Home/Connect/Connect.constants.ts
@@ -175,6 +175,9 @@ export const FRAMEWORKS: ConnectionType[] = [
       },
     ],
   },
+]
+
+export const MOBILES: ConnectionType[] = [
   {
     key: 'exporeactnative',
     label: 'Expo React Native',
@@ -225,5 +228,6 @@ export const ORMS: ConnectionType[] = [
 
 export const CONNECTION_TYPES = [
   { key: 'frameworks', label: 'App Frameworks', obj: FRAMEWORKS },
+  { key: 'mobiles', label: 'Mobile Frameworks', obj: MOBILES },
   { key: 'orms', label: 'ORMs', obj: ORMS },
 ]
diff --git a/apps/studio/components/interfaces/Home/Connect/Connect.tsx b/apps/studio/components/interfaces/Home/Connect/Connect.tsx
index 9384fb0d7e4..a47b6554c22 100644
--- a/apps/studio/components/interfaces/Home/Connect/Connect.tsx
+++ b/apps/studio/components/interfaces/Home/Connect/Connect.tsx
@@ -26,7 +26,7 @@ import { useProjectApiQuery } from 'data/config/project-api-query'
 import { useProjectSettingsQuery } from 'data/config/project-settings-query'
 import { useCheckPermissions } from 'hooks'
 import { DEFAULT_PROJECT_API_SERVICE_ID } from 'lib/constants'
-import { CONNECTION_TYPES, ConnectionType, FRAMEWORKS, ORMS } from './Connect.constants'
+import { CONNECTION_TYPES, ConnectionType, FRAMEWORKS, MOBILES, ORMS } from './Connect.constants'
 import { getContentFilePath } from './Connect.utils'
 import ConnectDropdown from './ConnectDropdown'
 import ConnectTabContent from './ConnectTabContent'
@@ -98,6 +98,11 @@ const Connect = () => {
       handleConnectionTypeChange(FRAMEWORKS)
     }
 
+    if (type === 'mobiles') {
+      setConnectionObject(MOBILES)
+      handleConnectionTypeChange(MOBILES)
+    }
+
     if (type === 'orms') {
       setConnectionObject(ORMS)
       handleConnectionTypeChange(ORMS)
@@ -208,7 +213,11 @@ const Connect = () => {
                       <ConnectDropdown
                         state={selectedParent}
                         updateState={handleParentChange}
-                        label={connectionObject === FRAMEWORKS ? 'Framework' : 'Tool'}
+                        label={
+                          connectionObject === FRAMEWORKS || connectionObject === MOBILES
+                            ? 'Framework'
+                            : 'Tool'
+                        }
                         items={connectionObject}
                       />
                       {selectedParent && hasChildOptions && (