Fix Sample Data checkbox of the Repo Create form (#8255)

treeverse · Oct 1, 2024 · 6772d17 · 6772d17
1 parent 484dd9d
commit 6772d17
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 18 deletions.
diff --git a/webui/src/lib/components/repositoryCreateForm.jsx b/webui/src/lib/components/repositoryCreateForm.jsx
@@ -8,26 +8,19 @@ import Accordion from "react-bootstrap/Accordion";
 const DEFAULT_BLOCKSTORE_EXAMPLE = "e.g. s3://example-bucket/";
 const DEFAULT_BLOCKSTORE_VALIDITY_REGEX = new RegExp(`^s3://`);
 
-export const RepositoryCreateForm = ({ id, config, onSubmit, formValid, setFormValid, error = null, sampleRepoChecked = false }) => {
+export const RepositoryCreateForm = ({ id, config, onSubmit, formValid, setFormValid, error = null }) => {
     const repoValidityRegex = /^[a-z0-9][a-z0-9-]{2,62}$/;
 
     const [repoValid, setRepoValid] = useState(null);
     const defaultNamespacePrefix = config.default_namespace_prefix
 
     const [storageNamespaceValid, setStorageNamespaceValid] = useState(defaultNamespacePrefix ? true : null);
     const [defaultBranchValid, setDefaultBranchValid] = useState(true);
-
+    const [addSampleData, setAddSampleData] = useState(false);
+
     const storageNamespaceField = useRef(null);
     const defaultBranchField = useRef(null);
     const repoNameField = useRef(null);
-    const sampleDataCheckbox = useRef(null);
-
-    useEffect(() => {
-        if (sampleDataCheckbox.current) {
-            sampleDataCheckbox.current.checked = sampleRepoChecked;
-        }
-    }, [sampleRepoChecked, sampleDataCheckbox.current]);
-
 
     const onRepoNameChange = () => {
         const isRepoValid = repoValidityRegex.test(repoNameField.current.value);
@@ -64,7 +57,10 @@ export const RepositoryCreateForm = ({ id, config, onSubmit, formValid, setFormV
 
     const sampleCheckbox = (
       <Form.Group controlId="sampleData" className="mt-3">
-          <Form.Check ref={sampleDataCheckbox} type="checkbox" label="Add sample data, hooks, and configuration" />
+          <Form.Check type="checkbox"
+                      label="Add sample data, hooks, and configuration"
+                      onChange={(ev) => setAddSampleData(ev.target.checked)}
+          />
       </Form.Group>
     );
 
@@ -154,7 +150,7 @@ export const RepositoryCreateForm = ({ id, config, onSubmit, formValid, setFormV
                 name: repoNameField.current.value,
                 storage_namespace: storageNamespaceField.current.value,
                 default_branch: defaultBranchField.current.value,
-                sample_data: sampleDataCheckbox.current.checked,
+                sample_data: addSampleData,
             });
         }}>
             <h4 className="mb-3">Create A New Repository</h4>

diff --git a/webui/src/pages/repositories/index.jsx b/webui/src/pages/repositories/index.jsx
@@ -50,7 +50,7 @@ const GettingStartedCreateRepoButton = ({text, variant = "success", enabled = fa
     );
 }
 
-const CreateRepositoryModal = ({show, error, onSubmit, onCancel, inProgress, samlpleRepoChecked = false }) => {
+const CreateRepositoryModal = ({show, error, onSubmit, onCancel, inProgress }) => {
 
   const [formValid, setFormValid] = useState(false);
 
@@ -79,7 +79,6 @@ const CreateRepositoryModal = ({show, error, onSubmit, onCancel, inProgress, sam
                   onSubmit={onSubmit}
                   onCancel={onCancel}
                   inProgress={inProgress}
-                  sampleRepoChecked={samlpleRepoChecked}
                 />
             </Modal.Body>
             <Modal.Footer>
@@ -186,7 +185,6 @@ const RepositoryList = ({ onPaginate, prefix, after, refresh, onCreateSampleRepo
 const RepositoriesPage = () => {
     const router = useRouter();
     const [showCreateRepositoryModal, setShowCreateRepositoryModal] = useState(false);
-    const [sampleRepoChecked, setSampleRepoChecked] = useState(false);
     const [createRepoError, setCreateRepoError] = useState(null);
     const [refresh, setRefresh] = useState(false);
     const [creatingRepo, setCreatingRepo] = useState(false);
@@ -222,7 +220,6 @@ const RepositoriesPage = () => {
     }, [setShowActionsBar]);
 
     const createRepositoryButtonCallback = useCallback(() => {
-        setSampleRepoChecked(false);
         setShowCreateRepositoryModal(true);
         setCreateRepoError(null);
     }, [showCreateRepositoryModal, setShowCreateRepositoryModal]);
@@ -240,7 +237,6 @@ const RepositoriesPage = () => {
             await createRepo(sampleRepo);
             return;
         }
-        setSampleRepoChecked(true);
         setShowCreateRepositoryModal(true);
         setCreateRepoError(null);
     }, [showCreateRepositoryModal, setShowCreateRepositoryModal, loading, err, response, createRepo]);
@@ -294,7 +290,6 @@ const RepositoriesPage = () => {
                 show={showCreateRepositoryModal}
                 error={createRepoError}
                 onSubmit={(repo) => createRepo(repo, true)}
-                samlpleRepoChecked={sampleRepoChecked}
                 inProgress={creatingRepo}
                 />