0dee21814d
* Change "Billing" link on dashboard for admins Requires an archon change before merging * change order * steal changes from prospector's old PR supersedes #3234 Co-authored-by: Prospector <prospectordev@gmail.com> * lint? --------- Co-authored-by: Prospector <prospectordev@gmail.com>
56 lines
1.8 KiB
Vue
56 lines
1.8 KiB
Vue
<template>
|
|
<div class="static w-full grid-cols-1 md:relative md:flex">
|
|
<div class="static h-full flex-col pb-4 md:flex md:pb-0 md:pr-4">
|
|
<div class="z-10 flex select-none flex-col gap-2 rounded-2xl bg-bg-raised p-4 md:w-[16rem]">
|
|
<div
|
|
v-for="link in navLinks.filter((x) => x.shown === undefined || x.shown)"
|
|
:key="link.label"
|
|
>
|
|
<NuxtLink
|
|
:to="link.href"
|
|
class="flex items-center gap-2 rounded-xl p-2 hover:bg-button-bg"
|
|
:class="{ 'bg-button-bg text-contrast': route.path === link.href }"
|
|
>
|
|
<div class="flex items-center gap-2 font-bold">
|
|
<component :is="link.icon" class="size-6" />
|
|
{{ link.label }}
|
|
</div>
|
|
|
|
<div class="flex-grow" />
|
|
<RightArrowIcon v-if="link.external" class="size-4" />
|
|
</NuxtLink>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="h-full w-full">
|
|
<NuxtPage
|
|
:route="route"
|
|
:server="server"
|
|
:backup-in-progress="backupInProgress"
|
|
@reinstall="onReinstall"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { RightArrowIcon } from "@modrinth/assets";
|
|
import type { RouteLocationNormalized } from "vue-router";
|
|
import type { BackupInProgressReason } from "~/pages/servers/manage/[id].vue";
|
|
import { ModrinthServer } from "~/composables/servers/modrinth-servers.ts";
|
|
|
|
const emit = defineEmits(["reinstall"]);
|
|
|
|
defineProps<{
|
|
navLinks: { label: string; href: string; icon: Component; external?: boolean; shown?: boolean }[];
|
|
route: RouteLocationNormalized;
|
|
server: ModrinthServer;
|
|
backupInProgress?: BackupInProgressReason;
|
|
}>();
|
|
|
|
const onReinstall = (...args: any[]) => {
|
|
emit("reinstall", ...args);
|
|
};
|
|
</script>
|