From 5e4439b905aa2e40bcfdf353014fc533d6074dc2 Mon Sep 17 00:00:00 2001
From: Chenlei Hu <huchenlei@proton.me>
Date: Wed, 6 Nov 2024 19:39:09 -0500
Subject: [PATCH] [Electron] Add electron-specific setup page (#1444)

* Add dummy server start view

* Do external nav

* nit

* nit

* nit

* nit
---
 src/router.ts                 | 25 +++++++++++++++++++++++--
 src/utils/envUtil.ts          |  3 +++
 src/views/ServerStartView.vue | 17 +++++++++++++++++
 3 files changed, 43 insertions(+), 2 deletions(-)
 create mode 100644 src/utils/envUtil.ts
 create mode 100644 src/views/ServerStartView.vue

diff --git a/src/router.ts b/src/router.ts
index 56a61cf9f..dd69f0953 100644
--- a/src/router.ts
+++ b/src/router.ts
@@ -1,8 +1,15 @@
-import { createRouter, createWebHistory } from 'vue-router'
+import {
+  createRouter,
+  createWebHashHistory,
+  createWebHistory
+} from 'vue-router'
 import LayoutDefault from '@/views/layouts/LayoutDefault.vue'
+import { isElectron } from './utils/envUtil'
+
+const isFileProtocol = () => window.location.protocol === 'file:'
 
 const router = createRouter({
-  history: createWebHistory(window.location.pathname),
+  history: isFileProtocol() ? createWebHashHistory() : createWebHistory(),
   routes: [
     {
       path: '/',
@@ -10,7 +17,21 @@ const router = createRouter({
       children: [
         {
           path: '',
+          name: 'GraphView',
           component: () => import('@/views/GraphView.vue')
+        },
+        {
+          path: 'server-start',
+          name: 'ServerStartView',
+          component: () => import('@/views/ServerStartView.vue'),
+          beforeEnter: async (to, from, next) => {
+            // Only allow access to this page in electron environment
+            if (isElectron()) {
+              next()
+            } else {
+              next('/')
+            }
+          }
         }
       ]
     }
diff --git a/src/utils/envUtil.ts b/src/utils/envUtil.ts
new file mode 100644
index 000000000..4386dccd8
--- /dev/null
+++ b/src/utils/envUtil.ts
@@ -0,0 +1,3 @@
+export function isElectron() {
+  return 'electronAPI' in window && window['electronAPI'] !== undefined
+}
diff --git a/src/views/ServerStartView.vue b/src/views/ServerStartView.vue
new file mode 100644
index 000000000..c35fbf094
--- /dev/null
+++ b/src/views/ServerStartView.vue
@@ -0,0 +1,17 @@
+<!-- This is a dummy page built for electron app only. -->
+<!-- Replace this page with the electron side logic on installation & log streaming. -->
+<template>
+  <div
+    class="absolute inset-0 flex flex-col items-center justify-center h-screen bg-surface-0"
+  >
+    <ProgressSpinner class="w-16 h-16 mb-4" />
+    <div class="text-xl">{{ $t('loading') }}{{ counter }}</div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import ProgressSpinner from 'primevue/progressspinner'
+import { useInterval } from '@vueuse/core'
+
+const counter = useInterval(1000)
+</script>