From 77b5b0cab50a05dcb419ce87d74517d82e7cd2c0 Mon Sep 17 00:00:00 2001
From: Corentin Thomasset <corentin.thomasset74@gmail.com>
Date: Fri, 29 Jul 2022 15:49:28 +0200
Subject: [PATCH] refactor(validation): simplified validation system

---
 src/composable/validation.ts                         | 12 ++++++++++++
 .../base64-string-converter.vue                      |  6 +-----
 2 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/src/composable/validation.ts b/src/composable/validation.ts
index b27f2db8..fc008de8 100644
--- a/src/composable/validation.ts
+++ b/src/composable/validation.ts
@@ -20,15 +20,25 @@ export function isFalsyOrHasThrown(cb: () => ValidatorReturnType): boolean {
   }
 }
 
+type ValidationAttrs = {
+  feedback: string;
+  validationStatus: string | undefined;
+};
+
 export function useValidation<T>({ source, rules }: { source: Ref<T>; rules: UseValidationRule<T>[] }) {
   const state = reactive<{
     message: string;
     status: undefined | 'error';
     isValid: boolean;
+    attrs: ValidationAttrs;
   }>({
     message: '',
     status: undefined,
     isValid: false,
+    attrs: {
+      validationStatus: undefined,
+      feedback: '',
+    },
   });
 
   watch(
@@ -45,6 +55,8 @@ export function useValidation<T>({ source, rules }: { source: Ref<T>; rules: Use
       }
 
       state.isValid = state.status !== 'error';
+      state.attrs.feedback = state.message;
+      state.attrs.validationStatus = state.status;
     },
     { immediate: true },
   );
diff --git a/src/tools/base64-string-converter/base64-string-converter.vue b/src/tools/base64-string-converter/base64-string-converter.vue
index 2cba3170..46ff5e2a 100644
--- a/src/tools/base64-string-converter/base64-string-converter.vue
+++ b/src/tools/base64-string-converter/base64-string-converter.vue
@@ -20,11 +20,7 @@
   </n-card>
 
   <n-card title="Base64 to string">
-    <n-form-item
-      label="Base64 string to decode"
-      :validation-status="b64Validation.status"
-      :feedback="b64Validation.message"
-    >
+    <n-form-item label="Base64 string to decode" v-bind="b64Validation.attrs">
       <n-input v-model:value="base64Input" type="textarea" placeholder="Your base64 string..." rows="5" />
     </n-form-item>