feat: start checks

src/components/StartButton.vue

@@ -1,20 +1,52 @@
 <script setup lang="ts">
 import { Ref, computed, ref } from 'vue';
 import Button from 'primevue/button';
+import ConfirmDialog from 'primevue/confirmdialog';
+import ScrollPanel from 'primevue/scrollpanel';
+import { useConfirm } from 'primevue/useconfirm';
 import { listen } from '@tauri-apps/api/event';
 import { invoke } from '../invoke';
 import { usePrfStore } from '../stores';
 
 const prf = usePrfStore();
+const confirmDialog = useConfirm();
 
 type StartStatus = 'ready' | 'preparing' | 'running';
 const startStatus: Ref<StartStatus> = ref('ready');
 
-const startline = async () => {
+const startline = async (force: boolean) => {
     startStatus.value = 'preparing';
+
+    if (!force) {
+        const start_check: object[] = await invoke('start_check');
+        if (start_check.length > 0) {
+            const message = start_check.map((o) => {
+                if ('MissingRemotePackage' in o) {
+                    return `Package missing: ${o.MissingRemotePackage}`;
+                } else if ('MissingLocalPackage' in o) {
+                    return `Package missing: ${o.MissingLocalPackage}`;
+                } else if ('MissingDependency' in o) {
+                    return `Dependency missing: ${o.MissingDependency}`;
+                } else if ('MissingTool' in o) {
+                    return `Tool missing: ${o.MissingTool}`;
+                } else {
+                    return 'Unknown error';
+                }
+            });
+            confirmDialog.require({
+                message: message.join('\n'),
+                header: 'Start check failed',
+                accept: () => {
+                    startline(true);
+                },
+            });
+            startStatus.value = 'ready';
+            return;
+        }
+    }
     try {
         await invoke('startline');
-    } catch (e) {
+    } catch (_) {
         startStatus.value = 'ready';
     }
 };
@@ -44,9 +76,52 @@ listen('launch-start', () => {
 listen('launch-end', () => {
     startStatus.value = 'ready';
 });
+
+const messageSplit = (message: any) => {
+    return message.message?.split('\n');
+};
 </script>
 
 <template>
+    <ConfirmDialog>
+        <template #container="{ message, acceptCallback, rejectCallback }">
+            <div
+                class="flex flex-col p-8 bg-surface-0 dark:bg-surface-900 rounded"
+            >
+                <span class="font-bold self-center text-2xl block mb-2 mt-2">{{
+                    message.header
+                }}</span>
+                <ScrollPanel
+                    v-if="messageSplit(message).length > 5"
+                    style="width: 100%; height: 40vh"
+                >
+                    <p v-for="m in messageSplit(message)">
+                        {{ m }}
+                    </p></ScrollPanel
+                >
+                <div v-else>
+                    <p v-for="m in messageSplit(message)">
+                        {{ m }}
+                    </p>
+                </div>
+                <div class="flex self-center items-center gap-2 mt-6">
+                    <Button
+                        label="Run anyway"
+                        @click="acceptCallback"
+                        size="small"
+                        class="w-32"
+                    ></Button>
+                    <Button
+                        label="Cancel"
+                        outlined
+                        size="small"
+                        @click="rejectCallback"
+                        class="w-32"
+                    ></Button>
+                </div>
+            </div>
+        </template>
+    </ConfirmDialog>
     <Button
         v-if="startStatus === 'ready'"
         v-tooltip="disabledTooltip"
@@ -56,7 +131,7 @@ listen('launch-end', () => {
         aria-label="start"
         size="small"
         class="m-2.5"
-        @click="startline()"
+        @click="startline(false)"
     />
     <Button
         v-else-if="startStatus === 'preparing'"