Frontend S3 Improvements (#2018)

This adds the following changes:
- S3 icons have been changed to the database icon
- S3 icons always show up in green
- frontend crash errors are now wrapped within their block
- fileinfo errors have a special case view and display the error in the
modal

Author: oneirocosm

frontend/app/app.scss

@@ -72,11 +72,12 @@ a.plain-link {
 }
 
 .error-boundary {
+    white-space: pre-wrap;
     color: var(--error-color);
 }
 
 .error-color {
-	color: var(--error-color);
+    color: var(--error-color);
 }
 
 /* OverlayScrollbars styling */

frontend/app/modals/conntypeahead.tsx

@@ -127,12 +127,10 @@ function createS3SuggestionItems(
     // behavior
     return s3Profiles.map((profileName) => {
         const connStatus = connStatusMap.get(profileName);
-        const connColorNum = computeConnColorNum(connStatus);
         const item: SuggestionConnectionItem = {
             status: "connected",
-            icon: "arrow-right-arrow-left",
-            iconColor:
-                connStatus?.status == "connected" ? `var(--conn-icon-color-${connColorNum})` : "var(--grey-text-color)",
+            icon: "database",
+            iconColor: "var(--accent-color)",
             value: profileName,
             label: profileName,
             current: profileName == connection,

frontend/app/view/preview/preview.tsx

@@ -485,7 +485,11 @@ export class PreviewModel implements ViewModel {
         const fileName = fileInfo?.name;
         const connErr = getFn(this.connectionError);
         const editMode = getFn(this.editMode);
+        const genErr = getFn(this.errorMsgAtom);
 
+        if (!fileInfo) {
+            return { errorStr: `Load Error: ${genErr?.text}` };
+        }
         if (connErr != "") {
             return { errorStr: `Connection Error: ${connErr}` };
         }
@@ -1072,10 +1076,14 @@ function PreviewView({
     const filePath = useAtomValue(model.metaFilePath);
     const [errorMsg, setErrorMsg] = useAtom(model.errorMsgAtom);
     const connection = useAtomValue(model.connectionImmediate);
+    const fileInfo = useAtomValue(model.statFile);
 
     useEffect(() => {
+        if (!fileInfo) {
+            return;
+        }
         setErrorMsg(null);
-    }, [connection, filePath]);
+    }, [connection, filePath, fileInfo]);
 
     if (connStatus?.status != "connected") {
         return null;