Allow files in browser to be loaded, fix overflow on message list, show errors to user

src/app/file-tree/file-tree.component.ts

@@ -27,6 +27,7 @@ export interface FileOrFolder {
   name: string;
   children?: FileOrFolder[];
   path?: string;
+  browserFile?: File;
 }
 
 interface FileNode {
@@ -159,15 +160,27 @@ export class FileTreeComponent implements OnInit, OnDestroy {
               matchingChild = {
                 isDirectory: true,
                 name: relativePath,
+                path: file.webkitRelativePath,
                 children: [],
+                browserFile: file,
               };
               currentChildren?.push(matchingChild);
             }
             currentChildren = matchingChild.children;
           }
-          currentChildren?.push({ isDirectory: false, name: file.name });
+          currentChildren?.push({
+            isDirectory: false,
+            name: file.name,
+            path: file.webkitRelativePath,
+            browserFile: file,
+          });
         } else {
-          mappedFiles.push({ isDirectory: false, name: file.name });
+          mappedFiles.push({
+            isDirectory: false,
+            name: file.name,
+            path: file.webkitRelativePath,
+            browserFile: file,
+          });
         }
       }
       this.recursiveSort(mappedFiles);