feat(game-stream): tell user when game is disconnected

Author: KatoakDR

electron/renderer/pages/game.tsx

@@ -1,4 +1,3 @@
-import { useEuiTheme } from '@elastic/eui';
 import isEmpty from 'lodash-es/isEmpty.js';
 import { useObservable } from 'observable-hooks';
 import type { ReactNode } from 'react';
@@ -44,7 +43,6 @@ const GamePage: React.FC = (): ReactNode => {
   // TODO load the grid config items
   // TODO load the grid layout items
 
-  const { euiTheme } = useEuiTheme();
   const { colorMode } = useTheme();
 
   const mainStreamId = getGameItemInfo(GameItemId.MAIN).streamId;
@@ -240,6 +238,18 @@ const GamePage: React.FC = (): ReactNode => {
     });
   });
 
+  useSubscribe(['game:disconnect'], () => {
+    gameLogLineSubject$.next({
+      eventId: uuid(),
+      streamId: mainStreamId,
+      styles: {
+        colorMode,
+        subdued: true,
+      },
+      text: `> GAME DISCONNECTED`,
+    });
+  });
+
   const contentItems = useMemo<Array<GridItemContent>>(() => {
     // TODO define a default config set
     // TODO allow users to customize the config, and add/remove items