diff --git a/src/app/components/chat/chats/chats.component.html b/src/app/components/chat/chats/chats.component.html
index 9048fc7..af8e298 100644
--- a/src/app/components/chat/chats/chats.component.html
+++ b/src/app/components/chat/chats/chats.component.html
@@ -25,20 +25,20 @@
                     <div class="flex items-center">
                         <div class="mr-1 flex cursor-pointer items-center" (click)="openProfile()">
                             <div class="h-10 w-10">
-                                @if (profile.picture) {
-                                <img class="h-full w-full rounded-full object-cover" [src]="profile.picture"
+                                @if (profile?.picture) {
+                                <img class="h-full w-full rounded-full object-cover" [src]="profile?.picture"
                                     onerror="this.onerror=null; this.src='/images/avatars/avatar-placeholder.png';"
                                     alt="Profile picture" />
                                 }
-                                @if (!profile.picture) {
+                                @if (!profile?.picture) {
                                 <div
                                     class="flex h-full w-full items-center justify-center rounded-full bg-gray-200 text-lg uppercase text-gray-600 dark:bg-gray-700 dark:text-gray-200">
-                                    {{ profile.name.charAt(0) }}
+                                    {{ profile?.name?.charAt(0) }}
                                 </div>
                                 }
                             </div>
                             <div class="ml-4 truncate font-medium">
-                                {{ profile.name }}
+                                {{ profile?.name }}
                             </div>
                         </div>
                         <button class="ml-auto" mat-icon-button (click)="openNewChat()">
@@ -123,15 +123,16 @@
                             }
                             <!-- If contact has a picture -->
                             <img *ngIf="chat.contact?.picture" class="h-full w-full rounded-full object-cover"
-                                [src]="chat.contact.picture"
-                                (error)="this.src='/images/avatars/avatar-placeholder.png';" alt="Contact picture" />
+                                [src]="chat.contact.picture" (error)="
+                                                this.src =
+                                                    '/images/avatars/avatar-placeholder.png'
+                                            " alt="Contact picture" />
 
                             <!-- If contact doesn't have a picture, display the first letter of the name -->
                             <div *ngIf="!chat.contact?.picture"
                                 class="flex h-full w-full items-center justify-center rounded-full bg-gray-200 text-lg uppercase text-gray-600 dark:bg-gray-700 dark:text-gray-200">
                                 {{ chat.contact?.name?.charAt(0) }}
                             </div>
-
                         </div>
                         <div class="ml-4 min-w-0">
                             <div class="truncate font-medium leading-5">
@@ -146,8 +147,8 @@
                             </div>
                         </div>
                         <div class="ml-auto flex flex-col items-end self-start pl-2">
-                            <div class="text-secondary text-sm leading-5 whitespace-nowrap overflow-hidden">
-                                {{ chat.lastMessageAt | ago}}
+                            <div class="text-secondary overflow-hidden whitespace-nowrap text-sm leading-5">
+                                {{ chat.lastMessageAt | ago }}
                             </div>
                             @if (chat.muted) {
                             <mat-icon class="text-hint icon-size-5" [svgIcon]="