refactor: Clean lint errors and organise files

toju-app/src/app/domains/authentication/feature/user-bar/user-bar.component.html

@@ -7,7 +7,7 @@
         class="relative flex items-center justify-center w-8 h-8 rounded-full bg-secondary text-foreground text-sm font-medium hover:bg-secondary/80 transition-colors"
         (click)="toggleProfileCard(avatarBtn)"
       >
-        {{ user()!.displayName?.charAt(0)?.toUpperCase() || '?' }}
+        {{ user()!.displayName.charAt(0).toUpperCase() || '?' }}
         <span
           class="absolute -bottom-0.5 -right-0.5 w-2.5 h-2.5 rounded-full border-2 border-card"
           [class]="currentStatusColor()"

toju-app/src/app/domains/chat/application/services/link-metadata.service.ts

@@ -12,7 +12,7 @@ export class LinkMetadataService {
   private readonly serverDirectory = inject(ServerDirectoryFacade);
 
   extractUrls(content: string): string[] {
-    return [...content.matchAll(URL_PATTERN)].map((m) => m[0]);
+    return [...content.matchAll(URL_PATTERN)].map((match) => match[0]);
   }
 
   async fetchMetadata(url: string): Promise<LinkMetadata> {

toju-app/src/app/domains/chat/feature/chat-messages/components/message-item/chat-link-embed/chat-link-embed.component.ts

@@ -5,7 +5,7 @@ import {
 } from '@angular/core';
 import { NgIcon, provideIcons } from '@ng-icons/core';
 import { lucideX } from '@ng-icons/lucide';
-import { LinkMetadata } from '../../../../../../shared-kernel';
+import { LinkMetadata } from '../../../../../../../shared-kernel';
 
 @Component({
   selector: 'app-chat-link-embed',

toju-app/src/app/domains/chat/feature/chat-messages/components/message-item/chat-message-item.component.ts

@@ -43,8 +43,8 @@ import {
   ProfileCardService,
   UserAvatarComponent
 } from '../../../../../../shared';
-import { ChatMessageMarkdownComponent } from './chat-message-markdown.component';
-import { ChatLinkEmbedComponent } from './chat-link-embed.component';
+import { ChatMessageMarkdownComponent } from './chat-message-markdown/chat-message-markdown.component';
+import { ChatLinkEmbedComponent } from './chat-link-embed/chat-link-embed.component';
 import {
   ChatMessageDeleteEvent,
   ChatMessageEditEvent,
@@ -155,7 +155,7 @@ export class ChatMessageItemComponent {
     const msg = this.message();
     // Look up full user from store
     const users = this.allUsers();
-    const found = users.find((u) => u.id === msg.senderId || u.oderId === msg.senderId);
+    const found = users.find((userEntry) => userEntry.id === msg.senderId || userEntry.oderId === msg.senderId);
     const user: User = found ?? {
       id: msg.senderId,
       oderId: msg.senderId,

toju-app/src/app/domains/chat/feature/chat-messages/components/message-item/chat-message-markdown/chat-message-markdown.component.ts

@@ -5,8 +5,8 @@ import remarkBreaks from 'remark-breaks';
 import remarkGfm from 'remark-gfm';
 import remarkParse from 'remark-parse';
 import { unified } from 'unified';
-import { ChatImageProxyFallbackDirective } from '../../../chat-image-proxy-fallback.directive';
-import { ChatYoutubeEmbedComponent, isYoutubeUrl } from './chat-youtube-embed.component';
+import { ChatImageProxyFallbackDirective } from '../../../../chat-image-proxy-fallback.directive';
+import { ChatYoutubeEmbedComponent, isYoutubeUrl } from '../chat-youtube-embed/chat-youtube-embed.component';
 
 const PRISM_LANGUAGE_ALIASES: Record<string, string> = {
   cs: 'csharp',

toju-app/src/app/domains/chat/feature/chat-messages/components/message-item/chat-youtube-embed/chat-youtube-embed.component.html

@@ -0,0 +1,11 @@
+@if (videoId()) {
+  <div class="mt-2 w-[480px] max-w-full overflow-hidden rounded-md border border-border/60">
+    <iframe
+      [src]="embedUrl()"
+      class="aspect-video w-full"
+      allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+      allowfullscreen
+      loading="lazy"
+    ></iframe>
+  </div>
+}

toju-app/src/app/domains/chat/feature/chat-messages/components/message-item/chat-youtube-embed/chat-youtube-embed.component.ts

@@ -1,6 +1,7 @@
 import {
   Component,
   computed,
+  inject,
   input
 } from '@angular/core';
 import { DomSanitizer } from '@angular/platform-browser';
@@ -10,19 +11,7 @@ const YOUTUBE_URL_PATTERN = /(?:youtube\.com\/(?:watch\?.*v=|embed\/|shorts\/)|y
 @Component({
   selector: 'app-chat-youtube-embed',
   standalone: true,
-  template: `
-    @if (videoId()) {
-      <div class="mt-2 w-[480px] max-w-full overflow-hidden rounded-md border border-border/60">
-        <iframe
-          [src]="embedUrl()"
-          class="aspect-video w-full"
-          allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
-          allowfullscreen
-          loading="lazy"
-        ></iframe>
-      </div>
-    }
-  `
+  templateUrl: './chat-youtube-embed.component.html'
 })
 export class ChatYoutubeEmbedComponent {
   readonly url = input.required<string>();
@@ -44,7 +33,7 @@ export class ChatYoutubeEmbedComponent {
     );
   });
 
-  constructor(private readonly sanitizer: DomSanitizer) {}
+  private readonly sanitizer = inject(DomSanitizer);
 }
 
 export function isYoutubeUrl(url?: string): boolean {

toju-app/src/app/domains/notifications/feature/settings/notifications-settings/notifications-settings.component.ts

@@ -13,9 +13,9 @@ import {
   lucideMessageSquareText,
   lucideMoonStar
 } from '@ng-icons/lucide';
-import { selectSavedRooms } from '../../../../store/rooms/rooms.selectors';
-import type { Room } from '../../../../shared-kernel';
-import { NotificationsFacade } from '../../application/facades/notifications.facade';
+import { selectSavedRooms } from '../../../../../store/rooms/rooms.selectors';
+import type { Room } from '../../../../../shared-kernel';
+import { NotificationsFacade } from '../../../application/facades/notifications.facade';
 
 @Component({
   selector: 'app-notifications-settings',

toju-app/src/app/domains/notifications/index.ts

@@ -1,3 +1,3 @@
 export * from './application/facades/notifications.facade';
 export * from './application/effects/notifications.effects';
-export { NotificationsSettingsComponent } from './feature/settings/notifications-settings.component';
+export { NotificationsSettingsComponent } from './feature/settings/notifications-settings/notifications-settings.component';

toju-app/src/app/domains/theme/feature/settings/theme-grid-editor/theme-grid-editor.component.ts

@@ -14,7 +14,7 @@ import {
   ThemeGridEditorItem,
   ThemeGridRect,
   ThemeLayoutContainerDefinition
-} from '../../domain/models/theme.model';
+} from '../../../domain/models/theme.model';
 
 type DragMode = 'move' | 'resize';
 

toju-app/src/app/domains/theme/feature/settings/theme-settings/theme-settings.component.ts

@@ -8,26 +8,26 @@ import {
 } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
-import { SettingsModalService } from '../../../../core/services/settings-modal.service';
+import { SettingsModalService } from '../../../../../core/services/settings-modal.service';
 import {
   ThemeContainerKey,
   ThemeElementStyleProperty,
   ThemeRegistryEntry
-} from '../../domain/models/theme.model';
+} from '../../../domain/models/theme.model';
 import {
   THEME_ANIMATION_FIELDS as THEME_ANIMATION_FIELD_HINTS,
   THEME_ELEMENT_STYLE_FIELDS,
   createAnimationStarterDefinition,
   getSuggestedFieldDefault
-} from '../../domain/logic/theme-schema.logic';
-import { ElementPickerService } from '../../application/services/element-picker.service';
-import { LayoutSyncService } from '../../application/services/layout-sync.service';
-import { ThemeLibraryService } from '../../application/services/theme-library.service';
-import { ThemeRegistryService } from '../../application/services/theme-registry.service';
-import { ThemeService } from '../../application/services/theme.service';
-import { THEME_LLM_GUIDE } from '../../domain/constants/theme-llm-guide.constants';
-import { ThemeGridEditorComponent } from './theme-grid-editor.component';
-import { ThemeJsonCodeEditorComponent } from './theme-json-code-editor.component';
+} from '../../../domain/logic/theme-schema.logic';
+import { ElementPickerService } from '../../../application/services/element-picker.service';
+import { LayoutSyncService } from '../../../application/services/layout-sync.service';
+import { ThemeLibraryService } from '../../../application/services/theme-library.service';
+import { ThemeRegistryService } from '../../../application/services/theme-registry.service';
+import { ThemeService } from '../../../application/services/theme.service';
+import { THEME_LLM_GUIDE } from '../../../domain/constants/theme-llm-guide.constants';
+import { ThemeGridEditorComponent } from '../theme-grid-editor/theme-grid-editor.component';
+import { ThemeJsonCodeEditorComponent } from '../theme-json-code-editor/theme-json-code-editor.component';
 
 type JumpSection = 'elements' | 'layout' | 'animations';
 type ThemeStudioWorkspace = 'editor' | 'inspector' | 'layout';

toju-app/src/app/domains/theme/feature/theme-picker-overlay/theme-picker-overlay.component.ts

@@ -5,8 +5,8 @@ import {
 } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
-import { ElementPickerService } from '../application/services/element-picker.service';
-import { ThemeRegistryService } from '../application/services/theme-registry.service';
+import { ElementPickerService } from '../../application/services/element-picker.service';
+import { ThemeRegistryService } from '../../application/services/theme-registry.service';
 
 @Component({
   selector: 'app-theme-picker-overlay',

toju-app/src/app/domains/theme/index.ts

@@ -10,4 +10,4 @@ export * from './domain/logic/theme-schema.logic';
 export * from './domain/logic/theme-validation.logic';
 
 export { ThemeNodeDirective } from './feature/theme-node.directive';
-export { ThemePickerOverlayComponent } from './feature/theme-picker-overlay.component';
+export { ThemePickerOverlayComponent } from './feature/theme-picker-overlay/theme-picker-overlay.component';

toju-app/src/app/domains/voice-session/application/services/voice-workspace.service.ts

@@ -52,16 +52,13 @@ export class VoiceWorkspaceService {
   readonly hasCustomMiniWindowPosition = computed(() => this._hasCustomMiniWindowPosition());
 
   constructor() {
-    effect(
-      () => {
-        if (this.voiceSession.voiceSession()) {
-          return;
-        }
+    effect(() => {
+      if (this.voiceSession.voiceSession()) {
+        return;
+      }
 
-        this.reset();
-      },
-      { allowSignalWrites: true }
-    );
+      this.reset();
+    });
   }
 
   open(

toju-app/src/app/domains/voice-session/feature/floating-voice-controls/floating-voice-controls.component.html

@@ -17,9 +17,11 @@
         />
         @if (voiceSession()?.serverIcon) {
           <img
-            [src]="voiceSession()?.serverIcon"
+            [ngSrc]="voiceSession()?.serverIcon || ''"
             class="w-5 h-5 rounded object-cover"
             alt=""
+            width="20"
+            height="20"
           />
         } @else {
           <div class="flex h-5 w-5 items-center justify-center rounded-sm bg-muted text-[10px] font-semibold">

toju-app/src/app/domains/voice-session/feature/floating-voice-controls/floating-voice-controls.component.ts

@@ -6,7 +6,7 @@ import {
   computed,
   OnInit
 } from '@angular/core';
-import { CommonModule } from '@angular/common';
+import { CommonModule, NgOptimizedImage } from '@angular/common';
 import { Store } from '@ngrx/store';
 import { NgIcon, provideIcons } from '@ng-icons/core';
 import {
@@ -34,6 +34,7 @@ import { ThemeNodeDirective } from '../../../../domains/theme';
   standalone: true,
   imports: [
     CommonModule,
+    NgOptimizedImage,
     NgIcon,
     DebugConsoleComponent,
     ScreenShareQualityDialogComponent,