Some checks failed
Axolotl desktop CI / guardrails (push) Has been cancelled
Axolotl desktop CI / desktop (macos-latest) (push) Has been cancelled
Axolotl desktop CI / desktop (ubuntu-latest) (push) Has been cancelled
Axolotl desktop CI / desktop (windows-latest) (push) Has been cancelled
Axolotl desktop CI / website (push) Has been cancelled
Repository checks / typos (push) Has been cancelled
Repository checks / tombi (push) Has been cancelled
Rust checks / shear (push) Has been cancelled
Sync source to CNB / Sync Git ref (push) Has been cancelled
Sync LobeHub models / sync (push) Has been cancelled
36 lines
1.1 KiB
Vue
36 lines
1.1 KiB
Vue
<script setup lang="ts">
|
|
import { UsersIcon } from '@modrinth/assets'
|
|
import { defineMessages, NavTabs, useVIntl } from '@modrinth/ui'
|
|
import { computed } from 'vue'
|
|
import { RouterView, useRoute, useRouter } from 'vue-router'
|
|
|
|
const { formatMessage } = useVIntl()
|
|
const route = useRoute()
|
|
const router = useRouter()
|
|
|
|
const messages = defineMessages({
|
|
title: { id: 'app.multiplayer.title', defaultMessage: 'Multiplayer' },
|
|
roomsTab: { id: 'app.multiplayer.tab.rooms', defaultMessage: 'Rooms' },
|
|
})
|
|
|
|
const activeTab = computed(() => (route.path.startsWith('/multiplayer/rooms') ? 'rooms' : 'rooms'))
|
|
const tabLinks = computed(() => [
|
|
{ label: formatMessage(messages.roomsTab), href: '/multiplayer/rooms', icon: UsersIcon },
|
|
])
|
|
|
|
function handleTabClick(index: number) {
|
|
void router.push(tabLinks.value[index]?.href ?? '/multiplayer/rooms')
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="box-border flex min-h-full w-full flex-col gap-3 p-6">
|
|
<h1 class="m-0 shrink-0 text-2xl font-semibold text-contrast">
|
|
{{ formatMessage(messages.title) }}
|
|
</h1>
|
|
<NavTabs mode="local" :active-index="0" :links="tabLinks" @tab-click="handleTabClick" />
|
|
|
|
<RouterView />
|
|
</div>
|
|
</template>
|