studiocms 0.1.0-beta.10

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,118 @@
+---
+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:
+	| 'sub-header-usernamepasswordoauth'
+	| 'sub-header-usernamepassword'
+	| 'sub-header-oauth'
+	| 'sub-header-noprovider';
+
+if (usernameAndPassword && SHOW_OAUTH) {
+	paragraph = 'sub-header-usernamepasswordoauth';
+} else if (usernameAndPassword && !SHOW_OAUTH) {
+	paragraph = 'sub-header-usernamepassword';
+} else if (!usernameAndPassword && SHOW_OAUTH) {
+	paragraph = 'sub-header-oauth';
+} else {
+	paragraph = 'sub-header-noprovider';
+}
+---
+<AuthLayout 
+    title={t('title')} 
+    description={t('description')} 
+    {lang}
+    checkLogin
+    >
+
+    <div slot="header" class="form-header">
+        <h1>
+            <t-login key="header">{t('header')}</t-login>
+        </h1>
+        <p>
+            <t-login key={paragraph}>{t(paragraph)}</t-login>
+        </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'>
+                <t-login key="login-button">{t('login-button')}</t-login>
+            </Button>
+        </form>
+    )}
+
+    { allowUserRegistration && (
+        <p slot="footer">
+            <t-login key="allow-registration-noaccount">
+                {t('allow-registration-noaccount')}
+            </t-login> 
+            <a href={StudioCMSRoutes.authLinks.signupURL}>
+                <t-login key="allow-registration-register">
+                    {t('allow-registration-register')}
+                </t-login>
+            </a>
+        </p>
+    )}
+
+</AuthLayout>
+
+<script>
+    import { 
+        $i18n,
+        $localeSettings,
+        baseTranslation,
+        defaultLang,
+        documentUpdater,
+        makeTranslation,
+        updateElmLabel,
+    } from 'studiocms:i18n/client';
+
+    const currentPage = '@studiocms/auth:login';
+
+    let lang = defaultLang;
+
+    const i18n = $i18n(currentPage, baseTranslation[currentPage]);
+
+    $localeSettings.subscribe((locale) => {
+        lang = locale || defaultLang;
+    });
+    
+    i18n.subscribe(comp => {
+        documentUpdater(comp, lang)
+        updateElmLabel('username', comp['username-label']);
+        updateElmLabel('password', comp['password-label']);
+    });
+
+    if (!customElements.get('t-login')) {
+        customElements.define('t-login', makeTranslation(currentPage, i18n));
+    }
+</script>
+
+<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,124 @@
+---
+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:
+	| 'sub-header-usernamepasswordoauth'
+	| 'sub-header-usernamepassword'
+	| 'sub-header-oauth'
+	| 'sub-header-noprovider';
+
+if (usernameAndPassword && SHOW_OAUTH) {
+	paragraph = 'sub-header-usernamepasswordoauth';
+} else if (usernameAndPassword && !SHOW_OAUTH) {
+	paragraph = 'sub-header-usernamepassword';
+} else if (!usernameAndPassword && SHOW_OAUTH) {
+	paragraph = 'sub-header-oauth';
+} else {
+	paragraph = 'sub-header-noprovider';
+}
+---
+<AuthLayout 
+    title={t('title')} 
+    description={t('description')} 
+    {lang} 
+    checkLogin
+    >
+    
+    <div slot="header" class="form-header">
+        <h1>
+            <t-signup key="header">{t('header')}</t-signup>
+        </h1>
+        <p>
+            <t-signup key={paragraph}>{t(paragraph)}</t-signup>
+        </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-signup key="create-account-button">{t('create-account-button')}</t-signup>
+            </Button>
+        </form>
+    )}
+
+    { allowUserRegistration && (
+        <p slot="footer">
+            <t-signup key="allow-login-haveaccount">
+                {t('allow-login-haveaccount')}
+            </t-signup> 
+            <a href={StudioCMSRoutes.authLinks.loginURL}>
+                <t-signup key="allow-login-login">
+                    {t('allow-login-login')}
+                </t-signup>
+            </a>
+        </p>
+    )}
+
+</AuthLayout>
+
+<script>
+    import { 
+        $i18n,
+        $localeSettings,
+        baseTranslation,
+        defaultLang,
+        documentUpdater,
+        makeTranslation,
+        updateElmLabel,
+    } from 'studiocms:i18n/client';
+
+    const currentPage = '@studiocms/auth:signup';
+
+    let lang = defaultLang;
+
+    const i18n = $i18n(currentPage, baseTranslation[currentPage]);
+
+    $localeSettings.subscribe((locale) => {
+        lang = locale || defaultLang;
+    });
+    
+    i18n.subscribe(comp => {
+        documentUpdater(comp, lang)
+        updateElmLabel('username', comp['username-label']);
+        updateElmLabel('email', comp['email-label']);
+        updateElmLabel('displayname', comp['displayname-label']);
+        updateElmLabel('password', comp['password-label']);
+        updateElmLabel('confirm-password', comp['confirm-password-label']);
+    });
+
+    if (!customElements.get('t-signup')) {
+        customElements.define('t-signup', makeTranslation(currentPage, i18n));
+    }
+</script>
+
+<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,61 @@
+---
+import { useTranslations } from 'studiocms:i18n';
+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';
+const t = useTranslations(lang, '@studiocms/dashboard:configuration');
+---
+
+<Layout 
+  title={t('title')}
+  description={t('description')}
+  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} />
+        <t-config key="save-button">{t('save-button')}</t-config>
+      </Button>
+    </PageHeader>
+  </div>
+  
+  <ConfigForm />
+
+</Layout>
+
+<script>
+    import { 
+        $i18n,
+        $localeSettings,
+        baseTranslation,
+        defaultLang,
+        documentUpdater,
+        makeTranslation,
+        pageHeaderUpdater,
+    } from 'studiocms:i18n/client';
+
+    const currentPage = '@studiocms/dashboard:configuration';
+
+    let lang = defaultLang;
+
+    const i18n = $i18n(currentPage, baseTranslation[currentPage]);
+
+    $localeSettings.subscribe((locale) => {
+        lang = locale || defaultLang;
+    });
+    
+    i18n.subscribe(comp => {
+      documentUpdater(comp, lang)
+      pageHeaderUpdater(comp.header)
+    });
+    
+    if (!customElements.get('t-config')) {
+        customElements.define('t-config', makeTranslation(currentPage, i18n));
+    }
+</script>

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

@@ -0,0 +1,83 @@
+---
+import { useTranslations } from 'studiocms:i18n';
+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';
+const t = useTranslations(lang, '@studiocms/dashboard:content-index');
+---
+
+<Layout 
+  title={t('title')}
+  description={t('description')}
+  requiredPermission='editor'
+  sidebar='double'
+  {lang}
+  >
+
+  <div slot="double-sidebar" class="inner-sidebar-container">
+    <div class="sidebar-links-container">
+      <InnerSidebarElement isNewFolder {lang} />
+    </div>
+  </div>
+
+  <div slot="header">
+    <PageHeader {lang} createFolder />
+  </div>
+
+  <CreateFolder {lang} />
+
+</Layout>
+
+<script>
+    import { 
+        $i18n,
+        $localeSettings,
+        baseTranslation,
+        defaultLang,
+        documentUpdater,
+    } from 'studiocms:i18n/client';
+  
+    let lang = defaultLang;
+
+    const currentPage = '@studiocms/dashboard:content-index';
+
+    $localeSettings.subscribe((locale) => {
+      lang = locale || defaultLang;
+    });
+
+    const i18n = $i18n(currentPage, baseTranslation[currentPage]);
+      
+    i18n.subscribe(comp => {
+      documentUpdater(comp, lang)
+    });
+</script>
+
+<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>