How to list all the Users in a Blazor Webassembly hosted application with Identity?

I'm new to asp.net and Blazor Webassembly projects.

I created a Blazor Webassembly hosted project with identity. This has 3 main parts client, server, and shared. Currently I'm trying to get a list of all the registered users from the identity database which has been already created by default.

I created a razor component to view the users but failed to get the model class since it is in the server project. I also tried to move the ApplicationUser model class from the server to shared and installed the Identity NuGet package in shared but it resulted in an error(not supported by design).

Is there a sensible approach to list all the users available in the asp identity users, preserving the mvc model?

Thanks in advance.

Solution 1:

@Lilan... I have working code that displays a page listing Identity-Users (data). For our TM_PWA VS-2022 SOLUTION: .Net CORE-6, Blazor App-hosted-PWA:

In the Blazor-Client-project, NavMenu.razor

    <div class="nav-item px-3">
       <NavLink class="nav-link" href="identity/account/UserList">
          <span class="oi oi-list-rich" aria-hidden="true"></span> Identity User List 
       </NavLink>
    </div>

This code is in the Blazor-SERVER project.

HTML: UserList.cshtml in Areas/Identity/Pages/Account-folder

@page
@model UserListModel 
@{
   ViewData["Title"] = "User List";
 }

<h3>@ViewData["Title"]</h3>

<div class="row">
   <div class="col-md-12">
      @if (Model.UsersList != null) {
         <table class="table-md table-bordered col-1 w-100">
            <thead>
               <tr class="d-table-row my-0">
                  <td colspan="8"><span class="text-center font-bold" style="font-size: 14pt;">Identity User List</span></td>
               </tr>

               <tr class="text-center font-weight-bold">
                  <td class="text-center w-25">Id</td>
                  <td class="text-center">UserName</td>
                  <td class="text-center">Email Address</td>
                  <td class="text-center">EmailConfirmed</td>
                  <td class="text-center">PhoneNumber</td>
                  <td class="text-center">LockoutEnd</td>
                  <td class="text-center">LockoutEnabled</td>
                  <td class="text-center">AccessFailedCount</td>
               </tr>
            </thead>
            <tbody>
               @foreach (var userRec in (Model.UsersList)) {
                  <tr class="d-table-row my-0">
                     <td colspan="1" class="text-left" style="width: 30em;">@userRec.Id</td>
                     <td colspan="1" class="text-left">@userRec.UserName</td>
                     <td colspan="1" class="text-left">@userRec.Email</td>
                     <td colspan="1" class="text-center">@userRec.EmailConfirmed</td>
                     <td colspan="1" class="text-left">@userRec.PhoneNumber</td>
                     <td colspan="1" class="text-left">@userRec.LockoutEnd</td>
                     <td colspan="1" class="text-center">@userRec.LockoutEnabled</td>
                     <td colspan="1" class="text-center">@userRec.AccessFailedCount</td>
                  </tr>
               }
            </tbody>
         </table>
      }
   </div>
</div>


@section Scripts {
<partial name="_ValidationScriptsPartial" />
}

C# : UserList.cshtml.cs in Areas/Identity/Pages/Account-folder

// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
#nullable disable

using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Text.Encodings.Web;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Identity;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using TM_PWA.Server.Models;

namespace TM_PWA.Server.Areas.Identity.Pages.Account {
   public class UserListModel : PageModel {
      private readonly UserManager<ApplicationUser> _userManager;
      private readonly SignInManager<ApplicationUser> _signInManager;

      public UserListModel(
            UserManager<ApplicationUser> userManager,
            SignInManager<ApplicationUser> signInManager
         ) {
         _userManager = userManager;
         _signInManager = signInManager;
      }

      // Public properties ///////////////////////////////////////////////
      public List<ApplicationUser> UsersList { get; set; }

      // Functions ///////////////////////////////////////////////////////
      public IActionResult OnGet() {
         IQueryable<ApplicationUser> users = _userManager.Users;
         if (users == null) {
            return NotFound("Unable to load Identity users.");
         }

         UsersList= ((IQueryable<ApplicationUser>)users).ToList();
         return Page();
      }
   }
}