Refactored disconnect watcher

htdocs/App.vue

@@ -9,8 +9,6 @@
 </template>
 
 <script>
-	import { watchEffect } from 'vue';
-
 	import Navbar from './Navbar.vue';
 	import Login from './Login.vue';
 	import RouteSchedule from './RouteSchedule.vue';
@@ -47,10 +45,7 @@
 					].forEach(route => this.$root.$router.addRoute(route));
 					await this.$root.$router.replace(this.$route);
 				}
-				if(value) {
+				if(value) this.heartbeat = await value.heartbeat();
-					this.heartbeat = await value.heartbeat();
-					var stop = watchEffect(() => { if(!value.connected.value) { stop(); this.client = this.server = this.user = null; } });
-				}
 			}
 		}
 	};

htdocs/Login.vue

@@ -2,8 +2,9 @@
 	<div class="accordion mb-3 shadow">
 		<div class="accordion-item">
 			<h2 class="accordion-header"><button class="accordion-button" :class="{ testing: (x_server) && (x_server.production) && (x_server.production != '1') }" type="button" @click="() => show = !show"><template v-if="user">{{user[2]}}<template v-if="server"> @ {{server.domain}}</template></template><template v-else>Login</template></button></h2>
-			<div class="accordion-collapse collapse" :class="{ show }">
+			<div class="accordion-collapse collapse" :class="{ show: (show) || (!x_client) }">
-				<div class="accordion-body">
+				<div class="accordion-body" v-if="!x_client"><button v-if="fail" class="btn btn-primary btn-lg" style="width: 100%;" @click="connect">Reconnect</button><button v-else class="btn btn-outline-primary btn-lg" style="width: 100%;" @click="connect">Connect</button></div>
+				<div class="accordion-body" v-else>
 					<div class="card">
 						<div class="card-body">
 							<p class="card-text row"><code class="col" v-if="banner"><pre>{{banner.join('\n')}}</pre></code><code class="col" v-if="user"><pre>{{user.join('\n')}}</pre></code></p>
@@ -44,6 +45,8 @@
 </style>
 
 <script>
+	import { watchEffect } from 'vue';
+
 	import vistax from './vistax.mjs';
 
 	export default {
@@ -73,6 +76,7 @@
 		data() {
 			return {
 				show: false,
+				fail: false,
 				x_client: this.client,
 				x_server: this.server,
 				x_user: this.user,
@@ -98,7 +102,7 @@
 				}, immediate: true
 			},
 			client(value) { this.x_client = value; },
-			x_client(value) { this.$emit('update:client', value); if(!value) this.connect(); },
+			x_client(value) { this.$emit('update:client', value); },
 			server(value) { this.x_server = value; },
 			x_server(value) { this.$emit('update:server', value); },
 			user(value) { this.x_user = value; },
@@ -107,7 +111,7 @@
 		methods: {
 			async connect() {
 				this.logout();
-				this.x_client = await (this.host ? vistax.Client.fromCookie(this.secret, this.host) : vistax.Client.fromCookie(this.secret));
+				if(this.x_client = await (this.host ? vistax.Client.fromCookie(this.secret, this.host) : vistax.Client.fromCookie(this.secret))) {
 					this.banner = await this.x_client.XUS_INTRO_MSG();
 					if((await this.x_client.userinfo()).result) try {
 						var user = await this.x_client.XUS_GET_USER_INFO();
@@ -120,6 +124,8 @@
 					this.$emit('update:server', this.x_server = (await this.x_client.serverinfo()).result);
 					console.log('Backend secret', this.secret);
 					console.log(this.banner);
+					var stop = watchEffect(() => { if(!this.x_client.connected.value) { stop(); this.x_client = this.x_server = this.x_user = null; this.fail = true; } });
+				} else this.fail = true;
 			},
 			async login(evt) {
 				if(this.x_client) {

htdocs/ViewData.vue

@@ -37,7 +37,7 @@
 	table.table-sticky tbody tr {
 		border-top: 1px dashed #dee2e6;
 	}
-	table.table-sticky td:nth-of-type(odd) {
+	td:nth-of-type(odd) {
 		background-color: rgba(0, 0, 0, 0.05);
 	}
 	table.table-sticky tbody th, table.table-sticky th.name {

main.py

@@ -53,6 +53,7 @@ def application():
 	@app.post('/v1/vista')
 	def cb_connect():
 		params = request.json['params']
+		try:
 			if params.get('secret') == secret:
 				cid = ''.join(secrets.choice(string.ascii_lowercase + string.digits) for i in range(64))
 				while cid in clients:
@@ -61,6 +62,9 @@ def application():
 				return jsonify({ 'result': cid, 'error': None, 'id': request.json.get('id') })
 			else:
 				return jsonify({ 'result': None, 'error': { 'type': 'Unauthorized', 'args': [] }, 'id': request.json.get('id') })
+		except Exception as ex:
+			logger.exception(request.url)
+			return jsonify({ 'result': None, 'error': { 'type': ex.__class__.__name__, 'args': ex.args }, 'id': request.json.get('id') })
 
 	@app.post('/v1/vista/<cid>/close')
 	def cb_close(cid):