create-nuxt-base 0.3.17 → 1.0.2

package/.github/workflows/publish.yml

@@ -8,6 +8,10 @@ on:
 env:
   SLACK_WEBHOOK_URL: ${{ secrets.SLACK_WEBHOOK_URL }}
 
+permissions:
+  id-token: write  # Required for OIDC
+  contents: read
+
 jobs:
   publish:
     runs-on: ubuntu-latest
@@ -26,8 +30,6 @@ jobs:
 
       - name: Publish to npm 🚀
         run: npm publish
-        env:
-          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
 
       - name: Deploy notification
         if: always()

package/.oxfmtrc.jsonc

@@ -0,0 +1,7 @@
+{
+  "$schema": "./node_modules/oxfmt/configuration_schema.json",
+  "arrowParens": "always",
+  "printWidth": 180,
+  "semi": true,
+  "singleQuote": true,
+}

package/CHANGELOG.md

@@ -2,35 +2,47 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [1.0.2](https://github.com/lenneTech/nuxt-base-starter/compare/v1.0.1...v1.0.2) (2026-01-12)
+
+
+### Bug Fixes
+
+* add repository field in package.json ([1f43eae](https://github.com/lenneTech/nuxt-base-starter/commit/1f43eae4445b2f8a54cf4442c79be1bd55cf711c))
+
+### [1.0.1](https://github.com/lenneTech/nuxt-base-starter/compare/v1.0.0...v1.0.1) (2026-01-12)
+
+## [1.0.0](https://github.com/lenneTech/nuxt-base-starter/compare/v0.3.17...v1.0.0) (2026-01-12)
+
+
+### Bug Fixes
+
+* **DEV-609:** removed duplicate public folder inside app ([#10](https://github.com/lenneTech/nuxt-base-starter/issues/10)) ([25fe0fe](https://github.com/lenneTech/nuxt-base-starter/commit/25fe0fe3c53bc3400373d9c3f0a4b6705952171b))
+
 ### [0.3.17](https://github.com/lenneTech/nuxt-base-starter/compare/v0.3.16...v0.3.17) (2025-10-17)
 
 ### [0.3.16](https://github.com/lenneTech/nuxt-base-starter/compare/v0.3.15...v0.3.16) (2025-09-05)
 
-
 ### Bug Fixes
 
-* Update environment variable for bug feature toggle ([d875b3e](https://github.com/lenneTech/nuxt-base-starter/commit/d875b3eb586368499b9e628cdabd2f971e7cce7f))
+- Update environment variable for bug feature toggle ([d875b3e](https://github.com/lenneTech/nuxt-base-starter/commit/d875b3eb586368499b9e628cdabd2f971e7cce7f))
 
 ### [0.3.15](https://github.com/lenneTech/nuxt-base-starter/compare/v0.3.14...v0.3.15) (2025-09-05)
 
-
 ### Features
 
-* Add Linear API configuration and update dependencies ([291adfd](https://github.com/lenneTech/nuxt-base-starter/commit/291adfd8ee6e2c464c4b7c74e4c27531bda3892e))
+- Add Linear API configuration and update dependencies ([291adfd](https://github.com/lenneTech/nuxt-base-starter/commit/291adfd8ee6e2c464c4b7c74e4c27531bda3892e))
 
 ### [0.3.14](https://github.com/lenneTech/nuxt-base-starter/compare/v0.3.13...v0.3.14) (2025-08-01)
 
-
 ### Bug Fixes
 
-* **DEV-446:** Replace pnpm with npm for dependency installation and project commands ([8274c25](https://github.com/lenneTech/nuxt-base-starter/commit/8274c255384b841862d2d70a12c19ea30ecbb9d8))
+- **DEV-446:** Replace pnpm with npm for dependency installation and project commands ([8274c25](https://github.com/lenneTech/nuxt-base-starter/commit/8274c255384b841862d2d70a12c19ea30ecbb9d8))
 
 ### [0.3.13](https://github.com/lenneTech/nuxt-base-starter/compare/v0.3.12...v0.3.13) (2025-07-24)
 
-
 ### Bug Fixes
 
-* Update [@lenne](https://github.com/lenne).tech/nuxt-base dependency to latest version ([71dd666](https://github.com/lenneTech/nuxt-base-starter/commit/71dd6669fd9ec25671a102b4d2ad294ac88daa10))
+- Update [@lenne](https://github.com/lenne).tech/nuxt-base dependency to latest version ([71dd666](https://github.com/lenneTech/nuxt-base-starter/commit/71dd6669fd9ec25671a102b4d2ad294ac88daa10))
 
 ### [0.3.12](https://github.com/lenneTech/nuxt-base-starter/compare/v0.3.11...v0.3.12) (2025-07-24)
 

package/nuxt-base-template/.dockerignore

@@ -0,0 +1,44 @@
+# Dependencies
+node_modules
+.npm
+
+# Build output
+.nuxt
+.output
+dist
+
+# IDE
+.idea
+.vscode
+*.swp
+*.swo
+
+# Logs
+*.log
+npm-debug.log*
+
+# Testing
+coverage
+test-results
+playwright-report
+
+# Environment
+.env.local
+.env.*.local
+
+# Git
+.git
+.gitignore
+
+# Docker
+Dockerfile*
+docker-compose*
+.dockerignore
+
+# Documentation
+*.md
+!README.md
+
+# Misc
+.DS_Store
+*.tgz

package/nuxt-base-template/.nuxtrc

@@ -0,0 +1 @@
+setups.@nuxt/test-utils="3.23.0"

package/nuxt-base-template/.oxfmtrc.jsonc

@@ -0,0 +1,8 @@
+{
+  "$schema": "./node_modules/oxfmt/configuration_schema.json",
+  "arrowParens": "always",
+  "printWidth": 180,
+  "semi": true,
+  "singleQuote": true,
+  "ignorePatterns": [".nuxt", ".output", "node_modules", "dist"],
+}

package/nuxt-base-template/Dockerfile.dev

@@ -0,0 +1,23 @@
+FROM node:22-alpine
+
+WORKDIR /app
+
+# Install dependencies for native modules
+RUN apk add --no-cache python3 make g++
+
+# Copy package files first for better caching
+COPY package*.json ./
+COPY .npmrc ./
+
+# Install dependencies
+RUN npm ci
+
+# Copy entrypoint script
+COPY docker-entrypoint.sh /docker-entrypoint.sh
+RUN chmod +x /docker-entrypoint.sh
+
+# Expose port
+EXPOSE 3001
+
+ENTRYPOINT ["/docker-entrypoint.sh"]
+CMD ["npm", "run", "dev", "--", "--host", "0.0.0.0"]

package/nuxt-base-template/app/components/Modal/ModalBackupCodes.vue

@@ -0,0 +1,117 @@
+<script lang="ts" setup>
+// ============================================================================
+// Imports
+// ============================================================================
+import type { FormSubmitEvent } from '@nuxt/ui';
+import type { InferOutput } from 'valibot';
+
+import * as v from 'valibot';
+
+import { authClient } from '~/lib/auth-client';
+
+// ============================================================================
+// Props & Emits
+// ============================================================================
+interface Props {
+  initialCodes?: string[];
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  initialCodes: () => [],
+});
+
+const emit = defineEmits<{
+  close: [result?: unknown];
+}>();
+
+// ============================================================================
+// Composables
+// ============================================================================
+const toast = useToast();
+
+// ============================================================================
+// Variables
+// ============================================================================
+const loading = ref<boolean>(false);
+const backupCodes = ref<string[]>(props.initialCodes);
+
+const passwordSchema = v.object({
+  password: v.pipe(v.string('Passwort ist erforderlich'), v.minLength(1, 'Passwort ist erforderlich')),
+});
+
+type PasswordSchema = InferOutput<typeof passwordSchema>;
+
+// ============================================================================
+// Functions
+// ============================================================================
+function copyBackupCodes(): void {
+  navigator.clipboard.writeText(backupCodes.value.join('\n'));
+  toast.add({
+    color: 'success',
+    description: 'Backup-Codes wurden in die Zwischenablage kopiert',
+    title: 'Kopiert',
+  });
+}
+
+async function generateBackupCodes(payload: FormSubmitEvent<PasswordSchema>): Promise<void> {
+  loading.value = true;
+
+  try {
+    const { data, error } = await authClient.twoFactor.generateBackupCodes({
+      password: payload.data.password,
+    });
+
+    if (error) {
+      toast.add({
+        color: 'error',
+        description: error.message || 'Backup-Codes konnten nicht generiert werden',
+        title: 'Fehler',
+      });
+      return;
+    }
+
+    backupCodes.value = data?.backupCodes ?? [];
+  } finally {
+    loading.value = false;
+  }
+}
+
+function handleClose(): void {
+  emit('close');
+}
+</script>
+
+<template>
+  <UModal title="Backup-Codes" :close="{ onClick: handleClose }">
+    <template #body>
+      <div class="space-y-4">
+        <div class="flex items-center gap-3">
+          <UIcon name="i-lucide-key" class="size-6 text-warning" />
+          <p class="text-sm text-muted">Bewahre diese Codes sicher auf. Jeder Code kann nur einmal verwendet werden.</p>
+        </div>
+
+        <template v-if="backupCodes.length > 0">
+          <div class="grid grid-cols-2 gap-2 rounded-lg bg-muted/50 p-4 font-mono text-sm">
+            <span v-for="code in backupCodes" :key="code">{{ code }}</span>
+          </div>
+        </template>
+
+        <template v-else>
+          <UForm :schema="passwordSchema" class="space-y-4" @submit="generateBackupCodes">
+            <UFormField label="Passwort" name="password">
+              <UInput name="password" type="password" placeholder="Dein Passwort" />
+            </UFormField>
+            <UButton type="submit" block :loading="loading"> Neue Backup-Codes generieren </UButton>
+          </UForm>
+        </template>
+      </div>
+    </template>
+
+    <template #footer>
+      <div class="flex justify-end gap-3">
+        <UButton v-if="backupCodes.length > 0" variant="outline" icon="i-lucide-copy" @click="copyBackupCodes"> Codes kopieren </UButton>
+        <UButton color="neutral" variant="outline" @click="handleClose"> Schließen </UButton>
+      </div>
+    </template>
+  </UModal>
+</template>

package/nuxt-base-template/app/components/Upload/TusFileUpload.vue

@@ -0,0 +1,302 @@
+<script setup lang="ts">
+import type { UploadItem } from '~/interfaces/upload.interface';
+
+// ============================================================================
+// Props & Emits
+// ============================================================================
+interface Props {
+  /** Erlaubte Dateitypen (MIME types oder Extensions) */
+  accept?: string;
+  /** Upload automatisch starten */
+  autoStart?: boolean;
+  /** Chunk-Groesse fuer TUS */
+  chunkSize?: number;
+  /** Beschreibung fuer Dropzone */
+  description?: string;
+  /** Deaktiviert */
+  disabled?: boolean;
+  /** TUS Upload Endpoint */
+  endpoint?: string;
+  /** Label fuer Dropzone */
+  label?: string;
+  /** Layout der Dateiliste */
+  layout?: 'grid' | 'list';
+  /** Maximale Dateigroesse in Bytes */
+  maxSize?: number;
+  /** Zusaetzliche Metadaten */
+  metadata?: Record<string, string>;
+  /** Mehrere Dateien erlauben */
+  multiple?: boolean;
+  /** Parallele Uploads */
+  parallelUploads?: number;
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  accept: '*/*',
+  autoStart: true,
+  chunkSize: 5 * 1024 * 1024,
+  description: 'Dateien werden automatisch hochgeladen',
+  label: 'Dateien hier ablegen',
+  layout: 'list',
+  maxSize: 100 * 1024 * 1024,
+  multiple: true,
+  parallelUploads: 3,
+});
+
+const emit = defineEmits<{
+  /** Alle Uploads abgeschlossen */
+  complete: [items: UploadItem[]];
+  /** Upload-Fehler */
+  error: [item: UploadItem, error: Error];
+  /** Ein Upload abgeschlossen */
+  success: [item: UploadItem];
+  /** Files geaendert */
+  'update:modelValue': [files: File[]];
+}>();
+
+// ============================================================================
+// Composables
+// ============================================================================
+const toast = useToast();
+const { formatDuration, formatFileSize } = useFile();
+
+// ============================================================================
+// TUS Upload Setup
+// ============================================================================
+const { addFiles, cancelAll, cancelUpload, clearCompleted, isUploading, pauseAll, pauseUpload, resumeAll, resumeUpload, retryUpload, totalProgress, uploads } = useTusUpload({
+  autoStart: props.autoStart,
+  chunkSize: props.chunkSize,
+  endpoint: props.endpoint,
+  metadata: props.metadata,
+  onError: (item, error) => {
+    toast.add({
+      color: 'error',
+      description: item.file.name,
+      title: 'Upload fehlgeschlagen',
+    });
+    emit('error', item, error);
+  },
+  onSuccess: (item) => {
+    toast.add({
+      color: 'success',
+      description: item.file.name,
+      title: 'Upload abgeschlossen',
+    });
+    emit('success', item);
+  },
+  parallelUploads: props.parallelUploads,
+});
+
+// ============================================================================
+// State
+// ============================================================================
+const files = ref<File[]>([]);
+
+// ============================================================================
+// Watchers
+// ============================================================================
+// Neue Dateien zu TUS hinzufuegen
+watch(
+  files,
+  (newFiles, oldFiles) => {
+    const addedFiles = newFiles.filter((f) => !oldFiles?.includes(f));
+    if (addedFiles.length > 0) {
+      // Validierung
+      const validFiles = addedFiles.filter((file) => {
+        if (file.size > props.maxSize) {
+          toast.add({
+            color: 'error',
+            description: `${file.name} ist zu gross (max. ${formatFileSize(props.maxSize)})`,
+            title: 'Datei zu gross',
+          });
+          return false;
+        }
+        return true;
+      });
+
+      if (validFiles.length > 0) {
+        addFiles(validFiles);
+      }
+    }
+    emit('update:modelValue', newFiles);
+  },
+  { deep: true },
+);
+
+// Emit complete wenn alle fertig
+const completedUploads = computed(() => uploads.value.filter((u) => u.status === 'completed'));
+watch([completedUploads, isUploading], ([completed, uploading]) => {
+  if (completed.length > 0 && !uploading && uploads.value.every((u) => u.status === 'completed' || u.status === 'error')) {
+    emit('complete', completed);
+  }
+});
+
+function getStatusColor(status: string): 'error' | 'neutral' | 'success' | 'warning' {
+  switch (status) {
+    case 'completed':
+      return 'success';
+    case 'error':
+      return 'error';
+    case 'paused':
+      return 'warning';
+    default:
+      return 'neutral';
+  }
+}
+
+function getStatusLabel(status: string): string {
+  switch (status) {
+    case 'completed':
+      return 'Fertig';
+    case 'error':
+      return 'Fehler';
+    case 'paused':
+      return 'Pausiert';
+    case 'uploading':
+      return 'Hochladen';
+    default:
+      return 'Wartend';
+  }
+}
+
+// ============================================================================
+// Helpers
+// ============================================================================
+function getUploadForFile(file: File, index: number): undefined | UploadItem {
+  // Versuche ueber Index zu matchen (funktioniert wenn Reihenfolge gleich)
+  const upload = uploads.value[index];
+  if (upload?.file.name === file.name && upload?.file.size === file.size) {
+    return upload;
+  }
+  // Fallback: Suche ueber Name und Groesse
+  return uploads.value.find((u) => u.file.name === file.name && u.file.size === file.size);
+}
+
+// ============================================================================
+// Expose fuer Parent-Zugriff
+// ============================================================================
+defineExpose({
+  cancelAll,
+  clearCompleted,
+  isUploading,
+  pauseAll,
+  resumeAll,
+  totalProgress,
+  uploads,
+});
+</script>
+
+<template>
+  <div class="space-y-4">
+    <!-- Nuxt UI FileUpload -->
+    <UFileUpload
+      v-model="files"
+      :accept="accept"
+      :description="description"
+      :disabled="disabled || isUploading"
+      :dropzone="!disabled"
+      :label="label"
+      :layout="layout"
+      :multiple="multiple"
+      class="w-full"
+    >
+      <!-- Custom File Slot mit TUS Progress -->
+      <template #file="{ file, index }">
+        <div class="flex w-full items-center gap-3 rounded-lg border border-default bg-default p-3">
+          <UIcon name="i-lucide-file" class="size-6 shrink-0 text-muted" />
+
+          <div class="min-w-0 flex-1">
+            <p class="truncate text-sm font-medium">{{ file.name }}</p>
+
+            <template v-if="getUploadForFile(file, index)">
+              <div class="mt-0.5 flex items-center gap-2 text-xs text-muted">
+                <span>{{ formatFileSize(file.size) }}</span>
+
+                <template v-if="getUploadForFile(file, index)?.status === 'uploading'">
+                  <span>-</span>
+                  <span>{{ getUploadForFile(file, index)?.progress.percentage }}%</span>
+                  <span>-</span>
+                  <span>{{ formatFileSize(getUploadForFile(file, index)?.progress.speed || 0) }}/s</span>
+                  <span>-</span>
+                  <span>{{ formatDuration(getUploadForFile(file, index)?.progress.remainingTime || 0) }}</span>
+                </template>
+
+                <template v-else>
+                  <span>-</span>
+                  <UBadge :color="getStatusColor(getUploadForFile(file, index)?.status || 'idle')" size="xs" variant="subtle">
+                    {{ getStatusLabel(getUploadForFile(file, index)?.status || 'idle') }}
+                  </UBadge>
+                </template>
+              </div>
+
+              <UProgress
+                v-if="getUploadForFile(file, index)?.status === 'uploading' || getUploadForFile(file, index)?.status === 'paused'"
+                :color="getUploadForFile(file, index)?.status === 'paused' ? 'warning' : 'primary'"
+                :value="getUploadForFile(file, index)?.progress.percentage || 0"
+                class="mt-2"
+                size="xs"
+              />
+            </template>
+
+            <template v-else>
+              <p class="text-xs text-muted">{{ formatFileSize(file.size) }}</p>
+            </template>
+          </div>
+
+          <!-- Actions -->
+          <div class="flex shrink-0 gap-0.5">
+            <UButton
+              v-if="getUploadForFile(file, index)?.status === 'uploading'"
+              color="neutral"
+              icon="i-lucide-pause"
+              size="xs"
+              variant="ghost"
+              @click.stop="pauseUpload(getUploadForFile(file, index)!.id)"
+            />
+            <UButton
+              v-if="getUploadForFile(file, index)?.status === 'paused'"
+              color="primary"
+              icon="i-lucide-play"
+              size="xs"
+              variant="ghost"
+              @click.stop="resumeUpload(getUploadForFile(file, index)!.id)"
+            />
+            <UButton
+              v-if="getUploadForFile(file, index)?.status === 'error'"
+              color="warning"
+              icon="i-lucide-refresh-cw"
+              size="xs"
+              variant="ghost"
+              @click.stop="retryUpload(getUploadForFile(file, index)!.id)"
+            />
+            <UButton
+              v-if="getUploadForFile(file, index)?.status !== 'completed'"
+              color="error"
+              icon="i-lucide-x"
+              size="xs"
+              variant="ghost"
+              @click.stop="cancelUpload(getUploadForFile(file, index)!.id)"
+            />
+          </div>
+        </div>
+      </template>
+
+      <!-- Actions Slot fuer Bulk-Actions -->
+      <template #files-bottom="{ files: fileList }">
+        <div v-if="fileList && Array.isArray(fileList) && fileList.length > 1 && uploads.length > 0" class="flex items-center justify-between border-t border-default pt-2">
+          <div class="text-xs text-muted">
+            <template v-if="isUploading"> {{ totalProgress.percentage }}% - {{ formatFileSize(totalProgress.speed) }}/s </template>
+            <template v-else> {{ uploads.filter((u) => u.status === 'completed').length }}/{{ uploads.length }} abgeschlossen </template>
+          </div>
+
+          <div class="flex gap-1">
+            <UButton v-if="isUploading" color="neutral" size="xs" variant="ghost" @click="pauseAll"> Alle pausieren </UButton>
+            <UButton v-if="uploads.some((u) => u.status === 'paused')" color="primary" size="xs" variant="ghost" @click="resumeAll"> Alle fortsetzen </UButton>
+            <UButton v-if="uploads.some((u) => u.status === 'completed')" color="neutral" size="xs" variant="ghost" @click="clearCompleted"> Fertige entfernen </UButton>
+            <UButton v-if="uploads.length > 0" color="error" size="xs" variant="ghost" @click="cancelAll"> Alle abbrechen </UButton>
+          </div>
+        </div>
+      </template>
+    </UFileUpload>
+  </div>
+</template>

package/nuxt-base-template/app/composables/use-better-auth.ts

@@ -0,0 +1,25 @@
+import { authClient } from '~/lib/auth-client';
+
+export function useBetterAuth() {
+  const session = authClient.useSession();
+
+  const user = computed<null | User>(() => (session.value.data?.user as User) ?? null);
+  const isAuthenticated = computed<boolean>(() => !!user.value);
+  const isAdmin = computed<boolean>(() => user.value?.role === 'admin');
+  const is2FAEnabled = computed<boolean>(() => user.value?.twoFactorEnabled ?? false);
+  const isLoading = computed<boolean>(() => session.value.isPending);
+
+  return {
+    is2FAEnabled,
+    isAdmin,
+    isAuthenticated,
+    isLoading,
+    passkey: authClient.passkey,
+    session,
+    signIn: authClient.signIn,
+    signOut: authClient.signOut,
+    signUp: authClient.signUp,
+    twoFactor: authClient.twoFactor,
+    user,
+  };
+}

package/nuxt-base-template/app/composables/use-file.ts

@@ -8,11 +8,13 @@ interface FileInfo {
 }
 
 export function useFile() {
-  const { isValidMongoID } = useHelper();
+  const config = useRuntimeConfig();
 
-  async function getFileInfo(id: string | undefined): Promise<FileInfo | null | string> {
-    const config = useRuntimeConfig();
+  function isValidMongoID(id: string): boolean {
+    return /^[a-f\d]{24}$/i.test(id);
+  }
 
+  async function getFileInfo(id: string | undefined): Promise<FileInfo | null | string> {
     if (!id) {
       return null;
     }
@@ -23,6 +25,7 @@ export function useFile() {
 
     try {
       const response = await $fetch<FileInfo>(config.public.host + '/files/info/' + id, {
+        credentials: 'include',
         method: 'GET',
       });
       return response;
@@ -32,5 +35,37 @@ export function useFile() {
     }
   }
 
-  return { getFileInfo };
+  function getFileUrl(id: string): string {
+    return `${config.public.host}/files/${id}`;
+  }
+
+  function getDownloadUrl(id: string, filename?: string): string {
+    const base = `${config.public.host}/files/download/${id}`;
+    return filename ? `${base}?filename=${encodeURIComponent(filename)}` : base;
+  }
+
+  function formatFileSize(bytes: number): string {
+    if (bytes === 0) return '0 B';
+    const k = 1024;
+    const sizes = ['B', 'KB', 'MB', 'GB', 'TB'];
+    const i = Math.floor(Math.log(bytes) / Math.log(k));
+    return `${parseFloat((bytes / Math.pow(k, i)).toFixed(2))} ${sizes[i]}`;
+  }
+
+  function formatDuration(seconds: number): string {
+    if (seconds < 60) return `${seconds}s`;
+    if (seconds < 3600) return `${Math.floor(seconds / 60)}m ${seconds % 60}s`;
+    const hours = Math.floor(seconds / 3600);
+    const minutes = Math.floor((seconds % 3600) / 60);
+    return `${hours}h ${minutes}m`;
+  }
+
+  return {
+    formatDuration,
+    formatFileSize,
+    getDownloadUrl,
+    getFileInfo,
+    getFileUrl,
+    isValidMongoID,
+  };
 }

package/nuxt-base-template/app/composables/use-share.ts

@@ -2,7 +2,7 @@ export function useShare() {
   const route = useRoute();
 
   async function share(title?: string, text?: string, url?: string) {
-    if (!process.client) {
+    if (!import.meta.client) {
       return;
     }