<script setup lang="ts">
import { Ref, ref } from 'vue';
import Button from 'primevue/button';
import { invoke } from '@tauri-apps/api/core';
import { listen } from '@tauri-apps/api/event';

type StartStatus = 'ready' | 'preparing' | 'running';
const startStatus: Ref<StartStatus> = ref('ready');

const startline = async () => {
    startStatus.value = 'preparing';
    await invoke('startline');
};

const kill = async () => {
    await invoke('kill');
    startStatus.value = 'ready';
};

listen('launch-start', () => {
    startStatus.value = 'running';
});

listen('launch-end', () => {
    startStatus.value = 'ready';
});
</script>

<template>
    <Button
        v-if="startStatus === 'ready'"
        :disabled="false"
        icon="pi pi-play"
        label="START"
        aria-label="start"
        size="small"
        class="m-2.5"
        @click="startline()"
    />
    <Button
        v-else-if="startStatus === 'preparing'"
        disabled
        icon="pi pi-spin pi-spinner"
        label="START"
        aria-label="start"
        size="small"
        class="m-2.5"
    />
    <Button
        v-else
        :disabled="false"
        icon="pi pi-ban"
        label="STOP"
        aria-label="stop"
        size="small"
        class="m-2.5"
        @click="kill()"
    />
</template>
