Move api call out of useEffect

hypothesis · Sep 23, 2021 · 196834c · 196834c
1 parent 53ded44
commit 196834c
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 16 deletions.
diff --git a/lms/static/scripts/frontend_apps/components/FilePickerApp.js b/lms/static/scripts/frontend_apps/components/FilePickerApp.js
@@ -93,11 +93,7 @@ export default function FilePickerApp({ onSubmit }) {
    * render.
    */
   const [shouldSubmit, setShouldSubmit] = useState(false);
-  const submit = useCallback(() => setShouldSubmit(true), []);
-
-  // Submit the form after a selection is made via one of the available
-  // methods.
-  useEffect(() => {
+  const submit = useCallback(() => {
     async function createAssignment() {
       const data = {
         ...createAssignmentAPI.data,
@@ -112,30 +108,37 @@ export default function FilePickerApp({ onSubmit }) {
         });
         setExtLTIAssignmentId(assignment.ext_lti_assignment_id);
       } catch (error) {
-        setErrorInfo({ title: 'Creating or editing an assignment', error: error });
+        setErrorInfo({
+          title: 'Creating or editing an assignment',
+          error: error,
+        });
       }
     }
-
     if (content && createAssignmentAPI && !extLTIAssignmentId) {
       createAssignment();
       return;
     }
 
-    if (shouldSubmit) {
-      // Submit form using a hidden button rather than calling `form.submit()`
-      // to facilitate observing the submission in tests and suppressing the
-      // actual submit.
-      submitButton.current.click();
-    }
+    setShouldSubmit(true);
   }, [
-    shouldSubmit,
-    extLTIAssignmentId,
     authToken,
     content,
     createAssignmentAPI,
+    extLTIAssignmentId,
     groupConfig.groupSet,
   ]);
 
+  // Submit the form after a selection is made via one of the available
+  // methods.
+  useEffect(() => {
+    if (shouldSubmit) {
+      // Submit form using a hidden button rather than calling `form.submit()`
+      // to facilitate observing the submission in tests and suppressing the
+      // actual submit.
+      submitButton.current.click();
+    }
+  }, [shouldSubmit]);
+
   /** @type {(c: Content) => void} */
   const selectContent = useCallback(
     content => {

diff --git a/lms/static/scripts/frontend_apps/components/test/FilePickerApp-test.js b/lms/static/scripts/frontend_apps/components/test/FilePickerApp-test.js
@@ -68,7 +68,6 @@ describe('FilePickerApp', () => {
     assert.deepEqual(formFields.props(), {
       children: [],
       content: expectedContent,
-      extLTIAssignmentId: expectedExtLTIAssignmentId,
       formFields: fakeConfig.filePicker.formFields,
       extLTIAssignmentId: expectedExtLTIAssignmentId,
       groupSet: expectedGroupSet,