AI-Assisted-Smart-Data-Entry-PoC/ai-data-entry-ui/src/app/components/user-selection/user-selection.component.html

<div class="selection-container">
  <div class="glass-card">
    <header>
      <h1>Internal Claims Portal</h1>
      <p>Select your profile to continue to the intelligence dashboard</p>
    </header>

    <div *ngIf="isLoading" class="loading-state">
       <div class="spinner"></div>
       <p>Fetching secure profiles...</p>
    </div>

    <div *ngIf="!isLoading" class="user-grid">
      <div *ngFor="let user of users" class="user-card" (click)="selectUser(user)">
        <div class="avatar">{{ user.name[0] }}</div>
        <div class="info">
          <span class="name">{{ user.name }}</span>
          <span class="dept">{{ user.department }}</span>
        </div>
      </div>
    </div>
    
    <div *ngIf="!isLoading && users.length === 0" class="empty-state">
      <p>No profiles found. Database initialization required.</p>
    </div>
  </div>
</div>