mirror of
https://github.com/unraid/api.git
synced 2026-05-04 06:02:47 -05:00
Eli Bosley
345e83bfb0
<!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added new modal dialogs and UI components, including activation steps, OS update feedback, and expanded notification management. * Introduced a plugin to configure internationalization, state management, and Apollo client support in web components. * Added a new Log Viewer page with a streamlined interface for viewing logs. * **Improvements** * Centralized Pinia state management by consolidating all stores to use a shared global Pinia instance. * Simplified component templates by removing redundant internationalization host wrappers. * Enhanced ESLint configuration with stricter rules and global variable declarations. * Refined custom element build process to prevent jQuery conflicts and optimize minification. * Updated component imports and templates for consistent structure and maintainability. * Streamlined log viewer dropdowns using simplified select components with improved formatting. * Improved notification sidebar with filtering by importance and modular components. * Replaced legacy notification popups with new UI components and added automatic root session creation for localhost requests. * Updated OS version display and user profile UI with refined styling and component usage. * **Bug Fixes** * Fixed component tag capitalization and improved type annotations across components. * **Chores** * Updated development dependencies including ESLint plugins and build tools. * Removed deprecated log viewer patch class and cleaned up related test fixtures. * Removed unused imports and simplified Apollo client setup. * Cleaned up test mocks and removed obsolete i18n host component tests. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --- - To see the specific tasks where the Asana app for GitHub is being used, see below: - https://app.asana.com/0/0/1210730229632804 --------- Co-authored-by: Pujit Mehrotra <pujit@lime-technology.com> Co-authored-by: Zack Spear <zackspear@users.noreply.github.com>
66 lines
1.8 KiB
Vue
66 lines
1.8 KiB
Vue
<template>
|
|
<div class="text-black bg-white dark:text-white dark:bg-black">
|
|
<ClientOnly>
|
|
<div class="flex flex-row items-center justify-center gap-6 p-6 bg-white dark:bg-zinc-800">
|
|
<template v-for="route in routes" :key="route.path">
|
|
<NuxtLink
|
|
:to="route.path"
|
|
class="underline hover:no-underline focus:no-underline"
|
|
active-class="text-orange"
|
|
>
|
|
{{ formatRouteName(route.name) }}
|
|
</NuxtLink>
|
|
</template>
|
|
<ModalsCe />
|
|
</div>
|
|
<slot />
|
|
</ClientOnly>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { computed, watch } from 'vue';
|
|
import { useRouter } from 'vue-router';
|
|
import { storeToRefs } from 'pinia';
|
|
import { ClientOnly, NuxtLink } from '#components';
|
|
import ModalsCe from '~/components/Modals.ce.vue';
|
|
import { useThemeStore } from '~/store/theme';
|
|
|
|
const router = useRouter();
|
|
const themeStore = useThemeStore();
|
|
const { theme } = storeToRefs(themeStore);
|
|
|
|
// Watch for theme changes (satisfies linter by using theme)
|
|
watch(
|
|
theme,
|
|
() => {
|
|
// Theme is being watched for reactivity
|
|
console.debug('Theme changed:', theme.value);
|
|
},
|
|
{ immediate: true }
|
|
);
|
|
|
|
const routes = computed(() => {
|
|
return router
|
|
.getRoutes()
|
|
.filter((route) => !route.path.includes(':') && route.path !== '/404' && route.name)
|
|
.sort((a, b) => a.path.localeCompare(b.path));
|
|
});
|
|
|
|
function formatRouteName(name) {
|
|
if (!name) return 'Home';
|
|
// Convert route names like "web-components" to "Web Components"
|
|
return name
|
|
.replace(/-/g, ' ')
|
|
.split(' ')
|
|
.map((word) => word.charAt(0).toUpperCase() + word.slice(1))
|
|
.join(' ');
|
|
}
|
|
</script>
|
|
|
|
<style lang="postcss">
|
|
/* Import theme styles */
|
|
@import '@unraid/ui/styles';
|
|
@import '~/assets/main.css';
|
|
</style>
|