Merge pull request #9 from x-team/feature/XTG-321

[XTG-321] - Fixing game name update logic to match new design

Author: ccmoralesj

src/pages/GameEditorPage.tsx

@@ -74,8 +74,7 @@ const GameEditorPage = function GameEditorPage({ editMode }: IProps) {
     getFieldProps,
     getFieldMeta,
     handleSubmit,
-    // dirty,
-    // isValid,
+    isValid,
     setValues,
   } = useFormik({
     initialValues: initialForm,
@@ -139,15 +138,21 @@ const GameEditorPage = function GameEditorPage({ editMode }: IProps) {
     return <SyncLoader />;
   }
 
-  // const isSubmitDisabled = !dirty || !isValid;
+  const handleEditButtonClick = () => {
+    if(isUpdatingGameName && isValid) {
+      handleSubmit()
+    } else {
+      setIsUpdatingGameName(true)
+    }
+  }
 
   return (
     <div>
       <h2 className="text-2xl font-bold italic font-sans mb-8">
         {editMode ? "UPDATE GAME" : "NEW GAME"}
       </h2>
       <div className="flex flex-wrap">
-        <form onSubmit={handleSubmit} className="py-10 mr-8">
+        <form className="py-10 mr-8">
           <div className="flex">
             <div>
               {isUpdatingGameName ? 
@@ -180,8 +185,7 @@ const GameEditorPage = function GameEditorPage({ editMode }: IProps) {
           </div>
 
           <div className="mt-4">
-            {/* FIX THIS LOGIC */}
-            <Button onClick={() => setIsUpdatingGameName(true)}>
+            <Button type="button" onClick={handleEditButtonClick}>
               {editMode ? "Update Game" : "Create Game"}
             </Button>
           </div>