Add error handling to login and improve user profile

The login changes add try/catch error handling with a user-friendly
message, while the profile page now displays first and last names
separately. Also includes a fix for optional chaining in index.vue.

app/pages/Login.vue

@@ -123,11 +123,16 @@ const passwordRules = [
         "La contraseña debe tener al menos 5 caracteres",
 ];
 
+// TODO - cuando hace login cambiar el último login del usuario
 const login = async () => {
-    await signIn(
-        { username: "admin", password: "admin" },
-        { callbackUrl: "/" },
-    );
+    try {
+        await signIn(
+            { username: "admin", password: "admin" },
+            { callbackUrl: "/" },
+        );
+    } catch (error) {
+        alert("Ha ocurrido un error. Comprueba tus credenciales");
+    }
 };
 </script>
 

app/pages/index.vue

@@ -11,7 +11,7 @@
             <v-list-item
                 class="text-black ma-10 pa-5 rounded-lg"
                 :class="
-                    lista.owner == data.email
+                    lista.owner == data?.email
                         ? 'bg-green-lighten-2'
                         : 'bg-green-darken-1'
                 "

app/pages/profile.vue

@@ -36,7 +36,9 @@
             <h3>Username:</h3>
             <p>{{ data.username }}</p>
             <h3>Nombre:</h3>
-            <p>{{ data.name }} {{ data.last_name }}</p>
+            <p>{{ data.name }}</p>
+            <h3>Apellidos:</h3>
+            <p>{{ data.last_name }}</p>
             <h3>Correo:</h3>
             <p>{{ data.email }}</p>
             <h3>Listas:</h3>