Creating projects from studio now requires destination repo. (#9990)

EtherealEngine · Apr 1, 2024 · 8345d3b · 8345d3b
1 parent ea32cc7
commit 8345d3b
Show file tree

Hide file tree

Showing 5 changed files with 56 additions and 15 deletions.
diff --git a/packages/client-core/i18n/en/admin.json b/packages/client-core/i18n/en/admin.json
@@ -193,7 +193,7 @@
       "branchProcessing": "Fetching branches of project",
       "commitsProcessing": "Fetching commits of project",
       "mismatchedProjectWarning": "This version of this project does not match the installed version of Ethereal Engine. There may be compilation or runtime errors if this project is installed.",
-      "needsGithubProvider": "You must connect your account with GitHub in order to add or update projects from GitHub",
+      "needsGithubProvider": "You must connect your account with GitHub in order to create new projects, or add or update projects from GitHub",
       "sourceProjectName": "Project in source repo",
       "destinationProjectName": "Project in destination repo",
       "destinationRepoEmpty": "The destination repo is empty",

diff --git a/packages/client-core/src/admin/components/Project/ProjectFields.tsx b/packages/client-core/src/admin/components/Project/ProjectFields.tsx
@@ -53,10 +53,17 @@ interface Props {
   inputProject?: ProjectType | null | undefined
   existingProject?: boolean | undefined
   changeDestination?: boolean | undefined
+  createProject?: boolean | undefined
   processing: boolean
 }
 
-const ProjectFields = ({ inputProject, existingProject = false, changeDestination = false, processing }: Props) => {
+const ProjectFields = ({
+  inputProject,
+  existingProject = false,
+  changeDestination = false,
+  createProject = false,
+  processing
+}: Props) => {
   const { t } = useTranslation()
 
   const project =
@@ -149,7 +156,8 @@ const ProjectFields = ({ inputProject, existingProject = false, changeDestinatio
           ProjectUpdateService.setDestinationError(project.name, destinationResponse.text!)
         } else {
           if (destinationResponse.destinationValid) {
-            if (existingProject && changeDestination) ProjectUpdateService.setSubmitDisabled(project.name, false)
+            if ((existingProject && changeDestination) || createProject)
+              ProjectUpdateService.setSubmitDisabled(project.name, false)
             ProjectUpdateService.setDestinationValid(project.name, destinationResponse.destinationValid)
             if (destinationResponse.projectName)
               ProjectUpdateService.setDestinationProjectName(project.name, destinationResponse.projectName)
@@ -310,7 +318,11 @@ const ProjectFields = ({ inputProject, existingProject = false, changeDestinatio
         }
       })
     } else {
-      if (!projectUpdateStatus?.value?.sourceVsDestinationChecked && !(existingProject && changeDestination)) {
+      if (
+        !projectUpdateStatus?.value?.sourceVsDestinationChecked &&
+        !(existingProject && changeDestination) &&
+        !createProject
+      ) {
         ProjectUpdateService.setSourceVsDestinationProcessing(project.name, false)
         ProjectUpdateService.setSourceVsDestinationChecked(project.name, false)
         ProjectUpdateService.setProjectName(project.name, '')
@@ -368,6 +380,8 @@ const ProjectFields = ({ inputProject, existingProject = false, changeDestinatio
               ? t('admin:components.project.updateProject')
               : existingProject && changeDestination
               ? t('admin:components.project.changeDestination')
+              : createProject
+              ? null
               : t('admin:components.project.addProject')}
           </DialogTitle>
 
@@ -415,7 +429,7 @@ const ProjectFields = ({ inputProject, existingProject = false, changeDestinatio
             />
           )}
 
-          {!changeDestination && (
+          {!changeDestination && !createProject && (
             <DialogTitle
               className={classNames({
                 [styles.textAlign]: true,
@@ -426,7 +440,7 @@ const ProjectFields = ({ inputProject, existingProject = false, changeDestinatio
             </DialogTitle>
           )}
 
-          {!changeDestination && (
+          {!changeDestination && !createProject && (
             <div>
               {hasGithubProvider ? (
                 <div className={styles.sourceContainer}>
@@ -548,7 +562,7 @@ const ProjectFields = ({ inputProject, existingProject = false, changeDestinatio
             {t('admin:components.project.destinationURLValid')}
           </div>
 
-          {!(existingProject && changeDestination) && (
+          {!(existingProject && changeDestination) && !createProject && (
             <div
               className={classNames({
                 [styles.validContainer]: true,
@@ -563,7 +577,7 @@ const ProjectFields = ({ inputProject, existingProject = false, changeDestinatio
             </div>
           )}
 
-          {!(existingProject && changeDestination) && (
+          {!(existingProject && changeDestination) && !createProject && (
             <div
               className={classNames({
                 [styles.validContainer]: true,
@@ -578,7 +592,7 @@ const ProjectFields = ({ inputProject, existingProject = false, changeDestinatio
             </div>
           )}
 
-          {!changeDestination && (
+          {!changeDestination && !createProject && (
             <>
               <DialogTitle
                 className={classNames({

diff --git a/packages/common/src/constants/DefaultThemeSettings.ts b/packages/common/src/constants/DefaultThemeSettings.ts
@@ -98,7 +98,7 @@ export const defaultThemeSettings = {
     dropdownMenuHoverBackground: 'rgba(88,88,88,1)',
     dropdownMenuSelectedBackground: 'rgba(95,95,95,1)',
     drawerBackground: 'rgba(66,66,66,1)',
-    popupBackground: 'rgba(90,90,90,1)',
+    popupBackground: 'rgba(120,120,120,1)',
     tableHeaderBackground: 'rgba(76,76,76,1)',
     tableCellBackground: 'rgba(104,104,104,1)',
     tableFooterBackground: 'rgba(71,71,71,1)',

diff --git a/packages/editor/src/components/projects/CreateProjectDialog.tsx b/packages/editor/src/components/projects/CreateProjectDialog.tsx
@@ -26,17 +26,25 @@ Ethereal Engine. All Rights Reserved.
 import React, { useState } from 'react'
 import { useTranslation } from 'react-i18next'
 
+import ProjectFields from '@etherealengine/client-core/src/admin/components/Project/ProjectFields'
+
+import { useHookstate } from '@hookstate/core'
+
 import { Dialog, DialogContent, DialogTitle, TextField } from '@mui/material'
 import CircularProgress from '@mui/material/CircularProgress'
 import Fade from '@mui/material/Fade'
 import FormControl from '@mui/material/FormControl'
 
+import { ProjectUpdateState } from '@etherealengine/client-core/src/admin/services/ProjectUpdateService'
+import { DefaultUpdateSchedule } from '@etherealengine/common/src/interfaces/ProjectPackageJsonType'
+import { ProjectType } from '@etherealengine/common/src/schemas/projects/project.schema'
+import { getMutableState } from '@etherealengine/hyperflux'
 import { Button } from '../inputs/Button'
 import styles from './styles.module.scss'
 
 interface Props {
   open: boolean
-  onSuccess: (name: string) => Promise<void>
+  onSuccess: (name: string, repositoryPath?: string) => Promise<void>
   onClose: () => void
 }
 
@@ -47,12 +55,26 @@ export const CreateProjectDialog = ({ open, onSuccess, onClose }: Props): any =>
   const [error, setError] = useState('')
   const [projectName, setProjectName] = useState('')
 
+  const project = {
+    id: '',
+    name: 'tempProject',
+    thumbnail: '',
+    repositoryPath: '',
+    needsRebuild: false,
+    updateType: 'none' as ProjectType['updateType'],
+    updateSchedule: DefaultUpdateSchedule,
+    commitSHA: '',
+    commitDate: new Date()
+  }
+
+  const projectUpdateStatus = useHookstate(getMutableState(ProjectUpdateState)[project.name]).value
+
   const handleCreateProject = async () => {
     if (!projectName) return
 
     setProcessing(true)
     try {
-      await onSuccess(projectName)
+      await onSuccess(projectName, projectUpdateStatus?.destinationURL)
       closeDialog()
     } catch (err) {
       setError(err.message)
@@ -107,7 +129,12 @@ export const CreateProjectDialog = ({ open, onSuccess, onClose }: Props): any =>
               onKeyDown={handleSubmitOnEnter}
             />
             {error && error.length > 0 && <h2 className={styles.errorMessage}>{error}</h2>}
-            <Button onClick={handleCreateProject} className={styles.btn} disabled={!projectName}>
+            <ProjectFields inputProject={null} createProject={true} processing={processing} />
+            <Button
+              onClick={handleCreateProject}
+              className={styles.btn}
+              disabled={!projectName || projectUpdateStatus?.submitDisabled}
+            >
               {t('editor.projects.lbl-createProject')}
             </Button>
           </FormControl>

diff --git a/packages/editor/src/components/projects/ProjectsPage.tsx b/packages/editor/src/components/projects/ProjectsPage.tsx
@@ -265,8 +265,8 @@ const ProjectsPage = () => {
     }
   }
 
-  const onCreateProject = async (name: string) => {
-    projectCreateQuery({ name }, { query: { action: 'studio' } })
+  const onCreateProject = async (name: string, repositoryPath?: string) => {
+    projectCreateQuery({ name, repositoryPath }, { query: { action: 'studio' } })
   }
 
   const onCreatePermission = async (userInviteCode: InviteCode, projectId: string) => {