Merge pull request #190 from Kleostro/fix/tu-02-62/carriage-styles

fix(tu-02-62): carriage styles

src/app/admin/components/carriage/carriage.component.html

@@ -19,10 +19,10 @@
       }
     </div>
 
-    <div class="car-bottom" [class]="!isInteractive() ? 'disabled' : ''">
+    <div class="car-bottom">
       <div class="seats">
         @if (seatsSchema(); as seatsSchema) {
-          <div class="right-seats">
+          <div class="right-seats" [class]="!isInteractive() ? 'disabled' : ''">
             <div class="left-line"></div>
             @for (rightRow of seatsSchema.rightSeats; let i = $index; track i) {
               <div class="right-seats-row">
@@ -44,11 +44,11 @@
             }
             <div class="right-line"></div>
           </div>
-          <div class="left-seats">
+          <div class="left-seats" [class]="!isInteractive() ? 'disabled' : ''">
             <div class="left-line"></div>
             @for (leftRow of seatsSchema.leftSeats; let i = $index; track i) {
               <div class="left-seats-row">
-                @for (leftSeat of leftRow; track leftSeat) {
+                @for (leftSeat of leftRow; let index = $index; track index) {
                   @let seatNumber = firstSeat() + leftSeat;
                   <app-seat
                     [classes]="['left', i === 0 ? 'first-seat' : '', isInteractive() ? 'interactive' : '']"

src/app/admin/components/carriage/carriage.component.scss

@@ -18,7 +18,7 @@
 
   max-width: 90dvw;
   min-height: 14rem;
-  padding: 0 2rem 1rem;
+  padding: 0.5rem 2rem;
 
   border: $three solid $gray-200;
   border-radius: 2rem;
@@ -29,11 +29,11 @@
   display: flex;
   flex-direction: column;
   gap: 3rem;
-  justify-content: center;
+  justify-content: space-around;
 
   width: 100%;
   max-height: 20rem;
-  padding-top: 1rem;
+  padding: 1rem 0;
 }
 
 .title {

src/app/admin/pages/route-detailed/route-detailed.component.ts

@@ -1,5 +1,5 @@
 import { ChangeDetectionStrategy, Component, inject, input, OnDestroy, OnInit, signal } from '@angular/core';
-import { RouterLink } from '@angular/router';
+import { Router, RouterLink } from '@angular/router';
 
 import { ButtonModule } from 'primeng/button';
 import { ProgressSpinnerModule } from 'primeng/progressspinner';
@@ -23,6 +23,7 @@ import { RidesListComponent } from '../../components/rides-list/rides-list.compo
 export class RouteDetailedComponent implements OnInit, OnDestroy {
   public routeService = inject(RideService);
   public stationsService = inject(StationsService);
+  private router = inject(Router);
   public id = input<string>('');
   public isOpenCreateRideForm = signal(false);
   public isDataLoaded = signal(false);
@@ -32,10 +33,14 @@ export class RouteDetailedComponent implements OnInit, OnDestroy {
     this.routeService.currentRouteInfo.set(null);
     this.subscribtion.add(
       this.stationsService.getStations().subscribe(() => {
-        this.routeService.getRouteById(+this.id()).subscribe(
-          // TBD: redirect to 404 if there is no route
-          () => this.isDataLoaded.set(true),
-        );
+        this.routeService.getRouteById(+this.id()).subscribe({
+          next: () => {
+            this.isDataLoaded.set(true);
+          },
+          error: () => {
+            this.router.navigate(['404']);
+          },
+        });
       }),
     );
   }

src/app/auth/services/auth-service/auth.service.ts

@@ -90,6 +90,8 @@ export class AuthService {
     this.isLoggedIn$$.set(true);
     if (userData.email === ADMIN_CREDENTIALS.email) {
       this.isAdmin$$.set(true);
+    } else {
+      this.isAdmin$$.set(false);
     }
   }
 

src/app/orders/components/orders-list/orders-list.component.ts

@@ -1,5 +1,5 @@
 import { NgTemplateOutlet } from '@angular/common';
-import { ChangeDetectionStrategy, Component, inject, Input, OnInit, signal } from '@angular/core';
+import { ChangeDetectionStrategy, Component, inject, Input, OnDestroy, OnInit, signal } from '@angular/core';
 
 import { PaginatorModule, PaginatorState } from 'primeng/paginator';
 
@@ -18,7 +18,7 @@ import { OrderComponent } from '../order/order.component';
   styleUrl: './orders-list.component.scss',
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class OrdersListComponent implements OnInit {
+export class OrdersListComponent implements OnInit, OnDestroy {
   @Input() public users!: User[];
 
   public userOrderService = inject(UserOrderService);
@@ -28,15 +28,20 @@ export class OrdersListComponent implements OnInit {
   public rowsCount = 10;
 
   public ngOnInit(): void {
-    this.orders.set(
-      this.userOrderService
-        .currentOrders$$()
-        .sort((a, b) => new Date(a.tripDepartureDate).getTime() - new Date(b.tripDepartureDate).getTime()),
-    );
+    this.userOrderService.createUserOrders();
+    const orders = this.userOrderService.currentOrders$$();
+    if (orders?.length) {
+      orders.sort((a, b) => new Date(a.tripDepartureDate).getTime() - new Date(b.tripDepartureDate).getTime());
+      this.orders.set(orders);
+    }
   }
 
   public onPageChange(event: PaginatorState): void {
     this.firstPage = event.first ?? 0;
     this.rowsCount = event.rows ?? 10;
   }
+
+  public ngOnDestroy(): void {
+    this.userOrderService.currentOrders$$.set(null);
+  }
 }

src/app/orders/pages/orders/orders.component.html

@@ -1,9 +1,11 @@
 @let users = ordersService.allUsers();
 
 <div class="wrapper">
-  @if (authService.isAdmin$$() && userOrderService.currentOrders$$().length) {
-    <app-orders-list [users]="users"></app-orders-list>
-  } @else {
-    <app-orders-list></app-orders-list>
+  @if (userOrderService.currentOrders$$(); as orders) {
+    @if (authService.isAdmin$$() && orders.length) {
+      <app-orders-list [users]="users"></app-orders-list>
+    } @else {
+      <app-orders-list></app-orders-list>
+    }
   }
 </div>

src/app/shared/services/data/userOrder/user-order.service.ts

@@ -20,7 +20,7 @@ export class UserOrderService {
   private tripCarriagesService = inject(TripCarriagesService);
 
   private currentOrders: UserOrder[] = [];
-  public currentOrders$$ = signal<UserOrder[]>([]);
+  public currentOrders$$ = signal<UserOrder[] | null>(null);
 
   public createUserOrders(): void {
     this.currentOrders = [];