fix: clean up, fix a11y, align tests with template

.dockerignore

@@ -4,6 +4,9 @@
 node_modules/
 .pnpm-store/
 
+# generated libs
+/lib/*
+
 # logs
 *.log
 

.env.local.example

@@ -15,5 +15,6 @@ NUXT_PUBLIC_API_BASE_URL="https://frischmuth-dev.acdh-dev.oeaw.ac.at"
 # -------------------------------------------------------------------------------------------------
 # analytics
 # -------------------------------------------------------------------------------------------------
+# NUXT_PUBLIC_GOOGLE_SITE_VERIFICATION=
 NUXT_PUBLIC_MATOMO_BASE_URL="https://matomo.acdh.oeaw.ac.at"
 # NUXT_PUBLIC_MATOMO_ID=

.github/workflows/build-deploy.yml

@@ -10,6 +10,7 @@ on:
 
 jobs:
   env:
+    name: Generate environment variables
     runs-on: ubuntu-latest
     steps:
       - name: Derive environment from git ref
@@ -37,6 +38,7 @@ jobs:
       image: ${{ github.repository }}
 
   vars:
+    name: Generate public url
     needs: [env]
     runs-on: ubuntu-latest
     environment:
@@ -56,11 +58,14 @@ jobs:
       public_url: ${{ steps.public_url.outputs.PUBLIC_URL }}
 
   build:
+    name: Build and push docker image
     needs: [env, vars]
     runs-on: ubuntu-latest
     permissions:
       contents: read
       packages: write
+    environment:
+      name: "${{ needs.env.outputs.environment }}"
 
     steps:
       - name: Checkout repository
@@ -97,17 +102,19 @@ jobs:
           tags: ${{ steps.meta.outputs.tags }}
           labels: ${{ steps.meta.outputs.labels }}
           build-args: |
-            "NUXT_PUBLIC_APP_BASE_URL=${{ needs.vars.outputs.public_url }}"
             "NUXT_PUBLIC_API_BASE_URL=${{ vars.NUXT_PUBLIC_API_BASE_URL }}"
+            "NUXT_PUBLIC_APP_BASE_URL=${{ needs.vars.outputs.public_url }}"
+            "NUXT_PUBLIC_GOOGLE_SITE_VERIFICATION=${{ vars.NUXT_PUBLIC_GOOGLE_SITE_VERIFICATION }}"
             "NUXT_PUBLIC_MATOMO_BASE_URL=${{ vars.NUXT_PUBLIC_MATOMO_BASE_URL }}"
             "NUXT_PUBLIC_MATOMO_ID=${{ vars.NUXT_PUBLIC_MATOMO_ID }}"
             "NUXT_PUBLIC_REDMINE_ID=${{ vars.SERVICE_ID }}"
           cache-from: type=gha
           cache-to: type=gha,mode=max
 
   deploy:
+    name: Deploy docker image
     needs: [env, vars, build]
-    uses: acdh-oeaw/gl-autodevops-minimal-port/.github/workflows/deploy-cluster-2.yml@main
+    uses: acdh-oeaw/gl-autodevops-minimal-port/.github/workflows/deploy.yml@main
     secrets: inherit
     with:
       environment: ${{ needs.env.outputs.environment }}

.github/workflows/validate.yml

@@ -5,6 +5,7 @@ concurrency:
   cancel-in-progress: true
 
 on:
+  workflow_dispatch:
   pull_request:
     branches:
       - main
@@ -33,7 +34,7 @@ jobs:
       # Necessary because `actions/setup-node` does not yet support `corepack`.
       # @see https://github.com/actions/setup-node/issues/531
       - name: Install pnpm
-        uses: pnpm/action-setup@v3
+        uses: pnpm/action-setup@v4
 
       - name: Use Node.js ${{ matrix.node-version }}
         uses: actions/setup-node@v4
@@ -78,8 +79,8 @@ jobs:
       - name: Build app
         run: pnpm run build
         env:
-          NUXT_PUBLIC_APP_BASE_URL: "http://localhost:3000"
           NUXT_PUBLIC_API_BASE_URL: "${{vars.NUXT_PUBLIC_API_BASE_URL}}"
+          NUXT_PUBLIC_APP_BASE_URL: "http://localhost:3000"
           NUXT_PUBLIC_REDMINE_ID: "${{ vars.SERVICE_ID }}"
 
       - name: Run e2e tests

.gitignore

@@ -2,8 +2,8 @@
 node_modules/
 .pnpm-store/
 
-#generated libs
-lib/*
+# generated libs
+/lib/*
 
 # logs
 *.log

.npmrc

@@ -1,3 +1,4 @@
 engine-strict=true
+package-manager-strict=false
 shell-emulator=true
-use-node-version=20.11.0
+use-node-version=20.14.0

.vscode/app.code-snippets

@@ -17,7 +17,7 @@
 			"",
 			"<template>",
 			"\t<MainContent class=\"container grid content-start gap-y-8 py-8\">",
-			"\t\t<PageTitle>{{ t(\"${1:Name}Page.title\") }}</PageTitle>",
+			"\t\t<h1>{{ t(\"${1:Name}Page.title\") }}</h1>",
 			"\t</MainContent>",
 			"</template>"
 		]

Dockerfile

@@ -24,6 +24,7 @@ RUN sed -i "s/use-node-version/# use-node-version/" .npmrc
 ARG NUXT_PUBLIC_API_BASE_URL
 ARG NUXT_PUBLIC_APP_BASE_URL
 ARG NUXT_PUBLIC_BOTS
+ARG NUXT_PUBLIC_GOOGLE_SITE_VERIFICATION
 ARG NUXT_PUBLIC_MATOMO_BASE_URL
 ARG NUXT_PUBLIC_MATOMO_ID
 ARG NUXT_PUBLIC_REDMINE_ID

components/app-header.vue

@@ -3,7 +3,9 @@ import type { NavLinkProps } from "@/components/nav-link.vue";
 import { Separator } from "@/components/ui/separator";
 
 const t = useTranslations();
+
 const route = useRoute();
+
 const homeLink = { href: { path: "/" } };
 const links = computed(() => {
 	return {
@@ -18,21 +20,22 @@ const links = computed(() => {
 	<header class="border-b bg-frisch-marine">
 		<div class="w-full pb-4 pt-12">
 			<nav :aria-label="t('AppHeader.navigation-main')">
-				<ul class="container grid grid-cols-2 items-end" role="list">
+				<div class="container grid items-end gap-4 lg:grid-cols-2">
 					<div class="text-4xl font-semibold text-frisch-orange">
 						<NavLink :href="homeLink.href">
 							Digitales Archiv
 							<br aria-hidden="true" />
 							Barbara Frischmuth
 						</NavLink>
 					</div>
-					<div
+					<ul
 						:class="
 							route.path !== '/'
 								? 'opacity-100 translate-y-0'
 								: 'opacity-0 translate-y-5 pointer-events-none'
 						"
-						class="ml-auto flex gap-x-4 font-semibold transition"
+						class="ml-auto flex gap-x-4 font-bold transition"
+						role="list"
 					>
 						<li
 							v-for="(link, key, index) of links"
@@ -42,14 +45,13 @@ const links = computed(() => {
 							<Separator v-if="index > 0" class="h-full w-0.5 bg-frisch-orange" />
 							<NavLink
 								:href="link.href"
-								:class="route.path === `/${key}` ? 'text-frisch-indigo' : 'text-frisch-orange'"
-								class="hover:text-frisch-indigo"
+								class="text-frisch-orange transition hover:text-frisch-indigo aria-[current]:text-frisch-indigo"
 							>
 								{{ link.label }}
 							</NavLink>
 						</li>
-					</div>
-				</ul>
+					</ul>
+				</div>
 			</nav>
 		</div>
 	</header>

components/search-data-table/data-table.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import { type ColumnDef, FlexRender, getCoreRowModel, useVueTable } from "@tanstack/vue-table";
 
 import {

components/search-filter.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 const slider = { min: 1940, max: 2024 };
 const sliderValue = ref([slider.min, slider.max]);
 </script>

components/search-form.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 export interface SearchFormData {
 	search: string;
 }

components/skip-link.vue

@@ -14,7 +14,7 @@ function onClick() {
 
 <template>
 	<NuxtLink
-		class="fixed -translate-y-full rounded bg-white px-4 py-3 text-neutral-950 transition focus:translate-y-0"
+		class="fixed -translate-y-full rounded bg-background px-4 py-3 text-foreground transition focus:translate-y-0"
 		:href="{ hash: `#${props.targetId}` }"
 		@click="onClick"
 	>

components/ui/button/Button.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import { Primitive, type PrimitiveProps } from "radix-vue";
 import type { HTMLAttributes } from "vue";
 

components/ui/card/Card.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import type { HTMLAttributes } from "vue";
 
 import { cn } from "@/utils/styles";

components/ui/card/CardContent.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import type { HTMLAttributes } from "vue";
 
 import { cn } from "@/utils/styles";

components/ui/card/CardDescription.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import type { HTMLAttributes } from "vue";
 
 import { cn } from "@/utils/styles";

components/ui/card/CardFooter.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import type { HTMLAttributes } from "vue";
 
 import { cn } from "@/utils/styles";

components/ui/card/CardHeader.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import type { HTMLAttributes } from "vue";
 
 import { cn } from "@/utils/styles";

components/ui/card/CardTitle.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import type { HTMLAttributes } from "vue";
 
 import { cn } from "@/utils/styles";

components/ui/checkbox/Checkbox.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import { CheckIcon } from "@radix-icons/vue";
 import {
 	CheckboxIndicator,

components/ui/input/Input.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import { useVModel } from "@vueuse/core";
 import type { HTMLAttributes } from "vue";
 

components/ui/pagination/PaginationEllipsis.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import { DotsHorizontalIcon } from "@radix-icons/vue";
 import { PaginationEllipsis, type PaginationEllipsisProps } from "radix-vue";
 import { computed, type HTMLAttributes } from "vue";

components/ui/pagination/PaginationFirst.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import { DoubleArrowLeftIcon } from "@radix-icons/vue";
 import { PaginationFirst, type PaginationFirstProps } from "radix-vue";
 import { computed, type HTMLAttributes } from "vue";

components/ui/pagination/PaginationLast.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import { DoubleArrowRightIcon } from "@radix-icons/vue";
 import { PaginationLast, type PaginationLastProps } from "radix-vue";
 import { computed, type HTMLAttributes } from "vue";

components/ui/pagination/PaginationNext.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import { ChevronRightIcon } from "@radix-icons/vue";
 import { PaginationNext, type PaginationNextProps } from "radix-vue";
 import { computed, type HTMLAttributes } from "vue";

components/ui/pagination/PaginationPrev.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import { ChevronLeftIcon } from "@radix-icons/vue";
 import { PaginationPrev, type PaginationPrevProps } from "radix-vue";
 import { computed, type HTMLAttributes } from "vue";

components/ui/separator/Separator.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import { Separator, type SeparatorProps } from "radix-vue";
 import { computed, type HTMLAttributes } from "vue";
 

components/ui/slider/Slider.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import {
 	SliderRange,
 	SliderRoot,

components/ui/table/Table.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import type { HTMLAttributes } from "vue";
 
 import { cn } from "@/utils/styles";

components/ui/table/TableBody.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import type { HTMLAttributes } from "vue";
 
 import { cn } from "@/utils/styles";

components/ui/table/TableCaption.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import type { HTMLAttributes } from "vue";
 
 import { cn } from "@/utils/styles";

components/ui/table/TableCell.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import type { HTMLAttributes } from "vue";
 
 import { cn } from "@/utils/styles";

components/ui/table/TableEmpty.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import { computed, type HTMLAttributes } from "vue";
 
 import { cn } from "@/utils/styles";

components/ui/table/TableFooter.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import type { HTMLAttributes } from "vue";
 
 import { cn } from "@/utils/styles";

components/ui/table/TableHead.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import type { HTMLAttributes } from "vue";
 
 import { cn } from "@/utils/styles";