Fix frontend code snippet (self-hosted) (NangoHQ#583)

Close NangoHQ#475
Saksham294 · Apr 25, 2023 · ca77fba · ca77fba
1 parent 5901971
commit ca77fba
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 4 deletions.
diff --git a/packages/server/lib/controllers/account.controller.ts b/packages/server/lib/controllers/account.controller.ts
@@ -1,6 +1,6 @@
 import type { Request, Response, NextFunction } from 'express';
 import accountService from '../services/account.service.js';
-import { getUserAndAccountFromSession, isCloud, getOauthCallbackUrl } from '../utils/utils.js';
+import { getUserAndAccountFromSession, isCloud, getOauthCallbackUrl, getBaseUrl } from '../utils/utils.js';
 import errorManager from '../utils/error.manager.js';
 
 class AccountController {
@@ -13,6 +13,8 @@ class AccountController {
                 account.secret_key = process.env['NANGO_SECRET_KEY'] || '(none)';
             }
 
+            account.host = getBaseUrl();
+
             res.status(200).send({ account: account });
         } catch (err) {
             next(err);

diff --git a/packages/server/lib/models.ts b/packages/server/lib/models.ts
@@ -63,6 +63,7 @@ export interface Account {
     owner_id: number | undefined;
     secret_key_iv?: string | null;
     secret_key_tag?: string | null;
+    host?: string | null;
 }
 
 export interface User {

diff --git a/packages/webapp/src/pages/ConnectionCreate.tsx b/packages/webapp/src/pages/ConnectionCreate.tsx
@@ -29,6 +29,7 @@ export default function IntegrationCreate() {
     const [connectionId, setConnectionId] = useState<string>('test-connection-id');
     const [connectionConfigParams, setConnectionConfigParams] = useState<Record<string, string> | null>(null);
     const [publicKey, setPublicKey] = useState('');
+    const [hostUrl, setHostUrl] = useState('');
     const getIntegrationListAPI = useGetIntegrationListAPI();
     const getProjectInfoAPI = useGetProjectInfoAPI();
     const analyticsTrack = useAnalyticsTrack();
@@ -59,6 +60,7 @@ export default function IntegrationCreate() {
             if (res?.status === 200) {
                 const account = (await res.json())['account'];
                 setPublicKey(account.public_key);
+                setHostUrl(account.host || baseUrl());
             }
         };
 
@@ -79,7 +81,7 @@ export default function IntegrationCreate() {
             connection_config_params: { value: string };
         };
 
-        let nango = new Nango({ host: baseUrl(), publicKey: isCloud() ? publicKey : undefined });
+        let nango = new Nango({ host: hostUrl, publicKey: isCloud() ? publicKey : undefined });
 
         nango
             .auth(target.integration_unique_key.value, target.connection_id.value, { params: connectionConfigParams || {} })
@@ -134,7 +136,7 @@ export default function IntegrationCreate() {
         let args = [];
 
         if (isStaging() || isHosted()) {
-            args.push(`host: '${baseUrl()}'`);
+            args.push(`host: '${hostUrl}'`);
         }
 
         if (isCloud() && publicKey) {
@@ -169,7 +171,7 @@ nango.auth('${integration?.uniqueKey}', '${connectionId}'${connectionConfigStr})
 
     return (
         <DashboardLayout selectedItem={LeftNavBarItems.Integrations}>
-            {integrations && !!integrations.length && (!isCloud() || publicKey) && (
+            {integrations && !!integrations.length && publicKey && hostUrl && (
                 <div className="mx-auto w-largebox pb-40">
                     <h2 className="mx-20 mt-16 text-left text-3xl font-semibold tracking-tight text-white mb-12">Add New Connection</h2>
                     <div className="mx-20 h-fit border border-border-gray rounded-md text-white text-sm py-14 px-8">