move ccp connection to cc link

dashboard/src/main/home/modals/PaymentSetupForm.tsx

@@ -1,10 +1,19 @@
-import React, { useState } from "react";
+import React, { useState, useContext } from "react";
 import {
   PaymentElement,
   useElements,
   useStripe,
 } from "@stripe/react-stripe-js";
+
+import {
+  ClientSecretResponse,
+  PaymentMethodValidator,
+  type PaymentMethod,
+  type PaymentMethodList,
+} from "lib/billing/types";
+
 import styled from "styled-components";
+import api from "shared/api";
 
 import Button from "components/porter/Button";
 import Error from "components/porter/Error";
@@ -13,9 +22,13 @@ import SaveButton from "components/SaveButton";
 import {
   useCreatePaymentMethod,
   useSetDefaultPaymentMethod,
+  checkIfProjectHasPayment,
 } from "lib/hooks/useStripe";
 
+import { Context } from "shared/Context";
+
 const PaymentSetupForm = ({ onCreate }: { onCreate: () => Promise<void> }) => {
+  const { currentProject } = useContext(Context);
   const stripe = useStripe();
   const elements = useElements();
 
@@ -59,6 +72,31 @@ const PaymentSetupForm = ({ onCreate }: { onCreate: () => Promise<void> }) => {
       await setDefaultPaymentMethod(setupIntent?.payment_method as string);
     }
 
+    if (currentProject?.sandbox_enabled) {
+      const { hasPaymentEnabled, refetchPaymentEnabled } = checkIfProjectHasPayment();
+
+      if (!hasPaymentEnabled) {
+        await api.connectProjectToCluster(
+          "<token>",
+          {},
+          { id: currentProject.id }
+        )
+        .then(() => {
+          api.inviteAdmin(
+            "<token>",
+            {},
+            { project_id: currentProject.id }
+          )
+          onCreate();
+        })
+        .catch((err: any) => {
+          setErrorMessage(err.message);
+          setLoading(false);
+          return;
+        })  
+      }
+    }
+
     onCreate();
   };
 

dashboard/src/main/home/new-project/NewProject.tsx

@@ -90,10 +90,10 @@ export const NewProjectFC = () => {
           }
         )
         .then((res) => res.data as ProjectListType[]);
+
       setProjects(projectList);
       setCurrentProject(project);
       trackCreateNewProject();
-
       if (project?.sandbox_enabled) {
         await api
           .connectProjectToCluster("<token>", {}, { id: project.id })