Add loading spinner back to stream just for engine connection, give it an error state (#6220)

* Add an engine error type for an "outage"

* Add a loading spinner back to the stream just for engine connection

* Refactor Loading spinner to account for early errors

* Add styling and state logic for unrecoverable errors in Loading

* Let engine error messages contain markdown

* Clarify 'too many connections' error message

* Add a "VeryLongLoadTime" error that suggests checking firewall

* Give the engine connection spinner a test ID and use it

src/lang/std/engineConnection.ts

@@ -67,6 +67,7 @@ export enum DisconnectingType {
 export enum ConnectionError {
   Unset = 0,
   LongLoadingTime,
+  VeryLongLoadingTime,
 
   ICENegotiate,
   DataChannelError,
@@ -78,6 +79,7 @@ export enum ConnectionError {
   MissingAuthToken,
   BadAuthToken,
   TooManyConnections,
+  Outage,
 
   // An unknown error is the most severe because it has not been classified
   // or encountered before.
@@ -88,6 +90,8 @@ export const CONNECTION_ERROR_TEXT: Record<ConnectionError, string> = {
   [ConnectionError.Unset]: '',
   [ConnectionError.LongLoadingTime]:
     'Loading is taking longer than expected...',
+  [ConnectionError.VeryLongLoadingTime]:
+    'Loading seems stuck. Do you have a firewall turned on?',
   [ConnectionError.ICENegotiate]: 'ICE negotiation failed.',
   [ConnectionError.DataChannelError]: 'The data channel signaled an error.',
   [ConnectionError.WebSocketError]: 'The websocket signaled an error.',
@@ -97,7 +101,10 @@ export const CONNECTION_ERROR_TEXT: Record<ConnectionError, string> = {
     'Your authorization token is missing; please login again.',
   [ConnectionError.BadAuthToken]:
     'Your authorization token is invalid; please login again.',
-  [ConnectionError.TooManyConnections]: 'There are too many connections.',
+  [ConnectionError.TooManyConnections]:
+    'There are too many open engine connections associated with your account.',
+  [ConnectionError.Outage]:
+    'We seem to be experiencing an outage. Please visit [status.zoo.dev](https://status.zoo.dev) for updates.',
   [ConnectionError.Unknown]:
     'An unexpected error occurred. Please report this to us.',
 }
@@ -1002,6 +1009,20 @@ class EngineConnection extends EventTarget {
               }
               this.disconnectAll()
             }
+
+            if (firstError.error_code === 'internal_api') {
+              this.state = {
+                type: EngineConnectionStateType.Disconnecting,
+                value: {
+                  type: DisconnectingType.Error,
+                  value: {
+                    error: ConnectionError.Outage,
+                    context: firstError.message,
+                  },
+                },
+              }
+              this.disconnectAll()
+            }
             return
           }