public/glowing-fiesta-original
1
0
Fork 0
Code Issues 4 Pull requests Projects Releases Packages Wiki Activity Actions

Added runtimeConfig and used it for appVersion in the footer

Browse source
This commit is contained in:
Liviu Burcusel 2025-12-24 11:14:03 +01:00
parent 3897072e27
commit 52b255df65
Signed by: liviu
GPG key ID: 6CDB37A4AD2C610C
4 changed files with 30 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

12
app/layouts/Default.vue
View file

@ -14,7 +14,11 @@ import {
import { Separator } from "~/components/ui/separator";
import { useRuntimeConfig } from "#app";
const currentYear = new Date().getFullYear();
const config = useRuntimeConfig();
</script>
<template>
@ -40,8 +44,12 @@ const currentYear = new Date().getFullYear();
<slot />
</main>
<footer class="flex h-12 shrink-0 items-center gap-2 border-b px-4" data-testid="footer">
<div v-if="currentYear === 2025" class="bg-muted/50 flex-1 rounded-xl p-2 text-center">Glowing Fiesta 2025</div>
<div v-else class="bg-muted/50 flex-1 rounded-xl p-2 text-center">Glowing Fiesta 2025 - {{ currentYear }}</div>
<div v-if="currentYear === 2025" class="bg-muted/50 flex-1 rounded-xl p-2 text-center">
Glowing Fiesta 2025 <span class="text-muted-foreground">({{ config.public.appVersion }})</span>
</div>
<div v-else class="bg-muted/50 flex-1 rounded-xl p-2 text-center">
Glowing Fiesta 2025 - {{ currentYear }} <span class="text-muted-foreground">({{ config.public.appVersion }})</span>
</div>
</footer>
</SidebarInset>
</SidebarProvider>

9
nuxt.config.ts
View file

@ -1,8 +1,17 @@
import { readFileSync } from "fs";
import { resolve } from "path";
import tailwindcss from "@tailwindcss/vite";
const packageJsonContent = JSON.parse(readFileSync(resolve(__dirname, "package.json"), "utf-8"));
// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
compatibilityDate: "2025-07-15",
runtimeConfig: {
public: {
appVersion: packageJsonContent.version,
},
},
app: {
head: {
htmlAttrs: {

12
tests/layouts/Default.test.ts
View file

@ -2,6 +2,14 @@ import { afterEach, describe, expect, it, vi } from "vitest";
import { mount } from "@vue/test-utils";
import DefaultLayout from "~/layouts/Default.vue";
vi.mock("#app", () => ({
useRuntimeConfig: () => ({
public: {
appVersion: "1.0.1",
},
}),
}));
describe("Default.vue", () => {
afterEach(() => {
vi.useRealTimers();
@ -24,7 +32,7 @@ describe("Default.vue", () => {
vi.setSystemTime(new Date(2025, 0, 1));
const wrapper = mount(DefaultLayout);
const footer = wrapper.find("[data-testid='footer']");
expect(footer.text()).toBe("Glowing Fiesta 2025");
expect(footer.text()).toBe("Glowing Fiesta 2025 (1.0.1)");
});
it("footer shows range when current year is not 2025", () => {
@ -32,7 +40,7 @@ describe("Default.vue", () => {
vi.setSystemTime(new Date(2069, 0, 1));
const wrapper = mount(DefaultLayout);
const footer = wrapper.find("[data-testid='footer']");
expect(footer.text()).toBe("Glowing Fiesta 2025 - 2069");
expect(footer.text()).toBe("Glowing Fiesta 2025 - 2069 (1.0.1)");
});
});
});

1
vitest.config.ts
View file

@ -43,6 +43,7 @@ export default defineConfig({
alias: {
"~": fileURLToPath(new URL("./app", import.meta.url)),
"@": fileURLToPath(new URL("./app", import.meta.url)),
"#app": fileURLToPath(new URL("./.nuxt/types/imports.d.ts", import.meta.url)),
},
},
});