@xleddyl/nuxt-cms 0.1.21 → 0.1.23

package/README.md

@@ -4,7 +4,7 @@ nuxt-cms is a Nuxt module that leverages the Nitro server to ship a lightweight
 
 - **Zero extra infrastructure**: the CMS runs inside your app's Nitro server; you deploy one thing.
 - **Content types in code**: a `cms.config.ts` with `defineCmsConfig()` declares collections, single documents, relations, blocks and translatable fields; database schema, migrations and TypeScript types are generated from it.
-- **Admin panel at `/cms`**: entry editing with validation, drafts, media library (S3-compatible storage), single-admin auth from env credentials.
+- **Admin panel at `/cms`**: entry editing with validation, drafts, media library (S3-compatible storage, or a read-only local mode), single-admin auth from env credentials.
 - **Public GraphQL API**: read-only, typed end-to-end via gql.tada, with filtering, sorting and pagination.
 - **SQLite, Postgres or libSQL/Turso**: a local file database by default, one config line to switch (including remote SQLite over the network).
 
@@ -78,7 +78,7 @@ Full documentation lives in [`docs/`](docs/README.md):
 - [Schema](docs/schema.md) — `defineCmsConfig`, entries, field types, relations, blocks, i18n.
 - [Querying content](docs/querying.md) — GraphQL API, `useCms` / `$cmsQuery`, filters, sorting, pagination.
 - [Admin panel & security](docs/admin.md) — pages, authentication, sessions, admin REST API.
-- [Media](docs/media.md) — S3-compatible storage, upload flow, allowed file types.
+- [Media](docs/media.md) — S3-compatible storage or read-only local mode, upload flow, allowed file types.
 
 ## LLM guide
 

package/dist/module.d.mts

@@ -1,4 +1,5 @@
 import * as _nuxt_schema from '@nuxt/schema';
+import { MediaStorageMode } from '../dist/runtime/shared/index.js';
 
 type Dialect = 'sqlite' | 'postgres';
 type Driver = Dialect | 'libsql';
@@ -17,6 +18,7 @@ interface ModuleOptions {
         authToken?: string;
     };
     media: {
+        storage: MediaStorageMode;
         endpoint: string;
         region: string;
         bucket: string;

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@xleddyl/nuxt-cms",
   "configKey": "cms",
-  "version": "0.1.21",
+  "version": "0.1.23",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "unknown"

package/dist/module.mjs

@@ -3,7 +3,7 @@ import { existsSync } from 'node:fs';
 import { createRequire } from 'node:module';
 import { isAbsolute, resolve, relative, join, dirname } from 'node:path';
 import { fileURLToPath } from 'node:url';
-import { defineNuxtModule, createResolver, useLogger, addImports, resolvePath, addTemplate, addServerPlugin, addTypeTemplate, addVitePlugin, addLayout, addComponentsDir, addRouteMiddleware, extendPages, addServerHandler } from '@nuxt/kit';
+import { defineNuxtModule, createResolver, useLogger, addImports, resolvePath, addTemplate, addServerPlugin, addTypeTemplate, addVitePlugin, addComponentsDir, addRouteMiddleware, extendPages, addServerHandler } from '@nuxt/kit';
 import tailwindcss from '@tailwindcss/vite';
 import svgLoader from 'vite-svg-loader';
 import { introspectionFromSchema, buildSchema } from 'graphql';
@@ -437,6 +437,7 @@ const module$1 = defineNuxtModule({
       authToken: ""
     },
     media: {
+      storage: "s3",
       endpoint: "",
       region: "auto",
       bucket: "",
@@ -464,6 +465,7 @@ const module$1 = defineNuxtModule({
       ]);
       nuxt.options.runtimeConfig.public.cms = {
         mediaBaseUrl: options.media.publicBaseUrl,
+        mediaStorage: options.media.storage,
         i18n: options.i18n
       };
       logger.info(
@@ -643,6 +645,7 @@ const module$1 = defineNuxtModule({
         ...existingConfig.graphql ?? {}
       },
       media: {
+        storage: options.media.storage,
         endpoint: options.media.endpoint,
         region: options.media.region,
         bucket: options.media.bucket,
@@ -654,6 +657,7 @@ const module$1 = defineNuxtModule({
     };
     nuxt.options.runtimeConfig.public.cms = {
       mediaBaseUrl: options.media.publicBaseUrl,
+      mediaStorage: options.media.storage,
       i18n: options.i18n
     };
     addTypeTemplate(
@@ -682,7 +686,12 @@ const module$1 = defineNuxtModule({
     addVitePlugin(tailwindcss());
     addVitePlugin(svgLoader({ defaultImport: "url", svgoConfig: { plugins: ["prefixIds"] } }));
     nuxt.options.css.push(resolver.resolve("./runtime/assets/main.css"));
-    addLayout({ src: resolver.resolve("./runtime/app/layouts/cms-admin.vue"), write: true }, "cms-admin");
+    nuxt.hook("app:templates", (app) => {
+      app.layouts["cms-admin"] = {
+        name: "cms-admin",
+        file: resolver.resolve("./runtime/app/layouts/cms-admin.vue")
+      };
+    });
     addComponentsDir({ path: resolver.resolve("./runtime/app/components") });
     addRouteMiddleware({
       name: "cms-auth",

package/dist/runtime/app/components/cms/MediaGallery.vue

@@ -8,6 +8,7 @@
 
    <div v-else class="flex flex-col gap-5">
       <CmsMediaUpload
+         v-if="!readOnly"
          :multiple="!selectable"
          :dense="selectable"
          :media-type="mediaType"
@@ -89,6 +90,7 @@
                   class="absolute top-2 right-2 flex gap-1 opacity-0 transition-opacity group-hover:opacity-100 focus-within:opacity-100"
                >
                   <CmsButton
+                     v-if="!readOnly"
                      icon="pencil-square"
                      size="xs"
                      color="neutral"
@@ -107,6 +109,7 @@
                      @click="copy(item)"
                   />
                   <CmsButton
+                     v-if="!readOnly"
                      icon="trash"
                      size="xs"
                      color="error"
@@ -144,11 +147,12 @@
       <CmsEmptyState
          v-else
          icon="photo"
-         title="No media yet"
-         body="Files you upload will show up here."
+         :title="readOnly ? 'No media' : 'No media yet'"
+         :body="readOnly ? 'No media registered.' : 'Files you upload will show up here.'"
       />
 
       <CmsModal
+         v-if="!readOnly"
          :open="!!editing"
          :title="editing ? mediaFilename(editing.key) : ''"
          :ui="CMS_MODAL_UI"
@@ -184,6 +188,7 @@
 import { computed, onMounted, ref } from "#imports";
 import { MEDIA_TYPES, mediaFilename, mediaIconFor } from "#nuxt-cms";
 import { useCmsConfirm } from "../../composables/cms-confirm";
+import { useCmsRuntime } from "../../composables/cms-runtime";
 import { useCmsToast } from "../../composables/cms-toast";
 import { CMS_MODAL_UI, errorMessage } from "../../utils/ui";
 const filterLabels = {
@@ -199,6 +204,8 @@ const props = defineProps({
 });
 const emit = defineEmits(["select"]);
 const toast = useCmsToast();
+const runtime = useCmsRuntime();
+const readOnly = computed(() => runtime.mediaStorage === "local");
 const endpoint = "/api/cms/admin/media";
 const items = ref([]);
 const loading = ref(true);

package/dist/runtime/app/composables/cms-runtime.d.ts

@@ -1,5 +1,6 @@
-import type { CmsI18n } from '../../shared/index.js';
+import type { CmsI18n, MediaStorageMode } from '../../shared/index.js';
 export declare function useCmsRuntime(): {
     mediaBaseUrl: string;
+    mediaStorage: MediaStorageMode;
     i18n: CmsI18n;
 };

package/dist/runtime/server/api/media.post.js

@@ -3,7 +3,12 @@ import { z } from "zod";
 import { useDb } from "#cms-db";
 import { cms_media } from "#cms-tables";
 import { objectKeySchema } from "../../shared/validation.js";
-import { assertUploadContentType, toMediaItem, useMediaConfig } from "../utils/media.js";
+import {
+  assertMediaWritable,
+  assertUploadContentType,
+  toMediaItem,
+  useMediaConfig
+} from "../utils/media.js";
 import { requireAdmin } from "../utils/require-admin.js";
 const bodySchema = z.object({
   key: objectKeySchema,
@@ -16,7 +21,8 @@ const bodySchema = z.object({
 });
 export default defineEventHandler(async (event) => {
   await requireAdmin(event);
-  const { publicUrl } = useMediaConfig(event);
+  const { media, publicUrl } = useMediaConfig(event);
+  assertMediaWritable(media);
   const body = await readValidatedBody(event, bodySchema.parse);
   if (body.mime) assertUploadContentType(body.mime);
   const values = {

package/dist/runtime/server/api/media.put.js

@@ -3,7 +3,7 @@ import { createError, defineEventHandler, readValidatedBody } from "h3";
 import { z } from "zod";
 import { useDb } from "#cms-db";
 import { cms_media } from "#cms-tables";
-import { toMediaItem, useMediaConfig } from "../utils/media.js";
+import { assertMediaWritable, toMediaItem, useMediaConfig } from "../utils/media.js";
 import { requireAdmin } from "../utils/require-admin.js";
 const bodySchema = z.object({
   id: z.number().int().positive(),
@@ -12,7 +12,8 @@ const bodySchema = z.object({
 });
 export default defineEventHandler(async (event) => {
   await requireAdmin(event);
-  const { publicUrl } = useMediaConfig(event);
+  const { media, publicUrl } = useMediaConfig(event);
+  assertMediaWritable(media);
   const body = await readValidatedBody(event, bodySchema.parse);
   const updates = {};
   if (body.alt !== void 0) updates.alt = body.alt;

package/dist/runtime/server/utils/media.d.ts

@@ -1,7 +1,8 @@
 import type { H3Event } from 'h3';
 import { AwsClient } from 'aws4fetch';
-import type { MediaItem } from '../../shared/index.js';
+import type { MediaItem, MediaStorageMode } from '../../shared/index.js';
 interface MediaConfig {
+    storage: MediaStorageMode;
     endpoint: string;
     region: string;
     bucket: string;
@@ -11,6 +12,8 @@ interface MediaConfig {
 }
 export declare function assertUploadContentType(contentType: string): void;
 export declare function encodeKey(key: string): string;
+export declare function assertMediaConfigured(media: MediaConfig): void;
+export declare function assertMediaWritable(media: MediaConfig): void;
 export declare function useMediaConfig(event: H3Event): {
     media: MediaConfig;
     publicUrl: (key: string) => string | null;

package/dist/runtime/server/utils/media.js

@@ -32,21 +32,34 @@ export function assertUploadContentType(contentType) {
 export function encodeKey(key) {
   return key.split("/").map(encodeURIComponent).join("/");
 }
-export function useMediaConfig(event) {
-  const config = useRuntimeConfig(event);
-  const media = config.cms.media;
+export function assertMediaConfigured(media) {
+  if (media.storage !== "s3") return;
   if (!media.endpoint || !media.bucket || !media.accessKeyId || !media.secretAccessKey) {
     throw createError({
       statusCode: 501,
       statusMessage: "Media storage is not configured (cms.media in nuxt.config)"
     });
   }
+}
+export function assertMediaWritable(media) {
+  if (media.storage === "local") {
+    throw createError({
+      statusCode: 501,
+      statusMessage: "Media storage is local; the media library is read-only"
+    });
+  }
+}
+export function useMediaConfig(event) {
+  const config = useRuntimeConfig(event);
+  const media = config.cms.media;
+  assertMediaConfigured(media);
   const { mediaBaseUrl } = config.public.cms;
   const publicUrl = (key) => mediaPublicUrl(mediaBaseUrl, key);
   return { media, publicUrl };
 }
 export function useMediaStorage(event) {
   const { media, publicUrl } = useMediaConfig(event);
+  assertMediaWritable(media);
   const client = new AwsClient({
     accessKeyId: media.accessKeyId,
     secretAccessKey: media.secretAccessKey,

package/dist/runtime/shared/index.d.ts

@@ -6,6 +6,7 @@ export interface CmsI18n {
     locales: string[];
     defaultLocale: string;
 }
+export type MediaStorageMode = 's3' | 'local';
 export declare const MEDIA_TYPES: readonly ["image", "video", "file"];
 export type MediaType = (typeof MEDIA_TYPES)[number];
 export declare function mediaTypeForKey(key: string): MediaType;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xleddyl/nuxt-cms",
-  "version": "0.1.21",
+  "version": "0.1.23",
   "description": "Lightweight CMS that ships with your Nuxt app: runs on the Nitro server, content types defined in code, /cms admin panel, GraphQL API, SQLite or Postgres. No external CMS needed!",
   "license": "MIT",
   "author": "Edoardo Alberti (https://github.com/xleddyl)",