Refactor and code designing

src/app/features/auth/login/login.component.ts

@@ -8,8 +8,9 @@ import { lucideLogIn } from '@ng-icons/lucide';
 
 import { AuthService } from '../../../core/services/auth.service';
 import { ServerDirectoryService } from '../../../core/services/server-directory.service';
-import * as UsersActions from '../../../store/users/users.actions';
+import { UsersActions } from '../../../store/users/users.actions';
 import { User } from '../../../core/models';
+import { STORAGE_KEY_CURRENT_USER_ID } from '../../../core/constants';
 
 @Component({
   selector: 'app-login',
@@ -18,6 +19,9 @@ import { User } from '../../../core/models';
   viewProviders: [provideIcons({ lucideLogIn })],
   templateUrl: './login.component.html',
 })
+/**
+ * Login form allowing existing users to authenticate against a selected server.
+ */
 export class LoginComponent {
   private auth = inject(AuthService);
   private serversSvc = inject(ServerDirectoryService);
@@ -30,8 +34,10 @@ export class LoginComponent {
   serverId: string | undefined = this.serversSvc.activeServer()?.id;
   error = signal<string | null>(null);
 
+  /** TrackBy function for server list rendering. */
   trackById(_index: number, item: { id: string }) { return item.id; }
 
+  /** Validate and submit the login form, then navigate to search on success. */
   submit() {
     this.error.set(null);
     const sid = this.serverId || this.serversSvc.activeServer()?.id;
@@ -47,7 +53,7 @@ export class LoginComponent {
           role: 'member',
           joinedAt: Date.now(),
         };
-        try { localStorage.setItem('metoyou_currentUserId', resp.id); } catch {}
+        try { localStorage.setItem(STORAGE_KEY_CURRENT_USER_ID, resp.id); } catch {}
         this.store.dispatch(UsersActions.setCurrentUser({ user }));
         this.router.navigate(['/search']);
       },
@@ -57,6 +63,7 @@ export class LoginComponent {
     });
   }
 
+  /** Navigate to the registration page. */
   goRegister() {
     this.router.navigate(['/register']);
   }