diff --git a/packages/backend/src/helpers/add-authentication-steps.js b/packages/backend/src/helpers/add-authentication-steps.js
index 631e6055..8ab6f6d7 100644
--- a/packages/backend/src/helpers/add-authentication-steps.js
+++ b/packages/backend/src/helpers/add-authentication-steps.js
@@ -54,12 +54,7 @@ const authenticationStepsWithAuthUrl = [
   {
     type: 'mutation',
     name: 'generateAuthUrl',
-    arguments: [
-      {
-        name: 'id',
-        value: '{createConnection.id}',
-      },
-    ],
+    arguments: [],
   },
   {
     type: 'openWithPopup',
diff --git a/packages/web/src/helpers/computeAuthStepVariables.js b/packages/web/src/helpers/computeAuthStepVariables.js
index d49bdb5f..49714b54 100644
--- a/packages/web/src/helpers/computeAuthStepVariables.js
+++ b/packages/web/src/helpers/computeAuthStepVariables.js
@@ -6,7 +6,7 @@ const computeAuthStepVariables = (variableSchema, aggregatedData) => {
     if (variable.properties) {
       variables[variable.name] = computeAuthStepVariables(
         variable.properties,
-        aggregatedData
+        aggregatedData,
       );
       continue;
     }
@@ -17,7 +17,7 @@ const computeAuthStepVariables = (variableSchema, aggregatedData) => {
         continue;
       }
       const computedVariable = template(variable.value, { interpolate })(
-        aggregatedData
+        aggregatedData,
       );
       variables[variable.name] = computedVariable;
     }
diff --git a/packages/web/src/hooks/useAuthenticateApp.ee.js b/packages/web/src/hooks/useAuthenticateApp.ee.js
index c140c3e7..c4572363 100644
--- a/packages/web/src/hooks/useAuthenticateApp.ee.js
+++ b/packages/web/src/hooks/useAuthenticateApp.ee.js
@@ -9,6 +9,7 @@ import computeAuthStepVariables from 'helpers/computeAuthStepVariables';
 import useAppAuth from './useAppAuth';
 import useCreateConnection from './useCreateConnection';
 import useFormatMessage from './useFormatMessage';
+import useCreateConnectionAuthUrl from './useCreateConnectionAuthUrl';
 
 function getSteps(auth, hasConnection, useShared) {
   if (hasConnection) {
@@ -29,6 +30,7 @@ export default function useAuthenticateApp(payload) {
   const { appKey, appAuthClientId, connectionId, useShared = false } = payload;
   const { data: auth } = useAppAuth(appKey);
   const { mutateAsync: createConnection } = useCreateConnection(appKey);
+  const { mutateAsync: createConnectionAuthUrl } = useCreateConnectionAuthUrl();
   const [authenticationInProgress, setAuthenticationInProgress] =
     React.useState(false);
   const formatMessage = useFormatMessage();
@@ -70,6 +72,11 @@ export default function useAuthenticateApp(payload) {
             if (step.name === 'createConnection') {
               const stepResponse = await createConnection(variables);
               response[step.name] = stepResponse?.data;
+            } else if (step.name === 'generateAuthUrl') {
+              const stepResponse = await createConnectionAuthUrl(
+                response.createConnection.id,
+              );
+              response[step.name] = stepResponse?.data;
             } else {
               const stepResponse = await processMutation(step.name, variables);
               response[step.name] = stepResponse;
diff --git a/packages/web/src/hooks/useCreateConnectionAuthUrl.js b/packages/web/src/hooks/useCreateConnectionAuthUrl.js
new file mode 100644
index 00000000..cfdc450f
--- /dev/null
+++ b/packages/web/src/hooks/useCreateConnectionAuthUrl.js
@@ -0,0 +1,17 @@
+import { useMutation } from '@tanstack/react-query';
+
+import api from 'helpers/api';
+
+export default function useCreateConnectionAuthUrl() {
+  const query = useMutation({
+    mutationFn: async (connectionId) => {
+      const { data } = await api.post(
+        `/v1/connections/${connectionId}/auth-url`,
+      );
+
+      return data;
+    },
+  });
+
+  return query;
+}