forked from didirus/AstralRinth
* New purchase flow for servers, region selector, etc. * Lint * Lint * Fix expanding total
96 lines
2.8 KiB
Vue
96 lines
2.8 KiB
Vue
<template>
|
|
<div class="flex w-full flex-col gap-1 rounded-2xl bg-table-alternateRow p-2">
|
|
<div
|
|
v-for="loader in vanillaLoaders"
|
|
:key="loader.name"
|
|
class="group relative flex items-center justify-between rounded-2xl p-2 pr-2.5 hover:bg-bg"
|
|
>
|
|
<UiServersLoaderSelectorCard
|
|
:loader="loader"
|
|
:is-current="isCurrentLoader(loader.name)"
|
|
:loader-version="data.loader_version"
|
|
:current-loader="data.loader"
|
|
:is-installing="isInstalling"
|
|
@select="selectLoader"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt-4">
|
|
<h2 class="mb-2 px-2 text-lg font-bold text-contrast">Mod loaders</h2>
|
|
<div class="flex w-full flex-col gap-1 rounded-2xl bg-table-alternateRow p-2">
|
|
<div
|
|
v-for="loader in modLoaders"
|
|
:key="loader.name"
|
|
class="group relative flex items-center justify-between rounded-2xl p-2 pr-2.5 hover:bg-bg"
|
|
>
|
|
<UiServersLoaderSelectorCard
|
|
:loader="loader"
|
|
:is-current="isCurrentLoader(loader.name)"
|
|
:loader-version="data.loader_version"
|
|
:current-loader="data.loader"
|
|
:is-installing="isInstalling"
|
|
@select="selectLoader"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt-4">
|
|
<h2 class="mb-2 px-2 text-lg font-bold text-contrast">Plugin loaders</h2>
|
|
<div class="flex w-full flex-col gap-1 rounded-2xl bg-table-alternateRow p-2">
|
|
<div
|
|
v-for="loader in pluginLoaders"
|
|
:key="loader.name"
|
|
class="group relative flex items-center justify-between rounded-2xl p-2 pr-2.5 hover:bg-bg"
|
|
>
|
|
<UiServersLoaderSelectorCard
|
|
:loader="loader"
|
|
:is-current="isCurrentLoader(loader.name)"
|
|
:loader-version="data.loader_version"
|
|
:current-loader="data.loader"
|
|
:is-installing="isInstalling"
|
|
@select="selectLoader"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
const props = defineProps<{
|
|
data: {
|
|
loader: string | null;
|
|
loader_version: string | null;
|
|
};
|
|
ignoreCurrentInstallation?: boolean;
|
|
isInstalling?: boolean;
|
|
}>();
|
|
|
|
const emit = defineEmits<{
|
|
(e: "selectLoader", loader: string): void;
|
|
}>();
|
|
|
|
const vanillaLoaders = [{ name: "Vanilla" as const, displayName: "Vanilla" }];
|
|
|
|
const modLoaders = [
|
|
{ name: "Fabric" as const, displayName: "Fabric" },
|
|
{ name: "Quilt" as const, displayName: "Quilt" },
|
|
{ name: "Forge" as const, displayName: "Forge" },
|
|
{ name: "NeoForge" as const, displayName: "NeoForge" },
|
|
];
|
|
|
|
const pluginLoaders = [
|
|
{ name: "Paper" as const, displayName: "Paper" },
|
|
{ name: "Purpur" as const, displayName: "Purpur" },
|
|
];
|
|
|
|
const isCurrentLoader = (loaderName: string) => {
|
|
return props.data.loader?.toLowerCase() === loaderName.toLowerCase();
|
|
};
|
|
|
|
const selectLoader = (loader: string) => {
|
|
emit("selectLoader", loader);
|
|
};
|
|
</script>
|