From e07a31cd0be4f584a00f662731c8e86de2add76b Mon Sep 17 00:00:00 2001
From: Sam <sam@samr1.net>
Date: Sat, 6 Jan 2024 15:44:00 +0100
Subject: [PATCH] Client - fix checkbox style when unchecked on privacy policy
 validation

---
 .../User/ProfileEdition/UserPrivacyPolicyValidation.vue    | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/fittrackee_client/src/components/User/ProfileEdition/UserPrivacyPolicyValidation.vue b/fittrackee_client/src/components/User/ProfileEdition/UserPrivacyPolicyValidation.vue
index d725d638..84d1b77e 100644
--- a/fittrackee_client/src/components/User/ProfileEdition/UserPrivacyPolicyValidation.vue
+++ b/fittrackee_client/src/components/User/ProfileEdition/UserPrivacyPolicyValidation.vue
@@ -13,7 +13,7 @@
         {{ $t('user.PROFILE.BACK_TO_PROFILE') }}
       </button>
     </div>
-    <form v-else @submit.prevent="onSubmit()">
+    <form v-else :class="{ errors: formErrors }" @submit.prevent="onSubmit()">
       <div class="policy-content">
         <PrivacyPolicy />
       </div>
@@ -23,6 +23,7 @@
           id="accepted_policy"
           required
           v-model="acceptedPolicy"
+          @invalid="invalidateForm"
         />
         <span>
           <i18n-t keypath="user.READ_AND_ACCEPT_PRIVACY_POLICY">
@@ -66,6 +67,7 @@
     () => store.getters[ROOT_STORE.GETTERS.ERROR_MESSAGES]
   )
   const acceptedPolicy = ref(false)
+  const formErrors = ref(false)
 
   function onSubmit() {
     store.dispatch(
@@ -73,6 +75,9 @@
       acceptedPolicy.value
     )
   }
+  function invalidateForm() {
+    formErrors.value = true
+  }
 
   onUnmounted(() => {
     store.commit(ROOT_STORE.MUTATIONS.EMPTY_ERROR_MESSAGES)