studiocms 0.1.0-beta.7 → 0.1.0-beta.8

package/dist/routes/auth/api/logout.js

@@ -0,0 +1,55 @@
+import {
+  deleteSessionTokenCookie,
+  invalidateSession,
+  sessionCookieName,
+  validateSessionToken
+} from "studiocms:auth/lib/session";
+import { StudioCMSRoutes } from "studiocms:lib";
+const GET = async (context) => {
+  return POST(context);
+};
+const POST = async (context) => {
+  const { cookies, redirect } = context;
+  const sessionToken = cookies.get(sessionCookieName)?.value ?? null;
+  if (!sessionToken) {
+    return redirect(StudioCMSRoutes.authLinks.loginURL);
+  }
+  const { session, user } = await validateSessionToken(sessionToken);
+  if (session === null) {
+    deleteSessionTokenCookie(context);
+    return redirect(StudioCMSRoutes.authLinks.loginURL);
+  }
+  if (!user || user === null) {
+    return redirect(StudioCMSRoutes.authLinks.loginURL);
+  }
+  await invalidateSession(user.id);
+  deleteSessionTokenCookie(context);
+  return redirect(StudioCMSRoutes.mainLinks.baseSiteURL);
+};
+const OPTIONS = async () => {
+  return new Response(null, {
+    status: 204,
+    statusText: "No Content",
+    headers: {
+      Allow: "OPTIONS, GET, POST",
+      "ALLOW-ACCESS-CONTROL-ORIGIN": "*",
+      "Cache-Control": "public, max-age=604800, immutable",
+      Date: (/* @__PURE__ */ new Date()).toUTCString()
+    }
+  });
+};
+const ALL = async () => {
+  return new Response(null, {
+    status: 405,
+    statusText: "Method Not Allowed",
+    headers: {
+      "ACCESS-CONTROL-ALLOW-ORIGIN": "*"
+    }
+  });
+};
+export {
+  ALL,
+  GET,
+  OPTIONS,
+  POST
+};

package/dist/routes/auth/api/register.d.ts

@@ -0,0 +1,4 @@
+import type { APIRoute } from 'astro';
+export declare const POST: APIRoute;
+export declare const OPTIONS: APIRoute;
+export declare const ALL: APIRoute;

package/dist/routes/auth/api/register.js

@@ -0,0 +1,64 @@
+import { verifyPasswordStrength } from "studiocms:auth/lib/password";
+import { createUserSession } from "studiocms:auth/lib/session";
+import { createLocalUser, verifyUsernameInput } from "studiocms:auth/lib/user";
+import studioCMS_SDK from "studiocms:sdk";
+import { z } from "astro/zod";
+import { badFormDataEntry, parseFormDataEntryToString } from "./shared.js";
+const POST = async (context) => {
+  const formData = await context.request.formData();
+  const username = parseFormDataEntryToString(formData, "username");
+  const password = parseFormDataEntryToString(formData, "password");
+  if (!username) return badFormDataEntry("Missing field", "Username is required");
+  if (!password) return badFormDataEntry("Missing field", "Password is required");
+  if (verifyUsernameInput(username) !== true) {
+    return badFormDataEntry(
+      "Invalid username",
+      "Username must be between 3 and 20 characters, only contain lowercase letters, numbers, -, and _ as well as not be a commonly used username (admin, root, etc.)"
+    );
+  }
+  if (await verifyPasswordStrength(password) !== true) {
+    return badFormDataEntry(
+      "Invalid password",
+      'Password must be between 6 and 255 characters, and not be in the <a href="https://haveibeenpwned.com/Passwords" target="_blank">pwned password database</a>.'
+    );
+  }
+  const email = parseFormDataEntryToString(formData, "email");
+  const name = parseFormDataEntryToString(formData, "displayname");
+  if (!email) return badFormDataEntry("Missing entry", "Email is required");
+  if (!name) return badFormDataEntry("Missing entry", "Display name is required");
+  const checkEmail = z.coerce.string().email({ message: "Email address is invalid" }).safeParse(email);
+  if (!checkEmail.success) return badFormDataEntry("Invalid email", checkEmail.error.message);
+  const { usernameSearch, emailSearch } = await studioCMS_SDK.AUTH.user.searchUsersForUsernameOrEmail(username, checkEmail.data);
+  if (usernameSearch.length > 0)
+    return badFormDataEntry("Invalid username", "Username is already in use");
+  if (emailSearch.length > 0) return badFormDataEntry("Invalid email", "Email is already in use");
+  const newUser = await createLocalUser(name, username, email, password);
+  await createUserSession(newUser.id, context);
+  return new Response();
+};
+const OPTIONS = async () => {
+  return new Response(null, {
+    status: 204,
+    statusText: "No Content",
+    headers: {
+      Allow: "OPTIONS, POST",
+      "ALLOW-ACCESS-CONTROL-ORIGIN": "*",
+      "Cache-Control": "public, max-age=604800, immutable",
+      Date: (/* @__PURE__ */ new Date()).toUTCString()
+    }
+  });
+};
+const ALL = async () => {
+  return new Response(null, {
+    status: 405,
+    statusText: "Method Not Allowed",
+    headers: {
+      "ACCESS-CONTROL-ALLOW-ORIGIN": "*"
+    }
+  });
+};
+export {
+  ALL,
+  OPTIONS,
+  POST
+};

package/dist/routes/auth/api/shared.d.ts

@@ -0,0 +1,2 @@
+export declare function parseFormDataEntryToString(formData: FormData, key: string): string | null;
+export declare const badFormDataEntry: (title: string, description: string) => Response;

package/dist/routes/auth/api/shared.js

@@ -0,0 +1,21 @@
+function parseFormDataEntryToString(formData, key) {
+  const value = formData.get(key);
+  if (typeof value !== "string") {
+    return null;
+  }
+  return value;
+}
+const badFormDataEntry = (title, description) => {
+  return new Response(JSON.stringify({ error: { title, description } }), {
+    status: 400,
+    statusText: "Bad Request",
+    headers: {
+      "Content-Type": "application/json",
+      "ACCESS-CONTROL-ALLOW-ORIGIN": "*"
+    }
+  });
+};
+export {
+  badFormDataEntry,
+  parseFormDataEntryToString
+};

package/dist/routes/auth/login.astro

@@ -0,0 +1,67 @@
+---
+import { authEnvCheck } from 'studiocms:auth/utils/authEnvCheck';
+import { AuthConfig } from 'studiocms:config';
+import { useTranslations } from 'studiocms:i18n';
+import { StudioCMSRoutes } from 'studiocms:lib';
+import { Button, Input } from 'studiocms:ui/components';
+import AuthLayout from '../../layouts/auth/AuthLayout.astro';
+
+const lang = 'en-us';
+const t = useTranslations(lang, '@studiocms/auth:login');
+
+const {
+	providers,
+	providers: {
+		usernameAndPassword,
+		usernameAndPasswordConfig: { allowUserRegistration },
+	},
+} = AuthConfig;
+
+const { SHOW_OAUTH } = await authEnvCheck(providers);
+
+let paragraph: string;
+
+if (usernameAndPassword && SHOW_OAUTH) {
+	paragraph = t('sub-header-usernamepasswordoauth');
+} else if (usernameAndPassword && !SHOW_OAUTH) {
+	paragraph = t('sub-header-usernamepassword');
+} else if (!usernameAndPassword && SHOW_OAUTH) {
+	paragraph = t('sub-header-oauth');
+} else {
+	paragraph = t('sub-header-noprovider');
+}
+---
+<AuthLayout 
+    title={t('title')} 
+    description={t('description')} 
+    {lang}
+    checkLogin
+    >
+
+    <div slot="header" class="form-header">
+        <h1>{t('header')}</h1>
+        <p>{paragraph}</p>
+    </div>
+
+    { usernameAndPassword && (
+        <form class="form" id="login-form" method="post" action={StudioCMSRoutes.authLinks.loginAPI}>
+
+            <Input label={t('username-label')} name="username" type="text" />
+            <Input label={t('password-label')} name="password" type='password' />
+
+            <Button fullWidth as="button" type="submit" color='primary' size='md' variant='solid'><span>{t('login-button')}</span></Button>
+        </form>
+    )}
+
+    { allowUserRegistration && (
+        <p slot="footer">{t('allow-registration-noaccount')} <a href={StudioCMSRoutes.authLinks.signupURL}>{t('allow-registration-register')}</a></p>
+    )}
+
+</AuthLayout>
+
+<script>
+    import { formListener } from '../../scripts/formListener.js';
+    const loginForm = document.getElementById('login-form') as HTMLFormElement;
+
+    loginForm.addEventListener('submit', (event) => formListener(event, loginForm, 'login'));
+</script>

package/dist/routes/auth/logout.astro

@@ -0,0 +1,28 @@
+---
+import { useTranslations } from 'studiocms:i18n';
+import { StudioCMSRoutes } from 'studiocms:lib';
+import AuthLayout from '../../layouts/auth/AuthLayout.astro';
+
+const lang = 'en-us';
+const t = useTranslations(lang, '@studiocms/auth:logout');
+---
+<AuthLayout 
+	title={t('title')} 
+	description={t('description')} 
+	{lang} 
+	disableScreen
+	>
+
+</AuthLayout>
+
+<div style="display: none;" id="redirect-to-logout" data-redirect={StudioCMSRoutes.authLinks.logoutAPI}></div>
+
+<script>
+
+	const redirectElement = document.getElementById('redirect-to-logout') as HTMLDivElement;
+	const redirect = redirectElement.getAttribute('data-redirect') as string;
+
+	setTimeout(() => {
+		window.location.href = redirect;
+	}, 500);
+</script>

package/dist/routes/auth/signup.astro

@@ -0,0 +1,70 @@
+---
+import { authEnvCheck } from 'studiocms:auth/utils/authEnvCheck';
+import { AuthConfig } from 'studiocms:config';
+import { useTranslations } from 'studiocms:i18n';
+import { StudioCMSRoutes } from 'studiocms:lib';
+import { Button, Input } from 'studiocms:ui/components';
+import AuthLayout from '../../layouts/auth/AuthLayout.astro';
+
+const lang = 'en-us';
+const t = useTranslations(lang, '@studiocms/auth:signup');
+
+const {
+	providers,
+	providers: {
+		usernameAndPassword,
+		usernameAndPasswordConfig: { allowUserRegistration },
+	},
+} = AuthConfig;
+
+const { SHOW_OAUTH } = await authEnvCheck(providers);
+
+let paragraph: string;
+
+if (usernameAndPassword && SHOW_OAUTH) {
+	paragraph = t('sub-header-usernamepasswordoauth');
+} else if (usernameAndPassword && !SHOW_OAUTH) {
+	paragraph = t('sub-header-usernamepassword');
+} else if (!usernameAndPassword && SHOW_OAUTH) {
+	paragraph = t('sub-header-oauth');
+} else {
+	paragraph = t('sub-header-noprovider');
+}
+---
+<AuthLayout 
+    title={t('title')} 
+    description={t('description')} 
+    {lang} 
+    checkLogin
+    >
+    
+    <div slot="header" class="form-header">
+        <h1>{t('header')}</h1>
+        <p>{paragraph}</p>
+    </div>
+
+    { usernameAndPassword && (
+        <form class="form" id="sign-up-form" method="post" action={StudioCMSRoutes.authLinks.registerAPI}>
+
+            <Input label={t('username-label')} name="username" type="text" />
+            <Input label={t('email-label')} name="email" type="email" />
+            <Input label={t('displayname-label')} name="displayname" type="text" />
+            <Input label={t('password-label')} name="password" type="password" />
+            <Input label={t('confirm-password-label')} name="confirm-password" type="password" />
+
+            <Button fullWidth type="submit" as="button" type="submit" color='primary' variant='solid'>{t('create-account-button')}</Button>
+        </form>
+    )}
+
+    { allowUserRegistration && (
+        <p slot="footer">{t('allow-login-haveaccount')} <a href={StudioCMSRoutes.authLinks.loginURL}>{t('allow-login-login')}</a></p>
+    )}
+
+</AuthLayout>
+
+<script>
+    import { formListener } from '../../scripts/formListener.js';
+    const signUpForm = document.getElementById('sign-up-form') as HTMLFormElement;
+
+    signUpForm.addEventListener('submit', async (event) => formListener(event, signUpForm, 'register'));
+</script>

package/dist/routes/dashboard/[...pluginPage].astro

@@ -0,0 +1,88 @@
+---
+import { getPluginDashboardPages } from 'studiocms:plugin-helpers';
+import PageHeader from '../../components/dashboard/PageHeader.astro';
+import Layout from '../../layouts/dashboard/Layout.astro';
+import type { FinalDashboardPage } from '../../schemas/index.js';
+
+const lang = 'en-us';
+
+// Get all the pages from the plugins
+const { adminPages, userPages } = getPluginDashboardPages();
+
+// Get the plugin page param from the URL
+const { pluginPage } = Astro.params;
+
+// Declare the page variable
+let page: FinalDashboardPage | undefined;
+
+// If the plugin page is not found, return a 404
+if (!pluginPage) {
+	return new Response(null, { status: 404 });
+}
+
+// Find the page from the admin and user pages
+page =
+	adminPages.find(({ slug }) => slug === pluginPage) ||
+	userPages.find(({ slug }) => slug === pluginPage);
+
+// If the page is not found, return a 404
+if (!page) {
+	return new Response(null, { status: 404 });
+}
+
+// Destructure the page object
+const {
+	sidebar,
+	components: { PageBodyComponent, PageActionsComponent, InnerSidebarComponent },
+	title,
+	description,
+	requiredPermissions,
+} = page;
+
+// Check if the sidebar is double and if the InnerSidebarComponent exists to determine the sidebar configuration
+const sidebarConfig = sidebar === 'double' && InnerSidebarComponent ? 'double' : 'single';
+---
+
+<Layout 
+  title={title[lang]}
+  description={description}
+  requiredPermission={requiredPermissions}
+  sidebar={sidebarConfig}
+  {lang}
+  >
+
+  { 
+    sidebarConfig === 'double' && 
+    /* This is a safety check due to types even though we are checking above */ 
+    InnerSidebarComponent && ( 
+      <div slot="double-sidebar" class="inner-sidebar-container">
+        <div class="sidebar-links-container">
+          <InnerSidebarComponent />
+        </div>
+      </div>
+    )}
+
+  <div slot="header">
+    <PageHeader title={title[lang]}>
+      {PageActionsComponent && ( 
+        <div slot="page-actions-container">
+          <PageActionsComponent />
+        </div>
+      )}
+    </PageHeader>
+  </div>
+
+  <PageBodyComponent />
+
+</Layout>
+
+<style>
+  .inner-sidebar-container {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    min-height: 100vh;
+    height: 100%;
+    padding: 1.5rem;
+  }
+</style>

package/dist/routes/dashboard/configuration.astro

@@ -0,0 +1,27 @@
+---
+import { Button, Icon } from 'studiocms:ui/components';
+import PageHeader from '../../components/dashboard/PageHeader.astro';
+import ConfigForm from '../../components/dashboard/islands/configuration/ConfigForm.astro';
+import Layout from '../../layouts/dashboard/Layout.astro';
+
+const lang = 'en-us';
+---
+
+<Layout 
+  title={"Configuration"}
+  requiredPermission='owner'
+  {lang}
+  >
+
+  <div slot="header">
+    <PageHeader title="Site Configuration">
+      <Button variant="solid" color="primary" size="sm" type="submit" form="site-config-form">
+        <Icon slot="start-content" name="check-20-solid" width={20} height={20} />
+        Save Changes
+      </Button>
+    </PageHeader>
+  </div>
+  
+  <ConfigForm />
+
+</Layout>

package/dist/routes/dashboard/content-management/createfolder.astro

@@ -0,0 +1,56 @@
+---
+import CreateFolder from '../../../components/dashboard/islands/content-mgmt/CreateFolder.astro';
+import InnerSidebarElement from '../../../components/dashboard/islands/content-mgmt/InnerSidebarElement.astro';
+import PageHeader from '../../../components/dashboard/islands/content-mgmt/PageHeader.astro';
+import Layout from '../../../layouts/dashboard/Layout.astro';
+
+const lang = 'en-us';
+---
+
+<Layout 
+  title="Content Management"
+  requiredPermission='editor'
+  sidebar='double'
+  {lang}
+  >
+
+  <div slot="double-sidebar" class="inner-sidebar-container">
+    <div class="sidebar-links-container">
+      <InnerSidebarElement isNewFolder />
+    </div>
+  </div>
+
+  <div slot="header">
+    <PageHeader createFolder title="Create new Folder"/>
+  </div>
+
+  <CreateFolder />
+
+</Layout>
+
+<style>
+  .inner-sidebar-container {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    min-height: 100vh;
+    height: 100%;
+    padding: 1.5rem;
+  }
+
+  .placeholder-info {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin-top: 40vh;
+    margin-left: auto;
+    margin-right: auto;
+    margin-bottom: 30vh;
+    z-index: -1;
+
+    p {
+      font-size: 1.25rem;
+      color: hsl(var(--text-muted));
+    }
+  }
+</style>

package/dist/routes/dashboard/content-management/createpage.astro

@@ -0,0 +1,59 @@
+---
+import TinyMDE from '../../../components/dashboard/component-scripts/TinyMDE.astro';
+import CreatePage from '../../../components/dashboard/islands/content-mgmt/CreatePage.astro';
+import InnerSidebarElement from '../../../components/dashboard/islands/content-mgmt/InnerSidebarElement.astro';
+import PageHeader from '../../../components/dashboard/islands/content-mgmt/PageHeader.astro';
+import Layout from '../../../layouts/dashboard/Layout.astro';
+
+const lang = 'en-us';
+---
+
+<Layout 
+  title="Content Management"
+  requiredPermission='editor'
+  sidebar='double'
+  {lang}
+  >
+
+  <div slot="double-sidebar" class="inner-sidebar-container">
+    <div class="sidebar-links-container">
+      <InnerSidebarElement isNewPage />
+    </div>
+  </div>
+
+  <div slot="header">
+    <PageHeader createPage title="Create new Page"/>
+  </div>
+
+  <CreatePage />
+
+  <TinyMDE />
+
+</Layout>
+
+<style>
+  .inner-sidebar-container {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    min-height: 100vh;
+    height: 100%;
+    padding: 1.5rem;
+  }
+
+  .placeholder-info {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin-top: 40vh;
+    margin-left: auto;
+    margin-right: auto;
+    margin-bottom: 30vh;
+    z-index: -1;
+
+    p {
+      font-size: 1.25rem;
+      color: hsl(var(--text-muted));
+    }
+  }
+</style>

package/dist/routes/dashboard/content-management/diff.astro

@@ -0,0 +1,100 @@
+---
+import { StudioCMSRoutes } from 'studiocms:lib';
+import studioCMS_SDK from 'studiocms:sdk';
+import studioCMS_SDK_Cache from 'studiocms:sdk/cache';
+import { Button } from 'studiocms:ui/components';
+import InnerSidebarElement from '../../../components/dashboard/islands/content-mgmt/InnerSidebarElement.astro';
+import PageHeader from '../../../components/dashboard/islands/content-mgmt/PageHeader.astro';
+import Layout from '../../../layouts/dashboard/Layout.astro';
+
+const lang = 'en-us';
+
+const urlParams = Astro.url.searchParams;
+const diffId = urlParams.get('diff');
+
+if (!diffId) {
+	return new Response(null, { status: 404 });
+}
+
+const diff = await studioCMS_SDK.diffTracking.get.withHtml(diffId);
+
+if (!diff) {
+	return new Response(null, { status: 404 });
+}
+
+const { data: page } = await studioCMS_SDK_Cache.GET.page.byId(diff.pageId);
+---
+
+<Layout 
+  title="Content Management"
+  requiredPermission='editor'
+  sidebar='double'
+  {lang}
+  >
+
+    <div slot="double-sidebar" class="inner-sidebar-container">
+        <div class="sidebar-links-container">
+        <InnerSidebarElement />
+        </div>
+    </div>
+
+    <div slot="header">
+        <PageHeader title=`Page Diff: ${page.title}` />
+        <span style="width: 100%; display: flex; padding: 1rem 0;">
+            <Button 
+            variant="outlined" 
+            color="primary" 
+            size="sm"
+            href={`${StudioCMSRoutes.mainLinks.contentManagementEdit}?edit=${page.id}`}
+            >View Page</Button>
+        </span>
+    </div>
+
+    <h4>
+        Page Metadata
+    </h4>
+
+    <div set:html={diff.metadataDiffHtml} class="diff-screen"></div>
+
+    <h4>
+        Page Content
+    </h4>
+
+    <div set:html={diff.contentDiffHtml} class="diff-screen"></div>
+
+</Layout>
+
+<style>
+  .inner-sidebar-container {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    min-height: 100vh;
+    height: 100%;
+    padding: 1.5rem;
+  }
+
+  h4 {
+    margin: 1rem auto;
+    padding-left: 2rem;
+  }
+
+  .diff-screen {
+    margin: 0 auto;
+    width: 100%;
+    max-width: 1100px;
+  }
+
+  @media screen and (max-width: 1500px) {
+    .diff-screen {
+        max-width: 800px;
+    }
+  }
+
+  @media screen and (max-width: 1380px) {
+    .diff-screen {
+        max-width: 600px;
+    }
+  }
+
+</style>