Better validation for phone number in billing info

eboutic/schemas.py

@@ -1,6 +1,11 @@
+from typing import Annotated
+
 from ninja import ModelSchema, Schema
 from pydantic import Field, NonNegativeInt, PositiveInt, TypeAdapter
 
+# from phonenumber_field.phonenumber import PhoneNumber
+from pydantic_extra_types.phone_numbers import PhoneNumber, PhoneNumberValidator
+
 from counter.models import BillingInfo
 
 
@@ -35,4 +40,4 @@ class BillingInfoSchema(ModelSchema):
     # for reasons described in the model, BillingInfo.phone_number
     # in nullable, but null values shouldn't be actually allowed,
     # so we force the field to be required
-    phone_number: str
+    phone_number: Annotated[PhoneNumber, PhoneNumberValidator(default_region="FR")]

eboutic/static/eboutic/js/makecommand.js

@@ -42,7 +42,16 @@ document.addEventListener("alpine:init", () => {
             this.req_state = res.ok
                 ? BillingInfoReqState.SUCCESS
                 : BillingInfoReqState.FAILURE;
-            if (res.ok) {
+            if (res.status === 422) {
+                const errors = (await res.json())["detail"].map((err) => err["loc"]).flat();
+                Array.from(form.querySelectorAll("input"))
+                    .filter((elem) => errors.includes(elem.name))
+                    .forEach((elem) => {
+                        elem.setCustomValidity(gettext("Incorrect value"));
+                        elem.reportValidity();
+                        elem.oninput = () => elem.setCustomValidity("");
+                    });
+            } else if (res.ok) {
                 Alpine.store("billing_inputs").fill();
             }
         },

eboutic/views.py

@@ -144,7 +144,7 @@ class EbouticCommand(LoginRequiredMixin, TemplateView):
         elif default_billing_info.phone_number is None:
             kwargs["billing_infos_state"] = BillingInfoState.MISSING_PHONE_NUMBER
         else:
-            kwargs["billing_infos_state"] = BillingInfoState.EMPTY
+            kwargs["billing_infos_state"] = BillingInfoState.VALID
         if kwargs["billing_infos_state"] == BillingInfoState.VALID:
             # the user has already filled all of its billing_infos, thus we can
             # get it without expecting an error