@xleddyl/nuxt-cms 0.8.1 → 0.9.0

package/dist/module.json

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

package/dist/module.mjs

@@ -9,7 +9,7 @@ import { minifyIntrospection, outputIntrospectionFile } from 'gql.tada/internal'
 import { createJiti } from 'jiti';
 import { typeName, blockTypeName as blockTypeName$1, blocksFieldTypeName, renderGraphqlSdl } from '../dist/runtime/shared/graphql-sdl.js';
 import { migrationsDirFor } from '../dist/runtime/shared/migrations-dir.js';
-import { entryFieldsFor, isPrivateField, blockTypeName, pageColumnFields, isTranslatableField, isTranslatableMediaField, isStringListField, pageAllFields, normalizeContentEntries, PAGE_PATH_FIELD, pageRoutes, isCollectionKind, isMultiSelect, layoutErrors, listErrors, mobileMediaKey, fieldConditions, selectOptionValues, CONTENT_SLUG_FIELD, pageFieldsTableName, pageMediaTableName, CONTENT_SYSTEM_FIELDS, isRequiredField, pageFields, mediaTypeFilter, DEFAULT_MEDIA_MAX_FILE_SIZE, normalizeCmsConfig } from '../dist/runtime/shared/index.js';
+import { entryFieldsFor, isPrivateField, blockTypeName, pageColumnFields, isTranslatableField, isTranslatableMediaField, isStringListField, pageAllFields, normalizeContentEntries, PAGE_PATH_FIELD, pageRoutes, isCollectionKind, isMultiSelect, layoutErrors, listErrors, mobileMediaKey, fieldConditions, selectOptionValues, pageFieldsTableName, pageMediaTableName, CONTENT_SYSTEM_FIELDS, isRequiredField, pageFields, mediaTypeFilter, DEFAULT_MEDIA_MAX_FILE_SIZE, normalizeCmsConfig } from '../dist/runtime/shared/index.js';
 import { previewPathErrors, DEFAULT_CMS_PREVIEW_PATH } from '../dist/runtime/shared/preview.js';
 import { scanMediaDirectory, readMediaFileMeta } from '../dist/runtime/server/utils/media-sync.js';
 import { createHash } from 'node:crypto';
@@ -233,6 +233,7 @@ const RESERVED_ENTRY_KEYS = [
   "admin",
   "auth",
   "login",
+  "logout",
   "media",
   "graphql",
   "settings",
@@ -482,8 +483,6 @@ function validateConfig(config, i18n) {
         if (!source) errors.push(`${fat}: slug source '${field.from}' is not a declared field`);
         else if (source.type !== "text")
           errors.push(`${fat}: slug source '${field.from}' must be a text field`);
-        else if (isTranslatableField(source) && !(entry.kind === "content" && key === CONTENT_SLUG_FIELD))
-          errors.push(`${fat}: slug source '${field.from}' cannot be translatable`);
       }
       if (field.type === "tags") {
         errors.push(...tagsOptionErrors(fat, field));
@@ -761,9 +760,8 @@ function columnExpr(key, field, dialect, table) {
       expr = `text('${col}').unique()`;
       break;
     case "relation": {
-      const onDelete = field.onDelete ?? (field.required ? "restrict" : "set null");
-      const target = field.to === table ? `(): ${anyColumnType(dialect)}` : "()";
-      expr = `text('${col}').references(${target} => ${field.to}.id, { onDelete: '${onDelete}' })`;
+      const onDelete = relationOnDelete(field);
+      expr = field.to === table ? `text('${col}')` : `text('${col}').references(() => ${field.to}.id, { onDelete: '${onDelete}' })`;
       if (field.cardinality === "one-to-one") expr += ".unique()";
       break;
     }
@@ -773,8 +771,8 @@ function columnExpr(key, field, dialect, table) {
   if (isRequiredField(field)) expr += ".notNull()";
   return `  ${key}: ${expr},`;
 }
-function anyColumnType(dialect) {
-  return dialect === "postgres" ? "AnyPgColumn" : "AnySQLiteColumn";
+function relationOnDelete(field) {
+  return field.onDelete ?? (field.required ? "restrict" : "set null");
 }
 function isSelfRelation(table, field) {
   return field.type === "relation" && !isManyToMany(field) && field.to === table;
@@ -792,6 +790,7 @@ function tableExpr(name, entry, dialect) {
   const pg = dialect === "postgres";
   const tableFn = pg ? "pgTable" : "sqliteTable";
   const lines = [];
+  const selfReferences = [];
   lines.push(`  id: text('id').primaryKey(),`);
   if (entry.kind === "page") lines.push(`  path: text('path').notNull().unique(),`);
   for (const [key, field] of Object.entries(
@@ -799,13 +798,22 @@ function tableExpr(name, entry, dialect) {
   )) {
     if (isManyToMany(field)) continue;
     lines.push(columnExpr(key, field, dialect, name));
+    if (isSelfRelation(name, field))
+      selfReferences.push(
+        `foreignKey({ columns: [table.${key}], foreignColumns: [table.id] }).onDelete('${relationOnDelete(
+          field
+        )}')`
+      );
   }
   if (entry.drafts) lines.push(`  status: text('status').notNull().default('draft'),`);
   if (isCollectionKind(entry)) lines.push(`  createdAt: ${nowExpr(pg, "created_at")},`);
   lines.push(`  updatedAt: ${nowExpr(pg, "updated_at")},`);
+  const extra = selfReferences.length ? `, table => [
+  ${selfReferences.join(",\n  ")},
+]` : "";
   return `export const ${name} = ${tableFn}('${name}', {
 ${lines.join("\n")}
-})`;
+}${extra})`;
 }
 function joinTableExpr(name, key, field, dialect) {
   const pg = dialect === "postgres";
@@ -888,18 +896,14 @@ function renderSchemaFile(config, dialect, resolveImport = (s) => s) {
     core.add("jsonb");
   if (pg) core.add("timestamp");
   if (fields.some(isManyToMany) || rowsEntries.length) core.add("primaryKey");
-  const hasSelfRelation = derived.some(
+  if (derived.some(
     ([name, entry]) => Object.values(entry.kind === "page" ? pageColumnFields(entry) : entry.fields).some(
       (field) => isSelfRelation(name, field)
     )
-  );
+  ))
+    core.add("foreignKey");
   const imports = [
     ...pg ? [] : [`import { sql } from '${resolveImport("drizzle-orm")}'`],
-    ...hasSelfRelation ? [
-      `import type { ${anyColumnType(dialect)} } from '${resolveImport(
-        `drizzle-orm/${pg ? "pg-core" : "sqlite-core"}`
-      )}'`
-    ] : [],
     `import { ${[...core].sort().join(", ")} } from '${resolveImport(
       `drizzle-orm/${pg ? "pg-core" : "sqlite-core"}`
     )}'`
@@ -1985,6 +1989,11 @@ const module$1 = defineNuxtModule({
           path: "/cms/login",
           file: resolver.resolve("./runtime/app/pages/admin-login.vue")
         },
+        {
+          name: "cms-admin-logout",
+          path: "/cms/logout",
+          file: resolver.resolve("./runtime/app/pages/admin-logout.vue")
+        },
         {
           name: "cms-admin-media",
           path: "/cms/media",

package/dist/runtime/app/layouts/cms-admin.vue

@@ -86,7 +86,7 @@ import {
   Root as KRoot,
   provideTheme
 } from "@xleddyl/443-components-vue";
-import { computed, navigateTo, ref, useRoute, useUserSession, watch } from "#imports";
+import { computed, navigateTo, ref, useRoute, watch } from "#imports";
 import cmsConfig from "#cms-config";
 import { cmsBrand } from "#cms-brand";
 import { CMS_SEARCH_MIN_LENGTH, normalizeSearchQuery } from "../../shared/search";
@@ -95,7 +95,6 @@ import { useCmsAccount } from "../composables/cms-account";
 import { loadCmsSettings } from "../composables/cms-settings";
 import { cmsIcon } from "../utils/ui";
 const route = useRoute();
-const { clear } = useUserSession();
 const { email, displayName } = useCmsAccount();
 const theme = useCmsTheme();
 provideTheme(theme);
@@ -219,8 +218,7 @@ function openSettings() {
 }
 async function logout() {
   settingsOpen.value = false;
-  await clear();
-  await navigateTo("/cms/login");
+  await navigateTo("/cms/logout");
 }
 </script>
 

package/dist/runtime/app/pages/admin-login.vue

@@ -1,52 +1,29 @@
 <template>
    <KRoot class="cms-scope cms-canvas" :theme="theme" preset="default">
-      <KAuthLayout
+      <KAuthLogin
+         :submit="login"
+         :submit-error="loginError"
          title="Welcome back"
          description="Sign in to manage your content."
          footer="Powered by nuxt-cms"
+         aside-title="Your content, next to your code."
+         aside-description="Edit entries, pages and media for this site in one place."
       >
          <template #brand>
-            <CmsBrandMark size="lg" hide-text class="cms-auth-brand" />
+            <CmsBrandMark size="lg" hide-text />
          </template>
-
-         <KForm :form="form">
-            <KFormField label="Email" name="email" required>
-               <KInput
-                  v-model="form.values.email"
-                  type="email"
-                  :icon="cmsIcon('envelope')"
-                  autocomplete="username"
-                  placeholder="you@example.com"
-               />
-            </KFormField>
-            <KFormField label="Password" name="password" required>
-               <KInput
-                  v-model="form.values.password"
-                  type="password"
-                  icon="key"
-                  autocomplete="current-password"
-                  placeholder="••••••••"
-               />
-            </KFormField>
-            <KButton type="submit" label="Sign in" trailing-icon="arrow-right" size="lg" block />
-         </KForm>
-      </KAuthLayout>
+      </KAuthLogin>
    </KRoot>
 </template>
 
 <script setup>
 import {
-  AuthLayout as KAuthLayout,
-  Button as KButton,
-  Form as KForm,
-  FormField as KFormField,
-  Input as KInput,
+  AuthLogin as KAuthLogin,
   Root as KRoot,
-  provideTheme,
-  useForm
+  provideTheme
 } from "@xleddyl/443-components-vue";
 import { definePageMeta, navigateTo, useUserSession } from "#imports";
-import { cmsIcon, errorMessage } from "../utils/ui";
+import { errorMessage } from "../utils/ui";
 import { useCmsTheme } from "../composables/cms-theme";
 definePageMeta({ layout: false });
 const theme = useCmsTheme();
@@ -55,25 +32,16 @@ const { loggedIn } = useUserSession();
 if (loggedIn.value) {
   await navigateTo("/cms", { replace: true });
 }
-const form = useForm({
-  schema: {
-    email: { initial: () => "" },
-    password: { initial: () => "" }
-  },
-  onSubmit: login
-});
-async function login(values) {
-  try {
-    await $fetch("/api/cms/auth/login", { method: "POST", body: values });
-    window.location.replace("/cms");
-  } catch (e) {
-    const status = e.statusCode;
-    form.setError(
-      "",
-      status === 401 ? "Invalid email or password." : errorMessage(e) ?? "Login failed. Please try again."
-    );
-  }
+async function login(credentials) {
+  await $fetch("/api/cms/auth/login", { method: "POST", body: credentials });
+  window.location.replace("/cms");
 }
+const loginError = (error) => {
+  const status = error.statusCode;
+  return {
+    message: status === 401 ? "Invalid email or password." : errorMessage(error) ?? "Login failed. Please try again."
+  };
+};
 </script>
 
 <style src="../../assets/admin.css">

package/dist/runtime/app/pages/admin-logout.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/app/pages/admin-logout.vue

@@ -0,0 +1,36 @@
+<template>
+   <KRoot class="cms-scope cms-canvas" :theme="theme" preset="default">
+      <KAuthLogout
+         :logout="clear"
+         :account="account"
+         login-to="/cms/login"
+         footer="Powered by nuxt-cms"
+         aside-title="Your content, next to your code."
+         aside-description="Edit entries, pages and media for this site in one place."
+      >
+         <template #brand>
+            <CmsBrandMark size="lg" hide-text />
+         </template>
+      </KAuthLogout>
+   </KRoot>
+</template>
+
+<script setup>
+import { AuthLogout as KAuthLogout, Root as KRoot, provideTheme } from "@xleddyl/443-components-vue";
+import { computed, definePageMeta, useUserSession } from "#imports";
+import { useCmsAccount } from "../composables/cms-account";
+import { useCmsTheme } from "../composables/cms-theme";
+definePageMeta({ layout: false, middleware: "cms-auth" });
+const theme = useCmsTheme();
+provideTheme(theme);
+const { clear } = useUserSession();
+const { user, email } = useCmsAccount();
+const account = computed(() => ({
+  email: email.value,
+  name: user.value?.name?.trim() || void 0
+}));
+</script>
+
+<style src="../../assets/admin.css">
+
+</style>

package/dist/runtime/app/pages/admin-logout.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/shared/preview.js

@@ -14,7 +14,7 @@ import {
 } from "./index.js";
 export const CMS_PREVIEW_CHANNEL = "nuxt-cms:preview";
 export const DEFAULT_CMS_PREVIEW_PATH = "/cms/preview";
-const RESERVED_ADMIN_SEGMENTS = /* @__PURE__ */ new Set(["login", "media"]);
+const RESERVED_ADMIN_SEGMENTS = /* @__PURE__ */ new Set(["login", "logout", "media"]);
 export function previewPathErrors(path, entryNames) {
   const match = /^\/cms\/([a-z0-9][a-z0-9-]*)$/.exec(path);
   if (!match)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xleddyl/nuxt-cms",
-  "version": "0.8.1",
+  "version": "0.9.0",
   "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)",
@@ -69,7 +69,7 @@
     "@tiptap/pm": "^3.32.0",
     "@tiptap/starter-kit": "^3.32.0",
     "@tiptap/vue-3": "^3.32.0",
-    "@xleddyl/443-components-vue": "^0.6.2",
+    "@xleddyl/443-components-vue": "^0.16.49",
     "aws4fetch": "^1.0.20",
     "drizzle-kit": "^0.31.0",
     "drizzle-orm": "^0.44.0",