Create customer on backend, move frontend calls to billing page

api/server/handlers/project/create.go

@@ -50,6 +50,14 @@ func (p *ProjectCreateHandler) ServeHTTP(w http.ResponseWriter, r *http.Request)
 	}
 
 	var err error
+
+	// Create billing customer for project and set the billing ID
+	billingID, err := p.Config().BillingManager.CreateCustomer(user.Email, proj)
+	if err != nil {
+		p.HandleAPIError(w, r, apierrors.NewErrInternal(err))
+	}
+	proj.BillingID = billingID
+
 	proj, _, err = CreateProjectWithUser(p.Repo().Project(), proj, user)
 	if err != nil {
 		p.HandleAPIError(w, r, apierrors.NewErrInternal(err))

dashboard/src/main/home/Home.tsx

@@ -17,7 +17,6 @@ import Modal from "components/porter/Modal";
 import ShowIntercomButton from "components/porter/ShowIntercomButton";
 import Spacer from "components/porter/Spacer";
 import Text from "components/porter/Text";
-import { checkBillingCustomerExists } from "lib/hooks/useStripe";
 
 import api from "shared/api";
 import { withAuth, type WithAuthProps } from "shared/auth/AuthorizationHoc";
@@ -294,8 +293,6 @@ const Home: React.FC<Props> = (props) => {
     prevCurrentCluster.current = props.currentCluster;
   }, [props.currentCluster]);
 
-  checkBillingCustomerExists();
-
   const projectOverlayCall = async () => {
     try {
       const projectList = await api

dashboard/src/main/home/project-settings/BillingPage.tsx

@@ -32,6 +32,7 @@ function BillingPage(): JSX.Element {
     isDeleting,
   } = usePaymentMethods();
   const { setDefaultPaymentMethod } = useSetDefaultPaymentMethod();
+  checkBillingCustomerExists();
 
   const { refetchPaymentEnabled } = checkIfProjectHasPayment();