サーバーから切断されましたのダイアログは時間をおいて表示するように (#5916)

* timeout disconnect dialog

* 70ms

* 150ms

2 files changed, 11 insertions, 7 deletions

diff --git a/src/client/app.vue b/src/client/app.vue
index 32283bd20c..7b4796d747 100644
--- a/src/client/app.vue
+++ b/src/client/app.vue
@@ -247,11 +247,15 @@ export default Vue.extend({
 		}
 
 		this.$root.stream.on('_disconnected_', () => {
-			if (!this.disconnectedDialog) {
-				if (this.$store.state.device.autoReload) {
-					location.reload();
-					return;
-				}
+			if (this.disconnectedDialog) return;
+			if (this.$store.state.device.autoReload) {
+				location.reload();
+				return;
+			}
+
+			setTimeout(() => {
+				if (this.$root.stream.state !== 'reconnecting') return;
+
 				this.disconnectedDialog = this.$root.dialog({
 					type: 'warning',
 					showCancelButton: true,
@@ -263,7 +267,7 @@ export default Vue.extend({
 					}
 					this.disconnectedDialog = null;
 				});
-			}
+			}, 150)
 		});
 	},
 
diff --git a/src/client/scripts/stream.ts b/src/client/scripts/stream.ts
index 7f0e1280b6..18bb7c13df 100644
--- a/src/client/scripts/stream.ts
+++ b/src/client/scripts/stream.ts
@@ -9,7 +9,7 @@ import MiOS from '../mios';
  */
 export default class Stream extends EventEmitter {
 	private stream: ReconnectingWebsocket;
-	public state: string;
+	public state: 'initializing' | 'reconnecting' | 'connected';
 	private sharedConnectionPools: Pool[] = [];
 	private sharedConnections: SharedConnection[] = [];
 	private nonSharedConnections: NonSharedConnection[] = [];