<script setup>
/**
 * Resolves `/settings` to the first settings child the user may open (permission order).
 */
import { useAuth } from "../../composables/useAuth";
import { getFirstPermittedSettingsPath } from "../../composables/useSettingsNavigation";

import BaseProgressSpinner from "../../components/base/BaseProgressSpinner.vue";

import { onMounted } from "vue";
import { useRouter } from "vue-router";

const router = useRouter();
const { permissions } = useAuth();

  onMounted(() => {
    router.replace(getFirstPermittedSettingsPath(permissions.value));
  });
</script>

<template>
  <div class="flex items-center justify-center min-h-[8rem]" aria-busy="true">
    <BaseProgressSpinner aria-label="Loading settings" stroke-width="3" />
  </div>
</template>
