<script setup lang="ts">
import { Ref, ref } from 'vue';
// import Select from 'primevue/select';
import * as path from '@tauri-apps/api/path';
import OptionCategory from './OptionCategory.vue';
import PatchEntry from './PatchEntry.vue';
import { invoke } from '../invoke';
import { usePrfStore } from '../stores';
import { Patch } from '../types';
import { useI18n } from 'vue-i18n';

const { t } = useI18n();

const prf = usePrfStore();

prf.reload();

const gamePatches: Ref<Patch[] | null> = ref(null);
const amdPatches: Ref<Patch[] | null> = ref(null);

invoke('list_patches', { target: prf.current!.data.sgt.target }).then(
    (patches) => {
        gamePatches.value = patches as Patch[];
    }
);

(async () => {
    const amd = await path.join(
        prf.current!.data.sgt.target,
        '../amdaemon.exe'
    );
    amdPatches.value = (await invoke('list_patches', {
        target: amd,
    })) as Patch[];
})();
</script>

<template>
    <OptionCategory
        v-if="prf.current?.meta.game === 'chunithm'"
        title="chusanApp.exe"
        always-found
    >
        <PatchEntry
            v-if="gamePatches !== null"
            v-for="p in gamePatches"
            :patch="p"
        />
        <div v-if="gamePatches === null">{{ t('patch.loading') }}</div>
        <div v-if="gamePatches !== null && gamePatches.length === 0">
            {{ t('patch.noneFound') }}
        </div>
    </OptionCategory>
    <OptionCategory title="amdaemon.exe" always-found>
        <PatchEntry
            v-if="amdPatches !== null"
            v-for="p in amdPatches"
            :patch="p"
        />
        <div v-if="gamePatches === null">{{ t('patch.loading') }}</div>
        <div v-if="amdPatches !== null && amdPatches.length === 0">
            {{ t('patch.noneFound') }}
            <!-- <br />
            <Select
                class="mt-3"
                style="width: 400px"
                :options="[
                    {},
                    {},
                ]"
                :placeholder="t('patch.forceLoad')"
                size="small"
                option-label="title"
                option-value="value"
            ></Select> -->
        </div>
    </OptionCategory>
</template>
