feat: add multimodal search and granular performance diagnostics

apps/desktop/src/icons.ts

@@ -14,6 +14,10 @@ import arrowDown from "@fluentui/svg-icons/icons/arrow_down_16_regular.svg?raw";
 import open from "@fluentui/svg-icons/icons/open_20_regular.svg?raw";
 import chevron from "@fluentui/svg-icons/icons/chevron_down_16_regular.svg?raw";
 import sparkles from "@fluentui/svg-icons/icons/sparkle_20_regular.svg?raw";
+import image from "@fluentui/svg-icons/icons/image_24_regular.svg?raw";
+import video from "@fluentui/svg-icons/icons/video_24_regular.svg?raw";
+import audio from "@fluentui/svg-icons/icons/music_note_2_24_regular.svg?raw";
+import { mediaKind } from "./media-display";
 
 const assets = {
   search,
@@ -31,11 +35,16 @@ const assets = {
   open,
   chevron,
   sparkles,
+  image,
+  video,
+  audio,
 };
 export function icon(name: keyof typeof assets) {
   return `<span class="icon" aria-hidden="true">${assets[name]}</span>`;
 }
 export function fileIcon(filename: string) {
+  const media = mediaKind(filename);
+  if (media) return { html: icon(media), type: media };
   const extension = filename.split(".").pop()?.toLowerCase();
   if (extension === "pdf") return { html: icon("pdf"), type: "pdf" };
   if (