Merge pull request #32 from ArielMAJ/release/0.6.1

Release/0.6.1

Author: ArielMAJ

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "finances-manager",
-  "version": "0.6.0",
+  "version": "0.6.1",
   "scripts": {
     "ng": "ng",
     "start": "ng serve",

package.json

@@ -1,17 +1,24 @@
 import { Component } from '@angular/core';
 import { Router } from '@angular/router';
+import { User } from '../../Models/User';
 import { FinancialTransactionService } from '../../services/financialTransaction.service';
 import { UserService } from '../../services/user.service';
-import { User } from '../../Models/User';
 
 @Component({
   selector: 'app-header',
   templateUrl: './header.component.html',
   styleUrl: './header.component.scss',
 })
 export class HeaderComponent {
-  currentUser!: User;
-  totalTransactionValue!: Number;
+  currentUser: User = {
+    id: 0,
+    name: '',
+    accountNumber: 0,
+    email: '',
+    createdAt: new Date(),
+    age: 0,
+  };
+  totalTransactionValue: Number = 0;
 
   constructor(
     private router: Router,
@@ -21,23 +28,12 @@ export class HeaderComponent {
   ) {}
 
   ngOnInit(): void {
-    this.currentUser = {
-      id: 0,
-      name: '',
-      accountNumber: 0,
-      email: '',
-      createdAt: new Date(),
-      age: 0,
-    } as User;
     this.userService.getCurrentUser().subscribe((data) => {
       this.currentUser = data;
     });
     this.financialTransactionService
       .getTotalTransactionValue()
-      .subscribe(
-        (value) =>
-          (this.totalTransactionValue = value)
-      );
+      .subscribe((value) => (this.totalTransactionValue = value));
   }
 
   logout() {

src/app/components/header/header.component.ts

@@ -15,7 +15,6 @@ h1 {
 }
 
 .dashboard-header {
-
   margin-top: 40px;
 }
 .search-bar {
@@ -63,7 +62,9 @@ tr:nth-child(odd) {
   border: none;
 }
 
-mat-card, .dashboard-header, .search-bar {
+mat-card,
+.dashboard-header,
+.search-bar {
   margin-right: auto;
   margin-left: auto;
   width: min(1000px, 90vw);
@@ -74,7 +75,6 @@ mat-card, .dashboard-header, .search-bar {
   display: flex;
   justify-content: center;
   margin: auto;
-
 }
 
 *::-webkit-scrollbar {
@@ -110,6 +110,8 @@ th,
 
 .description-cell {
   width: auto;
+  max-width: 40vw;
+  overflow-wrap: break-word;
 }
 
 .create-item-icon,
@@ -148,17 +150,27 @@ th,
     bottom: 38px;
     right: 28px;
   }
+
+  .description-cell {
+    max-width: 26vw;
+  }
 }
 
 @media (max-width: 432px) {
-  mat-card, table {
+  mat-card,
+  table {
     width: 90vw;
     margin: auto;
     padding: 0;
   }
 
-  mat-icon, .table-actions-cell {
+  mat-icon,
+  .table-actions-cell {
     margin: 0;
     padding: 0;
   }
+
+  .description-cell {
+    max-width: 23vw;
+  }
 }