DONE: merge heir tab into profile tab, santize userIcNum and name, rename to malay, add stat card on user list

fe/src/modules/user/pages/UserEdit.vue

@@ -20,6 +20,7 @@ import {
   SelectItemText,
 } from '@/components/ui/select'
 import { getApiErrorMessage } from '@/core/utils/getApiErrorMessage'
+import { sanitizeIcNumberInput, sanitizeNameInput } from '@/utils/form-input.utils'
 import { getUser, updateUser } from '../services/user.service'
 
 type SelectOption = { label: string; value: string }
@@ -121,6 +122,14 @@ const form = reactive({
   birth_place: '',
 })
 
+function handleNameInput() {
+  form.name = sanitizeNameInput(form.name)
+}
+
+function handleIcNumberInput() {
+  form.ic_number = sanitizeIcNumberInput(form.ic_number)
+}
+
 function toDateInputValue(value: string | null | undefined): string {
   if (!value) return ''
   return value.slice(0, 10)
@@ -239,7 +248,7 @@ onMounted(() => {
           <Field>
             <FieldLabel for="user-name">Nama</FieldLabel>
             <Input id="user-name" v-model="form.name" class="w-full" type="text" placeholder="Nama penuh"
-              :disabled="formDisabled" required />
+              :disabled="formDisabled" required @input="handleNameInput" />
           </Field>
 
           <Field>
@@ -251,8 +260,8 @@ onMounted(() => {
         <div class="grid grid-cols-1 gap-4 md:grid-cols-2">
           <Field>
             <FieldLabel for="user-ic">Nombor Kad Pengenalan</FieldLabel>
-            <Input id="user-ic" v-model="form.ic_number" class="w-full" type="text" placeholder="Nombor kad pengenalan"
-              :disabled="formDisabled" required />
+            <Input id="user-ic" v-model="form.ic_number" class="w-full" type="text" inputmode="numeric" maxlength="15"
+              placeholder="Contoh: 900101011234" :disabled="formDisabled" required @input="handleIcNumberInput" />
           </Field>
 
           <Field>