fix: All vocab items now get turned into review cards

frontend/src/pages/review.tsx

@@ -67,22 +67,12 @@ const ReviewPageWithRouter = withRouter(
         private sm2_metadata: any = {};
         private score_delta = 0;
 
-        constructor(props: any) {
-            super(props);
-
+        componentDidMount() {
             // Hide the drawer button
             this.props.drawerButtonState(false);
 
-            const vocToQueue = () => {
-                this.vocab.forEach((vocab) => {
-                    vocabToReviewCard(vocab).forEach(this.reviewQueue.enqueue);
-                });
-                this.props.setReview(this.reviewQueue.dequeue(), {
-                    correct: 0,
-                    wrong: 0,
-                });
-                this.props.setLoading(false);
-            };
+            // Show a loading spinner
+            this.props.setLoading(true);
 
             // Get the correct vocabulary
             const { reviewType, vocabByLevel, levelId, vocabByQueue } = this.props;
@@ -101,8 +91,20 @@ const ReviewPageWithRouter = withRouter(
             }[reviewType];
 
             getVocab().then((res: IVocab[]) => {
+                // Stop the loading
+                this.props.setLoading(false);
                 this.vocab = res;
-                vocToQueue();
+
+                // Convert the vocab items into review queue cards
+                res.forEach(vocab => {
+                    vocabToReviewCard(vocab).forEach(this.reviewQueue.enqueue);
+                });
+
+                // Set the initial vocabulary card
+                this.props.setReview(this.reviewQueue.dequeue(), {
+                    correct: 0,
+                    wrong: 0,
+                });
             });
         }