fix: inicializar users/roles en Alpine y null-safety en loadRegister

- Declara users:[] y roles:[] en el estado inicial de Alpine para que
  x-for funcione reactivamente desde el primer render
- Agrega totalPages:0 al estado inicial
- Añade comprobación response.ok antes de parsear JSON
- Usa || [] y || 0 para evitar TypeError si el backend retorna error
- Reemplaza data.Users.length con this.users.length (siempre array)

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

resources/views/users.html

@@ -324,12 +324,13 @@
 
                 Id: null,
                 deleteId: null,
+                users: [],
+                roles: [],
                 loading: false,
-                totalRecords: 0, // Agregar esta línea
+                totalRecords: 0,
+                totalPages: 0,
                 isLoading: false,
 
-                roles: '',
-
                 init() {
                     this.loadRegister();
                 },
@@ -342,23 +343,22 @@
                     //this.loading = true;
                     const search = this.searchQuery ? `&search=${this.searchQuery}` : '';
                     fetch(`/app/loadusers?page=${page}${search}`)
-                        .then(response => response.json())
+                        .then(response => {
+                            if (!response.ok) throw new Error(`HTTP ${response.status}`);
+                            return response.json();
+                        })
                         .then(data => {
-                            this.totalRecords = data.total; // Establece el total de registros aquí
-                            this.users = data.Users; // Asignar
-                            this.roles = data.Roles;
-                            console.log(this.roles);
-
-                            this.totalPages = data.totalPages; // Asignar total de páginas
+                            this.totalRecords = data.total || 0;
+                            this.users = data.Users || [];
+                            this.roles = data.Roles || [];
+                            this.totalPages = data.totalPages || 0;
                             this.createPagination(this.totalPages, page);
-
-                            if (data.Users.length != 0) {
-                                // Lógica de paginación
-                                const totalPages = Math.ceil(this.totalRecords / data.limit);
-                                this.createPagination(totalPages, page)
+                            if (this.users.length > 0) {
+                                const totalPages = Math.ceil(this.totalRecords / (data.limit || 10));
+                                this.createPagination(totalPages, page);
                             }
                         })
-                        .catch(error => console.error('Error:', error))
+                        .catch(error => console.error('Error cargando usuarios:', error))
                         .finally(() => {
                             this.isLoading = false; // Ocultar el GIF de carga
                         });