@xleddyl/nuxt-cms 0.8.2 → 0.9.0

package/dist/module.json

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

package/dist/module.mjs

@@ -233,6 +233,7 @@ const RESERVED_ENTRY_KEYS = [
   "admin",
   "auth",
   "login",
+  "logout",
   "media",
   "graphql",
   "settings",
@@ -1988,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.2",
+  "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",