fix(devtools): prod app detected screen

Do not call `getSupportedApis` in a prod app since it throws an error due to the absence of `ng`, which prevents the FE from getting the `ngAvailability` message and, respectively, the proper info screen that DevTools cannot be used on a prod app.

devtools/projects/ng-devtools-backend/src/lib/client-event-subscribers.ts

@@ -339,13 +339,15 @@ const checkForAngular = (messageBus: MessageBus<Events>): void => {
     initializeOrGetDirectiveForestHooks();
   }
 
+  const devMode = appIsAngularInDevMode();
+
   messageBus.emit('ngAvailability', [
     {
       version: ngVersion.toString(),
-      devMode: appIsAngularInDevMode(),
+      devMode,
       ivy: appIsIvy,
       hydration: isHydrationEnabled(),
-      supportedApis: getSupportedApis(),
+      supportedApis: devMode ? getSupportedApis() : null,
     },
   ]);
 };

devtools/projects/ng-devtools/src/lib/devtools.component.ts

@@ -100,7 +100,10 @@ export class DevToolsComponent implements OnDestroy {
       this.ivy.set(ivy);
       this._interval$.unsubscribe();
       this.hydration.set(hydration);
-      this.supportedApis.init(supportedApis);
+
+      if (supportedApis) {
+        this.supportedApis.init(supportedApis);
+      }
     });
   }
 

devtools/projects/protocol/src/lib/messages.ts

@@ -385,7 +385,7 @@ export interface Events {
     devMode: boolean;
     ivy: boolean;
     hydration: boolean;
-    supportedApis: SupportedApis;
+    supportedApis: SupportedApis | null;
   }) => void;
 
   inspectorStart: () => void;