user module init

src/app/app.routes.ts

@@ -11,6 +11,11 @@ export const routes: Routes = [
     loadChildren: () => import('./chat/chat.module').then(m => m.ChatModule),
     canActivate: [IsLoggedInCanActivate]
   },
+  {
+    path: 'user',
+    loadChildren: () => import('./user/user.module').then(m => m.UserModule),
+    canActivate: [IsLoggedInCanActivate]
+  },
   { path: '', redirectTo: 'chat', pathMatch: 'full' },
-  { path: '**/*', redirectTo: '', pathMatch: 'full' }
+  { path: '**', redirectTo: 'chat', pathMatch: 'full' }
 ];

src/app/auth/auth-routing.module.ts

@@ -6,7 +6,8 @@ import { RegisterComponent } from './register/register.component';
 const routes: Routes = [
   { path: 'login', component: LoginComponent },
   { path: 'register', component: RegisterComponent },
-  { path: '', redirectTo: 'login', pathMatch: 'full' }
+  { path: '', redirectTo: 'login', pathMatch: 'full' },
+  { path: '**', redirectTo: 'login', pathMatch: "full" }
 ];
 
 @NgModule({

src/app/chat/chat-routing.module.ts

@@ -4,6 +4,7 @@ import { ChatComponent } from './chat/chat.component';
 
 const routes: Routes = [
   { path: '', component: ChatComponent },
+  { path: '**', redirectTo: '', pathMatch: "full" }
 ];
 
 @NgModule({

src/app/services/auth.service.ts

@@ -13,6 +13,7 @@ export class AuthService {
   private readonly USERNAME_FIELD: string = "username";
   private readonly PASSWORD_FIELD: string = "password";
   private readonly REPEAT_PASSWORD_FIELD: string = "repeatPassword";
+  private readonly LOCAL_USERNAME: string = "last_username";
 
   private loggedIn: boolean = false;
 
@@ -25,7 +26,9 @@ export class AuthService {
     formData.append(this.USERNAME_FIELD, username);
     formData.append(this.PASSWORD_FIELD, password);
 
-    return this.http.post<LoginResponse>(url, formData, { withCredentials: true })
+    localStorage.setItem(this.LOCAL_USERNAME, username);
+
+    return this.http.post<LoginResponse>(url, formData, { withCredentials: true });
   }
 
   public Register(username: string, password: string, repeatPassword: string): Observable<RegisterResponse> {
@@ -42,6 +45,8 @@ export class AuthService {
   public Logout(): Observable<boolean> {
     let url = `${environment.apiBase}/auth/logout`;
 
+    localStorage.removeItem(this.LOCAL_USERNAME);
+
     return this.http.get(url, { withCredentials: true }).pipe(
       map(() => true),
       catchError(() => of(false))
@@ -70,6 +75,11 @@ export class AuthService {
   }
 
   public IsLoggedIn(): boolean { return this.loggedIn; }
+  public GetUsername(): string {
+    let username = localStorage.getItem(this.LOCAL_USERNAME)
+    if (username) return username;
+    else throw new Error("not logged in");
+  }
 }
 
 export const IsLoggedInCanActivate: CanActivateFn = (
@@ -89,4 +99,19 @@ export const IsLoggedInCanActivate: CanActivateFn = (
       }
     })
   );
+};
+
+export const UsernameResolver: CanActivateFn = (
+  route: ActivatedRouteSnapshot,
+  __: RouterStateSnapshot
+): boolean => {
+  const authService = inject(AuthService);
+  const router = inject(Router);
+  try {
+    router.navigateByUrl(`user/${authService.GetUsername()}`);
+  } catch (err) {
+    console.log(err);
+    router.navigateByUrl("auth/login");
+  }
+  return false;
 };

src/app/user/user-routing.module.ts

@@ -0,0 +1,19 @@
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { UserComponent } from './user/user.component';
+import { UsernameResolver } from '../services/auth.service';
+
+const routes: Routes = [
+  {
+    path: ':username', component: UserComponent
+  },
+  {
+    path: '', canActivate: [UsernameResolver], component: UserComponent, pathMatch: "full"
+  },
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule]
+})
+export class UserRoutingModule { }

src/app/user/user.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+import { UserRoutingModule } from './user-routing.module';
+import { UserComponent } from './user/user.component';
+
+
+@NgModule({
+  declarations: [
+    UserComponent
+  ],
+  imports: [
+    CommonModule,
+    UserRoutingModule
+  ]
+})
+export class UserModule { }

src/app/user/user/user.component.html

@@ -0,0 +1 @@
+<p>{{username}}</p>

src/app/user/user/user.component.ts

@@ -0,0 +1,18 @@
+import { Component } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+
+@Component({
+  selector: 'app-user',
+  standalone: false,
+  templateUrl: './user.component.html',
+  styleUrl: './user.component.scss'
+})
+export class UserComponent {
+  public username!: string;
+
+  constructor(private route: ActivatedRoute) {
+    this.route.paramMap.subscribe(params => {
+      this.username = params.get('username')!;
+    });
+  }
+}