feat: add user profile management page to the dashboard with view, edit, password change, and avatar upload functionality.

Frontend-Learner/pages/dashboard/profile.vue

@@ -9,7 +9,7 @@ useHead({
 })
 
 const { currentUser, updateUserProfile, changePassword, uploadAvatar, sendVerifyEmail, fetchUserProfile } = useAuth()
-const { fetchAllCertificates, getLocalizedText } = useCourse()
+const { getLocalizedText } = useCourse()
 const { locale, t } = useI18n()
 
 
@@ -20,9 +20,7 @@ const isPasswordSaving = ref(false)
 const isSendingVerify = ref(false)
 const isHydrated = ref(false)
 
-// Certificates State
-const certificates = ref<any[]>([])
-const isLoadingCerts = ref(false)
+
 
 const formatDate = (dateString?: string) => {
   if (!dateString) return '-'
@@ -195,24 +193,10 @@ watch(() => currentUser.value, (newUser) => {
   }
 }, { deep: true })
 
-const loadCertificates = async () => {
-  isLoadingCerts.value = true
-  const res = await fetchAllCertificates()
-  if (res.success) {
-    certificates.value = res.data || []
-  }
-  isLoadingCerts.value = false
-}
 
-const viewCertificate = (url: string) => {
-  if (url) {
-    window.open(url, '_blank')
-  }
-}
 
 onMounted(async () => {
   await fetchUserProfile(true)
-  loadCertificates()
   isHydrated.value = true
 })
 </script>
@@ -292,34 +276,7 @@ onMounted(async () => {
         </div>
       </div>
 
-      <!-- Section: My Certificates -->
-      <div v-if="!isEditing && certificates.length > 0" class="mt-12 fade-in" style="animation-delay: 0.1s;">
-         <h2 class="text-2xl font-black mb-6 text-slate-900 dark:text-white flex items-center gap-3">
-           <q-icon name="workspace_premium" color="warning" size="32px" />
-           {{ $t('profile.myCertificates') }}
-         </h2>
-         <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
-            <div v-for="cert in certificates" :key="cert.certificate_id" class="card-premium p-6 hover:border-warning/50 transition-all group">
-               <div class="flex items-start justify-between mb-4">
-                  <div class="p-3 rounded-xl bg-orange-50 dark:bg-orange-900/10 text-orange-600 dark:text-orange-400">
-                     <q-icon name="card_membership" size="32px" />
-                  </div>
-                  <q-btn flat round color="primary" icon="download" @click="viewCertificate(cert.download_url)" class="opacity-0 group-hover:opacity-100 transition-opacity" />
-               </div>
-               <h3 class="font-bold text-slate-900 dark:text-white mb-1 line-clamp-1">{{ getLocalizedText(cert.course_title) }}</h3>
-               <p class="text-xs text-slate-500 dark:text-slate-400 mb-4 italic">{{ $t('profile.issuedAt') }}: {{ formatDate(cert.issued_at) }}</p>
-               <q-btn 
-                 unelevated 
-                 rounded 
-                 color="warning" 
-                 text-color="dark" 
-                 class="w-full font-bold" 
-                 :label="$t('profile.viewCertificate')" 
-                 @click="viewCertificate(cert.download_url)" 
-               />
-            </div>
-         </div>
-      </div>
+
 
       <div v-else class="grid grid-cols-1 lg:grid-cols-2 gap-8 fade-in">