Bump mobx-form-lite (#23)

kubk · Mar 14, 2024 · 8523b1c · 8523b1c
1 parent ec79946
commit 8523b1c
Show file tree

Hide file tree

Showing 5 changed files with 50 additions and 35 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -41,7 +41,7 @@
     "luxon": "^3.4.3",
     "mathml-tag-names": "^3.0.2",
     "mobx": "^6.10.2",
-    "mobx-form-lite": "^0.8.5",
+    "mobx-form-lite": "^0.9.1",
     "mobx-log": "^2.2.3",
     "mobx-persist-store": "^1.1.3",
     "mobx-react-lite": "^4.0.5",

diff --git a/src/screens/deck-form/store/deck-form-store.ts b/src/screens/deck-form/store/deck-form-store.ts
@@ -57,17 +57,23 @@ type DeckFormType = {
 };
 
 export const createDeckTitleField = (value: string) => {
-  return new TextField(value, validators.required(t("validation_deck_title")));
+  return new TextField(value, {
+    validate: validators.required(t("validation_deck_title")),
+  });
 };
 
 export const createCardSideField = (value: string) => {
-  return new TextField(value, validators.required(t("validation_required")));
+  return new TextField(value, {
+    validate: validators.required(t("validation_required")),
+  });
 };
 
 export const createAnswerForm = () => {
   return {
     id: v4(),
-    text: new TextField("", validators.required(t("validation_required"))),
+    text: new TextField("", {
+      validate: validators.required(t("validation_required")),
+    }),
     isCorrect: new BooleanField(false),
   };
 };
@@ -76,30 +82,33 @@ export const createAnswerListField = (
   answers: CardAnswerFormType[],
   getCardForm: () => CardFormType | null,
 ) => {
-  return new ListField<CardAnswerFormType>(answers, (value) => {
-    const cardForm = getCardForm();
+  return new ListField<CardAnswerFormType>(answers, {
+    validate: (value) => {
+      const cardForm = getCardForm();
 
-    if (!cardForm || cardForm.answerType.value !== "choice_single") {
-      return;
-    }
+      if (!cardForm || cardForm.answerType.value !== "choice_single") {
+        return;
+      }
 
-    if (value.length > 0) {
-      if (value.every((item) => !item.isCorrect.value)) {
-        return t("validation_answer_at_least_one_correct");
+      if (value.length > 0) {
+        if (value.every((item) => !item.isCorrect.value)) {
+          return t("validation_answer_at_least_one_correct");
+        }
       }
-    }
 
-    if (value.length === 0) {
-      return t("validation_at_least_one_answer_required");
-    }
+      if (value.length === 0) {
+        return t("validation_at_least_one_answer_required");
+      }
+    },
   });
 };
 
 export const createAnswerTypeField = (card?: DeckCardDbType) => {
   return new TextField<CardAnswerType>(
     card ? card.answer_type : userStore.defaultCardType,
-    undefined,
-    userStore.updateDefaultCardType,
+    {
+      onChangeCallback: userStore.updateDefaultCardType,
+    },
   );
 };
 

diff --git a/src/screens/folder-form/store/folder-form-store.ts b/src/screens/folder-form/store/folder-form-store.ts
@@ -19,14 +19,18 @@ import {
 import { DeckWithoutCardsDbType } from "../../../../functions/db/deck/decks-with-cards-schema.ts";
 
 const createFolderTitleField = (title: string) => {
-  return new TextField(title, validators.required(t("validation_required")));
+  return new TextField(title, {
+    validate: validators.required(t("validation_required")),
+  });
 };
 
 const createDecksField = (decks: Array<{ id: number; name: string }>) => {
-  return new ListField<{ id: number; name: string }>(decks, (value) => {
-    if (value.length === 0) {
-      return t("validation_at_least_one_deck");
-    }
+  return new ListField<{ id: number; name: string }>(decks, {
+    validate: (value) => {
+      if (value.length === 0) {
+        return t("validation_at_least_one_deck");
+      }
+    },
   });
 };
 

diff --git a/src/screens/share-deck/store/share-deck-form-store.ts b/src/screens/share-deck/store/share-deck-form-store.ts
@@ -42,15 +42,17 @@ export class ShareDeckFormStore {
       "accessDurationLimit",
     ),
     accessDurationLimitDays: persistableField(
-      new TextField("30", (value: unknown) => {
-        if (this.form.isAccessDuration.value) {
-          if (!value) {
-            return t("validation_required");
+      new TextField("30", {
+        validate: (value: unknown) => {
+          if (this.form.isAccessDuration.value) {
+            if (!value) {
+              return t("validation_required");
+            }
+            if (isNaN(Number(value)) || Number(value) < 1) {
+              return t("validation_number");
+            }
           }
-          if (isNaN(Number(value)) || Number(value) < 1) {
-            return t("validation_number");
-          }
-        }
+        },
       }),
       "accessDurationLimitDays",
     ),