File-type icon colors with Plain/Multi setting (multi default)

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

ui/src/app/file-panel/file-panel.html

@@ -227,11 +227,7 @@
       [class.ring-ring]="i === panel().cursor() && isActive()"
     >
       <div class="flex min-w-0 items-center gap-1.5 px-2">
-        <ng-icon
-          [name]="iconFor(entry)"
-          size="0.95rem"
-          [class]="entry.type === 'dir' ? 'shrink-0 text-primary' : 'shrink-0 text-muted-foreground'"
-        />
+        <ng-icon [name]="iconFor(entry)" size="0.95rem" [class]="iconClass(entry)" />
         <span class="truncate" [class.italic]="entry.type === 'symlink'">{{ entry.name }}</span>
       </div>
       <span class="px-2 text-right font-mono text-(length:--list-meta-font) tabular-nums text-muted-foreground">

ui/src/app/file-panel/file-panel.ts

@@ -13,8 +13,10 @@ import type { FileEntry, SavedConnection } from '@shared/types';
 import { ConnectionsService } from '../connections.service';
 import { DialogsService } from '../dialogs.service';
 import { FileActionsService } from '../file-actions.service';
+import { fileGlyph, fileIconClass } from '../file-icons';
 import { formatDate, formatSize } from '../format';
 import { PanelsService, type Side, type SortKey } from '../panels.service';
+import { SettingsService } from '../settings.service';
 import { TransfersService } from '../transfers.service';
 
 @Component({
@@ -31,6 +33,7 @@ export class FilePanel {
   readonly transfers = inject(TransfersService);
   readonly connections = inject(ConnectionsService);
   readonly dialogs = inject(DialogsService);
+  private readonly settings = inject(SettingsService);
   readonly panel = computed(() => this.panels.get(this.side()));
   readonly isActive = computed(() => this.panels.activeSide() === this.side());
   readonly isRemote = computed(() => this.panel().sessionId() !== 'local');
@@ -92,8 +95,11 @@ export class FilePanel {
   }
 
   iconFor(entry: FileEntry): string {
-    if (entry.name === '..') return 'mynaArrowUp';
-    return entry.type === 'dir' ? 'mynaFolder' : 'mynaFile';
+    return fileGlyph(entry, this.settings.iconColors() === 'multi');
+  }
+
+  iconClass(entry: FileEntry): string {
+    return fileIconClass(entry, this.settings.iconColors() === 'multi');
   }
 
   isSelected(entry: FileEntry): boolean {