mktcms 0.2.13 → 0.2.15

package/README.md

@@ -1,8 +1,10 @@
-# Simple CMS module for Nuxt
+# MktCMS
+
+A file based CMS for self-hosted Nuxt apps.
 
 ![Screenshot of Admin UI](https://raw.githubusercontent.com/mktcode/mktcms/refs/heads/main/docs/screenshot.png)
 
-This is my personal, minimalist alternative to @nuxt/content and Studio, which are fantastic projects, but sometimes lacking the kind of complete documentation I’m looking for. Over time I will probably migrate more and and more (MDC already supported), and keep this repo as a custom nuxt template for my projects. If you find it useful, feel free to use it as well and contribute to it.
+This is my personal, minimalist alternative to @nuxt/content and Studio, which are fantastic projects, but sometimes lacking the kind of complete documentation I’m looking for. Over time I will maybe migrate more and more (MDC already supported), and just keep [the website template](https://github.com/mktcode/mktcms-website-template) and the [server utility](https://github.com/mktcode/mktcms-server). If you find this useful, feel free to use it and contribute to it.
 
 [![npm version][npm-version-src]][npm-version-href]
 [![npm downloads][npm-downloads-src]][npm-downloads-href]
@@ -15,7 +17,7 @@ This is my personal, minimalist alternative to @nuxt/content and Studio, which a
 
 ## Features
 
-- Simple Admin UI to manage content files
+- Simple Admin UI with Git integration to manage content
 - Composables to use the content in your Nuxt app
 - `sendMail` utility to send emails via SMTP
 - [MDC](https://github.com/nuxt-content/mdc) support
@@ -28,7 +30,18 @@ npx nuxi module add mktcms
 
 ```bash
 NUXT_PUBLIC_MKTCMS_SITE_URL="http://localhost:3000"
+NUXT_PUBLIC_MKTCMS_SHOW_VERSIONING=false
+
 NUXT_MKTCMS_ADMIN_AUTH_KEY="your-admin-auth-key"
+NUXT_MKTCMS_AUTH_COOKIE_MAX_AGE_SECONDS=604800
+NUXT_MKTCMS_AUTH_COOKIE_PATH="/"
+NUXT_MKTCMS_AUTH_COOKIE_SAME_SITE="lax"
+NUXT_MKTCMS_AUTH_COOKIE_SECURE=true
+NUXT_MKTCMS_LOGIN_RATE_LIMIT_MAX_ATTEMPTS=5
+NUXT_MKTCMS_LOGIN_RATE_LIMIT_WINDOW_SECONDS=300
+NUXT_MKTCMS_LOGIN_RATE_LIMIT_BLOCK_SECONDS=600
+NUXT_MKTCMS_UPLOAD_MAX_BYTES=52428800
+
 NUXT_MKTCMS_SMTP_HOST="your-smtp-host"
 NUXT_MKTCMS_SMTP_PORT=465
 NUXT_MKTCMS_SMTP_SECURE=true
@@ -36,6 +49,7 @@ NUXT_MKTCMS_SMTP_USER="your-smtp-user"
 NUXT_MKTCMS_SMTP_PASS="your-smtp-pass"
 NUXT_MKTCMS_MAILER_FROM="your-mailer-from-address"
 NUXT_MKTCMS_MAILER_TO="your-mailer-to-address"
+
 NUXT_MKTCMS_GIT_USER="your-github-username"
 NUXT_MKTCMS_GIT_REPO="owner/repository.git"
 NUXT_MKTCMS_GIT_TOKEN="your-github-personal-access-token"

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "mktcms",
   "configKey": "mktcms",
-  "version": "0.2.13",
+  "version": "0.2.15",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/module.mjs

@@ -15,6 +15,14 @@ const module$1 = defineNuxtModule({
     const resolver = createResolver(import.meta.url);
     _nuxt.options.runtimeConfig.mktcms = defu((_nuxt.options.runtimeConfig.mktcms, {
       adminAuthKey: "",
+      authCookieMaxAgeSeconds: 7 * 24 * 60 * 60,
+      authCookiePath: "/",
+      authCookieSameSite: "lax",
+      authCookieSecure: process.env.NODE_ENV === "production",
+      loginRateLimitMaxAttempts: 5,
+      loginRateLimitWindowSeconds: 300,
+      loginRateLimitBlockSeconds: 600,
+      uploadMaxBytes: 50 * 1024 * 1024,
       smtpHost: "",
       smtpPort: 465,
       smtpSecure: true,
@@ -143,11 +151,6 @@ const module$1 = defineNuxtModule({
       route: "/api/admin/blob",
       handler: resolver.resolve("./runtime/server/api/admin/blob")
     });
-    addServerHandler({
-      route: "/api/admin/import",
-      method: "post",
-      handler: resolver.resolve("./runtime/server/api/admin/import")
-    });
     addServerHandler({
       route: "/api/admin/upload",
       handler: resolver.resolve("./runtime/server/api/admin/upload")

package/dist/runtime/app/components/content/editor/csv.vue

@@ -2,24 +2,31 @@
 import { ref } from "vue";
 import Saved from "../saved.vue";
 import usePathParam from "../../../composables/usePathParam";
-import { useFetch } from "#imports";
+import useCopyMode from "../../../composables/useCopyMode";
+import { navigateTo, useFetch } from "#imports";
 const { path } = usePathParam();
+const { isCopyMode, newFilename, sourceExtension, targetPath, targetEditPath, filenameError, confirmOverwriteIfNeeded } = useCopyMode(path);
 const { data: table } = await useFetch(`/api/admin/csv?path=${path}`);
 const isSaving = ref(false);
 const savingSuccessful = ref(false);
 const commitMessage = ref("Inhaltliche \xC4nderungen");
 async function saveCsv() {
   if (!table.value) return;
+  if (isCopyMode.value && !await confirmOverwriteIfNeeded()) return;
   isSaving.value = true;
   savingSuccessful.value = false;
   try {
-    await useFetch(`/api/admin/csv?path=${path}`, {
+    await useFetch(`/api/admin/csv?path=${isCopyMode.value ? targetPath.value : path}`, {
       method: "POST",
       body: {
         table: table.value,
         commitMessage: commitMessage.value
       }
     });
+    if (isCopyMode.value) {
+      await navigateTo(targetEditPath.value, { replace: true });
+      return;
+    }
     savingSuccessful.value = true;
   } catch (e) {
     console.error("Fehler beim Speichern der CSV-Datei:", e);
@@ -98,6 +105,34 @@ function cancelEdit() {
 
 <template>
   <div class="w-full">
+    <div
+      v-if="isCopyMode"
+      class="mb-3"
+    >
+      <label
+        for="copy-filename"
+        class="block mb-1"
+      >
+        Neuer Dateiname
+      </label>
+      <div class="flex items-center gap-2">
+        <input
+          id="copy-filename"
+          v-model="newFilename"
+          type="text"
+          required
+          class="w-full border border-gray-200 rounded-sm px-3 py-2"
+        >
+        <span class="text-sm text-gray-400">{{ sourceExtension }}</span>
+      </div>
+      <p
+        v-if="filenameError"
+        class="text-sm mt-1"
+      >
+        {{ filenameError }}
+      </p>
+    </div>
+
     <div
       v-if="table"
       class="bg-white"
@@ -274,11 +309,11 @@ function cancelEdit() {
     <button
       type="button"
       class="button w-full mt-3 justify-center"
-      :disabled="!commitMessage.trim() || isSaving"
+      :disabled="!commitMessage.trim() || isSaving || !!filenameError"
       @click="saveCsv"
     >
       <span v-if="isSaving">Speichern...</span>
-      <span v-else>Speichern</span>
+      <span v-else>{{ isCopyMode ? "Neue Datei ver\xF6ffentlichen" : "Speichern" }}</span>
     </button>
     <Saved v-if="savingSuccessful" />
 

package/dist/runtime/app/components/content/editor/frontmatter/modal.vue

@@ -57,11 +57,11 @@ watch(yamlContent, (value) => {
       class="w-full max-w-220 bg-white rounded-[10px] border border-black/10 shadow-[0_10px_40px_rgba(0,0,0,0.28)] p-6 flex flex-col gap-3"
       role="dialog"
       aria-modal="true"
-      aria-label="Metadaten"
+      aria-label="Einstellungen"
     >
       <div class="flex items-center justify-between gap-2">
         <h2 class="font-bold text-2xl">
-          Metadaten
+          Einstellungen
         </h2>
         <div class="flex items-center gap-2">
           <button

package/dist/runtime/app/components/content/editor/markdown.vue

@@ -3,10 +3,12 @@ import { ref } from "vue";
 import { refDebounced } from "@vueuse/core";
 import Saved from "../saved.vue";
 import usePathParam from "../../../composables/usePathParam";
-import { useFetch } from "#imports";
+import useCopyMode from "../../../composables/useCopyMode";
+import { navigateTo, useFetch } from "#imports";
 import FrontmatterModal from "./frontmatter/modal.vue";
 import MonacoEditor from "./monacoEditor.vue";
 const { path } = usePathParam();
+const { isCopyMode, newFilename, sourceExtension, targetPath, targetEditPath, filenameError, confirmOverwriteIfNeeded } = useCopyMode(path);
 const { data: content } = await useFetch(`/api/admin/md?path=${path}`);
 const frontmatter = ref(content.value?.frontmatter ?? {});
 const markdown = ref(content.value?.markdown ?? "");
@@ -17,9 +19,10 @@ const savingSuccessful = ref(false);
 const showFrontmatterModal = ref(false);
 async function saveMarkdown() {
   if (!content.value) return;
+  if (isCopyMode.value && !await confirmOverwriteIfNeeded()) return;
   isSaving.value = true;
   savingSuccessful.value = false;
-  await useFetch(`/api/admin/md?path=${path}`, {
+  await useFetch(`/api/admin/md?path=${isCopyMode.value ? targetPath.value : path}`, {
     method: "POST",
     body: {
       frontmatter: frontmatter.value,
@@ -27,6 +30,10 @@ async function saveMarkdown() {
       commitMessage: commitMessage.value
     }
   });
+  if (isCopyMode.value) {
+    await navigateTo(targetEditPath.value, { replace: true });
+    return;
+  }
   isSaving.value = false;
   savingSuccessful.value = true;
 }
@@ -43,7 +50,21 @@ const mode = ref("preview");
       class="button secondary small mb-3 self-start"
       @click="showFrontmatterModal = true"
     >
-      Metadaten bearbeiten
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        fill="none"
+        viewBox="0 0 24 24"
+        stroke-width="1.5"
+        stroke="currentColor"
+        class="size-5 opacity-50"
+      >
+        <path
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          d="M11.42 15.17 17.25 21A2.652 2.652 0 0 0 21 17.25l-5.877-5.877M11.42 15.17l2.496-3.03c.317-.384.74-.626 1.208-.766M11.42 15.17l-4.655 5.653a2.548 2.548 0 1 1-3.586-3.586l6.837-5.63m5.108-.233c.55-.164 1.163-.188 1.743-.14a4.5 4.5 0 0 0 4.486-6.336l-3.276 3.277a3.004 3.004 0 0 1-2.25-2.25l3.276-3.276a4.5 4.5 0 0 0-6.336 4.486c.091 1.076-.071 2.264-.904 2.95l-.102.085m-1.745 1.437L5.909 7.5H4.5L2.25 3.75l1.5-1.5L7.5 4.5v1.409l4.26 4.26m-1.745 1.437 1.745-1.437m6.615 8.206L15.75 15.75M4.867 19.125h.008v.008h-.008v-.008Z"
+        />
+      </svg>
+      Einstellungen
     </button>
 
     <FrontmatterModal
@@ -99,6 +120,34 @@ const mode = ref("preview");
     </div>
 
     <div class="flex-none">
+      <div
+        v-if="isCopyMode"
+        class="mt-3"
+      >
+        <label
+          for="copy-filename"
+          class="block mb-1"
+        >
+          Neuer Dateiname
+        </label>
+        <div class="flex items-center gap-2">
+          <input
+            id="copy-filename"
+            v-model="newFilename"
+            type="text"
+            required
+            class="w-full border border-gray-200 rounded-sm px-3 py-2"
+          >
+          <span class="text-sm text-gray-400">{{ sourceExtension }}</span>
+        </div>
+        <p
+          v-if="filenameError"
+          class="text-sm mt-1"
+        >
+          {{ filenameError }}
+        </p>
+      </div>
+
       <div class="mt-3">
         <label
           for="commit-message"
@@ -118,11 +167,11 @@ const mode = ref("preview");
       <button
         type="button"
         class="button w-full justify-center mt-3"
-        :disabled="!commitMessage.trim() || isSaving"
+        :disabled="!commitMessage.trim() || isSaving || !!filenameError"
         @click="saveMarkdown"
       >
         <span v-if="isSaving">Speichern...</span>
-        <span v-else>Speichern</span>
+        <span v-else>{{ isCopyMode ? "Neue Datei ver\xF6ffentlichen" : "Speichern" }}</span>
       </button>
       <Saved v-if="savingSuccessful" />
     </div>

package/dist/runtime/app/components/content/editor/txt.vue

@@ -1,23 +1,30 @@
 <script setup>
 import Saved from "../saved.vue";
 import usePathParam from "../../../composables/usePathParam";
-import { ref, useFetch } from "#imports";
+import useCopyMode from "../../../composables/useCopyMode";
+import { navigateTo, ref, useFetch } from "#imports";
 const { path } = usePathParam();
+const { isCopyMode, newFilename, sourceExtension, targetPath, targetEditPath, filenameError, confirmOverwriteIfNeeded } = useCopyMode(path);
 const { data: content } = await useFetch(`/api/admin/txt?path=${path}`);
 const isSaving = ref(false);
 const savingSuccessful = ref(false);
 const commitMessage = ref("Inhaltliche \xC4nderungen");
 async function saveContent() {
   if (content.value === void 0) return;
+  if (isCopyMode.value && !await confirmOverwriteIfNeeded()) return;
   isSaving.value = true;
   savingSuccessful.value = false;
-  await useFetch(`/api/admin/txt?path=${path}`, {
+  await useFetch(`/api/admin/txt?path=${isCopyMode.value ? targetPath.value : path}`, {
     method: "POST",
     body: {
       text: content.value,
       commitMessage: commitMessage.value
     }
   });
+  if (isCopyMode.value) {
+    await navigateTo(targetEditPath.value, { replace: true });
+    return;
+  }
   isSaving.value = false;
   savingSuccessful.value = true;
 }
@@ -25,6 +32,34 @@ async function saveContent() {
 
 <template>
   <div>
+    <div
+      v-if="isCopyMode"
+      class="mb-3"
+    >
+      <label
+        for="copy-filename"
+        class="block mb-1"
+      >
+        Neuer Dateiname
+      </label>
+      <div class="flex items-center gap-2">
+        <input
+          id="copy-filename"
+          v-model="newFilename"
+          type="text"
+          required
+          class="w-full border border-gray-200 rounded-sm px-3 py-2"
+        >
+        <span class="text-sm text-gray-400">{{ sourceExtension }}</span>
+      </div>
+      <p
+        v-if="filenameError"
+        class="text-sm mt-1"
+      >
+        {{ filenameError }}
+      </p>
+    </div>
+
     <textarea
       v-model="content"
       class="w-full h-24 resize-y border border-gray-300 p-2 box-border font-mono"
@@ -50,11 +85,11 @@ async function saveContent() {
     <button
       type="button"
       class="button w-full justify-center mt-3"
-      :disabled="!commitMessage.trim() || isSaving"
+      :disabled="!commitMessage.trim() || isSaving || !!filenameError"
       @click="saveContent"
     >
       <span v-if="isSaving">Speichern...</span>
-      <span v-else>Speichern</span>
+      <span v-else>{{ isCopyMode ? "Neue Datei ver\xF6ffentlichen" : "Speichern" }}</span>
     </button>
     <Saved v-if="savingSuccessful" />
   </div>

package/dist/runtime/app/components/content/fileButtons.vue

@@ -1,15 +1,47 @@
 <script setup>
 import { useRuntimeConfig } from "#app";
 import { useClipboard } from "@vueuse/core";
+import { EDITABLE_EXTENSIONS, isMarkdownPath, toFileExtension } from "../../../shared/contentFiles";
 const { filePath } = defineProps({
   filePath: { type: String, required: true }
 });
 const { public: { mktcms: { siteUrl } } } = useRuntimeConfig();
 const { copy, copied } = useClipboard();
+function isCopyableTextFile(path) {
+  return EDITABLE_EXTENSIONS.includes(toFileExtension(path));
+}
+function copyEditRoute(path) {
+  const editorType = isMarkdownPath(path) ? "markdown" : "file";
+  return {
+    path: `/admin/edit/${editorType}/${path}`,
+    query: { copy: "1" }
+  };
+}
 </script>
 
 <template>
   <div class="flex gap-2">
+    <NuxtLink
+      v-if="isCopyableTextFile(filePath)"
+      :to="copyEditRoute(filePath)"
+      class="button secondary"
+      title="Neue Datei aus Vorlage"
+    >
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        fill="none"
+        viewBox="0 0 24 24"
+        stroke-width="1.5"
+        stroke="currentColor"
+        class="size-4"
+      >
+        <path
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          d="M15.75 17.25v3.375c0 .621-.504 1.125-1.125 1.125h-9.75a1.125 1.125 0 0 1-1.125-1.125V7.875c0-.621.504-1.125 1.125-1.125H6.75a9.06 9.06 0 0 1 1.5.124m7.5 10.376h3.375c.621 0 1.125-.504 1.125-1.125V11.25c0-4.46-3.243-8.161-7.5-8.876a9.06 9.06 0 0 0-1.5-.124H9.375c-.621 0-1.125.504-1.125 1.125v3.5m7.5 10.375H9.375a1.125 1.125 0 0 1-1.125-1.125v-9.25m12 6.625v-1.875a3.375 3.375 0 0 0-3.375-3.375h-1.5a1.125 1.125 0 0 1-1.125-1.125v-1.5a3.375 3.375 0 0 0-3.375-3.375H9.75"
+        />
+      </svg>
+    </NuxtLink>
     <NuxtLink
       class="button secondary"
       title="Link kopieren"

package/dist/runtime/app/components/content/index.vue

@@ -3,11 +3,9 @@ import { useFetch } from "#app";
 import TreeNode from "./treeNode.vue";
 import FileIcon from "./fileIcon.vue";
 import FileButtons from "./fileButtons.vue";
-import useImport from "../../composables/useImport";
-const { data: list, refresh } = await useFetch("/api/admin/list", {
+const { data: list } = await useFetch("/api/admin/list", {
   query: { path: "" }
 });
-const { fileInput, uploadFile } = useImport();
 function filenameWithoutExtension(filename) {
   return filename.replace(/\.[^/.]+$/, "");
 }
@@ -86,22 +84,12 @@ function fileExtension(filename) {
       class="flex flex-col gap-4"
     >
       <p>Keine Dateien oder Verzeichnisse gefunden.</p>
-      <button
+      <NuxtLink
+        to="/admin/new"
         class="button"
-        @click="fileInput?.click()"
-      >
-        Dateien importieren
-      </button>
-      <input
-        ref="fileInput"
-        type="file"
-        class="hidden"
-        accept=".zip"
-        @change="async (e) => {
-  await uploadFile(e);
-  await refresh();
-}"
       >
+        Datei hochladen
+      </NuxtLink>
     </div>
   </div>
 </template>

package/dist/runtime/app/components/content/upload.vue

@@ -1,11 +1,38 @@
 <script setup>
-import { onMounted, ref, useFetch, useRoute } from "#imports";
+import { onMounted, ref, useRoute } from "#imports";
 import useAdminUpload from "../../composables/useAdminUpload";
-const { data: list } = await useFetch("/api/admin/list");
+import { CONTENT_UPLOAD_EXTENSIONS, IMAGE_EXTENSIONS, PDF_EXTENSIONS, toAcceptAttribute } from "../../../shared/contentFiles";
 const route = useRoute();
 const dir = ref(route.query.dir || "");
+const dirs = ref([]);
 const newSubdir = ref("");
+const uploadAccept = toAcceptAttribute(CONTENT_UPLOAD_EXTENSIONS);
+const imageAccept = toAcceptAttribute(IMAGE_EXTENSIONS);
+const pdfAccept = toAcceptAttribute(PDF_EXTENSIONS);
 const { isUploading, fileInput, fileInputImg, fileInputPdf, path, uploadFiles } = useAdminUpload();
+const loadAllDirs = async () => {
+  const found = /* @__PURE__ */ new Set();
+  const queue = [""];
+  while (queue.length > 0) {
+    const currentPath = queue.shift();
+    if (currentPath === void 0) {
+      continue;
+    }
+    const list = await $fetch("/api/admin/list", {
+      query: currentPath ? { path: currentPath } : {}
+    });
+    for (const childDir of list.dirs) {
+      const fullPath = currentPath ? `${currentPath}:${childDir}` : childDir;
+      if (found.has(fullPath)) {
+        continue;
+      }
+      found.add(fullPath);
+      queue.push(fullPath);
+    }
+  }
+  dirs.value = [...found].sort((a, b) => a.localeCompare(b, "de"));
+};
+await loadAllDirs();
 onMounted(() => {
   path.value = dir.value;
 });
@@ -49,11 +76,11 @@ onMounted(() => {
             Hauptordner
           </option>
           <option
-            v-for="d in list?.dirs"
+            v-for="d in dirs"
             :key="d"
             :value="d"
           >
-            {{ d }}
+            {{ d.replace(/:/g, " / ") }}
           </option>
         </select>
       </div>
@@ -98,7 +125,7 @@ onMounted(() => {
       ref="fileInput"
       class="hidden"
       type="file"
-      accept=".pdf,.jpg,.jpeg,.png,.gif,.webp,.md,.docx,.txt,.csv,.json"
+      :accept="uploadAccept"
       @change="async (e) => {
   await uploadFiles(e);
 }"
@@ -107,7 +134,7 @@ onMounted(() => {
       ref="fileInputImg"
       class="hidden"
       type="file"
-      accept=".jpg,.jpeg,.png,.gif,.webp"
+      :accept="imageAccept"
       @change="async (e) => {
   await uploadFiles(e);
 }"
@@ -116,7 +143,7 @@ onMounted(() => {
       ref="fileInputPdf"
       class="hidden"
       type="file"
-      accept=".pdf"
+      :accept="pdfAccept"
       @change="async (e) => {
   await uploadFiles(e);
 }"

package/dist/runtime/app/composables/useCopyMode.d.ts

@@ -0,0 +1,9 @@
+export default function useCopyMode(sourcePath: string): {
+    isCopyMode: import("vue").ComputedRef<boolean>;
+    newFilename: import("vue").Ref<string, string>;
+    sourceExtension: string;
+    targetPath: import("vue").ComputedRef<string>;
+    targetEditPath: import("vue").ComputedRef<string>;
+    filenameError: import("vue").ComputedRef<"" | "Bitte einen Dateinamen eingeben." | "Der Dateiname enthält ungültige Zeichen." | "Bitte einen neuen Dateinamen eingeben.">;
+    confirmOverwriteIfNeeded: () => Promise<boolean>;
+};

package/dist/runtime/app/composables/useCopyMode.js

@@ -0,0 +1,77 @@
+import { computed, ref } from "vue";
+import { useRoute } from "#app";
+import { isMarkdownPath, toFileExtension } from "../../shared/contentFiles.js";
+function hasInvalidFilenameCharacters(filename) {
+  return /[:\\/]/.test(filename) || hasControlCharacters(filename);
+}
+function hasControlCharacters(value) {
+  for (const char of value) {
+    const code = char.charCodeAt(0);
+    if (code >= 0 && code <= 31 || code === 127) {
+      return true;
+    }
+  }
+  return false;
+}
+export default function useCopyMode(sourcePath) {
+  const route = useRoute();
+  const isCopyMode = computed(() => {
+    const value = route.query.copy;
+    if (Array.isArray(value)) {
+      return value.includes("1") || value.includes("true");
+    }
+    return value === "1" || value === "true";
+  });
+  const sourceParts = sourcePath.split(":").filter((part) => part.trim() !== "");
+  const sourceFilename = sourceParts.at(-1) || "";
+  const sourceBaseName = sourceFilename.replace(/\.[^/.]+$/, "");
+  const sourceExtension = toFileExtension(sourceFilename);
+  const targetDirectory = sourceParts.slice(0, -1).join(":");
+  const newFilename = ref(sourceBaseName);
+  const trimmedFilename = computed(() => newFilename.value.trim());
+  const targetFilename = computed(() => `${trimmedFilename.value}${sourceExtension}`);
+  const targetPath = computed(() => targetDirectory ? `${targetDirectory}:${targetFilename.value}` : targetFilename.value);
+  const targetEditPath = computed(() => {
+    const editorType = isMarkdownPath(targetPath.value) ? "markdown" : "file";
+    return `/admin/edit/${editorType}/${targetPath.value}`;
+  });
+  const filenameError = computed(() => {
+    if (!isCopyMode.value) return "";
+    if (!trimmedFilename.value) {
+      return "Bitte einen Dateinamen eingeben.";
+    }
+    if (hasInvalidFilenameCharacters(trimmedFilename.value)) {
+      return "Der Dateiname enth\xE4lt ung\xFCltige Zeichen.";
+    }
+    if (trimmedFilename.value === sourceBaseName) {
+      return "Bitte einen neuen Dateinamen eingeben.";
+    }
+    return "";
+  });
+  async function confirmOverwriteIfNeeded() {
+    if (!isCopyMode.value || filenameError.value) {
+      return false;
+    }
+    const response = await $fetch("/api/admin/list", {
+      query: {
+        path: targetDirectory
+      }
+    });
+    if (!response.files.includes(targetFilename.value)) {
+      return true;
+    }
+    if (import.meta.server) {
+      return false;
+    }
+    return window.confirm(`Die Datei "${targetFilename.value}" existiert bereits. M\xF6chtest du sie \xFCberschreiben?`);
+  }
+  return {
+    isCopyMode,
+    newFilename,
+    sourceExtension,
+    targetPath,
+    targetEditPath,
+    filenameError,
+    confirmOverwriteIfNeeded
+  };
+}

package/dist/runtime/app/composables/useFileType.js

@@ -1,10 +1,10 @@
+import { isCsvPath, isImagePath, isMarkdownPath, isPdfPath, isTextPath } from "../../shared/contentFiles.js";
 export default function useFileType(path) {
-  const normalizedPath = path.toLowerCase();
-  const isImage = normalizedPath.match(/\.(png|jpg|jpeg|gif|webp)$/) !== null;
-  const isPdf = normalizedPath.endsWith(".pdf");
-  const isMarkdown = normalizedPath.endsWith(".md");
-  const isCsv = normalizedPath.endsWith(".csv");
-  const isText = normalizedPath.match(/\.(txt|json)$/) !== null;
+  const isImage = isImagePath(path);
+  const isPdf = isPdfPath(path);
+  const isMarkdown = isMarkdownPath(path);
+  const isCsv = isCsvPath(path);
+  const isText = isTextPath(path);
   return {
     isImage,
     isPdf,